.elementor-354 .elementor-element.elementor-element-f669d53{--display:flex;--min-height:600px;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-354 .elementor-element.elementor-element-f669d53.e-con{--align-self:center;}.elementor-354 .elementor-element.elementor-element-1c9d797.elementor-element{--align-self:center;}@media(max-width:1366px){.elementor-354 .elementor-element.elementor-element-f669d53{--min-height:400px;--justify-content:center;}}@media(max-width:1024px){.elementor-354 .elementor-element.elementor-element-f669d53{--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}}@media(max-width:880px){.elementor-354 .elementor-element.elementor-element-f669d53{--justify-content:center;}}@media(min-width:768px){.elementor-354 .elementor-element.elementor-element-f669d53{--width:100%;}}@media(max-width:1366px) and (min-width:768px){.elementor-354 .elementor-element.elementor-element-f669d53{--width:90%;}}/* Start custom CSS for html, class: .elementor-element-1c9d797 */.gradient-wrap {
  position: relative;
  width:100%;
  height: 430px;
  border-radius: 30px;

  background:
    radial-gradient(
      520px 260px at 35% 42%,
      rgba(90, 160, 235, 0.22),
      transparent 58%
    ),
    radial-gradient(
      460px 240px at 68% 58%,
      rgba(20, 70, 160, 0.28),
      transparent 60%
    ),
    linear-gradient(
      135deg,
      #01030a,
      #020716,
      #041327,
      #01030a
    );

  background-size: 160% 160%;
  animation: slowDrift 34s ease-in-out infinite;
  overflow: hidden;
}

/* Content */
.content {
  position: relative;
  z-index: 5;
  max-width: 90%;
  padding-top: 0px;
  padding-bottom: 20px;
  margin: 0 auto;
  top: 50%;
  transform: translateY(-50%);
  text-align: left;
  color: #F5F0EA;
}

/* Text tweaks for darker bg */
.content h1 {
  font-size: clamp(2.4rem, 5vw, 3.8rem);
  font-weight: 500;
}

.content p {
    font-family: questrial;
  color:#F5F0EA;
  text-align:left;
  padding-top: 20px;
  padding-bottom: 20px;
}

/* Button – darker, subtler */
.btn {
  padding: 10px 24px;
  border-radius: 30px;
  font-size: 18px!important;
  border: 2px solid #F5F0EA;
  color: #F5F0EA;
}



/* Grain layers */
.noise-base {
  position: absolute;
  inset: -160%;
  background-image: url("https://grainy-gradients.vercel.app/noise.svg");
  opacity: 0.18;
  animation: grainFloat 1.6s steps(2) infinite;
}

.noise-heavy {
  position: absolute;
  inset: -220%;
  background-image: url("https://grainy-gradients.vercel.app/noise.svg");
  opacity: 0.26;
  mix-blend-mode: overlay;
  animation: grainJitter 0.5s steps(2) infinite;
}

/* Animations */
@keyframes slowDrift {
  0% { background-position: 0% 0%; }
  50% { background-position: 100% 100%; }
  100% { background-position: 0% 0%; }
}

@keyframes grainFloat {
  from { transform: translate(0, 0); }
  to   { transform: translate(110px, 90px); }
}

@keyframes grainJitter {
  0%   { transform: translate(0, 0); }
  25%  { transform: translate(-35px, 25px); }
  50%  { transform: translate(25px, -35px); }
  75%  { transform: translate(-18px, -18px); }
  100% { transform: translate(0, 0); }
}
.btn {
  display: inline-flex;
    padding: 10px 24px;
  border-radius: 30px;
  font-size: 18px!important;
  border: 2px solid #F5F0EA;
  color: #F5F0EA;
  align-items: center;
  
  color: #ffffff;
  text-decoration: none;
  font-size: 0.85rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;

  
}

.btn-icon {
  display: flex;
  align-items: center;
}

@media (max-width: 880px){
    .content {
  position: relative;
  z-index: 5;
  max-width: 100%;
  padding: 30px;
  margin: 0 auto;
  transform: translateY(-50%);
  text-align: left;
  color: #F5F0EA;
  height: 370px;
}
.gradient-wrap {
  position: relative;
  width:100%;
  border-radius: 30px;
height: 400px;
    
}


@media (max-width: 767px){
    .content {
  position: relative;
  z-index: 5;
  max-width: 100%;
padding-top: 0px;
  padding-bottom: 50px;
  margin: 0 auto;
  transform: translateY(-50%);
  text-align: left;
  color: #F5F0EA;
  height: 400px;
}
.content h1 {
  font-size:30px;
  font-weight: 500;
}
.gradient-wrap {
  position: relative;
  width:100%;
  border-radius: 30px;
  height:400px ;

}
@media (max-width: 600px){
    .content h1 {
  font-size:28px;
  font-weight: 500;
}
    .content {
  z-index: 5;
  max-width: 90%;
  padding: 20px;
  height: 440px;
}
.gradient-wrap {
  position: relative;
  width:100%;
  border-radius: 30px;
    height: 470px;
    align-items: center !important;
}
.btn {
    font-size: 15px !important;
}
}/* End custom CSS */