:root { --ink:#24181c; --muted:#67575d; --paper:#fff; --soft:#f4f8f5; --indigo:#263f72; --jade:#2f7564; --gold:#b88a35; --line:#d9ddd9; }
* { box-sizing:border-box; }
body { margin:0; background:#f7f5f3; color:var(--ink); font-family:Inter,Arial,sans-serif; line-height:1.7; }
a { color:var(--indigo); }
.topbar { background:#221b24; color:#fff; }
.nav { width:min(1120px,calc(100% - 36px)); margin:0 auto; min-height:68px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand { color:#fff; text-decoration:none; font:700 1.2rem Georgia,serif; }
.links { display:flex; flex-wrap:wrap; gap:18px; }
.links a { color:#e9e5e7; text-decoration:none; font-weight:700; }
.hero { border-bottom:1px solid var(--line); background:var(--soft); }
.hero-inner,.page { width:min(1120px,calc(100% - 36px)); margin:0 auto; }
.hero-inner { padding:54px 0 50px; }
.eyebrow { color:var(--jade); font-weight:800; text-transform:uppercase; font-size:.82rem; }
h1,h2 { font-family:Georgia,serif; line-height:1.15; }
h1 { max-width:900px; font-size:clamp(2.2rem,5vw,4.2rem); margin:8px 0 18px; }
.lead { max-width:850px; color:var(--muted); font-size:1.15rem; }
.store-cta { display:inline-block; margin-top:8px; padding:11px 16px; border-radius:6px; background:var(--indigo); color:#fff; font-weight:800; text-decoration:none; }
.page { padding:38px 0 70px; }
.post-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:22px; }
.card { display:block; overflow:hidden; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); text-decoration:none; }
.card img { width:100%; aspect-ratio:16/9; object-fit:cover; display:block; }
.card-body { padding:20px; }
.card h2 { margin:6px 0 10px; font-size:1.35rem; }
.article { display:grid; grid-template-columns:minmax(0,790px) minmax(240px,1fr); gap:30px; align-items:start; }
.article-main,.aside { border:1px solid var(--line); border-radius:8px; background:#fff; }
.article-main { min-width:0; padding:clamp(22px,5vw,46px); }
.article-main h1 { font-size:clamp(2.1rem,5vw,3.5rem); }
.article-main h2 { margin-top:34px; font-size:1.6rem; }
.article-main p,.article-main li { color:var(--muted); }
.hero-image { width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:8px; margin:18px 0 28px; }
.aside { padding:22px; position:sticky; top:20px; }
.callout { margin:28px 0; padding:22px; border-left:5px solid var(--jade); background:var(--soft); border-radius:6px; }
.table-scroll { max-width:100%; margin:22px 0; overflow-x:auto; border:1px solid var(--line); border-radius:8px; }
table { width:100%; min-width:680px; border-collapse:collapse; }
th,td { padding:14px 16px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
thead th { background:#edf3f0; }
tr:last-child th,tr:last-child td { border-bottom:0; }
.source-note { font-size:.94rem; }
.cta { margin-top:30px; padding:24px; border-radius:8px; background:#263f72; color:#fff; }
.cta p { color:#eef2f9; }
.cta a { display:inline-block; padding:11px 16px; border-radius:6px; background:#fff; color:#263f72; font-weight:800; text-decoration:none; }
.footer { padding:28px 18px; text-align:center; border-top:1px solid var(--line); color:var(--muted); }
@media(max-width:800px){.nav{align-items:flex-start;flex-direction:column;padding:16px 0}.article{grid-template-columns:1fr}.aside{position:static}}