/* säm · design tokens.
 * Album blue (sampled from the cover, back cover and label) is the identity;
 * burgundy is the second voice; near-black and off-white are the neutrals.
 * No gold, brass or orange anywhere. */

@font-face {
	font-family: "Instrument Sans";
	src: url("../fonts/instrument-sans-var.woff2") format("woff2");
	font-weight: 400 700;
	font-stretch: 75% 100%;
	font-style: normal;
	font-display: swap;
}

:root {
	--font: "Instrument Sans", "Helvetica Neue", Arial, sans-serif;

	/* Album blue. */
	--blue-950: #050f24;   /* sea at night */
	--blue-900: #071a3a;   /* storm sea */
	--blue-800: #0b2a5c;   /* deep label blue */
	--blue: #184a88;       /* road-sign blue (back cover) */
	--blue-600: #1f5aa0;   /* sign row */
	--blue-400: #6f9fd6;   /* submerged ink */
	--sky: #b4d7ef;        /* cover sky */
	--sky-200: #c6e0f0;    /* back-cover sky */

	/* Burgundy. */
	--wine: #3b0b16;
	--burgundy: #621628;
	--crimson: #8b2238;
	--crimson-light: #c2384f; /* lightning reflections, never text on dark */

	/* Neutrals. */
	--night: #090b11;
	--paper: #f1f0ed;

	/* Type: five steps, the largest one is the voice of the page. */
	--step-small: 0.875rem;
	--step-text: 1.125rem;
	--step-statement: clamp(1.25rem, 1.05rem + 0.8vw, 1.75rem);
	--step-heading: clamp(2.5rem, 1.2rem + 5vw, 6.5rem);
	--step-display: clamp(4.5rem, 1rem + 14vw, 17rem);

	--margin: clamp(16px, 2.4vw, 40px);
	--gutter: clamp(12px, 1.4vw, 24px);
	--header-h: 76px;
	--radius: 0;

	--ease-out: cubic-bezier(0.22, 1, 0.36, 1);
	--ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

	/* Role defaults (overridden per chapter). */
	--bg: var(--night);
	--ink: var(--paper);
	--muted: #a9b6c9;
	--accent: var(--crimson);
	--accent-ink: var(--paper);
	--accent-step: var(--burgundy);
	--focus: var(--sky);
}

/* Chapters set their own ink; components read these roles only. */
.chapter--storm,
.chapter--videos,
.chapter--finale { --ink: var(--paper); --muted: #b9c4d6; --accent: var(--crimson); --accent-ink: var(--paper); --accent-step: var(--burgundy); --focus: var(--sky); }

.chapter--album { --ink: var(--blue-900); --muted: #233d63; --accent: var(--burgundy); --accent-ink: var(--paper); --accent-step: var(--wine); --focus: var(--burgundy); }

.chapter--shop { --bg: var(--wine); --ink: var(--paper); --muted: #e3c9cf; --accent: var(--paper); --accent-ink: var(--wine); --accent-step: var(--sky); --focus: var(--sky); }

.chapter--concerts { --bg: var(--blue); --ink: var(--paper); --muted: #d6e3f3; --accent: var(--paper); --accent-ink: var(--blue); --accent-step: var(--sky); --focus: var(--paper); }