:root{
--bg:#0b1220; --card:#ffffff; --ink:#0b1220; --muted:#5b657a; --accent:#9cc1ff;
}
*{ box-sizing:border-box; }
body{
margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
background: var(--bg); color:#fff; line-height:1.55;
}
img{ max-width:100%; height:auto; display:block; }
.wrap{ max-width:1100px; margin:0 auto; padding:14px 20px; }
.container{ max-width: 960px; margin: 36px auto; padding: 0 20px; }


.site-header{ position:sticky; top:0; backdrop-filter: blur(6px); background: rgba(11,18,32,.6); border-bottom:1px solid rgba(255,255,255,.08); z-index: 10; }
.brand{ color:#fff; text-decoration:none; font-weight:700; letter-spacing:.3px; }
.nav a{ color:var(--accent); text-decoration:none; margin-left: 16px; }
.nav a[aria-current="page"]{ text-decoration: underline; }


.hero{ display:grid; grid-template-columns: 1.1fr .9fr; gap: 24px; align-items:center; }
.hero-text h1{ font-size: clamp(1.8rem, 2.8vw, 3rem); margin:.2rem 0 .4rem; }
.hero-text p{ color:#d6d9e0; }
.btn{ display:inline-block; background:#fff; color:#111; border-radius: 10px; padding:.65rem 1rem; text-decoration:none; border:1px solid #d0d0d0; }


.grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 28px; }
.card{ background: var(--card); color: var(--ink); padding: 16px 18px; border-radius: 12px; box-shadow: 0 6px 24px rgba(0,0,0,.25); }
.prose h1{ margin-top:0; }
.menu-cards .card h2{ margin-top:.2rem; }


.site-footer{ border-top:1px solid rgba(255,255,255,.08); margin-top:40px; }
.site-footer .wrap{ padding: 18px 20px; }


@media (max-width: 900px){
.hero{ grid-template-columns: 1fr; }
.grid{ grid-template-columns: 1fr; }
}