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

:root {
  /* Primary Color Palette - Gradient Purple to Blue */
  --lavender-light: #F2E6EE;    /* Light pink/lavender */
  --lavender: #977DFF;           /* Medium purple */
  --blue-primary: #0033FF;       /* Deep blue */
  --blue-dark: #0B00AB;          /* Dark purple-blue */
  --blue-darkest: #00033D;       /* Darkest blue */
  
  /* Legacy support */
  --lime: #2E2AFF;
  --dark: #ffffff;
  --text-muted: rgba(30,41,59,0.65);
}

html, body{
  font-family: 'Manrope', sans-serif;
  overflow-x: hidden;
  color:black;
  background-color:#F2E6EE;
  max-width:100%; margin:0 auto;
   background: linear-gradient(
        135deg,
        #ffffff 10%,
        #ffffff 40%,
        #ffffff 70%,
        hsl(0, 0%, 100%) 100%
    );
  
}

/* ══ HERO ══ */
.hero {
  position: relative; min-height: 100vh;
  display: flex; flex-direction: column; overflow: hidden;background:#2E2AFF;
 }
.hero::before {
  content:''; position:absolute; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity:.15; pointer-events:none; z-index:0;
}
/* ═══ NAV + MEGA MENU ═══ */
nav {
  position:fixed; top:0; left:0; right:0; z-index:2000;
  display:flex; align-items:center; justify-content:space-between;
  padding:15px 52px;
  /* background:rgba(10,18,0,0.93); */ backdrop-filter:blur(20px);
  /* border-bottom:1px solid rgba(151,125,255,0.1); */
}
.view-page-btn{
  padding:25px 15px;
}
.logo { font-size:20px; font-weight:900; letter-spacing:.1em; color:white; text-transform:uppercase; text-decoration:none; }
.nav-links { display:flex; gap:5px; list-style:none; align-items:center; }
.nav-links > li { position:relative; }
.nav-links a {
  display:inline-flex; align-items:center; gap:5px;
  padding:7px 17px; border-radius:999px;
  border:1px solid rgba(30,41,59,.15); color:#ffffff;
  font-size:13px; font-weight:500; text-decoration:none;
  background:rgb(255 255 255 / 20%); backdrop-filter:blur(8px);
  transition:background .2s, color .2s, border-color .2s;
}
.nav-links a:hover { background:rgba(0,51,255,.1); color:#C8FF00; }
.nav-links > li.mega-open > a { background:rgba(0,51,255,.1); border-color:#C8FF00; color:#C8FF00; }
.nav-chevron { width:13px; height:13px; transition:transform .3s cubic-bezier(.22,.68,0,1.2); }
.mega-open .nav-chevron { transform:rotate(180deg); }
.nav-cta {
  padding:9px 26px; border-radius:999px; border:1.5px solid #C8FF00;
  background:linear-gradient(135deg, #C8FF00 0%, #9FCC00 100%); 
  color:#030303; font-size:13px; font-weight:600; cursor:pointer;
  font-family:'Manrope',sans-serif; 
  transition:all .3s cubic-bezier(.22,.68,0,1.2);
  box-shadow: 0 4px 16px rgba(0,51,255,.25);
}
.nav-cta:hover { 
  background:linear-gradient(135deg, #C8FF00 0%, #9FCC00 100%);
   cursor: pointer;
    transition: all var(--transition-bounce);
    box-shadow: 0 4px 20px rgba(200, 255, 0, 0.3);
}
/* Mega overlay */
.mega-overlay { position:fixed; inset:0; z-index:1990; background:rgba(100,116,139,.2); opacity:0; visibility:hidden; transition:opacity .3s,visibility .3s; }
.mega-overlay.open { opacity:1; visibility:visible; }
/* Mega panel */
.mega-panel {
  position:fixed; top:50px; left:0; right:0; z-index:1995;
  background:#f2f3ff; backdrop-filter:blur(28px);
  border-bottom:1px solid rgba(151,125,255,.1);
  opacity:0; visibility:hidden; pointer-events:none;
  transform:translateY(-10px);
  transition:opacity .3s cubic-bezier(.22,.68,0,1.2),transform .3s cubic-bezier(.22,.68,0,1.2),visibility .3s;
}
.mega-panel.open { opacity:1; visibility:visible; pointer-events:all; transform:translateY(0); }
.mega-wrap { max-width:1260px; margin:0 auto; display:flex; }
/* Tabs */
.mega-tabs { width:210px; flex-shrink:0; border-right:1px solid rgba(151,125,255,.08); padding:24px 0; display:flex; flex-direction:column; gap:2px; }
.mega-tab { display:flex; align-items:center; gap:11px; padding:10px 22px; cursor:pointer; border-left:2px solid transparent; transition:all .2s; }
.mega-tab:hover { background:rgba(0,51,255,.04); }
.mega-tab.active { background:rgba(151,125,255,.07); border-left-color:var(--lime); }
.mega-tab-icon { width:32px; height:32px; border-radius:9px; flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:15px; background:rgba(0,51,255,.07); border:1px solid rgba(0,51,255,.14); transition:background .2s,border-color .2s; }
.mega-tab.active .mega-tab-icon { background:rgba(151,125,255,.12); border-color:rgba(151,125,255,.25); }
.mega-tab-label { font-size:12.5px; font-weight:700; color:rgba(30,41,59,.6); transition:color .2s; }
.mega-tab.active .mega-tab-label { color:#1e293b; }
.mega-tab-count { margin-left:auto; font-size:10px; font-weight:800; background:rgba(151,125,255,.12); color:var(--lime); border:1px solid rgba(151,125,255,.2); border-radius:999px; padding:2px 7px; }
/* Content */
.mega-content { flex:1; padding:24px 32px; overflow:hidden; }
.mega-pane { display:none; animation:megaFadeIn .22s ease; }
.mega-pane.active { display:grid; grid-template-columns:1fr 240px; gap:24px; }
@keyframes megaFadeIn { from{opacity:0;transform:translateX(6px)} to{opacity:1;transform:translateX(0)} }
.mega-pane-heading { font-size:12px; font-weight:800; letter-spacing:.16em;
 text-transform:uppercase; color:var(--blue-primary); margin-bottom:5px;margin-top:10px; }
.mega-links-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:5px; }
.mega-link { display:flex; align-items:flex-start; gap:10px; padding:10px 13px; border-radius:11px; border:1px solid transparent; text-decoration:none; transition:all .2s; }
.mega-link:hover { background:rgba(151,125,255,.05); border-color:rgba(151,125,255,.22); }
.mega-link-dot { width:5px; height:5px; border-radius:50%; background:rgba(151,125,255,.35); flex-shrink:0; margin-top:6px; transition:background .2s; }
.mega-link:hover .mega-link-dot { background:var(--lime); }
.mega-link-name { font-size:12.5px; font-weight:700; color:rgba(30,41,59,.8); line-height:1; margin-bottom:3px; transition:color .2s; }
.mega-link:hover .mega-link-name { color:#1e293b; }
.mega-link-desc { font-size:11px; color:rgba(30,41,59,.35); line-height:1.4; }
/* Sidebar */
.mega-pane-right { border-left:1px solid rgba(0,51,255,.1); padding-left:22px; }
.mega-featured-card { border-radius:14px; padding:18px; background:linear-gradient(145deg,rgba(151,125,255,.1) 0%,rgba(151,125,255,.04) 60%,transparent 100%); border:1px solid rgba(151,125,255,.2); margin-bottom:14px; }
.mega-featured-label { font-size:10px; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
   color:#2E2AFF; margin-bottom:8px; }
.mega-featured-name { font-size:14px; font-weight:900; color:#1e293b; margin-bottom:5px; }
.mega-featured-sub { font-size:11.5px; color:rgba(30,41,59,.48); line-height:1.55; margin-bottom:12px; }
.mega-featured-btn { 
  display:inline-flex; align-items:center; gap:6px; 
  background:#C8FF00; 
  color:#000; font-size:12px; font-weight:800; padding:6px 15px; 
  border-radius:999px; text-decoration:none; 
  transition:all .3s cubic-bezier(.22,.68,0,1.2); 
}
.mega-featured-btn:hover { 
  background:#C8FF00; 
  transform:scale(1.05) translateY(-1px); 
  box-shadow: 0 4px 18px rgba(151,125,255,.35);
}
.mega-quick-links { display:flex; flex-direction:column; gap:3px; }
.mega-quick-link { display:flex; align-items:center; gap:8px; padding:7px 9px; border-radius:9px; text-decoration:none; transition:background .2s; }
.mega-quick-link:hover { background:rgba(0,51,255,.055); }
.mega-quick-icon { font-size:13px; width:24px; text-align:center; }
.mega-quick-text { font-size:12px; font-weight:600; color:rgba(30,41,59,.6); transition:color .2s; }
.mega-quick-link:hover .mega-quick-text { color:#1e293b; }
.mega-quick-arr { margin-left:auto; font-size:10px; color:rgba(151,125,255,.4); }
/* Bottom bar */
.mega-bottom { border-top:1px solid rgba(151,125,255,.07); background:rgba(151,125,255,.05); }
.mega-bottom-inner { max-width:1260px; margin:0 auto; padding:12px 32px 12px 242px; display:flex; align-items:center; justify-content:space-between; }
.mega-bottom-tags { display:flex; gap:7px; flex-wrap:wrap; }
.mega-bottom-tag { display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:600; color:rgba(30,41,59,.4); padding:4px 11px; border-radius:999px; border:1px solid rgba(0,51,255,.14); background:rgba(0,51,255,.035); }
.mega-bottom-tag b { color:var(--lime); font-weight:800; }
.mega-bottom-cta { 
  display:inline-flex; align-items:center; gap:7px; padding:8px 20px; 
  border-radius:999px; 
  background:#C8FF00;
  color:#000; font-size:12.5px; font-weight:800; text-decoration:none; 
  transition:all .3s cubic-bezier(.22,.68,0,1.2); white-space:nowrap;
}
.mega-bottom-cta:hover { 
  background:#C8FF00; 
  transform:scale(1.05) translateY(-1px); 
  box-shadow: 0 4px 18px rgba(151,125,255,.35);
}

.hero-body {
  position:relative; z-index:5; flex:1;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:120px 24px 90px;
}

.badge {
  position:absolute; display:inline-flex; align-items:center; gap:7px;
  padding:9px 18px; border-radius:999px;
  background:#C8FF00; border:1px solid rgba(151,125,255,.4);
  color:#070707; font-size:13px; font-weight:700;
  backdrop-filter:blur(10px); z-index:6;
}
.badge-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #00000038;
    box-shadow: 0 2px 8px rgba(0, 51, 255, .3);
}
.badge-arrow svg { width:11px; height:11px; fill:none; stroke:#000000; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.badge-influencer { left:7%; top:60%; opacity:0; animation:fadeUp .6s .7s cubic-bezier(.22,.68,0,1.2) forwards, floatBob 4s 1.3s ease-in-out infinite; }
.badge-CPA { right:15%; top:20%; opacity:0; animation:fadeUp .6s .7s cubic-bezier(.22,.68,0,1.2) forwards, floatBob 4s 1.3s ease-in-out infinite; }
.badge-marketing  { right:15%; top:65%; opacity:0; animation:fadeUp .6s .88s cubic-bezier(.22,.68,0,1.2) forwards, floatBob 4s 1.5s ease-in-out infinite; }
@keyframes floatBob { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }

h1.headline {
  font-size:65px; font-weight:800; color:#ffffff;
  line-height:1.07; letter-spacing:-.025em; max-width:940px; margin-bottom:18px;
}
.headline-row1 {
  display:flex; align-items:center; justify-content:center; gap:16px;
  flex-wrap:wrap; margin-bottom:4px;
}
.cpa-box {
  position:relative; display:inline-flex; align-items:center; gap:10px;
  border:1.8px solid rgba(255,255,255,.5); border-radius:10px; padding:2px 12px 2px 10px;
  background: #3B82F62e;
}
.cpa-box .dot { position:absolute; width:7px; height:7px; border-radius:50%; background:#C8FF00; }
.cpa-box .dot-tl{top:-4px;left:-4px} .cpa-box .dot-tr{top:-4px;right:-4px}
.cpa-box .dot-bl{bottom:-4px;left:-4px} .cpa-box .dot-br{bottom:-4px;right:-4px}
.cpa-pill {
  display:inline-flex; padding:3px 10px; border-radius:999px;
  background:#C8FF00; 
  color:#ffffff; font-size:12px; font-weight:900; letter-spacing:.06em;
  box-shadow: 0 2px 8px rgba(0,51,255,.25);
}
.subtext {
  color:white; font-size:clamp(14px,1.5vw,16.5px); font-weight:500;
  line-height:1.65; max-width:500px; margin-bottom:38px;
}
.cta-btn {
  display:inline-flex; align-items:center;
  background:#fff; border:none; border-radius:999px;
  padding:6px 6px 6px 28px; cursor:pointer;
  font-family:'Manrope',sans-serif; font-size:15px; font-weight:700; color:#111;
  transition:transform .22s cubic-bezier(.22,.68,0,1.2), box-shadow .22s;
  box-shadow:0 4px 22px rgba(0,51,255,.18), 0 0 0 1px rgba(151,125,255,.1);
}
.cta-btn:hover { 
  transform:scale(1.05) translateY(-2px); 
  box-shadow:0 8px 32px rgba(0,51,255,.28), 0 0 0 2px rgba(151,125,255,.2);
}
.cta-btn .icon-circle {
  width:38px; height:38px; border-radius:50%; 
  background:#C8FF00;
  display:flex; align-items:center; justify-content:center; margin-left:16px;
  box-shadow: 0 2px 12px rgba(0,51,255,.3);
}
.cta-btn:hover .icon-circle {
  background:#C8FF00;
}
.cta-btn .icon-circle svg { width:16px; height:16px; fill:none; stroke:#030303; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }

.fade-up { opacity:0; transform:translateY(26px); animation:fadeUp .65s cubic-bezier(.22,.68,0,1.2) forwards; }
.d1{animation-delay:.08s}.d2{animation-delay:.22s}.d3{animation-delay:.38s}.d4{animation-delay:.52s}
@keyframes fadeUp { to{ opacity:1; transform:translateY(0); } }


/* ══ CLIENTS SECTION ══ */
.clients-section {
  position:relative;
  padding:0px 0px 20px; overflow:hidden;background: #2E2AFF;
}
.clients-section::before {
  content:''; position:absolute; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity:.15; pointer-events:none; z-index:0;
}
.clients-section::after {
  content:''; position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(151,125,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(151,125,255,.025) 1px,transparent 1px);
  background-size:64px 64px; pointer-events:none; z-index:0;
}

.clients-inner {
  position:relative; z-index:2;
  max-width:1140px; margin:0 auto; padding:0 52px; text-align:center;
}

.eyebrow {
  display:inline-flex; align-items:center; gap:10px;
  font-size:14px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:#ffffff;
  margin-bottom:14px;
}
.eyebrow::before,.eyebrow::after {
  content:''; display:block; height:1px; width:36px;
  background:linear-gradient(90deg,transparent,#C8FF00);
}
.eyebrow::after { background:linear-gradient(90deg,#C8FF00,transparent); }

.clients-heading {
  font-size:clamp(26px,3.8vw,46px); font-weight:800; color:#ffffff;
  letter-spacing:-.02em; line-height:1.1; margin-bottom:12px;
}
.clients-heading em { font-style:normal; color:#1e293b; }
.clients-sub {
  font-size:15px; color:#fafafa; font-weight:400; line-height:1.65;
  margin-bottom:60px;
}

/* track */
.carousel-wrap { display:flex; flex-direction:column; gap:18px; }
.carousel-viewport {
  overflow:hidden; position:relative;
  -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 9%,#000 91%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0%,#000 9%,#000 91%,transparent 100%);
}
.carousel-track {
  display:flex; gap:18px; width:max-content;
  animation:scrollL 38s linear infinite;
}
.carousel-track-r {
  animation:scrollR 42s linear infinite;
}
.carousel-viewport:hover .carousel-track,
.carousel-viewport:hover .carousel-track-r { animation-play-state:paused; }
@keyframes scrollL  { from{transform:translateX(0)} to{transform:translateX(-50%)} }
@keyframes scrollR  { from{transform:translateX(-50%)} to{transform:translateX(0)} }

/* card */
.logo-card {
  flex-shrink:0;
  display:flex; align-items:center; gap:13px;
  padding:16px 28px;
  background:#ffffff26;
  border:1px solid rgba(0,51,255,.14);
  border-radius:18px; cursor:default;
  position:relative; overflow:hidden;
  transition:background .28s, border-color .28s, transform .28s, box-shadow .28s;
}
.logo-card::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse 80% 60% at 50% -10%,rgba(151,125,255,.1),transparent);
  opacity:0; transition:opacity .3s;
}
.logo-card:hover {
  background:rgba(0,51,255,.08);
  border-color:rgba(151,125,255,.3);
  transform:translateY(-4px);
  box-shadow:0 12px 40px rgba(0,51,255,.12), 0 0 0 1px rgba(151,125,255,.12);
}
.logo-card:hover::before { opacity:1; }

.card-icon {
  width:40px; height:40px; border-radius:12px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  font-size:20px; position:relative; z-index:1;
}
.card-name {
  font-size:15px; font-weight:700; color:#ffffff;
  white-space:nowrap; position:relative; z-index:1;
}
.card-tag {
  font-size:10px; font-weight:700; padding:2px 8px; border-radius:999px;
  background:rgba(151,125,255,.12); color:#C8FF00; letter-spacing:.06em;
  position:relative; z-index:1;
}

/* stats */
.stats-row {
  display:flex; align-items:center; justify-content:center;
  flex-wrap:wrap; gap:0; margin-top:72px;
  border:1px solid rgba(0,51,255,.12); border-radius:24px;
  background:rgba(0,51,255,.03); backdrop-filter:blur(8px);
  overflow:hidden;
}
.stat-item {
  flex:1; min-width:160px;
  display:flex; flex-direction:column; align-items:center;
  padding:36px 24px;
  border-right:1px solid rgba(0,51,255,.1);
  transition:background .25s;
}
.stat-item:last-child { border-right:none; }
.stat-item:hover { background:rgba(151,125,255,.04); }
.stat-number {
  font-size:clamp(30px,3.5vw,48px); font-weight:900; color:#1e293b;
  line-height:1; letter-spacing:-.03em;
}
.stat-number sup { color:var(--lime); font-size:60%; vertical-align:super; }
.stat-label { font-size:12.5px; font-weight:500; color:var(--text-muted); margin-top:7px; letter-spacing:.02em; }

/* scroll reveal */
.reveal { opacity:0; transform:translateY(28px); transition:opacity .7s cubic-bezier(.22,.68,0,1.2), transform .7s cubic-bezier(.22,.68,0,1.2); }
.reveal.in { opacity:1; transform:none; }
.rd1{transition-delay:.05s}.rd2{transition-delay:.15s}.rd3{transition-delay:.25s}
.rd4{transition-delay:.35s}.rd5{transition-delay:.45s}
.ra1{transition-delay:.05s}.ra2{transition-delay:.15s}.ra3{transition-delay:.25s}
.ra4{transition-delay:.35s}.ra5{transition-delay:.45s}.ra6{transition-delay:.55s}

#typing-text{
  border-right:3px solid #977DFF;
  padding-right:5px;
  white-space:nowrap;
  animation: blink 0.8s infinite;
  color:#C8FF00;
}

@keyframes blink{
  0%{border-color:transparent}
  50%{border-color:#977DFF}
  100%{border-color:transparent}
}

/* ══ ABOUT SECTION — Google Trust Style ══ */
.about-section {
  position: relative;
  padding: 50px 52px;
  overflow: hidden;
  background: #f2f3ff;
}
.about-section::before {
  content:''; position:absolute; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity:.08; pointer-events:none; z-index:0;
}
.about-glow {
  position:absolute; top:-80px; right:-80px;
  width:600px; height:600px; border-radius:50%;
  background:radial-gradient(circle, rgba(151,125,255,.09) 0%, transparent 65%);
  pointer-events:none; z-index:1;
}
.about-glow-left {
  position:absolute; bottom:-100px; left:-100px;
  width:500px; height:500px; border-radius:50%;
  background:radial-gradient(circle, rgba(151,125,255,.07) 0%, transparent 65%);
  pointer-events:none; z-index:1;
}
.about-inner {
  position:relative; z-index:2;
  max-width:1140px; margin:0 auto;
}

/* ── Section header ── */
.about-header { margin-bottom:64px; display:flex; align-items:flex-end; justify-content:space-between; gap:40px; flex-wrap:wrap; }
.about-header-left .eyebrow { margin-bottom:14px; }
.about-heading {
  font-size:clamp(28px,4vw,52px); font-weight:800; color:#1e293b;
  letter-spacing:-.025em; line-height:1.1; max-width:620px;
}
.about-heading .lime { color:var(--lime); }
.about-header-right { max-width:360px; }
.about-intro-text { font-size:15px; color:var(--text-muted); line-height:1.75; }

/* ── Trust bar ── */
.about-trust-bar {
  display:flex; align-items:center; gap:0;
  background:rgba(0,51,255,.03);
  border:1px solid rgba(0,51,255,.12);
  border-radius:20px;
  overflow:hidden;
  margin-bottom:48px;
}
.trust-bar-item {
  flex:1; display:flex; align-items:center; justify-content:center; gap:12px;
  padding:22px 20px;
  border-right:1px solid rgba(0,51,255,.1);
  transition:background .25s;
}
.trust-bar-item:last-child { border-right:none; }
.trust-bar-item:hover { background:rgba(151,125,255,.04); }
.trust-bar-icon {
  width:36px; height:36px; border-radius:10px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:17px;
  background:rgba(151,125,255,.1); border:1px solid rgba(151,125,255,.18);
}
.trust-bar-text {}
.trust-bar-val { font-size:18px; font-weight:900; color:#1e293b; line-height:1.1; }
.trust-bar-lbl { font-size:11px; font-weight:600; color:var(--text-muted); letter-spacing:.03em; margin-top:2px; }

/* ── Main 3-col grid ── */
.about-main-grid {
  display:grid;
  grid-template-columns:1.15fr 1fr 1fr;
  gap:20px;
  margin-bottom:20px;
}

/* ── Story card (tall left) ── */
.about-story-card {
  position:relative;
  background: linear-gradient(135deg, rgba(151,125,255,.06) 0%, rgba(255,255,255,.025) 100%);
  border:1px solid rgba(151,125,255,.18);
  border-radius:24px;
  padding:44px 40px;
  overflow:hidden;
  display:flex; flex-direction:column; justify-content:space-between;
  min-height:420px;
  grid-row: span 2;
  transition:border-color .3s, box-shadow .3s;
}
.about-story-card::before {
  content:''; position:absolute; top:-80px; left:-80px;
  width:300px; height:300px; border-radius:50%;
  background:radial-gradient(circle, rgba(151,125,255,.12) 0%, transparent 70%);
  pointer-events:none;
}
.about-story-card:hover {
  border-color:var(--lime);
  box-shadow:0 20px 60px rgba(151,125,255,.06), 0 0 0 1px rgba(151,125,255,.1);
}
.story-tag {
  display:inline-flex; align-items:center; gap:7px;
  background:rgba(151,125,255,.1); border:1px solid rgba(151,125,255,.3);
  color:var(--lime); font-size:11px; font-weight:800;
  letter-spacing:.1em; text-transform:uppercase;
  padding:5px 14px; border-radius:999px; margin-bottom:24px;
  width:fit-content;
}
.story-tag-dot { width:6px; height:6px; background:var(--lime); border-radius:50%; animation:pulse 1.8s ease-in-out infinite; }
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.35;transform:scale(1.5)} }
.story-title {
  font-size:clamp(20px,2vw,27px); font-weight:800; color:#1e293b;
  line-height:1.25; margin-bottom:16px;
}
.story-body {
  font-size:14.5px; color:var(--text-muted); line-height:1.75; flex:1;
}
.story-founders {
  margin-top:32px; display:flex; align-items:center; gap:14px;
  padding-top:24px; border-top:1px solid rgba(0,51,255,.1);
}
.founder-avatars { display:flex; }
.founder-avatar {
  width:38px; height:38px; border-radius:50%;
  border:2px solid rgba(151,125,255,.4);
  background:linear-gradient(135deg, rgba(151,125,255,.2), rgba(151,125,255,.05));
  display:flex; align-items:center; justify-content:center;
  font-size:14px; font-weight:800; color:var(--lime);
  margin-left:-10px; position:relative;
}
.founder-avatar:first-child { margin-left:0; }
.founder-info { flex:1; }
.founder-label { font-size:12px; font-weight:700; color:#1e293b; }
.founder-sub { font-size:11px; color:var(--text-muted); }

/* ── Value cards (right col) ── */
.about-value-card {
  position:relative;
  background:rgba(0,51,255,.035);
  border:1px solid rgba(0,51,255,.14);
  border-radius:20px;
  padding:28px 28px;
  display:flex; align-items:flex-start; gap:16px;
  transition:background .3s, border-color .3s, transform .25s;
  overflow:hidden;
}
.about-value-card::after {
  content:''; position:absolute; bottom:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg, transparent, var(--lime), transparent);
  opacity:0; transition:opacity .3s;
}
.about-value-card:hover {
  background:rgba(0, 51, 255, 0.055);
  border-color:var(--lime);
  transform:translateY(-3px);
}
.about-value-card:hover::after { opacity:1; }
.value-icon {
  width:44px; height:44px; border-radius:13px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:20px;
  background:rgba(151,125,255,.1); border:1px solid rgba(151,125,255,.15);
}
.value-text-wrap { flex:1; }
.value-title { font-size:15px; font-weight:800; color:#1e293b; margin-bottom:5px; }
.value-desc { font-size:13px; color:var(--text-muted); line-height:1.62; }

/* ── Certification / trust badges row ── */
.about-cert-row {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin-bottom:20px;
}
.cert-card {
  background:rgba(0,51,255,.03);
  border:1px solid rgba(0,51,255,.12);
  border-radius:18px;
  padding:24px 20px;
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:12px;
  position:relative; overflow:hidden;
  transition:background .3s, border-color .3s, transform .3s;
}
.cert-card:hover {
  background:rgba(0,51,255,.055);
  border-color:var(--lime);
  transform:translateY(-4px);
}
.cert-shield {
  width:52px; height:52px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:24px;
  background:rgba(151,125,255,.08); border:1.5px solid rgba(151,125,255,.2);
}
.cert-name { font-size:13px; font-weight:800; color:#1e293b; line-height:1.3; }
.cert-sub { font-size:11px; color:var(--text-muted); line-height:1.5; }
.cert-verified {
  display:inline-flex; align-items:center; gap:5px;
  font-size:10px; font-weight:700; color:var(--lime); letter-spacing:.06em;
  background:rgba(151,125,255,.1); padding:3px 10px; border-radius:999px;
  border:1px solid rgba(151,125,255,.2);
}
.cert-verified-dot { width:5px; height:5px; background:var(--lime); border-radius:50%; }

/* ── Wide mission card ── */
.about-mission-card {
  background: linear-gradient(135deg, rgba(151,125,255,.05) 0%, rgba(255,255,255,.02) 100%);
  border:1px solid rgba(151,125,255,.15);
  border-radius:24px;
  padding:44px 52px;
  display:flex; align-items:center; gap:60px;
  position:relative; overflow:hidden;
  transition:border-color .3s;
}
.about-mission-card:hover { border-color:var(--lime); }
.about-mission-card::before {
  content:''; position:absolute; right:-100px; top:-100px;
  width:400px; height:400px; border-radius:50%;
  background:radial-gradient(circle, rgba(151,125,255,.07) 0%, transparent 70%);
  pointer-events:none;
}
.mission-left { flex:1; position:relative; z-index:1; }
.mission-quote-mark { font-size:80px; line-height:.7; color:rgba(151,125,255,.2); font-weight:900; margin-bottom:8px; }
.mission-text { font-size:clamp(17px,2vw,22px); font-weight:700; color:#1e293b; line-height:1.5; }
.mission-text .lime { color:var(--lime); }
.mission-author { margin-top:20px; display:flex; align-items:center; gap:12px; }
.mission-author-avatar {
  width:44px; height:44px; border-radius:50%;
  background:linear-gradient(135deg, rgba(151,125,255,.3), rgba(151,125,255,.05));
  border:2px solid rgba(151,125,255,.35);
  display:flex; align-items:center; justify-content:center;
  font-size:16px; font-weight:800; color:var(--lime);
}
.mission-author-name { font-size:14px; font-weight:700; color:#1e293b; }
.mission-author-role { font-size:12px; color:var(--text-muted); }
.mission-right { display:flex; flex-direction:column; gap:16px; flex-shrink:0; min-width:240px; position:relative; z-index:1; }
.mission-stat-item { display:flex; align-items:center; gap:16px; }
.mission-stat-num { font-size:32px; font-weight:900; color:#1e293b; letter-spacing:-.03em; line-height:1; min-width:80px; }
.mission-stat-num span { color:var(--lime); font-size:22px; }
.mission-stat-lbl { font-size:13px; color:var(--text-muted); line-height:1.4; }
.mission-divider { height:1px; background:rgba(0,51,255,.07); }

@media(max-width:1024px){
  .about-main-grid { grid-template-columns:1fr 1fr; }
  .about-story-card { grid-row:span 1; min-height:auto; }
  .about-cert-row { grid-template-columns:repeat(2,1fr); }
  .about-mission-card { flex-direction:column; gap:32px; }
}
@media(max-width:768px){
  .about-section { padding:80px 24px; }
  .about-header { flex-direction:column; align-items:flex-start; gap:20px; }
  .about-main-grid { grid-template-columns:1fr; }
  .about-trust-bar { flex-wrap:wrap; }
  .trust-bar-item { border-right:none; border-bottom:1px solid rgba(0,51,255,.1); min-width:50%; }
  .trust-bar-item:nth-child(even) { border-right:none; }
  .about-cert-row { grid-template-columns:repeat(2,1fr); }
  .mission-right { min-width:auto; width:100%; }
}

/* ══ SERVICES SECTION ══ */
.services-section {
  position: relative;
  padding: 50px 52px;
  overflow: hidden;
  background:linear-gradient(135deg, #2E2AFF 0%, #2E2AFF 100%);
}
.services-section::before {
  content:''; position:absolute; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity:.12; pointer-events:none; z-index:0;
}
.services-section::after {
  content:''; position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(151,125,255,.02) 1px,transparent 1px),
    linear-gradient(90deg,rgba(151,125,255,.02) 1px,transparent 1px);
  background-size:64px 64px; pointer-events:none; z-index:0;
}
.services-glow-left {
  position:absolute; bottom:-80px; left:-120px;
  width:600px; height:600px; border-radius:50%;
  background:radial-gradient(circle, rgba(151,125,255,.09) 0%, transparent 65%);
  pointer-events:none; z-index:1;
}
.services-glow-right {
  position:absolute; top:-60px; right:-100px;
  width:500px; height:500px; border-radius:50%;
  background:radial-gradient(circle, rgba(151,125,255,.08) 0%, transparent 65%);
  pointer-events:none; z-index:1;
}
.services-inner {
  position:relative; z-index:2;
  max-width:1200px; margin:0 auto;
}

/* ── Header ── */
.services-header {
  display:flex; align-items:flex-end; justify-content:space-between;
  margin-bottom:60px; gap:40px; flex-wrap:wrap;
}
.services-header-left .eyebrow { margin-bottom:16px; }
.services-heading {
  font-size:clamp(30px,4.2vw,54px); font-weight:800; color:#ffffff;
  letter-spacing:-.025em; line-height:1.1; max-width:560px;
}
.services-heading .lime { color:#C8FF00; }
.services-header-right { max-width:340px; }
.services-header-desc { font-size:15px; color:#ffffff; line-height:1.72; }

/* ── Tab bar ── */
.svc-tabs {
  display:flex; gap:0; flex-wrap:wrap;
  background:rgba(0,51,255,.035);
  border:1px solid #ffffff6c;
  border-radius:20px; padding:6px;
  margin-bottom:40px;
  position:relative;
}
.svc-tab {
  display:flex; align-items:center; gap:10px;
  padding:12px 40px; border-radius:14px;
  border:none; background:transparent; cursor:pointer;
  font-family:'Manrope',sans-serif; font-size:13.5px; font-weight:600;
  color:#ffffff;
  transition:color .25s, background .25s;
  flex:1; justify-content:center; white-space:nowrap;
}
.svc-tab:hover {
    color: rgb(255 255 255);
    background: #f2f3ff45;
}
.svc-tab.active {
  background:#f2f3ff45;
  border:1px solid rgba(151,125,255,.25);
  color:#ffffff;
  box-shadow:0 4px 20px rgba(151,125,255,.08);
}
.svc-tab-icon { font-size:18px; flex-shrink:0; }
.svc-tab-label { display:flex; flex-direction:column; align-items:flex-start; }
.svc-tab-title { font-size:13px; font-weight:700; line-height:1.2; }
.svc-tab-sub { font-size:10px; opacity:.7; font-weight:500; }

/* ── Main panel layout ── */
.svc-panel-wrap {
  display:grid;
  grid-template-columns:1fr 420px;
  gap:24px;
  align-items:stretch;
}

/* ── Big spotlight card ── */
.svc-spotlight {
  position:relative; overflow:hidden;
  border-radius:28px;
  background:rgba(151,125,255,.04);
  border:1px solid rgba(151,125,255,.15);
  padding:0;
  min-height:480px;
  display:flex; flex-direction:column;
  transition:border-color .4s;
}
.svc-spotlight-inner {
  padding:48px 48px 40px;
  flex:1; display:flex; flex-direction:column; gap:24px;
  position:relative; z-index:2;
}
.svc-spotlight-bg {
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:#f2f3ff45;
  transition:opacity .5s;
}
.svc-spotlight-header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.svc-spotlight-icon {
  width:72px; height:72px; border-radius:22px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:32px;
  background:#C8FF00;
  border:1px solid rgba(151,125,255,.22);
  box-shadow:0 8px 32px rgba(151,125,255,.08);
  transition:transform .3s;
}
.svc-spotlight:hover .svc-spotlight-icon { transform:scale(1.06) rotate(-3deg); }
.svc-spotlight-badge {
  display:inline-flex; align-items:center; gap:6px;
  background:#C8FF00; border:1px solid rgba(151,125,255,.25);
  color:var(--lime); font-size:10px; font-weight:800;
  letter-spacing:.1em; text-transform:uppercase;
  padding:5px 14px; border-radius:999px;
}
.svc-spotlight-badge-dot { width:5px; height:5px; background:var(--lime); border-radius:50%; animation:pulse 2s ease-in-out infinite; }
.svc-spotlight-title {
  font-size:clamp(24px,2.8vw,36px); font-weight:900; color:#ffffff;
  line-height:1.15; letter-spacing:-.025em;
}
.svc-spotlight-desc {
  font-size:15px; color:#ffffff; line-height:1.75; flex:1;
}

/* Feature pills */
.svc-pills { display:flex; flex-wrap:wrap; gap:8px; }
.svc-pill {
  display:inline-flex; align-items:center; gap:6px;
  padding:7px 14px; border-radius:999px;
  background:rgba(151,125,255,.07); border:1px solid rgba(151,125,255,.15);
  color:#C8FF00; font-size:12px; font-weight:600;
}
.svc-pill::before {
  content:''; width:6px; height:6px; border-radius:50%;
  background:#C8FF00; flex-shrink:0;
}

/* Metric strip at bottom */
.svc-spotlight-metrics {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1px; background:rgba(0,51,255,.07);
  border-top:1px solid rgba(151,125,255,.1);
  border-radius:0 0 28px 28px;
  overflow:hidden;
}
.svc-spotlight-metric {
  background:rgba(0,51,255,.025); padding:22px 24px;
  display:flex; flex-direction:column; gap:4px;
  transition:background .3s;
}
.svc-spotlight-metric:hover { background:rgba(151,125,255,.07); }
.svc-spotlight-metric-val {
  font-size:26px; font-weight:900; color:#C8FF00; letter-spacing:-.03em;
}
.svc-spotlight-metric-lbl { font-size:11px; color:#C8FF00; font-weight:500; }

/* ── Right side stacked mini-cards ── */
.svc-stack { display:flex; flex-direction:column; gap:16px; }
.svc-mini {
  position:relative; overflow:hidden;
  border-radius:20px;
  background:#f2f3ff45;
  border:1px solid rgba(0,51,255,.12);
  padding:24px 28px;
  display:flex; align-items:flex-start; gap:18px;
  cursor:pointer;
  transition:background .3s, border-color .3s, transform .3s, box-shadow .3s;
}
.svc-mini:hover, .svc-mini.active-mini {
    background: #f2f3ff45;
    border-color: #3b82f638;
    transform: translateX(4px);
    box-shadow: 0 8px 32px rgba(0, 51, 255, .1), -4px 0 0 0 #c8ff00;
}
.svc-mini-shine {
  position:absolute; top:0; left:-100%; width:60%; height:100%;
  background:linear-gradient(105deg, transparent 40%, rgba(255,255,255,.04) 50%, transparent 60%);
  transition:left .5s ease; pointer-events:none;
}
.svc-mini:hover .svc-mini-shine { left:140%; }
.svc-mini-icon {
  width:44px; height:44px; border-radius:14px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:20px;
  background:rgba(151,125,255,.08); border:1px solid rgba(151,125,255,.12);
  transition:background .3s, transform .3s;
}
.svc-mini:hover .svc-mini-icon, .svc-mini.active-mini .svc-mini-icon {
  background:#C8FF00; transform:rotate(-4deg) scale(1.05);
}
.svc-mini-text { flex:1; }
.svc-mini-title { font-size:14px; font-weight:800; color:#ffffff; margin-bottom:4px; }
.svc-mini-desc { font-size:12.5px; color:#ffffff; line-height:1.55; }
.svc-mini-arrow {
  flex-shrink:0; width:28px; height:28px; border-radius:50%;
  background:#C8FF00; border:1px solid rgba(0,51,255,.18);
  display:flex; align-items:center; justify-content:center;
  transition:background .3s, transform .3s;
  align-self:center;
}
.svc-mini:hover .svc-mini-arrow, .svc-mini.active-mini .svc-mini-arrow {
  background:rgba(151,125,255,.2); transform:translateX(2px);
}
.svc-mini-arrow svg { width:12px; height:12px; fill:none; stroke:rgba(151,125,255,.8); stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }

/* ── Bottom stats bar ── */
.svc-stats-bar {
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:1px; background:rgba(0,51,255,.07);
  border:1px solid rgba(0,51,255,.12);
  border-radius:20px; overflow:hidden;
  margin-top:24px;
}
.svc-stat {
  background:#f0f0ff; padding:28px 24px;
  display:flex; flex-direction:column; gap:4px;
  align-items:center; text-align:center;
  transition:background .3s;
  position:relative;
}
.svc-stat::after {
  content:''; position:absolute; right:0; top:50%; transform:translateY(-50%);
  width:1px; height:55%; background:rgba(0,51,255,.07);
}
.svc-stat:last-child::after { display:none; }
.svc-stat:hover { background:rgba(151,125,255,.04); }
.svc-stat-num {
  font-size:clamp(26px,2.8vw,38px); font-weight:900; color:var(--lime); letter-spacing:-.03em;
}
.svc-stat-label { font-size:12px; color:var(--text-muted); font-weight:500; }

/* Reveal delays */
.rs1{transition-delay:.05s}.rs2{transition-delay:.15s}.rs3{transition-delay:.25s}
.rs4{transition-delay:.35s}.rs5{transition-delay:.45s}.rs6{transition-delay:.55s}

/* ── Responsive ── */
@media(max-width:1080px){
  .services-section { padding:60px 28px; }
  .svc-panel-wrap { grid-template-columns:1fr; }
  .svc-spotlight { min-height:auto; }
  .svc-spotlight-metrics { grid-template-columns:repeat(3,1fr); }
}
@media(max-width:700px){
  .services-header { flex-direction:column; align-items:flex-start; }
  .svc-tabs { overflow-x:auto; flex-wrap:nowrap; }
  .svc-tab { flex:0 0 auto; }
  .svc-stats-bar { grid-template-columns:1fr 1fr; }
  .svc-stat::after { display:none; }
  .svc-spotlight-metrics { grid-template-columns:1fr 1fr 1fr; }
}

/* ══════════════════════════════════════
   CASE STUDIES SECTION
══════════════════════════════════════ */
.cs-section {
  position:relative; padding:100px 0 120px; overflow:hidden;
}
.cs-noise {
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity:.07;
}
.cs-grid-bg {
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(151,125,255,.014) 1px,transparent 1px),
    linear-gradient(90deg,rgba(151,125,255,.014) 1px,transparent 1px);
  background-size:72px 72px;
}
.cs-orb-a {
  position:absolute; z-index:0; pointer-events:none;
  width:800px; height:800px; border-radius:50%; top:-280px; right:-200px;
  background:radial-gradient(circle, rgba(151,125,255,.065) 0%, transparent 62%);
}
.cs-orb-b {
  position:absolute; z-index:0; pointer-events:none;
  width:540px; height:540px; border-radius:50%; bottom:-120px; left:-160px;
  background:radial-gradient(circle, rgba(151,125,255,.045) 0%, transparent 62%);
}
.cs-inner {
  position:relative; z-index:2;
  max-width:1240px; margin:0 auto; padding:0 52px;
}

/* ── Header ── */
.cs-header {
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:40px; margin-bottom:52px; flex-wrap:wrap;
}
.cs-header-left .eyebrow { margin-bottom:18px; }
.cs-heading {
  font-size:clamp(34px,5vw,68px); font-weight:900; color:#1e293b;
  letter-spacing:-.035em; line-height:1.04;
}
.cs-heading-lime { color:var(--lime); }
.cs-header-right {
  display:flex; flex-direction:column; align-items:flex-end; gap:20px;
}
.cs-header-desc {
  font-size:15px; color:var(--text-muted); line-height:1.75;
  max-width:360px; text-align:right;
}
.cs-header-cta {
  display:inline-flex; align-items:center; gap:10px;
  padding:10px 24px; border-radius:999px; cursor:pointer;
  font-family:'Manrope',sans-serif; font-size:13px; font-weight:800;
  border:1.5px solid rgba(151,125,255,.35);
  background:rgba(151,125,255,.07); color:var(--lime);
  text-decoration:none; letter-spacing:.03em;
  transition:background .25s, transform .22s cubic-bezier(.22,.68,0,1.2), box-shadow .22s;
}
.cs-header-cta:hover { background:rgba(151,125,255,.14); transform:scale(1.04); box-shadow:0 6px 24px rgba(151,125,255,.18); }
.cs-header-cta svg { width:12px; height:12px; fill:none; stroke:var(--lime); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }

/* ── Results ticker ── */
.cs-ticker-wrap {
  margin-bottom:60px; overflow:hidden; position:relative;
  -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 8%,#000 92%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0%,#000 8%,#000 92%,transparent 100%);
}
.cs-ticker-track {
  display:flex; gap:12px; width:max-content;
  animation:csTickerScroll 36s linear infinite;
}
@keyframes csTickerScroll {
  from { transform:translateX(0); }
  to   { transform:translateX(-50%); }
}
.cs-ticker-pill {
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 20px; border-radius:999px; flex-shrink:0;
  background:rgba(0,51,255,.04); border:1px solid rgba(0,51,255,.14);
  font-size:12.5px; font-weight:700; color:rgba(30,41,59,.6);
  white-space:nowrap;
}
.cs-ticker-pill em { font-style:normal; color:var(--lime); font-size:14px; font-weight:900; }
.cs-ticker-dot { width:4px; height:4px; border-radius:50%; background:rgba(151,125,255,.4); flex-shrink:0; }

/* ── Case-file rows container ── */
.cs-files {
  display:flex; flex-direction:column; gap:12px;
}

/* ── Single case-file row ── */
.cs-file {
  position:relative; overflow:hidden;
  border-radius:20px;
  background:rgba(0,51,255,.035);
  border:1px solid rgba(0,51,255,.12);
  cursor:pointer;
  transition:border-color .3s, background .3s, box-shadow .3s;
}
.cs-file::before {
  content:''; position:absolute; left:0; top:15%; bottom:15%;
  width:3px; border-radius:999px;
  background:rgba(0,51,255,.07);
  transition:background .35s, top .35s, bottom .35s;
}
.cs-file.cs-active::before { background:var(--lime); top:8%; bottom:8%; }
.cs-file:hover:not(.cs-active) {
  border-color:rgba(151,125,255,.18);
  background:rgba(255,255,255,.048);
}
.cs-file.cs-active {
  border-color:rgba(151,125,255,.35);
  background:rgba(151,125,255,.035);
  box-shadow:0 16px 56px rgba(0,0,0,.42), 0 0 0 1px rgba(151,125,255,.1), 0 0 60px rgba(151,125,255,.03);
}
/* shine on hover */
.cs-file-shine {
  position:absolute; top:0; left:-100%; width:55%; height:100%;
  background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.03) 50%,transparent 60%);
  transition:left .55s ease; pointer-events:none; z-index:5;
}
.cs-file:hover .cs-file-shine { left:140%; }

/* ── Collapsed row (always visible) ── */
.cs-file-row {
  display:grid;
  grid-template-columns:88px 1fr auto;
  align-items:center; gap:0;
  padding:24px 32px 24px 40px;
}

/* Index column */
.cs-file-index {
  display:flex; flex-direction:column; gap:4px; padding-right:28px;
  border-right:1px solid rgba(0,51,255,.1);
}
.cs-file-num {
  font-size:32px; font-weight:900; color:rgba(30,41,59,.09);
  letter-spacing:-.04em; line-height:1;
  transition:color .3s;
}
.cs-file.cs-active .cs-file-num { color:rgba(151,125,255,.28); }
.cs-file-year {
  font-size:9.5px; font-weight:800; letter-spacing:.14em;
  color:rgba(30,41,59,.2); text-transform:uppercase;
}

/* Middle summary */
.cs-file-summary {
  padding:0 32px;
}
.cs-file-client {
  display:flex; align-items:center; gap:10px; margin-bottom:10px;
}
.cs-file-icon {
  width:32px; height:32px; border-radius:10px; flex-shrink:0;
  background:rgba(0,51,255,.08); border:1px solid rgba(0,51,255,.18);
  display:flex; align-items:center; justify-content:center; font-size:15px;
  transition:background .3s, border-color .3s, transform .35s cubic-bezier(.22,.68,0,1.2);
}
.cs-file.cs-active .cs-file-icon,
.cs-file:hover .cs-file-icon {
  background:rgba(151,125,255,.1); border-color:rgba(151,125,255,.22);
  transform:rotate(-6deg) scale(1.08);
}
.cs-file-client-name {
  font-size:11px; font-weight:800; color:rgba(30,41,59,.35);
  letter-spacing:.08em; text-transform:uppercase;
}
.cs-file-title {
  font-size:clamp(15px,1.6vw,18px); font-weight:900; color:#1e293b;
  line-height:1.25; letter-spacing:-.015em; margin-bottom:10px;
  transition:color .3s;
}
.cs-file.cs-active .cs-file-title { color:#1e293b; }
.cs-file-chips {
  display:flex; gap:6px; flex-wrap:wrap;
}
.cs-file-chip {
  font-size:10px; font-weight:700; padding:3px 10px; border-radius:999px;
  background:rgba(0,51,255,.055); border:1px solid rgba(0,51,255,.14);
  color:rgba(30,41,59,.38); letter-spacing:.03em;
  transition:background .3s, border-color .3s, color .3s;
}
.cs-file.cs-active .cs-file-chip {
  background:rgba(151,125,255,.08); border-color:rgba(151,125,255,.18);
  color:rgba(151,125,255,.75);
}

/* Right result panel */
.cs-file-result {
  display:flex; flex-direction:column; align-items:flex-end; gap:8px;
  padding-left:32px; border-left:1px solid rgba(0,51,255,.1);
  min-width:180px;
}
.cs-file-kpi-label {
  font-size:9.5px; font-weight:800; letter-spacing:.14em;
  text-transform:uppercase; color:rgba(30,41,59,.25);
}
.cs-file-kpi-val {
  font-size:clamp(28px,3.2vw,42px); font-weight:900; color:#1e293b;
  letter-spacing:-.04em; line-height:1; text-align:right;
  transition:color .3s;
}
.cs-file-kpi-val em { font-style:normal; color:var(--lime); }
.cs-file.cs-active .cs-file-kpi-val { color:#1e293b; }
.cs-file-kpi-sub {
  font-size:10.5px; font-weight:600; color:rgba(30,41,59,.3);
  text-align:right;
}
/* Mini bar chart */
.cs-bar-row {
  display:flex; align-items:flex-end; gap:2px; height:28px;
}
.cs-bar {
  width:6px; border-radius:3px 3px 0 0;
  background:rgba(0,51,255,.1);
  transition:background .4s;
}
.cs-file.cs-active .cs-bar { background:rgba(151,125,255,.25); }
.cs-bar-peak { background:var(--lime) !important; }
/* Industry badge */
.cs-file-badge {
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(151,125,255,.07); border:1px solid rgba(151,125,255,.18);
  color:rgba(151,125,255,.6); font-size:9px; font-weight:900;
  letter-spacing:.14em; text-transform:uppercase;
  padding:3px 10px; border-radius:999px;
  transition:background .3s, color .3s;
}
.cs-file.cs-active .cs-file-badge {
  background:rgba(151,125,255,.13); color:var(--lime);
}
.cs-badge-dot {
  width:4px; height:4px; border-radius:50%; background:var(--lime);
  animation:pulse 1.8s ease-in-out infinite;
}

/* ── Expandable detail panel ── */
.cs-detail {
  max-height:0; overflow:hidden;
  transition:max-height .55s cubic-bezier(.4,0,.2,1);
}
.cs-file.cs-active .cs-detail { max-height:600px; }

.cs-detail-inner {
  border-top:1px solid rgba(0,51,255,.1);
  display:grid; grid-template-columns:1fr 1fr;
  gap:0;
}
.cs-detail-left {
  padding:32px 40px 36px;
  border-right:1px solid rgba(0,51,255,.1);
}
.cs-detail-right {
  padding:32px 40px 36px;
  background:rgba(255,255,255,.015);
}

/* Left: narrative + tags */
.cs-detail-eyebrow {
  font-size:9.5px; font-weight:900; letter-spacing:.18em;
  text-transform:uppercase; color:rgba(151,125,255,.45);
  margin-bottom:10px;
}
.cs-detail-text {
  font-size:14px; color:var(--text-muted); line-height:1.8;
  margin-bottom:24px;
}
.cs-detail-tags { display:flex; gap:7px; flex-wrap:wrap; margin-bottom:24px; }
.cs-detail-tag {
  font-size:10.5px; font-weight:700; padding:5px 13px; border-radius:999px;
  background:rgba(0,51,255,.055); border:1px solid rgba(255,255,255,.09);
  color:rgba(30,41,59,.45);
}
.cs-detail-link {
  display:inline-flex; align-items:center; gap:8px;
  font-size:12.5px; font-weight:800; color:var(--lime);
  letter-spacing:.04em; text-transform:uppercase; text-decoration:none;
  transition:gap .22s;
}
.cs-detail-link:hover { gap:13px; }
.cs-detail-link svg { width:14px; height:14px; fill:none; stroke:var(--lime); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }

/* Right: 2x2 metric grid */
.cs-detail-metrics {
  display:grid; grid-template-columns:1fr 1fr;
  gap:1px; background:rgba(0,51,255,.055);
  border-radius:16px; overflow:hidden; height:fit-content;
}
.cs-dm {
  background:rgba(0,51,255,.025); padding:20px 22px;
  transition:background .3s;
}
.cs-dm:hover { background:rgba(151,125,255,.05); }
.cs-dm-val {
  font-size:26px; font-weight:900; color:#1e293b;
  letter-spacing:-.04em; line-height:1; margin-bottom:4px;
}
.cs-dm-val em { font-style:normal; color:var(--lime); }
.cs-dm-lbl {
  font-size:10.5px; font-weight:600; color:rgba(30,41,59,.28);
  letter-spacing:.05em; text-transform:uppercase;
}

/* ── Bottom CTA strip ── */
.cs-cta-strip {
  margin-top:56px;
  display:flex; align-items:center; justify-content:space-between;
  background:rgba(151,125,255,.04); border:1px solid rgba(151,125,255,.14);
  border-radius:20px; padding:28px 40px; gap:32px; flex-wrap:wrap;
}
.cs-cta-label {
  font-size:9.5px; font-weight:900; letter-spacing:.16em;
  text-transform:uppercase; color:rgba(151,125,255,.45); margin-bottom:8px;
}
.cs-cta-title {
  font-size:clamp(16px,2vw,22px); font-weight:900; color:#1e293b;
  line-height:1.3; letter-spacing:-.02em;
}
.cs-cta-sub {
  font-size:13.5px; color:var(--text-muted); margin-top:6px; line-height:1.6;
}
.cs-cta-btns { display:flex; gap:12px; flex-shrink:0; }
.cs-cta-primary {
  display:inline-flex; align-items:center; gap:10px;
  background:linear-gradient(135deg, #3B82F6 0%, #0B00AB 100%); 
  border-radius:999px;
  padding:12px 28px; font-size:13.5px; font-weight:800;
  color:#ffffff; border:none; cursor:pointer;
  font-family:'Manrope',sans-serif; white-space:nowrap;
  text-decoration:none;
  transition:all .3s cubic-bezier(.22,.68,0,1.2);
  box-shadow: 0 4px 16px rgba(0,51,255,.25);
}
.cs-cta-primary:hover { 
  transform:scale(1.05) translateY(-2px); 
  box-shadow:0 8px 32px rgba(151,125,255,.4); 
  background:linear-gradient(135deg, #0B00AB 0%, #00033D 100%);
}
.cs-cta-primary svg { width:13px; height:13px; fill:none; stroke:#ffffff; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.cs-cta-ghost {
  display:inline-flex; align-items:center; gap:8px;
  padding:12px 24px; border-radius:999px; cursor:pointer;
  font-size:13px; font-weight:800; color:rgba(30,41,59,.65);
  border:1.5px solid rgba(255,255,255,.15); background:transparent;
  font-family:'Manrope',sans-serif; white-space:nowrap;
  text-decoration:none;
  transition:border-color .25s, color .25s, background .25s;
}
.cs-cta-ghost:hover { border-color:rgba(30,41,59,.35); color:#1e293b; background:rgba(0,51,255,.055); }

/* Reveal animation delays */
.cs-r1{transition-delay:.04s} .cs-r2{transition-delay:.1s}
.cs-r3{transition-delay:.16s} .cs-r4{transition-delay:.22s}
.cs-r5{transition-delay:.28s} .cs-r6{transition-delay:.34s}

/* ── Case Studies See-All Wall ── */
.cs-see-all-wall {
  position: relative;
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}
.cs-see-all-wall.cs-wall-gone { display: none; }

.cs-ghost-items {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 12px;
  pointer-events: none;
  user-select: none;
}
.cs-ghost-file {
  background: #ffffff;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 20px;
  padding: 28px 40px;
  display: grid;
  grid-template-columns: 88px 1fr auto;
  align-items: center;
  gap: 0;
  filter: blur(3.5px);
  opacity: 0.4;
}
.cs-ghost-index { display:flex; flex-direction:column; gap:6px; padding-right:28px; border-right:1px solid rgba(0,51,255,.1); }
.cs-ghost-num { width:40px; height:28px; border-radius:6px; background:rgba(0,51,255,.1); }
.cs-ghost-year { width:28px; height:8px; border-radius:4px; background:rgba(0,51,255,.07); }
.cs-ghost-mid { padding:0 32px; display:flex; flex-direction:column; gap:10px; }
.cs-ghost-tag { width:80px; height:10px; border-radius:999px; background:rgba(151,125,255,.1); }
.cs-ghost-title { width:70%; height:16px; border-radius:6px; background:rgba(255,255,255,.12); }
.cs-ghost-chips { display:flex; gap:6px; }
.cs-ghost-chip { width:60px; height:10px; border-radius:999px; background:rgba(0,51,255,.07); }
.cs-ghost-right { padding-left:32px; border-left:1px solid rgba(0,51,255,.1); min-width:180px; display:flex; flex-direction:column; align-items:flex-end; gap:8px; }
.cs-ghost-kpi { width:90px; height:40px; border-radius:8px; background:rgba(0,51,255,.1); }
.cs-ghost-bar-row { display:flex; align-items:flex-end; gap:2px; height:28px; }
.cs-ghost-bar { width:6px; border-radius:3px 3px 0 0; background:rgba(0,51,255,.08); }

.cs-ghost-fade {
  position: absolute;
  bottom: 100px; left: 0; right: 0;
  height: 200px;
  background: linear-gradient(to bottom, transparent 0%, rgba(242,230,238,.97) 100%);
  pointer-events: none;
  z-index: 1;
}
.cs-unlock-btn {
  position: relative; z-index: 2;
  margin-top: -52px;
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 36px; border-radius: 999px; cursor: pointer;
  font-family: 'Manrope', sans-serif;
  font-size: 14px; font-weight: 800; letter-spacing: .02em;
  background:linear-gradient(135deg, #3B82F6 0%, #0B00AB 100%); 
  color: #ffffff; border: none;
  box-shadow: 0 8px 32px rgba(0,51,255,.35), 0 0 0 6px rgba(151,125,255,.08);
  transition: all .3s cubic-bezier(.22,.68,0,1.2);
}
.cs-unlock-btn:hover { 
  transform:scale(1.06) translateY(-2px); 
  box-shadow:0 12px 44px rgba(151,125,255,.48), 0 0 0 10px rgba(151,125,255,.12); 
  background:linear-gradient(135deg, #0B00AB 0%, #00033D 100%);
}
.cs-unlock-btn svg { width:16px; height:16px; fill:none; stroke:#ffffff; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.cs-unlock-count { display:inline-flex; align-items:center; justify-content:center; background:rgba(255,255,255,.25); border-radius:999px; padding:2px 10px; font-size:12px; font-weight:900; letter-spacing:.04em; }

.cs-file-hidden { display: none; }
.cs-file-hidden.cs-file-revealed {
  display: block;
  animation: csFileSlideIn .45s cubic-bezier(.22,.68,0,1.2) both;
}
@keyframes csFileSlideIn {
  from { opacity:0; transform:translateY(18px); }
  to   { opacity:1; transform:translateY(0); }
}

@media(max-width:1024px){
  .cs-inner { padding:0 28px; }
  .cs-file-row { grid-template-columns:72px 1fr auto; padding:20px 24px 20px 32px; }
}
@media(max-width:768px){
  .cs-section { padding:72px 0 90px; }
  .cs-header { flex-direction:column; align-items:flex-start; }
  .cs-header-right { align-items:flex-start; }
  .cs-header-desc { text-align:left; }
  .cs-file-row { grid-template-columns:1fr; gap:16px; }
  .cs-file-index { border-right:none; padding-right:0; flex-direction:row; align-items:center; gap:10px; }
  .cs-file-result { border-left:none; align-items:flex-start; padding-left:0; min-width:unset; }
  .cs-detail-inner { grid-template-columns:1fr; }
  .cs-detail-left { border-right:none; border-bottom:1px solid rgba(0,51,255,.1); }
  .cs-cta-strip { flex-direction:column; align-items:flex-start; }
  .cs-file-kpi-val { text-align:left; }
}

/* ══ HOW IT WORKS — SLIDE REDESIGN ══ */
.hiw-section {
  position: relative;
  padding: 50px 52px;
  overflow: hidden;
  background: linear-gradient(135deg, #2E2AFF 0%, #2E2AFF 100%);
}
.hiw-noise {
  position:absolute; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity:.08; pointer-events:none; z-index:0;
}
.hiw-grid-overlay {
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(151,125,255,.015) 1px,transparent 1px),
    linear-gradient(90deg,rgba(151,125,255,.015) 1px,transparent 1px);
  background-size:72px 72px; pointer-events:none; z-index:0;
}
.hiw-bg-orb { position:absolute; border-radius:50%; pointer-events:none; z-index:0; }
.hiw-orb1 {
  width:700px; height:700px; top:-200px; right:-250px;
  background:radial-gradient(circle, rgba(151,125,255,.08) 0%, transparent 65%);
}
.hiw-orb2 {
  width:600px; height:600px; bottom:-150px; left:-200px;
  background:radial-gradient(circle, rgba(151,125,255,.06) 0%, transparent 65%);
}

.hiw-inner {
  position:relative; z-index:2;
  max-width:1240px; margin:0 auto; padding:0 52px;
}

/* ── Header ── */
.hiw-header {
  text-align:center; margin-bottom:72px;
}
.hiw-header .eyebrow { margin-bottom:16px; }
.hiw-heading {
  font-size:clamp(38px,5.5vw,72px); font-weight:900; color:#ffffff;
  letter-spacing:-.03em; line-height:1.05; margin-bottom:18px;
}
.hiw-lime { color:#C8FF00; }
.hiw-subtext {
  font-size:16px; color:#ffffff; max-width:440px; margin:0 auto; line-height:1.7;
}

/* ── Slide Carousel Shell ── */
.hiw-slides-shell {
  position:relative;
}

/* Progress bar + nav row */
.hiw-slides-nav {
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:36px; gap:24px;
}
.hiw-slides-counter {
  font-size:13px; font-weight:800; letter-spacing:.14em;
  color:#ffffff; white-space:nowrap; font-variant-numeric:tabular-nums;
}
.hiw-slides-counter span { color:#ffffff; }
.hiw-progress-track {
  flex:1; height:2px; background:rgba(0,51,255,.08); border-radius:999px; overflow:hidden;
}
.hiw-progress-bar {
  height:100%; background:#ffffff; border-radius:999px;
  transition:width .55s cubic-bezier(.4,0,.2,1);
  width:20%;
}
.hiw-arrow-group { display:flex; gap:10px; }
.hiw-arrow {
  width:44px; height:44px; border-radius:50%;
  background:rgba(0,51,255,.055); border:1px solid rgba(0,51,255,.18);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; transition:background .25s, border-color .25s, transform .25s;
}
.hiw-arrow:hover {
  background:rgba(151,125,255,.12); border-color:rgba(151,125,255,.35);
  transform:scale(1.08);
}
.hiw-arrow svg { width:16px; height:16px; fill:none; stroke:#fff; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

/* Viewport + track */
.hiw-slides-viewport {
  overflow:hidden; border-radius:28px;
}
.hiw-slides-track {
  display:flex; transition:transform .55s cubic-bezier(.4,0,.2,1);
  will-change:transform;
}

/* ── Individual Slide ── */
.hiw-slide {
  flex:0 0 100%; min-width:0;
  display:grid;
  grid-template-columns:1fr 1fr;
  min-height:380px;
  border-radius:28px; overflow:hidden;
}

/* Left panel — big visual */
.hiw-slide-visual {
  position:relative;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:52px 48px;
  background:#f2f3ff45;
  border:1px solid rgba(0,51,255,.12);
  border-right:none; border-radius:28px 0 0 28px;
  overflow:hidden;
}
.hiw-slide-visual::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(140deg, rgba(151,125,255,.07) 0%, transparent 55%);
}
.hiw-slide-num-big {
  position:absolute; top:0px; right:30px;
  font-size:200px; font-weight:900; line-height:1;
  color:#c8ff00ab; pointer-events:none; user-select:none;
  letter-spacing:-.06em;
}
.hiw-slide-icon {
  width:80px; height:80px; border-radius:22px;
  display:flex; align-items:center; justify-content:center; font-size:36px;
  background:#c8ff00ab; border:1px solid rgba(151,125,255,.22);
  margin-bottom:32px; position:relative; z-index:1;
  box-shadow:0 0 40px rgba(151,125,255,.08);
}
.hiw-slide-phase {
  font-size:10px; font-weight:900; letter-spacing:.22em; text-transform:uppercase;
  color:white; margin-bottom:10px; position:relative; z-index:1;
}
.hiw-slide-big-title {
  font-size:clamp(26px,3.2vw,42px); font-weight:900; color:#ffffff;
  line-height:1.1; letter-spacing:-.025em; position:relative; z-index:1;
  margin-bottom:16px;
}
.hiw-slide-timeline {
  display:inline-flex; align-items:center; gap:8px;
  background:#c8ff00; border:1px solid rgba(151,125,255,.2);
  color:var(--lime); font-size:12px; font-weight:800;
  padding:6px 16px; border-radius:999px; position:relative; z-index:1;
}
.hiw-slide-timeline svg { width:12px; height:12px; fill:none; stroke:currentColor; stroke-width:2; }

/* Right panel — content */
.hiw-slide-content {
  display:flex; flex-direction:column; justify-content:center;
  padding:52px 52px;
  background:#f2f3ff45;
  border:1px solid rgba(0,51,255,.12);
  border-left:1px solid rgba(151,125,255,.1);
  border-radius:0 28px 28px 0;
  position:relative; overflow:hidden;
}
.hiw-slide-content::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(220deg, rgba(151,125,255,.04) 0%, transparent 60%);
}
.hiw-slide-desc {
  font-size:15.5px; color:var(--text-muted); line-height:1.8;
  margin-bottom:32px; position:relative; z-index:1;
}
.hiw-slide-pills {
  display:flex; flex-wrap:wrap; gap:8px; margin-bottom:32px;
  position:relative; z-index:1;
}
.hiw-pill {
  font-size:11.5px; font-weight:700; padding:6px 14px; border-radius:999px;
  background:#ffffff; border:1px solid rgba(0,51,255,.18);
  color:rgb(30, 41, 59); letter-spacing:.02em;
}
.hiw-pill-lime {
  background:rgba(151,125,255,.1) !important;
  border-color:rgba(151,125,255,.25) !important;
  color:var(--lime) !important;
}

/* Stat strip */
.hiw-slide-stats {
  display:flex; gap:28px; position:relative; z-index:1;
  padding-top:28px;
  border-top:1px solid rgba(0,51,255,.1);
}
.hiw-stat-item { display:flex; flex-direction:column; gap:4px; }
.hiw-stat-value {
  font-size:22px; font-weight:900; color:#ffffff; letter-spacing:-.03em;
  line-height:1;
}
.hiw-stat-value span { color:white; }
.hiw-stat-label {
  font-size:11px; font-weight:600; color:rgb(255, 255, 255);
  letter-spacing:.04em; text-transform:uppercase;
}

/* ── Dots nav ── */
.hiw-dots {
  display:flex; justify-content:center; gap:8px; margin-top:32px;
}
.hiw-dot {
  width:8px; height:8px; border-radius:999px;
  background:rgba(0,51,255,.1); cursor:pointer;
  transition:width .35s cubic-bezier(.4,0,.2,1), background .35s;
}
.hiw-dot.hiw-dot-active {
  width:28px; background:var(--lime);
}

/* ── Bottom CTA ── */
.hiw-bottom {
  margin-top:80px;
}
.hiw-bottom-card {
  position:relative; overflow:hidden;
  background:rgba(151,125,255,.06);
  border:1px solid rgba(151,125,255,.2);
  border-radius:28px;
  padding:44px 52px;
  display:flex; align-items:center; justify-content:space-between; gap:40px;
  flex-wrap:wrap;
}
.hiw-bottom-orb {
  position:absolute; top:-80px; right:-80px;
  width:300px; height:300px; border-radius:50%;
  background:radial-gradient(circle, rgba(151,125,255,.12) 0%, transparent 65%);
  pointer-events:none;
}
.hiw-bottom-title {
  font-size:clamp(20px,2.4vw,28px); font-weight:800; color:#1e293b;
  margin-bottom:8px;
}
.hiw-bottom-sub {
  font-size:14.5px; color:var(--text-muted); line-height:1.6; max-width:420px;
}

/* Reveal delays */
.hiw-r1{transition-delay:.05s}.hiw-r2{transition-delay:.15s}
.hiw-r3{transition-delay:.25s}.hiw-r4{transition-delay:.35s}
.hiw-r5{transition-delay:.45s}.hiw-r6{transition-delay:.55s}.hiw-r7{transition-delay:.65s}

@media(max-width:900px){
  .hiw-slide { grid-template-columns:1fr; min-height:auto; }
  .hiw-slide-visual { border-right:1px solid rgba(0,51,255,.1); border-bottom:none; border-radius:28px 28px 0 0; padding:40px 36px; }
  .hiw-slide-content { border-left:none; border-top:1px solid rgba(151,125,255,.1); border-radius:0 0 28px 28px; padding:40px 36px; }
  .hiw-slide-num-big { font-size:140px; }
  .hiw-inner { padding:0 24px; }
}
@media(max-width:580px){
  .hiw-section { padding:70px 0 90px; }
  .hiw-bottom-card { padding:32px 28px; flex-direction:column; align-items:flex-start; }
  .hiw-slide-stats { flex-wrap:flex; gap:20px; }
  .hiw-slides-nav { flex-wrap:wrap; }
}
/* ═══════════════════════════
   TESTIMONIALS
═══════════════════════════ */
.tst-section {
  position: relative;
  padding: 50px 52px;
  overflow: hidden;
  background:#f2f3ff;
}

/* — backgrounds — */
.tst-section::before {
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity:.1;
}
.tst-section::after {
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(151,125,255,.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(151,125,255,.02) 1px, transparent 1px);
  background-size:72px 72px;
}
.tst-orb-l {
  position:absolute; z-index:0; pointer-events:none;
  width:700px; height:700px; border-radius:50%;
  top:-200px; left:-200px;
  background:radial-gradient(circle, rgba(151,125,255,.065) 0%, transparent 62%);
}
.tst-orb-r {
  position:absolute; z-index:0; pointer-events:none;
  width:500px; height:500px; border-radius:50%;
  bottom:-100px; right:-100px;
  background:radial-gradient(circle, rgba(151,125,255,.055) 0%, transparent 62%);
}

.tst-inner {
  position:relative; z-index:2;
  max-width:1180px; margin:0 auto;
}

/* ── Header ── */
.tst-header {
  display:grid; grid-template-columns:1fr auto; align-items:end;
  margin-bottom:80px; gap:40px;
}
.tst-eyebrow-wrap .eyebrow { margin-bottom:16px; }
.tst-heading {
  font-size:clamp(34px,5vw,66px); font-weight:900;
  color:#1e293b; letter-spacing:-.035em; line-height:1.04;
}
.tst-heading-accent { color:var(--lime); }
.tst-header-right { display:flex; flex-direction:column; gap:10px; align-items:flex-end; }

/* stars + score badge */
.tst-score-block {
  display:flex; align-items:center; gap:16px;
  background:rgba(0,51,255,.04);
  border:1px solid rgba(0,51,255,.14);
  border-radius:18px; padding:16px 24px;
}
.tst-score-num {
  font-size:38px; font-weight:900; color:#1e293b; letter-spacing:-.04em; line-height:1;
}
.tst-score-num span { color:var(--lime); }
.tst-score-meta { display:flex; flex-direction:column; gap:4px; }
.tst-score-stars { display:flex; gap:3px; }
.tst-score-stars svg { width:15px; height:15px; fill:var(--lime); }
.tst-score-label { font-size:11.5px; font-weight:600; color:rgba(30,41,59,.4); white-space:nowrap; }

/* ── Main Layout: left panel + right stack ── */
.tst-main {
  display:grid;
  grid-template-columns: 1.12fr 1fr;
  gap:24px;
  margin-bottom:24px;
}

/* ── Left: big spotlight card ── */
.tst-spotlight {
  position:relative; overflow:hidden;
  border-radius:28px;
  background: linear-gradient(145deg, rgba(151,125,255,.09) 0%, rgba(151,125,255,.03) 60%, transparent 100%);
  border:1px solid rgba(151,125,255,.22);
  padding:54px 52px 48px;
  display:flex; flex-direction:column; justify-content:space-between;
  min-height:480px;
  cursor:default;
  transition:border-color .4s, box-shadow .4s;
}
.tst-spotlight:hover {
  border-color:rgba(151,125,255,.4);
  box-shadow:0 32px 80px rgba(0,0,0,.45), 0 0 60px rgba(151,125,255,.06);
}
/* huge decorative quote mark */
.tst-deco-quote {
  position:absolute; top:16px; left:36px;
  font-size:220px; line-height:1; font-weight:900;
  color:rgba(151,125,255,.07); pointer-events:none; user-select:none;
  font-family:'Manrope',sans-serif; letter-spacing:-.05em;
}
/* corner accent dots */
.tst-spotlight-dot {
  position:absolute; width:6px; height:6px; border-radius:50%;
  background:rgba(151,125,255,.5);
}
.tst-spotlight-dot:nth-child(3){top:18px;right:18px;}
.tst-spotlight-dot:nth-child(4){bottom:18px;left:18px;}

.tst-spotlight-quote {
  position:relative; z-index:1;
  font-size:clamp(17px,1.7vw,22px); font-weight:700; color:#1e293b;
  line-height:1.6; letter-spacing:-.012em; flex:1; margin-bottom:40px;
}
.tst-spotlight-quote em { font-style:normal; color:var(--lime); }

.tst-spotlight-footer {
  display:flex; align-items:center; justify-content:space-between;
  position:relative; z-index:1;
  padding-top:28px;
  border-top:1px solid rgba(255,255,255,.08);
}
.tst-spotlight-author { display:flex; align-items:center; gap:16px; }
.tst-spotlight-avatar {
  width:54px; height:54px; border-radius:50%; flex-shrink:0;
  background:rgba(151,125,255,.14); border:2px solid rgba(151,125,255,.35);
  display:flex; align-items:center; justify-content:center; font-size:22px;
}
.tst-spotlight-name { font-size:15px; font-weight:800; color:#1e293b; }
.tst-spotlight-role { font-size:12px; color:rgba(30,41,59,.4); margin-top:3px; }
.tst-spotlight-badge {
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(151,125,255,.1); border:1px solid rgba(151,125,255,.25);
  color:var(--lime); font-size:11px; font-weight:800;
  letter-spacing:.1em; text-transform:uppercase;
  padding:6px 14px; border-radius:999px;
}
.tst-spotlight-badge-dot { width:5px; height:5px; border-radius:50%; background:var(--lime); animation:pulse 2s ease-in-out infinite; }

/* Result chip inside spotlight */
.tst-result-chip {
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(151,125,255,.08); border:1px solid rgba(151,125,255,.18);
  border-radius:14px; padding:12px 18px; margin-bottom:24px;
  position:relative; z-index:1;
}
.tst-result-chip-num { font-size:22px; font-weight:900; color:var(--lime); line-height:1; }
.tst-result-chip-label { font-size:12px; color:rgba(30,41,59,.5); font-weight:600; line-height:1.3; }

/* ════════════════════════════════
   VIDEO REVIEWS — HORIZONTAL SCROLL
════════════════════════════════ */
.vr-wrap { margin-bottom: 28px; }

.vr-scroll-outer {
  position: relative;
}

/* Scrollable track */
.vr-track {
  display: flex;
  gap: 18px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 6px 2px 14px;
  cursor: grab;
}
.vr-track:active { cursor: grabbing; }
.vr-track::-webkit-scrollbar { display: none; }

/* Card */
.vr-card {
  flex: 0 0 280px;
  scroll-snap-align: start;
  border-radius: 22px;
  background: #ffffff;
  border: 1px solid rgba(255,255,255,.08);
  overflow: hidden;
  transition: border-color .3s, box-shadow .3s, transform .3s cubic-bezier(.22,.68,0,1.2);
}
.vr-card:hover {
  border-color: rgba(151,125,255,.3);
  box-shadow: 0 20px 56px rgba(0,0,0,.55), 0 0 0 1px rgba(151,125,255,.07);
  transform: translateY(-5px);
}

/* Video box — portrait 9:16 */
.vr-video-box {
  position: relative;
  aspect-ratio: 16/16;
  background: #F2E6EE;
  overflow: hidden;
  cursor: pointer;
}

/* The actual <video> */
.vr-vid {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}

/* Overlay shown before & after play */
.vr-thumb-overlay {
  position: absolute; inset: 0;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 12px;
  transition: opacity .35s;
  pointer-events: none;
  z-index: 3;
}
.vr-thumb-gradient {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.72) 0%, rgba(0,0,0,.25) 50%, rgba(0,0,0,.18) 100%);
}
/* Hide overlay when playing */
.vr-video-box.playing .vr-thumb-overlay { opacity: 0; }

/* Big lime play ring */
.vr-play-ring {
  position: relative; z-index: 1;
  width: 62px; height: 62px; border-radius: 50%;
  background: #2E2AFF;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 0 12px rgba(151,125,255,.15), 0 8px 32px rgba(0,0,0,.6);
  transition: transform .3s cubic-bezier(.22,.68,0,1.2), box-shadow .3s;
}
.vr-video-box:hover .vr-play-ring {
  transform: scale(1.1);
  box-shadow: 0 0 0 18px rgba(151,125,255,.12), 0 12px 40px rgba(0,0,0,.7);
}
.vr-play-ring svg {
  width: 22px; height: 22px; fill: #ffffff; margin-left: 4px;
}
/* Pause icon when playing */
.vr-video-box.playing .vr-play-ring svg { display: none; }
.vr-video-box.playing .vr-play-ring::before,
.vr-video-box.playing .vr-play-ring::after {
  content: '';
  display: block; width: 5px; height: 20px;
  background: rgba(255,255,255,.6); border-radius: 2px;
  position: absolute;
}
.vr-video-box.playing .vr-play-ring::before { left: calc(50% - 8px); }
.vr-video-box.playing .vr-play-ring::after  { left: calc(50% + 3px); }
/* Show ring on hover even while playing */
.vr-video-box.playing:hover .vr-thumb-overlay { opacity: 1; }

.vr-thumb-label {
  position: relative; z-index: 1;
  font-size: 11px; font-weight: 800; letter-spacing: .12em;
  text-transform: uppercase; color: rgba(255,255,255,.7);
}
.vr-video-box.playing .vr-thumb-label { content: 'Pause'; }

/* Progress bar at bottom of video */
.vr-prog-bar {
  position: absolute; bottom: 0; left: 0; right: 0;
  height: 3px; background: rgba(0,51,255,.1); z-index: 4;
}
.vr-prog-fill {
  height: 100%; width: 0%;
  background: var(--lime);
  border-radius: 0 2px 2px 0;
  transition: width .25s linear;
}

/* Mute button */
.vr-mute-btn {
  position: absolute; bottom: 12px; right: 10px;
  width: 30px; height: 30px; border-radius: 50%;
  background: rgba(15,23,42,.7); border: 1px solid rgba(255,255,255,.12);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; z-index: 5;
  transition: background .2s, transform .2s;
}
.vr-mute-btn:hover { background: rgba(151,125,255,.2); transform: scale(1.1); }
.vr-mute-btn svg {
  width: 13px; height: 13px; fill: none;
  stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}

/* Info section */
.vr-info {
  padding: 16px 18px 18px;
  display: flex; flex-direction: column; gap: 9px;
}
.vr-info-row { display: flex; align-items: center; gap: 10px; }
.vr-av {
  width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0;
  background: rgba(151,125,255,.12); border: 1.5px solid rgba(151,125,255,.25);
  display: flex; align-items: center; justify-content: center; font-size: 15px;
}
.vr-meta { flex: 1; min-width: 0; }
.vr-name { font-size: 12.5px; font-weight: 800; color: #1e293b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vr-role { font-size: 10px; color: #1e293b; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vr-stars { font-size: 10px; color: var(--lime); flex-shrink: 0; letter-spacing: 1px; }

.vr-quote {
  font-size: 12px; color: #1e293b; line-height: 1.6;
  font-style: italic; margin: 0;
}
.vr-quote em { font-style: normal; color: #1e293b; font-weight: 700; }

.vr-footer {
  display: flex; align-items: center; justify-content: space-between;
  padding-top: 10px; border-top: 1px solid rgba(2, 2, 2, 0.06);
}
.vr-kpi { display: flex; align-items: baseline; gap: 5px; }
.vr-kpi-n { font-size: 19px; font-weight: 900; color: var(--lime); letter-spacing: -.03em; line-height: 1; }
.vr-kpi-l { font-size: 9.5px; color: rgba(255,255,255,.35); font-weight: 600; }
.vr-badge {
  font-size: 8.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
  color: #3B82F6;
  background: rgba(151,125,255,.08); border: 1px solid rgba(151,125,255,.18);
  padding: 3px 9px; border-radius: 999px;
}

/* Nav arrows */
.vr-arr {
  position: absolute; top: 42%;
  transform: translateY(-50%);
  width: 38px; height: 38px; border-radius: 50%;
  background: rgba(12,12,12,.8); border: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; z-index: 10;
  transition: background .2s, border-color .2s, transform .2s cubic-bezier(.22,.68,0,1.2);
}
.vr-arr:hover { background: rgba(151,125,255,.15); border-color: rgba(151,125,255,.4); transform: translateY(-50%) scale(1.1); }
.vr-arr svg { width: 15px; height: 15px; fill: none; stroke: #fff; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.vr-arr-l { left: -14px; }
.vr-arr-r { right: -14px; }

/* Dots */
.vr-dots {
  display: flex; align-items: center; justify-content: center;
  gap: 6px; margin-top: 14px;
}
.vr-dot {
  height: 6px; width: 6px; border-radius: 999px;
  background: rgba(0,51,255,.1); border: none; cursor: pointer; padding: 0;
  transition: background .3s, width .35s cubic-bezier(.22,.68,0,1.2);
}
.vr-dot.vr-dot-on { background: var(--lime); width: 22px; }

/* ── Right: stacked cards ── */
.tst-stack {
  display:flex; flex-direction:column; gap:20px;
}

/* Standard card */
.tst-card {
  position:relative; overflow:hidden;
  background:#ffffff;
  border:1px solid rgba(0,51,255,.14);
  border-radius:22px; padding:28px 30px;
  display:flex; flex-direction:column; gap:16px;
  transition:background .35s, border-color .35s, transform .35s, box-shadow .35s;
  cursor:default; flex:1;
}
.tst-card::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse 80% 60% at 50% -10%, rgba(151,125,255,.07), transparent);
  opacity:0; transition:opacity .4s; pointer-events:none;
}
/* shine sweep */
.tst-card::after {
  content:''; position:absolute; top:0; left:-100%; width:55%; height:100%;
  background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.035) 50%,transparent 60%);
  transition:left .7s ease; pointer-events:none;
}
.tst-card:hover { background:#e8f0fe; border-color:rgba(151,125,255,.26); transform:translateX(5px); box-shadow:0 16px 48px rgba(0,0,0,.32); }
.tst-card:hover::before { opacity:1; }
.tst-card:hover::after { left:140%; }

/* left accent bar */
.tst-card-bar {
  position:absolute; left:0; top:22%; bottom:22%; width:3px; border-radius:999px;
  background:rgba(0,51,255,.08);
  transition:background .4s, top .4s, bottom .4s;
}
.tst-card:hover .tst-card-bar { background:var(--lime); top:12%; bottom:12%; }

.tst-card-top { display:flex; align-items:center; justify-content:space-between; }
.tst-card-author { display:flex; align-items:center; gap:12px; }
.tst-card-av {
  width:42px; height:42px; border-radius:50%; flex-shrink:0;
  background:rgba(151,125,255,.1); border:1.5px solid rgba(151,125,255,.18);
  display:flex; align-items:center; justify-content:center; font-size:17px;
  transition:transform .3s;
}
.tst-card:hover .tst-card-av { transform:scale(1.1) rotate(-5deg); }
.tst-card-name { font-size:14px; font-weight:800; color:#1e293b; }
.tst-card-sub { font-size:11px; color:rgba(30,41,59,.38); margin-top:2px; }
.tst-card-stars { display:flex; gap:2px; }
.tst-card-stars svg { width:12px; height:12px; fill:var(--lime); }

.tst-card-text {
  font-size:13.5px; color:rgba(30,41,59,.68); line-height:1.75; flex:1;
}
.tst-card-qmark {
  font-size:44px; line-height:.7; color:rgba(151,125,255,.18); font-weight:900;
  display:block; margin-bottom:4px; pointer-events:none;
}

.tst-card-foot {
  display:flex; align-items:center; justify-content:space-between;
  padding-top:14px; border-top:1px solid rgba(255,255,255,.055);
}
.tst-card-co { font-size:10.5px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; color:rgba(151,125,255,.55); }
.tst-card-vert {
  font-size:10px; font-weight:700; padding:3px 10px; border-radius:999px;
  background:rgba(0,51,255,.055); border:1px solid rgba(0,51,255,.14);
  color:rgba(30,41,59,.38); letter-spacing:.05em;
}

/* ── Bottom row: 3 equal cards ── */
.tst-row3 {
  display:grid; grid-template-columns:repeat(3,1fr); gap:20px;
  margin-bottom:24px;
}

/* ── Ticker strip ── */
.tst-ticker-wrap {
  overflow:hidden; position:relative;
  -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 7%,#000 93%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0%,#000 7%,#000 93%,transparent 100%);
}
.tst-ticker-track {
  display:flex; gap:14px; width:max-content;
  animation:tstTick 44s linear infinite;
}
.tst-ticker-wrap:hover .tst-ticker-track { animation-play-state:paused; }
@keyframes tstTick { from{transform:translateX(0)} to{transform:translateX(-50%)} }

.tst-tick-card {
  flex-shrink:0; width:280px;
  background:rgba(255,255,255,.028); border:1px solid rgba(0,51,255,60%);
  border-radius:16px; padding:18px 20px; display:flex; flex-direction:column; gap:10px;
  transition:background .3s, border-color .3s;
  cursor:default;
}
.tst-tick-card:hover { background:rgba(151,125,255,.04); border-color:rgba(151,125,255,.18); }
.tst-tick-top { display:flex; align-items:center; gap:10px; }
.tst-tick-av {
  width:32px; height:32px; border-radius:50%; flex-shrink:0;
  background:rgba(151,125,255,.1); border:1px solid rgba(151,125,255,.15);
  display:flex; align-items:center; justify-content:center; font-size:13px;
}
.tst-tick-name { font-size:12.5px; font-weight:800; color:#1e293b; }
.tst-tick-co { font-size:10px; color:rgba(30,41,59,.35); margin-top:1px; }
.tst-tick-stars { display:flex; gap:2px; }
.tst-tick-stars svg { width:9px; height:9px; fill:var(--lime); }
.tst-tick-text { font-size:12px; color:rgba(30,41,59,.5); line-height:1.65; }

/* ── Reveal helpers ── */
.tst-v1{transition-delay:.05s} .tst-v2{transition-delay:.14s}
.tst-v3{transition-delay:.23s} .tst-v4{transition-delay:.32s}
.tst-v5{transition-delay:.41s} .tst-v6{transition-delay:.50s}
.tst-v7{transition-delay:.59s} .tst-v8{transition-delay:.68s}
.tst-v9{transition-delay:.77s}

/* ── Responsive ── */
@media(max-width:1020px){
  .tst-section { padding:90px 28px; }
  .tst-main { grid-template-columns:1fr; }
  .tst-spotlight { min-height:auto; }
  .tst-header { grid-template-columns:1fr; gap:24px; }
  .tst-header-right { align-items:flex-start; }
  .tst-row3 { grid-template-columns:1fr 1fr; }
}
@media(max-width:620px){
  .tst-row3 { grid-template-columns:1fr; }
  .tst-spotlight { padding:36px 28px; }
  .tst-deco-quote { font-size:130px; }
}
/* ═══════════════════════════════════
   PACKAGES
═══════════════════════════════════ */
.pkg-section {
  position: relative;
  padding: 50px 52px 50px;
  overflow: hidden;
  background: linear-gradient(135deg, #2E2AFF 0%, #2E2AFF 100%);
}

/* — Texture backgrounds — */
.pkg-section::before {
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity:.1;
}
.pkg-section::after {
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(151,125,255,.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(151,125,255,.02) 1px, transparent 1px);
  background-size:72px 72px;
}
.pkg-orb-tl {
  position:absolute; z-index:0; pointer-events:none;
  width:900px; height:900px; border-radius:50%;
  top:-300px; right:-200px;
}
.pkg-orb-br {
  position:absolute; z-index:0; pointer-events:none;
  width:520px; height:520px; border-radius:50%;
  bottom:-150px; right:-150px;
  background:radial-gradient(circle, rgba(151,125,255,.06) 0%, transparent 62%);
}

.pkg-inner {
  position: relative; z-index: 2;
  max-width: 1180px; margin: 0 auto;
}

/* ── Header ── */
.pkg-header {
  text-align: center;
  margin-bottom: 64px;
}
.pkg-header .eyebrow { margin-bottom: 16px; }
.pkg-heading {
  font-size: clamp(36px, 5.2vw, 68px);
  font-weight: 900; color: #ffffff;
  letter-spacing: -.035em; line-height: 1.04;
  margin-bottom: 16px;
}
.pkg-heading-lime { color: #C8FF00; }
.pkg-subtext {
  font-size: 16px; color: #ffffff; line-height: 1.7;
  max-width: 480px; margin: 0 auto 40px;
}

/* ── Billing toggle ── */
.pkg-toggle-wrap {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    background: rgba(0, 51, 255, .03);
    border: 1px solid rgb(255 255 255 / 51%);
    border-radius: 999px;
    padding: 6px 6px 6px 20px;
}
.pkg-toggle-label {
  font-size: 13px; font-weight: 700; color: #ffffff;
  transition: color .3s;
}
.pkg-toggle-label.active { color: #ffffff; }
.pkg-toggle-switch {
  position: relative; width: 48px; height: 26px; cursor: pointer;
}
.pkg-toggle-switch input { opacity: 0; width: 0; height: 0; }
.pkg-toggle-track {
  position: absolute; inset: 0;
  background: rgba(0,51,255,.1); border-radius: 999px;
  border: 1px solid rgba(255,255,255,.15);
  transition: background .3s, border-color .3s;
}
.pkg-toggle-switch input:checked ~ .pkg-toggle-track {
  background: rgba(151,125,255,.25);
  border-color: rgba(151,125,255,.4);
}
.pkg-toggle-thumb {
  position: absolute; top: 3px; left: 3px;
  width: 20px; height: 20px; border-radius: 50%;
  background: #fff; transition: transform .3s cubic-bezier(.4,0,.2,1), background .3s;
  pointer-events: none;
}
.pkg-toggle-switch input:checked ~ .pkg-toggle-track .pkg-toggle-thumb {
  transform: translateX(22px);
  background: #c8ff00;
}
.pkg-save-badge {
  font-size: 10.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  background: rgba(151,125,255,.12); border: 1px solid rgba(151,125,255,.25);
  color: #c8ff00; padding: 4px 12px; border-radius: 999px;
  opacity: 0; transform: scale(.85);
  transition: opacity .35s, transform .35s;
}
.pkg-save-badge.visible { opacity: 1; transform: scale(1); }

/* ── Cards grid ── */
.pkg-cards {
  display: grid;
  grid-template-columns: 1fr 1.08fr 1fr;
  gap: 20px;
  align-items: start;
}

/* ── Base card ── */
.pkg-card {
  position: relative; overflow: hidden;
  border-radius: 28px;
  background: #ffffff;
  border: 1px solid rgba(255,255,255,.09);
  padding: 40px 36px 36px;
  display: flex; flex-direction: column; gap: 0;
  transition: transform .4s cubic-bezier(.22,.68,0,1.2), box-shadow .4s, border-color .4s, background .4s;
  cursor: default;
}
.pkg-card::before {
  content:''; position:absolute; inset:0;
  background: radial-gradient(ellipse 80% 55% at 50% -5%, rgba(151,125,255,.06), transparent);
  opacity: 0; transition: opacity .4s; pointer-events:none;
}
/* shine sweep */
.pkg-card::after {
  content:''; position:absolute; top:0; left:-100%; width:60%; height:100%;
  background: linear-gradient(105deg, transparent 40%, rgba(255,255,255,.04) 50%, transparent 60%);
  transition: left .75s ease; pointer-events:none;
}
.pkg-card:hover { transform: translateY(-8px); box-shadow: 0 30px 80px rgba(0,0,0,.5); border-color: rgba(151,125,255,.22); background: #f0f6ff; }
.pkg-card:hover::before { opacity: 1; }
.pkg-card:hover::after { left: 140%; }

/* ── PRO card (featured, center) ── */
.pkg-card-pro {
  background: linear-gradient(160deg, rgba(151,125,255,.11) 0%, rgba(151,125,255,.04) 55%, rgba(0,0,0,.0) 100%);
  border: 1.5px solid rgba(151,125,255,.32);
  margin-top: -20px; /* Breaks grid slightly — taller */
  padding: 52px 40px 44px;
  box-shadow: 0 0 60px rgba(151,125,255,.06), 0 20px 60px rgba(0,0,0,.4);
}
.pkg-card-pro:hover {
  transform: translateY(-12px);
  box-shadow: 0 40px 100px rgba(0,0,0,.55), 0 0 80px rgba(151,125,255,.1);
  border-color: rgba(151,125,255,.55);
  background: #ffffff;
}

/* ── Popular badge ── */
.pkg-popular-badge {
  position: absolute; top: 15px; left: 50%; transform: translateX(-50%);
  display: inline-flex; align-items: center; gap: 7px;
  background: linear-gradient(135deg, #C8FF00 0%, #C8FF00 100%);
    color: #2E2AFF;
  font-size: 10.5px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase;
  padding: 6px 18px; border-radius: 999px;
  white-space: nowrap;
  box-shadow: 0 4px 20px rgba(151,125,255,.35);
}
.pkg-popular-pulse {
  width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.35);
  animation: pulse 1.8s ease-in-out infinite;
}

/* Top section of card */
.pkg-card-top { margin-bottom: 28px; }

.pkg-plan-tag {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 10px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase;
  padding: 5px 13px; border-radius: 999px; margin-bottom: 18px;
  background: #2E2AFF; border: 1px solid rgba(255,255,255,.1);
  color: white;
  transition: background .3s, color .3s, border-color .3s;
}
.pkg-card:hover .pkg-plan-tag { background: rgba(151,125,255,.08); border-color: rgba(151,125,255,.2); color: rgba(151,125,255,.8); }
.pkg-card-pro .pkg-plan-tag { background: rgba(151,125,255,.12); border-color: rgba(151,125,255,.3); color: var(--lime); }
.pkg-plan-tag-dot { width: 5px; height: 5px; border-radius: 50%; background: currentColor; }

.pkg-plan-name {
  font-size: clamp(22px, 2.4vw, 30px); font-weight: 900; color: #fff;
  letter-spacing: -.025em; line-height: 1.1; margin-bottom: 10px;
}
.pkg-plan-desc {
  font-size: 13.5px; color: var(--text-muted); line-height: 1.65;
}

/* ── Pricing ── */
.pkg-price-block {
  display: flex; align-items: flex-end; gap: 4px;
  margin: 28px 0 8px; line-height: 1;
}
.pkg-price-currency {
  font-size: 20px; font-weight: 800; color: rgba(255,255,255,.5);
  margin-bottom: 6px;
}
.pkg-price-num {
  font-size: clamp(42px, 4.5vw, 56px); font-weight: 900; color: #fff;
  letter-spacing: -.04em; line-height: 1; transition: color .3s;
}
.pkg-card-pro .pkg-price-num { color: var(--lime); }
.pkg-price-period { font-size: 14px; color: rgba(30,41,59,.45); font-weight: 600; margin-bottom: 8px; }

/* Annual price (hidden by default) */
.pkg-price-annual { display: none; }
.billing-annual .pkg-price-monthly { display: none; }
.billing-annual .pkg-price-annual { display: flex; }

.pkg-price-note {
  font-size: 11.5px; color: rgba(255,255,255,.3); font-weight: 600; margin-bottom: 28px;
}
.pkg-price-note-lime { color: #2E2AFF; }

/* ── Divider ── */
.pkg-divider {
  height: 1px; background: rgba(0,51,255,.07);
  margin: 24px 0; position: relative; overflow: visible;
}
.pkg-divider::after {
  content:''; position: absolute; left: 0; top: 0; height: 1px; width: 0%;
  background: linear-gradient(90deg, var(--lime), transparent);
  transition: width .6s ease;
}
.pkg-card:hover .pkg-divider::after { width: 60%; }

/* ── Features list ── */
.pkg-features { list-style: none; display: flex; flex-direction: column; gap: 13px; margin-bottom: 32px; }
.pkg-feature {
  display: flex; align-items: flex-start; gap: 12px;
  font-size: 13.5px; color: rgba(255,255,255,.72); line-height: 1.5;
  transition: color .3s;
}
.pkg-card:hover .pkg-feature { color: rgba(255,255,255,.85); }
.pkg-feature-icon {
  width: 20px; height: 20px; border-radius: 50%; flex-shrink: 0; margin-top: 1px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(151,125,255,.1); border: 1px solid rgba(151,125,255,.2);
  transition: background .3s, transform .3s;
}
.pkg-card:hover .pkg-feature-icon { background: rgba(151,125,255,.18); transform: scale(1.08); }
.pkg-card-pro .pkg-feature-icon { background: rgba(151,125,255,.16); border-color: rgba(151,125,255,.35); }
.pkg-feature-icon svg { width: 10px; height: 10px; fill: none; stroke: var(--lime); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.pkg-feature-muted { color: rgba(30,41,59,.35); }
.pkg-feature-muted .pkg-feature-icon { background: rgba(0,51,255,.03); border-color: rgba(255,255,255,.08); }
.pkg-feature-muted .pkg-feature-icon svg { stroke: rgba(255,255,255,.25); }

/* ── CTA button ── */
.pkg-cta {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  width: 100%; padding: 14px 24px; border-radius: 999px;
  font-family: 'Manrope', sans-serif; font-size: 14px; font-weight: 800;
  cursor: pointer; border: none; text-decoration: none;
  transition: transform .25s cubic-bezier(.22,.68,0,1.2), box-shadow .25s, background .25s;
  letter-spacing: .01em; margin-top: auto;
}
.pkg-cta-outline {
  background: transparent;
  border: 1.5px solid rgba(255,255,255,.2);
  color: rgba(30,41,59,.8);
}
.pkg-cta-outline:hover { background: rgba(0,51,255,.08); border-color: rgba(0,51,255,.4); color: #3B82F6; transform: scale(1.03); }
.pkg-cta-filled
 {
    background: #C8FF00;
    color: #000;
    box-shadow: 0 6px 28px rgb(0 51 255 / 55%);
}
.pkg-cta-filled:hover { 
  transform: scale(1.04) translateY(-2px); 
  box-shadow: 0 10px 40px rgba(151,125,255,.45); 
  background:linear-gradient(135deg,  #C8FF00 0%, #C8FF00 100%);
  color:#000;
}
.pkg-cta svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }

/* ── Corner accent on pro card ── */
.pkg-corner-accent {
  position: absolute; top: 0; right: 0;
  width: 120px; height: 120px; pointer-events: none;
  background: radial-gradient(circle at 100% 0%, rgba(151,125,255,.14) 0%, transparent 65%);
  border-radius: 0 28px 0 0;
}

/* ── Bottom comparison note ── */
.pkg-compare-row {
  display: grid; grid-template-columns: repeat(3,1fr); gap: 20px;
  margin-top: 28px;
}
.pkg-compare-cell {
  text-align: center; padding: 20px 16px;
  background: #ffffff; border: 1px solid rgba(255,255,255,.06);
  border-radius: 16px;
  font-size: 12px; color: #000000; line-height: 1.6;
  transition: background .3s, border-color .3s;
}
.pkg-compare-cell:hover { background: white; border-color: rgba(151,125,255,.15); }
.pkg-compare-cell strong { display: block; font-size: 15px; font-weight: 900; color: #1e293b; margin-bottom: 4px; }

/* ── Enterprise strip ── */
.pkg-enterprise {
  margin-top: 24px; position: relative; overflow: hidden;
  background: #fafbff; border: 1px solid rgba(255,255,255,.08);
  border-radius: 24px; padding: 36px 48px;
  display: flex; align-items: center; justify-content: space-between; gap: 40px;
  flex-wrap: wrap;
  transition: background .35s, border-color .35s;
}
.pkg-enterprise:hover { background: #f0f6ff; border-color: rgba(151,125,255,.18); }
.pkg-enterprise::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse 60% 80% at 0% 50%, rgba(151,125,255,.05), transparent);
  opacity: 0; transition: opacity .4s;
}
.pkg-enterprise:hover::before { opacity: 1; }
.pkg-enterprise-left { display: flex; align-items: center; gap: 22px; }
.pkg-enterprise-icon {
  width: 58px; height: 58px; border-radius: 18px; flex-shrink: 0;
  background: rgba(151,125,255,.1); border: 1px solid rgba(151,125,255,.18);
  display: flex; align-items: center; justify-content: center; font-size: 24px;
  transition: transform .3s, background .3s;
}
.pkg-enterprise:hover .pkg-enterprise-icon { transform: scale(1.08) rotate(-5deg); background: rgba(151,125,255,.18); }
.pkg-enterprise-title { font-size: clamp(16px,1.8vw,22px); font-weight: 900; color: #1e293b; margin-bottom: 6px; }
.pkg-enterprise-desc { font-size: 13.5px; color: var(--text-muted); line-height: 1.6; max-width: 480px; }
.pkg-enterprise-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.pkg-enterprise-pill {
    font-size: 11px;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 999px;
    background: #2E2AFF;
    border: 1px solid rgba(255, 255, 255, .1);
    color: rgb(255 255 255);
}

/* ── Reveal delays ── */
.pkg-r1{transition-delay:.05s} .pkg-r2{transition-delay:.15s}
.pkg-r3{transition-delay:.25s} .pkg-r4{transition-delay:.35s}
.pkg-r5{transition-delay:.45s} .pkg-r6{transition-delay:.55s}
.pkg-r7{transition-delay:.65s}

/* ── Responsive ── */
@media(max-width:1020px){
  .pkg-section { padding:90px 28px; }
  .pkg-cards { grid-template-columns:1fr; gap:20px; }
  .pkg-card-pro { margin-top:0; }
  .pkg-compare-row { grid-template-columns:1fr; }
  .pkg-enterprise { padding:28px 28px; flex-direction:column; align-items:flex-start; }
}
@media(max-width:600px){
  .pkg-cards { grid-template-columns:1fr; }
}
/* ════════════════════════════════════════════════════
   CONTENT SECTION
════════════════════════════════════════════════════ */
.cnt-section {
  position: relative;
  padding: 110px 0 130px;
  overflow: hidden;
}

/* Layered backgrounds */
.cnt-noise {
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity:.07;
}
/* diagonal grid */
.cnt-diag-bg {
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    repeating-linear-gradient(
      -45deg,
      transparent,
      transparent 60px,
      rgba(151,125,255,.018) 60px,
      rgba(151,125,255,.018) 61px
    );
}
.cnt-orb-tl {
  position:absolute; z-index:0; pointer-events:none;
  width:900px; height:900px; border-radius:50%;
  top:-350px; left:-300px;
  background:radial-gradient(circle, rgba(151,125,255,.055) 0%, transparent 58%);
}
.cnt-orb-br {
  position:absolute; z-index:0; pointer-events:none;
  width:600px; height:600px; border-radius:50%;
  bottom:-200px; right:-180px;
  background:radial-gradient(circle, rgba(151,125,255,.04) 0%, transparent 60%);
}

.cnt-inner {
  position:relative; z-index:2;
  max-width:1340px; margin:0 auto; padding:0 52px;
}

/* ── TOP ROW: eyebrow + headline + live badge ── */
.cnt-top {
  display:flex; align-items:flex-start; justify-content:space-between;
  gap:40px; margin-bottom:64px; flex-wrap:wrap;
}
.cnt-top-left .eyebrow { margin-bottom:18px; }
.cnt-heading {
  font-size:clamp(36px,5.5vw,76px); font-weight:900; color:#1e293b;
  letter-spacing:-.04em; line-height:.97;
}
.cnt-heading-outline {
  /* outlined text */
  color:transparent;
  -webkit-text-stroke:1.5px rgba(151,125,255,.55);
}
.cnt-heading em {
  font-style:normal; color:var(--lime);
}
.cnt-top-right {
  display:flex; flex-direction:column; align-items:flex-end; gap:20px;
  padding-top:8px;
}
.cnt-live-badge {
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(255,60,60,.1); border:1px solid rgba(255,80,80,.3);
  border-radius:999px; padding:7px 16px;
  font-size:11px; font-weight:900; letter-spacing:.14em;
  text-transform:uppercase; color:#ff6b6b;
}
.cnt-live-dot {
  width:7px; height:7px; border-radius:50%; background:#ff5555;
  animation:cntBlink .9s ease-in-out infinite;
}
@keyframes cntBlink { 0%,100%{opacity:1; box-shadow:0 0 0 0 rgba(255,85,85,.5)} 50%{opacity:.4; box-shadow:0 0 0 5px rgba(255,85,85,0)} }
.cnt-desc {
  font-size:15px; color:var(--text-muted); line-height:1.75;
  max-width:340px; text-align:right;
}
.cnt-top-stats {
  display:flex; gap:28px;
}
.cnt-tstat {}
.cnt-tstat-val {
  font-size:26px; font-weight:900; color:#1e293b; letter-spacing:-.04em; line-height:1;
}
.cnt-tstat-val em { font-style:normal; color:var(--lime); }
.cnt-tstat-lbl {
  font-size:10.5px; font-weight:600; color:rgba(30,41,59,.3);
  letter-spacing:.07em; text-transform:uppercase; margin-top:3px;
}

/* ═══════════════════════════════════
   MAIN CONTENT GRID
═══════════════════════════════════ */
.cnt-grid {
  display:grid;
  grid-template-columns:260px 1fr;
  grid-template-rows:auto;
  gap:16px;
  margin-bottom:20px;
}

/* ── LEFT: rotated "CONTENT" label column ── */
.cnt-sidebar {
  display:flex; flex-direction:column; gap:16px;
}

/* Big rotated label card */
.cnt-label-card {
  position:relative; overflow:hidden;
  border-radius:20px;
  background:rgba(151,125,255,.06);
  border:1px solid rgba(151,125,255,.18);
  flex:1; min-height:260px;
  display:flex; align-items:center; justify-content:center;
}
.cnt-label-card::before {
  content:'';
  position:absolute; inset:0;
  background:radial-gradient(ellipse 80% 80% at 50% 50%, rgba(151,125,255,.1) 0%, transparent 65%);
}
.cnt-label-rotated {
  writing-mode:vertical-rl;
  text-orientation:mixed;
  transform:rotate(180deg);
  font-size:clamp(36px,4vw,54px); font-weight:900; color:transparent;
  -webkit-text-stroke:1px rgba(151,125,255,.4);
  letter-spacing:.18em; text-transform:uppercase;
  user-select:none; position:relative; z-index:1;
  line-height:1;
}

/* Small info card */
.cnt-info-card {
  border-radius:20px;
  background:rgba(0,51,255,.035);
  border:1px solid rgba(0,51,255,.12);
  padding:22px 24px;
}
.cnt-info-label {
  font-size:9.5px; font-weight:900; letter-spacing:.16em;
  text-transform:uppercase; color:rgba(151,125,255,.4); margin-bottom:10px;
}
.cnt-info-val {
  font-size:22px; font-weight:900; color:#1e293b; letter-spacing:-.03em; margin-bottom:4px;
}
.cnt-info-val em { font-style:normal; color:var(--lime); }
.cnt-info-sub { font-size:11.5px; color:rgba(30,41,59,.3); font-weight:500; }

/* Platform pill stack */
.cnt-platforms {
  display:flex; flex-direction:column; gap:8px;
  padding:20px 22px;
  border-radius:20px;
  background:rgba(0,51,255,.03);
  border:1px solid rgba(0,51,255,.1);
}
.cnt-platform-item {
  display:flex; align-items:center; gap:10px;
}
.cnt-plat-icon {
  width:28px; height:28px; border-radius:8px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  font-size:14px;
}
.cnt-plat-name {
  font-size:12px; font-weight:700; color:rgba(30,41,59,.55); flex:1;
}
.cnt-plat-bar-wrap {
  flex:1; height:3px; background:rgba(0,51,255,.08); border-radius:999px; overflow:hidden;
}
.cnt-plat-bar {
  height:100%; border-radius:999px;
  background:linear-gradient(90deg,rgba(151,125,255,.4),var(--lime));
  transition:width 1.2s cubic-bezier(.4,0,.2,1);
  width:0;
}
.cnt-plat-pct {
  font-size:10px; font-weight:800; color:rgba(151,125,255,.55);
  width:28px; text-align:right; flex-shrink:0;
}

/* ── RIGHT: asymmetric format cards grid ── */
.cnt-formats {
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  grid-template-rows:auto auto;
  gap:14px;
}

/* Each format card */
.cnt-card {
  position:relative; overflow:hidden;
  border-radius:20px;
  background:rgba(0,51,255,.035);
  border:1px solid rgba(0,51,255,.12);
  padding:28px 26px;
  cursor:default;
  transition:border-color .35s, background .35s, transform .35s, box-shadow .35s;
}
.cnt-card:hover {
  transform:translateY(-4px);
  box-shadow:0 20px 60px rgba(0,0,0,.45);
}
/* Accent glow per card (set via inline style) */
.cnt-card-glow {
  position:absolute; top:-60px; right:-60px;
  width:200px; height:200px; border-radius:50%;
  pointer-events:none; opacity:.6;
  transition:opacity .4s;
}
.cnt-card:hover .cnt-card-glow { opacity:1; }

/* Card sizes */
.cnt-card-tall {
  grid-row:span 2;
}
.cnt-card-wide {
  grid-column:span 2;
}

/* Platform badge */
.cnt-card-plat {
  display:inline-flex; align-items:center; gap:6px;
  border-radius:999px; padding:4px 12px;
  font-size:9.5px; font-weight:900; letter-spacing:.12em;
  text-transform:uppercase; margin-bottom:18px;
}

/* Format icon */
.cnt-card-icon {
  font-size:34px; margin-bottom:16px; display:block;
  transition:transform .35s cubic-bezier(.22,.68,0,1.2);
}
.cnt-card:hover .cnt-card-icon { transform:scale(1.15) rotate(-6deg); }

.cnt-card-format {
  font-size:clamp(14px,1.4vw,17px); font-weight:900; color:#1e293b;
  letter-spacing:-.018em; line-height:1.25; margin-bottom:8px;
}
.cnt-card-desc {
  font-size:12.5px; color:rgba(30,41,59,.42); line-height:1.65;
  margin-bottom:18px;
}

/* Stat row inside card */
.cnt-card-stat {
  display:flex; align-items:baseline; gap:5px;
}
.cnt-card-stat-val {
  font-size:20px; font-weight:900; letter-spacing:-.03em; line-height:1;
}
.cnt-card-stat-lbl {
  font-size:10.5px; font-weight:600; color:rgba(30,41,59,.3);
  letter-spacing:.04em; text-transform:uppercase;
}

/* Progress bar inside card */
.cnt-card-progress {
  margin-top:16px; height:2px;
  background:rgba(0,51,255,.08); border-radius:999px; overflow:hidden;
}
.cnt-card-progress-fill {
  height:100%; border-radius:999px;
  transition:width 1.4s cubic-bezier(.4,0,.2,1);
  width:0;
}

/* Live indicator on card */
.cnt-card-live {
  position:absolute; top:18px; right:18px;
  display:inline-flex; align-items:center; gap:5px;
  background:rgba(255,60,60,.12); border:1px solid rgba(255,80,80,.22);
  border-radius:999px; padding:3px 10px;
  font-size:9px; font-weight:900; letter-spacing:.1em;
  text-transform:uppercase; color:#ff7070;
}
.cnt-card-live-dot {
  width:5px; height:5px; border-radius:50%; background:#ff5555;
  animation:cntBlink .9s ease-in-out infinite;
}

/* Thumbnail preview strip (tall card) */
.cnt-thumb-strip {
  display:flex; flex-direction:column; gap:8px; margin-top:16px;
}
.cnt-thumb {
  border-radius:12px; overflow:hidden;
  height:52px;
  background:rgba(0,51,255,.07); border:1px solid rgba(0,51,255,.14);
  display:flex; align-items:center; padding:0 14px; gap:10px;
  transition:background .3s, border-color .3s;
}
.cnt-thumb:hover { background:rgba(0,51,255,.09); border-color:rgba(151,125,255,.18); }
.cnt-thumb-bar {
  flex:1; height:3px; border-radius:999px;
  background:rgba(0,51,255,.1);
  position:relative; overflow:hidden;
}
.cnt-thumb-bar::after {
  content:''; position:absolute; left:0; top:0; height:100%;
  border-radius:999px; background:var(--lime);
  animation:cntBarPulse 2.5s ease-in-out infinite;
}
.cnt-thumb:nth-child(2) .cnt-thumb-bar::after { animation-delay:.4s; }
.cnt-thumb:nth-child(3) .cnt-thumb-bar::after { animation-delay:.8s; }
@keyframes cntBarPulse {
  0%   { width:15%; opacity:.5; }
  50%  { width:75%; opacity:1; }
  100% { width:15%; opacity:.5; }
}
.cnt-thumb-views {
  font-size:10px; font-weight:700; color:rgba(30,41,59,.3);
  white-space:nowrap;
}

/* ── BOTTOM STAT BAND ── */
.cnt-stat-band {
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:1px; background:rgba(0,51,255,.07);
  border:1px solid rgba(0,51,255,.12);
  border-radius:20px; overflow:hidden;
  margin-top:16px;
}
.cnt-band-item {
  background:rgba(242,230,238,.95); padding:24px 28px;
  display:flex; align-items:center; gap:16px;
  transition:background .3s;
  position:relative;
}
.cnt-band-item:hover { background:rgba(151,125,255,.03); }
.cnt-band-item::after {
  content:''; position:absolute; right:0; top:20%; bottom:20%;
  width:1px; background:rgba(0,51,255,.055);
}
.cnt-band-item:last-child::after { display:none; }
.cnt-band-icon {
  font-size:22px; flex-shrink:0;
}
.cnt-band-text {}
.cnt-band-val {
  font-size:22px; font-weight:900; color:#1e293b;
  letter-spacing:-.04em; line-height:1; margin-bottom:2px;
}
.cnt-band-val em { font-style:normal; color:var(--lime); }
.cnt-band-lbl {
  font-size:10.5px; font-weight:600; color:rgba(30,41,59,.3);
  letter-spacing:.05em; text-transform:uppercase;
}

/* Reveal delays */
.cnt-rv1{transition-delay:.04s} .cnt-rv2{transition-delay:.1s}
.cnt-rv3{transition-delay:.18s} .cnt-rv4{transition-delay:.26s}
.cnt-rv5{transition-delay:.34s} .cnt-rv6{transition-delay:.42s}
.cnt-rv7{transition-delay:.50s}

@media(max-width:1100px){
  .cnt-inner { padding:0 28px; }
  .cnt-grid { grid-template-columns:200px 1fr; }
  .cnt-formats { grid-template-columns:1fr 1fr; }
  .cnt-card-tall { grid-row:span 1; }
  .cnt-card-wide { grid-column:span 2; }
  .cnt-stat-band { grid-template-columns:repeat(3,1fr); }
}
@media(max-width:768px){
  .cnt-section { padding:72px 0 90px; }
  .cnt-top { flex-direction:column; }
  .cnt-top-right { align-items:flex-start; }
  .cnt-desc { text-align:left; }
  .cnt-grid { grid-template-columns:1fr; }
  .cnt-sidebar { display:none; }
  .cnt-formats { grid-template-columns:1fr 1fr; gap:10px; }
  .cnt-card-tall { grid-row:span 1; }
  .cnt-card-wide { grid-column:span 2; }
  .cnt-stat-band { grid-template-columns:1fr 1fr; }
}
@media(max-width:480px){
  .cnt-formats { grid-template-columns:1fr; }
  .cnt-card-wide { grid-column:span 1; }
  .cnt-stat-band { grid-template-columns:1fr 1fr; }
}

/* ════════════════════════════
   FAQ SECTION
════════════════════════════ */
.faq-section {
  position: relative;
  padding: 50px 52px;
  overflow: hidden;
  background: linear-gradient(135deg, #2E2AFF 0%, #2E2AFF 100%);
}
.faq-section::before {
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity:.09;
}
.faq-section::after {
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(151,125,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(151,125,255,.018) 1px, transparent 1px);
  background-size:72px 72px;
}
.faq-orb-l {
  position:absolute; z-index:0; pointer-events:none;
  width:600px; height:600px; border-radius:50%;
  top:-100px; right:-180px;
  background:radial-gradient(circle, rgba(151,125,255,.065) 0%, transparent 62%);
}
.faq-orb-r {
  position:absolute; z-index:0; pointer-events:none;
  width:420px; height:420px; border-radius:50%;
  bottom:-80px; left:-120px;
  background:radial-gradient(circle, rgba(151,125,255,.05) 0%, transparent 62%);
}

.faq-inner {
  position: relative; z-index: 2;
  max-width: 1100px; margin: 0 auto;
}

/* ── Header ── */
.faq-header {
  text-align: center;
  margin-bottom: 80px;
}
.faq-header .eyebrow { margin-bottom: 16px; }
.faq-heading {
  font-size: clamp(36px, 5vw, 64px);
  font-weight: 900; color: #ffffff;
  letter-spacing: -.035em; line-height: 1.05;
  margin-bottom: 16px;
}
.faq-heading-lime { color: #c8ff00; }
.faq-subtext {
  font-size: 15.5px; color: #ffffff;
  line-height: 1.7; max-width: 420px; margin: 0 auto;
}

/* ── Category tabs ── */
.faq-tabs {
  display: flex; gap: 8px; justify-content: center;
  flex-wrap: wrap; margin-bottom: 48px;
}
.faq-tab {
  padding: 8px 20px; border-radius: 999px; cursor: pointer;
  font-size: 12.5px; font-weight: 700; letter-spacing: .05em;
  background:#f2f3ff45; border: 1px solid rgba(255,255,255,.1);
  color: #ffffff;
  transition: background .25s, color .25s, border-color .25s, transform .2s;
  user-select: none;
}
.faq-tab:hover { background: rgba(0,51,255,.09); color: #C8FF00; }
.faq-tab.active {
  background: rgba(151,125,255,.12); border-color: #fff;
  color: #c8ff00; transform: scale(1.04);
}

/* ── FAQ list ── */
.faq-list {
  display: flex; flex-direction: column; gap: 12px;
}

/* ── Single FAQ item ── */
.faq-item {
  position: relative; overflow: hidden;
  background: #ffffff;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 20px;
  transition: border-color .35s, background .35s, box-shadow .35s;
}
.faq-item:hover {
  background: #f0f6ff;
  border-color: rgba(151,125,255,.18);
}
.faq-item.open {
  background: rgba(0,51,255,.04);
  border-color: rgba(151,125,255,.28);
  box-shadow: 0 12px 40px rgba(0,0,0,.3), 0 0 0 1px rgba(151,125,255,.06);
}

/* left accent bar */
.faq-item::before {
  content: ''; position: absolute; left: 0; top: 20%; bottom: 20%;
  width: 3px; border-radius: 999px;
  background: rgba(0,51,255,.07);
  transition: background .35s, top .35s, bottom .35s;
}
.faq-item.open::before { background: var(--lime); top: 10%; bottom: 10%; }

/* ── Question row ── */
.faq-question {
  display: flex; align-items: center; gap: 18px;
  padding: 24px 28px; cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.faq-q-num {
  font-size: 16px; font-weight: 900; letter-spacing: .14em; color: rgba(151,125,255,.4);
  flex-shrink: 0; width: 26px;
}
.faq-q-text {
  flex: 1;
  font-size: clamp(14.5px, 1.6vw, 16.5px); font-weight: 800; color: #fff;
  line-height: 1.35; letter-spacing: -.01em;
  transition: color .3s;
}
.faq-item.open .faq-q-text { color: var(--lime); }

/* icon button */
.faq-q-icon {
  width: 34px; height: 34px; border-radius: 50%; flex-shrink: 0;
  background: var(--lime); border: 1px solid rgba(255,255,255,.1);
  display: flex; align-items: center; justify-content: center;
  transition: background .3s, border-color .3s, transform .4s cubic-bezier(.22,.68,0,1.2);
}
.faq-q-icon svg {
  width: 14px; height: 14px; fill: none; stroke: rgba(255,255,255,.55);
  stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round;
  transition: stroke .3s;
}
.faq-item:hover .faq-q-icon { background: rgba(151,125,255,.1); border-color: rgba(151,125,255,.25); }
.faq-item:hover .faq-q-icon svg { stroke: var(--lime); }
.faq-item.open .faq-q-icon {
  background: var(--lime); border-color: var(--lime);
  transform: rotate(45deg);
}
.faq-item.open .faq-q-icon svg { stroke: #ffffff; }

/* ── Answer panel ── */
.faq-answer-wrap {
  max-height: 0; overflow: hidden;
  transition: max-height .55s cubic-bezier(.4,0,.2,1);
}
.faq-item.open .faq-answer-wrap { max-height: 2000px; }

.faq-answer {
  padding: 0 28px 28px 72px; /* aligns with question text */
  font-size: 14.5px; color: var(--text-muted); line-height: 1.8;
  position: relative;
}

/* ── SPECIAL: first-item blur mechanic ── */
.faq-item-special .faq-answer {
  padding-bottom: 0;
}

/* The text body inside special item */
.faq-answer-body {
  position: relative;
}

/* Clamp wrapper — shows ~10 lines then blurs */
.faq-answer-clamp {
  position: relative;
  max-height: 12.5em; /* ~10 lines at 1.65em line-height */
  overflow: hidden;
  transition: max-height .65s cubic-bezier(.4,0,.2,1);
}
.faq-answer-clamp.expanded {
  max-height: 1000px;
}

/* Gradient blur overlay */
.faq-blur-overlay {
  position: absolute; bottom: 0; left: 0; right: 0;
  height: 120px;
  /* background: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(18,18,18,.55) 35%,
    rgba(12,12,12,.88) 65%,
    rgba(8,8,8,.97) 100%
  ); */
  pointer-events: none;
  transition: opacity .45s;
  border-radius: 0 0 8px 8px;
}
.faq-blur-overlay.hidden { opacity: 0; pointer-events: none; }

/* Frosted glass blur layer */
.faq-blur-frost {
  position: absolute; bottom: 0; left: 0; right: 0;
  height: 80px;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  mask-image: linear-gradient(to bottom, transparent 0%, black 60%);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 60%);
  pointer-events: none;
  border-radius: 0 0 8px 8px;
  transition: opacity .45s;
}
.faq-blur-frost.hidden { opacity: 0; }

/* See more button */
.faq-see-more-wrap {
  display: flex; justify-content: center;
  padding: 20px 28px 28px 72px;
  position: relative; z-index: 2;
  transition: opacity .3s;
}
.faq-see-more-wrap.hidden { display: none; }

.faq-see-more-btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 11px 26px; border-radius: 999px; cursor: pointer;
  font-family: 'Manrope', sans-serif;
  font-size: 13px; font-weight: 800; letter-spacing: .04em;
  background: rgba(151,125,255,.1);
  border: 1.5px solid rgba(151,125,255,.35);
  color: var(--lime);
  transition: background .25s, transform .25s cubic-bezier(.22,.68,0,1.2), box-shadow .25s;
}
.faq-see-more-btn:hover {
  background: rgba(151,125,255,.18);
  transform: scale(1.04);
  box-shadow: 0 6px 24px rgba(151,125,255,.2);
}
.faq-see-more-btn svg {
  width: 14px; height: 14px; fill: none; stroke: var(--lime);
  stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round;
  transition: transform .35s cubic-bezier(.22,.68,0,1.2);
}
.faq-see-more-btn.expanded svg { transform: rotate(180deg); }

/* ── Divider line inside answer ── */
.faq-answer-divider {
  height: 1px; background: rgba(0,51,255,.06); margin: 16px 0;
}

/* ── Answer bullets ── */
.faq-bullets { list-style: none; display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.faq-bullets li {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 14px; color: var(--text-muted); line-height: 1.65;
}
.faq-bullets li::before {
  content: ''; width: 16px; height: 16px; border-radius: 50%; flex-shrink: 0; margin-top: 2px;
  background: rgba(151,125,255,.1); border: 1px solid rgba(151,125,255,.2);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233376aa' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-size: 9px; background-repeat: no-repeat; background-position: center;
}

/* ── Highlight inline ── */
.faq-hl { color: var(--lime); font-weight: 700; }

/* ── Bottom CTA ── */
.faq-bottom {
  text-align: center; margin-top: 64px;
}
.faq-bottom-text {
  font-size: 15px; color: #ffffff; margin-bottom: 22px; line-height: 1.6;
}
.faq-contact-btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 13px 32px; border-radius: 999px; cursor: pointer;
  font-family: 'Manrope', sans-serif;
  font-size: 14px; font-weight: 800;
  background:#C8FF00; 
  color: #000000; border: none;
  box-shadow: 0 6px 28px rgba(0,51,255,.28);
  transition: all .3s cubic-bezier(.22,.68,0,1.2);
  text-decoration: none;
}
.faq-contact-btn:hover { 
  transform: scale(1.05) translateY(-2px); 
  box-shadow: 0 10px 40px rgba(151,125,255,.42); 
  background:#C8FF00;
}
.faq-contact-btn svg { width: 14px; height: 14px; fill: none; stroke: #000; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }

/* ── Reveal helpers ── */
.faq-rv1{transition-delay:.05s} .faq-rv2{transition-delay:.12s}

/* ── Items hidden by default (4–8) ── */
.faq-item-hidden {
  display: none;
}
.faq-item-hidden.faq-revealed {
  display: block;
  animation: faqSlideIn .45s cubic-bezier(.22,.68,0,1.2) both;
}
@keyframes faqSlideIn {
  from { opacity:0; transform:translateY(18px); }
  to   { opacity:1; transform:translateY(0); }
}

/* ── Blur mechanic for items 2 & 3 (same as item 1) ── */
.faq-item-blur .faq-answer-body {
  position: relative;
}
.faq-item-blur .faq-answer-clamp {
  position: relative;
  max-height: 7em;
  overflow: hidden;
  transition: max-height .65s cubic-bezier(.4,0,.2,1);
}
.faq-item-blur .faq-answer-clamp.expanded {
  max-height: 1000px;
}
.faq-item-blur .faq-answer {
  padding-bottom: 0;
}

/* ── See-all wall (between item 3 and hidden items) ── */
.faq-see-all-wall {
  position: relative;
  margin-top: 4px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}
.faq-see-all-wall.faq-wall-gone {
  display: none;
}

/* Ghost items teaser — blurred peek of items below */
.faq-ghost-items {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 12px;
  pointer-events: none;
  user-select: none;
}
.faq-ghost {
  background: #ffffff;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 20px;
  padding: 24px 28px;
  display: flex; align-items: center; gap: 18px;
  filter: blur(3px);
  opacity: 0.45;
  transition: opacity .3s;
}
.faq-ghost-num {
  font-size: 11px; font-weight: 900; letter-spacing: .14em;
  color: rgba(151,125,255,.3); flex-shrink: 0; width: 26px;
}
.faq-ghost-bar {
  flex: 1; height: 14px; border-radius: 999px;
  background: rgba(255,255,255,.12);
}
.faq-ghost-bar-short {
  width: 55%; margin-top: 8px; height: 10px; border-radius: 999px;
  background: rgba(0,51,255,.07);
}
.faq-ghost-icon {
  width: 34px; height: 34px; border-radius: 50%; flex-shrink: 0;
  background: rgba(0,51,255,.04); border: 1px solid rgba(255,255,255,.08);
}

/* Gradient fade over ghost items */
.faq-ghost-fade {
  position: absolute;
  bottom: 120px; left: 0; right: 0;
  height: 160px;
  background: linear-gradient(to bottom, transparent 0%, #3b82f61f 100%);
  pointer-events: none;
  z-index: 1;
}

/* The unlock button */
.faq-unlock-btn {
  position: relative;
  z-index: 2;
  margin-top: -200px;
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 36px; border-radius: 999px; cursor: pointer;
  font-family: 'Manrope', sans-serif;
  font-size: 14px; font-weight: 800; letter-spacing: .02em;
  background:#C8FF00; 
  color: #000000; border: none;
  box-shadow: 0 8px 32px rgba(0,51,255,.35), 0 0 0 6px rgba(151,125,255,.08);
  transition: all .3s cubic-bezier(.22,.68,0,1.2);
}
.faq-unlock-btn:hover {
  transform: scale(1.06) translateY(-2px);
  box-shadow: 0 12px 44px rgba(151,125,255,.48), 0 0 0 10px rgba(151,125,255,.12);
  background:#C8FF00;
}
.faq-unlock-btn svg {
  width: 16px; height: 16px; fill: none; stroke: #ffffff;
  stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round;
}
.faq-unlock-count {
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.25); border-radius: 999px;
  padding: 2px 10px; font-size: 12px; font-weight: 900;
  letter-spacing: .04em;
}
.faq-rv3{transition-delay:.19s} .faq-rv4{transition-delay:.26s}
.faq-rv5{transition-delay:.33s} .faq-rv6{transition-delay:.40s}
.faq-rv7{transition-delay:.47s} .faq-rv8{transition-delay:.54s}

/* ── Responsive ── */
@media(max-width:700px){
  .faq-section { padding: 90px 20px; }
  .faq-question { padding: 20px 20px; gap: 12px; }
  .faq-answer { padding: 0 20px 24px 20px; }
  .faq-see-more-wrap { padding: 16px 20px 24px 20px; }
  .faq-q-num { display: none; }
}

/* ═══════════════════════════════════════
   SERVICES LOCATIONS
═══════════════════════════════════════ */
.sloc-section {
  position: relative;
  padding: 70px 52px 130px;
  overflow: hidden;
  background:#f2f3ff;
}
.sloc-section::before {
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity:.09;
}
.sloc-section::after {
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(151,125,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(151,125,255,.018) 1px, transparent 1px);
  background-size:72px 72px;
}
.sloc-orb-a {
  position:absolute; z-index:0; pointer-events:none;
  width:700px; height:700px; border-radius:50%;
  top:-200px; left:-200px;
  background:radial-gradient(circle, rgba(151,125,255,.065) 0%, transparent 62%);
}
.sloc-orb-b {
  position:absolute; z-index:0; pointer-events:none;
  width:500px; height:500px; border-radius:50%;
  bottom:-120px; right:-120px;
  background:radial-gradient(circle, rgba(151,125,255,.055) 0%, transparent 62%);
}

.sloc-inner {
  position:relative; z-index:2;
  max-width:1180px; margin:0 auto;
}

/* ── Header ── */
.sloc-header {
  display:grid; grid-template-columns:1fr 1fr;
  align-items:end; gap:48px; margin-bottom:80px;
}
.sloc-header-left .eyebrow { margin-bottom:16px; }
.sloc-heading {
  font-size:clamp(34px,4.8vw,62px); font-weight:900; color:#1e293b;
  letter-spacing:-.035em; line-height:1.06;
}
.sloc-heading-lime { color:var(--lime); }
.sloc-header-right {
  display:flex; flex-direction:column; gap:16px;
}
.sloc-header-desc {
  font-size:15px; color:var(--text-muted); line-height:1.72;
}
.sloc-stats-mini {
  display:flex; gap:24px; flex-wrap:wrap;
}
.sloc-stat-mini {
  display:flex; flex-direction:column;
}
.sloc-stat-mini-num {
  font-size:26px; font-weight:900; color:#1e293b; letter-spacing:-.03em; line-height:1;
}
.sloc-stat-mini-num span { color:var(--lime); }
.sloc-stat-mini-lbl { font-size:11px; color:rgba(30,41,59,.38); font-weight:600; margin-top:3px; }

/* ── Main layout: services sidebar + locations grid ── */
.sloc-body {
  display:grid;
  grid-template-columns:280px 1fr;
  gap:28px;
  align-items:start;
}

/* ── LEFT: Service selector sidebar ── */
.sloc-services-sidebar {
  position:sticky; top:80px;
  display:flex; flex-direction:column; gap:8px;
  align-self: start;
}
.sloc-svc-btn {
  display:flex; align-items:center; gap:14px;
  padding:16px 20px; border-radius:18px; cursor:pointer;
  background:rgba(0,51,255,.035); border:1px solid rgba(0,51,255,.12);
  transition:background .3s, border-color .3s, transform .3s;
  position:relative; overflow:hidden;
  text-align:left;
}
.sloc-svc-btn::before {
  content:''; position:absolute; left:0; top:15%; bottom:15%; width:3px;
  border-radius:999px; background:transparent;
  transition:background .3s, top .3s, bottom .3s;
}
.sloc-svc-btn:hover { background:rgba(0,51,255,.07); border-color:rgba(151,125,255,.15); transform:translateX(3px); }
.sloc-svc-btn.active {
    background: #3b82f626;
    border-color: #3b82f6;
    transform: translateX(4px);
}
.sloc-svc-btn.active::before { background:var(--lime); top:8%; bottom:8%; }
.sloc-svc-icon {
  width:40px; height:40px; border-radius:12px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:18px;
  background:rgba(0,51,255,.055); border:1px solid rgba(0,51,255,.14);
  transition:background .3s, border-color .3s, transform .3s;
}
.sloc-svc-btn:hover .sloc-svc-icon { background:rgba(151,125,255,.1); border-color:rgba(151,125,255,.2); }
.sloc-svc-btn.active .sloc-svc-icon { background:rgba(151,125,255,.15); border-color:rgba(151,125,255,.3); transform:rotate(-5deg) scale(1.05); }
.sloc-svc-label { font-size:13.5px; font-weight:800; color:rgba(30,41,59,.7); flex:1; transition:color .3s; }
.sloc-svc-btn.active .sloc-svc-label { color:#1e293b; }
.sloc-svc-count {
  font-size:10px; font-weight:800; color:rgba(151,125,255,.5);
  background:rgba(151,125,255,.08); border:1px solid rgba(151,125,255,.15);
  padding:2px 8px; border-radius:999px; letter-spacing:.05em; flex-shrink:0;
  transition:background .3s, color .3s;
}
.sloc-svc-btn.active .sloc-svc-count { background:rgba(151,125,255,.15); color:var(--lime); }

/* ── RIGHT: Locations content ── */
.sloc-locations-panel {
  min-height:520px;
}

/* Panel header */
.sloc-panel-header {
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:28px; flex-wrap:wrap; gap:12px;
}
.sloc-panel-title {
  font-size:13px; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:rgba(30,41,59,.35);
}
.sloc-panel-service-name {
  font-size:22px; font-weight:900; color:#1e293b; letter-spacing:-.02em;
}
.sloc-search-bar {
  display:flex; align-items:center; gap:10px;
  background:rgba(0,51,255,.055); border:1px solid rgba(0,51,255,.18);
  border-radius:999px; padding:8px 16px;
  transition:border-color .3s;
}
.sloc-search-bar:focus-within { border-color:rgba(151,125,255,.35); }
.sloc-search-bar svg { width:14px; height:14px; fill:none; stroke:rgba(255,255,255,.3); stroke-width:2; stroke-linecap:round; }
.sloc-search-bar input {
  background:none; border:none; outline:none;
  font-family:'Manrope',sans-serif; font-size:13px; color:#1e293b; font-weight:500;
  width:150px;
}
.sloc-search-bar input::placeholder { color:rgba(30,41,59,.25); }

/* Region groups */
.sloc-regions {
  display:flex; flex-direction:column; gap:32px;
}
.sloc-region { transition:opacity .4s; }
.sloc-region.hidden { display:none; }
.sloc-region-label {
  display:flex; align-items:center; gap:10px;
  font-size:10px; font-weight:900; letter-spacing:.16em; text-transform:uppercase;
  color:rgba(30,41,59,.25); margin-bottom:14px;
}
.sloc-region-label::after {
  content:''; flex:1; height:1px;
  background:linear-gradient(90deg, rgba(255,255,255,.07), transparent);
}

/* Location link grid */
.sloc-link-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(190px, 1fr));
  gap:10px;
}

/* Individual location link card */
.sloc-link {
  display:flex; align-items:center; gap:10px;
  padding:12px 16px; border-radius:14px; text-decoration:none;
  background:rgba(0,51,255,.035); border:1px solid rgba(0,51,255,.12);
  transition:background .28s, border-color .28s, transform .28s, box-shadow .28s;
  position:relative; overflow:hidden; cursor:pointer;
  group: true;
}
.sloc-link::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse 80% 60% at 50% -10%, rgba(151,125,255,.07), transparent);
  opacity:0; transition:opacity .3s;
}
.sloc-link:hover {
  background:rgba(151,125,255,.07);
  border-color:rgba(151,125,255,.28);
  transform:translateY(-3px);
  box-shadow:0 8px 28px rgba(0,0,0,.3), 0 0 0 1px rgba(151,125,255,.08);
}
.sloc-link:hover::before { opacity:1; }

.sloc-link-flag {
  font-size:18px; flex-shrink:0; line-height:1;
  transition:transform .3s;color:#3B82F6;
}
.sloc-link:hover .sloc-link-flag { transform:scale(1.2); }
.sloc-link-info { flex:1; min-width:0; }
.sloc-link-city {
  font-size:13px; font-weight:800; color:rgba(30,41,59,.85);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  transition:color .3s;
}
.sloc-link:hover .sloc-link-city { color:#1e293b; }
.sloc-link-country {
  font-size:10.5px; color:rgba(30,41,59,.35); font-weight:600; margin-top:1px;
  transition:color .3s;
}
.sloc-link:hover .sloc-link-country { color:rgba(151,125,255,.6); }
.sloc-link-arrow {
  width:22px; height:22px; border-radius:50%; flex-shrink:0;
  background:rgba(0,51,255,.055); border:1px solid rgba(0,51,255,.14);
  display:flex; align-items:center; justify-content:center;
  transition:background .3s, border-color .3s, transform .3s;
}
.sloc-link-arrow svg { width:9px; height:9px; fill:none; stroke:rgba(255,255,255,.3); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; transition:stroke .3s; }
.sloc-link:hover .sloc-link-arrow { background:var(--lime); border-color:var(--lime); transform:rotate(45deg) scale(1.1); }
.sloc-link:hover .sloc-link-arrow svg { stroke:#ffffff; }

/* Active/highlighted link */
.sloc-link.featured {
  background:rgba(151,125,255,.07); border-color:rgba(151,125,255,.22);
}

/* ── Search bar: service name label ── */
.sloc-search-wrap {
  display:flex; flex-direction:column; align-items:flex-end; gap:6px;
}
.sloc-search-svc-tag {
  display:inline-flex; align-items:center; gap:6px;
  font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
  color:var(--lime); background:rgba(151,125,255,.1);
  border:1px solid rgba(151,125,255,.22); padding:4px 12px; border-radius:999px;
  white-space:nowrap;
}
.sloc-search-svc-dot { width:5px; height:5px; background:var(--lime); border-radius:50%; animation:pulse 1.8s ease-in-out infinite; }

/* ── Left sidebar: selected service name display ── */
.sloc-svc-selected-display {
    background: #3b82f621;
    border: 1px solid rgba(151, 125, 255, .2);
    border-radius: 16px;
    padding: 14px 18px;
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.sloc-svc-selected-label {
  font-size:10px; font-weight:700; color:rgba(30,41,59,.35); letter-spacing:.1em; text-transform:uppercase; display:block; margin-bottom:3px;
}
.sloc-svc-selected-name {
  font-size:14px; font-weight:900; color:#1e293b; display:block;
}
.sloc-svc-selected-icon { font-size:20px; flex-shrink:0; }

/* ── Service description + "See Now" toggle ── */
.sloc-svc-desc-block {
  margin-bottom:24px;
  border-radius:18px;
  background:rgba(0,51,255,.035);
  border:1px solid rgba(0,51,255,.12);
  padding:24px 28px;
  position:relative;
  overflow:hidden;
  transition:border-color .3s;
}
.sloc-svc-desc-block::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--lime), transparent);
  border-radius:18px 18px 0 0;
}
.sloc-svc-desc-block:hover { border-color:rgba(151,125,255,.18); }
.sloc-svc-desc-header {
  display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.sloc-svc-desc-title-wrap {}
.sloc-svc-desc-eyebrow {
  font-size:10px; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:#2E2AFF; margin-bottom:6px;
}
.sloc-svc-desc-name {
  font-size:20px; font-weight:900; color:#1e293b; letter-spacing:-.02em;
}

/* The paragraph text — always visible, clamps to 10 lines */
.sloc-svc-desc-para {
  font-size:14px; color:var(--text-muted); line-height:1.75;
  margin-top:14px;
  max-height: calc(1.75em * 10);
  overflow:hidden;
  transition:max-height .55s cubic-bezier(.4,0,.2,1);
  opacity:1;
  position: relative;
}
.sloc-svc-desc-para.expanded {
  max-height: 600px;
}
/* Fade at bottom when clamped */
.sloc-para-fade {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 40px;
  /* background: linear-gradient(to bottom, transparent, rgba(10,10,10,0.95)); */
  pointer-events: none;
  transition: opacity .4s;
}
.sloc-svc-desc-para.expanded .sloc-para-fade {
  opacity: 0;
}
/* See More / See Less button */
.sloc-para-toggle {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 8px;
  padding: 6px 14px; border-radius: 999px; cursor: pointer;
  font-family: 'Manrope', sans-serif;
  font-size: 12px; font-weight: 800; letter-spacing: .04em;
  background: rgba(151,125,255,.08);
  border: 1.5px solid rgba(151,125,255,.25);
  color: var(--lime);
  transition: background .2s, transform .2s cubic-bezier(.22,.68,0,1.2);
}
.sloc-para-toggle:hover { background: rgba(151,125,255,.15); transform: scale(1.04); }
.sloc-para-toggle svg { width:11px; height:11px; fill:none; stroke:var(--lime); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; transition: transform .3s; }
.sloc-para-toggle.expanded svg { transform: rotate(180deg); }

/* "See Now" button */
.sloc-see-now-btn {
  display:inline-flex; align-items:center; gap:8px;
  margin-top:14px;
  padding:9px 20px; border-radius:999px; cursor:pointer;
  font-family:'Manrope',sans-serif; font-size:12.5px; font-weight:800;
  background:linear-gradient(135deg, #3B82F6 0%, #0B00AB 100%); 
  color:#ffffff; border:none;
  box-shadow:0 4px 16px rgba(0,51,255,.25);
  transition:all .3s cubic-bezier(.22,.68,0,1.2);
  flex-shrink:0;
}
.sloc-see-now-btn:hover { 
  transform:scale(1.05) translateY(-1px); 
  box-shadow:0 6px 24px rgba(151,125,255,.38); 
  background:linear-gradient(135deg, #0B00AB 0%, #00033D 100%);
}
.sloc-see-now-btn.active {
  background:rgba(0,51,255,.1); color:rgba(30,41,59,.6);
  box-shadow:none; border:1px solid rgba(0,51,255,.22);
}
.sloc-see-now-btn svg { width:12px; height:12px; fill:none; stroke:currentColor; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; transition:transform .3s; }
.sloc-see-now-btn.active svg { transform:rotate(180deg); }

/* Locations grid — always visible */
.sloc-locations-content {
  max-height: none; overflow: visible; opacity: 1;
}

/* ── No results message ── */
.sloc-no-results {
  display:none; text-align:center; padding:60px 20px;
  color:rgba(30,41,59,.3); font-size:14px;
}
.sloc-no-results.show { display:block; }
.sloc-no-results-icon { font-size:40px; display:block; margin-bottom:12px; }

/* ── Bottom world strip ── */
.sloc-world-strip {
  margin-top:40px;
  background:rgba(0,51,255,.03); border:1px solid rgba(0,51,255,.12);
  border-radius:24px; padding:32px 40px;
  display:flex; align-items:center; justify-content:space-between; gap:32px;
  flex-wrap:wrap; overflow:hidden; position:relative;
}
.sloc-world-strip::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse 60% 80% at 0% 50%, rgba(151,125,255,.04), transparent);
  pointer-events:none;
}
.sloc-world-left { position:relative; z-index:1; }
.sloc-world-title { font-size:18px; font-weight:900; color:#1e293b; margin-bottom:6px; }
.sloc-world-sub { font-size:13.5px; color:var(--text-muted); line-height:1.6; max-width:380px; }
.sloc-world-right { display:flex; align-items:center; gap:16px; flex-wrap:wrap; position:relative; z-index:1; }
.sloc-world-flags {
  display:flex; flex-wrap:wrap; gap:6px; max-width:200px;
}
.sloc-world-flag-chip {
  font-size:20px; width:36px; height:36px; border-radius:10px;
  background:rgba(0,51,255,.055); border:1px solid rgba(0,51,255,.14);
  display:flex; align-items:center; justify-content:center;
  transition:background .25s, transform .25s;
  cursor:default;
}
.sloc-world-flag-chip:hover { background:rgba(151,125,255,.1); transform:scale(1.12); }
.sloc-world-cta {
  display:inline-flex; align-items:center; gap:8px;
  padding:12px 24px; border-radius:999px; cursor:pointer; text-decoration:none;
  font-family:'Manrope',sans-serif; font-size:13px; font-weight:800;
  background:linear-gradient(135deg, #C8FF00 0%, #9FCC00 100%); 
  color:#000; border:none;
  box-shadow:0 4px 20px rgba(0,51,255,.25);
  transition:all .3s cubic-bezier(.22,.68,0,1.2);
  white-space:nowrap;
}
.sloc-world-cta:hover { 
  transform:scale(1.05) translateY(-2px); 
  box-shadow:0 8px 32px rgba(151,125,255,.38); 
  background:linear-gradient(135deg, #C8FF00 0%, #9FCC00 100%);
}
.sloc-world-cta svg { width:13px; height:13px; fill:none; stroke:#000; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }

/* ── Reveal helpers ── */
.sloc-r1{transition-delay:.05s} .sloc-r2{transition-delay:.15s}
.sloc-r3{transition-delay:.22s} .sloc-r4{transition-delay:.30s}

/* ── Responsive ── */
@media(max-width:960px){
  .sloc-section { padding:90px 24px; }
  .sloc-header { grid-template-columns:1fr; gap:28px; }
  .sloc-body { grid-template-columns:1fr; }
  .sloc-services-sidebar { position:static; display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }
  .sloc-link-grid { grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); }
}
@media(max-width:560px){
  .sloc-services-sidebar { grid-template-columns:1fr; }
  .sloc-link-grid { grid-template-columns:1fr 1fr; }
  .sloc-world-strip { padding:24px 20px; flex-direction:column; align-items:flex-start; }
}
/* ═══════════════════════════════════════
   FOOTER
═══════════════════════════════════════ */
.ft {
    position: relative;
    overflow: hidden;
    background: #2E2AFF;
    border-top: 1px solid rgba(151, 125, 255, .1);
}

/* noise texture */
.ft::before {
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity:.08;
}

/* faint grid */
.ft-grid {
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:linear-gradient(rgba(170,255,0,.015) 1px, transparent 1px),
    linear-gradient(90deg, rgba(170,255,0,.015) 1px, transparent 1px);
  background-size:72px 72px;
}

/* glow orbs */
.ft-orb-l {
  position:absolute; z-index:0; pointer-events:none;
  width:600px; height:600px; border-radius:50%;
  top:-200px; left:-180px;
  background:radial-gradient(circle, rgba(151,125,255,.08) 0%, transparent 60%);
}
.ft-orb-r {
  position:absolute; z-index:0; pointer-events:none;
  width:460px; height:460px; border-radius:50%;
  bottom:-100px; right:-100px;
  background:radial-gradient(circle, rgba(151,125,255,.06) 0%, transparent 60%);
}

/* ── CTA Banner ── */
.ft-cta-banner {
  position:relative; z-index:2;
  border-bottom:1px solid rgb(255 255 255 / 29%);
  padding:72px 52px;
}
.ft-cta-inner {
  max-width:1180px; margin:0 auto;
  display:grid; grid-template-columns:1fr auto;
  align-items:center; gap:48px;
}
.ft-cta-left {}
.ft-cta-tag {
  display:inline-flex; align-items:center; gap:7px;
  font-size:10px; font-weight:900; letter-spacing:.18em; text-transform:uppercase;
  color:var(--lime); background:#C8FF00; border:1px solid rgba(151,125,255,.25);
  padding:5px 14px; border-radius:999px; margin-bottom:20px;
}
.ft-cta-tag-dot { width:5px; height:5px; border-radius:50%; background:var(--lime); animation:pulse 2s ease-in-out infinite; }
.ft-cta-heading {
  font-size:clamp(32px,4.2vw,56px); font-weight:900; color:#ffffff;
  letter-spacing:-.035em; line-height:1.06; margin-bottom:14px;
}
.ft-cta-heading span { color:#C8FF00; }
.ft-cta-sub {
  font-size:15px; color:#ffffff; line-height:1.65; max-width:440px;
}
.ft-cta-right { display:flex; flex-direction:column; gap:12px; align-items:flex-end; }
.ft-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 16px 36px;
    border-radius: 999px;
    cursor: pointer;
    text-decoration: none;
    font-family: 'Manrope', sans-serif;
    font-size: 15px;
    font-weight: 800;
    background: linear-gradient(135deg, #C8FF00 0%, #C8FF00 100%);
    color: #000;
    border: none;
    box-shadow: 0 8px 32px rgba(0, 51, 255, .3);
    transition: all .3s cubic-bezier(.22, .68, 0, 1.2);
    white-space: nowrap;
}
.ft-cta-btn:hover {
    transform: scale(1.05) translateY(-2px);
    box-shadow: 0 14px 48px #C8FF00;
    color: #2E2AFF;
    background: linear-gradient(135deg, #C8FF00 0%, #C8FF00 100%);
}
.ft-cta-btn svg { width:16px; height:16px; fill:none; stroke:#2E2AFF; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.ft-cta-note { font-size:12px; color:#C8FF00; font-weight:600; }

/* ── Main footer body ── */
.ft-body {
  position:relative; z-index:2;
  max-width:1180px; margin:0 auto;
  padding:72px 52px 56px;
  border-bottom:1px solid rgb(255 255 255 / 29%);
}
.ft-body-grid {
  display:grid;
  grid-template-columns:1.8fr 1fr 1fr 1fr 1fr;
  gap:52px;
}

/* Brand column */
.ft-brand {}
.ft-logo {
  font-size:19px; font-weight:900; letter-spacing:.08em; color:#C8FF00;
  text-transform:uppercase; text-decoration:none; display:inline-block;
  margin-bottom:20px;
}
.ft-brand-desc {
  font-size:13.5px; color:#ffffff; line-height:1.75;
  margin-bottom:28px; max-width:240px;
}

/* Social icons */
.ft-socials { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:32px; }
.ft-social {
  width:38px; height:38px; border-radius:12px; flex-shrink:0;
  background:#ffffff1f; border:1px solid rgba(255,255,255,.09);
  display:flex; align-items:center; justify-content:center;
  text-decoration:none; font-size:15px;
  transition:background .28s, border-color .28s, transform .28s;
}
.ft-social:hover { background:rgba(151,125,255,.14); border-color:rgba(151,125,255,.35); transform:translateY(-3px) scale(1.08); }

/* Awards / badges */
.ft-badges { display:flex; flex-direction:column; gap:10px; }
.ft-badge-item {
  display:flex; align-items:center; gap:10px;
  padding:10px 14px; border-radius:14px;
  background:#f2f3ff45; border:1px solid rgba(0,51,255,.1);
  transition:background .3s, border-color .3s;
}
.ft-badge-item:hover { background:rgba(151,125,255,.05); border-color:rgba(151,125,255,.15); }
.ft-badge-icon { font-size:18px; flex-shrink:0; }
.ft-badge-text { font-size:11.5px; color:#ffffff; font-weight:700; line-height:1.3; }
.ft-badge-text strong { display:block; color:#ffffff; font-size:12.5px; }

/* Nav columns */
.ft-col {}
.ft-col-heading {
  font-size:14px; font-weight:900; letter-spacing:.2em; text-transform:uppercase;
  color:#ffffff; margin-bottom:20px;
  display:flex; align-items:center; gap:8px;
}
.ft-col-heading::after {
  content:''; flex:1; height:1px;
  background:linear-gradient(90deg, rgba(255,255,255,.07), transparent);
}
.ft-col-links { list-style:none; display:flex; flex-direction:column; gap:10px; }
.ft-col-link {
  font-size:13.5px; color:#ffffff; font-weight:600;
  text-decoration:none; display:inline-flex; align-items:center; gap:7px;
  transition:color .25s, gap .25s;
  position:relative;
}
.ft-col-link::before {
  content:''; width:4px; height:4px; border-radius:50%;
  background:var(--lime); opacity:0;
  flex-shrink:0;
  transition:opacity .25s, transform .25s;
  transform:scale(0);
}
.ft-col-link:hover { color:#ffffff; gap:10px; }
.ft-col-link:hover::before { opacity:1; transform:scale(1); }
.ft-col-link-new {
  font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase;
  padding:2px 7px; border-radius:999px;
  background:rgb(0 3 61 / 32%); border:1px solid rgba(151,125,255,.25);
  color:#C8FF00; flex-shrink:0;
}

/* ── Newsletter strip ── */
.ft-newsletter {
  position:relative; z-index:2;
  border-top:1px solid rgba(0,51,255,.1);
  padding:40px 52px;
}
.ft-newsletter-inner {
  max-width:1180px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap;
}
.ft-nl-left {}
.ft-nl-label {
  font-size:10px; font-weight:900; letter-spacing:.2em; text-transform:uppercase;
  color:white; margin-bottom:6px;
}
.ft-nl-heading { font-size:18px; font-weight:900; color:#ffffff; letter-spacing:-.02em; }
.ft-nl-form {
  display:flex; gap:0; align-items:center;
  background:#ffffff; border:1px solid rgba(0,51,255,.18);
  border-radius:999px; padding:5px 5px 5px 22px;
  transition:border-color .3s;
  min-width:360px;
}
.ft-nl-form:focus-within { border-color:rgba(151,125,255,.4); }
.ft-nl-input {
  flex:1; background:none; border:none; outline:none;
  font-family:'Manrope',sans-serif; font-size:13.5px; color:black; font-weight:500;
}
.ft-nl-input::placeholder { color:rgba(30,41,59,.25); }
.ft-nl-btn {
  padding:10px 22px; border-radius:999px; cursor:pointer;
  font-family:'Manrope',sans-serif; font-size:13px; font-weight:800;
  background:linear-gradient(135deg, #3B82F6 0%, #0B00AB 100%); 
  color:#ffffff; border:none; flex-shrink:0;
  transition:all .3s cubic-bezier(.22,.68,0,1.2);
  box-shadow: 0 2px 12px rgba(0,51,255,.25);
}
.ft-nl-btn:hover { 
  transform:scale(1.04) translateY(-1px); 
  box-shadow:0 4px 18px rgba(151,125,255,.35); 
  background:linear-gradient(135deg,  #C8FF00 0%, #C8FF00 100%);
  color:#2E2AFF
}

/* ── Big wordmark ── */
.ft-wordmark-wrap {
  position:relative; z-index:2;
  padding:0 52px;
  overflow:hidden;
  border-top:1px solid rgba(255,255,255,.04);
}
.ft-wordmark {
    font-size: clamp(72px, 14vw, 180px);
    font-weight: 900;
    color: #00000010;
    letter-spacing: -.04em;
    line-height: .88;
    -webkit-text-stroke: 3px rgba(170, 255, 0, 58%);
    text-transform: uppercase;
    pointer-events: none;
    user-select: none;
    transition: -webkit-text-stroke pulse .5s;
    white-space: nowrap;
}
.ft-wordmark-wrap:hover .ft-wordmark { -webkit-text-stroke:1px rgba(151,125,255,.22);color:#C8FF00; }

/* ── Bottom bar ── */
.ft-bottom {
  position:relative; z-index:2;
  border-top:1px solid rgba(0,51,255,.1);
  padding:22px 52px;
}
.ft-bottom-inner {
  max-width:1180px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
}
.ft-copyright {
  font-size:12px; color:#ffffff; font-weight:600; line-height:1.6;
}
.ft-copyright span { color:#C8FF00; }
.ft-legal-links { display:flex; gap:20px; flex-wrap:wrap; }
.ft-legal-link {
  font-size:12px; color:rgba(30,41,59,.25); font-weight:600; text-decoration:none;
  transition:color .25s;
}
.ft-legal-link:hover { color:rgba(30,41,59,.7); }

.ft-bottom-right { display:flex; align-items:center; gap:10px; }
.ft-status-dot {
  width:7px; height:7px; border-radius:50%; background:var(--lime);
  animation:pulse 2.2s ease-in-out infinite; flex-shrink:0;
}
.ft-status-text { font-size:11.5px; color:#ffffff; font-weight:600; }

/* ── Responsive ── */
@media(max-width:1060px){
  .ft-body-grid { grid-template-columns:1.5fr 1fr 1fr; gap:40px; }
  .ft-col:nth-child(4), .ft-col:nth-child(5) { display:none; }
}
@media(max-width:720px){
  .ft-cta-banner { padding:52px 24px; }
  .ft-cta-inner { grid-template-columns:1fr; }
  .ft-cta-right { align-items:flex-start; }
  .ft-body { padding:52px 24px 40px; }
  .ft-body-grid { grid-template-columns:1fr 1fr; gap:32px; }
  .ft-newsletter { padding:32px 24px; }
  .ft-nl-form { min-width:0; width:100%; }
  .ft-newsletter-inner { flex-direction:column; align-items:flex-start; }
  .ft-wordmark-wrap { padding:0 24px; }
  .ft-bottom { padding:20px 24px; }
  .ft-bottom-inner { flex-direction:column; align-items:flex-start; gap:12px; }
}
@media(max-width:480px){
  .ft-body-grid { grid-template-columns:1fr; }
}

/* ══ CASE STUDIES — FAQ STYLE REBUILD ══ */
.cs2-section {
  position: relative;
  padding: 50px 52px;
  overflow: hidden;
  background:#f2f3ff;
}
.cs2-orb-l {
  position: absolute; z-index: 0; pointer-events: none;
  width: 700px; height: 700px; border-radius: 50%;
  top: -180px; left: -200px;
  background: radial-gradient(circle, rgba(151,125,255,.07) 0%, transparent 62%);
}
.cs2-orb-r {
  position: absolute; z-index: 0; pointer-events: none;
  width: 560px; height: 560px; border-radius: 50%;
  bottom: -120px; right: -160px;
  background: radial-gradient(circle, rgba(151,125,255,.05) 0%, transparent 62%);
}
.cs2-inner {
  position: relative; z-index: 2;
  max-width: 1200px; margin: 0 auto; 
}

/* ── Header (same as FAQ) ── */
.cs2-header {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 40px; margin-bottom: 52px; flex-wrap: wrap;
}
.cs2-header-left .eyebrow { margin-bottom: 18px; }
.cs2-heading {
  font-size: clamp(34px, 5vw, 68px); font-weight: 900; color: #1e293b;
  letter-spacing: -.035em; line-height: 1.04;
}
.cs2-heading-lime { color: var(--lime); }
.cs2-header-right {
  display: flex; flex-direction: column; align-items: flex-end; gap: 20px;
}
.cs2-header-desc {
  font-size: 15px; color: var(--text-muted); line-height: 1.75;
  max-width: 360px; text-align: right;
}
.cs2-header-cta {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 10px 24px; border-radius: 999px; cursor: pointer;
  font-family: 'Manrope', sans-serif; font-size: 13px; font-weight: 800;
  border: 1.5px solid rgba(151,125,255,.35);
  background: rgba(151,125,255,.07); color: var(--lime);
  text-decoration: none; letter-spacing: .03em;
  transition: background .25s, transform .22s cubic-bezier(.22,.68,0,1.2), box-shadow .22s;
}
.cs2-header-cta:hover { background: rgba(151,125,255,.14); transform: scale(1.04); box-shadow: 0 6px 24px rgba(151,125,255,.18); }
.cs2-header-cta svg { width: 12px; height: 12px; fill: none; stroke: var(--lime); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }

/* ── Ticker (same) ── */
.cs2-ticker-wrap {
  margin-bottom: 56px; overflow: hidden; position: relative;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 8%, #000 92%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0%, #000 8%, #000 92%, transparent 100%);
}
.cs2-ticker-track {
  display: flex; gap: 12px; width: max-content;
  animation: csTickerScroll 36s linear infinite;
}

/* ── Accordion list (same as .faq-list) ── */
.cs2-list {
  display: flex; flex-direction: column; gap: 0;
   background: linear-gradient(135deg, rgba(151, 125, 255, .06) 0%, rgba(255, 255, 255, .025) 100%);
    border: 1px solid rgba(151, 125, 255, .18);
    padding-bottom:20px;
}

/* ── Single accordion item ── */
.cs2-item {
  position: relative; overflow: hidden;
  border-bottom: 1px solid rgba(255,255,255,.07);
  transition: background .3s;
}
.cs2-item:first-child { border-top: 1px solid rgba(255,255,255,.07); }
.cs2-item::before {
  content: ''; position: absolute; left: 0; top: 20%; bottom: 20%;
  width: 3px; border-radius: 999px;
  background: transparent;
  transition: background .35s, top .35s, bottom .35s;
}
.cs2-item.cs2-open::before { background: var(--lime); top: 10%; bottom: 10%; }
.cs2-item.cs2-open {
  background: rgba(151,125,255,.025);
}

/* ── Question row (same as .faq-question) ── */
.cs2-question {
  display: flex; align-items: center; gap: 20px;
  padding: 26px 32px 26px 28px;
  cursor: pointer;
  user-select: none;
}
.cs2-q-num {
  font-size: 30px; font-weight: 900; letter-spacing: .12em;
  color: #2E2AFF; flex-shrink: 0; min-width: 28px;
  font-variant-numeric: tabular-nums;
  transition: color .3s;
}
.cs2-item.cs2-open .cs2-q-num { color: #2E2AFF; }

.cs2-q-meta {
  flex: 1; display: flex; align-items: center; gap: 16px; min-width: 0;
}
.cs2-q-icon-box {
  width: 36px; height: 36px; border-radius: 10px; flex-shrink: 0;
  background: rgba(0,51,255,.06); border: 1px solid rgba(255,255,255,.09);
  display: flex; align-items: center; justify-content: center; font-size: 16px;
  transition: background .3s, border-color .3s, transform .35s cubic-bezier(.22,.68,0,1.2);
}
.cs2-item.cs2-open .cs2-q-icon-box,
.cs2-question:hover .cs2-q-icon-box {
  background: rgba(151,125,255,.1); border-color: rgba(151,125,255,.22);
  transform: rotate(-6deg) scale(1.08);
}
.cs2-q-text-group { flex: 1; min-width: 0; }
.cs2-q-client {
  font-size: 15px; font-weight: 800; letter-spacing: .1em;
  text-transform: uppercase; color: #2E2AFF; margin-bottom: 4px;
}
.cs2-item.cs2-open .cs2-q-client { color: #2E2AFF; }
.cs2-q-text {
  font-size: clamp(14px, 1.5vw, 16px); font-weight: 700; color: rgba(30,41,59,.8);
  line-height: 1.3; letter-spacing: -.01em;
  transition: color .3s;
}
.cs2-item.cs2-open .cs2-q-text { color: #1e293b; }

.cs2-q-kpi {
  flex-shrink: 0; text-align: right;
  display: flex; flex-direction: column; align-items: flex-end; gap: 2px;
}
.cs2-q-kpi-val {
  font-size: clamp(20px, 2.5vw, 28px); font-weight: 900; color: var(--blue-primary);
  letter-spacing: -.04em; line-height: 1;
  transition: color .3s;
}
.cs2-q-kpi-val em { font-style: normal; color: #2E2AFF; transition: color .3s; }
.cs2-item.cs2-open .cs2-q-kpi-val em { color: var(--lime); }
.cs2-q-kpi-label {
  font-size: 9px; font-weight: 800; letter-spacing: .1em;
  text-transform: uppercase; color: var(--blue-primary); transition: color .3s;
}
.cs2-q-chips {
  display: flex; gap: 5px; flex-wrap: wrap; margin-top: 4px; justify-content: flex-end;
}
.cs2-q-chip {
  font-size: 9.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px;
  background: #2E2AFF; border: 1px solid rgba(255,255,255,.07);
  color: white; letter-spacing: .03em;
  transition: background .3s, color .3s, border-color .3s;
}
.cs2-item.cs2-open .cs2-q-chip {
  background: #2E2AFF; border-color: rgba(151,125,255,.17);
  color: #ffffff;
}

.cs2-q-toggle {
  flex-shrink: 0; width: 34px; height: 34px; border-radius: 50%;
  background: #2E2AFF; border: 1px solid rgba(255,255,255,.1);
  display: flex; align-items: center; justify-content: center;
  transition: background .25s, border-color .25s, transform .3s;
}
.cs2-question:hover .cs2-q-toggle { background: rgba(151,125,255,.1); border-color: rgba(151,125,255,.25); }
.cs2-item.cs2-open .cs2-q-toggle {
  background: var(--lime); border-color: var(--lime); transform: rotate(45deg);
}
.cs2-q-toggle svg { width: 13px; height: 13px; fill: none; stroke: rgba(255,255,255,.7); stroke-width: 2.5; stroke-linecap: round; transition: stroke .3s; }
.cs2-item.cs2-open .cs2-q-toggle svg { stroke: #ffffff; }

/* ── Expandable answer (same as .faq-answer-wrap) ── */
.cs2-answer-wrap {
  max-height: 0; overflow: hidden;
  transition: max-height .55s cubic-bezier(.4,0,.2,1);
}
.cs2-item.cs2-open .cs2-answer-wrap { max-height: 800px; }

/* ── Answer body (same blur/clamp structure as FAQ) ── */
.cs2-answer {
  padding: 0 32px 0 28px;
}
.cs2-answer-body {
  position: relative; padding-bottom: 28px;
}
.cs2-answer-inner {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0;
  border-top: 1px solid rgba(255,255,255,.06);
  border-radius: 0 0 16px 16px; overflow: hidden;
}
.cs2-answer-left {
  padding: 28px 32px 32px;
  border-right: 1px solid rgb(0 51 255 / 12%);
}
.cs2-answer-right {
  padding: 28px 32px 32px;
  background: rgba(255,255,255,.015);
}
.cs2-answer-eyebrow {
  font-size: 15px; font-weight: 900; letter-spacing: .18em;
  text-transform: uppercase; color: #2E2AFF; margin-bottom: 10px;
}
.cs2-answer-text {
  font-size: 14px; color: var(--text-muted); line-height: 1.8; margin-bottom: 20px;
}
.cs2-answer-tags { display: flex; gap: 7px; flex-wrap: wrap; margin-bottom: 20px; }
.cs2-answer-tag {
    font-size: 10.5px;
    font-weight: 700;
    padding: 5px 13px;
    border-radius: 999px;
    background: #2E2AFF;
    border: 1px solid rgba(255, 255, 255, .09);
    color: rgb(255 255 255);
}
.cs2-answer-link {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12.5px; font-weight: 800; color: var(--lime);
  letter-spacing: .04em; text-transform: uppercase; text-decoration: none;
  transition: gap .22s;
}
.cs2-answer-link:hover { gap: 13px; }
.cs2-answer-link svg { width: 14px; height: 14px; fill: none; stroke: var(--lime); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }

/* Metrics 2x2 grid */
.cs2-metrics {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 1px; background: rgba(0,51,255,.04);
  border-radius: 14px; overflow: hidden;
}
.cs2-metric {
  background: rgba(255,255,255,.02); padding: 18px 20px;
  transition: background .3s;
}
.cs2-metric:hover { background: rgba(151,125,255,.05); }
.cs2-metric-val {
  font-size: 24px; font-weight: 900; color: #2E2AFF;
  letter-spacing: -.04em; line-height: 1; margin-bottom: 4px;
}
.cs2-metric-val em { font-style: normal; color: var(--lime); }
.cs2-metric-lbl {
  font-size: 10px; font-weight: 600; color: #2E2AFF;
  letter-spacing: .05em; text-transform: uppercase;
}

/* ── Blur clamp (same as FAQ blur) ── */
.cs2-clamp { overflow: hidden; max-height: 80px; transition: max-height .5s ease; }
.cs2-clamp.expanded { max-height: 2000px; }
.cs2-blur-overlay {
  position: absolute; bottom: 52px; left: 0; right: 0; height: 80px;
  /* background: linear-gradient(to bottom, transparent, rgba(242,230,238,.88) 80%); */
  pointer-events: none; transition: opacity .35s;
}
.cs2-blur-frost {
  position: absolute; bottom: 52px; left: 0; right: 0; height: 36px;
  backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
  -webkit-mask-image: linear-gradient(to bottom, transparent, black);
  mask-image: linear-gradient(to bottom, transparent, black);
  pointer-events: none; transition: opacity .35s;
}
.cs2-blur-overlay.hidden,
.cs2-blur-frost.hidden { opacity: 0; pointer-events: none; }
.cs2-see-more-wrap { padding: 0 0 28px; }
.cs2-see-more-wrap.hidden { display: none; }
.cs2-see-more-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 20px; border-radius: 999px; cursor: pointer;
  font-family: 'Manrope', sans-serif; font-size: 12px; font-weight: 800;
  border: 1px solid rgba(255,255,255,.12); background: rgba(0,51,255,.04);
  color: rgba(255,255,255,.6); letter-spacing: .04em; text-transform: uppercase;
  transition: background .2s, border-color .2s, color .2s;
}
.cs2-see-more-btn:hover { background: rgba(151,125,255,.08); border-color: rgba(151,125,255,.28); color: var(--lime); }
.cs2-see-more-btn svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; transition: transform .3s; }
.cs2-see-more-btn.expanded svg { transform: rotate(180deg); }

/* ── See-All Ghost Wall (same as FAQ) ── */
.cs2-see-all-wall {
  position: relative; display: flex; flex-direction: column; align-items: center;
}
.cs2-see-all-wall.cs2-wall-gone { display: none; }
.cs2-ghost-items {
  width: 100%; display: flex; flex-direction: column; gap: 0;
  pointer-events: none; user-select: none;
}
.cs2-ghost {
  display: flex; align-items: center; gap: 20px;
  padding: 26px 32px 26px 28px;
  border-bottom: 1px solid rgba(255,255,255,.07);
  filter: blur(3.5px); opacity: 0.35;
}
.cs2-ghost-num { width: 24px; height: 14px; border-radius: 4px; background: rgba(0,51,255,.1); flex-shrink: 0; }
.cs2-ghost-icon { width: 36px; height: 36px; border-radius: 10px; background: rgba(0,51,255,.07); flex-shrink: 0; }
.cs2-ghost-mid { flex: 1; display: flex; flex-direction: column; gap: 8px; }
.cs2-ghost-bar { height: 13px; border-radius: 6px; background: rgba(255,255,255,.11); width: 75%; }
.cs2-ghost-bar-short { height: 9px; border-radius: 6px; background: rgba(0,51,255,.06); width: 45%; }
.cs2-ghost-chips { display: flex; gap: 6px; margin-top: 4px; }
.cs2-ghost-chip { width: 50px; height: 9px; border-radius: 999px; background: rgba(0,51,255,.06); }
.cs2-ghost-kpi { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.cs2-ghost-kpi-val { width: 60px; height: 28px; border-radius: 6px; background: rgba(0,51,255,.1); }
.cs2-ghost-kpi-lbl { width: 40px; height: 8px; border-radius: 4px; background: rgba(0,51,255,.04); }
.cs2-ghost-fade {
  position: absolute; bottom: 64px; left: 0; right: 0; height: 350px;
  /* background: linear-gradient(to bottom, transparent 0%, rgb(230 235 242 / 97%) 100%); */
  pointer-events: none; z-index: 1;
}
.cs2-unlock-btn {
  position: relative; z-index: 2; margin-top: -150px;
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 12px; border-radius: 999px; cursor: pointer;
  font-family: 'Manrope', sans-serif;
  font-size: 14px; font-weight: 800; letter-spacing: .02em;
  background: linear-gradient(135deg, #C8FF00 0%, #9FCC00 100%); color: #000000; border: none;
  box-shadow: 0 8px 32px rgba(151,125,255,.35), 0 0 0 6px rgba(151,125,255,.08);
  transition: transform .25s cubic-bezier(.22,.68,0,1.2), box-shadow .25s;
}
.cs2-unlock-btn:hover { transform: scale(1.06); box-shadow: 0 12px 44px rgba(151,125,255,.48), 0 0 0 10px rgba(151,125,255,.06); }
.cs2-unlock-btn svg { width: 16px; height: 16px; fill: none; stroke: #000000; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.cs2-unlock-count { background: rgba(255,255,255,.25); border-radius: 999px; padding: 2px 10px; font-size: 12px; font-weight: 900; }

/* Hidden items */
.cs2-item-hidden { display: none; }
.cs2-item-hidden.cs2-revealed {
  display: block;
  animation: cs2SlideIn .45s cubic-bezier(.22,.68,0,1.2) both;
}
@keyframes cs2SlideIn {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* CTA strip same as before */
.cs2-cta-strip {
  margin-top: 56px;
  display: flex; align-items: center; justify-content: space-between;
  background: rgba(151,125,255,.04); border: 1px solid rgba(151,125,255,.14);
  border-radius: 20px; padding: 28px 40px; gap: 32px; flex-wrap: wrap;
}
.cs2-cta-label {
  font-size: 9.5px; font-weight: 900; letter-spacing: .16em;
  text-transform: uppercase; color: #2E2AFF; margin-bottom: 8px;
}
.cs2-cta-title {
  font-size: clamp(16px,2vw,22px); font-weight: 900; color: #1e293b;
  line-height: 1.3; letter-spacing: -.02em;
}
.cs2-cta-sub { font-size: 13.5px; color: var(--text-muted); margin-top: 6px; line-height: 1.6; }
.cs2-cta-btns { display: flex; gap: 12px; flex-shrink: 0; }
.cs2-cta-primary {
  display: inline-flex; align-items: center; gap: 10px;
  background: linear-gradient(135deg, #C8FF00 0%, #9FCC00 100%); border-radius: 999px;
  padding: 12px 28px; font-size: 13.5px; font-weight: 800;
  color: #000; border: none; cursor: pointer;
  font-family: 'Manrope', sans-serif; white-space: nowrap; text-decoration: none;
  transition: transform .22s cubic-bezier(.22,.68,0,1.2), box-shadow .22s;
}
.cs2-cta-primary:hover { transform: scale(1.05); box-shadow: 0 8px 28px rgba(151,125,255,.3); }
.cs2-cta-primary svg { width: 13px; height: 13px; fill: none; stroke: #000; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.cs2-cta-ghost {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 24px; border-radius: 999px; cursor: pointer;
  font-size: 13px; font-weight: 800; color: #3B82F6;
  border: 1.5px solid #3B82F6; background: transparent;
  font-family: 'Manrope', sans-serif; white-space: nowrap; text-decoration: none;
  transition: border-color .25s, color .25s, background .25s;
}
.cs2-cta-ghost:hover { border-color: rgba(255,255,255,.35); color: #000; background: rgba(0,51,255,.04); }

/* Responsive */
@media(max-width:768px){
  .cs2-inner { padding: 0 0px; }
  .cs2-header { flex-direction: column; align-items: flex-start; }
  .cs2-header-right { align-items: flex-start; }
  .cs2-header-desc { text-align: left; }
  .cs2-answer-inner { grid-template-columns: 1fr; }
  .cs2-answer-left { border-right: none; border-bottom: 1px solid rgba(255,255,255,.06); }
  .cs2-q-kpi { display: none; }
  .cs2-cta-strip { flex-direction: column; align-items: flex-start; }
}

/* Reveal delays */
.cs2-r1{transition-delay:.04s}.cs2-r2{transition-delay:.1s}
.cs2-r3{transition-delay:.16s}.cs2-r4{transition-delay:.22s}
.cs2-r5{transition-delay:.28s}.cs2-r6{transition-delay:.34s}
.cnt2-section {
  position: relative;
  padding: 50px 52px;
  overflow: hidden;
  background:#f2f3ff;
}
.cnt2-section::before {
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity:.09;
}
.cnt2-section::after {
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(151,125,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(151,125,255,.018) 1px, transparent 1px);
  background-size:72px 72px;
}
.cnt2-orb-l {
  position:absolute; z-index:0; pointer-events:none;
  width:600px; height:600px; border-radius:50%;
  top:-100px; right:-180px;
  background:radial-gradient(circle, rgba(151,125,255,.065) 0%, transparent 62%);
}
.cnt2-orb-r {
  position:absolute; z-index:0; pointer-events:none;
  width:420px; height:420px; border-radius:50%;
  bottom:-80px; left:-120px;
  background:radial-gradient(circle, rgba(151,125,255,.05) 0%, transparent 62%);
}
.cnt2-inner {
  position: relative; z-index: 2;
  max-width: 1100px; margin: 0 auto;
}

/* ── Header (identical to .faq-header) ── */
.cnt2-header {
  text-align: center;
  margin-bottom: 80px;
}
.cnt2-header .eyebrow { margin-bottom: 16px; }
.cnt2-heading {
  font-size: clamp(36px, 5vw, 64px);
  font-weight: 900; color: #1e293b;
  letter-spacing: -.035em; line-height: 1.05;
  margin-bottom: 16px;
}
.cnt2-heading-lime { color: var(--lime); }
.cnt2-subtext {
  font-size: 15.5px; color: var(--text-muted);
  line-height: 1.7; max-width: 450px; margin: 0 auto;
}

/* ── Category tabs (identical to .faq-tabs) ── */
.cnt2-tabs {
  display: flex; gap: 8px; justify-content: center;
  flex-wrap: wrap; margin-bottom: 48px;
}
.cnt2-tab {
  padding: 8px 20px; border-radius: 999px; cursor: pointer;
  font-size: 12.5px; font-weight: 700; letter-spacing: .05em;
  background: #2E2AFF; border: 1px solid rgba(255,255,255,.1);
  color: white;
  transition: background .25s, color .25s, border-color .25s, transform .2s;
  user-select: none; font-family: 'Manrope', sans-serif;
}
.cnt2-tab:hover { background: rgba(0,51,255,.09); color: rgba(30,41,59,.8); }
.cnt2-tab.active {
  background: rgba(151,125,255,.12); border-color: rgba(151,125,255,.35);
  color: var(--lime); transform: scale(1.04);
}

/* ── List (identical to .faq-list) ── */
.cnt2-list {
  display: flex; flex-direction: column; gap: 12px;
}

/* ── Single item (identical to .faq-item) ── */
.cnt2-item {
  position: relative; overflow: hidden;
  background: #ffffff;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 20px;
  transition: border-color .35s, background .35s, box-shadow .35s;
}
.cnt2-item:hover {
  background: #f0f6ff;
  border-color: rgba(151,125,255,.18);
}
.cnt2-item.open {
  background: rgba(0,51,255,.04);
  border-color: rgba(151,125,255,.28);
  box-shadow: 0 12px 40px rgba(0,0,0,.3), 0 0 0 1px rgba(151,125,255,.06);
}
.cnt2-item::before {
  content: ''; position: absolute; left: 0; top: 20%; bottom: 20%;
  width: 3px; border-radius: 999px;
  background: rgba(0,51,255,100%);
  transition: background .35s, top .35s, bottom .35s;
}
.cnt2-item.open::before { background: var(--lime); top: 10%; bottom: 10%; }

/* ── Question row (identical to .faq-question) ── */
.cnt2-question {
  display: flex; align-items: center; gap: 18px;
  padding: 24px 28px; cursor: pointer;
  user-select: none; -webkit-tap-highlight-color: transparent;
}
.cnt2-q-num {
  font-size: 20px; font-weight: 900; letter-spacing: .14em; color: #2E2AFF;
  flex-shrink: 0; width: 26px;
}
.cnt2-q-body { flex: 1; min-width: 0; }
.cnt2-q-platform {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 10.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
  margin-bottom: 6px;
}
.cnt2-q-text {
  font-size: clamp(14.5px, 1.6vw, 16.5px); font-weight: 800; color: #fff;
  line-height: 1.35; letter-spacing: -.01em;
  transition: color .3s;
}
.cnt2-item.open .cnt2-q-text { color: var(--lime); }
.cnt2-q-stat {
  flex-shrink: 0; text-align: right;
  display: flex; flex-direction: column; align-items: flex-end; gap: 2px;
  min-width: 64px;
}
.cnt2-q-stat-val {
  font-size: clamp(18px, 2.2vw, 24px); font-weight: 900;
  line-height: 1; letter-spacing: -.03em;
}
.cnt2-q-stat-lbl {
  font-size: 9px; font-weight: 800; letter-spacing: .1em;
  text-transform: uppercase; color: rgba(255,255,255,.22);
  white-space: nowrap;
}

/* icon button (identical to .faq-q-icon) */
.cnt2-q-icon {
  width: 34px; height: 34px; border-radius: 50%; flex-shrink: 0;
  background: rgba(0,51,255,.06); border: 1px solid rgba(255,255,255,.1);
  display: flex; align-items: center; justify-content: center;
  transition: background .3s, border-color .3s, transform .4s cubic-bezier(.22,.68,0,1.2);
}
.cnt2-q-icon svg {
  width: 14px; height: 14px; fill: none; stroke: #2E2AFF;
  stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round;
  transition: stroke .3s;
}
.cnt2-item:hover .cnt2-q-icon { background: rgba(151,125,255,.1); border-color: rgba(151,125,255,.25); }
.cnt2-item:hover .cnt2-q-icon svg { stroke: var(--lime); }
.cnt2-item.open .cnt2-q-icon {
  background: var(--lime); border-color: var(--lime);
  transform: rotate(45deg);
}
.cnt2-item.open .cnt2-q-icon svg { stroke: #ffffff; }

/* ── Answer wrap (identical to .faq-answer-wrap) ── */
.cnt2-answer-wrap {
  max-height: 0; overflow: hidden;
  transition: max-height .55s cubic-bezier(.4,0,.2,1);
}
.cnt2-item.open .cnt2-answer-wrap { max-height: 2000px; }

.cnt2-answer {
  padding: 0 28px 0 72px;
  font-size: 14.5px; color: var(--text-muted); line-height: 1.8;
  position: relative;
}
.cnt2-item-special .cnt2-answer,
.cnt2-item-blur .cnt2-answer { padding-bottom: 0; }

/* ── Clamp + blur (identical to FAQ special/blur) ── */
.cnt2-answer-body { position: relative; }

.cnt2-item-special .cnt2-clamp {
  max-height: 12.5em; overflow: hidden;
  transition: max-height .65s cubic-bezier(.4,0,.2,1);
}
.cnt2-item-blur .cnt2-clamp {
  max-height: 7em; overflow: hidden;
  transition: max-height .65s cubic-bezier(.4,0,.2,1);
}
.cnt2-item-special .cnt2-clamp.expanded,
.cnt2-item-blur .cnt2-clamp.expanded { max-height: 1000px; }

.cnt2-blur-overlay {
  position: absolute; bottom: 0; left: 0; right: 0; height: 120px;
  background: linear-gradient(to bottom, transparent 0%, rgb(18 18 18 / 0%) 35%, rgb(12 12 12 / 0%) 65%, rgb(8 8 8 / 2%) 100%);
  pointer-events: none; transition: opacity .45s; border-radius: 0 0 8px 8px;
}
.cnt2-blur-overlay.hidden { opacity: 0; pointer-events: none; }
.cnt2-blur-frost {
  position: absolute; bottom: 0; left: 0; right: 0; height: 150px;
  backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
  mask-image: linear-gradient(to bottom, transparent 0%, black 60%);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 60%);
  pointer-events: none; border-radius: 0 0 8px 8px; transition: opacity .45s;
}
.cnt2-blur-frost.hidden { opacity: 0; }

.cnt2-see-more-wrap {
  display: flex; justify-content: center;
  padding: 20px 28px 28px 72px;
  position: relative; z-index: 2;
}
.cnt2-see-more-wrap.hidden { display: none; }
.cnt2-see-more-btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 11px 26px; border-radius: 999px; cursor: pointer;
  font-family: 'Manrope', sans-serif;
  font-size: 13px; font-weight: 800; letter-spacing: .04em;
  background: rgba(151,125,255,.1); border: 1.5px solid rgba(151,125,255,.35);
  color: var(--lime);
  transition: background .25s, transform .25s cubic-bezier(.22,.68,0,1.2), box-shadow .25s;
}
.cnt2-see-more-btn:hover { background: rgba(151,125,255,.18); transform: scale(1.04); box-shadow: 0 6px 24px rgba(151,125,255,.2); }
.cnt2-see-more-btn svg {
  width: 14px; height: 14px; fill: none; stroke: var(--lime);
  stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round;
  transition: transform .35s cubic-bezier(.22,.68,0,1.2);
}
.cnt2-see-more-btn.expanded svg { transform: rotate(180deg); }

/* ── Divider + bullets (identical to FAQ) ── */
.cnt2-divider { height: 1px; background: rgba(0,51,255,.06); margin: 16px 0; }
.cnt2-bullets { list-style: none; display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.cnt2-bullets li {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 14px; color: var(--text-muted); line-height: 1.65;
}
.cnt2-bullets li::before {
  content: ''; width: 16px; height: 16px; border-radius: 50%; flex-shrink: 0; margin-top: 2px;
  background: rgba(151,125,255,.1); border: 1px solid rgba(151,125,255,.2);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233376aa' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-size: 9px; background-repeat: no-repeat; background-position: center;
}
.cnt2-hl { color: var(--lime); font-weight: 700; }

/* ── Inline stat pills inside answer ── */
.cnt2-stat-pills {
  display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px;
}
.cnt2-stat-pill {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 16px; border-radius: 12px;
  background: rgba(0,51,255,.03); border: 1px solid rgba(255,255,255,.08);
}
.cnt2-stat-pill-val {
  font-size: 18px; font-weight: 900; color: #fff; line-height: 1; letter-spacing: -.03em;
}
.cnt2-stat-pill-val em { font-style: normal; color: var(--lime); }
.cnt2-stat-pill-lbl { font-size: 10.5px; font-weight: 700; color: var(--blue-primary);
 text-transform: uppercase; letter-spacing: .06em; }

/* ── Progress bars inside answer ── */
.cnt2-prog-wrap { margin-top: 18px; display: flex; flex-direction: column; gap: 10px; }
.cnt2-prog-row { display: flex; align-items: center; gap: 12px; }
.cnt2-prog-lbl { font-size: 11px; font-weight: 700; color: rgba(255,255,255,.4); width: 80px; flex-shrink: 0; text-transform: uppercase; letter-spacing: .05em; }
.cnt2-prog-track { flex: 1; height: 5px; background: rgba(0,51,255,.07); border-radius: 999px; overflow: hidden; }
.cnt2-prog-fill { height: 100%; border-radius: 999px; transition: width 1s cubic-bezier(.4,0,.2,1); width: 0; }
.cnt2-prog-pct { font-size: 11px; font-weight: 800; color: rgba(255,255,255,.45); width: 36px; text-align: right; flex-shrink: 0; }

/* ── See-all ghost wall (identical to .faq-see-all-wall) ── */
.cnt2-see-all-wall {
  position: relative; margin-top: 4px;
  display: flex; flex-direction: column; align-items: center; gap: 0;
}
.cnt2-see-all-wall.cnt2-wall-gone { display: none; }
.cnt2-ghost-items {
  width: 100%; display: flex; flex-direction: column; gap: 12px;
  pointer-events: none; user-select: none;
}
.cnt2-ghost {
  background: #ffffff; border: 1px solid rgba(255,255,255,.06);
  border-radius: 20px; padding: 24px 28px;
  display: flex; align-items: center; gap: 18px;
  filter: blur(3px); opacity: 0.45;
}
.cnt2-ghost-num { font-size: 11px; font-weight: 900; letter-spacing: .14em; color: rgba(151,125,255,.3); flex-shrink: 0; width: 26px; }
.cnt2-ghost-bar { flex: 1; height: 14px; border-radius: 999px; background: rgba(255,255,255,.12); }
.cnt2-ghost-bar-short { width: 55%; margin-top: 8px; height: 10px; border-radius: 999px; background: rgba(0,51,255,.07); }
.cnt2-ghost-icon { width: 34px; height: 34px; border-radius: 50%; flex-shrink: 0; background: rgba(0,51,255,.04); border: 1px solid rgba(255,255,255,.08); }
.cnt2-ghost-fade {
  position: absolute; bottom: 120px; left: 0; right: 0; height: 160px;
  background: linear-gradient(to bottom, transparent 0%, #3b82f61f 100%);
  pointer-events: none; z-index: 1;
}
.cnt2-unlock-btn {
  position: relative; z-index: 2; margin-top: -123px;
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 22px; border-radius: 999px; cursor: pointer;
  font-family: 'Manrope', sans-serif;
  font-size: 14px; font-weight: 800; letter-spacing: .02em;
  background: linear-gradient(135deg, #C8FF00 0%, #9FCC00 100%); color: #000; border: none;
  box-shadow: 0 8px 32px rgba(151,125,255,.35), 0 0 0 6px rgba(151,125,255,.08);
  transition: transform .25s cubic-bezier(.22,.68,0,1.2), box-shadow .25s;
}
.cnt2-unlock-btn:hover { transform: scale(1.06); box-shadow: 0 12px 44px rgba(151,125,255,.48), 0 0 0 10px rgba(151,125,255,.06); }
.cnt2-unlock-btn svg { width: 16px; height: 16px; fill: none; stroke: #000; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.cnt2-unlock-count { display: inline-flex; align-items: center; justify-content: center; background: rgba(255,255,255,.25); border-radius: 999px; padding: 2px 10px; font-size: 12px; font-weight: 900; letter-spacing: .04em; }

/* Hidden items */
.cnt2-item-hidden { display: none; }
.cnt2-item-hidden.cnt2-revealed {
  display: block;
  animation: cnt2SlideIn .45s cubic-bezier(.22,.68,0,1.2) both;
}
@keyframes cnt2SlideIn { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }

/* ── Bottom CTA (identical to .faq-bottom) ── */
.cnt2-bottom { text-align: center; margin-top: 64px; }
.cnt2-bottom-text { font-size: 15px; color: var(--text-muted); margin-bottom: 22px; line-height: 1.6; }
.cnt2-contact-btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 13px 32px; border-radius: 999px; cursor: pointer;
  font-family: 'Manrope', sans-serif;
  font-size: 14px; font-weight: 800;
  background: linear-gradient(135deg, #C8FF00 0%, #9FCC00 100%); color: #000; border: none;
  box-shadow: 0 6px 28px rgba(151,125,255,.28);
  transition: transform .25s cubic-bezier(.22,.68,0,1.2), box-shadow .25s;
  text-decoration: none;
}
.cnt2-contact-btn:hover { transform: scale(1.05); box-shadow: 0 10px 40px rgba(151,125,255,.42); }
.cnt2-contact-btn svg { width: 14px; height: 14px; fill: none; stroke: #000; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }

/* Responsive */
@media(max-width:700px){
  .cnt2-section { padding: 90px 20px; }
  .cnt2-question { padding: 20px 20px; gap: 12px; }
  .cnt2-answer { padding: 0 20px 24px 20px; }
  .cnt2-see-more-wrap { padding: 16px 20px 24px 20px; }
  .cnt2-q-num { display: none; }
  .cnt2-q-stat { display: none; }
}
/* Reveal delays */
.cnt2-rv1{transition-delay:.05s} .cnt2-rv2{transition-delay:.12s}
.cnt2-rv3{transition-delay:.19s} .cnt2-rv4{transition-delay:.26s}
.cnt2-rv5{transition-delay:.33s} .cnt2-rv6{transition-delay:.40s}
.cnt2-rv7{transition-delay:.47s}
/* ══ POPUP OVERLAY ══ */
.sp-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(15,23,42,.75);
  backdrop-filter: blur(6px);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  opacity: 0; pointer-events: none;
  transition: opacity .35s cubic-bezier(.22,.68,0,1.2);
}
.sp-overlay.open {
  opacity: 1; pointer-events: all;
}

/* ══ MODAL ══ */
.sp-modal {
  position: relative;
  width: 100%; max-width: 680px;
  background: #F2E6EE;
  border: 1px solid rgba(151,125,255,.22);
  border-radius: 24px;
  padding: 44px 48px;
  overflow: hidden;
  transform: translateY(30px) scale(.97);
  transition: transform .4s cubic-bezier(.22,.68,0,1.2);
  box-shadow: 0 32px 80px rgba(0,0,0,.6), 0 0 0 1px rgba(151,125,255,.08);
  max-height: 90vh; overflow-y: auto;
}
.sp-overlay.open .sp-modal {
  transform: translateY(0) scale(1);
}

/* Scrollbar inside modal */
.sp-modal::-webkit-scrollbar { width: 4px; }
.sp-modal::-webkit-scrollbar-thumb { background: rgba(151,125,255,.3); border-radius: 99px; }

/* ══ DECORATIVE ══ */
.sp-glow {
  position: absolute; top: -80px; right: -60px;
  width: 320px; height: 320px; border-radius: 50%;
  background: radial-gradient(circle, rgba(151,125,255,.18) 0%, transparent 70%);
  pointer-events: none;
}
.sp-grid-bg {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(151,125,255,.03) 1px,transparent 1px),
    linear-gradient(90deg,rgba(151,125,255,.03) 1px,transparent 1px);
  background-size: 40px 40px;
  pointer-events: none;
}

/* ══ CLOSE BUTTON ══ */
.sp-close {
  position: absolute; top: 18px; right: 20px;
  background: rgba(0,51,255,.07); border: 1px solid rgba(255,255,255,.1);
  border-radius: 50%; width: 36px; height: 36px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: #000;
  transition: background .2s, color .2s;
}
.sp-close:hover { background: rgba(30,41,59,.1); color: #1e293b; }

/* ══ HEADER ══ */
.sp-header { margin-bottom: 32px; }
.sp-badge {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 16px; border-radius: 999px;
  background: rgba(151,125,255,.12); border: 1px solid rgba(151,125,255,.35);
  color: #3B82F6; font-size: 12px; font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; margin-bottom: 16px;
}
.sp-badge-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: #3B82F6;
  box-shadow: 0 0 6px #3B82F6;
  animation: spPulse 1.6s ease-in-out infinite;
}
@keyframes spPulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.5;transform:scale(1.4)} }

.sp-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(24px,3.5vw,34px); font-weight: 800;
  color: #fff; letter-spacing: -.025em; line-height: 1.1;
  margin-bottom: 10px;
}
.sp-lime { color: #3B82F6; }
.sp-subtitle {
  font-size: 14.5px; color: rgba(255,255,255,.6);
  line-height: 1.6; font-weight: 400;
}

/* ══ FORM ══ */
.sp-form { display: flex; flex-direction: column; gap: 18px; }
.sp-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media(max-width:520px){ .sp-row { grid-template-columns: 1fr; } }

.sp-field { display: flex; flex-direction: column; gap: 7px; }
.sp-field-full { width: 100%; }

.sp-label {
  font-size: 12.5px; font-weight: 700; color: rgba(255,255,255,.75);
  letter-spacing: .04em; text-transform: uppercase;
}

.sp-input {
  background: rgba(0,51,255,.04);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 12px; padding: 12px 16px;
  color: #fff; font-size: 14px; font-family: 'Manrope', sans-serif;
  outline: none; transition: border-color .2s, background .2s, box-shadow .2s;
  width: 100%;
}
.sp-input::placeholder { color: rgba(255,255,255,.3); }
.sp-input:focus {
  border-color: rgba(151,125,255,.55);
  background: rgba(151,125,255,.05);
  box-shadow: 0 0 0 3px rgba(151,125,255,.1);
}
.sp-select { appearance: none; cursor: pointer; }
.sp-select option { background: #ffffff; color: #1e293b; }
.sp-textarea { resize: none; height: 88px; line-height: 1.55; }
.sp-datetime { cursor: pointer; color-scheme: dark; }
.sp-datetime::-webkit-calendar-picker-indicator {
  filter: invert(1) brightness(0.6) sepia(1) hue-rotate(50deg) saturate(4);
  cursor: pointer; opacity: 0.7;
}
.sp-datetime::-webkit-calendar-picker-indicator:hover { opacity: 1; }

/* ══ GOAL CHIPS ══ */
.sp-goals {
  display: flex; flex-wrap: wrap; gap: 10px;
}
.sp-goal-chip input { display: none; }
.sp-goal-chip span {
  display: inline-block; padding: 9px 18px; border-radius: 999px;
  border: 1px solid rgba(255,255,255,.15); background: rgba(0,51,255,.04);
  color: rgba(255,255,255,.75); font-size: 13.5px; font-weight: 600;
  cursor: pointer; transition: all .2s;
  font-family: 'Manrope', sans-serif;
}
.sp-goal-chip input:checked + span {
  background: rgba(151,125,255,.15);
  border-color: rgba(151,125,255,.6);
  color: #3B82F6;
  box-shadow: 0 0 12px rgba(151,125,255,.15);
}
.sp-goal-chip span:hover {
    border-color: #3B82F6;
    color: #3B82F6;
}

/* ══ SUBMIT BUTTON ══ */
.sp-submit {
  display: flex; align-items: center; justify-content: center; gap: 4px;
  background:linear-gradient(135deg, #3B82F6 0%, #0B00AB 100%); 
  border: none; border-radius: 999px;
  padding: 6px 6px 6px 28px; cursor: pointer;
  font-family: 'Manrope', sans-serif; font-size: 15px; font-weight: 700; color: #ffffff;
  margin-top: 6px;
  transition: all .3s cubic-bezier(.22,.68,0,1.2);
  box-shadow: 0 4px 22px rgba(0,51,255,.25);
}
.sp-submit:hover { 
  transform: scale(1.04) translateY(-2px); 
  box-shadow: 0 8px 32px rgba(151,125,255,.38); 
  background:linear-gradient(135deg, #0B00AB 0%, #00033D 100%);
}
.sp-submit-icon {
  width: 38px; height: 38px; border-radius: 50%; background: rgba(0,0,0,.2);
  display: flex; align-items: center; justify-content: center; margin-left: 12px;
  flex-shrink: 0;
}

/* ══ SUCCESS STATE ══ */
.sp-success {
  display: none; text-align: center; padding: 20px 0 10px;
  flex-direction: column; align-items: center; gap: 14px;
}
.sp-success.show { display: flex; }
.sp-success-icon { font-size: 56px; line-height: 1; }
.sp-success-title { font-size: 26px; font-weight: 800; color: #fff; }
.sp-success-msg { font-size: 15px; color: rgba(255,255,255,.65); line-height: 1.65; max-width: 340px; }

/* ═══════════════════════════════════════════════════════════════
   FULLY RESPONSIVE — BE FLUENCE HOMEPAGE
   Breakpoints: 1200px | 1024px | 768px | 480px | 360px
═══════════════════════════════════════════════════════════════ */

/* ── NAV: right-side wrapper ── */
.nav-right {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* ══════════════════════════════════════
   HAMBURGER BUTTON
══════════════════════════════════════ */
.nav-hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 44px; height: 44px;
  background: rgba(0,51,255,.06);
  border: 1px solid rgb(255 255 255 / 35%);
  border-radius: 12px;
  cursor: pointer;
  flex-shrink: 0;
  transition: background .2s, border-color .2s;
  position: relative; z-index: 2100;
  padding: 0;
}
.nav-hamburger:hover  { background: rgba(151,125,255,.1); border-color: rgba(151,125,255,.35); }
.nav-hamburger span {
  display: block; width: 20px; height: 2px;
  background: rgba(255,255,255,.85); border-radius: 2px;
  transition: transform .35s cubic-bezier(.22,.68,0,1.2), opacity .22s, width .22s;
  pointer-events: none;
}
.nav-hamburger.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); background: var(--lime); }
.nav-hamburger.active span:nth-child(2) { opacity: 0; width: 0; }
.nav-hamburger.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); background: var(--lime); }

/* ══════════════════════════════════════
   MOBILE DRAWER
══════════════════════════════════════ */
.mobile-drawer {
  position: fixed;
  inset: 0;
  z-index: 2050;
  visibility: hidden;
  pointer-events: none;
}
.mobile-drawer.open { visibility: visible; pointer-events: all; }

/* Semi-transparent overlay behind drawer */
.mobile-drawer-bg {
  position: absolute; inset: 0;
  background: rgba(15,23,42,.7);
  backdrop-filter: blur(4px);
  opacity: 0;
  transition: opacity .38s cubic-bezier(.22,.68,0,1.2);
}
.mobile-drawer.open .mobile-drawer-bg { opacity: 1; }

/* Drawer panel itself */
.mobile-drawer-content {
  position: absolute;
  top: 0; right: 0; bottom: 0;
  width: min(360px, 88vw);
  background: rgba(6,11,0,.97);
  backdrop-filter: blur(28px);
  border-left: 1px solid rgba(151,125,255,.12);
  padding: 80px 24px 36px;
  display: flex;
  flex-direction: column;
  gap: 0;
  overflow-y: auto;
  transform: translateX(100%);
  transition: transform .38s cubic-bezier(.22,.68,0,1.2);
}
.mobile-drawer.open .mobile-drawer-content { transform: translateX(0); }

/* Close button inside drawer */
.mn-close-btn {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 10px;
  color: rgba(255,255,255,0.8);
  cursor: pointer;
  transition: background .2s, border-color .2s, color .2s, transform .2s;
  z-index: 10;
}
.mn-close-btn:hover {
  background: rgba(200,255,0,0.12);
  border-color: rgba(200,255,0,0.35);
  color: #C8FF00;
  transform: rotate(90deg);
}

/* Noise texture in drawer */
.mobile-drawer-content::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity: .08;
}
/* Lime glow */
.mobile-drawer-content::after {
  content: ''; position: absolute; top: -120px; right: -120px; pointer-events: none;
  width: 400px; height: 400px; border-radius: 50%;
  background: radial-gradient(circle, rgba(151,125,255,.1) 0%, transparent 65%);
}

/* Nav links */
.mobile-nav-links {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 4px;
  position: relative; z-index: 1;
  margin-bottom: 8px;
}
.mobile-nav-links li a,
.mobile-nav-links .mn-link-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.07);
  color: #000;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  background: #fafbff;
  transition: background .2s, border-color .2s, color .2s;
  cursor: pointer;
  width: 100%;
}
.mobile-nav-links li a:hover,
.mobile-nav-links .mn-link-row:hover,
.mobile-nav-links li a:active {
  background: white;
  border-color: rgba(151,125,255,.28);
  color: var(--lime);
}
.mn-icon { font-size: 17px; flex-shrink: 0; }
.mn-arr {
  width: 14px; height: 14px; margin-left: auto; flex-shrink: 0;
  opacity: .28; transition: opacity .2s, transform .2s;
}
.mobile-nav-links li a:hover .mn-arr { opacity: 1; transform: translateX(3px); }
.mn-chev {
  width: 14px; height: 14px; margin-left: auto; flex-shrink: 0;
  opacity: .4; transition: transform .3s cubic-bezier(.22,.68,0,1.2), opacity .2s;
}
.mn-has-sub.mn-open .mn-chev { transform: rotate(180deg); opacity: .8; }

/* Sub-menu for services (level 1 - list of categories) */
.mn-sub {
  list-style: none;
  display: none;
  flex-direction: column;
  gap: 4px;
  padding: 8px 0 4px 0;
}
.mn-has-sub.mn-open .mn-sub { display: flex; }

/* Level 2 – individual service category rows */
.mn-cat-item {
  border-radius: 10px;
  overflow: visible;
}
.mn-cat-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 14px;
  border-radius: 10px;
  border: 1px solid rgba(46,42,255,.09);
  background: #fff;
  cursor: pointer;
  transition: background .18s, border-color .18s;
  width: 100%;
  user-select: none;
}
.mn-cat-row:hover, .mn-cat-row:active {
  background: rgba(46,42,255,.04);
  border-color: rgba(46,42,255,.22);
}
.mn-cat-item.mn-cat-open .mn-cat-row {
  background: rgb(255 255 255 / 78%);
  border-color: rgba(46,42,255,.2);
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.mn-cat-icon { font-size: 15px; flex-shrink: 0; }
.mn-cat-label {
  font-size: 13.5px;
  font-weight: 700;
  color: #1e293b;
  flex: 1;
}
.mn-cat-chev {
  width: 13px; height: 13px;
  opacity: .38; flex-shrink: 0;
  stroke: #2E2AFF;
  transition: transform .28s cubic-bezier(.22,.68,0,1.2), opacity .2s;
}
.mn-cat-item.mn-cat-open .mn-cat-chev { transform: rotate(180deg); opacity: .9; }

/* Level 3 – page links inside each category */
.mn-cat-pages {
  list-style: none;
  display: none;
  flex-direction: column;
  gap: 0px;
  padding: 4px 0 6px 0;
  border: 1px solid rgba(46,42,255,.12);
  border-top: none;
  border-radius: 0 0 10px 10px;
  background: rgba(248,249,255,.95);
}
.mn-cat-item.mn-cat-open .mn-cat-pages { display: flex; }
.mn-cat-pages li a {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  padding: 9px 16px;
  color: #475569;
  background: transparent;
  text-decoration: none;
  border-bottom: 1px solid rgba(46,42,255,.05);
  transition: background .15s, color .15s, padding-left .15s;
}
.mn-cat-pages li:last-child a { border-bottom: none; }
.mn-cat-pages li a::before {
  content: '';
  width: 5px; height: 5px;
  border-radius: 50%;
  background: #2E2AFF;
  opacity: .28;
  flex-shrink: 0;
  transition: opacity .15s;
}
.mn-cat-pages li a:hover {
  background: rgba(46,42,255,.05);
  color: #2E2AFF;
  padding-left: 20px;
}
.mn-cat-pages li a:hover::before { opacity: 1; }

/* View full page CTA inside category */
.mn-cat-pages li.mn-viewpage a {
  color: #2E2AFF;
  font-weight: 700;
  font-size: 12.5px;
  background: rgba(46,42,255,.05);
  border-top: 1px solid rgba(46,42,255,.1);
  border-bottom: none;
  margin-top: 2px;
}
.mn-cat-pages li.mn-viewpage a::before { display: none; }
.mn-cat-pages li.mn-viewpage a:hover {
  background: #2E2AFF;
  color: #fff;
  padding-left: 16px;
}

.mn-divider {
  height: 1px;
  background: rgba(0,51,255,.07);
  margin: 16px 0;
  flex-shrink: 0;
  position: relative; z-index: 1;
}

/* CTA button */
.mn-cta {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%;
  padding: 14px 14px 14px 24px;
  border-radius: 999px;
  background: var(--lime);
  color: #ffffff;
  font-size: 14px; font-weight: 800;
  border: none; cursor: pointer;
  font-family: 'Manrope', sans-serif;
  transition: background .2s, transform .2s;
  position: relative; z-index: 1;
  flex-shrink: 0;
}
.mn-cta:hover { background: #977DFF; transform: scale(1.02); }
.mn-cta-icon {
  width: 34px; height: 34px; border-radius: 50%;
  background: rgba(0,0,0,.18);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.mn-cta-icon svg { width: 14px; height: 14px; }

/* Footer status */
.mn-footer {
  margin-top: auto;
  padding-top: 24px;
  display: flex; align-items: center; gap: 8px;
  position: relative; z-index: 1;
  flex-shrink: 0;
}
.mn-status-dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--lime);
  animation: mnPulse 2s ease-in-out infinite; flex-shrink: 0;
}
@keyframes mnPulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.4;transform:scale(1.5)} }
.mn-status-text { font-size: 11.5px; color: rgba(255,255,255,.28); font-weight: 600; }


/* ══════════════════════════════════════
   1200px — Large Tablet / Small Desktop
══════════════════════════════════════ */
@media (max-width: 1200px) {
  nav { padding: 14px 36px; }

  .hero-body { padding: 110px 36px 80px; }
  h1.headline { font-size: clamp(44px, 5.5vw, 60px); }

  .clients-inner { padding: 0 36px; }
  .about-section { padding: 60px 36px; }
  .services-section { padding: 60px 36px; }
  .cs2-section { padding: 60px 36px; }
  .hiw-section { padding: 60px 36px; }
  .tst-section { padding: 60px 36px; }
  .pkg-section { padding: 60px 36px; }
  .faq-section { padding: 60px 36px; }
  .cnt2-section { padding: 60px 36px; }
  .sloc-section { padding: 60px 36px 100px; }
}

/* ══════════════════════════════════════
   1024px — Tablet Landscape
══════════════════════════════════════ */
@media (max-width: 1024px) {
  nav { padding: 14px 28px; }

  .hero-body { padding: 100px 28px 72px; }
  h1.headline { font-size: clamp(38px, 5vw, 52px); }

  /* Floating badges — pull closer to center */
  .badge-influencer { left: 3%; top: 62%; }
  .badge-CPA        { right: 4%; top: 18%; }
  .badge-marketing  { right: 3%; top: 67%; }

  /* Hero buttons — allow side by side */
  .hero-body > div {
    display: flex; gap: 12px; flex-wrap: wrap; justify-content: center;
  }

  .clients-inner { padding: 0 28px; }

  /* Sections */
  .about-section    { padding: 60px 28px; }
  .services-section { padding: 60px 28px; }
  .cs2-section      { padding: 60px 28px; }
  .hiw-section      { padding: 60px 28px; }
  .tst-section      { padding: 60px 28px; }
  .pkg-section      { padding: 60px 28px; }
  .faq-section      { padding: 60px 28px; }
  .cnt2-section     { padding: 60px 28px; }
  .sloc-section     { padding: 60px 28px 90px; }
}

/* ══════════════════════════════════════
   768px — Tablet Portrait / Mobile
══════════════════════════════════════ */
@media (max-width: 768px) {

  /* ── NAV ── */
  nav {
    padding: 13px 20px;
    background: rgba(8,14,0,.94);
    backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(151,125,255,.1);
  }
  .nav-links { display: none; }
  .nav-cta   { display: none; }
  .nav-hamburger { display: flex; }
  /* Hide mega menu on mobile */
  .mega-panel, .mega-overlay { display: none !important; }

  /* ── HERO ── */
  .hero { min-height: auto; }
  .hero-body {
    padding: 90px 20px 48px;
    align-items: center;
    text-align: center;
  }
  h1.headline {
    font-size: clamp(30px, 8.5vw, 44px);
    letter-spacing: -.02em;
    line-height: 1.1;
    margin-bottom: 14px;
  }
  .headline-row1 {
    gap: 8px;
    justify-content: center;
    flex-wrap: wrap;
    font-size: inherit;
  }
  .cpa-box { padding: 2px 10px 2px 8px; border-radius: 8px; gap: 6px; }
  .cpa-pill { font-size: 10.5px; padding: 2px 8px; }

  .subtext {
    font-size: 14.5px;
    max-width: 100%;
    margin-bottom: 28px;
    line-height: 1.65;
  }

  /* Hero CTAs — stacked, full width */
  .hero-body > div {
    display: flex;
    flex-direction: column;
    gap: 11px;
    width: 70%;
  }
  .cta-btn {
    width: 100%;
    justify-content: space-between;
    padding: 8px 8px 8px 22px;
    font-size: 14px;
  }
  .cta-btn .icon-circle { width: 36px; height: 36px; margin-left: 12px; }

  /* Floating badges — hide (clash with text on mobile) */
  .badge-influencer, .badge-CPA, .badge-marketing { display: none; }

  /* ── CLIENTS ── */
  .clients-section { padding-top: 40px; }
  .clients-inner { padding: 0 20px; }
  .clients-heading { font-size: clamp(22px, 6vw, 32px); }
  .clients-sub { font-size: 14px; margin-bottom: 36px; }

  /* ── ABOUT (supplement existing rules) ── */
  .about-section { padding: 60px 20px; }
  .about-header { margin-bottom: 36px; }
  .about-main-grid { gap: 14px; }
  .about-story-card { padding: 28px 24px; min-height: auto; }
  .about-value-card { padding: 22px 20px; }
  .about-cert-row { grid-template-columns: repeat(2,1fr); gap: 12px; }
  .about-mission-card { padding: 28px 24px; gap: 24px; }

  /* ── SERVICES (supplement existing) ── */
  .services-section { padding: 60px 20px; }
  .services-header { margin-bottom: 36px; }
  .svc-spotlight-inner { padding: 28px 24px; }
  .svc-stats-bar { grid-template-columns: 1fr 1fr; }
  .svc-tab-sub { display: none; }

  /* ── CASE STUDIES (cs2) ── */
  .cs2-section { padding: 60px 20px; }
  .cs2-question { padding: 18px 20px; gap: 12px; }
  .cs2-answer   { padding: 0 20px 0 20px; }
  .cs2-q-kpi    { display: none; }
  .cs2-q-num    { display: none; }
  .cs2-cta-strip { flex-direction: column; align-items: flex-start; padding: 24px 20px; }
  .cs2-cta-btns  { flex-direction: column; width: 100%; }
  .cs2-cta-primary, .cs2-cta-ghost { justify-content: center; }

  /* ── HOW IT WORKS (supplement existing) ── */
  .hiw-section { padding: 60px 0; }
  .hiw-inner   { padding: 0 20px; }
  .hiw-header  { margin-bottom: 40px; }
  .hiw-heading { font-size: clamp(30px, 7vw, 48px); }
  .hiw-subtext { font-size: 14px; }
  .hiw-bottom-card { padding: 24px 20px; }

  /* ── TESTIMONIALS (supplement existing) ── */
  .tst-section { padding: 60px 20px; }
  .tst-spotlight { padding: 28px 22px; }
  .tst-deco-quote { font-size: 120px; }
  .tst-row3 { grid-template-columns: 1fr; }
  .tst-score-block { padding: 12px 16px; }
  .tst-score-num { font-size: 28px; }

  /* ── PACKAGES (supplement existing) ── */
  .pkg-section { padding: 60px 20px; }
  .pkg-cards { grid-template-columns: 1fr; }
  .pkg-card-pro { margin-top: 0; }
  .pkg-compare-row { grid-template-columns: 1fr; }
  .pkg-enterprise { padding: 24px 20px; flex-direction: column; align-items: flex-start; }

  /* ── CONTENT (cnt2 — supplement) ── */
  .cnt2-section { padding: 60px 20px; }
  .cnt2-question { padding: 18px 18px; gap: 12px; }
  .cnt2-answer   { padding: 0 18px 20px 18px; }
  .cnt2-see-more-wrap { padding: 14px 18px 22px 18px; }
  .cnt2-q-num    { display: none; }
  .cnt2-q-stat   { display: none; }
  .cnt2-cta-strip { flex-direction: column; }

  /* ── FAQ (supplement existing) ── */
  .faq-section { padding: 60px 20px; }
  .faq-header { margin-bottom: 40px; }

  /* ── LOCATIONS (supplement existing) ── */
  .sloc-section { padding: 60px 20px 80px; }
  .sloc-world-strip { padding: 24px 20px; flex-direction: column; align-items: flex-start; }
  .sloc-world-right { flex-direction: column; align-items: flex-start; gap: 12px; }

  /* ── FOOTER (supplement existing) ── */
  .ft-cta-banner { padding: 48px 20px; }
  .ft-cta-inner  { grid-template-columns: 1fr; gap: 28px; }
  .ft-cta-right  { align-items: flex-start; }
  .ft-body       { padding: 48px 20px 36px; }
  .ft-body-grid  { grid-template-columns: 1fr 1fr; gap: 28px; }
  .ft-wordmark-wrap { padding: 0 20px; }
  .ft-bottom     { padding: 18px 20px; }
  .ft-newsletter { padding: 28px 20px; }
  .ft-newsletter-inner { flex-direction: column; align-items: flex-start; }
  .ft-nl-form { min-width: 0; width: 100%; }
  .ft-wordmark {font-size: 50px; }
  /* ── POPUP MODAL ── */
  .sp-modal { padding: 28px 20px 28px; border-radius: 18px; }
  .sp-title  { font-size: clamp(20px,5vw,26px); }
  .sp-row    { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════
   480px — Small Phone
══════════════════════════════════════ */
@media (max-width: 480px) {
  nav { padding: 12px 16px; }
  .logo { font-size: 15px; }

  .hero-body { padding: 78px 16px 44px; }
  h1.headline {
    font-size: clamp(26px, 9vw, 36px);
    line-height: 1.12;
  }
  .cpa-box  { padding: 1px 8px 1px 6px; gap: 5px; }
  .cpa-pill { font-size: 10px; }
  .subtext  { font-size: 14px; margin-bottom: 22px; }
  .cta-btn  { font-size: 13.5px; padding: 7px 7px 7px 18px; }
  .cta-btn .icon-circle { width: 34px; height: 34px; }

  /* Clients */
  .clients-sub { margin-bottom: 24px; }
  .carousel-viewport { -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 5%, #000 95%, transparent 100%); mask-image: linear-gradient(to right, transparent 0%, #000 5%, #000 95%, transparent 100%); }

  /* About */
  .about-cert-row { grid-template-columns: 1fr 1fr; gap: 10px; }
  .cert-card { padding: 18px 14px; }

  /* Services */
  .svc-tab { padding: 10px 14px; gap: 8px; }

  /* Testimonials */
  .tst-card { padding: 20px 18px; }

  /* Packages */
  .pkg-card { padding: 28px 22px 24px; }
  .pkg-card-pro { padding: 36px 26px 30px; }

  /* Footer */
  .ft-body-grid { grid-template-columns: 1fr; gap: 24px; }
  .ft-cta-heading { font-size: clamp(24px,7vw,36px); }
  .ft-bottom-inner { flex-direction: column; align-items: flex-start; gap: 10px; }

  /* Case Studies */
  .cs2-cta-strip { padding: 20px 16px; }
  .cs2-question  { padding: 16px 16px; }

  /* Popup */
  .sp-modal  { margin: 0 4px; padding: 24px 16px; }
  .sp-submit { font-size: 13.5px; padding: 5px 5px 5px 20px; }
  .sp-submit-icon { width: 34px; height: 34px; }
}

/* ══════════════════════════════════════
   360px — Ultra Small
══════════════════════════════════════ */
@media (max-width: 360px) {
  nav { padding: 10px 14px; }
  .logo { font-size: 13px; letter-spacing: .06em; }
  .nav-hamburger { width: 38px; height: 38px; }

  h1.headline { font-size: 24px; }
  .subtext { font-size: 13.5px; }
  .cta-btn { font-size: 13px; }

  .mobile-drawer-content { width: 92vw; padding: 72px 16px 28px; }
  .mn-cta { font-size: 13px; padding: 12px 12px 12px 18px; }
}

/* ══════════════════════════════════════════════════════
   BLUE / WHITE THEME FINALIZATION OVERRIDES
   Ensures all elements match the clean professional theme
══════════════════════════════════════════════════════ */

/* Fix any remaining white-transparent texts on light bg */
.pkg-price-currency, .pkg-price-num { color: #1e293b; }
.pkg-card-pro .pkg-price-num { color: var(--lime); }
.pkg-feature { color: rgba(30,41,59,.75); }
.pkg-card:hover .pkg-feature { color: rgba(30,41,59,.9); }
.pkg-feature-label { color: rgba(30,41,59,.55); }
.pkg-feature-divider { background: rgba(30,41,59,.07); }

/* FAQs on light bg */
.faq-q-text { color: #1e293b; font-weight: 700; }
.faq-a-text { color: rgba(30,41,59,.7); }
.faq-item { border: 1px solid rgba(0,51,255,.1); }
.faq-item.open { background: #f0f6ff; border-color: rgba(0,51,255,.2); }
.faq-item.open .faq-q-icon { background: var(--lime); border-color: var(--lime); }
.faq-item.open .faq-q-icon svg { stroke: #ffffff; }
.faq-q-num { color: var(--lime); }

/* Testimonial cards */
.tst-card { background: #ffffff; border: 1px solid rgba(0,51,255,.1); }
.tst-card:hover { background: #f0f6ff; }
.tst-quote-body { color: rgba(30,41,59,.75); }
.tst-name { color: #1e293b; }
.tst-role { color: rgba(30,41,59,.5); }

/* Pkg cards */
.pkg-card { background: #ffffff; border: 1px solid rgba(0,51,255,.12); }
.pkg-card-pro { background: #ffffff; border-color: rgba(0,51,255,.3); }
.pkg-plan-name, .pkg-plan-slogan { color: #1e293b; }
.pkg-cta-outline { border: 1.5px solid rgba(0,51,255,.35); color: var(--lime); background: transparent; }
.pkg-compare-cell strong { color: #1e293b; }
.pkg-enterprise-title { color: #1e293b; }
.pkg-enterprise-desc { color: rgba(30,41,59,.6); }
.pkg-enterprise { background: #ffffff; border: 1px solid rgba(0,51,255,.12); }

/* Case study cards */
.cs-file { background: #ffffff; border: 1px solid rgba(0,51,255,.1); }
.cs-file:hover { background: #f0f6ff; border-color: rgba(0,51,255,.25); }
.cs-file-label { color: rgba(30,41,59,.5); }
.cs-file-title { color: #1e293b; }

/* How it works */
.hiw-slide-num { color: rgba(0,51,255,.25); }
.hiw-slide-desc { color: #ffffff; }

/* Content section (cnt2) */
.cnt2-q-text { color: #1e293b; }
.cnt2-a-text { color: rgba(30,41,59,.7); }
.cnt2-item { border: 1px solid rgba(0,51,255,.1); background: #ffffff; }
.cnt2-item.open { background: #f0f6ff; border-color: rgba(0,51,255,.2); }

/* Locations */
.sloc-link-city { color: #1e293b; }
.sloc-link-country { color: rgba(30,41,59,.5); }

/* Strategy popup fixes */
.sp-modal { background: #ffffff; border: 1px solid rgba(0,51,255,.15); }
.sp-title { color: #1e293b; }
.sp-subtitle { color: rgba(30,41,59,.6); }
.sp-label { color: rgba(30,41,59,.7); font-size: 12px; font-weight: 600; }
.sp-input { background: #ffffff; border-color: rgba(0,51,255,.2); color: #1e293b; }
.sp-input:focus { background: #f0f6ff; border-color: rgba(0,51,255,.45); }
.sp-input::placeholder { color: rgba(30,41,59,.35); }
.sp-goal-chip span {
  border: 1px solid rgba(0,51,255,.2);
  background: rgba(0,51,255,.04);
  color: rgba(30,41,59,.7);
}
.sp-goal-chip input:checked ~ span {
  background: rgba(0,51,255,.12);
  border-color: rgba(0,51,255,.45);
  color: var(--lime);
}
.sp-success { color: #1e293b; }
.sp-success-title { color: #1e293b; }
.sp-success-msg { color: rgba(30,41,59,.7); }

/* Mobile drawer */
.mobile-drawer-content {
  background: #0033ff30;
  border-left: 1px solid rgba(0,51,255,.15);
}
.mn-link-row, .mobile-nav-links li a { color: #1e293b; }
.mn-footer { color: rgba(30,41,59,.5); }
.mn-status-dot { background: #22c55e; }

/* Nav on scroll / white bg */
nav { background: #2e2aff30; border-bottom: 1px solid rgba(0,51,255,.08); }

/* ══════════════════════════════════════════════
   PREMIUM & PROFESSIONAL SECTIONS
   Advanced styling with modern design patterns
   ══════════════════════════════════════════════ */

/* Premium Hero Section */
.premium-hero {
  position: relative;
  min-height: 90vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: linear-gradient(135deg, #F2E6EE 0%, rgba(151,125,255,0.08) 100%);
}

.premium-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: 
    radial-gradient(circle at 20% 30%, rgba(0,51,255,0.08) 0%, transparent 50%),
    radial-gradient(circle at 80% 70%, rgba(151,125,255,0.12) 0%, transparent 50%);
  pointer-events: none;
}

.premium-hero-content {
  position: relative;
  z-index: 10;
  text-align: center;
  max-width: 1000px;
  padding: 0 40px;
}

/* Floating Badge Pills */
.floating-badge {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: 100px;
  background: rgba(255,255,255,0.95);
  border: 1.5px solid rgba(151,125,255,0.2);
  backdrop-filter: blur(20px);
  box-shadow: 
    0 8px 32px rgba(151,125,255,0.15),
    0 2px 8px rgba(0,0,0,0.05);
  font-size: 13px;
  font-weight: 700;
  color: #1e293b;
  animation: float-gentle 4s ease-in-out infinite;
  transition: all 0.3s cubic-bezier(0.22,0.68,0,1.2);
}

.floating-badge:hover {
  transform: translateY(-8px) scale(1.05);
  box-shadow: 
    0 16px 48px rgba(151,125,255,0.25),
    0 4px 16px rgba(0,0,0,0.08);
  border-color: rgba(0,51,255,0.4);
}

.floating-badge-icon {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: linear-gradient(135deg, #3B82F6, #977DFF);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: #ffffff;
}

.floating-badge.badge-top-left {
  top: 15%;
  left: 8%;
  animation-delay: 0s;
}

.floating-badge.badge-top-right {
  top: 20%;
  right: 12%;
  animation-delay: 0.7s;
}

.floating-badge.badge-bottom-left {
  bottom: 25%;
  left: 10%;
  animation-delay: 1.4s;
}

.floating-badge.badge-bottom-right {
  bottom: 28%;
  right: 15%;
  animation-delay: 2.1s;
}

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

/* Premium Headline */
.premium-headline {
  font-size: clamp(42px, 6vw, 72px);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: -0.03em;
  margin-bottom: 24px;
  color: #1e293b;
}

.premium-headline .highlight-box {
  display: inline-block;
  position: relative;
  padding: 4px 20px;
  background: linear-gradient(135deg, rgba(151,125,255,0.15), rgba(0,51,255,0.08));
  border-radius: 16px;
  border: 2px solid rgba(151,125,255,0.3);
}

.premium-headline .gradient-text {
  background: linear-gradient(135deg, #3B82F6, #977DFF);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Premium Subtitle */
.premium-subtitle {
  font-size: clamp(16px, 2vw, 19px);
  line-height: 1.7;
  color: rgba(30,41,59,0.7);
  max-width: 700px;
  margin: 0 auto 40px;
  font-weight: 500;
}

/* Premium Button Group */
.premium-btn-group {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 40px;
}

.premium-btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 16px 32px;
  border-radius: 100px;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.3s cubic-bezier(0.22,0.68,0,1.2);
  position: relative;
  overflow: hidden;
  border: none;
  cursor: pointer;
  font-family: 'Manrope', sans-serif;
}

.premium-btn-primary {
  background: linear-gradient(135deg, #3B82F6 0%, #0B00AB 100%);
  color: #ffffff;
  box-shadow: 
    0 8px 24px rgba(0,51,255,0.3),
    0 2px 8px rgba(0,0,0,0.1);
}

.premium-btn-primary:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 
    0 16px 40px rgba(0,51,255,0.4),
    0 4px 16px rgba(0,0,0,0.15);
}

.premium-btn-secondary {
  background: rgba(255,255,255,0.95);
  color: #1e293b;
  border: 2px solid rgba(151,125,255,0.3);
  backdrop-filter: blur(10px);
  box-shadow: 
    0 4px 16px rgba(151,125,255,0.15),
    0 2px 6px rgba(0,0,0,0.05);
}

.premium-btn-secondary:hover {
  background: rgba(255,255,255,1);
  border-color: rgba(0,51,255,0.5);
  transform: translateY(-3px) scale(1.02);
  box-shadow: 
    0 12px 32px rgba(151,125,255,0.25),
    0 4px 12px rgba(0,0,0,0.1);
}

.premium-btn-icon {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: rgba(255,255,255,0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s;
}

.premium-btn:hover .premium-btn-icon {
  transform: rotate(45deg);
}

/* Premium Card Section */
.premium-cards-section {
  padding: 100px 40px;
  background: #F2E6EE;
  position: relative;
}

.premium-cards-container {
  max-width: 1200px;
  margin: 0 auto;
}

.premium-section-header {
  text-align: center;
  margin-bottom: 60px;
}

.premium-section-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  background: rgba(151,125,255,0.1);
  border: 1px solid rgba(151,125,255,0.3);
  border-radius: 100px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #3B82F6;
  margin-bottom: 16px;
}

.premium-section-title {
  font-size: clamp(32px, 5vw, 56px);
  font-weight: 900;
  line-height: 1.15;
  color: #1e293b;
  margin-bottom: 16px;
  letter-spacing: -0.02em;
}

.premium-section-description {
  font-size: 18px;
  line-height: 1.7;
  color: rgba(30,41,59,0.65);
  max-width: 700px;
  margin: 0 auto;
}

/* Premium Cards Grid */
.premium-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
  gap: 28px;
  margin-top: 48px;
}

.premium-card {
  position: relative;
  background: rgba(255,255,255,0.9);
  border: 2px solid rgba(151,125,255,0.15);
  border-radius: 24px;
  padding: 40px 32px;
  transition: all 0.4s cubic-bezier(0.22,0.68,0,1.2);
  overflow: hidden;
  backdrop-filter: blur(10px);
}

.premium-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #3B82F6, #977DFF);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s cubic-bezier(0.22,0.68,0,1.2);
}

.premium-card:hover::before {
  transform: scaleX(1);
}

.premium-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 50% 0%, rgba(151,125,255,0.08), transparent 70%);
  opacity: 0;
  transition: opacity 0.4s;
}

.premium-card:hover {
  transform: translateY(-8px);
  border-color: rgba(0,51,255,0.3);
  box-shadow: 
    0 24px 64px rgba(151,125,255,0.2),
    0 8px 24px rgba(0,0,0,0.08);
}

.premium-card:hover::after {
  opacity: 1;
}

.premium-card-icon {
  width: 64px;
  height: 64px;
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(0,51,255,0.1), rgba(151,125,255,0.05));
  border: 2px solid rgba(151,125,255,0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  margin-bottom: 24px;
  position: relative;
  z-index: 2;
  transition: all 0.4s cubic-bezier(0.22,0.68,0,1.2);
}

.premium-card:hover .premium-card-icon {
  transform: scale(1.1) rotate(5deg);
  background: linear-gradient(135deg, rgba(0,51,255,0.15), rgba(151,125,255,0.1));
  border-color: rgba(0,51,255,0.4);
}

.premium-card-title {
  font-size: 22px;
  font-weight: 800;
  color: #1e293b;
  margin-bottom: 12px;
  position: relative;
  z-index: 2;
}

.premium-card-description {
  font-size: 15px;
  line-height: 1.7;
  color: rgba(30,41,59,0.65);
  margin-bottom: 24px;
  position: relative;
  z-index: 2;
}

.premium-card-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 700;
  color: #3B82F6;
  text-decoration: none;
  position: relative;
  z-index: 2;
  transition: gap 0.3s;
}

.premium-card-link:hover {
  gap: 12px;
}

.premium-card-link svg {
  width: 16px;
  height: 16px;
  stroke: currentColor;
  stroke-width: 2.5;
  transition: transform 0.3s;
}

.premium-card-link:hover svg {
  transform: translateX(4px);
}

/* Premium Feature Section */
.premium-feature-section {
  padding: 120px 40px;
  background: linear-gradient(180deg, #F2E6EE 0%, rgba(242,230,238,0.5) 100%);
  position: relative;
  overflow: hidden;
}

.premium-feature-section::before {
  content: '';
  position: absolute;
  width: 600px;
  height: 600px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(151,125,255,0.08), transparent 70%);
  top: -200px;
  right: -200px;
  pointer-events: none;
}

.premium-feature-container {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

.premium-feature-content h2 {
  font-size: clamp(36px, 5vw, 52px);
  font-weight: 900;
  line-height: 1.15;
  color: #1e293b;
  margin-bottom: 24px;
  letter-spacing: -0.02em;
}

.premium-feature-content p {
  font-size: 17px;
  line-height: 1.8;
  color: rgba(30,41,59,0.7);
  margin-bottom: 32px;
}

.premium-feature-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 40px;
}

.premium-feature-item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 16px;
  background: rgba(255,255,255,0.6);
  border-radius: 16px;
  border: 1px solid rgba(151,125,255,0.15);
  transition: all 0.3s;
}

.premium-feature-item:hover {
  background: rgba(255,255,255,0.9);
  border-color: rgba(0,51,255,0.3);
  transform: translateX(8px);
}

.premium-feature-item-icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: linear-gradient(135deg, #3B82F6, #977DFF);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  font-size: 18px;
  flex-shrink: 0;
}

.premium-feature-item-content h4 {
  font-size: 16px;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 4px;
}

.premium-feature-item-content p {
  font-size: 14px;
  color: rgba(30,41,59,0.65);
  margin: 0;
  line-height: 1.6;
}

.premium-feature-visual {
  position: relative;
  aspect-ratio: 1;
}

.premium-visual-box {
  position: absolute;
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(0,51,255,0.08), rgba(151,125,255,0.05));
  border: 2px solid rgba(151,125,255,0.2);
  backdrop-filter: blur(10px);
  box-shadow: 0 16px 48px rgba(151,125,255,0.15);
}

.premium-visual-box:nth-child(1) {
  width: 70%;
  height: 70%;
  top: 0;
  left: 0;
  animation: float-box-1 6s ease-in-out infinite;
}

.premium-visual-box:nth-child(2) {
  width: 60%;
  height: 60%;
  bottom: 0;
  right: 0;
  animation: float-box-2 7s ease-in-out infinite;
}

@keyframes float-box-1 {
  0%, 100% { transform: translate(0, 0) rotate(0deg); }
  50% { transform: translate(-10px, -10px) rotate(2deg); }
}

@keyframes float-box-2 {
  0%, 100% { transform: translate(0, 0) rotate(0deg); }
  50% { transform: translate(10px, 10px) rotate(-2deg); }
}

/* Responsive Design */
@media (max-width: 968px) {
  .premium-feature-container {
    grid-template-columns: 1fr;
    gap: 60px;
  }
  
  .premium-cards-grid {
    grid-template-columns: 1fr;
  }
  
  .floating-badge {
    display: none;
  }
}

@media (max-width: 640px) {
  .premium-btn-group {
    flex-direction: column;
    width: 100%;
  }
  
  .premium-btn {
    width: 100%;
    justify-content: center;
  }
}

/* ══════════════════════════════════════════════════
   HEADLINE TAGLINE SLIDER — inside h1, same size
══════════════════════════════════════════════════ */

/* Wrapper: sits below "We Are [box]" row inside h1 */
.tl-headline-wrap {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  margin-top: 6px;
}

/* Soft radial glow behind the animated text */
.tl-glow-bg {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 700px; height: 120px;
  background: radial-gradient(ellipse, rgba(200,255,0,0.1) 0%, rgba(46,42,255,0.18) 45%, transparent 72%);
  filter: blur(28px);
  pointer-events: none;
  z-index: 0;
  animation: tlGlowPulse 4s ease-in-out infinite alternate;
}
@keyframes tlGlowPulse {
  0%   { opacity: 0.6; transform: translate(-50%,-50%) scale(1); }
  100% { opacity: 1;   transform: translate(-50%,-50%) scale(1.08); }
}

/* The single visible-height slot — no overflow clipping needed
   because each line is position:absolute and animates in place */
.tl-headline-slot {
  position: relative;
  /* Height = h1 line-height: 65px * 1.07 ≈ 70px */
  height: 74px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}

/* Every tagline line — inherits ALL h1 typography */
.tl-line {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%) scale(1);
  white-space: nowrap;
  font-size: inherit;       /* 65px from h1 */
  font-weight: inherit;     /* 800 */
  letter-spacing: inherit;  /* -.025em */
  line-height: inherit;     /* 1.07 */
  color: rgba(255,255,255,0.92);
  font-style: normal;

  /* Default: invisible */
  opacity: 0;
  filter: blur(0px);
  pointer-events: none;
  will-change: transform, opacity, filter;
}

/* ── ENTER animation: rises from below, de-blurs ── */
.tl-line.tl-in {
  animation: tlIn 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes tlIn {
  0%   { opacity: 0; filter: blur(16px); transform: translate(-50%, calc(-50% + 32px)) scale(0.91); }
  55%  { filter: blur(3px); }
  100% { opacity: 1; filter: blur(0);    transform: translate(-50%, -50%) scale(1); }
}

/* ── HOLD: fully visible, stable ── */
.tl-line.tl-hold {
  opacity: 1;
  filter: blur(0);
  transform: translate(-50%, -50%) scale(1);
}

/* ── LEAVE animation: floats up, blurs out ── */
.tl-line.tl-out {
  animation: tlOut 0.55s cubic-bezier(0.55, 0, 1, 0.45) forwards;
}
@keyframes tlOut {
  0%   { opacity: 1; filter: blur(0);    transform: translate(-50%, -50%) scale(1); }
  100% { opacity: 0; filter: blur(12px); transform: translate(-50%, calc(-50% - 28px)) scale(1.04); }
}

/* ── Finale line: "Dream. Do. Digital." — extra pop ── */
.tl-finale {
  font-style: normal;
}
.tl-lime {
  color: #C8FF00;
  font-style: normal;
  text-shadow: 0 0 28px rgba(200,255,0,0.55), 0 0 60px rgba(200,255,0,0.2);
}

/* ── Progress dots ── */
.tl-dots {
  display: flex;
  align-items: center;
  gap: 7px;
  z-index: 2;
}
.tl-dot {
  width: 5px; height: 5px;
  border-radius: 50%;
  background: rgba(255,255,255,0.2);
  cursor: pointer;
  transition: background 0.35s ease, transform 0.35s cubic-bezier(0.22,.68,0,1.2), width 0.35s cubic-bezier(0.22,.68,0,1.2), border-radius 0.35s;
}
.tl-dot.tl-dot-on {
  background: #C8FF00;
  transform: scale(1.3);
  width: 16px;
  border-radius: 3px;
  box-shadow: 0 0 10px rgba(200,255,0,0.55);
}

/* ── Mobile: scale down to match responsive h1 ── */
@media (max-width:768px) {
  .tl-headline-slot { height: 54px; }
  .tl-line          { white-space: normal; text-align: center; width: 90vw; }
}
@media (max-width:480px) {
  .tl-headline-slot { height: 46px; }
}

/* ═══════════════════════════════════
   FLOATING HERO PARTICLES
═══════════════════════════════════ */
.hero-particles {
  position: absolute; inset: 0;
  overflow: hidden; pointer-events: none; z-index: 1;
}
.hp {
  position: absolute; border-radius: 50%;
  animation: hpFloat linear infinite; opacity: 0;
}
.hp1  { width:3px;  height:3px;  background:rgba(200,255,0,.7);    left:8%;  top:70%; animation-duration:14s; animation-delay:-2s;  }
.hp2  { width:2px;  height:2px;  background:rgba(255,255,255,.5);  left:15%; top:85%; animation-duration:18s; animation-delay:-7s;  }
.hp3  { width:4px;  height:4px;  background:rgba(200,255,0,.4);    left:23%; top:60%; animation-duration:11s; animation-delay:-1s;  }
.hp4  { width:2px;  height:2px;  background:rgba(255,255,255,.3);  left:35%; top:80%; animation-duration:22s; animation-delay:-9s;  }
.hp5  { width:3px;  height:3px;  background:rgba(200,255,0,.6);    left:50%; top:75%; animation-duration:16s; animation-delay:-4s;  }
.hp6  { width:5px;  height:5px;  background:rgba(151,125,255,.35); left:62%; top:65%; animation-duration:13s; animation-delay:-6s;  }
.hp7  { width:2px;  height:2px;  background:rgba(255,255,255,.45); left:72%; top:90%; animation-duration:20s; animation-delay:-11s; }
.hp8  { width:3px;  height:3px;  background:rgba(200,255,0,.5);    left:80%; top:70%; animation-duration:15s; animation-delay:-3s;  }
.hp9  { width:4px;  height:4px;  background:rgba(255,255,255,.25); left:88%; top:82%; animation-duration:17s; animation-delay:-8s;  }
.hp10 { width:2px;  height:2px;  background:rgba(200,255,0,.65);   left:92%; top:55%; animation-duration:12s; animation-delay:-5s;  }
.hp11 { width:6px;  height:6px;  background:rgba(151,125,255,.2);  left:42%; top:88%; animation-duration:24s; animation-delay:-13s; }
.hp12 { width:3px;  height:3px;  background:rgba(255,255,255,.4);  left:57%; top:92%; animation-duration:19s; animation-delay:-10s; }
@keyframes hpFloat {
  0%   { opacity:0;   transform:translateY(0)      scale(0.5); }
  10%  { opacity:1; }
  90%  { opacity:0.6; }
  100% { opacity:0;   transform:translateY(-340px) scale(1.2); }
}



/* ══════════════════════════════════════════════════
   SYNCED ANIMATED PARAGRAPH SLOT
══════════════════════════════════════════════════ */

.tl-para-wrap {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  margin-bottom: 38px;
  width: 100%;              /* ← fix: must be full width so slot doesn't collapse */
}

/* Fixed-height slot — overflow:hidden stops bleed into headline above */
.tl-para-slot {
  position: relative;
  height: 100px;            /* enough for 3 wrapped lines at 16.5px × 1.65 lh */
  width: 100%;
  max-width: 520px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;         /* ← the critical fix: clips absolute children */
}

/* Each paragraph — inherits subtext styling */
.tl-para {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%) scale(1);
  width: 100%;
  text-align: center;
  margin: 0;

  /* Same as .subtext */
  color: rgba(255,255,255,0.72);
  font-size: clamp(14px, 1.5vw, 16.5px);
  font-weight: 500;
  line-height: 1.65;

  /* Default: invisible */
  opacity: 0;
  filter: blur(0);
  pointer-events: none;
  will-change: transform, opacity, filter;
}

/* ── Enter: rises softly from below, de-blurs ── */
.tl-para.tl-in {
  animation: tlParaIn 0.82s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes tlParaIn {
  0%   { opacity: 0; filter: blur(8px);  transform: translate(-50%, calc(-50% + 18px)) scale(0.97); }
  55%  { filter: blur(1px); }
  100% { opacity: 1; filter: blur(0);    transform: translate(-50%, -50%) scale(1); }
}

/* ── Hold: visible & stable ── */
.tl-para.tl-hold {
  opacity: 1;
  filter: blur(0);
  transform: translate(-50%, -50%) scale(1);
}

/* ── Leave: drifts up, fades out ── */
.tl-para.tl-out {
  animation: tlParaOut 0.52s cubic-bezier(0.55, 0, 1, 0.45) forwards;
}
@keyframes tlParaOut {
  0%   { opacity: 1; filter: blur(0);   transform: translate(-50%, -50%) scale(1); }
  100% { opacity: 0; filter: blur(7px); transform: translate(-50%, calc(-50% - 16px)) scale(1.02); }
}

/* ── Mobile ── */
@media (max-width: 600px) {
  .tl-para-slot { height: 110px; max-width: 90vw; }
  .tl-para      { font-size: 14px; }
}