/* Reset + base typography */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-block-start: 96px; }
body { margin: 0; font-family: var(--font); font-size: 16px; line-height: 1.6; color: var(--text); background: var(--bg);
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: clip; }
body::before { /* fine grain, very subtle */
  content: ''; position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: .55;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .4 0 0 0 0 .3 0 0 0 0 .2 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
[data-theme="dark"] body::before { opacity: .4; filter: invert(1); }
main, header, footer { position: relative; z-index: 1; }

img, svg, video, canvas { display: block; max-width: 100%; }
h1, h2, h3, h4, p, ul, ol, figure, dl, dd { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }
[hidden] { display: none !important; }

h1, h2, h3, h4 { font-weight: 700; line-height: 1.12; letter-spacing: -.02em; text-wrap: balance; }
h1 { font-size: clamp(2.4rem, 5.6vw, 4.4rem); letter-spacing: -.035em; font-weight: 800; }
h2 { font-size: clamp(1.8rem, 3.6vw, 2.8rem); }
h3 { font-size: 1.15rem; letter-spacing: -.01em; }
p { text-wrap: pretty; }
em.soft { font-style: italic; font-weight: 300; letter-spacing: -.02em; color: var(--gold-text); }
[data-theme='dark'] em.soft, .on-dark em.soft { color: var(--gold-bright); }
.num, [dir] .ltr, .ltr { direction: ltr; unicode-bidi: isolate; }

::selection { background: var(--gold); color: var(--on-gold); }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; border-radius: 6px; }
:focus:not(:focus-visible) { outline: none; }

/* scrollbar */
html { scrollbar-color: var(--gold) transparent; scrollbar-width: thin; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: var(--gold); border-radius: 10px; border: 2px solid var(--bg); }
::-webkit-scrollbar-track { background: transparent; }

.skip { position: fixed; inset-block-start: 8px; inset-inline-start: 8px; z-index: 100; padding: 10px 16px; border-radius: var(--r-pill);
  background: var(--gold); color: var(--on-gold); font-weight: 600; transform: translateY(-200%); }
.skip:focus { transform: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}