:root{
  --bg:#0A1220; /* midnight */
  --fg:#E2E8F0; /* glacier fog */
  --muted:#97A6B8;
  --line:#1F2836; /* basalt */
  --accent:#E3A246; /* signal amber */
  --glow:#EAF2F9; /* glacier */
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:
  radial-gradient(1200px 520px at 18% 8%, rgba(59,130,246,.08),transparent),
  radial-gradient(900px 420px at 82% 20%, rgba(168,85,247,.08),transparent),
  radial-gradient(1000px 600px at 50% 92%, rgba(234,179,8,.06),transparent),
  var(--bg);
  color:var(--fg);font:16px/1.6 Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif}

.site{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 22px;position:sticky;top:0;background:linear-gradient(180deg, rgba(10,18,32,.8), rgba(10,18,32,.5) 60%, transparent);backdrop-filter:blur(8px);z-index:10}
.site .mark{display:flex;align-items:center;gap:10px;color:var(--fg);text-decoration:none;font-weight:600}
.site .mark svg{color:var(--fg)}
.nav a{color:var(--fg);text-decoration:none;margin-left:16px;opacity:.85}
.nav a:hover{opacity:1}

.hero{position:relative;display:grid;place-items:center;min-height:60vh;padding:40px 16px}
.hero-bg{position:absolute;inset:0;overflow:hidden}
.ridge{position:absolute;left:0;right:0;bottom:0;height:260px;opacity:.9;filter:drop-shadow(0 -10px 80px rgba(227,162,70,.06))}
.hero-inner{text-align:center;position:relative;z-index:1}
.hero h1{font-size: clamp(36px, 6vw, 64px);line-height:1.05;margin:0 0 10px;color:#fff;letter-spacing:.2px}
.hero .sub{font-size: clamp(16px, 2.4vw, 20px);margin:0 0 18px;color:#c7d2de}
.cta{display:flex;gap:12px;justify-content:center}
.btn{display:inline-block;border:1px solid #2b3445;border-radius:10px;padding:10px 16px;color:var(--fg);text-decoration:none;transition:.2s ease;border-color:#2a3548;background:rgba(255,255,255,.02)}
.btn:hover{transform:translateY(-1px);background:rgba(255,255,255,.04)}
.btn.primary{background:linear-gradient(180deg,#1e2635,#1a2231);border-color:#334155}

.pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:26px 16px;max-width:1100px;margin:0 auto}
.pillars .card{border:1px solid #1a2332;background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.00));border-radius:14px;padding:18px}
.pillars .icon{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:rgba(227,162,70,.12);color:var(--accent);margin-bottom:10px}
.pillars h3{margin:0 0 6px;font-size:18px;color:#f3f6fb}
.pillars p{margin:0;color:var(--muted)}

.cases{padding:22px 16px 8px;max-width:1100px;margin:0 auto}
.cases h2{font-size:20px;margin:0 0 10px;color:#f3f6fb}
.cases .grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.case{display:flex;flex-direction:column;gap:6px;border:1px solid #1a2332;border-radius:12px;padding:14px;text-decoration:none;color:var(--fg);background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.00))}
.case:hover{border-color:#263043}
.case .blip{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 6px rgba(227,162,70,.08)}
.case strong{font-weight:600}
.case em{color:var(--muted);font-style:normal}

.notes{padding:22px 16px 40px;max-width:1100px;margin:0 auto}
.notes h2{font-size:20px;margin:0 0 10px;color:#f3f6fb}
.note-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.note-list li{border:1px solid #1a2332;border-radius:10px;padding:12px}
.note-list a{color:#dbe6f5;text-decoration:none}
.note-list span{color:var(--muted)}

.foot{border-top:1px solid #1a2332;margin-top:20px;padding:18px 16px;color:#96a6ba;display:flex;gap:12px;justify-content:space-between;align-items:center}
.foot .mini a{color:#96a6ba;text-decoration:none;margin-left:12px}

@media (max-width: 860px){
  .pillars{grid-template-columns:1fr}
  .cases .grid{grid-template-columns:1fr}
  .note-list{grid-template-columns:1fr}
}

@media (prefers-reduced-motion: no-preference){
  .ridge{animation: drift 60s linear infinite alternate}
  @keyframes drift{from{transform:translateY(0)} to{transform:translateY(-2px)}}
}