/**
 * Soumm design tokens.
 *
 * Every value here was measured off the design prototypes. Nothing in the
 * theme should hardcode a colour, a size or a duration — it comes from here.
 *
 * The design has exactly one breakpoint: 1000px. CSS cannot hold a media
 * query in a custom property, so that number appears literally in the other
 * stylesheets, always with a comment.
 */

:root {
	/* --- Colour ------------------------------------------------------- */
	--soumm-ink: #173A34;          /* deep green: body text, buttons        */
	--soumm-brass: #B08A52;        /* accent: eyebrows, hover               */
	--soumm-page: #FCFBF8;         /* ivory: default ground                 */
	--soumm-surface-alt: #F8F5F0;  /* warm cream: alternating sections      */
	--soumm-line: #EAE4DA;         /* borders, rules                        */
	--soumm-muted: #8B847A;        /* secondary text, captions              */
	--soumm-on-ink: #FCFBF8;       /* text on the deep green ground         */

	/* Derived. Kept as tokens so a brand change stays in this file. */
	--soumm-ink-08: rgba(23, 58, 52, 0.08);
	--soumm-ink-14: rgba(23, 58, 52, 0.14);
	--soumm-page-90: rgba(252, 251, 248, 0.9);

	/* --- Type --------------------------------------------------------- */
	--soumm-font: 'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;

	--soumm-fs-display: clamp(30px, 4vw, 58px);
	--soumm-fs-h2: clamp(24px, 3.26vw, 47px);
	--soumm-fs-h3: clamp(19px, 1.85vw, 27px);
	--soumm-fs-h4: clamp(17px, 1.4vw, 21px);
	--soumm-fs-body: 16px;
	--soumm-fs-small: 15px;
	--soumm-fs-meta: 12px;
	--soumm-fs-eyebrow: 12px;
	--soumm-fs-nav: 11px;
	--soumm-fs-btn: 10px;

	--soumm-lh-display: 1.06;
	--soumm-lh-h2: 1.08;
	--soumm-lh-h3: 1.18;
	--soumm-lh-body: 1.9;
	--soumm-lh-tight: 1.5;

	--soumm-ls-display: -0.012em;
	--soumm-ls-eyebrow: 0.22em;
	--soumm-ls-nav: 0.18em;

	--soumm-fw-body: 400;
	--soumm-fw-head: 500;
	--soumm-fw-btn: 700;

	/* --- Layout ------------------------------------------------------- */
	--soumm-container: 1580px;
	--soumm-gutter: clamp(20px, 4vw, 72px);
	--soumm-section-y: clamp(90px, 13vw, 180px);
	--soumm-section-y-sm: clamp(60px, 8vw, 110px);
	--soumm-header-h: clamp(68px, 6.6vw, 92px);
	--soumm-col-gap: clamp(36px, 5vw, 90px);
	--soumm-stack: clamp(24px, 2.8vw, 38px);
	--soumm-measure: 34em;
	--soumm-measure-tight: 18em;

	/* --- Shape and motion --------------------------------------------- */
	--soumm-radius-pill: 999px;
	--soumm-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--soumm-dur: 500ms;
	--soumm-dur-slow: 600ms;
	--soumm-dur-fast: 240ms;
}
