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

html{scroll-behavior:smooth}

:root{
  --black:#000; --panel:#101011; --line:#1c1c1e;
  --white:#fff; --grey:#8A8A8A; --faint:#5A5A5A; --cream:#F4F4F2;
  --g1:#DACCFA; --g2:#7F95F8; --g3:#78C7EF; --g4:#A1EB1A; --g5:#A1EB1A;
  --peri:#7F95F8; --sky:#78C7EF; --lilac:#DACCFA; --lime:#A1EB1A;
  --accent:#A1EB1A; --surface:#131315; --border:rgba(255,255,255,.08);
  --spectrum:linear-gradient(115deg,var(--g1),var(--g2),var(--g3),var(--g4));
}

body{
  background:var(--black);color:var(--white);
  font-family:'Inter',sans-serif;line-height:1.5;
  overflow-x:hidden;-webkit-font-smoothing:antialiased;
}

::selection{background:var(--g4);color:#000}
::-webkit-scrollbar{width:0}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}

.mono{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--grey)}
.wrap{max-width:1320px;margin:0 auto;padding:0 clamp(20px,4vw,56px)}

.display{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;letter-spacing:-.025em;line-height:1}
.h2{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;letter-spacing:-.02em;line-height:1.08;font-size:clamp(1.7rem,3vw,2.5rem)}

nav{position:fixed;top:0;left:0;right:0;z-index:70;display:flex;align-items:center;justify-content:space-between;
  padding:22px clamp(24px,4vw,56px);transition:background .3s,padding .3s}
nav.solid{background:rgba(0,0,0,.86);backdrop-filter:blur(14px);padding-top:14px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:11px}
.brand-logo{height:26px;width:auto;display:block}
footer .brand-logo{height:26px}
.navlinks{display:flex;gap:26px}
.navlinks a{font-size:13.5px;font-weight:500;color:var(--grey);transition:color .2s}
.navlinks a:hover{color:#fff}
.navlinks a.active{color:var(--lime)}
.navcta{display:flex;align-items:center;gap:8px}

.btn{font-family:'Inter',sans-serif;font-size:13.5px;font-weight:600;letter-spacing:0;text-transform:none;
  padding:10px 16px;border-radius:9px;cursor:pointer;border:1px solid transparent;transition:.18s;
  display:inline-flex;align-items:center;gap:8px;line-height:1.2}
.btn-ghost{border-color:transparent;color:var(--grey);background:transparent}
.btn-ghost:hover{color:#fff}
.btn-grad{background:var(--accent);color:#000}
.btn-grad:hover{background:color-mix(in srgb,var(--accent) 86%,#fff)}

.btn-brand,.btn-white,.pill-ghost{font-family:'Inter',sans-serif;font-size:13.5px;font-weight:600;
  padding:12px 20px;border-radius:9px;display:inline-flex;align-items:center;gap:8px;width:max-content;
  transition:.18s;line-height:1.2;border:1px solid transparent;cursor:pointer}
.btn-brand{background:var(--accent);color:#000}
.btn-brand:hover{background:color-mix(in srgb,var(--accent) 86%,#fff)}
.btn-white{background:#fff;color:#000}
.btn-white:hover{background:#e9e9e9}
.pill-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.2)}
.pill-ghost:hover{border-color:var(--lime);color:var(--lime)}

.chip-dark{font-family:'Inter',sans-serif;font-size:12px;font-weight:500;color:#d6d6d6;
  background:rgba(18,18,20,.8);border:1px solid rgba(255,255,255,.14);padding:6px 11px;border-radius:7px;
  display:inline-flex;align-items:center;gap:7px;white-space:nowrap;line-height:1.3}

.kicker{font-size:13px;font-weight:600;color:var(--lime);margin-bottom:18px;display:block}
.phead{padding:clamp(130px,20vh,200px) 0 clamp(36px,6vh,64px)}
.phead h1{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;letter-spacing:-.03em;line-height:1;font-size:clamp(2.4rem,6vw,4.4rem)}
.phead p{margin-top:20px;max-width:50ch;color:var(--grey);font-size:16px;line-height:1.6}

footer{border-top:1px solid var(--line);padding:64px 0 60px;background:var(--black)}
.fgrid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px}
.fbrand p{color:var(--grey);font-size:14px;max-width:32ch;margin-top:16px;line-height:1.6}
.fgrid .col h6{font-size:13px;font-weight:600;color:#fff;margin-bottom:14px}
.fgrid .col a{display:block;color:var(--grey);font-size:13.5px;margin-bottom:10px;transition:color .2s}
.fgrid .col a:hover{color:#fff}
.fend{display:flex;justify-content:space-between;align-items:center;margin-top:52px;padding-top:22px;border-top:1px solid var(--line);flex-wrap:wrap;gap:14px}
.fend .mono{font-family:'Inter',sans-serif;font-size:12.5px;color:var(--faint)}

.reveal{opacity:0;transform:translateY(12px);transition:opacity .55s ease,transform .55s ease}
.reveal.in{opacity:1;transform:none}

.navtoggle{display:none;width:40px;height:40px;flex:none;border:1px solid #2a2a2c;border-radius:9px;
  background:transparent;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.navtoggle span{display:block;width:18px;height:1.5px;background:#fff;border-radius:2px;transition:.3s}
.navmenu{display:contents}
@media(max-width:1024px){
  .navtoggle{display:flex}
  nav.open{background:rgba(0,0,0,.97);backdrop-filter:blur(18px)}
  .navmenu{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;
    background:rgba(0,0,0,.97);backdrop-filter:blur(18px);border-bottom:1px solid var(--line);
    padding:10px clamp(20px,5vw,40px) 24px}
  nav.open .navmenu{display:flex}
  .navmenu .navlinks{display:flex;flex-direction:column;align-items:stretch;gap:0}
  .navmenu .navlinks a{padding:14px 2px;font-size:15px;border-bottom:1px solid var(--line)}
  .navmenu .navcta{display:flex;gap:12px;margin-top:18px}
  .navmenu .navcta .btn{flex:1;justify-content:center;padding:13px 16px}
  nav.open .navtoggle span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
  nav.open .navtoggle span:nth-child(2){opacity:0}
  nav.open .navtoggle span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
}

@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}
@media(max-width:860px){.fgrid{grid-template-columns:1fr 1fr}}
@media(max-width:720px){nav{padding:16px 20px}nav.solid{padding-top:12px;padding-bottom:12px}
  .phead{padding:clamp(100px,16vh,140px) 0 clamp(28px,5vh,60px)}}
@media(max-width:560px){.fgrid{grid-template-columns:1fr;gap:30px}}

.tint-lilac{--tint:var(--lilac)}.tint-periwinkle{--tint:var(--peri)}.tint-sky{--tint:var(--sky)}.tint-lime{--tint:var(--lime)}
.plate{display:inline-flex;align-items:center;gap:6px;width:max-content;padding:5px 10px;border-radius:7px;
  font-family:'Inter',sans-serif;font-size:12.5px;font-weight:600;line-height:1.2;color:#000;background:var(--lime)}

.banner-kick,.gv-kick,.fidx,.widx,.stc,.den,.ablbl{font-weight:600;color:var(--lime)}
.lw{font-style:normal;color:var(--lime)}

.closing-panel,.closing-panel.banner{border:0;border-radius:20px;
  background:linear-gradient(115deg,#fff 0%,#eaf8c6 30%,var(--lime) 68%);background-size:160% 160%;background-position:0% 50%;
  animation:gv-spectrum 9s ease-in-out infinite alternate}
@keyframes gv-spectrum{to{background-position:100% 50%}}
.closing-panel::before,.closing-panel::after{content:"";position:absolute;z-index:1;border-radius:50%;pointer-events:none;will-change:transform}
.closing-panel::before{width:46vw;height:46vw;max-width:620px;max-height:620px;left:-12%;top:-40%;background:rgba(255,255,255,.55);animation:gv-drift-a 14s ease-in-out infinite alternate}
.closing-panel::after{width:34vw;height:34vw;max-width:460px;max-height:460px;right:-8%;bottom:-45%;background:rgba(161,235,26,.75);animation:gv-drift-b 11s ease-in-out infinite alternate}
@keyframes gv-drift-a{to{transform:translate(18%,22%)}}
@keyframes gv-drift-b{to{transform:translate(-22%,-26%)}}
.closing-panel .banner-center{z-index:3}
.closing-cta a{transition:transform .2s ease,background .18s,border-color .18s}
.closing-cta a:hover{transform:translateY(-2px)}
@media(prefers-reduced-motion:reduce){.closing-panel,.closing-panel::before,.closing-panel::after{animation:none}.closing-cta a:hover{transform:none}}
.closing-panel .banner-center h2{color:#000;font-size:clamp(2rem,4.2vw,3.4rem);letter-spacing:-.03em}
.closing-panel .banner-center p{color:rgba(0,0,0,.72);font-size:16px}
.closing-panel .banner-kick{display:inline-flex;color:var(--lime);background:#000;padding:5px 11px;border-radius:7px;font-size:12.5px}
.closing-panel .btn-white,.closing-panel .btn-brand{background:#000;color:#fff}
.closing-panel .btn-white:hover,.closing-panel .btn-brand:hover{background:#222}
.closing-panel .pill-ghost{color:#000;border-color:rgba(0,0,0,.4)}
.closing-panel .pill-ghost:hover{border-color:#000;color:#000}
