:root { color-scheme: light; --ink:#151523; --muted:#6f6b79; --surface:#fffaf3; --card:#fff; --orange:#ff851b; --teal:#31c7b7; --line:#eee2d4; font-family:Inter,ui-rounded,"SF Pro Rounded","Segoe UI",sans-serif; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:radial-gradient(circle at 85% 8%,rgba(49,199,183,.18),transparent 25rem),radial-gradient(circle at 8% 16%,rgba(255,214,90,.28),transparent 24rem),var(--surface); line-height:1.65; }
a { color:#a94c00; text-underline-offset:.2em; }
a:hover { color:#753600; }
.shell { width:min(920px,calc(100% - 32px)); margin:0 auto; }
header { padding:28px 0 12px; }
nav { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand { color:var(--ink); font-size:1.5rem; font-weight:850; text-decoration:none; }
.nav-links { display:flex; flex-wrap:wrap; gap:16px; font-weight:650; }
.nav-links a { color:var(--muted); text-decoration:none; }
main { padding:56px 0 88px; }
.hero { padding:44px; border:1px solid var(--line); border-radius:32px; background:rgba(255,255,255,.86); box-shadow:0 24px 70px rgba(73,47,20,.09); }
.eyebrow { margin:0 0 10px; color:#b85200; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
h1 { max-width:760px; margin:0; font-size:clamp(2.4rem,7vw,4.7rem); line-height:1.02; letter-spacing:-.045em; }
.lead { max-width:680px; margin:24px 0 0; color:var(--muted); font-size:1.15rem; }
.grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:22px; }
.card { display:block; min-height:190px; padding:26px; color:var(--ink); text-decoration:none; border:1px solid var(--line); border-radius:24px; background:var(--card); box-shadow:0 12px 35px rgba(73,47,20,.06); transition:transform .2s ease; }
.card:hover { transform:translateY(-2px); color:var(--ink); }
.card h2 { margin:12px 0 6px; font-size:1.35rem; }
.card p { margin:0; color:var(--muted); }
.dot { display:inline-grid; width:42px; height:42px; place-items:center; border-radius:14px; background:#fff0df; color:#bf5700; font-weight:900; }
.card:nth-child(2) .dot { background:#e1f8f5; color:#087c70; }
.card:nth-child(3) .dot { background:#fff6cb; color:#816700; }
.document { padding:36px 42px; border:1px solid var(--line); border-radius:28px; background:rgba(255,255,255,.92); box-shadow:0 18px 55px rgba(73,47,20,.07); }
.document h1 { font-size:clamp(2.2rem,6vw,3.8rem); }
.document h2 { margin-top:2.2em; line-height:1.25; }
.document li+li { margin-top:.45em; }
.meta { color:var(--muted); }
.language-block+.language-block { margin-top:64px; padding-top:52px; border-top:1px solid var(--line); }
.notice { padding:18px 20px; border-left:4px solid var(--teal); border-radius:12px; background:#effbf9; }
.button { display:inline-block; margin-top:14px; padding:12px 18px; border-radius:14px; color:#fff; background:var(--orange); font-weight:800; text-decoration:none; }
.button:hover { color:#fff; background:#e66d00; }
footer { padding:26px 0 44px; color:var(--muted); border-top:1px solid var(--line); }
@media (max-width:760px) { nav { align-items:flex-start; flex-direction:column; } .hero,.document { padding:26px 22px; border-radius:24px; } .grid { grid-template-columns:1fr; } main { padding-top:34px; } }
