
:root{
  --bg:#061a33; --panel:#0a2444; --muted:#93a4b7; --text:#eaf1fb;
  --brand:#ffc83d; --accent:#0b5ccb; --radius:18px;
  --shadow-xl: 0 30px 60px -15px rgba(0,0,0,.6), 0 18px 36px -18px rgba(24,38,56,.6);
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;scroll-behavior:smooth;background:var(--bg);color:var(--text);font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

/* Progress bar */
.progress{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,var(--brand),var(--accent));width:0;z-index:1000}

/* Nav */
nav{position:sticky;top:0;backdrop-filter:saturate(140%) blur(10px);background:linear-gradient(180deg,rgba(6,26,51,.9),rgba(6,26,51,.65));z-index:999;border-bottom:1px solid rgba(255,255,255,.06)}
.navwrap{max-width:1200px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:12px 20px}
.brand{display:flex;align-items:center;gap:12px}
.logoimg{width:34px;height:34px;border-radius:0px;object-fit:cover;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.06) inset}
.brand h1{font-size:16px;letter-spacing:.4px;margin:0;font-weight:700}
.navlinks{display:flex;gap:12px;align-items:center}
.navlinks a{font-size:14px;color:#cfe0f8;padding:8px 12px;border-radius:999px}
.navlinks a:hover{background:rgba(255,255,255,.06)}
.navlinks a.active{color:#061a33;background:linear-gradient(135deg,var(--brand),#ffe7a1);font-weight:800}

/* Theme toggle */
.theme-toggle{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(0,0,0,.25);padding:8px 12px;border-radius:999px;background:var(--panel);cursor:pointer;font-size:14px;font-weight:600;color:var(--text);transition:all .25s}
.theme-toggle:hover{background:var(--brand);color:#0a1a12}
.theme-toggle .emoji{font-size:16px}

/* Hero */
header.hero{position:relative;overflow:hidden}
.wrap{max-width:1200px;margin:auto;padding:80px 20px}
.hero .grid{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center}
.eyebrow{color:var(--brand);font-weight:700;letter-spacing:1px;text-transform:uppercase;font-size:12px}
h2.display{font-size:52px;line-height:1.05;margin:.3em 0 .2em}
p.lead{color:#cbd7e6;font-size:18px;line-height:1.7}
.badges{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0 30px}
.badge{border:1px solid rgba(255,255,255,.08);color:#d5e4f5;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));padding:8px 12px;border-radius:999px}
.ctarow{display:flex;gap:12px;align-items:center;margin-top:6px}
.btn{padding:12px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02));color:#eaf2fa;font-weight:700}
.btn.primary{background:linear-gradient(135deg,var(--brand),#ffe7a1 80%);color:#0a1a12;border-color:transparent}
.trust{display:flex;gap:26px;align-items:center;margin-top:24px;color:var(--muted);font-size:13px}

/* Hero FX */
.fx-wrap{position:relative;overflow:hidden}
.fx-canvas{position:absolute;inset:0;z-index:-1;filter:contrast(110%) saturate(110%)}

/* Terminal */
.mock{background:linear-gradient(180deg,rgba(11,61,130,.12),rgba(255,200,61,.10));border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);box-shadow:var(--shadow-xl);padding:14px}
.terminal{background:#08101a;border-radius:14px;padding:16px;min-height:320px;font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;color:#cde8ff;border:1px solid rgba(255,255,255,.06);position:relative}
.term-head{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.dot{width:10px;height:10px;border-radius:50%}.d1{background:#ff5f56}.d2{background:#ffbd2e}.d3{background:#27c93f}
.scanline{position:absolute;inset:40px 16px auto 16px;height:1px;background:linear-gradient(90deg,transparent,rgba(73,255,168,.8),transparent);animation:scan 6s linear infinite}
.type{white-space:pre-wrap;line-height:1.6}

/* Sections */
section{scroll-margin-top:70px}
.section{padding:100px 20px}
.section h3{font-size:36px;margin:0 0 10px}
.section p.sub{color:var(--muted);max-width:820px}

/* Cards */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}
.card{background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);padding:20px;position:relative;overflow:hidden;transform:translateY(16px);opacity:0}
.card.in-view{transform:translateY(0);opacity:1;transition:.8s cubic-bezier(.2,.8,.2,1)}
.card:hover{box-shadow:var(--shadow-xl);transform:translateY(-4px)}
.card h4{margin:8px 0;font-size:20px}
.pill{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:#cfe9ff;border:1px solid rgba(11,92,203,.35);padding:6px 10px;border-radius:999px;background:linear-gradient(180deg,rgba(11,92,203,.15),rgba(11,92,203,.05))}

/* Process, Metrics */
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:28px}
.step{padding:18px;border-radius:16px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03));transform:translateY(16px);opacity:0}
.step.in-view{transform:translateY(0);opacity:1;transition:.75s cubic-bezier(.2,.8,.2,1)}
.step h5{margin:8px 0 6px}
.num{font-weight:800;color:var(--brand);font-size:24px}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:24px}
.metric{background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:18px;text-align:center}
.metric h6{font-size:34px;margin:6px 0}
.metric p{color:var(--muted);margin:0}

/* Cases */
.cases{display:grid;grid-template-columns:1.3fr .7fr;gap:16px;margin-top:30px}
.case{border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.08);position:relative}
.case .body{padding:20px;background:linear-gradient(180deg,rgba(6,26,51,.0),rgba(6,26,51,.85) 35%,rgba(6,26,51,.95));position:absolute;inset:auto 0 0 0}

/* CTA band */
.cta-band{background:radial-gradient(120% 120% at 0% 0%,rgba(11,92,203,.16),transparent 60%),radial-gradient(120% 120% at 100% 100%,rgba(255,200,61,.18),transparent 60%);border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}

/* Footer */
footer{padding:40px 20px;color:#9bb0c8}
.foot{max-width:1200px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:20px}
.mini{font-size:12px}

/* Reveal */
.reveal{transform:translateY(18px);opacity:0}
.reveal.in-view{transform:translateY(0);opacity:1;transition:.8s cubic-bezier(.2,.8,.2,1)}

/* Light mode */
:root.light{--bg:#ffffff;--panel:#f6f9ff;--muted:#42556e;--text:#0a1a2f;--brand:#ffbf26;--accent:#0b5ccb;--shadow-xl:0 30px 60px -15px rgba(0,0,0,.18),0 18px 36px -18px rgba(0,0,0,.18)}
:root.light body{color:var(--text)}
:root.light nav{background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(255,255,255,.65));border-bottom:1px solid rgba(0,0,0,.06)}
:root.light .navlinks a{color:#1b2a3b}
:root.light .navlinks a.active{color:#fff;background:var(--accent)}
:root.light .badge{color:#0c1522;border-color:rgba(0,0,0,.12);background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.015))}
:root.light .pill{color:#0c1522;border-color:rgba(0,0,0,.2);background:linear-gradient(180deg,rgba(0,0,0,.045),rgba(0,0,0,.02))}
:root.light .card h4, :root.light .step h5, :root.light .metric h6, :root.light h2.display, :root.light h3{color:#0c1522}
:root.light input, :root.light textarea, :root.light select{background:#f6f9fc !important;color:#0c1522 !important;border-color:rgba(0,0,0,.18) !important}
:root.light ::placeholder{color:#6b7c90}
:root.light .btn{color:#0c1522;border-color:rgba(0,0,0,.12)}
:root.light .btn.primary{color:#0a1a12}
:root.light .progress{box-shadow:0 1px 0 0 rgba(0,0,0,.06) inset}

/* Responsive */
@media (max-width: 980px){
  .hero .grid{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
  .process{grid-template-columns:1fr 1fr}
  .metrics{grid-template-columns:1fr 1fr}
  .cases{grid-template-columns:1fr}
  .navlinks{gap:8px}
}
@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important}
  .scanline{display:none}
}


/* ===== Mobile Enhancements ===== */

.menu-btn .lines{width:18px;height:12px;position:relative;display:inline-block}
.menu-btn .lines::before, .menu-btn .lines::after, .menu-btn .lines span{
  content:""; position:absolute; left:0; right:0; height:2px; background:currentColor; border-radius:2px;
}
.menu-btn .lines::before{top:0}
.menu-btn .lines span{top:5px}
.menu-btn .lines::after{bottom:0}

.mobile-nav{/* v30 zindex */
  z-index: 2000;

  position:fixed; inset:0; z-index:1100;
  background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.55)), var(--bg);
  backdrop-filter: blur(6px);
  display:none; opacity:0; transform:translateY(-8px);
  transition:opacity .25s ease, transform .25s ease;
}
.mobile-nav.open{display:block !important; opacity:1; transform:translateY(0); visibility:visible}
.mobile-nav .sheet{
  position:absolute; top:56px; left:12px; right:12px;
  background:var(--panel); border:1px solid rgba(255,255,255,.08);
  border-radius:16px; padding:16px; box-shadow: var(--shadow-xl);
}
.mobile-nav a, .mobile-nav button{
  display:block; width:100%; text-align:left;
  padding:12px 14px; border-radius:12px; margin-bottom:8px;
  color:var(--text); border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));
}
.mobile-nav a.active{background:linear-gradient(135deg,var(--brand),#ffe7a1); color:#061a33; font-weight:800}
.mobile-nav .close{
  display:inline-flex; align-items:center; gap:8px;
  background:none; border:none; color:var(--text); font-weight:700; padding:8px 0; margin-bottom:8px; cursor:pointer;
}

body.no-scroll{overflow:hidden}

/* Typography & layout tweaks for small screens */
@media (max-width: 980px){
  .menu-btn{display:none; align-items:center; justify-content:center; width:56px}
  .navlinks{display:none}
}
@media (max-width: 720px){
  .wrap{padding:56px 16px}
  h2.display{font-size:clamp(28px, 5.5vw, 40px)}
  .eyebrow{font-size:11px}
  p.lead{font-size:16px}
  .ctarow{flex-direction:column; align-items:stretch}
  .metrics{grid-template-columns:1fr}
  .process{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
  .cases{grid-template-columns:1fr}
  .btn, .theme-toggle, .menu-btn{display:none; align-items:center; justify-content:center; width:56px}
  .navwrap{padding:10px 12px}
  .section{padding:64px 16px}
  .terminal{min-height:220px}
  .fx-canvas{min-height:280px}
  form[aria-label]{grid-template-columns:1fr !important}
}


.menu-btn .lines{width:20px;height:14px}

/* v19 force open */
.mobile-nav{/* v30 zindex */
  z-index: 2000;
visibility:hidden}


.menu-btn .lines{display:inline-block; position:relative; width:20px; height:14px}

/* sr-only for accessibility (screen-reader only) */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}


/* --- Frosted overlay for hero background --- */
.fx-wrap{position:relative;overflow:hidden;isolation:isolate}
.fx-canvas{position:absolute;inset:0;z-index:-2;filter:contrast(110%) saturate(110%)}
.fx-frost{position:absolute;inset:0;z-index:-1;backdrop-filter: blur(8px) saturate(120%);}
.fx-frost::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(60% 80% at 10% 10%, rgba(11,92,203,.22), transparent 60%),
    radial-gradient(80% 60% at 90% 90%, rgba(255,200,61,.18), transparent 60%);
  pointer-events:none;
}
header.hero{min-height:420px}
@media (max-width:720px){ header.hero{min-height:340px} }

/* Blur removed per request */
.fx-frost{display:none !important; backdrop-filter:none !important;}

/* v25 hamburger visibility */
@media (min-width: 981px){
  .menu-btn{display:none !important}
  .mobile-nav{/* v30 zindex */
  z-index: 2000;
display:none !important}
}
@media (max-width: 980px){
  .menu-btn{display:inline-flex}
  .navlinks{display:none}
}

/* v26 hamburger polish */
.menu-btn{
  display:none;
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  background:transparent; border:none; padding:10px;
  border-radius:12px; color:var(--text);
  box-shadow:0 0 0 1px rgba(255,255,255,.12) inset, 0 8px 18px -12px rgba(0,0,0,.5);
  transition:background .2s ease, box-shadow .2s ease, transform .12s ease;
}
.menu-btn:hover{ background:rgba(255,255,255,.06) }
.menu-btn:active{ transform:translateY(1px) }
.menu-btn:focus-visible{ outline:2px solid var(--brand); outline-offset:2px }

.menu-btn .lines{ width:22px; height:16px; position:relative; display:inline-block }
.menu-btn .lines::before, .menu-btn .lines::after, .menu-btn .lines span{
  content:""; position:absolute; left:0; right:0; height:2px; background:currentColor; border-radius:2px;
}
.menu-btn .lines::before{ top:0 }
.menu-btn .lines span{ top:7px }
.menu-btn .lines::after{ bottom:0 }

:root.light .menu-btn{ box-shadow:0 0 0 1px rgba(0,0,0,.16) inset; color:#1b2a3b }
:root.light .menu-btn:hover{ background:rgba(0,0,0,.05) }

/* Keep hamburger only on mobile */
@media (max-width: 980px){ .menu-btn{display:inline-flex; align-items:center; justify-content:center; width:56px } }
@media (min-width: 981px){ .menu-btn{display:none !important} }

/* Hide Recent wins per request */
.recent-wins{display:none !important}


/* =======================
   Light Mode — Brand Refresh
   ======================= */
:root.light{
  --bg:#f7fbff;                 /* soft blue paper */
  --panel:#ffffff;              /* white surfaces */
  --muted:#40556e;              /* muted body text */
  --text:#0a1a2f;               /* high-contrast heading/body */
  --brand:#ffc83d;              /* logo gold */
  --accent:#0b5ccb;             /* logo blue */
  --shadow-xl: 0 24px 40px -20px rgba(11,92,203,.18), 0 14px 28px -24px rgba(0,0,0,.22);
}

/* Header/Nav in Light */
:root.light nav{
  background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(242,247,255,.88));
  border-bottom:1px solid #e3ecf8;
  box-shadow:0 6px 20px -16px rgba(11,92,203,.25);
}
:root.light .navlinks a{ color:#1c2b43 }
:root.light .navlinks a:hover{ background:#eef4ff }
:root.light .navlinks a.active{ 
  color:#082246;
  background:linear-gradient(140deg,#ffd76b,#ffc83d);
  box-shadow:0 8px 18px -12px rgba(255,200,61,.65);
}
:root.light .btn.primary{
  background:linear-gradient(135deg,#ffd76b,#ffc83d);
  color:#082246;
  border-color:transparent;
  box-shadow:0 10px 26px -12px rgba(255,200,61,.55);
}
:root.light .btn{ 
  color:#082246; 
  border-color:#d7e4f6;
  background:linear-gradient(180deg,#ffffff,#f6f9ff);
}

/* Hero typography */
:root.light h2.display{ color:#082246 }
:root.light p.lead{ color:#41556e }

/* Panels / Cards / Steps / Metrics */
:root.light .card,
:root.light .step,
:root.light .metric{
  background:#ffffff;
  border:1px solid #e3ecf8;
  box-shadow:0 10px 28px -16px rgba(11,92,203,.15);
}
:root.light .metric p,
:root.light .step p,
:root.light .card p{ color:#41556e }
:root.light .metric h6{ color:#082246 }

/* Pills & badges */
:root.light .pill{
  color:#0a1a2f;
  border-color:rgba(11,92,203,.35);
  background:linear-gradient(180deg,rgba(11,92,203,.08),rgba(11,92,203,.03));
}
:root.light .badge{
  color:#0a1a2f;
  border-color:#d7e4f6;
  background:linear-gradient(180deg,#ffffff,#f6f9ff);
}

/* Forms */
:root.light input, 
:root.light textarea, 
:root.light select{
  background:#f6f9ff !important;
  color:#0a1a2f !important;
  border:1px solid #c8d9f2 !important;
}
:root.light ::placeholder{ color:#6b7c90 }

/* Terminal stays dark in Light for contrast */
:root.light .terminal{
  background:#0e1a2a;
  color:#cde8ff;
  border-color:#0b2747;
}

/* Cases section overlay text */
:root.light .case .body{ 
  background:linear-gradient(180deg, rgba(255,255,255,0), rgba(247,251,255,.95) 50%, rgba(247,251,255,1));
}
:root.light .case .body h4{ color:#082246 }
:root.light .case .body p{ color:#40556e }

/* Mobile drawer in Light */
@media (max-width:980px){
  :root.light .mobile-nav .sheet{
    background:#ffffff;
    border:1px solid #e3ecf8;
  }
  :root.light .mobile-nav a,
  :root.light .mobile-nav button{
    color:#0a1a2f;
    background:linear-gradient(180deg,#ffffff,#f6f9ff);
    border:1px solid #e3ecf8;
  }
  :root.light .mobile-nav a.active{
    color:#082246;
    background:linear-gradient(140deg,#ffd76b,#ffc83d);
  }
}

/* Inputs in Contact/Team sections that had inline dark backgrounds get normalized */
:root.light form[aria-label] input,
:root.light form[aria-label] textarea{
  background:#f6f9ff !important;
  color:#0a1a2f !important;
  border:1px solid #c8d9f2 !important;
}

/* Progress bar subtle in light */
:root.light .progress{ 
  box-shadow:none; 
  background:linear-gradient(90deg,#0b5ccb,#ffc83d);
}

/* v30 desktop guard for drawer (Safari safe) */
@media (min-width: 981px){
  .mobile-nav, .mobile-nav.open{display:none !important; visibility:hidden !important; opacity:0 !important}
  .menu-btn{display:none !important}
}


/* v30 sr-only fix for Safari */
.sr-only{clip-path: inset(50%); clip: rect(0 0 0 0);}


/* v30 close button reset */
.mobile-nav .close{
  -webkit-appearance:none; appearance:none;
  background:transparent; border:none; padding:8px 0; margin-bottom:8px;
  color:var(--text); font-weight:700; cursor:pointer;
}


/* v30 stack links */
.mobile-nav a, .mobile-nav button{ display:block; width:100% }


/* === Utilities to avoid inline styles (WAF/CSP-friendly) === */
.form-grid{ margin-top:16px; display:grid; grid-template-columns:2fr 2fr 1fr; gap:10px; align-items:center }
.fullrow{ grid-column:1/-1 }
.card--wide{ grid-column:1/-1; padding:32px }
.founder-card h4{ font-size:26px; margin:0 0 6px }
.founder-card .role{ margin:0 0 14px; color:var(--muted) }
.founder-card p{ line-height:1.7 }
@media (max-width:720px){ .form-grid{ grid-template-columns:1fr } }
