/* General Goat — site styles: the game's night-blue and brass, matching the other Crownerv app sites. */
:root { color-scheme: dark; --night:#1b2338; --navy:#141a28; --panel:#222b44; --line:#3a4664; --ink:#f6efe0; --muted:#b9b1a0; --gold:#d9b36a; --gold-soft:rgba(217,179,106,.14); --red:#b8372e; --wrap:960px; }
* { box-sizing:border-box } html { -webkit-text-size-adjust:100% }
body { margin:0; background: radial-gradient(1100px 600px at 50% -100px, #2a3a5c 0%, var(--night) 45%, var(--navy) 100%) var(--navy); color:var(--ink); font: 500 18px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, "Heebo", sans-serif; min-height:100vh; }
a { color:var(--gold); text-underline-offset:3px } a:hover { color:#f0cf85 }
:focus-visible { outline:3px solid var(--gold); outline-offset:3px; border-radius:6px }
.wrap { max-width:var(--wrap); margin:0 auto; padding-inline:20px }
.skip { position:absolute; left:-999px; top:8px; background:var(--gold); color:var(--night); padding:8px 12px; border-radius:8px } .skip:focus { left:8px; z-index:10 }
.bar { position:sticky; top:0; background:rgba(20,26,40,.85); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); z-index:5 }
.bar .wrap { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:64px }
.brand { display:flex; align-items:center; gap:10px; color:var(--ink); text-decoration:none; font-weight:800; font-size:20px } .brand img { width:36px; height:36px; border-radius:9px }
.nav { display:flex; gap:18px; flex-wrap:wrap; font-size:16px } .nav a { color:var(--muted); text-decoration:none } .nav a[aria-current], .nav a:hover { color:var(--ink) } .nav .lang { color:var(--gold) }
.hero { padding:64px 0 32px; text-align:center } .hero img { width:140px; height:140px; border-radius:32px; box-shadow:0 20px 60px rgba(0,0,0,.45) }
h1 { font-size:clamp(34px,6vw,56px); line-height:1.05; margin:18px 0 10px; letter-spacing:-.01em } .lede { color:var(--muted); font-size:20px; max-width:640px; margin:0 auto }
.cta { display:inline-block; margin-top:22px; background:var(--gold); color:var(--night); font-weight:800; padding:14px 22px; border-radius:14px; text-decoration:none }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; margin:36px 0 }
.card { background:var(--panel); border:1px solid var(--line); border-radius:18px; padding:20px } .card h3 { margin:0 0 6px; font-size:19px } .card p { margin:0; color:var(--muted); font-size:16px }
.page { padding:36px 0 72px } .prose h1 { font-size:40px } .prose h2 { font-size:24px; margin-top:34px } .prose p, .prose li { color:#e4dccb } .effective { color:var(--muted); margin-top:-6px } .muted { color:var(--muted) }
.panel { background:var(--gold-soft); border:1px solid rgba(217,179,106,.35); border-radius:16px; padding:16px 18px; margin:18px 0 }
.mail { font-size:22px; font-weight:800; word-break:break-all }
footer { border-top:1px solid var(--line); color:var(--muted); font-size:14px; padding:28px 0 48px } footer .wrap { display:flex; flex-wrap:wrap; gap:8px 24px; justify-content:space-between }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto } }