/* Grove — landing styles. Palette: void black, bone white, ember accent, moss + gold as supporting light. */
:root{
  --void:#050506; --void-2:#0b0b0d; --bone:#F5F6F3; --dust:#9AA0A8; --dust-2:#6C727B;
  --ember:#FF6B4A; --ember-deep:#E0522F; --moss:#34D399; --gold:#FFC24D;
  --line:rgba(245,246,243,0.09); --line-strong:rgba(245,246,243,0.18);
  --ease-out:cubic-bezier(.16,1,.3,1); --ease-spring:cubic-bezier(.2,.9,.3,1.3);
}
*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; scrollbar-gutter:stable; }
body{
  background:var(--void); color:var(--bone);
  font-family:'Inter',system-ui,sans-serif; font-weight:400;
  -webkit-font-smoothing:antialiased; overflow-x:clip; overflow-anchor:none;
}
a{ color:inherit; text-decoration:none; }
img,svg{ display:block; }
::selection{ background:var(--ember); color:var(--void); }
:focus-visible{ outline:2px solid var(--ember); outline-offset:3px; border-radius:4px; }
.skip-link{ position:absolute; left:-999px; top:8px; z-index:20000; background:var(--bone); color:var(--void); padding:8px 12px; border-radius:6px; font-size:13px; }
.skip-link:focus{ left:8px; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
}

.wrap{ max-width:1180px; margin:0 auto; padding:0 28px; }
@media (max-width:600px){ .wrap{ padding:0 20px; } }

/* ---------- Layered backgrounds ---------- */
#webgl-bg{ position:fixed; inset:0; z-index:0; display:block; width:100%; height:100%; background:var(--void); }
.vignette{ position:fixed; inset:0; z-index:1; pointer-events:none;
  background:radial-gradient(ellipse 90% 80% at 50% 45%, transparent 35%, rgba(5,5,6,.72) 100%); }
.grain{ position:fixed; inset:0; z-index:9998; pointer-events:none; opacity:.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

.shot-label{ position:fixed; top:92px; left:28px; z-index:6; font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--dust-2); pointer-events:none; }
@media (max-width:800px){ .shot-label{ display:none; } }

/* ---------- Preloader ---------- */
.preloader{ position:fixed; inset:0; z-index:10000; background:var(--void); display:flex; align-items:center; justify-content:center; transition:opacity .9s ease, visibility .9s; }
.preloader-hide{ opacity:0; visibility:hidden; pointer-events:none; }
.preloader-logo{ font-family:'JetBrains Mono',monospace; font-weight:600; font-size:14px; letter-spacing:.3em; color:var(--bone); margin-bottom:26px; display:flex; align-items:center; justify-content:center; gap:10px; }
.preloader-barwrap{ width:220px; height:1px; background:var(--line); margin:0 auto 16px; overflow:hidden; }
.preloader-bar{ height:100%; width:0%; background:var(--ember); box-shadow:0 0 8px var(--ember); }
.preloader-pctwrap{ font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--dust); letter-spacing:.05em; text-align:center; }
#preloader-pct{ color:var(--bone); }

/* ---------- Custom cursor ---------- */
.cursor-dot{ position:fixed; top:0; left:0; width:6px; height:6px; margin:-3px 0 0 -3px; border-radius:50%; background:var(--ember); pointer-events:none; z-index:9999; opacity:0; transition:opacity .3s; }
.cursor-ring{ position:fixed; top:0; left:0; width:0; height:0; pointer-events:none; z-index:9999; }
.cursor-ring-inner{ position:absolute; top:-18px; left:-18px; width:36px; height:36px; border-radius:50%; border:1px solid var(--bone); opacity:0; transition:opacity .3s, transform .25s, border-color .25s; }
body.cursor-visible .cursor-dot{ opacity:1; }
body.cursor-visible .cursor-ring-inner{ opacity:.45; }
body.cursor-visible.cursor-hovering .cursor-ring-inner{ opacity:.9; transform:scale(1.7); border-color:var(--ember); }
body.custom-cursor-active, body.custom-cursor-active *{ cursor:none !important; }

/* ---------- Nav ---------- */
.site-header{ position:fixed; top:0; left:0; right:0; z-index:50; background:linear-gradient(180deg, rgba(5,5,6,.9), rgba(5,5,6,0)); }
.nav{ display:flex; align-items:center; justify-content:space-between; padding:20px 28px; max-width:1180px; margin:0 auto; gap:16px; }
.logo{ display:flex; align-items:center; gap:9px; font-family:'JetBrains Mono',monospace; font-weight:600; font-size:15px; letter-spacing:.06em; }
.logo-mark{ width:8px; height:8px; border-radius:50%; background:var(--ember); box-shadow:0 0 10px 3px rgba(255,107,74,.65); flex-shrink:0; }
.nav-links{ display:flex; gap:30px; font-family:'JetBrains Mono',monospace; font-size:12.5px; color:var(--dust); text-transform:uppercase; letter-spacing:.04em; }
.nav-links a{ transition:color .2s; }
.nav-links a:hover{ color:var(--bone); }
.nav-right{ display:flex; align-items:center; gap:10px; }
.nav-cta{ font-family:'Inter',sans-serif; font-size:13px; font-weight:600; padding:10px 20px; border-radius:100px; background:var(--ember); color:var(--void); transition:transform .25s var(--ease-spring), box-shadow .2s; display:inline-flex; gap:6px; }
.nav-cta:hover{ box-shadow:0 8px 24px rgba(255,107,74,.35); }
.nav-burger{ display:none; width:40px; height:40px; border-radius:50%; border:1px solid var(--line-strong); background:transparent; cursor:pointer; flex-direction:column; align-items:center; justify-content:center; gap:5px; }
.nav-burger span{ width:16px; height:1.5px; background:var(--bone); transition:transform .3s, opacity .3s; }
.nav-burger[aria-expanded="true"] span:first-child{ transform:translateY(3.25px) rotate(45deg); }
.nav-burger[aria-expanded="true"] span:last-child{ transform:translateY(-3.25px) rotate(-45deg); }
.mobile-menu{ position:fixed; inset:0; z-index:49; background:rgba(5,5,6,.96); backdrop-filter:blur(18px); display:flex; flex-direction:column; justify-content:center; gap:6px; padding:0 28px; }
.mobile-menu[hidden]{ display:none; }
.mobile-menu a{ font-family:'Bricolage Grotesque',sans-serif; font-size:34px; font-weight:600; padding:12px 0; border-bottom:1px solid var(--line); }
.mobile-menu-cta{ color:var(--ember); }
@media (max-width:820px){ .nav-links, .nav-cta{ display:none; } .nav-burger{ display:flex; } }

/* ---------- Hero ---------- */
.hero{ position:relative; z-index:2; min-height:100svh; padding:130px 0 60px; display:flex; flex-direction:column; justify-content:center; }
.hero-grid{ display:grid; grid-template-columns:minmax(0, 640px) 1fr; align-items:center; gap:40px; width:100%; }
.hero-figure-space{ min-height:1px; }
.hero-inner{ position:relative; }
.eyebrow{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--ember); display:inline-flex; align-items:center; gap:8px; margin-bottom:22px; }
.eyebrow::before{ content:''; width:6px; height:6px; border-radius:50%; background:var(--ember); box-shadow:0 0 8px 2px var(--ember); flex-shrink:0; }
.hero-title{ font-family:'Bricolage Grotesque',sans-serif; font-weight:600; font-size:clamp(40px, 5.9vw, 82px); line-height:.98; letter-spacing:-.025em; margin-bottom:22px; text-shadow:0 2px 24px rgba(5,5,6,.85); text-wrap:balance; }
.scramble-line{ display:inline-block; min-height:1em; }
.scramble-line.accent{ color:var(--ember); }
.hero-sub{ font-size:16px; color:var(--dust); max-width:470px; margin:0 0 30px; line-height:1.68; text-shadow:0 2px 20px rgba(5,5,6,.85); }
.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:28px; }
.btn{ font-family:'Inter',sans-serif; font-size:14px; font-weight:600; padding:14px 28px; border-radius:100px; display:inline-flex; align-items:center; gap:8px; cursor:pointer; transition:transform .25s var(--ease-spring), box-shadow .2s, background .2s, border-color .2s; }
.btn-primary{ background:var(--ember); color:var(--void); border:1px solid var(--ember); }
.btn-primary:hover{ box-shadow:0 14px 34px rgba(255,107,74,.4); }
.btn-ghost{ background:rgba(5,5,6,.35); border:1px solid var(--line-strong); color:var(--bone); backdrop-filter:blur(8px); }
.btn-ghost:hover{ border-color:var(--bone); background:rgba(245,246,243,.06); }
.hero-facts{ list-style:none; display:flex; flex-wrap:wrap; gap:8px 22px; font-family:'JetBrains Mono',monospace; font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--dust); }
.hero-facts b{ color:var(--bone); font-weight:600; }
.scroll-cue{ position:absolute; bottom:20px; left:50%; transform:translateX(-50%); z-index:5; font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--dust-2); display:flex; flex-direction:column; align-items:center; gap:8px; }
.scroll-cue-line{ width:1px; height:26px; background:linear-gradient(180deg, var(--dust), transparent); animation:cue-pulse 2s ease-in-out infinite; }
@keyframes cue-pulse{ 0%,100%{ opacity:.3; } 50%{ opacity:1; } }
@media (max-width:900px){
  .hero{ padding-top:120px; justify-content:flex-end; min-height:100svh; }
  .hero-grid{ grid-template-columns:1fr; }
  .hero-figure-space{ display:none; }
  .hero-inner::before{ content:''; position:absolute; inset:-40px -20px -30px; z-index:-1; background:radial-gradient(ellipse 80% 70% at 50% 60%, rgba(5,5,6,.78), transparent 75%); pointer-events:none; }
}

/* ---------- Ticker ---------- */
.ticker{ position:relative; z-index:2; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:15px 0; overflow:hidden; white-space:nowrap; background:rgba(5,5,6,.45); }
.ticker-track{ display:inline-flex; animation:ticker-scroll 40s linear infinite; }
.ticker:hover .ticker-track{ animation-play-state:paused; }
.ticker-track span{ font-family:'JetBrains Mono',monospace; font-size:12.5px; color:var(--dust); padding:0 24px; display:inline-flex; align-items:center; gap:24px; letter-spacing:.03em; }
.ticker-track span::after{ content:'◆'; color:var(--ember); font-size:9px; }
@keyframes ticker-scroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ---------- Glass ---------- */
.glass{ background:rgba(11,11,13,.55); border:1px solid rgba(245,246,243,.10); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border-radius:20px; }

/* ---------- Features ---------- */
.features{ position:relative; z-index:2; padding:120px 0 70px; }
.section-head{ text-align:center; max-width:560px; margin:0 auto 50px; }
.section-head .eyebrow{ justify-content:center; }
.section-title{ font-family:'Bricolage Grotesque',sans-serif; font-weight:600; font-size:clamp(30px, 4.2vw, 46px); letter-spacing:-.02em; margin:14px 0 12px; text-shadow:0 2px 20px rgba(5,5,6,.7); }
.section-sub{ color:var(--dust); font-size:15px; line-height:1.65; }
.feature-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
@media (max-width:900px){ .feature-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .feature-grid{ grid-template-columns:1fr; } }
.feature-card{ padding:28px 22px; transition:border-color .25s, background .25s, transform .3s var(--ease-out); will-change:transform; }
.feature-card:hover{ border-color:rgba(255,107,74,.4); background:rgba(11,11,13,.7); }
.feature-icon{ width:24px; height:24px; color:var(--ember); margin-bottom:18px; }
.feature-title{ font-family:'Bricolage Grotesque',sans-serif; font-weight:600; font-size:17px; margin-bottom:9px; }
.feature-desc{ font-size:13.5px; color:var(--dust); line-height:1.6; }

/* ---------- Spotlight ---------- */
.spotlight{ position:relative; z-index:2; padding:80px 0 100px; }
.spotlight-frame{ max-width:780px; margin:0 auto; overflow:hidden; will-change:transform; }
.spotlight-bar{ display:flex; align-items:center; gap:8px; padding:14px 18px; border-bottom:1px solid var(--line); }
.sb-dot{ width:9px; height:9px; border-radius:50%; background:rgba(245,246,243,.15); }
.sb-label{ margin-left:8px; font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--dust); letter-spacing:.04em; }
.spotlight-body{ padding:28px 28px 32px; }
.sp-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; gap:12px; }
.sp-title{ font-family:'Bricolage Grotesque',sans-serif; font-weight:600; font-size:17px; display:flex; align-items:center; gap:10px; }
.sp-swatch{ width:12px; height:12px; border-radius:4px; background:var(--ember); box-shadow:0 0 10px rgba(255,107,74,.6); }
.sp-streak{ font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--ember); white-space:nowrap; }
.sp-heatmap{ display:flex; gap:3px; overflow-x:auto; padding-bottom:6px; scrollbar-width:none; }
.sp-col{ display:flex; flex-direction:column; gap:3px; }
.sp-cell{ width:11px; height:11px; border-radius:3px; }
.sp-cell.l0{ background:rgba(245,246,243,.06); }
.sp-cell.l1{ background:rgba(255,107,74,.28); }
.sp-cell.l2{ background:rgba(255,107,74,.5); }
.sp-cell.l3{ background:rgba(255,107,74,.75); }
.sp-cell.l4{ background:var(--ember); box-shadow:0 0 6px rgba(255,107,74,.6); }
.sp-stats{ display:flex; gap:30px; margin-top:22px; padding-top:20px; border-top:1px solid var(--line); flex-wrap:wrap; }
.sp-stat b{ display:block; font-family:'Bricolage Grotesque',sans-serif; font-size:22px; }
.sp-stat span{ font-family:'JetBrains Mono',monospace; font-size:9.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--dust); }
.spotlight-note{ text-align:center; margin-top:16px; font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--dust-2); }

/* ---------- How it works ---------- */
.how{ position:relative; z-index:2; padding:80px 0 100px; }
.how-row{ list-style:none; display:grid; grid-template-columns:repeat(3,1fr); position:relative; }
@media (max-width:760px){ .how-row{ grid-template-columns:1fr; gap:40px; } .how-connector{ display:none; } }
.how-connector{ position:absolute; top:19px; left:16.5%; right:16.5%; height:1px; overflow:hidden; background:linear-gradient(90deg, transparent, rgba(245,246,243,.18) 15%, rgba(245,246,243,.18) 85%, transparent); }
.how-connector::after{ content:''; position:absolute; top:0; left:-30%; width:30%; height:100%; background:linear-gradient(90deg, transparent, var(--ember), transparent); animation:connector-sweep 3.2s ease-in-out infinite; }
@keyframes connector-sweep{ 0%{ left:-30%; } 100%{ left:100%; } }
.how-step{ text-align:center; padding:0 20px; position:relative; z-index:1; }
.how-num{ width:38px; height:38px; border-radius:50%; background:var(--void); border:1px solid var(--ember); color:var(--ember); font-family:'JetBrains Mono',monospace; font-weight:600; font-size:13px; display:flex; align-items:center; justify-content:center; margin:0 auto 20px; box-shadow:0 0 16px -2px rgba(255,107,74,.4); }
.how-title{ font-family:'Bricolage Grotesque',sans-serif; font-weight:600; font-size:18px; margin-bottom:9px; }
.how-desc{ font-size:14px; color:var(--dust); line-height:1.65; max-width:260px; margin:0 auto; }

/* ---------- Facts banner ---------- */
.stat-banner{ position:relative; z-index:2; padding:80px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(5,5,6,.35); }
.stat-banner-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; text-align:center; }
@media (max-width:760px){ .stat-banner-grid{ grid-template-columns:repeat(2,1fr); } }
.stat-big{ font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:clamp(34px, 4.6vw, 52px); text-shadow:0 2px 20px rgba(5,5,6,.7); font-variant-numeric:tabular-nums; }
.stat-big-label{ font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--dust); margin-top:8px; line-height:1.5; }
.stat-note{ text-align:center; max-width:560px; margin:40px auto 0; font-size:13.5px; color:var(--dust); line-height:1.65; }

/* ---------- CTA ---------- */
.cta{ position:relative; z-index:2; padding:140px 28px 160px; text-align:center; }
.cta-inner{ max-width:660px; margin:0 auto; }
.cta-inner .eyebrow{ justify-content:center; }
.cta-title{ font-family:'Bricolage Grotesque',sans-serif; font-weight:600; font-size:clamp(34px, 5.6vw, 64px); line-height:1.02; letter-spacing:-.025em; margin:16px 0; text-shadow:0 2px 24px rgba(5,5,6,.85); }
.cta-title .accent{ color:var(--ember); }
.cta-sub{ font-size:15.5px; color:var(--dust); margin-bottom:34px; line-height:1.65; text-shadow:0 2px 20px rgba(5,5,6,.85); }

/* ---------- Footer ---------- */
.site-footer{ position:relative; z-index:2; border-top:1px solid var(--line); padding:40px 0; background:rgba(5,5,6,.5); }
.footer-row{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; }
.footer-links{ display:flex; gap:22px; font-family:'JetBrains Mono',monospace; font-size:12.5px; color:var(--dust); text-transform:uppercase; letter-spacing:.03em; }
.footer-links a:hover{ color:var(--bone); }
.footer-copy{ font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--dust-2); }
.footer-copy a{ color:var(--dust); border-bottom:1px solid var(--line-strong); }

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