/* ═══════════════════════════════════════════════════════
   ROOT SYSTEM — Midnight Agency Dark Luxury
═══════════════════════════════════════════════════════ */
:root {
  --bg:       #080C14;
  --bg2:      #0C1120;
  --bg3:      #111927;
  --surface:  rgba(255,255,255,0.03);
  --border:   rgba(255,255,255,0.07);
  --border2:  rgba(255,255,255,0.12);
  --white:    #F0EEE8;
  --dim:      rgba(240,238,232,0.55);
  --dimmer:   rgba(240,238,232,0.28);
  --blue:     #1B5EF7;
  --blue2:    #2B7BFF;
  --blue-g:   rgba(27,94,247,0.18);
  --gold:     #C8A96E;
  --gold-dim: rgba(200,169,110,0.15);
  --green:    #22C55E;
  --red:      #EF4444;
  --ease1: cubic-bezier(0.16,1,0.3,1);
  --ease2: cubic-bezier(0.76,0,0.24,1);
  --ease3: cubic-bezier(0.4,0,0.2,1);
}
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box }
html { scroll-behavior: smooth; font-size: 16px; overflow-x:hidden; max-width:100vw }
body {
  font-family: 'DM Sans', sans-serif;
  background: var(--bg);
  color: var(--white);
  overflow-x: hidden;
  max-width:100vw;
  cursor: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ═══════════════════════════════════════════════════════
   CURSOR
═══════════════════════════════════════════════════════ */
#cursor { position:fixed; top:0; left:0; z-index:9999; pointer-events:none; mix-blend-mode:normal }
.c-dot {
  width:8px; height:8px; border-radius:50%;
  background: var(--blue2);
  position:absolute; transform:translate(-50%,-50%);
  transition: width .25s var(--ease1), height .25s var(--ease1), background .3s;
  box-shadow: 0 0 12px var(--blue2);
}
.c-ring {
  width:36px; height:36px; border-radius:50%;
  border: 1px solid rgba(27,94,247,0.45);
  position:absolute; transform:translate(-50%,-50%);
  transition: width .4s var(--ease1), height .4s var(--ease1), border-color .3s, opacity .3s;
}
body.hovering .c-dot { width:56px; height:56px; background:rgba(27,94,247,0.08); box-shadow:none }
body.hovering .c-ring { opacity:0 }
body.clicking .c-dot { width:44px; height:44px; background:rgba(27,94,247,0.2) }

/* ═══════════════════════════════════════════════════════
   PAGE LOADER
═══════════════════════════════════════════════════════ */
#loader {
  position:fixed; inset:0; z-index:1000;
  background: var(--bg);
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  gap:32px;
}
.loader-logo {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(48px,8vw,96px);
  letter-spacing:8px;
  color: var(--white);
  overflow:hidden;
}
.loader-logo span { display:inline-block; transform:translateY(110%); opacity:0 }
.loader-progress {
  width:180px; height:1px;
  background: rgba(255,255,255,0.1);
  position:relative; overflow:hidden;
}
.loader-bar {
  height:100%; width:0%;
  background: linear-gradient(90deg, var(--blue), var(--blue2));
  transition: width .05s linear;
  box-shadow: 0 0 8px var(--blue2);
}
.loader-num {
  font-family:'Bebas Neue',sans-serif;
  font-size:13px; letter-spacing:4px;
  color: var(--dimmer);
}

/* ═══════════════════════════════════════════════════════
   NAV
═══════════════════════════════════════════════════════ */
#nav {
  position:fixed; top:0; left:0; right:0; z-index:200;
  padding:0 56px;
  height:72px;
  display:flex; justify-content:space-between; align-items:center;
  transition: background .6s, border-bottom .6s;
}
#nav.scrolled {
  background: rgba(8,12,20,0.88);
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  border-bottom: 1px solid var(--border);
}
.nav-logo {
  font-family:'Bebas Neue',sans-serif;
  font-size:22px; letter-spacing:5px;
  color: var(--white); text-decoration:none;
  display:flex; align-items:center; gap:1px;
  flex-shrink: 0;
}
.logo-ads { color:var(--white) }
.logo-worm { color:var(--blue2) }
.logo-dot {
  width:5px; height:5px; border-radius:50%;
  background:var(--gold); margin-left:2px; margin-bottom:2px;
  box-shadow: 0 0 6px var(--gold);
  animation: dotPulse 2.4s ease-in-out infinite;
}
@keyframes dotPulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.4;transform:scale(0.6)} }
.nav-links { display:flex; gap:40px; list-style:none }
.nav-links a {
  font-size:10.5px; letter-spacing:2.5px; text-transform:uppercase;
  color: var(--dimmer); text-decoration:none;
  transition: color .3s;
  font-weight:400;
}
.nav-links a:hover { color:var(--white) }
.nav-cta {
  padding:10px 26px;
  background: var(--blue);
  color:#fff; font-size:10px; letter-spacing:2.5px; text-transform:uppercase;
  font-weight:500; text-decoration:none; border-radius:2px;
  transition: background .3s, box-shadow .3s, transform .3s var(--ease1);
  box-shadow: 0 0 24px rgba(27,94,247,0.35);
  font-family:'DM Sans',sans-serif;
}
.nav-cta:hover {
  background:var(--blue2);
  box-shadow: 0 0 40px rgba(43,123,255,0.5);
  transform:translateY(-1px);
}

/* ═══════════════════════════════════════════════════════
   HERO SECTION
═══════════════════════════════════════════════════════ */
#hero {
  position:relative; min-height:100vh;
  display:flex; align-items:center;
  overflow:hidden;
}
#hero-canvas {
  position:absolute; inset:0;
  width:100%; height:100%;
}
/* Radial noise texture overlay */
#hero::before {
  content:''; position:absolute; inset:0; z-index:1;
  background: radial-gradient(ellipse 80% 60% at 65% 50%, rgba(27,94,247,0.12) 0%, transparent 60%),
              radial-gradient(ellipse 40% 40% at 30% 70%, rgba(200,169,110,0.06) 0%, transparent 60%);
  pointer-events:none;
}
.hero-wrap {
  position:relative; z-index:5;
  width:100%; max-width:1440px; margin:0 auto;
  padding:0 64px;
  display:grid; grid-template-columns:55fr 45fr;
  align-items:center; gap:60px;
  padding-top:72px;
}
/* Status badge */
.hero-badge {
  display:inline-flex; align-items:center; gap:10px;
  padding:7px 16px 7px 12px;
  background: rgba(27,94,247,0.08);
  border:1px solid rgba(27,94,247,0.25);
  border-radius:100px;
  margin-bottom:44px;
  opacity:0;
}
.badge-blink {
  width:7px; height:7px; border-radius:50%;
  background: var(--green);
  box-shadow: 0 0 8px var(--green);
  animation: blink 2.2s ease-in-out infinite;
}
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.2} }
.badge-text {
  font-size:10px; letter-spacing:2px; text-transform:uppercase;
  color:rgba(43,123,255,0.9); font-weight:500;
}

/* GIANT HERO HEADLINE */
.hero-h1 {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(80px,11.5vw,168px);
  line-height:.85; letter-spacing:2px;
  margin-bottom:36px;
  overflow:visible;
}
.h1-line { display:block; overflow:hidden }
.h1-inner {
  display:block;
  transform:translateY(105%);
  opacity:0;
}
.h1-line:nth-child(1) .h1-inner { animation-delay:.65s }
.h1-line:nth-child(2) .h1-inner { animation-delay:.78s }
.h1-line:nth-child(3) .h1-inner { animation-delay:.91s }
.h1-outline {
  -webkit-text-stroke: 1.5px rgba(240,238,232,0.35);
  color: transparent;
}
.h1-blue {
  color: var(--blue2);
  text-shadow: 0 0 80px rgba(43,123,255,0.3);
}
@keyframes slideUp { to { transform:translateY(0); opacity:1 } }

.hero-sub {
  font-size:16px; font-weight:300; line-height:1.9;
  color:var(--dim); max-width:420px;
  margin-bottom:52px; opacity:0;
}
.hero-sub strong { color:var(--white); font-weight:500 }

.hero-actions {
  display:flex; gap:14px; flex-wrap:wrap;
  opacity:0;
}
.btn-hero {
  padding:17px 38px;
  background:var(--blue);
  color:#fff; font-size:11px; letter-spacing:2.5px;
  text-transform:uppercase; font-weight:500;
  text-decoration:none; border-radius:2px;
  position:relative; overflow:hidden;
  display:inline-flex; align-items:center; gap:12px;
  transition:transform .4s var(--ease1), box-shadow .4s;
  box-shadow: 0 0 40px rgba(27,94,247,0.4);
  font-family:'DM Sans',sans-serif;
}
.btn-hero::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,0.1),transparent 60%);
  transform:translateX(-100%); transition:transform .6s var(--ease1);
}
.btn-hero:hover { transform:translateY(-3px); box-shadow:0 20px 60px rgba(27,94,247,0.5) }
.btn-hero:hover::after { transform:translateX(100%) }
.btn-ghost {
  padding:17px 38px;
  border:1px solid var(--border2); color:var(--dim);
  font-size:11px; letter-spacing:2.5px; text-transform:uppercase;
  font-weight:400; text-decoration:none; border-radius:2px;
  transition:border-color .3s, color .3s, transform .3s var(--ease1);
  font-family:'DM Sans',sans-serif;
}
.btn-ghost:hover { border-color:rgba(255,255,255,0.35); color:var(--white); transform:translateY(-2px) }

/* Hero right side */
.hero-right { position:relative; height:min(620px,80vh) }
.hero-3d-wrap {
  position:absolute; inset:0;
  pointer-events:none;
}

/* Floating mini stats */
.hero-float-card {
  position:absolute; z-index:4;
  padding:14px 20px;
  background:rgba(8,12,20,0.85);
  border:1px solid var(--border2);
  border-radius:12px;
  backdrop-filter:blur(16px);
  opacity:0;
}
.hfc-1 { top:15%; right:-20px; min-width:160px }
.hfc-2 { bottom:25%; left:-20px; min-width:140px }
.hfc-val {
  font-family:'Bebas Neue',sans-serif;
  font-size:28px; letter-spacing:1px; color:var(--white); line-height:1
}
.hfc-val b { color:var(--blue2) }
.hfc-label { font-size:9px; letter-spacing:2px; text-transform:uppercase; color:var(--dimmer); margin-top:4px }

/* Bottom stats strip */
.hero-stats {
  position:absolute; bottom:0; left:0; right:0; z-index:4;
  border-top:1px solid var(--border);
  display:flex;
  background:rgba(8,12,20,0.6);
  backdrop-filter:blur(12px);
  opacity:0;
}
.hs-item {
  flex:1; padding:20px 32px;
  border-right:1px solid var(--border);
  position:relative;
}
.hs-item:last-child { border-right:none }
.hs-item::before {
  content:''; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg,transparent,var(--blue),transparent);
  opacity:0; transition:opacity .4s;
}
.hs-item:hover::before { opacity:1 }
.hs-v {
  font-family:'Bebas Neue',sans-serif;
  font-size:26px; letter-spacing:1px; color:var(--white); line-height:1;
  display:block;
}
.hs-v b { color:var(--gold) }
.hs-l { font-size:9px; letter-spacing:2px; text-transform:uppercase; color:var(--dimmer); margin-top:5px; display:block }

/* ═══════════════════════════════════════════════════════
   MARQUEE
═══════════════════════════════════════════════════════ */
.marquee-wrap {
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  overflow:hidden; background:var(--bg2);
  padding:14px 0;
}
.marquee-track {
  display:flex; gap:0; white-space:nowrap;
  animation: marqueeRoll 22s linear infinite;
}
.marquee-track:hover { animation-play-state:paused }
.mq { display:inline-flex; align-items:center; gap:18px; padding:0 20px }
.mq-text {
  font-family:'Bebas Neue',sans-serif;
  font-size:13px; letter-spacing:4px;
  color:rgba(240,238,232,0.22);
}
.mq-text.lit { color:var(--blue2) }
.mq-dia { font-size:6px; color:var(--gold); opacity:.5 }
@keyframes marqueeRoll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* ═══════════════════════════════════════════════════════
   SECTION LABELS & SHARED
═══════════════════════════════════════════════════════ */
.sec-eyebrow {
  font-size:9.5px; letter-spacing:3.5px; text-transform:uppercase;
  color:var(--blue2); display:flex; align-items:center; gap:14px;
  margin-bottom:24px;
}
.sec-eyebrow::before {
  content:''; width:28px; height:1px;
  background:linear-gradient(90deg,var(--blue),transparent);
}
.sec-title {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(54px,8vw,108px);
  line-height:.88; letter-spacing:2px; color:var(--white);
}
.sec-title em { color:var(--blue2); font-style:normal }
.sec-title .outline {
  -webkit-text-stroke:1px rgba(240,238,232,0.2);
  color:transparent;
}
.reveal { opacity:0; transform:translateY(40px) }
.reveal.shown { opacity:1; transform:translateY(0); transition:opacity .5s var(--ease1), transform .6s var(--ease1) }

/* ═══════════════════════════════════════════════════════
   RESULTS / NUMBERS SECTION
═══════════════════════════════════════════════════════ */
#results {
  padding:160px 64px;
  position:relative; overflow:hidden;
  background:var(--bg);
}
/* Horizontal scroll - pinned */
.results-inner {
  display:grid; grid-template-columns:420px 1fr;
  gap:100px; align-items:center;
}
.results-left { }
.results-body { font-size:15px; font-weight:300; line-height:1.9; color:var(--dim); max-width:360px; margin-top:28px }
.results-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:2px;
}
.rg-card {
  padding:44px 38px;
  background:var(--surface);
  border:1px solid var(--border);
  position:relative; overflow:hidden;
  cursor:none;
  transition:background .5s, border-color .5s;
}
.rg-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg,transparent,var(--blue),transparent);
  opacity:0; transition:opacity .4s;
}
.rg-card:hover { background:rgba(27,94,247,0.06); border-color:rgba(27,94,247,0.2) }
.rg-card:hover::before { opacity:1 }
.rg-label { font-size:8.5px; letter-spacing:3px; text-transform:uppercase; color:var(--dimmer); margin-bottom:14px }
.rg-val {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(52px,6vw,80px); letter-spacing:1px;
  color:var(--white); line-height:.9;
  display:flex; align-items:flex-end; gap:2px;
}
.rg-val .counter { display:inline-block }
.rg-val .suf { font-size:.65em; color:var(--gold); line-height:1.1 }
.rg-sub { font-size:11px; font-weight:300; color:var(--dimmer); margin-top:10px; line-height:1.6 }

/* Globe canvas bg */
#globe-bg {
  position:absolute; right:-100px; top:50%; transform:translateY(-50%);
  width:600px; height:600px; opacity:.18; pointer-events:none;
}

/* ═══════════════════════════════════════════════════════
   SERVICES
═══════════════════════════════════════════════════════ */
#services {
  padding:160px 64px;
  background:var(--bg2);
  position:relative; overflow:hidden;
}
.services-header {
  display:grid; grid-template-columns:1fr 1fr; gap:80px;
  align-items:end; margin-bottom:100px;
}
.services-desc { font-size:15px; font-weight:300; line-height:1.9; color:var(--dim); max-width:380px }

.svc-rows { display:flex; flex-direction:column; gap:0 }
.svc-row {
  display:grid; grid-template-columns:80px 1fr auto;
  align-items:center; gap:48px;
  padding:36px 0;
  border-bottom:1px solid var(--border);
  position:relative; overflow:hidden; cursor:none;
  transition:padding-left .5s var(--ease1);
}
.svc-row::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg,rgba(27,94,247,0.06),transparent);
  transform:scaleX(0); transform-origin:left;
  transition:transform .5s var(--ease2);
}
.svc-row:hover { padding-left:20px }
.svc-row:hover::before { transform:scaleX(1) }
.svc-index {
  font-family:'Bebas Neue',sans-serif; font-size:12px;
  letter-spacing:3px; color:var(--dimmer);
}
.svc-name-wrap {}
.svc-name {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(32px,4vw,52px); letter-spacing:1px;
  color:var(--white); line-height:.95;
  transition:color .3s;
}
.svc-row:hover .svc-name { color:var(--blue2) }
.svc-tags { display:flex; gap:8px; margin-top:8px; flex-wrap:wrap }
.svc-tag {
  font-size:9px; letter-spacing:2px; text-transform:uppercase;
  padding:4px 10px; border:1px solid var(--border);
  color:var(--dimmer); border-radius:100px;
  transition:border-color .3s, color .3s;
}
.svc-row:hover .svc-tag { border-color:rgba(27,94,247,0.3); color:rgba(43,123,255,0.7) }
.svc-arrow {
  font-size:24px; color:var(--dimmer);
  transform:rotate(-45deg);
  transition:color .3s, transform .4s var(--ease1);
}
.svc-row:hover .svc-arrow { color:var(--blue2); transform:rotate(0deg) translateX(6px) }

/* ═══════════════════════════════════════════════════════
   CLIENTS SECTION — Horizontal sticky scroll
═══════════════════════════════════════════════════════ */
#clients {
  padding:160px 0;
  background:var(--bg);
  overflow:hidden;
}
.clients-head {
  padding:0 64px;
  display:flex; justify-content:space-between; align-items:flex-end;
  margin-bottom:80px;
}
.clients-head-right { font-size:14px; font-weight:300; color:var(--dimmer); max-width:260px; line-height:1.7 }

.clients-scroll-wrap {
  overflow-x:auto; overflow-y:visible;
  scrollbar-width:none;
  padding:0 64px;
  cursor:grab;
}
.clients-scroll-wrap:active { cursor:grabbing }
.clients-scroll-wrap::-webkit-scrollbar { display:none }
.clients-track-inner { display:flex; gap:2px; width:max-content }

.client-card {
  width:min(380px,82vw); flex-shrink:0;
  padding:52px 44px;
  background:var(--surface);
  border:1px solid var(--border);
  position:relative; overflow:hidden;
  transition:background .5s, border-color .5s, transform .5s var(--ease1);
  transform-style:preserve-3d;
  cursor:none;
}
.client-card:hover {
  background:rgba(27,94,247,0.05);
  border-color:rgba(27,94,247,0.2);
  transform:translateY(-8px);
}
.client-card::after {
  content:''; position:absolute; bottom:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg,transparent,var(--blue),transparent);
  opacity:0; transition:opacity .5s;
}
.client-card:hover::after { opacity:1 }
.cc-industry { font-size:9px; letter-spacing:3px; text-transform:uppercase; color:var(--blue2); margin-bottom:52px; display:block }
.cc-name {
  font-family:'Bebas Neue',sans-serif;
  font-size:44px; letter-spacing:1px; color:var(--white); line-height:.92; margin-bottom:20px;
}
.cc-body { font-size:13px; font-weight:300; line-height:1.75; color:var(--dimmer); margin-bottom:44px }
.cc-roas-bg {
  font-family:'Bebas Neue',sans-serif; font-size:96px;
  color:rgba(255,255,255,0.03); position:absolute; bottom:12px; right:24px;
  line-height:1; transition:color .4s; letter-spacing:1px;
}
.client-card:hover .cc-roas-bg { color:rgba(27,94,247,0.12) }
.cc-pill {
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 14px; background:rgba(34,197,94,0.08);
  border:1px solid rgba(34,197,94,0.2); border-radius:100px;
  font-size:9px; letter-spacing:2px; text-transform:uppercase; color:var(--green);
}
.cc-pill-dot { width:5px; height:5px; border-radius:50%; background:var(--green); box-shadow:0 0 6px var(--green) }

/* ═══════════════════════════════════════════════════════
   ABOUT FOUNDER
═══════════════════════════════════════════════════════ */
#about {
  padding:160px 64px;
  background:var(--bg2);
  position:relative; overflow:hidden;
}
#about::before {
  content:'AMAN RAI'; position:absolute; right:-40px; top:50%; transform:translateY(-50%);
  font-family:'Bebas Neue',sans-serif; font-size:clamp(120px,20vw,260px);
  color:rgba(255,255,255,0.02); white-space:nowrap; pointer-events:none;
  letter-spacing:8px; line-height:1;
}
.about-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:100px; align-items:center;
}
.about-left {}
.about-tagline {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(52px,7vw,96px); letter-spacing:2px; line-height:.9;
  color:var(--white); margin-bottom:40px; margin-top:24px;
}
.about-tagline em { display:block; font-style:italic; color:var(--gold); font-family:'Playfair Display',serif; font-size:.7em; letter-spacing:0 }
.about-body { font-size:15px; font-weight:300; line-height:1.95; color:var(--dim); margin-bottom:48px }
.about-body strong { color:var(--white); font-weight:500 }
.about-facts { display:grid; grid-template-columns:1fr 1fr; gap:2px; margin-bottom:48px }
.af {
  padding:24px 28px;
  background:var(--surface); border:1px solid var(--border);
}
.af-val {
  font-family:'Bebas Neue',sans-serif; font-size:36px; letter-spacing:1px;
  color:var(--white); line-height:1;
}
.af-val b { color:var(--blue2) }
.af-l { font-size:9px; letter-spacing:2px; text-transform:uppercase; color:var(--dimmer); margin-top:6px }

.founder-link {
  display:inline-flex; align-items:center; gap:10px;
  font-size:10.5px; letter-spacing:2.5px; text-transform:uppercase;
  color:var(--blue2); text-decoration:none;
  border-bottom:1px solid rgba(43,123,255,0.3); padding-bottom:4px;
  transition:gap .4s var(--ease1), border-color .3s;
}
.founder-link:hover { gap:20px; border-color:var(--blue2) }

/* Founder image placeholder */
.about-right { position:relative }
.founder-image-wrap {
  position:relative; overflow:hidden;
  border-radius:3px;
  aspect-ratio:3/4;
  background:var(--bg3);
  border:1px solid var(--border);
}
.founder-image-wrap::before {
  content:''; position:absolute; inset:0; z-index:1;
  background: linear-gradient(180deg,transparent 50%,var(--bg2));
  pointer-events:none;
}
.founder-bg-gradient {
  position:absolute; inset:0;
  background: radial-gradient(ellipse at 30% 40%, rgba(27,94,247,0.2) 0%, transparent 60%),
              radial-gradient(ellipse at 70% 70%, rgba(200,169,110,0.1) 0%, transparent 50%);
}
.founder-initials {
  position:absolute; inset:0; z-index:0;
  display:flex; align-items:center; justify-content:center;
  font-family:'Bebas Neue',sans-serif; font-size:clamp(80px,12vw,160px);
  letter-spacing:8px; color:rgba(255,255,255,0.04);
}
.founder-name-card {
  position:absolute; bottom:32px; left:32px; z-index:2;
}
.fnc-name {
  font-family:'Bebas Neue',sans-serif; font-size:36px; letter-spacing:2px;
  color:var(--white); line-height:1;
}
.fnc-title { font-size:10px; letter-spacing:2.5px; text-transform:uppercase; color:var(--blue2); margin-top:6px }
.founder-badge {
  position:absolute; top:28px; right:28px; z-index:2;
  padding:10px 16px;
  background:rgba(200,169,110,0.12); border:1px solid rgba(200,169,110,0.25);
  border-radius:8px;
}
.fb-text { font-size:9px; letter-spacing:2px; text-transform:uppercase; color:var(--gold) }

/* Floating quote */
.founder-quote {
  position:absolute; right:-48px; top:30%;
  width:260px; padding:24px 28px;
  background:rgba(8,12,20,0.9); border:1px solid var(--border2);
  border-radius:12px; backdrop-filter:blur(16px);
  z-index:3;
}
.fq-mark { font-family:'Bebas Neue',sans-serif; font-size:64px; color:rgba(27,94,247,0.2); line-height:.7; display:block; margin-bottom:8px }
.fq-text { font-size:12.5px; font-weight:300; line-height:1.7; color:var(--dim); font-style:italic }

/* ═══════════════════════════════════════════════════════
   COMPARISON TABLE — Superside-inspired
═══════════════════════════════════════════════════════ */
#compare {
  padding:160px 64px;
  background:var(--bg);
  position:relative; overflow:hidden;
}
.compare-header { max-width:700px; margin-bottom:80px }
.compare-sub { font-size:18px; font-weight:300; line-height:1.8; color:var(--dim); margin-top:24px }
.compare-sub em { font-style:italic; color:var(--gold); font-family:'Playfair Display',serif }

/* Table */
.ctable-wrap { overflow-x:auto; scrollbar-width:thin; scrollbar-color:var(--border) transparent }
.ctable {
  width:100%; border-collapse:separate; border-spacing:0;
  min-width:900px;
}
/* Column widths */
.ctable colgroup .c0 { width:28% }
.ctable colgroup .c1 { width:18% } /* ADSWORM */
.ctable colgroup .c2,.ctable colgroup .c3,.ctable colgroup .c4 { width:18% }

/* Header row */
.ctable thead th {
  padding:20px 24px; text-align:center;
  font-size:9px; letter-spacing:3px; text-transform:uppercase;
  color:var(--dimmer); font-weight:400; border-bottom:1px solid var(--border);
}
.ctable thead th.feature-col { text-align:left; color:var(--dimmer) }
.ctable thead th.highlight-th {
  background:rgba(27,94,247,0.08);
  border:1px solid rgba(27,94,247,0.2);
  border-bottom:none;
  color:var(--blue2);
  border-radius:8px 8px 0 0;
  position:relative;
}
.ctable thead th.highlight-th::before {
  content:'BEST CHOICE';
  position:absolute; top:-13px; left:50%; transform:translateX(-50%);
  font-size:7.5px; letter-spacing:3px; text-transform:uppercase;
  color:#fff; background:var(--blue);
  padding:4px 10px; border-radius:100px; white-space:nowrap;
}

/* Body rows */
.ctable tbody tr { transition:background .3s }
.ctable tbody tr:hover td { background:rgba(255,255,255,0.015) }
.ctable tbody td {
  padding:18px 24px;
  border-bottom:1px solid var(--border);
  text-align:center; vertical-align:middle;
}
.ctable tbody td.feature-td {
  text-align:left;
  font-size:13px; font-weight:400; color:var(--dim);
}
.ctable tbody td.highlight-td {
  background:rgba(27,94,247,0.04);
  border-left:1px solid rgba(27,94,247,0.15);
  border-right:1px solid rgba(27,94,247,0.15);
}
.ctable tbody tr.section-row td {
  padding:28px 24px 12px; font-size:9px; letter-spacing:3px;
  text-transform:uppercase; color:var(--dimmer);
  border-bottom:none; background:transparent; text-align:left;
}
.ctable tbody tr:last-child td.highlight-td {
  border-bottom:1px solid rgba(27,94,247,0.2); border-radius:0 0 8px 8px;
}
.check-icon { color:var(--green); font-size:16px; display:block }
.x-icon { color:rgba(240,238,232,0.18); font-size:16px; display:block }
.partial-icon { color:var(--gold); font-size:14px; display:block }

/* Highlighted entity name */
.ctable thead .adsworm-name {
  font-family:'Bebas Neue',sans-serif; font-size:18px;
  letter-spacing:3px; color:var(--white); display:block; margin-bottom:4px;
}
.ctable thead .adsworm-sub { font-size:8px; letter-spacing:2px; color:var(--blue2) }

/* ═══════════════════════════════════════════════════════
   GUARANTEE SECTION
═══════════════════════════════════════════════════════ */
#guarantee {
  padding:160px 64px;
  background:var(--bg2);
  display:grid; grid-template-columns:1fr 1fr; gap:100px; align-items:center;
  position:relative; overflow:hidden;
}
#guarantee::after {
  content:''; position:absolute; left:50%; top:0; bottom:0; width:1px;
  background:linear-gradient(to bottom,transparent,rgba(27,94,247,0.25),transparent);
  transform:translateX(-50%);
}
.guar-title {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(64px,9vw,128px); letter-spacing:2px; line-height:.85;
  color:var(--white); margin-bottom:36px; margin-top:24px;
}
.guar-title span {
  display:block;
  -webkit-text-stroke:1px rgba(240,238,232,0.2); color:transparent;
}
.guar-body { font-size:16px; font-weight:300; line-height:1.9; color:var(--dim); margin-bottom:48px; max-width:440px }
.guar-body strong { color:var(--white); font-weight:500 }

/* Big guarantee card */
.guar-card {
  background:linear-gradient(135deg,rgba(27,94,247,0.1),rgba(27,94,247,0.04));
  border:1px solid rgba(27,94,247,0.25);
  border-radius:4px; padding:72px 60px;
  position:relative; overflow:hidden;
  transition:transform .6s var(--ease1), box-shadow .6s;
}
.guar-card:hover {
  transform:perspective(1200px) rotateX(-2deg) rotateY(2.5deg) translateY(-8px);
  box-shadow:0 48px 96px rgba(0,0,0,0.5), 0 0 80px rgba(27,94,247,0.12);
}
.gc-orb1 {
  position:absolute; top:-100px; right:-100px;
  width:300px; height:300px; border-radius:50%;
  background:radial-gradient(ellipse,rgba(27,94,247,0.25),transparent 70%);
}
.gc-orb2 {
  position:absolute; bottom:-80px; left:-80px;
  width:220px; height:220px; border-radius:50%;
  background:radial-gradient(ellipse,rgba(200,169,110,0.12),transparent 70%);
}
.gc-eyebrow { font-size:9px; letter-spacing:3px; text-transform:uppercase; color:rgba(200,169,110,0.6); margin-bottom:16px }
.gc-big {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(100px,14vw,160px); letter-spacing:2px; line-height:.8;
  color:var(--white); display:block;
  text-shadow:0 0 120px rgba(27,94,247,0.4);
}
.gc-suffix { font-size:clamp(44px,6vw,72px); color:var(--gold) }
.gc-body { font-size:14px; font-weight:300; line-height:1.75; color:rgba(240,238,232,0.45); margin-top:24px }
.gc-body strong { color:rgba(240,238,232,0.8); font-weight:500 }
.gc-divider { height:1px; background:rgba(255,255,255,0.06); margin:28px 0 }
.gc-promise { font-size:10px; letter-spacing:2.5px; text-transform:uppercase; color:rgba(43,123,255,0.4) }

/* ═══════════════════════════════════════════════════════
   TESTIMONIALS
═══════════════════════════════════════════════════════ */
#testimonials {
  padding:160px 64px;
  background:var(--bg);
  position:relative;
}
.tm-header {
  display:flex; justify-content:space-between; align-items:flex-end;
  margin-bottom:80px;
}
.tm-meta { font-size:13px; font-weight:300; color:var(--dimmer); text-align:right; line-height:1.7 }
.tm-meta b { display:block; font-size:20px; font-family:'Bebas Neue',sans-serif; letter-spacing:1px; color:var(--green); font-weight:400 }
.tm-grid { display:grid; grid-template-columns:1fr 1fr; gap:2px }
.tm-card {
  padding:56px 52px; position:relative;
  background:var(--surface); border:1px solid var(--border);
  transition:background .5s, border-color .5s;
}
.tm-card:hover { background:rgba(255,255,255,0.03); border-color:var(--border2) }
.tm-card.feat { background:rgba(27,94,247,0.07); border-color:rgba(27,94,247,0.2) }
.tm-card.feat:hover { background:rgba(27,94,247,0.1); border-color:rgba(27,94,247,0.35) }
.tm-quote-mark {
  font-family:'Bebas Neue',sans-serif; font-size:96px;
  color:rgba(27,94,247,0.15); line-height:.7; margin-bottom:12px; display:block;
}
.tm-text {
  font-size:clamp(15px,1.5vw,19px); font-weight:300; line-height:1.75;
  color:rgba(240,238,232,0.75); font-style:italic; margin-bottom:44px;
}
.tm-footer {
  display:flex; justify-content:space-between; align-items:flex-end;
  padding-top:28px; border-top:1px solid var(--border);
}
.tm-author {}
.tm-name { font-family:'Bebas Neue',sans-serif; font-size:17px; letter-spacing:1px; color:var(--white) }
.tm-role { font-size:9.5px; letter-spacing:2px; text-transform:uppercase; color:var(--dimmer); margin-top:5px }
.tm-roas-big {
  font-family:'Bebas Neue',sans-serif; font-size:44px; letter-spacing:1px;
  color:var(--gold); text-shadow:0 0 20px rgba(200,169,110,0.3); line-height:1;
}

/* ═══════════════════════════════════════════════════════
   CTA SECTION
═══════════════════════════════════════════════════════ */
#cta {
  position:relative; min-height:100vh;
  display:flex; align-items:center; justify-content:center;
  text-align:center; overflow:hidden;
  background:var(--bg);
  padding:120px 64px;
}
#cta-canvas { position:absolute; inset:0; width:100%; height:100% }
.cta-content { position:relative; z-index:2; max-width:960px }
.cta-eyebrow { font-size:9.5px; letter-spacing:4px; text-transform:uppercase; color:var(--blue2); display:block; margin-bottom:40px }
.cta-title {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(72px,12vw,176px); letter-spacing:2px; line-height:.82;
  color:var(--white); margin-bottom:40px;
}
.cta-title .outline-line {
  display:block;
  -webkit-text-stroke:1.5px rgba(240,238,232,0.2); color:transparent;
}
.cta-title .filled-line { display:block; color:var(--white) }
.cta-sub { font-size:17px; font-weight:300; color:var(--dim); margin-bottom:60px; line-height:1.7 }
.cta-actions { display:flex; gap:16px; justify-content:center; flex-wrap:wrap }
.cta-note { margin-top:36px; font-size:10.5px; letter-spacing:2px; color:var(--dimmer) }

/* ═══════════════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════════════ */
footer {
  background:var(--bg);
  border-top:1px solid var(--border);
  padding:44px 64px;
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:24px;
}
.ft-logo {
  font-family:'Bebas Neue',sans-serif; font-size:18px;
  letter-spacing:5px; color:var(--white); text-decoration:none;
}
.ft-logo b { color:var(--blue2) }
.ft-links { display:flex; gap:32px; list-style:none }
.ft-links a { font-size:9.5px; letter-spacing:2.5px; text-transform:uppercase; color:var(--dimmer); text-decoration:none; transition:color .3s }
.ft-links a:hover { color:var(--white) }
.ft-copy { font-size:10px; letter-spacing:1px; color:rgba(255,255,255,0.1) }

/* ═══════════════════════════════════════════════════════
   PARALLAX IMAGE STRIP — Scrolling pictures section
═══════════════════════════════════════════════════════ */
#visual-strip {
  padding:120px 0; overflow:hidden;
  background:var(--bg3);
  position:relative;
}
.strip-label {
  padding:0 64px; margin-bottom:60px;
  font-family:'Bebas Neue',sans-serif; font-size:clamp(28px,3vw,42px);
  letter-spacing:3px; color:var(--dimmer);
}
.strip-label em { color:var(--white); font-style:normal }
.strip-row { display:flex; gap:24px; overflow:visible; white-space:nowrap }
.strip-row + .strip-row { margin-top:24px }
.strip-item {
  flex-shrink:0; width:min(420px,60vw);
  height:min(280px,40vw);
  background:var(--bg3); border:1px solid var(--border);
  border-radius:4px; overflow:hidden; position:relative;
  display:flex; align-items:center; justify-content:center;
}
.strip-item-inner {
  width:100%; height:100%; display:flex; align-items:center; justify-content:center;
  flex-direction:column; gap:16px; padding:40px;
}
.si-icon { font-size:48px; opacity:.4 }
.si-label {
  font-family:'Bebas Neue',sans-serif; font-size:24px; letter-spacing:3px;
  color:rgba(255,255,255,0.15); text-align:center;
}
.si-sub { font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--dimmer); text-align:center }
/* Different colored strips */
.strip-row:nth-child(3) .strip-item:nth-child(2) { background:rgba(27,94,247,0.08); border-color:rgba(27,94,247,0.2) }
.strip-row:nth-child(3) .strip-item:nth-child(4) { background:rgba(200,169,110,0.07); border-color:rgba(200,169,110,0.18) }
.strip-row:nth-child(4) .strip-item:nth-child(1) { background:rgba(34,197,94,0.06); border-color:rgba(34,197,94,0.15) }
.strip-row:nth-child(4) .strip-item:nth-child(3) { background:rgba(27,94,247,0.08); border-color:rgba(27,94,247,0.2) }


/* ── AI Service Row ── */
.svc-ai .svc-name {
  background: linear-gradient(95deg, var(--white) 30%, var(--blue2));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.svc-ai { border-top: 1px solid rgba(27,94,247,0.15) }

/* ═══════════════════════════════════════════════════════
   GRAIN OVERLAY (subtle texture)
═══════════════════════════════════════════════════════ */
body::after {
  content:''; position:fixed; inset:-50%; z-index:1000;
  width:200vw; height:200vh;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='1'/%3E%3C/svg%3E");
  opacity:.018; pointer-events:none; animation:none;
}
@keyframes grainMove { 0%{transform:translate(0,0)} 20%{transform:translate(-4%,-4%)} 40%{transform:translate(4%,4%)} 60%{transform:translate(-2%,2%)} 80%{transform:translate(2%,-2%)} 100%{transform:translate(0,0)} }

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════════════════ */
@media(max-width:1100px) {
  .hero-wrap { grid-template-columns:1fr; gap:40px }
  .hero-right { height:360px }
  .results-inner { grid-template-columns:1fr; gap:60px }
  .services-header { grid-template-columns:1fr; gap:32px }
  .about-grid { grid-template-columns:1fr; gap:60px }
  #guarantee { grid-template-columns:1fr; gap:60px; padding:100px 48px }
  #guarantee::after { display:none }
  .tm-grid { grid-template-columns:1fr }
  .founder-quote { display:none }
  .tm-header { flex-direction:column; align-items:flex-start; gap:24px }
  .tm-meta { text-align:left }
}
@media(max-width:768px) {
  html { font-size:15px }
  body { cursor:auto; overflow-x:hidden }
  body::after { display:none }
  #cursor { display:none }
  #nav { padding:0 20px; height:60px }
  .nav-links { display:none }
  .nav-cta { padding:8px 16px; font-size:9px; letter-spacing:1.5px }
  .nav-logo { font-size:18px; letter-spacing:3px }
  #hero { min-height:100svh; align-items:flex-start; padding-top:80px }
  .hero-wrap { grid-template-columns:1fr; padding:24px 20px 0; gap:0 }
  .hero-badge { margin-bottom:28px }
  .badge-text { font-size:9px; letter-spacing:1.5px }
  .hero-h1 { font-size:clamp(52px,16vw,80px); letter-spacing:0px; margin-bottom:24px; line-height:.9 }
  .hero-sub { font-size:14px; line-height:1.75; margin-bottom:32px; max-width:100% }
  .hero-actions { flex-direction:column; gap:12px }
  .btn-hero, .btn-ghost { width:100%; text-align:center; justify-content:center; padding:16px 24px; font-size:10px }
  .hero-right { display:none }
  .hero-float-card { display:none }
  .hero-stats { position:relative; display:grid; grid-template-columns:1fr 1fr; margin-top:40px }
  .hs-item { padding:16px 18px; border-right:1px solid var(--border); border-bottom:1px solid var(--border) }
  .hs-item:nth-child(2n) { border-right:none }
  .hs-item:nth-child(3), .hs-item:nth-child(4) { border-bottom:none }
  .hs-v { font-size:20px }
  .hs-l { font-size:8px; letter-spacing:1.5px }
  .mq-text { font-size:11px; letter-spacing:2px }
  #results { padding:80px 20px }
  .results-inner { grid-template-columns:1fr; gap:48px }
  .results-grid { grid-template-columns:1fr 1fr; gap:2px }
  .rg-card { padding:28px 20px }
  .rg-val { font-size:clamp(36px,10vw,52px) }
  .rg-sub { font-size:10px }
  #globe-bg { display:none }
  #visual-strip { padding:80px 0 }
  .strip-label { padding:0 20px; font-size:clamp(20px,5vw,28px) }
  .strip-item { width:min(260px,72vw); height:min(180px,45vw) }
  .si-icon { font-size:36px }
  .si-label { font-size:18px }
  .strip-row { gap:14px }
  #strip1 { padding-left:20px }
  #strip2 { padding-left:20px }
  #services { padding:80px 20px }
  .services-header { grid-template-columns:1fr; gap:24px; margin-bottom:56px }
  .svc-row { grid-template-columns:44px 1fr auto; gap:14px; padding:22px 0 }
  .svc-row:hover { padding-left:0 }
  .svc-name { font-size:clamp(22px,6vw,32px) }
  .svc-tags { display:none }
  .svc-index { font-size:10px }
  #clients { padding:80px 0 }
  .clients-head { padding:0 20px; flex-direction:column; align-items:flex-start; gap:20px; margin-bottom:48px }
  .clients-head-right { max-width:100% }
  .clients-scroll-wrap { padding:0 20px }
  .client-card { width:min(300px,82vw); padding:32px 24px }
  .cc-name { font-size:30px }
  .cc-body { font-size:12px; margin-bottom:24px }
  .cc-roas-bg { font-size:60px }
  #about { padding:80px 20px }
  #about::before { display:none }
  .about-grid { grid-template-columns:1fr; gap:48px }
  .about-right { order:-1 }
  .about-tagline { font-size:clamp(40px,12vw,64px) }
  .about-body { font-size:14px; line-height:1.85 }
  .about-facts { grid-template-columns:1fr 1fr; gap:2px; margin-bottom:36px }
  .af { padding:18px 18px }
  .af-val { font-size:26px }
  .founder-image-wrap { aspect-ratio:4/3 }
  #compare { padding:80px 20px }
  .compare-header { margin-bottom:48px }
  .compare-sub { font-size:14px }
  .ctable-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch }
  .ctable { min-width:640px; font-size:12px }
  .ctable thead th { padding:13px 10px; font-size:8px; letter-spacing:1px }
  .ctable tbody td { padding:12px 10px; font-size:11px }
  .ctable tbody td.feature-td { font-size:11px }
  .ctable thead .adsworm-name { font-size:13px }
  .ctable thead .highlight-th::before { font-size:6px; letter-spacing:1px; top:-10px; padding:2px 7px }
  #guarantee { padding:80px 20px; grid-template-columns:1fr; gap:48px }
  .guar-title { font-size:clamp(48px,15vw,80px); margin-bottom:24px }
  .guar-body { font-size:14px; margin-bottom:32px }
  .guar-card { padding:40px 28px }
  .gc-big { font-size:clamp(80px,22vw,110px) }
  #testimonials { padding:80px 20px }
  .tm-header { flex-direction:column; align-items:flex-start; gap:20px; margin-bottom:48px }
  .tm-meta { text-align:left }
  .tm-grid { grid-template-columns:1fr; gap:2px }
  .tm-card { padding:32px 24px }
  .tm-text { font-size:14px }
  .tm-roas-big { font-size:30px }
  .tm-quote-mark { font-size:64px }
  #cta { padding:100px 20px; min-height:auto }
  .cta-title { font-size:clamp(52px,16vw,88px) }
  .cta-sub { font-size:14px }
  .cta-actions { flex-direction:column; align-items:stretch }
  .cta-actions .btn-hero, .cta-actions .btn-ghost { width:100%; text-align:center; justify-content:center; padding:16px 24px }
  footer { padding:32px 20px; flex-direction:column; align-items:flex-start; gap:20px }
  .ft-links { flex-wrap:wrap; gap:14px }
  .ft-links a { font-size:9px }
  .ft-copy { font-size:9px }
  .sec-title { font-size:clamp(40px,12vw,64px) }
  .sec-eyebrow { font-size:9px; letter-spacing:2px }
  .results-body, .services-desc { font-size:14px }
  /* Prevent canvas overflow on mobile */
  #hero-canvas, #cta-canvas { max-width:100vw }
  #hero { overflow:hidden }
  /* Hero left padding fix */
  .hero-left { padding-right:0 }
  /* Comparison table scroll hint */
  .ctable-wrap::after {
    content:'← Scroll →';
    display:block; text-align:center;
    font-size:9px; letter-spacing:2px; text-transform:uppercase;
    color:var(--dimmer); padding:12px 0 0;
  }
}

/* ══════════════════════════════════════
   BRAND TRUST WALL
══════════════════════════════════════ */
#trust-wall {
  padding: 0;
  background: var(--bg);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  overflow: hidden;
  position: relative;
}
#trust-wall::before,
#trust-wall::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  width: 100px;
  z-index: 2;
  pointer-events: none;
}
#trust-wall::before { left: 0; background: linear-gradient(90deg, var(--bg), transparent); }
#trust-wall::after  { right: 0; background: linear-gradient(-90deg, var(--bg), transparent); }
.tw-label {
  text-align: center;
  font-size: 9px;
  letter-spacing: 3.5px;
  color: var(--dimmer);
  padding: 32px 0 22px;
  font-family: 'DM Sans', sans-serif;
  text-transform: uppercase;
}
.tw-scroll-wrap { overflow: hidden; }
.tw-track {
  display: flex;
  align-items: center;
  width: max-content;
  animation: tw-scroll 40s linear infinite;
  padding-bottom: 32px;
}
.tw-track:hover { animation-play-state: paused; }
@keyframes tw-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.tw-item {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 48px;
  border-right: 1px solid rgba(255,255,255,0.06);
  height: 40px;
  flex-shrink: 0;
  transition: opacity .35s;
  opacity: 0.38;
  cursor: default;
  white-space: nowrap;
}
.tw-item:hover { opacity: 0.72; }
.tw-item span {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 2.5px;
  color: var(--white);
  font-family: 'DM Sans', sans-serif;
  text-transform: uppercase;
}
.tw-item.serif span {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-weight: 400;
  letter-spacing: 1px;
  font-size: 14px;
}
.tw-item .tw-dot {
  width: 3px; height: 3px;
  border-radius: 50%;
  background: rgba(255,255,255,0.3);
  margin-right: 12px;
  flex-shrink: 0;
}
@media(max-width:768px){
  .tw-item { padding: 0 28px; }
  .tw-item span { font-size: 10px; letter-spacing: 1.5px; }
  .tw-label { font-size: 7.5px; letter-spacing: 2.5px; padding: 22px 0 16px; }
  .tw-track { padding-bottom: 22px; }
}


/* Founder photo support */
.founder-image { position: relative; overflow: hidden; }
.founder-real-photo {
  position: absolute; inset: 0; z-index: 2;
  width: 100%; height: 100%;
  object-fit: cover; object-position: top center;
  display: block;
}
/* Nav logo icon */
.nav-logo svg { transition: opacity .3s; }
.nav-logo:hover svg { opacity: 0.7; }
/* Remove old logo-dot */
.logo-dot { display: none; }


/* ── LOGO IMAGE ── */
.nav-logo-img {
  height: 34px;
  width: auto;
  display: block;
  /* PNG has black bg — screen blend removes it perfectly on dark backgrounds */
  filter: none;
  transition: opacity .3s;
}
.nav-logo:hover .nav-logo-img { opacity: 0.75; }
.loader-logo-img {
  height: 52px;
  width: auto;
  filter: brightness(1.05);
}
.ft-logo-img {
  height: 28px;
  width: auto;
  filter: none; opacity: 0.7;
  opacity: 0.7;
  transition: opacity .3s;
}
.ft-logo:hover .ft-logo-img { opacity: 1; }


/* Founder photo sizing fix */
#founder-image {
  position: relative;
  min-height: 480px;
}
#founder-real-photo {
  position: absolute !important;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
  z-index: 2;
  display: block !important;
}


/* Hide old text logo spans if they exist */
.nav-logo .logo-ads,
.nav-logo .logo-worm { display: none; }


/* When real founder photo is present, hide the canvas placeholder */
#founder-image img[src*="data:image"] + div#founder-canvas-wrap,
#founder-image img:not([src*="PLACEHOLDER"]) + div { 
  opacity: 0; pointer-events: none; 
}


/* Founder image wrap — ensure height for photo */
.founder-image-wrap {
  min-height: 480px !important;
  background: #0C1629;
}
.founder-image-wrap img {
  position: absolute !important;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
  z-index: 2;
  display: block !important;
}
.founder-bg-gradient {
  position: absolute !important;
  bottom: 0; left: 0; right: 0;
  z-index: 3 !important;
}
.founder-badge, .founder-name-card {
  z-index: 4 !important;
}


/* Founder photo — face-first positioning */
.founder-image-wrap {
  min-height: 520px !important;
  height: 100% !important;
  background: #0C1629 !important;
}
.founder-image-wrap img {
  object-position: center 15% !important;
}
@media(max-width:768px){
  .founder-image-wrap { min-height: 380px !important; aspect-ratio: 3/4 !important; }
  .founder-image-wrap img { object-position: center 10% !important; }
}


/* ── TAPPABLE / CLICKABLE FIXES ── */
/* Minimum 44px touch targets on all interactive elements */
.nav-links a, .nav-cta, .btn-hero, .btn-ghost,
.ft-links a, .founder-link, .svc-row,
.client-card, .tm-card { 
  -webkit-tap-highlight-color: rgba(27,94,247,0.15);
  cursor: pointer;
}
.btn-hero, .btn-ghost, .nav-cta {
  min-height: 48px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}
.nav-links a {
  min-height: 44px;
  display: flex;
  align-items: center;
  padding: 0 4px;
}
/* Fix href="#" dead links */
.ft-links a[href="#"] { cursor: default; opacity: 0.6; }
/* Smooth active state */
.btn-hero:active { transform: scale(0.97); }
.btn-ghost:active { transform: scale(0.97); }
.nav-cta:active { transform: scale(0.97); }
/* Client cards — make entire card tappable feel */
.client-card { cursor: default; }
/* Ensure all nav links have pointer */
.nav-links li a { cursor: pointer; }


@media(max-width:768px){
  .nav-cta {
    font-size: 9px !important;
    padding: 10px 16px !important;
    letter-spacing: 1.5px !important;
    white-space: nowrap;
  }
  .nav-logo-img { height: 28px !important; }
  #nav { padding: 0 16px !important; gap: 12px !important; }
}


/* Services rows — proper hover on all devices */
.svc-row { 
  transition: background .25s, border-color .25s, transform .15s !important;
}
.svc-row:hover { 
  background: rgba(27,94,247,0.06) !important;
  border-color: rgba(27,94,247,0.2) !important;
}
@media(hover:none){
  .svc-row:active {
    background: rgba(27,94,247,0.08) !important;
  }
}


/* Comparison table mobile scroll */
.ctable-wrap {
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
}
.ctable {
  min-width: 680px !important;
}


/* NAV LOGO — clean rendering on any background */
.nav-logo {
  isolation: isolate;
  background: transparent !important;
}
.nav-logo-img {
  height: 40px !important;
  width: auto;
  display: block;
  filter: none;
  /* Fallback: if screen blend doesn't work, show clean */
  background: transparent;
}
/* ADSWORM wordmark next to logo icon */
.nav-wordmark {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 20px;
  letter-spacing: 4px;
  color: var(--white);
  text-decoration: none;
  margin-left: 4px;
  line-height: 1;
}
.nav-wordmark em {
  color: var(--blue2);
  font-style: normal;
}


/* FOUNDER PHOTO — face visible, critical override */
div.founder-image-wrap {
  position: relative !important;
  overflow: hidden !important;
  min-height: 560px !important;
  height: 560px !important;
}
div.founder-image-wrap > img:first-child {
  position: absolute !important;
  top: 0 !important; left: 0 !important;
  width: 100% !important; 
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 8% !important;
  z-index: 2 !important;
  display: block !important;
}
@media(max-width:960px){
  div.founder-image-wrap { 
    min-height: 400px !important; 
    height: 400px !important;
  }
  div.founder-image-wrap > img:first-child {
    object-position: center 5% !important;
  }
}
@media(max-width:600px){
  div.founder-image-wrap { 
    min-height: 320px !important;
    height: 320px !important;
  }
}


/* NAV — clean alignment */
#nav {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 40px !important;
  gap: 0 !important;
}
.nav-logo {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  flex-shrink: 0 !important;
}
.nav-links {
  display: flex !important;
  align-items: center !important;
  gap: 32px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: 1 !important;
  justify-content: center !important;
}
.nav-cta {
  flex-shrink: 0 !important;
  white-space: nowrap !important;
}
@media(max-width:900px){
  #nav { padding: 0 20px !important; }
  .nav-links { display: none !important; }
  .nav-wordmark { font-size: 17px !important; letter-spacing: 3px !important; }
}


/* ── GUARANTEE CARD REDESIGN ── */
.gc-ticker-wrap {
  position: relative;
  margin-bottom: 32px;
}
.gc-ticker {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  height: 120px;
  position: relative;
}
.gc-tick {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 96px;
  line-height: 1;
  color: rgba(240,238,232,0.12);
  letter-spacing: -2px;
  position: absolute;
  transition: all 0.7s cubic-bezier(0.76,0,0.24,1);
  transform: translateY(60px);
  opacity: 0;
}
.gc-tick.active {
  color: var(--white);
  transform: translateY(0);
  opacity: 1;
}
.gc-tick.exit {
  transform: translateY(-60px);
  opacity: 0;
}
.gc-tick-label {
  font-size: 9px;
  letter-spacing: 4px;
  color: var(--gold);
  text-transform: uppercase;
  margin-top: 8px;
  font-family: 'DM Sans', sans-serif;
  transition: opacity .3s;
}
.gc-stats-row {
  display: flex;
  align-items: center;
  gap: 0;
  margin-top: 20px;
}
.gc-stat {
  display: flex;
  flex-direction: column;
  gap: 3px;
  flex: 1;
}
.gc-stat-val {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 26px;
  color: var(--white);
  letter-spacing: 1px;
  line-height: 1;
}
.gc-stat-l {
  font-size: 9px;
  letter-spacing: 2px;
  color: var(--dimmer);
  text-transform: uppercase;
  font-family: 'DM Sans', sans-serif;
}
.gc-stat-div {
  width: 1px;
  height: 36px;
  background: var(--border2);
  margin: 0 20px;
  flex-shrink: 0;
}
/* gc-body italic */
.gc-body em { color: var(--white); font-style: italic; }


/* ═══════════════════════════════════════════════
   COMPREHENSIVE MOBILE RESPONSIVE — ALL DEVICES
═══════════════════════════════════════════════ */

/* ── FLUID TYPOGRAPHY BASE ── */
html { font-size: clamp(14px, 1.8vw, 16px); }

/* ── 1280px+ DESKTOP ── */
@media(min-width:1280px){
  .hero-h1 .h1-inner { font-size: clamp(80px, 7vw, 120px); }
  #hero { min-height: 100vh; }
}

/* ── 960–1280px LAPTOP ── */
@media(max-width:1280px) and (min-width:960px){
  .hero-h1 .h1-inner { font-size: clamp(64px, 6.5vw, 96px); }
  .about-grid { gap: 60px; }
  .services-grid { gap: 0; }
}

/* ── 768–960px TABLET LANDSCAPE ── */
@media(max-width:960px) and (min-width:768px){
  #nav { padding: 0 32px !important; }
  .nav-links { gap: 20px !important; font-size: 10px; }
  .hero-h1 .h1-inner { font-size: clamp(52px, 7vw, 80px); }
  .hero-sub { font-size: 15px; max-width: 360px; }
  .about-grid { grid-template-columns: 1fr; gap: 48px; }
  .about-right { order: -1; }
  .results-inner { flex-direction: column; gap: 48px; }
  .results-grid { grid-template-columns: 1fr 1fr; }
  #guarantee { grid-template-columns: 1fr; gap: 48px; }
  .tm-grid { grid-template-columns: 1fr 1fr; }
}

/* ── 320–768px MOBILE ── */
@media(max-width:768px){
  /* NAV */
  #nav {
    padding: 0 16px !important;
    height: 56px !important;
  }
  .nav-links { display: none !important; }
  .nav-logo-img { height: 26px !important; }
  .nav-wordmark { font-size: 16px !important; letter-spacing: 3px !important; }
  .nav-cta {
    padding: 9px 14px !important;
    font-size: 8px !important;
    letter-spacing: 1px !important;
  }

  /* HERO */
  #hero { padding: 80px 20px 40px; min-height: auto; overflow: hidden; }
  .hero-wrap { flex-direction: column; gap: 0; }
  .hero-left { width: 100%; }
  .hero-right { display: none; }
  .hero-badge { font-size: 8px; padding: 8px 14px; }
  .hero-h1 .h1-inner { font-size: clamp(48px, 14vw, 72px); }
  .hero-sub { font-size: 14px; line-height: 1.7; max-width: 100%; }
  .hero-actions { flex-direction: column; gap: 10px; }
  .btn-hero, .btn-ghost { width: 100%; text-align: center; justify-content: center; padding: 15px 20px !important; }
  .hero-stats { grid-template-columns: 1fr 1fr; gap: 1px; padding: 20px 16px; }
  .hs-item { padding: 16px 12px; }
  .hs-v { font-size: 24px; }
  .hs-l { font-size: 9px; }

  /* CANVAS — hide all 3D on mobile for performance */
  #hero-canvas, #globe-bg, #cta-canvas { display: none !important; }

  /* RESULTS */
  #results { padding: 80px 20px; }
  .results-inner { flex-direction: column; gap: 40px; }
  .results-left { max-width: 100%; }
  .results-grid { grid-template-columns: 1fr 1fr; gap: 1px; }
  .rg-card { padding: 24px 16px; }
  .rg-val { font-size: 40px; }

  /* SERVICES */
  #services { padding: 80px 20px; }
  .services-header { flex-direction: column; gap: 24px; }
  .svc-row { padding: 20px; flex-direction: column; gap: 12px; }
  .svc-num { font-size: 11px; }
  .svc-name { font-size: 18px; }
  .svc-desc { font-size: 13px; }

  /* ABOUT */
  #about { padding: 80px 20px; }
  .about-grid { grid-template-columns: 1fr !important; gap: 40px; }
  .about-right { order: -1 !important; }
  div.founder-image-wrap { min-height: 340px !important; height: 340px !important; }
  div.founder-image-wrap > img:first-child { object-position: center 5% !important; }
  .about-body { font-size: 14px; }
  .about-stats { grid-template-columns: 1fr 1fr; gap: 12px; }

  /* GUARANTEE */
  #guarantee { grid-template-columns: 1fr !important; padding: 80px 20px; gap: 40px; }
  .guar-title { font-size: clamp(48px, 14vw, 72px); }
  .guar-body { font-size: 14px; }
  .gc-ticker .gc-tick { font-size: 72px; }
  .gc-ticker { height: 90px; }
  .gc-stats-row { gap: 0; }
  .gc-stat-val { font-size: 20px; }

  /* COMPARISON */
  #compare { padding: 80px 20px; }
  .ctable-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .ctable { min-width: 580px; }

  /* CLIENTS */
  #clients { padding: 80px 20px; }
  .clients-viewport { overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 8px; }
  .clients-track-inner { display: flex !important; flex-wrap: nowrap !important; width: max-content; gap: 12px; }
  .client-card { width: 260px !important; flex-shrink: 0 !important; }

  /* TESTIMONIALS */
  #testimonials { padding: 80px 20px; }
  .tm-header { flex-direction: column; gap: 24px; }
  .tm-grid { grid-template-columns: 1fr !important; }
  .tm-card.feat { grid-column: 1 !important; }
  .tm-text { font-size: 14px; }

  /* TRUST WALL */
  #trust-wall { overflow: hidden; }

  /* CTA */
  #cta { padding: 100px 20px; min-height: auto; }
  .cta-title { font-size: clamp(48px, 14vw, 80px); }
  .cta-sub { font-size: 14px; }
  .cta-actions { flex-direction: column; align-items: stretch; gap: 12px; }
  .cta-actions .btn-hero, .cta-actions .btn-ghost { width: 100%; padding: 16px 20px !important; }

  /* FOOTER */
  footer { flex-direction: column; align-items: flex-start; gap: 20px; padding: 28px 20px; }
  .ft-links { flex-wrap: wrap; gap: 12px; }
  .ft-copy { font-size: 9px; }

  /* VISUAL STRIP */
  #visual-strip { padding: 40px 0; }
  .strip-label { font-size: 14px; padding: 0 20px 24px; }
}

/* ── 320–420px SMALL PHONES ── */
@media(max-width:420px){
  .hero-h1 .h1-inner { font-size: clamp(40px, 13vw, 60px); }
  .hero-sub { font-size: 13px; }
  .results-grid { grid-template-columns: 1fr 1fr; }
  .rg-val { font-size: 32px; }
  .nav-cta { font-size: 7.5px !important; padding: 8px 12px !important; }
  .tm-grid { grid-template-columns: 1fr; }
  .guar-title { font-size: clamp(40px, 13vw, 60px); }
}


/* ═══════════════════════════════════
   CTA SECTION — REBUILT
═══════════════════════════════════ */
#cta {
  position: relative;
  padding: 140px 40px 100px;
  text-align: center;
  overflow: hidden;
  background: var(--bg);
  border-top: 1px solid var(--border);
}
.cta-orb {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  filter: blur(80px);
  opacity: 0.18;
}
.cta-orb1 {
  width: 500px; height: 500px;
  background: var(--blue);
  top: -200px; left: -100px;
  animation: orb-float 8s ease-in-out infinite;
}
.cta-orb2 {
  width: 400px; height: 400px;
  background: #5B2BE0;
  bottom: -150px; right: -80px;
  animation: orb-float 10s ease-in-out infinite reverse;
}
.cta-orb3 {
  width: 300px; height: 300px;
  background: var(--gold);
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  opacity: 0.06;
  animation: orb-float 12s ease-in-out infinite;
}
@keyframes orb-float {
  0%,100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-30px) scale(1.05); }
}
.cta-orb3 { animation: orb-float3 12s ease-in-out infinite; }
@keyframes orb-float3 {
  0%,100% { transform: translate(-50%,-50%) scale(1); }
  50% { transform: translate(-50%,-55%) scale(1.08); }
}
.cta-inner {
  position: relative;
  z-index: 2;
  max-width: 900px;
  margin: 0 auto;
}
.cta-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 9px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--dimmer);
  font-family: 'DM Sans', sans-serif;
  margin-bottom: 32px;
}
.cta-ey-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--blue2);
  animation: pulse-dot 2s ease-in-out infinite;
}

/* Stat pillars */
.cta-pillars {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  margin: 48px auto 40px;
  max-width: 640px;
  border: 1px solid var(--border);
  border-radius: 2px;
  background: rgba(255,255,255,0.02);
  overflow: hidden;
}
.cta-pillar {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  gap: 4px;
}
.cp-val {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 42px;
  color: var(--white);
  line-height: 1;
  letter-spacing: 1px;
}
.cp-suf {
  font-size: 24px;
  color: var(--blue2);
}
.cp-label {
  font-size: 9px;
  letter-spacing: 2px;
  color: var(--dimmer);
  text-transform: uppercase;
  font-family: 'DM Sans', sans-serif;
}
.cp-divider {
  width: 1px;
  height: 60px;
  background: var(--border);
  flex-shrink: 0;
}
.cta-sub {
  font-size: 17px;
  line-height: 1.8;
  color: var(--dim);
  max-width: 580px;
  margin: 0 auto 40px;
}
.cta-sub strong { color: var(--white); }
.cta-actions {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 40px;
}

/* Trust strip */
.cta-trust {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 64px;
}
.ct-item {
  font-size: 11px;
  letter-spacing: 1px;
  color: var(--dimmer);
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: 'DM Sans', sans-serif;
}
.ct-icon { color: var(--blue2); font-size: 12px; }
.ct-sep { color: var(--border2); font-size: 10px; }

/* Process steps */
.cta-process {
  border-top: 1px solid var(--border);
  padding-top: 48px;
  margin-bottom: 48px;
}
.cta-process-label {
  font-size: 9px;
  letter-spacing: 3px;
  color: var(--dimmer);
  font-family: 'DM Sans', sans-serif;
  margin-bottom: 32px;
}
.cta-steps {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 0;
  flex-wrap: wrap;
}
.cta-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 140px;
  max-width: 180px;
  padding: 0 12px;
}
.cs-num {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 36px;
  color: rgba(27,94,247,0.25);
  line-height: 1;
}
.cs-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 18px;
  color: var(--white);
  letter-spacing: 2px;
}
.cs-desc {
  font-size: 12px;
  color: var(--dimmer);
  line-height: 1.6;
  text-align: center;
  font-family: 'DM Sans', sans-serif;
}
.cta-step-arrow {
  color: var(--border2);
  font-size: 18px;
  margin-top: 14px;
  flex-shrink: 0;
}
.cta-note {
  font-size: 10px;
  letter-spacing: 1.5px;
  color: var(--dimmer);
  font-family: 'DM Sans', sans-serif;
}

/* CTA Mobile */
@media(max-width:768px){
  #cta { padding: 100px 20px 80px; }
  .cta-pillars { flex-wrap: wrap; max-width: 100%; }
  .cta-pillar { min-width: 40%; padding: 20px 12px; }
  .cp-divider { display: none; }
  .cta-pillar:nth-child(even):not(.cp-divider) { border-left: 1px solid var(--border); }
  .cta-trust { gap: 10px; }
  .ct-sep { display: none; }
  .ct-item { font-size: 10px; }
  .cta-steps { gap: 20px; justify-content: center; }
  .cta-step-arrow { display: none; }
  .cta-step { min-width: 120px; }
  .cta-sub { font-size: 15px; }
  .cta-actions { flex-direction: column; }
  .cta-actions .btn-hero, .cta-actions .btn-ghost { width: 100%; justify-content: center; }
}


/* ── HERO ILLUSTRATION ── */
.hero-illustration {
  position: absolute;
  right: 0; top: 50%;
  transform: translateY(-50%);
  width: 520px; height: 520px;
  pointer-events: none;
  opacity: 0;
  animation: hero-illus-in 1.2s 1.4s ease forwards;
}
@keyframes hero-illus-in {
  from { opacity: 0; transform: translateY(-50%) scale(0.92); }
  to   { opacity: 1; transform: translateY(-50%) scale(1); }
}
.hi-svg { width: 100%; height: 100%; }
/* Pulse rings on central node */
.pulse-r1 {
  animation: pulse-ring 2.5s ease-out infinite;
}
.pulse-r2 {
  animation: pulse-ring 2.5s ease-out infinite 0.6s;
}
@keyframes pulse-ring {
  0%   { opacity: 0.4; transform: scale(1); transform-origin: 240px 240px; }
  100% { opacity: 0; transform: scale(1.6); transform-origin: 240px 240px; }
}
/* Floating stat cards */
.hi-card {
  position: absolute;
  background: rgba(12,17,32,0.85);
  border: 1px solid rgba(27,94,247,0.25);
  border-radius: 4px;
  padding: 10px 16px;
  backdrop-filter: blur(12px);
  display: flex;
  flex-direction: column;
  gap: 2px;
  animation: float-card 4s ease-in-out infinite;
}
.hi-card1 { top: 14%; right: 4%; animation-delay: 0s; }
.hi-card2 { bottom: 22%; right: 8%; animation-delay: 1.2s; }
.hi-card3 { top: 44%; left: 2%; animation-delay: 0.7s; }
@keyframes float-card {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}
.hi-card-val {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 22px;
  color: var(--white);
  letter-spacing: 2px;
  line-height: 1;
}
.hi-card-label {
  font-size: 8px;
  letter-spacing: 2px;
  color: var(--dimmer);
  font-family: 'DM Sans', sans-serif;
  text-transform: uppercase;
}
/* Hide illustration on mobile */
@media(max-width:960px){ .hero-illustration { display: none; } }


/* ── RESULTS SECTION GRID PATTERN ── */
#results {
  position: relative;
}
#results::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: 
    linear-gradient(rgba(27,94,247,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(27,94,247,0.04) 1px, transparent 1px);
  background-size: 48px 48px;
  pointer-events: none;
  z-index: 0;
  mask-image: radial-gradient(ellipse 80% 80% at 50% 50%, black 40%, transparent 100%);
  -webkit-mask-image: radial-gradient(ellipse 80% 80% at 50% 50%, black 40%, transparent 100%);
}
#results .results-inner { position: relative; z-index: 1; }


/* ── ABOUT SECTION DECORATIVE ── */
.about-left { position: relative; }
.about-left::before {
  content: '"';
  position: absolute;
  top: -40px; left: -20px;
  font-family: 'Playfair Display', serif;
  font-size: 200px;
  color: rgba(27,94,247,0.04);
  line-height: 1;
  pointer-events: none;
  user-select: none;
  z-index: 0;
}
.about-left > * { position: relative; z-index: 1; }


/* ── FAQ SECTION ── */
.faq-list { display: flex; flex-direction: column; gap: 0; }
.faq-item {
  border-bottom: 1px solid var(--border);
  overflow: hidden;
}
.faq-q {
  width: 100%;
  background: none;
  border: none;
  color: var(--white);
  font-family: 'DM Sans', sans-serif;
  font-size: 15px;
  font-weight: 400;
  text-align: left;
  padding: 24px 0;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  letter-spacing: 0.2px;
  transition: color .2s;
}
.faq-q:hover { color: var(--blue2); }
.faq-icon {
  font-size: 22px;
  color: var(--blue2);
  flex-shrink: 0;
  transition: transform .35s var(--ease1);
  font-weight: 300;
}
.faq-a {
  font-size: 14px;
  line-height: 1.8;
  color: var(--dim);
  max-height: 0;
  overflow: hidden;
  transition: max-height .5s var(--ease1), padding .35s;
  padding: 0;
  font-family: 'DM Sans', sans-serif;
}
.faq-item.open .faq-a {
  max-height: 200px;
  padding-bottom: 24px;
}
.faq-item.open .faq-icon {
  transform: rotate(45deg);
}
@media(max-width:768px){
  #faq { padding: 80px 20px; }
  .faq-q { font-size: 14px; padding: 20px 0; }
}