:root{--paper:#FAF8F4;--ink:#15171B;--inksoft:#3d4149;--muted:#6e7076;--rule:#e5e1d8;--surface:#f3f0e9;--amber:#C07A12;--footer:#0C0C0B;--footermuted:#8B8377}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.6 Archivo,system-ui,sans-serif;min-height:100vh;display:flex;flex-direction:column}
a{color:inherit;text-decoration:none}
main{flex:1;padding:120px 160px 96px;display:flex;flex-direction:column;gap:72px}
.intro{max-width:820px}
.bar{width:40px;height:3px;background:var(--amber)}
h1{font:400 76px/1 Newsreader,Georgia,serif;letter-spacing:-.03em;margin:26px 0 0}
.tagline{font:400 21px/1 Archivo,sans-serif;color:var(--muted);margin-top:20px}
.lede{font:400 19px/1.65 Archivo,sans-serif;color:var(--inksoft);margin:40px 0 0;text-wrap:pretty}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.card{background:var(--surface);border-left:3px solid var(--accent);padding:26px 28px;display:flex;align-items:flex-start;gap:18px;height:100%}
.card:hover h2{color:var(--amber)}
.card img{display:block;flex:none;width:26px;height:auto;margin-top:4px}
.card h2{font:400 27px/1.05 Newsreader,Georgia,serif;letter-spacing:-.02em;margin:0}
.card p{font:400 15px/1.5 Archivo,sans-serif;color:var(--inksoft);margin:8px 0 0}
.card .fig{font:500 14px/1.4 Archivo,sans-serif;color:var(--muted);margin-top:14px;font-variant-numeric:tabular-nums}
footer{background:var(--footer);color:var(--paper);padding:28px 160px;display:flex;align-items:center;justify-content:space-between;gap:48px;font:400 14px/1.4 Archivo,sans-serif}
footer nav{display:flex;align-items:center;gap:28px}
footer a:hover{color:var(--amber)}
footer span{color:var(--footermuted)}
.doc{flex:1;padding:96px 160px;max-width:1120px}
.doc .back{display:inline-block;font:400 26px/1 Newsreader,Georgia,serif;letter-spacing:-.02em}
.doc h1{font-size:40px;margin-top:40px}
.doc h2{font:400 24px/1.2 Newsreader,Georgia,serif;margin:40px 0 0}
.doc p{max-width:72ch;color:var(--inksoft)}
@media (max-width:1100px){main,footer,.doc{padding-left:64px;padding-right:64px}.cards{grid-template-columns:1fr}}
@media (max-width:700px){
  main{padding:56px 24px 48px;gap:40px}
  .bar{width:32px}h1{font-size:46px;margin-top:20px}.tagline{font-size:17px;line-height:1.4;margin-top:14px}.lede{font-size:17px;margin-top:28px}
  .cards{gap:1px;background:var(--rule)}
  .card{padding:22px 20px;gap:16px}.card h2{font-size:24px}.card .fig{font-size:13px;margin-top:12px}
  footer{padding:24px;flex-direction:column;align-items:flex-start;gap:14px}footer nav{flex-wrap:wrap;gap:12px 20px}
  .doc{padding:48px 24px}.doc h1{font-size:32px}
}