/* Minimal, responsive styles with light/dark support */
:root{
  --bg:#0b0f17;
  --panel:#111827;
  --text:#e5e7eb;
  --muted:#94a3b8;
  --accent:#38bdf8;
  --outline:rgba(148,163,184,.18);
}
@media (prefers-color-scheme: light){
  :root{
    --bg:#f8fafc;
    --panel:#ffffff;
    --text:#0f172a;
    --muted:#334155;
    --outline:rgba(15,23,42,.08);
  }
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  color:var(--text);
  background:var(--bg);
}
a{color:var(--accent)}
/* Header */
.site-header{
  display:flex; justify-content:space-between; align-items:center; gap:1rem;
  padding:1rem 1.25rem; border-bottom:1px solid var(--outline);
  background:linear-gradient(0deg, rgba(56,189,248,.06), rgba(56,189,248,.06)) ,var(--panel);
  position:sticky; top:0; z-index:10;
}
.brand{display:flex; align-items:center; gap:.75rem}
.mark{
  width:40px; height:40px; display:grid; place-items:center;
  background:linear-gradient(135deg,#38bdf8,#22c55e);
  color:white; font-weight:800; border-radius:10px;
  box-shadow:0 6px 16px rgba(56,189,248,.35);
}
.name{display:flex; flex-direction:column; line-height:1.1}
.name .tagline{color:var(--muted); font-size:.9rem}
.nav a{ color:var(--text); text-decoration:none; padding:.35rem .6rem; border-radius:8px }
.nav a:hover{ background:rgba(148,163,184,.12) }
.nav a[aria-current="page"]{ background:rgba(56,189,248,.18) }
main{max-width:1000px; margin:0 auto; padding:1.5rem}
/* Hero */
.hero{ text-align:center; padding: clamp(2rem, 8vw, 4rem) 1rem 2rem; }
.hero h1{ font-size: clamp(1.8rem, 1.2rem + 2.6vw, 3rem); margin:.5rem 0 }
.hero p{ color:var(--muted); max-width:860px; margin:0 auto }
/* Sections */
.section{ padding:1rem; margin-top:1rem; background:var(--panel); border:1px solid var(--outline); border-radius:14px }
.section h2{ margin-top:0 }
.cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1rem }
.card{ padding:1rem; border:1px dashed var(--outline); border-radius:12px }
.card h3{ margin:.25rem 0 .35rem 0 }
.card ul{ margin:.5rem 0 0 1.1rem; color:var(--muted) }
.steps{ margin:.25rem 0 0 1rem; color:var(--text) }
.steps li{ margin:.35rem 0 }
.contact p{ margin:.35rem 0 }
.muted{ color:var(--muted) }
/* Footer */
.site-footer{ text-align:center; padding:1.5rem; color:var(--muted) }
/* Utilities */
.nowrap{ white-space:nowrap }