/* ============================================================
   ONCE HUMAN — Affiliate Pre-Lander V2
   Conversion-first · Desktop-first · Cloudflare Pages
   ============================================================
   CHANGELOG vs V1:
   ✗ REMOVED  .sticky-bar + ALL sub-classes (entire block gone)
   ✗ REMOVED  video section  (HTML-only; no dedicated CSS block)
   ✓ UPDATED  Topbar logo  34px → 52px height
   ✓ UPDATED  Footer logo  30px → 44px height
   ✓ UPDATED  Hero — Hormozi-style above-fold conversion layout
   ✓ UPDATED  .hero__friction strip replaces scattered micro-copy
   ✓ UPDATED  All image references use .webp files
   ============================================================
   BRAND PALETTE — extracted from official Once Human logo:
     Primary cyan   #1DE3E3  (M-icon top half)
     Accent magenta #E8176C  (M-icon bottom half)
     Background     #050810
   ============================================================ */

:root {
  --cyan:        #1DE3E3;
  --cyan-dim:    rgba(29,227,227,.13);
  --cyan-glow:   rgba(29,227,227,.38);
  --magenta:     #E8176C;
  --magenta-dim: rgba(232,23,108,.13);
  --magenta-glow:rgba(232,23,108,.38);

  --bg:       #050810;
  --bg-2:     #090d1c;
  --surface:  #0d1424;
  --surface-2:#111929;
  --border:   rgba(29,227,227,.09);
  --border-s: rgba(29,227,227,.22);
  --border-mg:rgba(232,23,108,.26);

  --text:   #dce8f5;
  --muted:  #6e8eb5;
  --muted-2:#3d5470;
  --gold:   #f5c842;

  --fd: 'Barlow Condensed', 'Impact', sans-serif;
  --fb: 'DM Sans', 'Segoe UI', system-ui, sans-serif;
  --fm: 'JetBrains Mono', 'Fira Code', ui-monospace, monospace;

  --wrap:  1180px;
  --wrap-n:780px;
  --r:     10px;
  --rl:    18px;
  --rp:    999px;
  --ease:  cubic-bezier(.22,1,.36,1);
}

/* ── Reset ────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box;margin:0;padding:0 }
html { scroll-behavior:smooth;-webkit-text-size-adjust:100% }
body {
  background:var(--bg);color:var(--text);
  font-family:var(--fb);font-size:16px;line-height:1.6;
  overflow-x:hidden;
  background-image:
    radial-gradient(ellipse 100% 50% at 50% 0%, rgba(29,227,227,.05) 0%, transparent 68%),
    url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.03'/%3E%3C/svg%3E");
}
img    { display:block;max-width:100%;height:auto }
a      { color:var(--cyan);text-decoration:none }
ul,ol  { list-style:none }
button { cursor:pointer;font-family:inherit }

/* ── Layout ──────────────────────────────────────────────── */
.wrap    { max-width:var(--wrap);   margin-inline:auto;padding-inline:28px }
.wrap--n { max-width:var(--wrap-n); margin-inline:auto;padding-inline:28px }
.section    { padding-block:92px }
.section--sm{ padding-block:56px }
.sr-only { position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap }

/* ── Type Scale ──────────────────────────────────────────── */
.t-over { font-family:var(--fm);font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan) }
.t-hero { font-family:var(--fd);font-size:clamp(52px,7.8vw,108px);font-weight:900;line-height:.9;letter-spacing:-.015em;text-transform:uppercase }
.t-h2   { font-family:var(--fd);font-size:clamp(34px,5vw,62px);font-weight:800;line-height:1;text-transform:uppercase;letter-spacing:-.01em }
.t-h3   { font-family:var(--fd);font-size:clamp(18px,2.5vw,26px);font-weight:700;text-transform:uppercase;letter-spacing:.03em }
.t-lead { font-size:18px;line-height:1.75;color:var(--muted) }
.t-sm   { font-size:13px;color:var(--muted);line-height:1.55 }
.t-xs   { font-size:11px;color:var(--muted-2);line-height:1.4 }
.tc { color:var(--cyan) }
.tm { color:var(--magenta) }
.tg { color:var(--gold) }

/* ── Section Title Block ─────────────────────────────────── */
.stb         { display:flex;flex-direction:column;gap:10px;margin-bottom:52px }
.stb--center { align-items:center;text-align:center }
.stb__line   { width:64px;height:3px;border-radius:var(--rp);background:linear-gradient(90deg,var(--cyan),transparent) }
.stb--center .stb__line { margin-inline:auto }

/* ── Badges ──────────────────────────────────────────────── */
.badge      { display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:var(--rp);font-family:var(--fm);font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase }
.badge--free{ background:rgba(29,227,227,.10);border:1px solid rgba(29,227,227,.28);color:var(--cyan) }
.badge--win { background:rgba(29,227,227,.06);border:1px solid rgba(29,227,227,.18);color:var(--muted) }
.badge--live{ background:rgba(232,23,108,.10);border:1px solid rgba(232,23,108,.28);color:var(--magenta) }
.badge--live::before { content:'';width:6px;height:6px;border-radius:50%;background:var(--magenta);animation:blink 1.4s infinite;flex-shrink:0 }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.3} }

/* ── Buttons ─────────────────────────────────────────────── */
.btn {
  display:inline-flex;align-items:center;justify-content:center;
  gap:10px;padding:0 34px;height:56px;
  border-radius:var(--rp);border:none;
  font-family:var(--fd);font-size:18px;font-weight:800;
  letter-spacing:.07em;text-transform:uppercase;
  white-space:nowrap;text-decoration:none !important;
  position:relative;overflow:hidden;cursor:pointer;
  transition:transform .2s var(--ease),box-shadow .2s;
}
.btn::before {
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 50% 0%,rgba(255,255,255,.16) 0%,transparent 65%);
  opacity:0;transition:opacity .22s;
}
.btn:hover::before { opacity:1 }
.btn--xl { height:66px;font-size:22px;padding:0 48px }

.btn--primary {
  background:linear-gradient(138deg,#1DE3E3 0%,#009e9e 100%);
  color:#03101a;font-weight:900;
  box-shadow:0 0 36px var(--cyan-glow),0 4px 22px rgba(0,0,0,.55);
}
.btn--primary:hover {
  transform:translateY(-3px);
  box-shadow:0 0 58px var(--cyan-glow),0 8px 30px rgba(0,0,0,.65);
}
.btn--primary:active { transform:translateY(0) }

.btn--outline {
  background:transparent;border:1.5px solid var(--border-s);
  color:var(--text);backdrop-filter:blur(10px);
}
.btn--outline:hover { border-color:var(--cyan);color:var(--cyan);background:var(--cyan-dim);transform:translateY(-2px) }

.btn__icon { width:21px;height:21px;flex-shrink:0;fill:currentColor }

/* ── Cards ───────────────────────────────────────────────── */
.card        { background:var(--surface);border:1px solid var(--border);border-radius:var(--rl);padding:28px }
.card--raised{ background:var(--surface-2);border-color:var(--border-s) }
.card--warn  { background:rgba(232,23,108,.07);border:1px solid var(--border-mg);border-left:4px solid var(--magenta) }
.card--accent{ background:var(--cyan-dim);border:1px solid var(--border-s) }

/* ── Platform Warning Banner ─────────────────────────────── */
#platform-warning {
  display:none;
  background:#160410;border-bottom:2px solid var(--magenta);
  padding:12px 24px;text-align:center;font-size:14px;color:#ffadd4;
  position:relative;z-index:60;
}

/* ══════════════════════════════════════════════════════════
   TOPBAR — V2: logo enlarged 34px → 52px
   ══════════════════════════════════════════════════════════ */
.topbar {
  position:sticky;top:0;z-index:40;
  background:rgba(5,8,16,.92);backdrop-filter:blur(16px);
  border-bottom:1px solid var(--border);padding:10px 0;
}
.topbar__inner {
  display:flex;align-items:center;
  justify-content:space-between;gap:16px;flex-wrap:wrap;
}
.topbar__logo img {
  height:52px;   /* V2 CHANGE: was 34px in V1 */
  width:auto;display:block;
}
.topbar__right { display:flex;align-items:center;gap:10px }
.topbar .btn   { height:40px;font-size:13px;padding:0 20px }

/* ══════════════════════════════════════════════════════════
   HERO — Hormozi-style conversion layout
   Must answer in <5 seconds:
     1. What is it?  → post-apocalyptic survival MMO
     2. Who is it for? → PC gamers who want depth
     3. What do they get? → survival, building, combat, free
     4. Why now? → free, on Steam, no friction
   ══════════════════════════════════════════════════════════ */
.hero {
  position:relative;min-height:100vh;
  display:flex;align-items:center;
  overflow:hidden;padding-block:130px 100px;
}

/* Background image — WebP: assets/hero.webp */
.hero__bg-img { position:absolute;inset:0;z-index:0 }
.hero__bg-img img {
  width:100%;height:100%;object-fit:cover;
  object-position:center 22%;
  filter:saturate(1.08) brightness(.46);
}
/* Left-column overlay — dark enough to read white text, preserves atmosphere on right */
.hero__bg-img::after {
  content:'';position:absolute;inset:0;
  background:
    linear-gradient(90deg,
      rgba(5,8,16,1)    0%,
      rgba(5,8,16,.92)  34%,
      rgba(5,8,16,.50)  58%,
      rgba(5,8,16,.65)  100%),
    linear-gradient(to top, rgba(5,8,16,1) 0%, transparent 26%);
}

.hero__scanlines {
  position:absolute;inset:0;z-index:1;
  background:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(0,0,0,.09) 3px,rgba(0,0,0,.09) 4px);
  pointer-events:none;
}
.hero__accent-line {
  position:absolute;left:0;top:15%;bottom:15%;width:3px;
  background:linear-gradient(to bottom,transparent,var(--cyan) 35%,var(--magenta) 68%,transparent);
  z-index:3;opacity:.6;
}

.hero__content { position:relative;z-index:4;max-width:680px }

.hero__eyebrow { display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px }

/* Headline: specific > generic, outcome > descriptor */
.hero__title { margin-bottom:18px }
.hero__title .line-1 { color:var(--cyan);display:block }
.hero__title .line-2 { color:var(--text);display:block }
.hero__title .line-3 { color:var(--text);display:block }

/* Sub-headline: what they experience, not what the game "is" */
.hero__sub {
  font-size:19px;line-height:1.72;color:var(--muted);
  max-width:560px;margin-bottom:26px;
}
.hero__sub strong { color:var(--text) }

/* Qualification gate — above CTA to filter non-qualifying traffic */
.hero__qualify { margin-bottom:26px;border-radius:var(--r);padding:14px 18px }
.hero__qualify-title {
  display:flex;align-items:center;gap:7px;
  font-family:var(--fm);font-size:11px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--magenta);margin-bottom:10px;
}
.hero__qualify-title::before { content:'⚠';font-size:12px }
.hero__qualify ul { display:flex;flex-wrap:wrap;gap:6px 24px }
.hero__qualify li {
  display:flex;align-items:center;gap:7px;
  font-size:13px;color:var(--muted);
}
.hero__qualify li::before { content:'';width:5px;height:5px;border-radius:50%;background:var(--magenta);flex-shrink:0 }

/* CTA — single dominant action, no competing secondary above fold */
.hero__cta-wrap { margin-bottom:0 }

/* Friction reducers — explicit objection killers, inline below CTA */
.hero__friction {
  display:flex;flex-wrap:wrap;gap:6px 22px;margin-top:14px;
}
.hero__friction-item {
  display:flex;align-items:center;gap:6px;
  font-family:var(--fm);font-size:11px;
  color:var(--muted-2);letter-spacing:.07em;text-transform:uppercase;
}
.hero__friction-item::before { content:'✓';color:var(--cyan);font-size:12px;font-weight:700 }

.hero__legal {
  font-size:11px;color:var(--muted-2);margin-top:14px;line-height:1.5;
}
.hero__legal a {
  color:var(--muted-2);text-decoration:underline;
  text-decoration-color:rgba(110,142,181,.3);
}
.hero__legal a:hover { color:var(--muted) }

/* KPI strip — hard proof, named sources, no invented claims */
.hero__kpis {
  display:flex;margin-top:52px;
  border:1px solid var(--border);border-radius:var(--r);
  overflow:hidden;background:rgba(5,8,16,.56);
  backdrop-filter:blur(10px);max-width:500px;
}
.kpi { flex:1;text-align:center;padding:16px 6px;border-right:1px solid var(--border) }
.kpi:last-child { border-right:0 }
.kpi__val { display:block;font-family:var(--fd);font-size:32px;font-weight:900;color:var(--cyan);line-height:1 }
.kpi__lbl { display:block;font-size:9px;color:var(--muted-2);letter-spacing:.1em;text-transform:uppercase;margin-top:4px }

/* ══════════════════════════════════════════════════════════
   INSTALL SECTION
   ══════════════════════════════════════════════════════════ */
.install { background:var(--surface);border-block:1px solid var(--border) }
.install__grid { display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start }

.steps { display:flex;flex-direction:column;gap:0 }
.step {
  display:grid;grid-template-columns:52px 1fr;gap:18px;
  align-items:start;padding-bottom:28px;position:relative;
}
.step:not(:last-child)::after {
  content:'';position:absolute;
  left:25px;top:52px;bottom:0;width:2px;
  background:linear-gradient(to bottom,var(--border-s),transparent);
}
.step__num {
  width:52px;height:52px;border-radius:var(--r);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--fd);font-size:24px;font-weight:900;
  flex-shrink:0;position:relative;z-index:1;
  background:var(--bg-2);border:1.5px solid var(--border-s);color:var(--cyan);
}
.step--done .step__num { border-color:rgba(29,227,227,.48);background:rgba(29,227,227,.08) }
.step__body h4 {
  font-family:var(--fd);font-size:20px;font-weight:700;
  text-transform:uppercase;letter-spacing:.04em;
  margin-bottom:5px;line-height:1;padding-top:12px;
}
.step__body p { font-size:14px;color:var(--muted);line-height:1.65 }

.specs-list { display:flex;flex-direction:column;gap:10px }
.spec {
  display:flex;align-items:center;gap:14px;
  padding:14px 16px;background:var(--bg);
  border:1px solid var(--border);border-radius:var(--r);
  transition:border-color .18s;
}
.spec:hover { border-color:var(--border-s) }
.spec__icon  { font-size:22px;flex-shrink:0;width:32px;text-align:center }
.spec__label { font-size:11px;color:var(--muted-2);text-transform:uppercase;letter-spacing:.08em }
.spec__value { font-family:var(--fd);font-size:17px;font-weight:700;line-height:1.25 }
.spec__note  { font-size:11px;color:var(--muted-2);margin-top:2px }

/* ══════════════════════════════════════════════════════════
   GALLERY — WebP images
   Files: assets/hero.webp, combat.webp, gliding.webp, creatures.webp
   ══════════════════════════════════════════════════════════ */
.gallery { background:var(--bg);border-block:1px solid var(--border) }
.gallery__grid {
  display:grid;
  grid-template-columns:1.55fr 1fr 1fr;
  grid-template-rows:1fr 1fr;
  gap:14px;
}
.gallery__item {
  border-radius:var(--r);overflow:hidden;border:1px solid var(--border);
  position:relative;transition:border-color .2s,transform .22s;
}
.gallery__item:hover { border-color:var(--border-s);transform:scale(1.013) }
.gallery__item--main { grid-row:1/3 }
.gallery__item img {
  width:100%;height:100%;object-fit:cover;
  display:block;transition:transform .4s;
}
.gallery__item:hover img { transform:scale(1.04) }
.gallery__cap {
  position:absolute;bottom:0;left:0;right:0;
  padding:24px 14px 12px;
  background:linear-gradient(to top,rgba(5,8,16,.92),transparent);
  font-family:var(--fm);font-size:10px;color:var(--cyan);
  letter-spacing:.12em;text-transform:uppercase;
}

/* ══════════════════════════════════════════════════════════
   FEATURES
   ══════════════════════════════════════════════════════════ */
.features { background:var(--bg-2) }
.features__grid { display:grid;grid-template-columns:repeat(4,1fr);gap:18px }
.feat {
  background:var(--surface);border:1px solid var(--border);
  border-radius:var(--rl);padding:26px 22px;
  display:flex;flex-direction:column;gap:12px;
  transition:border-color .2s,transform .22s var(--ease),box-shadow .22s;
}
.feat:hover {
  border-color:var(--border-s);transform:translateY(-5px);
  box-shadow:0 16px 40px rgba(0,0,0,.38),0 0 26px var(--cyan-dim);
}
.feat__icon  { width:48px;height:48px;border-radius:var(--r);background:var(--cyan-dim);border:1px solid var(--border-s);display:flex;align-items:center;justify-content:center;font-size:22px }
.feat__title { font-family:var(--fd);font-size:18px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;line-height:1.18 }
.feat__desc  { font-size:14px;color:var(--muted);line-height:1.68;flex:1 }
.feat__pill  { display:inline-block;font-family:var(--fm);font-size:10px;color:var(--cyan);border:1px solid var(--border-s);border-radius:var(--rp);padding:3px 9px;letter-spacing:.08em;text-transform:uppercase;align-self:flex-start }

/* ══════════════════════════════════════════════════════════
   TWITCH STRIP
   ══════════════════════════════════════════════════════════ */
.twitch-strip {
  background:linear-gradient(90deg,rgba(145,70,255,.08),rgba(29,227,227,.04));
  border-block:1px solid rgba(145,70,255,.16);padding:18px 0;
}
.twitch-strip__inner { display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;text-align:center }
.twitch-strip__text strong { color:#bf94ff }

/* ══════════════════════════════════════════════════════════
   SOCIAL PROOF
   ══════════════════════════════════════════════════════════ */
.proof { background:var(--bg) }
.proof__stats { display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:36px }
.stat {
  text-align:center;padding:34px 18px;
  background:var(--surface);border:1px solid var(--border);
  border-radius:var(--rl);position:relative;overflow:hidden;
}
.stat::before {
  content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:50%;height:1px;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
}
.stat__num { font-family:var(--fd);font-size:clamp(42px,5vw,64px);font-weight:900;color:var(--cyan);line-height:1;margin-bottom:6px }
.stat__lbl { font-size:13px;color:var(--muted) }
.stat__src { font-family:var(--fm);font-size:10px;color:var(--muted-2);margin-top:8px }

.proof__reviews { display:grid;grid-template-columns:repeat(3,1fr);gap:14px }
.review { background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:22px }
.review__stars { color:var(--gold);font-size:14px;letter-spacing:2px;margin-bottom:10px }
.review__text  { font-size:14px;color:var(--text);line-height:1.7;font-style:italic;margin-bottom:10px }
.review__src   { font-size:11px;color:var(--muted-2) }

/* ══════════════════════════════════════════════════════════
   FAQ
   ══════════════════════════════════════════════════════════ */
.faq { background:var(--surface);border-top:1px solid var(--border) }
.faq__list { max-width:740px;margin:0 auto;display:flex;flex-direction:column;gap:6px }
.faq-item { background:var(--bg);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;transition:border-color .2s }
.faq-item.is-open { border-color:var(--border-s) }
.faq-item__btn {
  width:100%;display:flex;align-items:center;justify-content:space-between;
  gap:14px;padding:18px 20px;background:none;border:none;
  text-align:left;color:var(--text);font-family:var(--fb);
  font-size:15px;font-weight:600;cursor:pointer;transition:color .2s;
}
.faq-item__btn:hover { color:var(--cyan) }
.faq-item__icon { flex-shrink:0;width:18px;height:18px;color:var(--muted);transition:transform .25s var(--ease),color .2s }
.faq-item.is-open .faq-item__icon { transform:rotate(180deg);color:var(--cyan) }
.faq-item__body { display:none;padding:0 20px 18px;font-size:14px;color:var(--muted);line-height:1.78 }
.faq-item.is-open .faq-item__body { display:block }

/* ══════════════════════════════════════════════════════════
   FINAL CTA
   ══════════════════════════════════════════════════════════ */
.final-cta {
  background:var(--bg);text-align:center;
  padding-block:116px;position:relative;overflow:hidden;
}
.final-cta__glow {
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:800px;height:440px;
  background:radial-gradient(ellipse,rgba(29,227,227,.08) 0%,transparent 70%);
  pointer-events:none;
}
.final-cta__inner { position:relative;z-index:1 }
.final-cta__ctas  { display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:32px }
.final-cta__meta  { margin-top:18px;font-size:12px;color:var(--muted-2) }

/* ══════════════════════════════════════════════════════════
   FOOTER — V2: logo enlarged 30px → 44px
   Fully visible — no sticky bar obstructing viewport bottom.
   ══════════════════════════════════════════════════════════ */
.footer {
  background:var(--surface);border-top:1px solid var(--border);
  padding-block:34px;position:relative;z-index:1;
}
.footer__inner { display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap }
.footer__logo img {
  height:44px;   /* V2 CHANGE: was 30px in V1 */
  width:auto;display:block;opacity:.88;transition:opacity .18s;
}
.footer__logo img:hover { opacity:1 }
.footer__links    { display:flex;gap:20px;flex-wrap:wrap }
.footer__links a  { font-size:12px;color:var(--muted);transition:color .18s }
.footer__links a:hover { color:var(--text) }
.footer__disc {
  width:100%;font-size:11px;color:var(--muted-2);line-height:1.78;
  padding-top:16px;border-top:1px solid var(--border);margin-top:16px;
}

/* ══════════════════════════════════════════════════════════
   MODALS
   ══════════════════════════════════════════════════════════ */
.modal-overlay {
  position:fixed;inset:0;z-index:200;
  background:rgba(0,0,0,.80);backdrop-filter:blur(8px);
  display:flex;align-items:center;justify-content:center;
  padding:24px;opacity:0;pointer-events:none;transition:opacity .25s;
}
.modal-overlay.is-open { opacity:1;pointer-events:auto }
.modal {
  background:var(--surface-2);border:1px solid var(--border-s);
  border-radius:var(--rl);max-width:620px;width:100%;
  max-height:82vh;display:flex;flex-direction:column;
  transform:translateY(20px);transition:transform .3s var(--ease);
}
.modal-overlay.is-open .modal { transform:translateY(0) }
.modal__head {
  display:flex;align-items:center;justify-content:space-between;
  padding:24px 28px 18px;border-bottom:1px solid var(--border);flex-shrink:0;
}
.modal__title { font-family:var(--fd);font-size:22px;font-weight:800;text-transform:uppercase;letter-spacing:.04em }
.modal__close {
  width:32px;height:32px;border-radius:50%;
  background:var(--surface);border:1px solid var(--border);
  color:var(--muted);font-size:18px;line-height:1;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:color .18s,border-color .18s;flex-shrink:0;
}
.modal__close:hover { color:var(--text);border-color:var(--cyan) }
.modal__body { flex:1;overflow-y:auto;padding:24px 28px;font-size:13px;color:var(--muted);line-height:1.82 }
.modal__body h3 { color:var(--text);font-size:14px;font-weight:600;margin:16px 0 6px }
.modal__body p  { margin-bottom:10px }
.modal__footer {
  padding:18px 28px;border-top:1px solid var(--border);
  display:flex;gap:10px;align-items:center;flex-shrink:0;
}
.modal__footer .btn          { height:44px;font-size:14px;flex:1;text-align:center }
.modal__footer .btn--outline { flex:0 0 auto;padding:0 16px;font-size:13px }

/* ══════════════════════════════════════════════════════════
   COOKIE BANNER
   bottom:24px is safe — no sticky bar below it in V2
   ══════════════════════════════════════════════════════════ */
.cookie-banner {
  position:fixed;bottom:24px;left:20px;max-width:480px;z-index:160;
  background:var(--surface-2);border:1px solid var(--border-s);
  border-radius:var(--rl);padding:20px 22px;
  box-shadow:0 10px 44px rgba(0,0,0,.55);display:none;
}
.cookie-banner.is-visible { display:block }
.cookie-banner__title { font-family:var(--fd);font-size:16px;font-weight:700;text-transform:uppercase;margin-bottom:6px }
.cookie-banner__btns  { display:flex;gap:10px;margin-top:14px }
.cookie-banner__btns .btn { height:40px;font-size:13px;padding:0 16px }

/* ── Scroll Animations ───────────────────────────────────── */
.anim    { opacity:0;transform:translateY(28px);transition:opacity .65s var(--ease),transform .65s var(--ease) }
.anim.in { opacity:1;transform:translateY(0) }
.stagger>.anim:nth-child(1) { transition-delay:.05s }
.stagger>.anim:nth-child(2) { transition-delay:.13s }
.stagger>.anim:nth-child(3) { transition-delay:.21s }
.stagger>.anim:nth-child(4) { transition-delay:.29s }
.stagger>.anim:nth-child(5) { transition-delay:.37s }

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width:1100px) {
  .features__grid { grid-template-columns:repeat(2,1fr) }
  .gallery__grid  { grid-template-columns:1fr 1fr }
  .gallery__item--main { grid-row:auto;grid-column:1/-1 }
  .install__grid  { grid-template-columns:1fr;gap:36px }
}
@media (max-width:840px) {
  .proof__stats,.proof__reviews { grid-template-columns:1fr }
  .topbar__right .btn--outline  { display:none }
}
@media (max-width:680px) {
  .section  { padding-block:62px }
  .hero     { padding-block:108px 68px;min-height:auto }
  .features__grid { grid-template-columns:1fr }
  .gallery__grid  { grid-template-columns:1fr }
  .hero__kpis     { max-width:100% }
  .footer__inner  { flex-direction:column;align-items:flex-start }
  .topbar__logo img { height:40px }
}

/* ══════════════════════════════════════════════════════════
   CONFIRMED REMOVED IN V2:
   ✗ .sticky-bar            (was ~120 lines)
   ✗ .sticky-bar__inner
   ✗ .sticky-bar__brand
   ✗ .sticky-bar__logo
   ✗ .sticky-bar__info
   ✗ .sticky-bar__title
   ✗ .sticky-bar__sub
   ✗ .sticky-bar.is-visible
   Video section had no separate CSS block — only inline styles.
   ══════════════════════════════════════════════════════════ */