/* Я learn redesign — tokens + shell compartida (SPEC v1.0 §3) */
:root{
  --paper:#f7f3ea; --card:#fffdf7; --ink:#14213d;
  --terra:#c2491d; --gold:#e9a319; --ok:#2e7d4f; --blue:#2f6df6; --red:#d33f2e;
  --line:rgba(20,33,61,.14); --line-soft:rgba(20,33,61,.08);
  --font-d:'Fraunces',Georgia,serif; --font-b:'Inter',system-ui,sans-serif;
  --r:10px; --shadow:4px 4px 0 rgba(20,33,61,.9);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:var(--font-b);-webkit-tap-highlight-color:transparent}
.top{position:sticky;top:0;background:rgba(247,243,234,.93);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);z-index:10}
.top-in{max-width:1080px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;gap:22px}
.logo{font-family:var(--font-d);font-weight:900;font-size:22px;text-decoration:none;color:var(--ink)}
.top nav{display:flex;gap:4px}
.top nav a{font-size:14px;font-weight:500;color:var(--ink);text-decoration:none;padding:8px 14px;border-radius:99px;opacity:.65}
.top nav a.on{background:var(--ink);color:#fff;opacity:1}
.pill{margin-left:auto;font-size:13px;font-weight:700;border:1px solid var(--line);border-radius:99px;padding:7px 14px;white-space:nowrap}
.wrap{max-width:1080px;margin:0 auto;padding:34px 20px 70px}
.eyebrow{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--terra);font-weight:700}
h1.display{font-family:var(--font-d);font-weight:900;font-size:clamp(36px,5.2vw,60px);line-height:1.02;letter-spacing:-.02em;margin:10px 0 8px}
.sub{font-size:16px;opacity:.72;max-width:60ch}
.tag{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.1em;background:var(--gold);border-radius:4px;padding:3px 8px;margin-bottom:8px}
.card{border:1px solid var(--ink);border-radius:var(--r);padding:24px;background:var(--card);box-shadow:var(--shadow)}
.btn{display:inline-block;background:var(--terra);color:#fff;font-weight:700;font-size:15px;padding:14px 26px;border-radius:8px;text-decoration:none;border:0;cursor:pointer}
.btn.ghost{background:transparent;color:inherit;border:2px solid currentColor}
.btn.green{background:var(--ok);box-shadow:0 4px 0 #1e6e3c}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto}}
@media(max-width:760px){.top nav{display:none}}
