:root { --ink:#172033; --muted:#526077; --line:#d9e0eb; --surface:#fff; --canvas:#f6f8fc; --brand:#155eef; --brand-dark:#0b3fa8; --accent:#dbeafe; --sans:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; --serif:Georgia,Cambria,"Times New Roman",serif; --radius:.75rem; --shadow:0 12px 36px rgb(23 32 51 / 8%); }
* { box-sizing:border-box; } html { color-scheme:light; scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:var(--canvas); font-family:var(--sans); font-size:16px; line-height:1.6; } a { color:var(--brand-dark); text-underline-offset:.18em; } a:hover { color:var(--brand); } :focus-visible { outline:3px solid #f59e0b; outline-offset:3px; } .container { width:min(1120px,calc(100% - 2rem)); margin-inline:auto; }
.skip-link { position:fixed; z-index:20; top:0; left:1rem; padding:.65rem 1rem; background:#111827; color:#fff; transform:translateY(-110%); }.skip-link:focus { transform:translateY(0); }.site-header { background:rgb(255 255 255 / 96%); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:10; backdrop-filter:blur(12px); }.nav-wrap,.footer-wrap { min-height:4.25rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; }.brand { display:inline-flex; align-items:center; gap:.65rem; color:var(--ink); font-weight:700; text-decoration:none; letter-spacing:-.02em; }.brand strong { color:var(--brand); }.brand-mark { display:grid; place-items:center; width:2rem; height:2rem; color:#fff; background:var(--brand); border-radius:.55rem; font-size:.9rem; }nav { display:flex; align-items:center; flex-wrap:wrap; gap:1rem; }nav a { font-size:.92rem; font-weight:650; text-decoration:none; }
.hero { padding:clamp(4rem,8vw,7rem) 0; background:radial-gradient(circle at top right,#dbeafe 0,transparent 36%),linear-gradient(135deg,#f8fbff,#eef4ff); border-bottom:1px solid var(--line); }.hero-grid { display:grid; grid-template-columns:minmax(0,1.8fr) minmax(260px,.8fr); gap:3rem; align-items:center; }.eyebrow { margin:0 0 .5rem; color:var(--brand-dark); font-size:.78rem; letter-spacing:.08em; font-weight:800; text-transform:uppercase; }h1,h2,h3 { color:var(--ink); line-height:1.14; letter-spacing:-.035em; }h1 { max-width:15ch; margin:0; font-size:clamp(2.5rem,6vw,4.8rem); }h2 { margin:0; font-size:clamp(1.7rem,3vw,2.45rem); }h3 { margin:0; font-size:1.25rem; }.lead { max-width:62ch; margin:1.25rem 0 0; color:var(--muted); font-size:clamp(1.05rem,2vw,1.22rem); }.button { display:inline-flex; margin-top:1.5rem; padding:.75rem 1.05rem; color:#fff; background:var(--brand); border-radius:.55rem; text-decoration:none; font-weight:750; box-shadow:0 8px 18px rgb(21 94 239 / 20%); }.button:hover { color:#fff; background:var(--brand-dark); }.hero-note { padding:1.5rem; color:#dce9ff; background:#102a5d; border-radius:var(--radius); box-shadow:var(--shadow); }.hero-note p:last-child { margin-bottom:0; }.hero-note .eyebrow { color:#a9c7ff; }
.section { padding:4rem 0; }.section-heading { margin-bottom:1.5rem; }.topic-grid,.post-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }.topic-card,.post-card,.empty-state { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:0 1px 2px rgb(23 32 51 / 3%); }.topic-card { min-height:10rem; padding:1.5rem; color:inherit; text-decoration:none; display:flex; flex-direction:column; gap:.65rem; transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease; }.topic-card:hover { color:inherit; border-color:#94b5ff; box-shadow:var(--shadow); transform:translateY(-2px); }.topic-card strong { font-size:1.1rem; }.topic-card span { color:var(--muted); font-size:.94rem; }.post-grid { grid-template-columns:repeat(3,1fr); }.post-card { padding:1.5rem; display:flex; flex-direction:column; align-items:flex-start; }.post-card h3 { margin-bottom:.8rem; }.post-card h3 a { color:inherit; text-decoration:none; }.post-card h3 a:hover { color:var(--brand); }.post-card p:not(.eyebrow) { margin:0; color:var(--muted); }.text-link { margin-top:1.5rem; font-size:.92rem; font-weight:800; text-decoration:none; }.empty-state { padding:2rem; }.empty-state h3 { margin-bottom:.5rem; }.empty-state p { margin:0; color:var(--muted); }
.article-shell { padding:3rem 0 4rem; }.article-header { max-width:850px; }.article-header h1 { max-width:19ch; font-size:clamp(2.25rem,5vw,4rem); }.article-meta { display:flex; flex-wrap:wrap; gap:.5rem 1rem; margin-top:1.5rem; color:var(--muted); font-size:.9rem; }.disclosure { margin:1rem 0 0; padding:.65rem .8rem; border-left:3px solid var(--brand); color:#25426f; background:var(--accent); font-size:.9rem; }.article-featured-image { margin:2rem 0 0; overflow:hidden; border:1px solid var(--line); border-radius:var(--radius); background:#e8eef9; box-shadow:var(--shadow); }.article-featured-image img { display:block; width:100%; max-height:32rem; object-fit:cover; }.article-layout { max-width:1040px; display:grid; grid-template-columns:minmax(0,1fr) 250px; gap:clamp(2rem,6vw,5rem); margin-top:3rem; }.article-content { min-width:0; font-family:var(--serif); font-size:1.15rem; line-height:1.8; }.article-content > :first-child { margin-top:0; }.article-content h2,.article-content h3,.article-content h4 { margin:2.25em 0 .7em; font-family:var(--sans); letter-spacing:-.025em; }.article-content h2 { font-size:1.75rem; }.article-content h3 { font-size:1.35rem; }.article-content code { padding:.12em .3em; background:#e9edf5; border-radius:.25rem; font-size:.84em; }.article-content blockquote { margin:1.6em 0; padding:.3rem 1.25rem; border-left:4px solid var(--brand); color:#394763; background:#f0f5ff; }.article-aside { align-self:start; position:sticky; top:6rem; display:grid; gap:1.5rem; padding-left:1rem; border-left:1px solid var(--line); }.article-aside h2 { margin:0 0 .75rem; font-size:.9rem; letter-spacing:.03em; text-transform:uppercase; }.tag-list { display:flex; flex-wrap:wrap; gap:.45rem; }.tag-list a { padding:.25rem .55rem; color:#29436d; background:#e8eef9; border-radius:999px; font-size:.8rem; font-weight:650; text-decoration:none; }.sources ul { padding-left:1.1rem; margin:0; }.sources li { margin-bottom:.75rem; font-size:.86rem; }.sources span { display:block; color:var(--muted); font-size:.78rem; }
.page-header,.prose-page { width:min(800px,calc(100% - 2rem)); margin:0 auto; padding:3rem 0 4rem; }.page-header h1,.prose-page h1 { font-size:clamp(2.15rem,5vw,3.7rem); }.page-header > p:last-child,.prose-page > p { color:var(--muted); }.prose-page h2 { margin-top:2rem; font-size:1.55rem; }.site-footer { background:#111b31; color:#c6d2e8; }.site-footer p { margin:0; font-size:.85rem; }.site-footer a { color:#dce9ff; }
.taxonomy-hero { border-bottom:1px solid var(--line); background:radial-gradient(circle at 82% 18%,#dbeafe 0,transparent 25rem),linear-gradient(135deg,#f8fbff,#edf3ff); }.taxonomy-hero-inner { padding:clamp(3rem,7vw,5.75rem) 0 clamp(2.5rem,5vw,4.5rem); }.breadcrumb { display:flex; align-items:center; gap:.55rem; margin-bottom:2rem; color:var(--muted); font-size:.9rem; }.breadcrumb a { color:var(--brand-dark); }.breadcrumb span:last-child { overflow:hidden; max-width:34ch; text-overflow:ellipsis; white-space:nowrap; }.taxonomy-hero h1 { max-width:16ch; font-size:clamp(2.45rem,6vw,4.9rem); }.taxonomy-description { max-width:70ch; margin:1.25rem 0 0; color:var(--muted); font-size:clamp(1.02rem,2vw,1.18rem); }.taxonomy-count { display:inline-flex; align-items:baseline; gap:.5rem; margin:2rem 0 0; color:#27436f; font-size:.9rem; font-weight:750; }.taxonomy-count span { display:inline-grid; min-width:2rem; min-height:2rem; place-items:center; padding:.15rem .45rem; color:var(--brand-dark); background:#fff; border:1px solid #b8cffb; border-radius:999px; font-size:.82rem; }.taxonomy-content { padding:clamp(2.75rem,6vw,5rem) 0 clamp(4rem,8vw,6.5rem); }.taxonomy-section-heading { display:flex; align-items:end; justify-content:space-between; gap:1.5rem; margin-bottom:1.5rem; }.taxonomy-section-heading .eyebrow { margin-bottom:.45rem; }.results-count { display:grid; min-width:2.35rem; min-height:2.35rem; place-items:center; color:var(--brand-dark); background:var(--accent); border-radius:999px; font-weight:800; }.taxonomy-post-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.1rem; padding:0; margin:0; list-style:none; }.taxonomy-post-card { height:100%; min-height:15rem; padding:clamp(1.35rem,3vw,1.75rem); background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:0 1px 2px rgb(23 32 51 / 3%); display:flex; flex-direction:column; align-items:flex-start; transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease; }.taxonomy-post-card:hover { border-color:#94b5ff; box-shadow:var(--shadow); transform:translateY(-2px); }.post-date { display:inline-flex; margin-bottom:1rem; padding:.25rem .55rem; color:#34578d; background:#eff5ff; border-radius:999px; font-size:.76rem; font-weight:750; letter-spacing:.02em; text-transform:uppercase; }.taxonomy-post-card h3 { font-size:clamp(1.2rem,2vw,1.45rem); }.taxonomy-post-card h3 a { color:var(--ink); text-decoration:none; }.taxonomy-post-card h3 a:hover { color:var(--brand); }.taxonomy-post-card p { margin:.85rem 0 1.5rem; color:var(--muted); }.post-read-more { margin-top:auto; color:var(--brand-dark); font-size:.9rem; font-weight:800; text-decoration:none; }.post-read-more span,.text-link span { margin-left:.2rem; transition:transform .15s ease; }.post-read-more:hover span,.text-link:hover span { display:inline-block; transform:translateX(.2rem); }.taxonomy-empty-state { display:grid; grid-template-columns:auto minmax(0,1fr); gap:1.25rem; align-items:start; max-width:720px; padding:clamp(1.5rem,4vw,2.25rem); background:linear-gradient(135deg,#fff,#f7faff); border:1px solid #cddcf7; border-radius:var(--radius); box-shadow:var(--shadow); }.taxonomy-empty-icon { display:grid; width:3.25rem; height:3.25rem; place-items:center; flex:0 0 auto; color:var(--brand-dark); background:var(--accent); border-radius:.75rem; font-size:1.75rem; font-weight:400; }.taxonomy-empty-state h3 { margin:.15rem 0 .55rem; font-size:1.3rem; }.taxonomy-empty-state p { max-width:58ch; margin:0; color:var(--muted); }.taxonomy-empty-state .text-link { margin-top:1.25rem; }
@media (max-width:800px) { .hero-grid,.article-layout { grid-template-columns:1fr; }.topic-grid,.post-grid { grid-template-columns:repeat(2,1fr); }.taxonomy-post-grid { grid-template-columns:1fr; }.article-aside { position:static; padding:1.5rem 0 0; border-top:1px solid var(--line); border-left:0; } } @media (max-width:520px) { .topic-grid,.post-grid { grid-template-columns:1fr; }.site-header { position:static; }.nav-wrap,.footer-wrap { align-items:flex-start; flex-direction:column; padding:.85rem 0; }.hero { padding:3rem 0; }.taxonomy-hero-inner { padding-top:2.25rem; }.breadcrumb { margin-bottom:1.5rem; }.taxonomy-section-heading { align-items:center; }.taxonomy-empty-state { grid-template-columns:1fr; gap:1rem; }.taxonomy-empty-icon { width:2.75rem; height:2.75rem; } }