/**
 * Aegean Poster — design tokens.
 *
 * Loaded on the front end AND in the block editor, so editor styles can never
 * drift from the site. Nothing else in this theme hard-codes a colour: a child
 * theme re-skins the whole site by overriding :root here.
 *
 * CONTRAST NOTE — four values sit deliberately off the comp so that text at the
 * sizes this design actually uses (11–14px) clears WCAG AA (4.5:1). Each was
 * solved against every background it can land on, including Sand panels and the
 * Read Next band. Do not "restore" them to the comp values:
 *
 *   --at-terracotta-text  #A03F1D  (comp #C4552E = 3.91 on cream, fails)
 *   --at-muted            #63604C  (comp #6D6A58 = 4.01 on sand, fails)
 *   --at-on-ink-dim       #97A28F  (comp #8F9A87 = 4.48 on ink, fails)
 *   --at-btn-primary      #A8431F  (cream on comp #C4552E = 3.91, fails)
 *
 * The comp's #C4552E survives untouched as --at-terracotta for fills, motifs
 * and the tri-band, where only the 3:1 graphics threshold applies.
 */

:root {
	/* --- Core palette ------------------------------------------------ */
	--at-ink: #26332E;
	--at-ink-hover: #16201C;
	--at-cream: #F6EFE0;
	--at-sand: #E8DCC3;
	--at-paper: #FDF8EC;
	--at-terracotta: #C4552E;
	--at-ochre: #E8B64C;
	--at-olive: #5C6B4F;
	--at-olive-light: #8A9A6E;
	--at-aegean: #2E5F7A;
	--at-mist: #DFE6EA;

	/* --- Derived surfaces -------------------------------------------- */
	--at-mat-warm: #E6E3D3;
	--at-band-readnext: #EFE7D3;
	--at-verified-bg: #EEF0E4;
	--at-verified-text: #3D443F;

	/* --- Text --------------------------------------------------------- */
	--at-body: var(--at-ink);
	--at-body-2: #4A544D;
	--at-muted: #63604C;
	--at-on-ink: var(--at-cream);
	--at-on-ink-soft: #B9C0AD;
	--at-on-ink-dim: #97A28F;

	/* --- Accent text (AA-safe terracotta) ----------------------------- */
	--at-terracotta-text: #A03F1D;
	--at-terracotta-hover: #7F3216;
	/* Ochre is a fill colour only: #E8B64C reads 1.63:1 on cream, so any ochre
	   TEXT on a light ground uses this deepened tone (>=4.42:1 everywhere). */
	--at-ochre-deep: #7E5E12;
	--at-btn-primary: #A8431F;
	--at-btn-primary-hover: #8E3819;

	/* --- Hairlines & rules -------------------------------------------- */
	--at-rule: #D8CFB6;
	--at-rule-ink: #3D4A42;
	--at-border: 2px solid var(--at-ink);
	--at-border-thin: 1px solid var(--at-ink);
	--at-border-ink-surface: 2px solid var(--at-cream);

	/* --- Focus -------------------------------------------------------- */
	--at-focus: var(--at-aegean);
	--at-focus-on-ink: var(--at-ochre);

	/* --- Type --------------------------------------------------------- */
	--at-font-display: "Marcellus", "Hoefler Text", "Times New Roman", serif;
	--at-font-text: "Outfit", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;

	--at-size-display: clamp(3.25rem, 1.6rem + 6.6vw, 6rem);   /* 52 → 96 */
	--at-size-h1: clamp(2.1rem, 1.15rem + 3.8vw, 3.5rem);      /* 34 → 56 */
	--at-size-h1-archive: clamp(2.4rem, 1.05rem + 5.4vw, 4.5rem); /* 38 → 72 */
	--at-size-h2-section: clamp(1.5rem, 1.06rem + 1.75vw, 2.125rem); /* 24 → 34 */
	--at-size-h2: clamp(1.4rem, 1.1rem + 1.2vw, 1.875rem);     /* 22 → 30 */
	--at-size-h3: clamp(1.2rem, 1.05rem + .6vw, 1.4rem);
	--at-size-card-title: clamp(1.06rem, .97rem + .38vw, 1.3125rem); /* 17 → 21 */
	--at-size-lede: clamp(1rem, .93rem + .3vw, 1.25rem);       /* 16 → 20 */
	--at-size-body: clamp(1rem, .97rem + .12vw, 1.0625rem);    /* 16 → 17 */
	--at-size-quote: clamp(1.35rem, 1.05rem + 1.2vw, 2rem);    /* 22 → 32 */
	--at-size-meta: .75rem;
	--at-size-kicker: .6875rem;

	--at-ls-display: .04em;
	--at-ls-kicker: .22em;
	--at-ls-wordmark: .22em;

	/* --- Layout ------------------------------------------------------- */
	--at-maxw: 1280px;
	--at-gutter: clamp(1.25rem, .6rem + 2.6vw, 2.875rem);      /* 20 → 46 */
	--at-section-y: clamp(2.125rem, 1.4rem + 2.9vw, 3.375rem); /* 34 → 54 */
	--at-gap-card: clamp(1rem, .55rem + 1.8vw, 1.625rem);      /* 16 → 26 */
	--at-gap-tile: .875rem;
	--at-measure: 660px;
	--at-toc-w: 250px;

	--at-band: 14px;
	--at-transition: 150ms ease-out;
}

@media (max-width: 768px) {
	:root { --at-band: 12px; }
}

/* The design is a static poster. Honour reduced motion by having nothing to
   reduce — but still disable any smooth scrolling the browser adds. */
@media (prefers-reduced-motion: reduce) {
	:root { --at-transition: 0ms; }
}