/* Reset, document defaults and typographic primitives. */
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:calc(var(--header-h) + 16px); -webkit-text-size-adjust:100%; scrollbar-color:var(--ink-5) var(--ink-0); }
body { margin:0; background:var(--bg); color:var(--text); font:400 var(--fs-body)/1.7 var(--sans); font-synthesis:none; -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4,p,figure,dl,dd { margin:0; }
img { max-width:100%; }
a { color:inherit; text-decoration:none; }
button { font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer; }
button:disabled { cursor:not-allowed; opacity:.55; }
input { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
[hidden] { display:none !important; }
::selection { background:#8861b7; color:#fff; }
:focus-visible { outline:2px solid var(--gold); outline-offset:4px; }

/* Film grain: one static layer above the page, below dialogs (they live in the top layer). */
body::after { content:''; position:fixed; inset:0; z-index:100; pointer-events:none; background:var(--grain); opacity:.055; }

.shell { width:var(--shell); margin-inline:auto; }
.skip-link { position:fixed; left:16px; top:-90px; z-index:110; padding:12px 16px; background:var(--gold); color:var(--gold-ink); font-weight:600; }
.skip-link:focus { top:8px; }
.visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }

/* Headings: Cormorant Garamond; the gold italic carries the emphasis. */
h1,h2,h3,h4 { font-family:var(--serif); font-weight:400; text-wrap:balance; }
h2 { font-size:var(--fs-h2); line-height:1.04; letter-spacing:-.018em; }
h3 { font-size:var(--fs-h3); line-height:1.12; font-weight:500; }
h4 { font-size:var(--fs-h4); line-height:1.2; font-weight:500; }
:is(h1,h2) em { font-style:italic; color:var(--gold-bright); }
p { text-wrap:pretty; }

/* Small tracked capitals above a heading, led by the Asteria star. */
.eyebrow { display:flex; align-items:center; gap:.9em; font:600 var(--fs-micro)/1.4 var(--sans); letter-spacing:.24em; text-transform:uppercase; color:var(--gold); }
.eyebrow::before { content:''; flex:none; width:.95em; height:.95em; background:currentColor; -webkit-mask:var(--star) center/contain no-repeat; mask:var(--star) center/contain no-repeat; }
.overline { font:500 var(--fs-micro)/1.4 var(--sans); letter-spacing:.18em; text-transform:uppercase; color:var(--muted); }
.lead { font-size:var(--fs-lead); line-height:1.55; color:var(--text-soft); }

@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }