/*
Theme Name: RAIS Cinematic
Theme URI: https://rainierais.com
Author: Formma Digital
Description: Cinematic long form theme for Rainier AI Surveillance (RAIS). Solar powered AI surveillance towers. Includes an attention field background, AF reticle cursor, and shared chrome so every page matches the homepage.
Version: 2.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: rais-cinematic
*/

:root{
  --navy-950:#06061c;--navy-900:#0a0a2e;--navy-800:#101041;--navy-700:#20206F;--royal:#3a3aa8;--royal-soft:#4a49c9;
  --orange:#F28411;--amber:#ffab4d;--ember:#d9631a;--cream:#fbf3e9;
  --ink:#eef0ff;--ink-soft:rgba(228,231,255,.66);--ink-faint:rgba(210,215,255,.4);
  --glass:rgba(255,255,255,.045);--glass-2:rgba(255,255,255,.07);--line:rgba(255,255,255,.1);--line-strong:rgba(255,255,255,.18);
  --grad-accent:linear-gradient(100deg,var(--orange),var(--amber));
  --max:1500px;--pad:clamp(20px,5vw,72px);--ease:cubic-bezier(.22,.61,.36,1);
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:"Satoshi","Inter",system-ui,sans-serif;background:var(--navy-950);color:var(--ink);line-height:1.62;letter-spacing:-.002em;overflow-x:hidden;-webkit-font-smoothing:antialiased}
.lenis.lenis-smooth{scroll-behavior:auto!important}
h1,h2,h3,h4{font-family:"Clash Display","Space Grotesk",sans-serif;font-weight:600;line-height:1;letter-spacing:-.018em}
a{color:inherit;text-decoration:none}img{display:block;max-width:100%}
.mono{font-family:"JetBrains Mono",monospace}
::selection{background:var(--orange);color:#160c02}
.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.nav-links .has-drop{position:relative;text-align:center;}
.nav-links .has-drop>a{display:inline-flex;align-items:center;gap:5px}
.drop-caret{width:14px;height:14px;transition:transform .3s var(--ease)}
.nav-links .has-drop:hover .drop-caret{transform:rotate(180deg)}
.nav-drop{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(10px);min-width:260px;
  background:rgba(10,10,34,.98);backdrop-filter:blur(16px);border:1px solid var(--line-strong);border-radius:14px;
  padding:8px;list-style:none;margin:0;opacity:0;visibility:hidden;transition:.3s var(--ease);z-index:120;
  box-shadow:0 30px 60px -20px rgba(0,0,0,.7)}
.nav-links .has-drop:hover .nav-drop{opacity:1;visibility:visible;transform:translateX(-50%) translateY(6px)}
.nav-drop li a{display:block;padding:10px 14px;border-radius:9px;font-size:14px;color:var(--ink-soft);transition:.2s}
.nav-drop li a:hover{background:var(--glass);color:var(--ink)}
@media (max-width:900px){
  .nav-links .has-drop .nav-drop{position:static;transform:none!important;left:auto;min-width:0;background:none;border:0;box-shadow:none;
    opacity:1;visibility:visible;max-height:0;overflow:hidden;padding:0;text-align:center;transition:max-height .35s var(--ease)}
  .nav-links .has-drop.open .nav-drop{max-height:600px;padding:4px 0}
  .nav-links .has-drop.open .drop-caret{transform:rotate(180deg)}
  .nav-drop li{text-align:center}
  .nav-drop li a{display:block;text-align:center;padding:9px 0}
}
/* atmosphere */
.bg-fixed{position:fixed;inset:0;z-index:-3;background:
  radial-gradient(1100px 700px at 80% -10%,rgba(242,132,17,.14),transparent 60%),
  radial-gradient(1000px 800px at 8% 10%,rgba(58,58,168,.26),transparent 62%),
  linear-gradient(180deg,var(--navy-950),var(--navy-900) 50%,var(--navy-950))}
.bg-grid{position:fixed;inset:0;z-index:-2;background-image:linear-gradient(rgba(255,255,255,.016) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.016) 1px,transparent 1px);background-size:76px 76px;mask-image:radial-gradient(circle at 50% 20%,#000,transparent 80%);-webkit-mask-image:radial-gradient(circle at 50% 20%,#000,transparent 80%)}
#net{position:fixed;inset:0;z-index:-1;opacity:.9;pointer-events:none}

/* AF reticle cursor: acquires and locks onto targets like a camera autofocus */
/*@media (hover:hover){body{cursor:none}a,button,.btn,[data-cursor],.faq-q,.strip-field,.pf{cursor:none}}*/
/*.af{position:fixed;left:0;top:0;z-index:9999;pointer-events:none;will-change:transform,width,height}*/
/*.af .c{position:absolute;width:7px;height:7px;border:1.25px solid var(--amber);transition:border-color .3s;filter:drop-shadow(0 0 6px rgba(242,132,17,.7))}*/
/*.af .tl{left:0;top:0;border-right:0;border-bottom:0}*/
/*.af .tr{right:0;top:0;border-left:0;border-bottom:0}*/
/*.af .bl{left:0;bottom:0;border-right:0;border-top:0}*/
/*.af .br{right:0;bottom:0;border-left:0;border-top:0}*/
/*.af .dot{position:absolute;left:50%;top:50%;width:3px;height:3px;margin:-1.5px 0 0 -1.5px;border-radius:50%;background:var(--amber);box-shadow:0 0 10px var(--orange);transition:opacity .25s}*/
/*.af.lock .dot{opacity:0}*/
/*.af .scan{position:absolute;left:3px;right:3px;top:1px;height:1px;background:linear-gradient(90deg,transparent,var(--orange),transparent);opacity:0}*/
/*.af.lock .scan{opacity:.9;animation:afscan 1.7s ease-in-out infinite}*/
/*@keyframes afscan{0%,100%{transform:translateY(0)}50%{transform:translateY(var(--afh,20px))}}*/
/*.af .tag{position:absolute;left:0;top:calc(100% + 5px);font-family:"JetBrains Mono";font-size:8px;letter-spacing:.14em;color:var(--amber);white-space:nowrap;text-shadow:0 0 10px rgba(242,132,17,.7)}*/
/*.af.lock .c{border-color:var(--orange)}*/
/*.af.dark .c{border-color:#14143a;filter:none}*/
/*.af.dark .dot{background:#14143a;box-shadow:none}*/
/*.af.dark .tag{color:#14143a;text-shadow:none}*/
/*@media (hover:none){.af{display:none}}*/
.af .ring{display:none !important;}
/*.af{position:fixed;left:0;top:0;z-index:9999;pointer-events:none;transform:translate(-50%,-50%);will-change:transform}*/
/*.af .dot{position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:var(--amber);box-shadow:0 0 8px rgba(242,132,17,.7)}*/
/*.af .ring{position:absolute;left:50%;top:50%;width:20px;height:20px;margin:-10px 0 0 -10px;border-radius:50%;border:1.5px solid rgba(242,132,17,.5);transition:width .25s var(--ease),height .25s var(--ease),margin .25s var(--ease),border-color .25s}*/
/*.af.lock .ring{width:24px;height:24px;margin:-12px 0 0 -12px;border-color:var(--orange)}*/
/*.af.dark .dot{background:#14143a;box-shadow:none}*/
/*.af.dark .ring{border-color:rgba(20,20,58,.5)}*/
/*.af .c,.af .scan,.af .tag{display:none}*/
/*@media (hover:none){.af{display:none}}*/
.progress{position:fixed;top:0;left:0;height:2px;width:0;z-index:1000;background:linear-gradient(90deg,var(--royal-soft),var(--orange),var(--amber));box-shadow:0 0 12px rgba(242,132,17,.6)}

/* buttons */
.btn{position:relative;display:inline-flex;align-items:center;gap:9px;font-family:"Clash Display","Space Grotesk";font-weight:600;font-size:15px;padding:14px 24px;border-radius:100px;cursor:pointer;border:0;transition:transform .25s var(--ease)}
.btn svg{width:16px;height:16px}
.btn-primary{color:#1a0d02;background:var(--grad-accent);background-size:200% 200%;animation:flow 6s linear infinite}
.btn-primary:hover{box-shadow:0 14px 40px -10px rgba(242,132,17,.6)}
@keyframes flow{to{background-position:200% 0}}
.btn-dark{background:#0c0c26;color:var(--ink);border:1px solid var(--line-strong)}
.btn-dark:hover{border-color:var(--orange)}
.btn-light{background: var(--grad-accent);color:#111}
.btn:active{transform:scale(.96)}
.arrow{transition:transform .3s var(--ease)}.btn:hover .arrow{transform:translateX(4px)}

/* nav */
.nav{position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:900;width:calc(100% - 28px);max-width:1420px;transition:transform .45s var(--ease)}
.nav.hide{transform:translateX(-50%) translateY(-160%)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:10px 12px 10px 20px;border-radius:100px;border:1px solid var(--line);background:rgba(12,12,42,.55);backdrop-filter:blur(20px) saturate(1.3);box-shadow:0 10px 40px -18px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.06)}
.brand{display:flex;align-items:center;gap:10px;font-family:"Clash Display","Space Grotesk";font-weight:700}
.brand img{height:24px;filter:drop-shadow(0 0 10px rgba(242,132,17,.4))}
.brand b{font-size:18px}.brand span{color:var(--ink-faint);font-weight:500;font-size:10px;letter-spacing:.16em;margin-left:1px}
.nav-search{display:flex;align-items:center;gap:8px;padding:8px 16px;border-radius:100px;background:var(--glass);border:1px solid var(--line);color:var(--ink-soft);font-size:13px;min-width:160px}
.nav-search svg{width:15px;height:15px;stroke:var(--ink-soft)}
.nav-links{display:flex;gap:4px;margin-left:auto}
.nav-links a{font-size:13.5px;padding:8px 13px;border-radius:100px;color:var(--ink-soft);position:relative;transition:color .25s}
.nav-links a::after{content:"";position:absolute;left:13px;right:13px;bottom:5px;height:1px;background:var(--grad-accent);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.nav-links a:hover{color:var(--ink)}.nav-links a:hover::after{transform:scaleX(1)}
.nav-cta{padding:10px 18px;font-size:13.5px}
.burger{display:none;flex-direction:column;gap:5px;padding:10px;background:none;border:0;cursor:pointer;margin-left:auto}
.burger span{width:22px;height:2px;background:var(--ink);border-radius:2px}

/* HERO */
.hero{position:relative;min-height:100vh;padding-top:110px;display:flex;flex-direction:column;justify-content:flex-end}
.hero-media{position:absolute;inset:0;z-index:-1;overflow:hidden}
.hero-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);will-change:transform}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,6,28,.72) 0%,rgba(6,6,28,.25) 30%,rgba(6,6,28,.55) 70%,var(--navy-950) 100%)}
.hero-media::before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(120% 80% at 50% 40%,transparent 40%,rgba(6,6,28,.5))}
.hero-inner{position:relative;text-align:center;padding-bottom:40px}
.hero-eyebrow{display:inline-flex;align-items:center;gap:9px;padding:7px 15px;border-radius:100px;border:1px solid var(--line-strong);background:rgba(10,10,34,.4);backdrop-filter:blur(10px);font-family:"JetBrains Mono";font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:26px}
.pulse-dot{width:7px;height:7px;border-radius:50%;background:#38e08a;box-shadow:0 0 0 0 rgba(56,224,138,.6);animation:pulse 2s infinite}

.warn-band{position:relative;border-radius:20px;overflow:hidden;border:1px solid var(--line-strong);padding:clamp(30px,5vw,56px);background:linear-gradient(135deg,rgba(242,132,17,.14),rgba(217,99,26,.1));text-align:center}
.warn-strip{position:absolute;top:0;left:0;right:0;height:8px;background:repeating-linear-gradient(45deg,var(--orange) 0 22px,#111 22px 44px)}
.warn-in{position:relative;padding-top:10px}
.warn-eye{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--amber);display:block;margin-bottom:12px}
.warn-band h2{font-size:clamp(24px,4vw,50px);letter-spacing:-.02em;color:var(--ink);margin-bottom:10px}
.warn-by{font-size:12px;letter-spacing:.1em;color:var(--ink-soft)}
@keyframes pulse{70%{box-shadow:0 0 0 8px rgba(56,224,138,0)}100%{box-shadow:0 0 0 0 rgba(56,224,138,0)}}
.hero h1{font-size:clamp(58px,15vw,220px);font-weight:600;letter-spacing:-.032em;line-height:.92;margin-bottom:10px}
.hero h1 .mask{display:block;overflow:hidden;padding:0 .04em}
.hero h1 .fill{display:inline-block;background:linear-gradient(180deg,#fff 40%,var(--amber) 130%);-webkit-background-clip:text;background-clip:text;color:transparent;will-change:transform}
.hero-sub{max-width:44ch;margin:0 auto;color:rgba(238,240,255,.86);font-size:clamp(15px,1.3vw,19px)}
.about-hero .hero-sub {
    max-width: 53ch !important;
}
/* filter strip */
.strip{position:relative;z-index:5;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(10,10,34,.5);backdrop-filter:blur(16px);will-change:transform,opacity}
.strip-grid{display:grid;grid-template-columns:repeat(4,1fr) auto;align-items:stretch}
.strip-field{padding:20px 26px;border-right:1px solid var(--line);cursor:pointer;transition:background .3s}
.strip-field:hover{background:rgba(255,255,255,.03)}
.strip-field .k{font-family:"JetBrains Mono";font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--amber);margin-bottom:7px}
.strip-field .v{font-size:15px;color:var(--ink);font-weight:500}
.strip-explore{display:flex;align-items:center;justify-content:center;padding:0 44px;background:var(--grad-accent);color:#1a0d02;font-family:"Clash Display","Space Grotesk";font-weight:600;font-size:16px;gap:10px;cursor:pointer;transition:filter .3s}
.strip-explore:hover{filter:brightness(1.06)}
.strip-explore svg{width:18px;height:18px}

/* section shells */
.section{position:relative;padding-top:clamp(40px,11vh,140px);
/*padding-bottom:clamp(80px,11vh,140px);*/
    padding-bottom: 20px;
}
.chip{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:100px;border:1px solid var(--line);background:var(--glass);font-size:12.5px;color:var(--ink-soft)}
.chip .dot{width:6px;height:6px;border-radius:50%;background:var(--orange)}
.eyebrow{font-family:"JetBrains Mono";font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--amber);display:inline-flex;align-items:center;gap:10px}
.eyebrow::before{display:none;content:"";width:24px;height:1px;background:var(--grad-accent)}
.grad-text{background:linear-gradient(100deg,#fff,var(--amber));-webkit-background-clip:text;background-clip:text;color:transparent}

/* STATEMENT */
.statement{text-align:center}
.statement .top-row{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:clamp(40px,7vw,90px);flex-wrap:wrap}
.badges{display:flex;gap:10px;flex-wrap:wrap}
.avatars{display:flex;align-items:center;gap:6px}
.avatars .a{width:44px;height:44px;border-radius:12px;border:1px solid var(--line-strong);background:linear-gradient(140deg,rgba(242,132,17,.2),rgba(58,58,168,.2));display:flex;align-items:center;justify-content:center}
.avatars .a svg{width:20px;height:20px;stroke:var(--amber)}
.avatars .more{width:44px;height:44px;border-radius:12px;background:var(--glass-2);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:"JetBrains Mono";font-size:12px;color:var(--ink-soft)}
.statement h2{font-size:clamp(34px,6.4vw,92px);letter-spacing:-.026em;line-height:.98}
.statement h2 .l{display:block;overflow:hidden}
.statement h2 .fill{display:inline-block;will-change:transform}
.reticle{margin:clamp(24px,4vw,44px) auto 0;width:min(420px,80%);display:flex;align-items:center;gap:0}
.reticle .track{flex:1;height:1px;position:relative}
.reticle .track::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,var(--line-strong) 0 6px,transparent 6px 12px)}
.reticle .track i{position:absolute;left:0;top:0;height:100%;width:0;background:var(--grad-accent);box-shadow:0 0 10px rgba(242,132,17,.6)}
.reticle .eye{position:relative;width:56px;height:56px;flex:0 0 auto}
.reticle .eye svg{width:100%;height:100%}
.reticle .eye .rot{transform-origin:center;animation:spin 6s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* EDGE / VALUE carousel */
.edge-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:44px;flex-wrap:wrap}
.edge-left{max-width:700px}
.edge-left .eyebrow{margin-bottom:20px}
.edge-left h2{font-size:clamp(30px,3.6vw,46px);margin-bottom:16px}
.edge-left p{color:var(--ink-soft);font-size:16px;margin-bottom:26px;max-width:36ch}
.carousel {
    position: relative;
    overflow: hidden;
    touch-action: pan-y;      /* Allow vertical page scroll, enable horizontal drag */
}

.car-track {
    display: flex;
    gap: 20px;
    will-change: transform;
    cursor: grab;
    touch-action: pan-y;
    user-select: none;
    -webkit-user-select: none;
    -webkit-user-drag: none;
}
.car-track:active{cursor:grabbing}
.card-dest{position:relative;flex:0 0 clamp(280px,32vw,420px);aspect-ratio:4/3.4;border-radius:22px;overflow:hidden;border:1px solid var(--line);isolation:isolate}
.card-dest img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease);transform:scale(1.03)}
.card-dest:hover img{transform:scale(1.1)}
.card-dest::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(6,6,28,.85))}
.card-dest .cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:22px;display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.card-dest .cap h3{font-size:21px}
.card-dest .cap .sub{font-family:"JetBrains Mono";font-size:11px;letter-spacing:.1em;color:var(--ink-soft);margin-top:4px}
.card-dest .cap .go{width:40px;height:40px;border-radius:50%;background:rgba(10,10,34,.6);backdrop-filter:blur(8px);border:1px solid var(--line-strong);display:flex;align-items:center;justify-content:center;flex:0 0 auto;transition:.3s var(--ease)}
.card-dest:hover .cap .go{background:var(--grad-accent)}
.card-dest .cap .go svg{width:16px;height:16px;stroke:#fff;transition:stroke .3s}
.card-dest:hover .cap .go svg{stroke:#160c02}
.car-nav{display:flex;gap:8px}
.car-btn{width:46px;height:46px;border-radius:50%;border:1px solid var(--line-strong);background:var(--glass);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.3s var(--ease)}
.car-btn:hover{background:var(--orange);border-color:var(--orange)}
.car-btn:hover svg{stroke:#160c02}
.car-btn svg{width:18px;height:18px;stroke:var(--ink)}

/* PICK YOUR COVERAGE (light contrast section) */
.pick{background:var(--cream);color:#16143a;border-radius:40px 40px 0 0;position:relative;z-index:2; background-image:
        linear-gradient(rgba(0, 0, 0, 0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 0, 0, 0.06) 1px, transparent 1px);

    background-size: 40px 40px; /* Grid spacing */}
.pick .eyebrow{color:var(--ember)}
.pick .eyebrow::before{background:linear-gradient(100deg,var(--ember),var(--orange))}
.pick-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:38px}
.pick-head h2{font-size:clamp(40px,6.4vw,92px);letter-spacing:-.026em;color:#16143a}
.pick-head p{max-width:34ch;color:#5a5670;font-size:15.5px}
.pick-filter{display:grid;grid-template-columns:repeat(4,1fr) auto;gap:0;border:1px solid rgba(20,20,58,.12);border-radius:18px;background:#fff;box-shadow:0 20px 50px -30px rgba(20,20,58,.3);overflow:hidden;margin-bottom:36px}
.pf{padding:16px 22px;border-right:1px solid rgba(20,20,58,.1)}
.pf .k{font-size:12px;color:#16143a;font-weight:600;margin-bottom:4px}
.pf .v{font-size:13.5px;color:#8a869c}
.pf-btn{display:flex;align-items:center;gap:8px;padding:0 34px;background:#14143a;color:#fff;font-family:"Clash Display","Space Grotesk";font-weight:600;cursor:pointer;transition:background .3s}
.pf-btn:hover{background:var(--orange);color:#160c02}
.pick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pkg{background:#fff;border:1px solid rgba(20,20,58,.08);border-radius:22px;padding:18px;transition:transform .35s var(--ease),box-shadow .35s}
.pkg:hover{transform:translateY(-6px);box-shadow:0 30px 60px -30px rgba(20,20,58,.35)}
.pkg-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px}
.pkg-top h3{font-size:16px;color:#16143a}
.pkg-top .loc{font-size:12.5px;color:#8a869c;margin-top:2px}
.pkg-slot{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:100px;background:#fff4e6;color:var(--ember);font-family:"JetBrains Mono";font-size:10.5px;font-weight:700;letter-spacing:.04em;border:1px solid rgba(242,132,17,.25)}
.pkg-media{position:relative;border-radius:16px;overflow:hidden;aspect-ratio:16/11;margin-bottom:14px}
.pkg-media img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.pkg:hover .pkg-media img{transform:scale(1.08)}
.pkg-tag{position:absolute;top:12px;right:12px;padding:6px 12px;border-radius:100px;background:rgba(255,255,255,.85);backdrop-filter:blur(6px);font-size:11.5px;font-weight:600;color:#16143a}
.pkg-meta{display:flex;align-items:center;gap:16px;font-size:12.5px;color:#5a5670}
.pkg-meta .m{display:flex;align-items:center;gap:6px}
.pkg-meta svg{width:15px;height:15px;stroke:var(--ember)}
.pkg-meta .price{font-family:"Clash Display","Space Grotesk";font-weight:700;color:#16143a;font-size:15px}
.pkg-exp{width:38px;height:38px;border-radius:50%;border:1px solid rgba(20,20,58,.14);display:flex;align-items:center;justify-content:center;margin-top:14px;cursor:pointer;transition:.3s var(--ease)}
.pkg-exp:hover{background:#14143a}
.pkg-exp:hover svg{stroke:#fff}
.pkg-exp svg{width:15px;height:15px;stroke:#16143a}
.pkg-foot{display:flex;justify-content:space-between;align-items:center}

/* footer */
.footer{background:var(--navy-950);border-top:1px solid var(--line);padding-top:70px;padding-bottom:36px;position:relative;overflow:hidden}
.footer::before{content:"";position:absolute;top:-40%;left:50%;transform:translateX(-50%);width:120%;height:60%;background:radial-gradient(circle,rgba(242,132,17,.14),transparent 70%);filter:blur(50px)}
.foot-top{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;padding-bottom:44px;border-bottom:1px solid var(--line);margin-bottom:30px}
.foot-top h2{font-size:clamp(30px,4.4vw,56px);max-width:16ch}
.foot-cols{display:flex;gap:60px;flex-wrap:wrap}
.foot-col h5{font-family:"JetBrains Mono";font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:14px}
.foot-col a{display:block;color:var(--ink-soft);font-size:14px;padding:5px 0;transition:color .25s,transform .25s}
.foot-col a:hover{color:var(--ink);transform:translateX(4px)}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;color:var(--ink-faint);font-size:13px}

/* reveal */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* marquee */
.marquee{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;overflow:hidden;background:rgba(255,255,255,.015);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{display:flex;gap:48px;width:max-content;animation:marq 30s linear infinite}
.marquee-track span{font-family:"Clash Display","Space Grotesk";font-weight:500;font-size:16px;color:var(--ink-soft);display:flex;align-items:center;gap:48px;white-space:nowrap}
.marquee-track span::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--orange)}
@keyframes marq{to{transform:translateX(-50%)}}

/* stats band */
.stats{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.stat-cell{padding:6px 26px;border-right:1px solid var(--line)}
.stat-cell:last-child{border-right:0}
.stat-cell .n{font-family:"Clash Display","Space Grotesk";font-weight:600;font-size:clamp(40px,5vw,64px);letter-spacing:-.02em;background:linear-gradient(180deg,#fff,var(--amber));-webkit-background-clip:text;background-clip:text;color:transparent}
.stat-cell .l{font-family:"JetBrains Mono";font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-top:6px}

/* shared section head */
.sec-head{max-width:640px;margin-bottom:52px}
.sec-head.center{margin-left:auto;margin-right:auto;text-align:center}
.sec-head .eyebrow{margin-bottom:16px}
.sec-head h2{font-size:clamp(30px,4.4vw,56px);margin-bottom:14px}
.sec-head p{color:var(--ink-soft);font-size:16px}

/* how it works */
.steps{position:relative;margin-top:30px}
.steps-line{position:absolute;top:34px;left:0;right:0;height:2px;background:var(--line)}
.steps-line i{position:absolute;inset:0;width:0;background:linear-gradient(90deg,var(--royal-soft),var(--orange),var(--amber));box-shadow:0 0 12px rgba(242,132,17,.6);border-radius:2px}
.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.step .node{width:70px;height:70px;border-radius:18px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line-strong);background:rgba(10,10,34,.8);backdrop-filter:blur(10px);position:relative;z-index:2;margin-bottom:22px}
.step .node svg{width:28px;height:28px;stroke:var(--amber)}
.step .st{font-family:"JetBrains Mono";font-size:11px;letter-spacing:.2em;color:var(--amber);margin-bottom:8px}
.step h4{font-size:19px;margin-bottom:8px}
.step p{font-size:14px;color:var(--ink-soft);max-width:26ch}

/* tech showcase */
.tech-split{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(30px,5vw,60px);align-items:start}
.tech-vis{position:relative;aspect-ratio:5/4}
.tower-glow{position:absolute;top:4%;left:6%;width:88%;height:70%;border-radius:40%;filter:blur(60px);background:radial-gradient(circle,rgba(242,132,17,.3),rgba(58,58,168,.22) 55%,transparent 72%);animation:breathe 7s ease-in-out infinite}
@keyframes breathe{50%{transform:scale(1.06);opacity:.85}}
@keyframes floaty{50%{transform:translateY(-12px)}}
.tech-frame{position:absolute;inset:0;border-radius:26px;overflow:hidden;border:1px solid var(--line-strong)}
.tech-frame img{width:100%;height:100%;object-fit:cover;transform:scale(1.05);animation:kenb 16s ease-in-out infinite alternate}
@keyframes kenb{to{transform:scale(1.14)}}
.tech-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,6,28,.12),rgba(6,6,28,.5))}
.tech-frame::before{content:"";position:absolute;inset:0;z-index:3;border-radius:26px;padding:1px;background:linear-gradient(135deg,rgba(242,132,17,.6),rgba(58,58,168,.4) 50%,transparent 75%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.tech-scan{position:absolute;left:0;right:0;top:0;height:36%;z-index:2;background:linear-gradient(180deg,rgba(242,132,17,.22),transparent);pointer-events:none;animation:scan 4.5s ease-in-out infinite}
@keyframes scan{0%,100%{transform:translateY(-30%);opacity:0}50%{transform:translateY(210%);opacity:.9}}
.tvhud{position:absolute;z-index:7;padding:10px 13px;border-radius:12px;border:1px solid var(--line-strong);background:rgba(10,10,34,.62);backdrop-filter:blur(14px);animation:floaty 6s ease-in-out infinite}
.tvhud .cap{font-family:"JetBrains Mono";font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--amber);display:flex;align-items:center;gap:5px;margin-bottom:4px}
.tvhud .cap i{width:5px;height:5px;border-radius:50%;background:var(--orange);box-shadow:0 0 8px var(--orange)}
.tvhud .val{font-family:"JetBrains Mono";font-size:12px;color:var(--ink)}
.tvhud.p1{top:8%;left:-4%}.tvhud.p2{top:42%;right:-6%;animation-delay:-2s}.tvhud.p3{bottom:12%;left:-2%;animation-delay:-3.5s}
.tvhud.p4{top:72%;right:-6%}
.tvhud.p5{bottom:43%;left:-4%}
.tvhud .bar{margin-top:6px;height:4px;border-radius:3px;background:rgba(255,255,255,.12);overflow:hidden}
.tvhud .bar i{display:block;height:100%;width:30%;background:linear-gradient(90deg,var(--orange),var(--amber));border-radius:3px}
.cap-list{display:flex;flex-direction:column;gap:10px}
.cap-item{display:flex;gap:16px;padding:18px 20px;border-radius:16px;border:1px solid var(--line);background:var(--glass);transition:.35s var(--ease)}
.cap-item:hover{background:var(--glass-2);transform:translateX(6px)}
.cap-item .ci{width:44px;height:44px;flex:0 0 auto;border-radius:12px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line-strong);background:linear-gradient(140deg,rgba(242,132,17,.16),rgba(58,58,168,.14))}
.cap-item .ci svg{width:22px;height:22px;stroke:var(--amber)}
.cap-item h4{font-size:17px;margin-bottom:3px}
.cap-item p{font-size:13.5px;color:var(--ink-soft)}

/* why panels */
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.panel{position:relative;padding:26px 22px 28px;border-radius:20px;border:1px solid var(--line);background:var(--glass);overflow:hidden;transition:transform .4s var(--ease),background .4s}
.panel::before{content:"";position:absolute;inset:0;border-radius:20px;padding:1px;background:linear-gradient(140deg,rgba(242,132,17,.6),rgba(58,58,168,.35) 45%,transparent 70%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .4s}
.panel:hover{transform:translateY(-8px);background:var(--glass-2)}.panel:hover::before{opacity:1}
.panel .ic{width:50px;height:50px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:20px;border:1px solid var(--line-strong);background:linear-gradient(140deg,rgba(242,132,17,.16),rgba(58,58,168,.14));transition:.4s var(--ease)}
.panel:hover .ic{transform:rotate(-6deg) scale(1.06)}
.panel .ic svg{width:23px;height:23px;stroke:var(--amber)}
.panel h3{font-size:18px;margin-bottom:8px}.panel p{font-size:14px;color:var(--ink-soft)}

/* testimonials */
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.testi{padding:28px 26px;border-radius:20px;border:1px solid var(--line);background:var(--glass);backdrop-filter:blur(10px);transition:.35s var(--ease)}
.testi:hover{transform:translateY(-6px);background:var(--glass-2)}
.testi .stars{display:flex;gap:3px;margin-bottom:16px}
.testi .stars svg{width:16px;height:16px;fill:var(--amber)}
.testi p{font-size:15px;color:var(--ink);margin-bottom:20px}
.testi .by{display:flex;align-items:center;gap:12px}
.testi .by .av{width:42px;height:42px;border-radius:12px;background:linear-gradient(140deg,rgba(242,132,17,.25),rgba(58,58,168,.25));display:flex;align-items:center;justify-content:center;font-family:"Clash Display","Space Grotesk";font-weight:700;color:var(--amber)}
.testi .by .nm{font-weight:600;font-size:14px}.testi .by .rl{font-size:12.5px;color:var(--ink-soft)}

/* faq */
.faq{max-width:820px;margin:0 auto}
.faq-item{border:1px solid var(--line);border-radius:16px;background:var(--glass);margin-bottom:12px;overflow:hidden;transition:background .3s}
.faq-item.open{background:var(--glass-2)}
.faq-q{width:100%;text-align:left;background:none;border:0;color:var(--ink);font-family:"Clash Display","Space Grotesk";font-weight:600;font-size:17px;padding:22px 24px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq-q .pm{width:26px;height:26px;flex:0 0 auto;border-radius:50%;border:1px solid var(--line-strong);display:flex;align-items:center;justify-content:center;transition:.3s var(--ease)}
.faq-q .pm svg{width:14px;height:14px;stroke:var(--amber);transition:transform .3s}
.faq-item.open .pm{background:var(--orange);border-color:var(--orange)}
.faq-item.open .pm svg{stroke:#160c02;transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s var(--ease)}
.faq-a p{padding:0 24px 22px;color:var(--ink-soft);font-size:15px}

/* cta band */
.cta-band{position:relative;border-radius:30px;overflow:hidden;border:1px solid var(--line);padding:clamp(44px,7vw,84px);isolation:isolate;text-align:center}
.cta-band .bgi{position:absolute;inset:0;z-index:-2}
.cta-band .bgi img{width:100%;height:100%;object-fit:cover}
.cta-band::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(115deg,rgba(10,10,42,.92),rgba(20,20,80,.7) 45%,rgba(242,132,17,.32))}
.cta-band h2{font-size:clamp(32px,5vw,64px);max-width:18ch;margin:0 auto 16px}
.cta-band p{color:rgba(240,242,255,.85);max-width:46ch;margin:0 auto 28px;font-size:17px}
.cta-band .row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ==========================================================================
   RAIS CINEMATIC — RESPONSIVE FIX PACK
   Replace your existing "/* responsive */" block (and the two breakpoint
   blocks above it for .stats-grid/.steps-grid/etc) with everything below.
   Also apply the 3 small BASE RULE EDITS at the very top first — those are
   one-line changes to rules that live earlier in your stylesheet, outside
   any media query.
   ========================================================================== */


/* ==========================================================================
   BASE RULE EDITS (not media queries — find-and-replace these lines
   wherever they currently appear in your stylesheet)
   ========================================================================== */

/* 1. .section — was:
   .section{position:relative;padding-top:clamp(80px,11vh,140px);padding-bottom:clamp(80px,11vh,140px)}
   Change to (svh instead of vh so mobile address-bar show/hide doesn't
   reflow every section as you scroll): */
.section{position:relative;padding-top:clamp(40px,11svh,140px);
/*padding-bottom:clamp(80px,11svh,140px);*/
    padding-bottom:20px;
}

/* 2. .cta-band — was:
   .cta-band{... padding:clamp(44px,7vw,84px); ...}
   vw is fine here (width-based, not affected by address bar), no change needed.
   Listed here only so you know it was checked. */

/* 3. .page-hero — was:
   .page-hero{position:relative;padding-top:clamp(140px,17vh,200px);padding-bottom:clamp(40px,6vh,70px)}
   Change to: */
.page-hero{position:relative;padding-top:clamp(140px,17svh,200px);padding-bottom:clamp(40px,6svh,70px)}

/* 4. .page-body — was:
   .page-body{padding-bottom:clamp(70px,10vh,120px)}
   Change to: */
.page-body{padding-bottom:clamp(70px,10svh,120px)}

/* 5. Header rows that wrap on mobile — add flex-start alignment consistently.
   .edge-head already had this; .pick-head, .foot-top and .statement .top-row
   did not, so they misaligned when wrapping to a single column. */
.pick-head,
.foot-top,
.statement .top-row{
  align-items:flex-start;
}


/* ==========================================================================
   BREAKPOINT: max-width 1024px  (tablet)
   ========================================================================== */
@media (max-width:1024px){
  /* stat band */
  .stats-grid{grid-template-columns:1fr 1fr}
  .stat-cell:nth-child(2){border-right:0}

  /* how it works */
  .steps-grid{grid-template-columns:1fr 1fr}
  .steps-line{display:none}

  /* tech showcase */
  .tech-split{grid-template-columns:1fr;gap:36px}
  .tech-vis{max-width:440px;margin:0 auto;width:100%}

  /* why panels / testimonials */
  .why-grid{grid-template-columns:1fr 1fr}
  .testi-grid{grid-template-columns:1fr}

  /* filter strip */
  .strip-grid{grid-template-columns:1fr 1fr}
  .strip-field:nth-child(2){border-right:0}
  .strip-explore{grid-column:1 / -1;padding:18px}

  /* pick coverage */
  .pick-filter{grid-template-columns:1fr 1fr}
  .pick-grid{grid-template-columns:1fr 1fr}

  /* nav */
  .nav-search{display:none}

  /* hero-scroll: cut way down from 500vh so the scroll-jack effect doesn't
     make the page feel like it has a dead-space canyon before the next
     section shows up. Tune the number to match your JS scroll-progress
     divisor if the reveal timing feels off after this change. */
  .hero-scroll{height:260vh}
}


/* ==========================================================================
   BREAKPOINT: max-width 768px  (large phone / small tablet)
   ========================================================================== */
@media (max-width:768px){
    .edge-head{
        margin-bottom:17px;
    }
    .hero h1{
        font-size: clamp(36px, 12vw, 220px);
    }
  .hero-scroll .hero-inner{bottom:clamp(100px,16svh,150px)}
  .hero-scrollcue{bottom:24px}

  /* shrink further on phones — 500vh desktop effect has no business
     being anywhere near that tall once you're on a phone screen */
  .hero-scroll{height:200vh}
  .btn{
      padding:14px 16px;
  }
  .hero-ctas .btn{
      margin-bottom:14px !important;
  }
  .core{
      width: 250px !important;
      height: 250px !important;
  }
}


/* ==========================================================================
   BREAKPOINT: max-width 760px  (nav collapse + strip/pick single column)
   ========================================================================== */
@media (max-width:760px){
  .nav-links{display:none}
  .burger{display:flex}
  .nav-cta{display:none}

  .strip-grid{grid-template-columns:1fr}
  .strip-field{border-right:0}

  .pick-filter{grid-template-columns:1fr}
  .pf{border-right:0}
  .pick-grid{grid-template-columns:1fr}

  .edge-head{align-items:flex-start}
}


/* ==========================================================================
   BREAKPOINT: max-width 640px  (phone)
   ========================================================================== */
@media (max-width:640px){
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .stat-cell{border-right:0;border-bottom:1px solid var(--line);padding:20px 0}
  .why-grid{grid-template-columns:1fr}
  .steps-grid{grid-template-columns:repeat(2,1fr)}

  /* THE key fix for "too much space between sections":
     .section previously had no mobile override at all, so the 80px clamp
     floor applied on every screen size. On a ~700px-tall phone viewport,
     80px top + 80px bottom padding per section adds up fast across a long
     page. Cut it down here. */
  .section{padding-top:48px;padding-bottom:48px}

  /* same idea for these bands, which also had no mobile override */
  .cta-band{padding:32px 20px}
  .warn-band{padding:24px 20px}
  .page-hero{padding-top:100px;padding-bottom:32px}
  .page-body{padding-bottom:56px}

  /* header rows that flex-wrap: give them breathing room + consistent
     top-alignment once stacked, instead of flex-end mismatched heights */
  .pick-head,
  .foot-top,
  .statement .top-row,
  .edge-head{
    gap:20px;
  }
}


/* ==========================================================================
   REDUCED MOTION (unchanged from original — keep as-is)
   ========================================================================== */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none}
  .hero-media img{transform:none}
}


/* ============ INNER PAGES ============
   Any page created in WordPress renders through page.php and picks these up,
   so future pages match the homepage without extra work. */
.page-hero{position:relative;padding-top:clamp(140px,17vh,200px);padding-bottom:clamp(40px,6vh,70px)}
.page-hero .eyebrow{margin-bottom:18px}
.page-hero h1{font-size:clamp(38px,6vw,84px);letter-spacing:-.028em;line-height:.98}
.page-hero .lede{color:var(--ink-soft);font-size:clamp(15px,1.4vw,19px);max-width:56ch;margin-top:18px}
.page-body{padding-bottom:clamp(70px,10vh,120px)}
.page-body .inner{max-width:800px}
.page-body p{color:var(--ink-soft);font-size:16.5px;margin-bottom:18px}
.page-body h2{font-size:clamp(24px,3vw,38px);margin:38px 0 14px}
.page-body h3{font-size:clamp(20px,2.2vw,26px);margin:30px 0 12px}
.page-body h4{font-size:18px;margin:24px 0 10px}
.page-body a{color:var(--amber);text-decoration:underline;text-underline-offset:3px}
.page-body a:hover{color:var(--orange)}
.page-body ul,.page-body ol{color:var(--ink-soft);margin:0 0 18px 20px}
.page-body li{margin-bottom:8px}
.page-body img{border-radius:16px;margin:22px 0}
.page-body blockquote{border-left:2px solid var(--orange);padding:6px 0 6px 20px;margin:24px 0;color:var(--ink)}
.page-body table{width:100%;border-collapse:collapse;margin:22px 0}
.page-body th,.page-body td{border:1px solid var(--line);padding:11px 14px;text-align:left;font-size:14.5px}
.page-body th{background:var(--glass);font-family:"Clash Display","Space Grotesk",sans-serif;font-weight:600}
.page-body code{font-family:"JetBrains Mono",monospace;font-size:13.5px;background:var(--glass);padding:2px 6px;border-radius:5px}

/* post list */
.post-card{display:block;padding:26px 0;border-bottom:1px solid var(--line);transition:padding-left .35s var(--ease)}
.post-card:hover{padding-left:10px}
.post-card .meta{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--amber);margin-bottom:10px}
.post-card h2{font-size:clamp(21px,2.4vw,30px);margin-bottom:8px}
.post-card p{color:var(--ink-soft);font-size:15px;max-width:70ch}
.pagination{display:flex;gap:8px;flex-wrap:wrap;margin-top:34px}
.pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 12px;
  border-radius:100px;border:1px solid var(--line);background:var(--glass);font-size:14px;transition:.3s var(--ease)}
.pagination .page-numbers:hover,.pagination .current{background:var(--grad-accent);color:#160c02;border-color:transparent}

/* nav active state */
.nav-links{margin:0;padding:0;list-style:none;align-items:center}
.nav-links li{list-style:none}
.nav-links a.active{color:var(--ink)}
.nav-links a.active::after{transform:scaleX(1)}

/* accessibility */
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.skip-link:focus{position:fixed;top:12px;left:12px;z-index:10000;padding:12px 18px;border-radius:10px;background:var(--orange);color:#160c02;width:auto;height:auto;clip:auto}




.vlb{position:fixed;inset:0;z-index:9998;display:none;align-items:center;justify-content:center;padding:24px;background:rgba(6,6,20,.86);backdrop-filter:blur(8px)}
.vlb.open{display:flex}
.vlb-frame{position:relative;width:min(1000px,92vw);aspect-ratio:16/9;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.15);box-shadow:0 40px 100px -30px rgba(0,0,0,.8);transform:scale(.96);transition:transform .3s var(--ease)}
.vlb.open .vlb-frame{transform:scale(1)}
.vlb-frame iframe,.vlb-frame video{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}
.vlb-close{position:absolute;top:22px;right:26px;z-index:2;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#fff;font-size:26px;line-height:1;cursor:pointer;transition:.25s var(--ease)}
.vlb-close:hover{background:var(--orange);border-color:var(--orange);color:#160c02}

.hero-scroll #heroInner{opacity:0}

/* hero sticky: text pinned to bottom-left, cue centered, robust across sizes */
.hero-scroll{min-height:0;height:500vh;padding-top:0;display:block}
.hero-scroll .hero-sticky{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.hero-scroll .hero-media{position:absolute;inset:0;z-index:0}
.hero-scroll .hero-media canvas{width:100%;height:100%;object-fit:cover;display:block}

/* headline block: anchored bottom-left, never overlaps the cue */
.hero-scroll .hero-inner{position:absolute;left:0;right:0;bottom:clamp(90px,12vh,150px);z-index:2}

/* scroll cue: truly centered horizontally, fixed distance from bottom */
.hero-scrollcue{position:absolute;left:50%;bottom:clamp(20px,4vh,40px);transform:translateX(-50%);z-index:3;
  display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;
  font-family:"JetBrains Mono",monospace;font-size:clamp(11px,1.4vw,12px);letter-spacing:.05em;text-transform:uppercase;color:#fff;pointer-events:none}
.hero-scrollcue svg{width:clamp(20px,3vw,30px);height:clamp(20px,3vw,30px);color:var(--orange);animation:cueBounce 1.6s ease-in-out infinite}
@keyframes cueBounce{0%,100%{transform:translateY(0);opacity:.6}50%{transform:translateY(8px);opacity:1}}

@media (max-width:768px){
  .hero-scroll .hero-inner{bottom:clamp(100px,16vh,150px)}
  .hero-scrollcue{bottom:24px}
}


.stat{position:relative;overflow:hidden}
.stat-bg{position:absolute;inset:0;z-index:0}
.stat-bg img{width:100%;height:100%;object-fit:cover;opacity:1.68;transition:transform .8s var(--ease),opacity .4s}
.stat-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,6,28,.55),rgba(6,6,28,.9))}
.stat:hover .stat-bg img{transform:scale(1.08);opacity:.4}
.stat > .ic,.stat > .val,.stat > .lbl{position:relative;z-index:1}


