/* Minimal, clean styles for vitat.org */
:root{
  --bg:#ffffff;
  --ink:#0b0b0c;
  --sub:#53565a;
  --muted:#e9ecef;
  --brand:#0d4dff;
  --brand-ink:#0d2d88;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font:16px/1.55 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink); background:var(--bg);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}

.wrap{max-width:960px;margin:0 auto;padding:0 16px}
.small{font-size:.9rem;color:var(--sub)}

.site-header{
  position:sticky; top:0; z-index:10;
  background:#fff; border-bottom:1px solid var(--muted)
}
.site-header .wrap{display:flex; align-items:center; justify-content:space-between; height:56px}
.brand{font-weight:700; color:var(--ink); text-decoration:none; letter-spacing:.2px}
nav a{margin-left:16px; text-decoration:none; color:var(--ink)}
nav a:focus, nav a:hover{color:var(--brand)}

.hero{
  padding:56px 0 24px; border-bottom:1px solid var(--muted);
  background:linear-gradient(180deg,#f8f9fb,transparent)
}
.hero h1{margin:0 0 8px; font-size:2rem; line-height:1.2}
.hero .sub{color:var(--sub); max-width:920px}

.section{padding:32px 0}
.section.alt{background:#fafbfc; border-top:1px solid var(--muted)}
.section h2{margin:.2rem 0 12px}
.section h3{margin:1rem 0 .5rem}

.grid.two{display:grid; grid-template-columns:1fr 1fr; gap:16px}
@media (max-width:720px){ .grid.two{grid-template-columns:1fr} }

.docs{list-style:none; padding:0; margin:.2rem 0 0}
.docs li{padding:8px 0; border-top:1px dashed var(--muted)}
.docs li:first-child{border-top:0}
.docs a{color:var(--brand); text-decoration:none}
.docs a:hover{color:var(--brand-ink); text-decoration:underline}
.hint{display:block; color:var(--sub); font-size:.9rem}
code{background:#f3f4f6; padding:.1rem .3rem; border-radius:4px}

.site-footer{border-top:1px solid var(--muted); padding:20px 0; background:#fff}
.site-footer p{margin:0; color:var(--sub)}