/* ==========================================================================
   Manjava — Landing Page
   Design tokens
   ========================================================================== */
:root{
  --navy-950:#060b1a;
  --navy-900:#0a1330;
  --navy-800:#121d45;
  --navy-700:#1c2a5e;

  --cyan-400:#22d3ee;
  --teal-400:#2dd4bf;

  --blue-600:#2563eb;
  --blue-50:#eef4ff;
  --green-600:#16a34a;
  --green-50:#edfbf3;
  --orange-600:#ea580c;
  --orange-50:#fff3ec;
  --purple-600:#7c3aed;
  --purple-50:#f4eefe;

  --bg:#f6f8fb;
  --white:#ffffff;
  --text-dark:#0b1330;
  --text-muted:#5b6472;
  --text-faint:#8890a0;
  --border:#e7ebf2;

  --font-display:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;

  --radius-lg:28px;
  --radius-md:20px;
  --radius-sm:14px;

  --shadow-card:0 1px 2px rgba(11,19,48,0.04),0 12px 32px -12px rgba(11,19,48,0.12);
  --shadow-float:0 20px 60px -20px rgba(6,11,26,0.55);
  --ease:cubic-bezier(.22,1,.36,1);
}

*{box-sizing:border-box;margin:0;padding:0;}

html{scroll-behavior:smooth;}

body{
  font-family:var(--font-body);
  color:var(--text-dark);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.5;
}

img,svg{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important;animation-iteration-count:1 !important;transition-duration:0.001ms !important;scroll-behavior:auto !important;}
}

:focus-visible{outline:2px solid var(--cyan-400);outline-offset:3px;border-radius:6px;}

.eyebrow{
  font-family:var(--font-display);
  font-weight:700;
  font-size:0.78rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--teal-400);
  margin-bottom:1rem;
}
.eyebrow-dark{color:var(--blue-600);}

h1,h2,h3{font-family:var(--font-display);font-weight:800;letter-spacing:-0.02em;color:var(--text-dark);}

/* ==========================================================================
   Buttons
   ========================================================================== */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0.5rem;
  padding:0.95rem 1.9rem;
  border-radius:999px;
  font-family:var(--font-display);
  font-weight:700;
  font-size:0.98rem;
  transition:transform 0.35s var(--ease), box-shadow 0.35s var(--ease), background 0.25s var(--ease);
  white-space:nowrap;
}
.btn:hover{transform:translateY(-2px);}

.btn-primary{
  background:linear-gradient(135deg,var(--cyan-400),var(--teal-400));
  color:var(--navy-950);
  box-shadow:0 14px 34px -10px rgba(34,211,238,0.55);
}
.btn-primary:hover{box-shadow:0 18px 40px -8px rgba(34,211,238,0.65);}

.btn-ghost{
  color:var(--white);
  padding:0.95rem 0.4rem;
}
.btn-ghost:hover{color:var(--teal-400);}

.btn-nav{
  background:var(--white);
  color:var(--navy-950);
  padding:0.7rem 1.4rem;
  font-size:0.9rem;
  box-shadow:0 4px 14px -4px rgba(6,11,26,0.18);
}

/* ==========================================================================
   Nav
   ========================================================================== */
.nav{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(6,11,26,0.72);
  backdrop-filter:blur(16px) saturate(160%);
  -webkit-backdrop-filter:blur(16px) saturate(160%);
  border-bottom:1px solid rgba(255,255,255,0.08);
}
.nav-inner{
  max-width:1180px;
  margin:0 auto;
  padding:0.9rem 1.75rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.logo{
  display:flex;
  align-items:center;
  gap:0.6rem;
  font-family:var(--font-display);
  font-weight:800;
  font-size:1.15rem;
  color:var(--white);
}
.logo-mark{
  width:32px;height:32px;
  flex-shrink:0;
}
.logo-mark-sm{width:26px;height:26px;}
.nav-links{display:flex;gap:2.1rem;}
.nav-links a{
  color:rgba(255,255,255,0.72);
  font-size:0.92rem;
  font-weight:500;
  transition:color 0.25s var(--ease);
}
.nav-links a:hover{color:var(--white);}

@media (max-width:820px){
  .nav-links{display:none;}
}

/* ==========================================================================
   Hero
   ========================================================================== */
.hero{
  position:relative;
  background:radial-gradient(120% 140% at 82% -10%, #0f2a4a 0%, var(--navy-900) 45%, var(--navy-950) 100%);
  overflow:hidden;
  padding-bottom:0;
}

.hero-glow{
  position:absolute;
  top:-220px;right:-160px;
  width:640px;height:640px;
  background:radial-gradient(circle, rgba(45,212,191,0.35) 0%, rgba(34,211,238,0.12) 45%, transparent 72%);
  filter:blur(10px);
  pointer-events:none;
}

.hero-grid{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px);
  background-size:52px 52px;
  mask-image:radial-gradient(ellipse 80% 60% at 60% 20%, black 30%, transparent 75%);
  pointer-events:none;
}

.hero-inner{
  position:relative;
  max-width:1180px;
  margin:0 auto;
  padding:5.2rem 1.75rem 5.5rem;
  display:grid;
  grid-template-columns:1.05fr 0.95fr;
  gap:3rem;
  align-items:center;
}

.hero-copy{max-width:560px;}

.hero h1{
  font-size:clamp(2.3rem, 4.4vw, 3.35rem);
  line-height:1.12;
  color:var(--white);
}
.grad-text{
  display:block;
  margin-top:0.3rem;
  background:linear-gradient(100deg,var(--cyan-400),var(--teal-400) 55%, #86efac 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.hero-desc{
  margin-top:1.4rem;
  font-size:1.05rem;
  line-height:1.7;
  color:rgba(255,255,255,0.68);
  max-width:520px;
}

.hero-actions{
  margin-top:2.2rem;
  display:flex;
  align-items:center;
  gap:0.6rem;
  flex-wrap:wrap;
}

/* ---- floating visual ---- */
.hero-visual{
  position:relative;
  height:440px;
}

.float-card{
  position:absolute;
  background:rgba(18,29,69,0.65);
  border:1px solid rgba(255,255,255,0.12);
  border-radius:var(--radius-md);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  box-shadow:var(--shadow-float);
  animation:float 7s ease-in-out infinite;
}

.card-dashboard{
  width:280px;
  top:8%;
  left:0;
  padding:1.2rem;
  animation-delay:0s;
}
.card-dot-row{display:flex;gap:6px;margin-bottom:1rem;}
.card-dot-row .dot{width:8px;height:8px;border-radius:50%;}
.dot-red{background:#ff6363;}
.dot-yellow{background:#ffc247;}
.dot-green{background:#2dd4bf;}

.mini-chart{
  display:flex;
  align-items:flex-end;
  gap:8px;
  height:70px;
  margin-bottom:1rem;
}
.mini-chart span{
  flex:1;
  border-radius:6px 6px 2px 2px;
  background:linear-gradient(180deg,var(--cyan-400),rgba(34,211,238,0.15));
}
.mini-ring{
  width:44px;height:44px;
  border-radius:50%;
  border:6px solid rgba(255,255,255,0.12);
  border-top-color:var(--teal-400);
  border-right-color:var(--teal-400);
}

.card-chat{
  width:230px;
  top:46%;
  right:0;
  padding:1.1rem;
  display:flex;
  gap:0.8rem;
  align-items:flex-start;
  animation-delay:1.3s;
}
.chat-avatar{
  width:36px;height:36px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--green-600),var(--teal-400));
  display:flex;align-items:center;justify-content:center;
  color:var(--navy-950);
  flex-shrink:0;
}
.chat-avatar svg{width:20px;height:20px;}
.chat-lines{flex:1;padding-top:0.35rem;}
.chat-line{
  display:block;
  height:9px;
  border-radius:6px;
  background:rgba(255,255,255,0.18);
  margin-bottom:0.55rem;
}
.w80{width:80%;}
.w55{width:55%;}

.card-success{
  width:250px;
  bottom:4%;
  left:8%;
  padding:1.1rem 1.3rem;
  display:flex;
  align-items:center;
  gap:0.9rem;
  animation-delay:2.6s;
}
.success-icon{
  width:38px;height:38px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--teal-400),var(--green-600));
  display:flex;align-items:center;justify-content:center;
  color:var(--navy-950);
  flex-shrink:0;
}
.success-icon svg{width:20px;height:20px;}
.success-title{font-family:var(--font-display);font-weight:700;font-size:0.92rem;color:var(--white);}
.success-sub{font-size:0.78rem;color:rgba(255,255,255,0.55);margin-top:0.15rem;}

@keyframes float{
  0%,100%{transform:translateY(0px);}
  50%{transform:translateY(-14px);}
}

@media (max-width:980px){
  .hero-inner{grid-template-columns:1fr;padding-top:3.6rem;}
  .hero-visual{height:340px;margin-top:1.5rem;}
  .card-dashboard{width:230px;}
  .card-chat{width:200px;}
  .card-success{width:220px;}
}

/* ---- benefit strip ---- */
.benefit-strip{
  position:relative;
  max-width:1180px;
  margin:0 auto;
  padding:0 1.75rem 4.6rem;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1rem;
}
.benefit-item{
  display:flex;
  align-items:flex-start;
  gap:0.85rem;
  padding:1.3rem 1.1rem;
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.09);
  border-radius:var(--radius-sm);
}
.benefit-item svg{
  width:22px;height:22px;
  color:var(--teal-400);
  flex-shrink:0;
  margin-top:2px;
}
.benefit-title{font-family:var(--font-display);font-weight:700;font-size:0.92rem;color:var(--white);}
.benefit-sub{font-size:0.8rem;color:rgba(255,255,255,0.55);margin-top:0.15rem;}

@media (max-width:900px){
  .benefit-strip{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:560px){
  .benefit-strip{grid-template-columns:1fr;}
}

/* ==========================================================================
   Services
   ========================================================================== */
.services{
  max-width:1180px;
  margin:0 auto;
  padding:6.5rem 1.75rem;
}
.section-head{
  max-width:640px;
  margin:0 auto 3.6rem;
  text-align:center;
}
.section-head h2{font-size:clamp(1.8rem,3vw,2.4rem);}
.section-sub{margin-top:1rem;color:var(--text-muted);font-size:1.02rem;line-height:1.65;}

.service-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1.4rem;
}

.service-card{
  background:var(--white);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  padding:2rem 1.7rem 1.8rem;
  box-shadow:var(--shadow-card);
  transition:transform 0.35s var(--ease), box-shadow 0.35s var(--ease);
  display:flex;
  flex-direction:column;
}
.service-card:hover{transform:translateY(-6px);box-shadow:0 24px 48px -20px rgba(11,19,48,0.22);}

.service-icon{
  width:52px;height:52px;
  border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:1.3rem;
}
.service-icon svg{width:26px;height:26px;}

.service-blue .service-icon{background:var(--blue-50);color:var(--blue-600);}
.service-green .service-icon{background:var(--green-50);color:var(--green-600);}
.service-orange .service-icon{background:var(--orange-50);color:var(--orange-600);}
.service-purple .service-icon{background:var(--purple-50);color:var(--purple-600);}

.service-card h3{font-size:1.12rem;line-height:1.35;margin-bottom:1.1rem;}

.service-list{margin-bottom:1.6rem;flex:1;}
.service-list li{
  position:relative;
  padding-left:1.3rem;
  font-size:0.9rem;
  color:var(--text-muted);
  margin-bottom:0.55rem;
}
.service-list li::before{
  content:"";
  position:absolute;
  left:0;top:0.5em;
  width:6px;height:6px;
  border-radius:50%;
}
.service-blue .service-list li::before{background:var(--blue-600);}
.service-green .service-list li::before{background:var(--green-600);}
.service-orange .service-list li::before{background:var(--orange-600);}
.service-purple .service-list li::before{background:var(--purple-600);}

.service-tag{
  font-family:var(--font-display);
  font-weight:700;
  font-size:0.84rem;
  padding:0.85rem 1rem;
  border-radius:12px;
  line-height:1.35;
}
.service-blue .service-tag{background:var(--blue-50);color:var(--blue-600);}
.service-green .service-tag{background:var(--green-50);color:var(--green-600);}
.service-orange .service-tag{background:var(--orange-50);color:var(--orange-600);}
.service-purple .service-tag{background:var(--purple-50);color:var(--purple-600);}

@media (max-width:980px){
  .service-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:600px){
  .service-grid{grid-template-columns:1fr;}
}

/* ==========================================================================
   Scroll reveal
   ========================================================================== */
.reveal{
  opacity:0;
  transform:translateY(28px);
  transition:opacity 0.8s var(--ease), transform 0.8s var(--ease);
}
.reveal.is-visible{opacity:1;transform:translateY(0);}
.service-grid .reveal:nth-child(2){transition-delay:0.08s;}
.service-grid .reveal:nth-child(3){transition-delay:0.16s;}
.service-grid .reveal:nth-child(4){transition-delay:0.24s;}

/* ==========================================================================
   Video demo
   ========================================================================== */
.video-section{
  position:relative;
  background:linear-gradient(160deg, var(--navy-950) 0%, var(--navy-900) 60%, #0a2440 100%);
  overflow:hidden;
  padding:6rem 1.75rem;
}
.video-section .hero-grid{
  mask-image:radial-gradient(ellipse 70% 60% at 30% 40%, black 20%, transparent 75%);
}
.video-inner{
  position:relative;
  max-width:1180px;
  margin:0 auto;
  display:grid;
  grid-template-columns:0.85fr 1.15fr;
  gap:3.2rem;
  align-items:center;
}
.video-copy h2{color:var(--white);font-size:clamp(1.7rem,2.8vw,2.25rem);margin-bottom:0.2rem;}
.video-sub{color:rgba(255,255,255,0.65);margin-top:1rem;text-align:left;max-width:460px;}
.video-points{margin-top:1.6rem;display:flex;flex-direction:column;gap:0.7rem;}
.video-points li{
  position:relative;
  padding-left:1.5rem;
  font-size:0.92rem;
  color:rgba(255,255,255,0.78);
}
.video-points li::before{
  content:"";
  position:absolute;left:0;top:0.5em;
  width:7px;height:7px;border-radius:50%;
  background:var(--teal-400);
}

.video-player{
  position:relative;
  border-radius:var(--radius-lg);
  overflow:hidden;
  border:1px solid rgba(255,255,255,0.12);
  box-shadow:var(--shadow-float);
  background:var(--navy-800);
}
.video-poster{
  position:relative;
  aspect-ratio:16/9;
  display:flex;
  align-items:center;
  justify-content:center;
  background:
    radial-gradient(120% 140% at 20% 10%, rgba(45,212,191,0.25), transparent 55%),
    radial-gradient(120% 140% at 85% 90%, rgba(37,99,235,0.28), transparent 55%),
    linear-gradient(135deg, var(--navy-800), var(--navy-950));
  overflow:hidden;
}

.video-wave{
  position:absolute;
  display:flex;
  align-items:center;
  gap:6px;
  opacity:0.5;
}
.video-wave span{
  width:5px;
  height:26px;
  border-radius:4px;
  background:linear-gradient(180deg,var(--cyan-400),var(--teal-400));
  animation:wave 1.6s ease-in-out infinite;
}
.video-wave span:nth-child(1){animation-delay:0s;height:18px;}
.video-wave span:nth-child(2){animation-delay:0.1s;height:34px;}
.video-wave span:nth-child(3){animation-delay:0.2s;height:14px;}
.video-wave span:nth-child(4){animation-delay:0.3s;height:42px;}
.video-wave span:nth-child(5){animation-delay:0.4s;height:20px;}
.video-wave span:nth-child(6){animation-delay:0.5s;height:32px;}
.video-wave span:nth-child(7){animation-delay:0.6s;height:16px;}
@keyframes wave{
  0%,100%{transform:scaleY(0.6);}
  50%{transform:scaleY(1.3);}
}
.video-player:not(.is-playing) .video-wave{animation-play-state:paused;}
.video-player:not(.is-playing) .video-wave span{animation-play-state:paused;}

.play-btn{
  position:relative;
  z-index:2;
  width:72px;height:72px;
  border-radius:50%;
  background:rgba(255,255,255,0.14);
  border:1px solid rgba(255,255,255,0.35);
  backdrop-filter:blur(6px);
  color:var(--white);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  transition:transform 0.3s var(--ease), background 0.3s var(--ease);
}
.play-btn:hover{transform:scale(1.07);background:rgba(255,255,255,0.22);}
.play-btn::before{
  content:"";
  position:absolute;inset:-10px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,0.25);
  animation:pulse-ring 2.4s ease-out infinite;
}
@keyframes pulse-ring{
  0%{transform:scale(0.85);opacity:0.8;}
  100%{transform:scale(1.35);opacity:0;}
}
.icon-play,.icon-pause{width:26px;height:26px;}
.icon-pause{display:none;}
.video-player.is-playing .icon-play{display:none;}
.video-player.is-playing .icon-pause{display:block;}
.video-player.is-playing .play-btn::before{animation:none;opacity:0;}

.video-meta{
  display:flex;
  align-items:center;
  gap:0.9rem;
  padding:1rem 1.3rem;
  background:rgba(255,255,255,0.03);
  border-top:1px solid rgba(255,255,255,0.08);
}
.video-title{font-size:0.85rem;font-weight:600;color:rgba(255,255,255,0.85);flex-shrink:0;}
.video-progress{
  flex:1;
  height:4px;
  border-radius:4px;
  background:rgba(255,255,255,0.12);
  overflow:hidden;
}
.video-progress span{
  display:block;
  height:100%;
  width:0%;
  background:linear-gradient(90deg,var(--cyan-400),var(--teal-400));
  transition:width 0.15s linear;
}
.video-duration{font-size:0.78rem;color:rgba(255,255,255,0.45);flex-shrink:0;}

@media (max-width:940px){
  .video-inner{grid-template-columns:1fr;}
  .video-sub{max-width:none;}
}

/* ==========================================================================
   Testimonial slider
   ========================================================================== */
.testimonials{
  max-width:1180px;
  margin:0 auto;
  padding:6rem 1.75rem 6.5rem;
}
.slider{
  position:relative;
  max-width:760px;
  margin:0 auto;
}
.slider-viewport{
  overflow:hidden;
  border-radius:var(--radius-lg);
}
.slider-track{
  display:flex;
  width:100%;
  transition:transform 0.6s var(--ease);
}
.testi-slide{
  flex:0 0 100%;
  width:100%;
  min-width:0;
  background:var(--white);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:2.6rem 2.6rem 2.2rem;
  box-shadow:var(--shadow-card);
  text-align:center;
  box-sizing:border-box;
}
.testi-slide blockquote{
  font-family:var(--font-display);
  font-weight:600;
  font-size:1.15rem;
  line-height:1.55;
  color:var(--text-dark);
  max-width:560px;
  margin:0 auto 1.8rem;
}
.testi-slide figcaption{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0.8rem;
}
.testi-avatar{
  width:40px;height:40px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-weight:700;font-size:0.82rem;
  background:linear-gradient(135deg,var(--blue-600),var(--teal-400));
  color:var(--white);
}
.testi-info{font-size:0.88rem;color:var(--text-muted);text-align:left;}
.testi-info strong{display:block;color:var(--text-dark);font-size:0.92rem;}

.slider-controls{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:1.4rem;
  margin-top:1.8rem;
}
.slider-arrow{
  width:38px;height:38px;
  border-radius:50%;
  background:var(--white);
  border:1px solid var(--border);
  color:var(--text-dark);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  transition:background 0.25s var(--ease), transform 0.25s var(--ease);
}
.slider-arrow:hover{background:var(--blue-50);color:var(--blue-600);transform:translateY(-2px);}
.slider-arrow svg{width:18px;height:18px;}

.slider-dots{display:flex;gap:0.5rem;}
.slider-dot{
  width:8px;height:8px;
  border-radius:50%;
  background:var(--border);
  border:none;
  cursor:pointer;
  transition:background 0.25s var(--ease), transform 0.25s var(--ease);
}
.slider-dot.is-active{background:var(--blue-600);transform:scale(1.3);}

@media (max-width:600px){
  .testi-slide{padding:2rem 1.5rem;}
  .testi-slide blockquote{font-size:1.02rem;}
}

/* ==========================================================================
   Stats
   ========================================================================== */
.stats{
  background:linear-gradient(120deg,var(--navy-950),var(--navy-800));
}
.stats-inner{
  max-width:1180px;
  margin:0 auto;
  padding:3.4rem 1.75rem;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  align-items:center;
  text-align:center;
}
.stat-item{display:flex;flex-direction:column;gap:0.35rem;padding:0 0.5rem;}
.stat-num{
  font-family:var(--font-display);
  font-weight:800;
  font-size:2.1rem;
  background:linear-gradient(100deg,var(--cyan-400),var(--teal-400));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.stat-label{font-size:0.86rem;color:rgba(255,255,255,0.6);}
.stat-divider{width:1px;height:44px;background:rgba(255,255,255,0.12);justify-self:center;}

@media (max-width:820px){
  .stats-inner{grid-template-columns:repeat(2,1fr);row-gap:2rem;}
  .stat-divider{display:none;}
}

/* ==========================================================================
   Trust
   ========================================================================== */
.trust{
  max-width:1180px;
  margin:0 auto;
  padding:4.4rem 1.75rem;
  text-align:center;
}
.trust-label{
  font-family:var(--font-display);
  font-weight:700;
  font-size:0.8rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--text-faint);
  margin-bottom:2rem;
}
.trust-row{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:2.6rem;
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.05rem;
  color:#c3c9d6;
}

/* ==========================================================================
   CTA
   ========================================================================== */
.cta{
  max-width:1180px;
  margin:0 auto;
  padding:0 1.75rem 6.5rem;
}
.cta-card{
  position:relative;
  overflow:hidden;
  background:linear-gradient(120deg,var(--navy-950) 0%, var(--navy-800) 55%, #0e5c52 100%);
  border-radius:var(--radius-lg);
  padding:3.6rem;
  display:grid;
  grid-template-columns:1.2fr 0.8fr;
  gap:2.5rem;
  align-items:center;
}
.cta-card::after{
  content:"";
  position:absolute;
  top:-140px;left:-100px;
  width:420px;height:420px;
  background:radial-gradient(circle, rgba(34,211,238,0.22), transparent 70%);
  pointer-events:none;
}
.cta-left h2{color:var(--white);font-size:clamp(1.7rem,2.6vw,2.15rem);}
.cta-left p{color:rgba(255,255,255,0.68);margin-top:0.9rem;max-width:420px;line-height:1.6;}

.cta-perks{
  margin-top:1.6rem;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0.7rem 1.2rem;
}
.cta-perks li{
  position:relative;
  padding-left:1.4rem;
  font-size:0.88rem;
  color:rgba(255,255,255,0.8);
  font-weight:500;
}
.cta-perks li::before{
  content:"";
  position:absolute;left:0;top:0.45em;
  width:7px;height:7px;border-radius:50%;
  background:var(--teal-400);
}

.cta-right{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:0.9rem;
}

.whatsapp-box{
  display:flex;
  align-items:center;
  gap:1rem;
  background:linear-gradient(135deg,#1fbf6e,#17a05b);
  padding:1.15rem 1.4rem;
  border-radius:18px;
  box-shadow:0 16px 36px -12px rgba(23,160,91,0.55);
  transition:transform 0.3s var(--ease);
}
.whatsapp-box:hover{transform:translateY(-3px);}
.wa-icon{width:32px;height:32px;color:#fff;flex-shrink:0;}
.wa-text{display:flex;flex-direction:column;gap:0.15rem;}
.wa-label{color:rgba(255,255,255,0.85);font-size:0.82rem;font-weight:600;}
.wa-number{font-family:var(--font-display);font-weight:800;font-size:1.25rem;color:#fff;}

.cta-note{
  text-align:center;
  font-size:0.82rem;
  color:rgba(255,255,255,0.5);
}

@media (max-width:900px){
  .cta-card{grid-template-columns:1fr;padding:2.4rem;}
  .cta-perks{grid-template-columns:1fr 1fr;}
}

/* ==========================================================================
   Footer
   ========================================================================== */
.footer{
  background:var(--navy-950);
  border-top:1px solid rgba(255,255,255,0.08);
}
.footer-inner{
  max-width:1180px;
  margin:0 auto;
  padding:2.6rem 1.75rem;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:1.4rem;
}
.footer-brand{
  display:flex;align-items:center;gap:0.55rem;
  font-family:var(--font-display);font-weight:800;
  color:var(--white);
}
.footer-contact{display:flex;gap:1.8rem;flex-wrap:wrap;}
.footer-contact a{font-size:0.88rem;color:rgba(255,255,255,0.6);transition:color 0.25s var(--ease);}
.footer-contact a:hover{color:var(--teal-400);}
.footer-copy{width:100%;text-align:center;font-size:0.78rem;color:rgba(255,255,255,0.35);margin-top:0.8rem;}

@media (max-width:700px){
  .footer-inner{flex-direction:column;text-align:center;}
  .footer-contact{justify-content:center;}
}