/*
 * Sovereign Terminal — main.css
 *
 * A portfolio-sheet newsroom. Every block is a sheet laid on a cool blue-grey
 * ground, like boards pinned to a wall: white sheets for reading, soft sheets
 * for tools, navy sheets for the feed and the newsletter. Headlines are set in
 * Archivo at 62% width and weight 900, in capitals, as posters; one word per
 * block may be written over them in wine-coloured script. Data sits in panels
 * with a navy pill title and three window dots. Gains are drawn solid, losses
 * hollow — the palette has no red or green, so the shape carries the sign.
 *
 *   1. Tokens               10. Single, pages & archives
 *   2. Reset & base         11. Sidebar & panels
 *   3. Primitives           12. Widgets
 *   4. Header & navigation  13. Debt Payoff Planner
 *   5. Sheets               14. Forms (Contact Form 7)
 *   6. Poster               15. Newsletter band & modal
 *   7. Board & dossier      16. Footer
 *   8. Tiles, wire & cards  17. Responsive & motion
 *   9. Desk bands
 */

/* ═══ 1. Tokens ═══════════════════════════════════════════════════════════ */
:root {
	--ground: #dfe3ec;
	--paper: #ffffff;
	--soft-a: #f5f6fa;
	--soft-b: #e8ebf3;
	--navy: #1f2b52;
	--navy-2: #2c3a69;
	--deep: #161e3b;
	--mist: #c9d0e0;
	--mist-2: #eef0f6;
	--peri: #8d99c2;
	--wine: #8f1d2c;
	--rose: #efc4ca;

	--text: #1f2b52;
	--text-2: #4a5375;
	--text-3: #6b7391;
	--line: rgba(31, 43, 82, .16);
	--line-strong: #1f2b52;

	--sans: "Archivo", "Helvetica Neue", Arial, system-ui, sans-serif;
	--script: "Mrs Saint Delafield", "Brush Script MT", cursive;

	--r-sheet: 22px;
	--r-panel: 16px;
	--r-s: 10px;
	--pill: 999px;
	--stroke: 1.5px;

	--wrap: 1280px;
	--gutter: clamp(8px, 1.6vw, 18px);
	--pad: clamp(20px, 4vw, 52px);
	--gap: clamp(10px, 1.4vw, 16px);

	--logo-h: 40px;
}

/* ═══ 2. Reset & base ═════════════════════════════════════════════════════ */
*,
*::before,
*::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: 110px;
	scrollbar-gutter: stable;
}

body {
	margin: 0;
	background:
		radial-gradient(1100px 520px at 0% 0%, #eef1f7 0%, transparent 70%),
		radial-gradient(900px 600px at 100% 40%, #e9edf5 0%, transparent 70%),
		var(--ground);
	color: var(--text);
	font-family: var(--sans);
	font-size: 1.0625rem;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

body.is-locked { overflow: hidden; }

img,
svg,
video { display: block; max-width: 100%; height: auto; }

a { color: inherit; text-decoration: none; }

h1, h2, h3, h4, h5, h6, p, ul, ol, figure, blockquote, dl, dd { margin: 0; }

ul, ol { padding: 0; list-style: none; }

button, input, select, textarea { font: inherit; color: inherit; }

button { cursor: pointer; }

:focus-visible {
	outline: 2.5px solid var(--wine);
	outline-offset: 3px;
	border-radius: 6px;
}

::selection { background: var(--navy); color: #fff; }

.screen-reader-text,
.wpcf7 .screen-reader-response {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.skip-link {
	position: absolute;
	top: -100px;
	left: 16px;
	z-index: 1000;
	padding: .75rem 1.25rem;
	background: var(--navy);
	color: #fff;
	font-weight: 700;
	border-radius: var(--pill);
}

.skip-link:focus { top: 16px; }

[hidden] { display: none !important; }

.site-main {
	display: grid;
	gap: var(--gap);
	padding: var(--gap) var(--gutter) 0;
}

/* ═══ 3. Primitives ═══════════════════════════════════════════════════════ */

/* The poster voice. */
.display,
.poster__title,
.story__title,
.archive-head__title,
.band__title,
.st-modal__title {
	font-family: var(--sans);
	font-stretch: 62%;
	font-weight: 900;
	line-height: .88;
	letter-spacing: -.005em;
	text-transform: uppercase;
	color: var(--navy);
	text-wrap: balance;
}

.display {
	position: relative;
	width: fit-content;
	max-width: 100%;
}

.display--md { font-size: clamp(2.6rem, 5vw, 4rem); }
.display--lg { font-size: clamp(3rem, 7vw, 5.6rem); }
.display--xl { font-size: clamp(3.4rem, 9vw, 7.6rem); }
.display--center { margin-inline: auto; text-align: center; }

/* The wine asterisk that marks a page's main title. */
.spark {
	display: inline-block;
	margin-left: .06em;
	font-family: "Segoe UI Symbol", "Apple Symbols", sans-serif;
	font-size: .34em;
	font-weight: 400;
	line-height: 1;
	vertical-align: top;
	color: var(--wine);
	transform: translateY(.1em);
}

.display--center .spark { margin: 0 .12em 0 0; }

/* One script word written over a display title. */
.script-over {
	position: absolute;
	left: -.2em;
	top: -.78em;
	z-index: 1;
	font-family: var(--script);
	font-stretch: 100%;
	font-size: .62em;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
	text-transform: none;
	color: var(--wine);
	transform: rotate(-9deg);
	pointer-events: none;
	white-space: nowrap;
}

.display:has(.script-over) { margin-top: .62em; }

/* Buttons: a pill, the label in tracked capitals. */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .6em;
	min-height: 52px;
	padding: 0 1.6rem;
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .14em;
	line-height: 1;
	text-transform: uppercase;
	border: var(--stroke) solid var(--navy);
	border-radius: var(--pill);
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
	white-space: nowrap;
}

.btn .icon { width: 18px; height: 18px; flex: none; }
.btn .arrow-icon { transition: transform .2s ease; }
.btn:hover .arrow-icon { transform: translateX(3px); }

.btn--navy { background: var(--navy); color: #fff; }
.btn--navy:hover { background: var(--navy-2); border-color: var(--navy-2); }

.btn--light { background: #fff; color: var(--navy); border-color: #fff; }
.btn--light:hover { background: var(--mist-2); border-color: var(--mist-2); }

.btn--small { min-height: 42px; padding: 0 1.15rem; font-size: .72rem; }
.btn--block { width: 100%; }

/* The quieter link. */
.text-link {
	display: inline-flex;
	align-items: center;
	gap: .45em;
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--navy);
	border-bottom: var(--stroke) solid currentColor;
	padding-bottom: 3px;
}

.text-link .icon { width: 16px; height: 16px; transition: transform .2s ease; }
.text-link:hover .icon { transform: translateX(3px); }

/* Outline chips — desks, presets, tags. */
.chips { display: flex; flex-wrap: wrap; gap: 10px; }

.chip {
	display: inline-flex;
	align-items: center;
	gap: .55em;
	padding: .55em 1.05em;
	font-size: .9rem;
	font-weight: 600;
	line-height: 1.2;
	color: var(--navy);
	background: #fff;
	border: var(--stroke) solid var(--navy);
	border-radius: 12px;
	transition: background-color .2s ease, color .2s ease;
}

.chip .icon { width: 18px; height: 18px; flex: none; }

a.chip:hover,
button.chip:hover,
.chip.is-active { background: var(--navy); color: #fff; }

.chip--lg { padding: .7em 1.2em; font-size: 1rem; }

.chip__count {
	min-width: 1.9em;
	padding: .15em .5em;
	font-size: .72rem;
	font-weight: 700;
	text-align: center;
	color: #fff;
	background: var(--navy);
	border-radius: var(--pill);
}

a.chip:hover .chip__count { background: #fff; color: var(--navy); }

.chip--dark { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .5); }
a.chip--dark:hover { background: #fff; color: var(--navy); }

/* The stat box: three facts in one bordered strip. */
.statbox {
	display: inline-grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(0, auto);
	border: var(--stroke) solid var(--navy);
	border-radius: 14px;
	background: #fff;
}

.statbox__item {
	display: grid;
	gap: .2rem;
	padding: .8rem 1.2rem;
	align-content: start;
}

.statbox__item + .statbox__item { border-left: 1px solid var(--navy); }

.statbox__item strong {
	font-stretch: 62%;
	font-weight: 900;
	font-size: 1.9rem;
	line-height: 1;
	text-transform: uppercase;
	font-variant-numeric: tabular-nums;
}

.statbox__item span { font-size: .74rem; line-height: 1.3; color: var(--text-3); }

.statbox--small .statbox__item { padding: .6rem .95rem; }
.statbox--small .statbox__item strong { font-size: 1.5rem; }

/* Check rows — the reference's toolkit list. */
.checks { display: grid; gap: 10px; }

.check {
	display: grid;
	grid-template-columns: 28px 1fr;
	gap: 12px;
	align-items: center;
	padding: .8rem 1rem;
	font-size: .95rem;
	line-height: 1.35;
	border: var(--stroke) solid currentColor;
	border-radius: 12px;
}

.check strong { font-weight: 700; }

.check__mark {
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--navy);
	color: #fff;
}

.check__mark .icon { width: 16px; height: 16px; stroke-width: 2.4; }

/* The brand rings. */
.rings { width: 48px; height: auto; color: var(--navy); }

/* The rotating seal. */
.seal {
	position: relative;
	width: 190px;
	aspect-ratio: 1;
	color: var(--navy);
}

.seal__ring {
	width: 100%;
	height: 100%;
	animation: seal-spin 28s linear infinite;
}

.seal__ring text {
	font-family: var(--sans);
	font-stretch: 62%;
	font-size: 19px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	fill: currentColor;
}

.seal__rings {
	position: absolute;
	inset: 0;
	width: 38%;
	margin: auto;
}

@keyframes seal-spin { to { transform: rotate(360deg); } }

/* Window dots, top-right of a sheet or panel. */
.sheet__dots,
.panel__dots {
	display: inline-flex;
	gap: 4px;
}

.sheet__dots i,
.panel__dots i {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: currentColor;
}

.sheet__dots {
	position: absolute;
	top: 22px;
	right: 26px;
	color: var(--navy);
}

.icon { width: 22px; height: 22px; }

/* ═══ 4. Header & navigation ══════════════════════════════════════════════ */

/* The whole header sticks; the edition line (38px) scrolls off the top and
   the masthead stays. */
.site-header {
	position: sticky;
	top: -38px;
	z-index: 200;
	padding: 0 var(--gutter);
}

.edition { height: 38px; }

.edition__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	max-width: var(--wrap);
	height: 100%;
	margin: 0 auto;
	padding: 0 6px;
	font-size: .7rem;
	font-weight: 600;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--navy);
	white-space: nowrap;
}

.edition__name { overflow: hidden; text-overflow: ellipsis; }

.masthead {
	display: flex;
	align-items: center;
	gap: clamp(16px, 2.4vw, 36px);
	max-width: var(--wrap);
	min-height: 72px;
	margin: 0 auto;
	padding: 10px 14px 10px clamp(16px, 2vw, 28px);
	background: rgba(255, 255, 255, .96);
	border-radius: 18px;
	transition: box-shadow .25s ease;
}

.site-header.is-scrolled .masthead { box-shadow: 0 12px 30px -18px rgba(22, 30, 59, .45); }

.masthead__brand { flex: none; }

.site-logo {
	display: block;
	font-stretch: 62%;
	font-weight: 900;
	font-size: 1.9rem;
	line-height: 1;
	letter-spacing: .01em;
	text-transform: uppercase;
	color: var(--navy);
}

.custom-logo-link { display: block; }

.custom-logo {
	display: block;
	width: auto;
	max-height: var(--logo-h);
	max-width: 240px;
	object-fit: contain;
}

.masthead__nav { flex: 1; min-width: 0; }

.nav-primary .nav-list {
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	gap: clamp(.25rem, 1.4vw, 1.6rem);
}

.nav-primary .nav-list > li { position: relative; }

.nav-primary .nav-list a {
	position: relative;
	display: block;
	padding: .6rem .2rem;
	font-size: .76rem;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	white-space: nowrap;
}

.nav-primary .nav-list > li > a::after {
	content: "";
	position: absolute;
	left: .2rem;
	right: .2rem;
	bottom: .25rem;
	height: 2px;
	background: var(--navy);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .25s ease;
}

.nav-primary .nav-list > li > a:hover::after,
.nav-primary .current-menu-item > a::after,
.nav-primary .current-menu-parent > a::after,
.nav-primary .current-category-ancestor > a::after { transform: none; }

.nav-primary .current-menu-item > a::after { background: var(--wine); }

.nav-primary .sub-menu {
	position: absolute;
	top: 100%;
	left: -1rem;
	min-width: 220px;
	padding: .6rem;
	background: #fff;
	border: var(--stroke) solid var(--navy);
	border-radius: 14px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity .15s ease, transform .15s ease, visibility .15s;
}

.nav-primary .sub-menu a { padding: .55rem .7rem; border-radius: 8px; }
.nav-primary .sub-menu a:hover { background: var(--mist-2); }

.nav-primary li:hover > .sub-menu,
.nav-primary li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }

.masthead__cta { flex: none; }

.menu-toggle {
	display: none;
	flex: none;
	align-items: center;
	gap: .55rem;
	height: 46px;
	padding: 0 .65rem 0 1.1rem;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--navy);
	background: #fff;
	border: var(--stroke) solid var(--navy);
	border-radius: var(--pill);
}

.menu-toggle__icon {
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	color: #fff;
	background: var(--navy);
	border-radius: 50%;
}

.menu-toggle__icon .icon { width: 16px; height: 16px; stroke-width: 2.2; }

/* Drawer: a full navy sheet with the desks set as posters. */
.nav-drawer {
	position: fixed;
	top: 8px;
	right: 8px;
	bottom: 8px;
	z-index: 300;
	display: flex;
	flex-direction: column;
	width: min(calc(100% - 16px), 460px);
	padding: 18px 22px 24px;
	overflow-y: auto;
	overscroll-behavior: contain;
	color: #fff;
	background: var(--navy);
	border-radius: var(--r-sheet);
	transform: translateX(calc(100% + 16px));
	visibility: hidden;
	transition: transform .35s cubic-bezier(.2, .8, .2, 1), visibility .35s;
}

.nav-drawer.is-open { transform: none; visibility: visible; }

.nav-drawer__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding-bottom: 18px;
	border-bottom: 1px solid rgba(255, 255, 255, .2);
}

.nav-drawer__brand { padding: 6px 12px; background: #fff; border-radius: 10px; }
.nav-drawer__brand .custom-logo { max-height: 32px; max-width: 200px; }
.nav-drawer__brand .site-logo { font-size: 1.5rem; }

.nav-close {
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	flex: none;
	color: var(--navy);
	background: #fff;
	border: 0;
	border-radius: 50%;
}

.nav-drawer__nav { padding: 18px 0; flex: 1; }

.nav-drawer__nav .nav-list > li > a {
	display: block;
	padding: .3rem 0;
	font-stretch: 62%;
	font-weight: 900;
	font-size: clamp(2.2rem, 9vw, 3rem);
	line-height: 1;
	text-transform: uppercase;
	border-bottom: 1px solid rgba(255, 255, 255, .12);
	padding-block: .55rem;
}

.nav-drawer__nav .current-menu-item > a { color: var(--rose); }

.nav-drawer__nav .sub-menu { padding: .3rem 0 .6rem 1rem; }

.nav-drawer__nav .sub-menu a {
	display: block;
	padding: .35rem 0;
	font-size: .95rem;
	color: var(--mist);
}

.nav-drawer__foot { display: grid; gap: 14px; padding-top: 18px; }

.nav-drawer__pitch { font-size: .98rem; line-height: 1.45; color: var(--mist); }

.nav-drawer__edition {
	font-size: .7rem;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--peri);
	text-align: center;
}

.nav-scrim {
	position: fixed;
	inset: 0;
	z-index: 250;
	background: rgba(22, 30, 59, .45);
	opacity: 0;
	visibility: hidden;
	transition: opacity .3s ease, visibility .3s;
}

.nav-scrim.is-open { opacity: 1; visibility: visible; }

/* Compact masthead: set by main.js whenever the desks stop fitting on one
   row; the media query is the fallback before the script runs. */
.site-header.is-compact .masthead__nav { display: none; }
.site-header.is-compact .masthead__cta { margin-left: auto; }
.site-header.is-compact .menu-toggle { display: inline-flex; }

/* ═══ 5. Sheets ═══════════════════════════════════════════════════════════ */
.sheet {
	position: relative;
	width: 100%;
	max-width: var(--wrap);
	margin: 0 auto;
	padding: var(--pad);
	background: var(--paper);
	border-radius: var(--r-sheet);
}

.sheet--soft { background: linear-gradient(140deg, var(--soft-a) 0%, var(--soft-b) 100%); }

.sheet--navy { background: var(--navy); color: #fff; }
.sheet--navy .display { color: #fff; }
.sheet--navy .sheet__dots { color: #fff; }
.sheet--navy .script-over { color: var(--rose); }
.sheet--navy .sheet__lede { color: var(--mist); }

.sheet__titlebar {
	display: grid;
	grid-template-columns: auto minmax(0, 420px);
	align-items: end;
	justify-content: space-between;
	gap: 1.2rem 3rem;
	margin-bottom: clamp(24px, 3vw, 40px);
}

.sheet__titlebar--center {
	grid-template-columns: 1fr;
	justify-items: center;
	text-align: center;
}

.sheet__titlebar--center .sheet__lede { max-width: 46ch; }

.sheet__lede {
	font-size: 1rem;
	line-height: 1.55;
	color: var(--text-2);
}

.duo .sheet__lede,
.duo .display { margin-bottom: 1rem; }

/* ═══ 6. Poster ═══════════════════════════════════════════════════════════ */

/* Default: a centred stack — 404, thank-you and tool pages. */
.poster {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 1.2rem;
	padding: clamp(10px, 3vw, 40px) 0;
}

.poster__intro {
	max-width: 44ch;
	font-size: 1.05rem;
	line-height: 1.45;
	color: var(--text-2);
}

.poster__title {
	font-size: clamp(3.4rem, 11vw, 9.5rem);
	max-width: 14ch;
}

.poster__title a { transition: color .2s ease; }
.poster__title a:hover { color: var(--navy-2); }

.poster__script {
	margin-top: -.55em;
	font-family: var(--script);
	font-size: clamp(3.6rem, 9vw, 7rem);
	line-height: 1;
	color: var(--wine);
	transform: rotate(-6deg);
}

.poster__badge {
	display: grid;
	place-items: center;
	width: 64px;
	height: 64px;
	color: #fff;
	background: var(--navy);
	border-radius: 50%;
}

.poster__badge .icon { width: 30px; height: 30px; stroke-width: 2.2; }

.poster__foot--center { justify-content: center; }

/* The lead story: intro top-left, the headline across, the photograph in
   an arch overlapping it, the desk in script, facts and action at the foot. */
.poster--lead {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	align-items: start;
	gap: 0 clamp(12px, 2vw, 28px);
	text-align: left;
	padding: 0;
}

.poster--lead .poster__intro {
	grid-column: 1 / 4;
	grid-row: 1;
	padding-top: .6rem;
	font-size: 1.12rem;
	color: var(--navy);
}

.poster--lead .poster__title {
	grid-column: 4 / 13;
	grid-row: 1;
	max-width: none;
	font-size: clamp(3.4rem, 9.4vw, 8.8rem);
}

.poster--lead.lead--medium .poster__title { font-size: clamp(3rem, 6.8vw, 6.6rem); }
.poster--lead.lead--long .poster__title { font-size: clamp(2.6rem, 5vw, 5rem); }

.poster__art {
	position: relative;
	grid-column: 5 / 10;
	grid-row: 2;
	z-index: 2;
	margin-top: clamp(14px, 2vw, 26px);
	padding: 0 6%;
}

.poster__photo {
	display: block;
	aspect-ratio: 4 / 4.4;
	overflow: hidden;
	border-radius: 999px 999px 18px 18px;
	background: var(--mist);
	box-shadow: 0 0 0 8px #fff;
}

.poster__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .6s ease;
}

.poster__photo:hover img { transform: scale(1.03); }

.poster--lead .poster__script {
	position: absolute;
	left: -18%;
	bottom: 4%;
	margin: 0;
	font-size: clamp(3.6rem, 8vw, 7.4rem);
	transform: rotate(-10deg);
	white-space: nowrap;
	text-shadow: 0 0 18px rgba(255, 255, 255, .9);
}

.poster__foot {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px;
}

.poster--lead .poster__foot { display: contents; }

.poster--lead .poster__foot .statbox {
	grid-column: 1 / 5;
	grid-row: 2;
	align-self: end;
	justify-self: start;
}

.poster--lead .poster__foot .btn {
	grid-column: 10 / 13;
	grid-row: 2;
	align-self: end;
	justify-self: end;
}

/* ═══ 7. Board & dossier ══════════════════════════════════════════════════ */
.duo {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--gap);
	width: 100%;
	max-width: var(--wrap);
	margin: 0 auto;
}

.duo__item { max-width: none; }

.duo__item--desks .chips--stack {
	flex-direction: column;
	align-items: flex-start;
	padding-right: 190px;
}

.duo__item--desks .chips--stack li:nth-child(even) { margin-left: clamp(16px, 3vw, 44px); }

.duo__seal {
	position: absolute;
	right: clamp(18px, 3vw, 40px);
	bottom: clamp(18px, 3vw, 40px);
}

/* The long view. */
.dossier {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--gap);
}

.dossier__panel { display: flex; flex-direction: column; }

/* Panels: the data boards. */
.panel {
	position: relative;
	padding: 14px 16px 18px;
	background: #fff;
	border: var(--stroke) solid var(--navy);
	border-radius: var(--r-panel);
}

.panel__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 16px;
}

.panel__title {
	padding: .5em 1.1em;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .16em;
	line-height: 1.2;
	text-transform: uppercase;
	color: #fff;
	background: var(--navy);
	border-radius: var(--pill);
}

.panel__dots { color: var(--navy); }

.panel__foot {
	margin-top: auto;
	padding-top: 14px;
	font-size: .78rem;
	line-height: 1.45;
	color: var(--text-3);
}

.panel__text { margin-bottom: 1rem; font-size: .95rem; line-height: 1.5; }

.panel--navy { background: var(--navy); color: #fff; border-color: var(--navy); }
.panel--navy .panel__title { background: #fff; color: var(--navy); }
.panel--navy .panel__dots { color: #fff; }
.panel--navy .panel__text { color: var(--mist); }

/* Donut. */
.donut {
	display: grid;
	justify-items: center;
	gap: 18px;
}

.donut__svg { width: 150px; height: 150px; }
.donut__track { fill: none; stroke: var(--mist); stroke-width: 7; }
.donut__value { fill: none; stroke: var(--navy); stroke-width: 7; }

.donut__legend { display: grid; gap: .5rem; width: 100%; font-size: .85rem; line-height: 1.3; }

.donut__legend li {
	display: flex;
	align-items: baseline;
	gap: 8px;
	padding-top: .5rem;
	border-top: 1px solid var(--line);
}

.donut__legend strong {
	font-stretch: 62%;
	font-weight: 900;
	font-size: 1.5rem;
	line-height: 1;
}

.key {
	display: inline-block;
	width: 12px;
	height: 12px;
	border-radius: 3px;
}

.key--solid { background: var(--navy); }
.key--hollow { border: 2px solid var(--navy); background: var(--mist); }

/* Horizontal bars. */
.hbars { display: grid; gap: 10px; }

.hbars__row {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 4px 10px;
	align-items: baseline;
}

.hbars__label { font-size: .8rem; font-weight: 600; line-height: 1.25; }
.hbars__label small { font-weight: 400; color: var(--text-3); }

.hbars__value {
	font-stretch: 62%;
	font-weight: 900;
	font-size: 1.05rem;
	font-variant-numeric: tabular-nums;
}

.hbars__label { grid-row: 1; grid-column: 1; }
.hbars__value { grid-row: 1; grid-column: 2; }

.hbars__track {
	grid-row: 2;
	grid-column: 1 / -1;
	height: 9px;
	background: var(--mist-2);
	border: 1px solid var(--navy);
	border-radius: var(--pill);
	overflow: hidden;
}

.hbars__bar { display: block; height: 100%; background: var(--navy); border-radius: var(--pill); }

/* Columns. */
.cols {
	display: grid;
	grid-template-columns: repeat(11, minmax(0, 1fr));
	gap: 4px;
	height: 230px;
	margin: 0;
}

.cols__col {
	display: grid;
	grid-template-rows: auto 1fr auto;
	gap: 4px;
	min-width: 0;
	text-align: center;
}

.cols__value { font-size: .62rem; font-weight: 700; color: var(--text-2); font-variant-numeric: tabular-nums; }
.cols__label { font-size: .62rem; color: var(--text-3); }

.cols__track { position: relative; display: block; }

.cols__bar {
	position: absolute;
	left: 12%;
	right: 12%;
	bottom: 0;
	background: var(--navy);
	border-radius: 4px 4px 1px 1px;
}

.cols__col--down .cols__bar { background: transparent; border: 1.5px solid var(--navy); }
.cols__col--down .cols__value { color: var(--wine); }

/* Line. */
.line { display: grid; gap: 12px; }

.line__svg { width: 100%; height: 170px; overflow: visible; }

.line__grid { fill: none; stroke: var(--mist); stroke-width: 1; vector-effect: non-scaling-stroke; stroke-dasharray: 3 4; }

.line__path {
	fill: none;
	stroke: var(--navy);
	stroke-width: 2.5;
	stroke-linejoin: round;
	stroke-linecap: round;
	vector-effect: non-scaling-stroke;
}

.line__result { display: grid; gap: 2px; }

.line__result strong {
	font-stretch: 62%;
	font-weight: 900;
	font-size: 2rem;
	line-height: 1;
}

.line__result span { font-size: .78rem; color: var(--text-3); }

/* ═══ 8. Tiles, wire & cards ══════════════════════════════════════════════ */

/* Desk tiles — the reference's "my work includes". */
.tiles {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: clamp(20px, 2.6vw, 34px) clamp(14px, 2vw, 26px);
	margin-top: clamp(24px, 3vw, 40px);
}

.tile { display: grid; gap: .5rem; align-content: start; grid-column: span 2; }

/* Five desks: two wide tiles over three; four: a two-by-two. */
.tiles:has(> .tile:nth-child(5):last-child) > .tile:nth-child(-n + 2),
.tiles:has(> .tile:nth-child(4):last-child) > .tile,
.tiles:has(> .tile:nth-child(2):last-child) > .tile { grid-column: span 3; }

.tiles:has(> .tile:nth-child(5):last-child) > .tile:nth-child(-n + 2) .tile__media { aspect-ratio: 16 / 9; }

.tile__media {
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: 6px;
	background: var(--mist);
}

.tile__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.tile__media:hover img { transform: scale(1.04); }

.tile__desk {
	margin-top: .3rem;
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
}

.tile__desk a:hover { color: var(--wine); }

.tile__title { font-size: .98rem; line-height: 1.4; color: var(--text-2); }
.tile__title a:hover { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }

/* The wire's filter bar: one outlined capsule of segments. */
.filters {
	display: inline-flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 4px;
	margin-top: 1.4rem;
	padding: 4px;
	border: var(--stroke) solid rgba(255, 255, 255, .55);
	border-radius: 18px;
}

.filters__btn {
	padding: .55rem 1.1rem;
	font-size: .7rem;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #fff;
	background: transparent;
	border: 0;
	border-radius: 14px;
	transition: background-color .2s ease, color .2s ease;
}

.filters__btn:hover { background: rgba(255, 255, 255, .12); }
.filters__btn.is-active { background: #fff; color: var(--navy); }

/* Feed: three columns, the middle one dropped like the reference. */
.feed {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(16px, 2.4vw, 32px);
	align-items: start;
	padding-bottom: 48px;
}

.feed > .card:nth-child(3n + 2) { margin-top: 56px; }
.is-filtered .feed > .card,
.feed--flat > .card:nth-child(3n + 2) { margin-top: 0; }
.feed--flat { padding-bottom: 0; margin-top: clamp(24px, 3vw, 40px); }

/* Card — a post in a feed. */
.card {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 10px 10px 16px;
	color: var(--navy);
	background: #fff;
	border-radius: 16px;
}

.sheet:not(.sheet--navy) .card { border: var(--stroke) solid var(--line); }

.card__top {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 8px;
	padding: 2px 4px;
}

.card__rings { width: 30px; }

.card__desk { font-size: .78rem; font-weight: 700; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.card__desk a:hover { color: var(--wine); }

.card__date { font-size: .72rem; color: var(--text-3); white-space: nowrap; }

.card__media {
	display: block;
	aspect-ratio: 4 / 4.2;
	overflow: hidden;
	border-radius: 10px;
	background: var(--mist);
}

.card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.card__media:hover img { transform: scale(1.04); }

.card__placeholder {
	display: grid;
	place-items: center;
	width: 100%;
	height: 100%;
	color: var(--peri);
}

.card__placeholder .rings { width: 30%; color: currentColor; }

.card__body { display: grid; gap: 8px; padding: 0 4px; }

.card__title {
	font-size: 1.08rem;
	font-weight: 700;
	line-height: 1.3;
	text-wrap: pretty;
}

.card__title a:hover { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1.5px; }

.card__excerpt { font-size: .9rem; line-height: 1.5; color: var(--text-2); }

.card__read { font-size: .72rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); }

/* ═══ 9. Desk bands ═══════════════════════════════════════════════════════ */
.band__head {
	display: grid;
	grid-template-columns: auto minmax(0, 380px);
	align-items: end;
	justify-content: space-between;
	gap: 1rem 3rem;
	margin-bottom: clamp(22px, 3vw, 36px);
}

.band__title { font-size: clamp(3rem, 7vw, 5.6rem); }
.band__title a:hover { color: var(--navy-2); }

.band__aside { display: grid; gap: .9rem; justify-items: end; text-align: right; padding-bottom: .4rem; }
.band__note { font-size: .95rem; line-height: 1.5; color: var(--text-2); }

/* Case file — the reference's case study. */
.casefile { display: grid; gap: var(--gap); }

.casefile__lead {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: var(--gap);
}

.casefile__text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1rem;
	padding: clamp(20px, 2.6vw, 34px);
	color: #fff;
	background: var(--navy);
	border-radius: 6px;
}

.casefile__date { font-size: .72rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--peri); }

.casefile__title {
	font-size: clamp(1.5rem, 2.4vw, 2rem);
	font-weight: 700;
	line-height: 1.15;
	text-wrap: balance;
}

.casefile__title a:hover { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 2px; }

.casefile__excerpt { font-size: 1rem; line-height: 1.55; color: var(--mist); }

.casefile__text .btn { margin-top: auto; }

.casefile__media {
	display: block;
	min-height: 320px;
	overflow: hidden;
	border: var(--stroke) solid var(--navy);
	border-radius: 6px;
	background: var(--mist);
}

.casefile__media img { width: 100%; height: 100%; object-fit: cover; }

.casefile__rail {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--gap);
}

.rowcard {
	display: grid;
	grid-template-columns: 84px 1fr;
	gap: 14px;
	align-items: center;
	padding: 10px;
	border: var(--stroke) solid var(--navy);
	border-radius: 12px;
}

.rowcard__media {
	display: block;
	aspect-ratio: 1;
	overflow: hidden;
	border-radius: 8px;
	background: var(--mist);
}

.rowcard__media img { width: 100%; height: 100%; object-fit: cover; }

.rowcard__body { display: grid; gap: 4px; min-width: 0; }

.rowcard__title {
	font-size: .95rem;
	font-weight: 700;
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.rowcard__title a:hover { text-decoration: underline; text-underline-offset: 3px; }
.rowcard__date { font-size: .72rem; color: var(--text-3); }

/* Gallery — the reference's photography strip. */
.gallery {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(12px, 1.6vw, 22px);
}

.shot { display: grid; gap: .45rem; align-content: start; }

.shot__media {
	display: block;
	aspect-ratio: 3 / 4;
	overflow: hidden;
	border: var(--stroke) solid var(--navy);
	border-radius: 4px;
	background: var(--mist);
}

.shot__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.shot__media:hover img { transform: scale(1.04); }

.shot__date { margin-top: .3rem; font-size: .7rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }

.shot__title { font-size: .92rem; font-weight: 500; line-height: 1.4; color: var(--text-2); }
.shot__title a:hover { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }

/* ═══ 10. Single, pages & archives ════════════════════════════════════════ */
.story__head {
	display: grid;
	gap: 1.2rem;
	max-width: 1080px;
	margin-bottom: clamp(24px, 3vw, 40px);
}

.story__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .6rem 1.2rem;
	font-size: .74rem;
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--text-2);
}

.story__meta .chip { font-size: .74rem; letter-spacing: .12em; text-transform: uppercase; }

.story__title { font-size: clamp(3rem, 7.4vw, 6.6rem); }
.story.lead--medium .story__title { font-size: clamp(2.6rem, 5.8vw, 5.2rem); }
.story.lead--long .story__title { font-size: clamp(2.3rem, 4.6vw, 4.2rem); }

.story__dek { max-width: 60ch; font-size: 1.2rem; line-height: 1.5; color: var(--text-2); }

.story__media {
	margin-bottom: clamp(28px, 4vw, 52px);
	overflow: hidden;
	border-radius: 14px;
	background: var(--mist);
}

.story__media img { width: 100%; max-height: 620px; object-fit: cover; }

.content-sidebar {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 340px;
	gap: clamp(32px, 5vw, 64px);
	align-items: start;
}

.story__body { min-width: 0; }

/* Article typography. */
.entry-content {
	max-width: 70ch;
	font-size: 1.125rem;
	line-height: 1.72;
	color: #2a3558;
}

.entry-content > * + * { margin-top: 1.3em; }

.entry-content h2,
.entry-content h3,
.entry-content h4 { color: var(--navy); margin-top: 1.8em; }

.entry-content h2 {
	font-stretch: 62%;
	font-weight: 900;
	font-size: clamp(2rem, 3.4vw, 2.6rem);
	line-height: .95;
	text-transform: uppercase;
}

.entry-content h3 { font-size: 1.35rem; font-weight: 700; line-height: 1.3; }
.entry-content h4 { font-size: 1.1rem; font-weight: 700; }

.entry-content a {
	color: var(--navy);
	font-weight: 600;
	text-decoration: underline;
	text-decoration-color: var(--wine);
	text-decoration-thickness: 1.5px;
	text-underline-offset: 3px;
}

.entry-content a:hover { color: var(--wine); }

.entry-content ul,
.entry-content ol { padding-left: 1.3em; }

.entry-content ul { list-style: none; }
.entry-content ol { list-style: decimal; }

.entry-content ul > li { position: relative; }

.entry-content ul > li::before {
	content: "";
	position: absolute;
	left: -1.1em;
	top: .68em;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--navy);
}

.entry-content li + li { margin-top: .45em; }

.entry-content blockquote {
	padding: 1.2em 1.4em;
	font-size: 1.25rem;
	font-weight: 500;
	line-height: 1.5;
	color: var(--navy);
	background: var(--mist-2);
	border-left: 4px solid var(--wine);
	border-radius: 0 12px 12px 0;
}

.entry-content blockquote cite { display: block; margin-top: .6em; font-size: .85rem; font-style: normal; color: var(--text-3); }

.entry-content img { border-radius: 10px; }

.entry-content figcaption,
.entry-content .wp-caption-text { margin-top: .6em; font-size: .85rem; color: var(--text-3); }

.entry-content table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.entry-content th,
.entry-content td { padding: .65em .8em; border-bottom: 1px solid var(--line); text-align: left; }
.entry-content th { font-weight: 700; color: var(--navy); background: var(--mist-2); }

.entry-content hr { border: 0; border-top: 1.5px solid var(--line); margin: 2.2em 0; }

.entry-content .alignleft { float: left; margin: .3em 1.4em 1em 0; max-width: 50%; }
.entry-content .alignright { float: right; margin: .3em 0 1em 1.4em; max-width: 50%; }
.entry-content .aligncenter { margin-inline: auto; }

.entry-content--intro { margin: 0 auto 2rem; text-align: center; }
.entry-content--center { margin: 0 auto; text-align: center; }
.entry-content--page { margin: 0 auto; }

/* Share. */
.share-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-top: 2.4rem;
	padding-top: 1.6rem;
	border-top: 1.5px solid var(--line);
}

.share-row__label { margin-right: .4rem; font-size: .72rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }

.share-row__link {
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	color: var(--navy);
	border: var(--stroke) solid var(--navy);
	border-radius: 50%;
	transition: background-color .2s ease, color .2s ease;
}

.share-row__link svg { width: 17px; height: 17px; fill: currentColor; }
.share-row__link:hover { background: var(--navy); color: #fff; }

/* Previous / next. */
.post-nav {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--gap);
	margin-top: 2rem;
}

.post-nav__item {
	display: grid;
	gap: .4rem;
	padding: 1.1rem 1.2rem;
	border: var(--stroke) solid var(--navy);
	border-radius: 14px;
	transition: background-color .2s ease, color .2s ease;
}

.post-nav__item--next { text-align: right; grid-column: 2; }
.post-nav__item:hover { background: var(--navy); color: #fff; }

.post-nav__label { font-size: .7rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; opacity: .7; }
.post-nav__title { font-weight: 700; line-height: 1.3; }

/* Archive head. */
.archive-head {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: end;
	gap: 1.4rem 3rem;
	margin-bottom: clamp(28px, 4vw, 48px);
	padding-bottom: clamp(22px, 3vw, 34px);
	border-bottom: 1.5px solid var(--navy);
}

.archive-head__title { font-size: clamp(3.4rem, 10vw, 8.4rem); }

.archive-head__aside { display: grid; gap: 1rem; justify-items: end; max-width: 420px; }

.archive-head__desc { font-size: 1rem; line-height: 1.5; color: var(--text-2); text-align: right; }

.archive-head--page { grid-template-columns: 1fr; text-align: center; justify-items: center; border: 0; }
.archive-head--page .archive-head__title { font-size: clamp(2.8rem, 7vw, 6rem); }
.archive-head__updated { font-size: .74rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--text-3); }

.page-article .entry-content { max-width: 72ch; }

.grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(14px, 2vw, 24px);
}

.no-results { display: grid; gap: 1.2rem; justify-items: start; padding: 2rem 0; font-size: 1.05rem; }

/* Pagination. */
.pagination { margin-top: 2.4rem; }

.pagination .nav-links,
nav.pagination:not(:has(.nav-links)) {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
}

.pagination .page-numbers,
nav.pagination > a,
nav.pagination > span {
	display: inline-grid;
	place-items: center;
	min-width: 44px;
	height: 44px;
	padding: 0 1rem;
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	border: var(--stroke) solid var(--navy);
	border-radius: var(--pill);
}

.pagination .page-numbers.current,
.pagination a.page-numbers:hover { background: var(--navy); color: #fff; }
.pagination .page-numbers.dots { border-color: transparent; }

/* ═══ 11. Sidebar & panels ════════════════════════════════════════════════ */
.sidebar { display: grid; gap: 18px; min-width: 0; }

.sidebar .chips--stack li { display: contents; }

/* The rail is too narrow for field and button side by side. */
.sidebar .st-form__row { flex-direction: column; align-items: stretch; }
.sidebar .st-form .wpcf7-submit { width: 100%; }

/* ═══ 12. Widgets ═════════════════════════════════════════════════════════ */

/* Fields shared by the calculators. */
.field { display: grid; gap: .45rem; margin-top: 1rem; }

.field__label {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 1rem;
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.field__label output {
	font-stretch: 62%;
	font-weight: 900;
	font-size: 1.3rem;
	letter-spacing: 0;
	font-variant-numeric: tabular-nums;
}

.field__input {
	position: relative;
	display: flex;
	align-items: center;
	height: 50px;
	padding: 0 1rem;
	background: #fff;
	border: var(--stroke) solid var(--navy);
	border-radius: 12px;
}

.field__input:focus-within { box-shadow: 0 0 0 3px var(--mist); }

.field__input input {
	flex: 1;
	min-width: 0;
	height: 100%;
	padding: 0;
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--navy);
	background: transparent;
	border: 0;
	outline: none;
	font-variant-numeric: tabular-nums;
	-moz-appearance: textfield;
}

.field__input input::-webkit-outer-spin-button,
.field__input input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.field__input--money::before { content: "$"; margin-right: .3rem; font-weight: 700; color: var(--text-3); }
.field__input--pct::after { content: "%"; margin-left: .3rem; font-weight: 700; color: var(--text-3); }

/* Range sliders. */
.range {
	-webkit-appearance: none;
	appearance: none;
	width: 100%;
	height: 26px;
	margin: 0;
	background: transparent;
}

.range::-webkit-slider-runnable-track { height: 6px; background: var(--mist); border-radius: var(--pill); }
.range::-moz-range-track { height: 6px; background: var(--mist); border-radius: var(--pill); }

.range::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 22px;
	height: 22px;
	margin-top: -8px;
	background: var(--navy);
	border: 3px solid #fff;
	border-radius: 50%;
	box-shadow: 0 0 0 1.5px var(--navy);
	cursor: grab;
}

.range::-moz-range-thumb {
	width: 18px;
	height: 18px;
	background: var(--navy);
	border: 3px solid #fff;
	border-radius: 50%;
	box-shadow: 0 0 0 1.5px var(--navy);
	cursor: grab;
}

/* Sessions. */
.sessions__list { display: grid; gap: 8px; }

.session {
	display: grid;
	grid-template-columns: 28px 1fr auto;
	gap: 12px;
	align-items: center;
	padding: .65rem .9rem;
	background: #fff;
	border: var(--stroke) solid var(--navy);
	border-radius: 12px;
}

.session__mark {
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	color: transparent;
	border: var(--stroke) solid var(--navy);
	border-radius: 50%;
}

.session__mark .icon { width: 15px; height: 15px; stroke-width: 2.6; }

.session--open .session__mark { background: var(--navy); color: #fff; }
.session--lunch .session__mark { background: var(--mist); }

.session__body { display: grid; min-width: 0; }

.session__name { font-size: .95rem; font-weight: 700; line-height: 1.25; }
.session__name small { margin-left: .2rem; font-size: .7rem; font-weight: 600; letter-spacing: .1em; color: var(--text-3); }
.session__note { font-size: .78rem; color: var(--text-2); }
.session--open .session__note { color: var(--navy); font-weight: 600; }

.session__time {
	font-stretch: 62%;
	font-weight: 900;
	font-size: 1.6rem;
	line-height: 1;
	font-variant-numeric: tabular-nums;
}

.session--closed .session__time { color: var(--text-3); }

.sessions__foot { margin-top: .8rem; font-size: .74rem; color: var(--text-3); }

/* Cash melt. */
.melt__intro { font-size: .92rem; line-height: 1.5; color: var(--text-2); }

.melt__result {
	display: grid;
	gap: .3rem;
	margin-top: 1.2rem;
	padding: 1rem;
	background: var(--mist-2);
	border-radius: 12px;
}

.melt__value {
	font-stretch: 62%;
	font-weight: 900;
	font-size: 2.6rem;
	line-height: 1;
	font-variant-numeric: tabular-nums;
}

.melt__label { font-size: .82rem; color: var(--text-2); }

.melt__meter {
	display: block;
	height: 10px;
	margin-top: .5rem;
	background: #fff;
	border: 1px solid var(--navy);
	border-radius: var(--pill);
	overflow: hidden;
}

.melt__kept { display: block; height: 100%; background: var(--navy); transition: width .3s ease; }

.melt__compare { margin: .9rem 0 1rem; font-size: .82rem; line-height: 1.5; color: var(--text-2); }

/* ═══ 13. Debt Payoff Planner ═════════════════════════════════════════════ */
.planner {
	display: grid;
	grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
	gap: var(--gap);
	align-items: start;
	margin-top: clamp(16px, 3vw, 32px);
	text-align: left;
}

.planner__inputs .chips { margin-bottom: .4rem; }
.planner__inputs .chip { font-size: .85rem; }

.planner__warn {
	margin-top: 1rem;
	padding: .8rem 1rem;
	font-size: .88rem;
	line-height: 1.45;
	color: var(--wine);
	border: var(--stroke) solid var(--wine);
	border-radius: 12px;
}

.planner__results { display: grid; gap: var(--gap); min-width: 0; }

.planner__results .statbox { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
.planner__results .statbox__item strong { font-size: clamp(1.6rem, 3vw, 2.4rem); }

.payoff-chart {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	grid-template-areas: "y plot" ". x";
	column-gap: 10px;
	padding-top: 26px;
}

.payoff-chart__y { grid-area: y; position: relative; min-width: 3.6em; }

.payoff-chart__y span {
	position: absolute;
	right: 0;
	transform: translateY(-50%);
	font-size: .7rem;
	font-weight: 600;
	color: var(--text-3);
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.payoff-chart__plot { grid-area: plot; position: relative; }

.payoff-chart svg { width: 100%; height: 220px; }

.payoff-chart__x {
	grid-area: x;
	display: flex;
	justify-content: space-between;
	margin-top: 6px;
	font-size: .7rem;
	font-weight: 600;
	color: var(--text-3);
}

/* Where each line reaches $0. */
.payoff-chart__dot {
	position: absolute;
	bottom: 3.64%;
	width: 12px;
	height: 12px;
	margin: 0 0 -6px -6px;
	background: var(--navy);
	border: 2px solid #fff;
	border-radius: 50%;
	box-shadow: 0 0 0 1.5px var(--navy);
}

.payoff-chart__dot--base { background: #fff; }

.payoff-chart__dot em {
	position: absolute;
	bottom: 16px;
	left: 50%;
	transform: translateX(-50%);
	padding: .2em .6em;
	font-size: .68rem;
	font-style: normal;
	font-weight: 700;
	color: #fff;
	background: var(--navy);
	border: 1px solid var(--navy);
	border-radius: var(--pill);
	white-space: nowrap;
}

.payoff-chart__dot--base em { color: var(--navy); background: #fff; }

.payoff-chart__dot.is-end em { left: auto; right: -4px; transform: none; }

.payoff-chart__grid { fill: none; stroke: var(--mist); stroke-width: 1; stroke-dasharray: 3 4; vector-effect: non-scaling-stroke; }

.payoff-chart__base,
.payoff-chart__fast {
	fill: none;
	stroke: var(--navy);
	stroke-linejoin: round;
	stroke-linecap: round;
	vector-effect: non-scaling-stroke;
}

.payoff-chart__base { stroke-width: 2; stroke-dasharray: 6 5; opacity: .6; }
.payoff-chart__fast { stroke-width: 3.5; }

.legend { display: flex; flex-wrap: wrap; gap: .6rem 1.4rem; margin-top: .8rem; font-size: .8rem; color: var(--text-2); }
.legend li { display: inline-flex; align-items: center; gap: .5rem; }
.legend__note { flex-basis: 100%; color: var(--text-3); }

.key--line,
.key--dash { width: 22px; height: 0; border-radius: 0; background: none; border-top: 3px solid var(--navy); }
.key--dash { border-top: 2px dashed var(--navy); opacity: .7; }

.compare {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--gap);
}

.compare__col {
	padding: 1.1rem 1.2rem;
	background: #fff;
	border: var(--stroke) solid var(--navy);
	border-radius: var(--r-panel);
}

.compare__col--navy { background: var(--navy); color: #fff; }

.compare__title {
	margin-bottom: .6rem;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
}

.compare dl div {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 1rem;
	padding: .55rem 0;
	border-top: 1px solid var(--line);
}

.compare__col--navy dl div { border-color: rgba(255, 255, 255, .2); }

.compare dt { font-size: .85rem; opacity: .8; }
.compare dd { font-stretch: 62%; font-weight: 900; font-size: 1.35rem; text-align: right; font-variant-numeric: tabular-nums; }

.planner__note { grid-column: 1 / -1; font-size: .8rem; line-height: 1.5; color: var(--text-3); max-width: 80ch; }

/* ═══ 14. Forms (Contact Form 7) ══════════════════════════════════════════ */
.st-form { display: grid; gap: .9rem; text-align: left; }

.st-form .wpcf7 { margin: 0; }
.st-form .hidden-fields-container { display: none; }
.st-form .wpcf7-form { display: grid; gap: .9rem; }

.st-form__row { display: flex; gap: 8px; align-items: flex-start; }

.st-form__field { flex: 1; min-width: 0; display: block; }

.st-form .wpcf7-form-control-wrap { position: relative; display: block; }

.st-form input[type="email"],
.st-form input[type="text"] {
	width: 100%;
	height: 54px;
	padding: 0 1.3rem;
	font-size: 1rem;
	font-weight: 500;
	color: var(--navy);
	background: #fff;
	border: var(--stroke) solid var(--navy);
	border-radius: var(--pill);
	outline: none;
	transition: box-shadow .15s ease;
}

.st-form input[type="email"]::placeholder { color: var(--text-3); }
.st-form input[type="email"]:focus { box-shadow: 0 0 0 4px var(--mist); }

.st-form .st-form__submit-wrap { position: relative; flex: none; }

.st-form .wpcf7-submit {
	height: 54px;
	padding: 0 1.6rem;
	font-size: .76rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #fff;
	background: var(--navy);
	border: var(--stroke) solid var(--navy);
	border-radius: var(--pill);
	transition: background-color .2s ease;
}

.st-form .wpcf7-submit:hover { background: var(--navy-2); }
.st-form .wpcf7-submit:disabled { opacity: .55; cursor: not-allowed; }

.st-form--dark input[type="email"] { border-color: #fff; }
.st-form--dark .wpcf7-submit { color: var(--navy); background: #fff; border-color: #fff; }
.st-form--dark .wpcf7-submit:hover { background: var(--mist-2); }

.st-form__consent { font-size: .78rem; line-height: 1.45; color: var(--text-2); }

.st-form .wpcf7-list-item { display: block; margin: 0; }

.st-form .wpcf7-acceptance label {
	display: grid;
	grid-template-columns: 20px 1fr;
	gap: 10px;
	align-items: start;
	cursor: pointer;
}

.st-form .wpcf7-acceptance input[type="checkbox"] {
	-webkit-appearance: none;
	appearance: none;
	display: grid;
	place-items: center;
	width: 20px;
	height: 20px;
	margin: 0;
	background: #fff;
	border: var(--stroke) solid var(--navy);
	border-radius: 6px;
	cursor: pointer;
}

.st-form .wpcf7-acceptance input[type="checkbox"]::after {
	content: "";
	width: 5px;
	height: 10px;
	margin-top: -2px;
	border: solid #fff;
	border-width: 0 2.5px 2.5px 0;
	transform: rotate(45deg) scale(0);
	transition: transform .12s ease;
}

.st-form .wpcf7-acceptance input[type="checkbox"]:checked { background: var(--navy); }
.st-form .wpcf7-acceptance input[type="checkbox"]:checked::after { transform: rotate(45deg) scale(1); }

.st-form--dark .wpcf7-acceptance input[type="checkbox"] { border-color: #fff; background: transparent; }
.st-form--dark .wpcf7-acceptance input[type="checkbox"]:checked { background: #fff; }
.st-form--dark .wpcf7-acceptance input[type="checkbox"]::after { border-color: var(--navy); }

.st-form .wpcf7-list-item-label a { font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }

.st-form--dark .st-form__consent,
.st-form--dark .wpcf7-list-item-label { color: var(--mist); }

.st-form .wpcf7-not-valid-tip {
	display: block;
	margin-top: 6px;
	padding-left: 1.3rem;
	font-size: .78rem;
	font-weight: 600;
	color: var(--wine);
}

.st-form--dark .wpcf7-not-valid-tip { color: var(--rose); }

.st-form input.wpcf7-not-valid { border-color: var(--wine); }

.st-form .wpcf7-acceptance.wpcf7-not-valid input[type="checkbox"],
.st-form .wpcf7-not-valid .wpcf7-acceptance input[type="checkbox"] { border-color: var(--wine); box-shadow: 0 0 0 3px rgba(143, 29, 44, .18); }

.st-form .wpcf7-response-output {
	margin: 0;
	padding: .8rem 1rem;
	font-size: .9rem;
	font-weight: 600;
	line-height: 1.4;
	color: var(--navy);
	background: var(--mist-2);
	border: var(--stroke) solid var(--navy);
	border-radius: 12px;
}

.st-form form.init .wpcf7-response-output,
.st-form form.resetting .wpcf7-response-output,
.st-form form.submitting .wpcf7-response-output { display: none; }

.st-form form.failed .wpcf7-response-output,
.st-form form.aborted .wpcf7-response-output,
.st-form form.spam .wpcf7-response-output { color: var(--wine); border-color: var(--wine); background: #fbeef0; }

.st-form form.sent .wpcf7-response-output {
	position: relative;
	padding: 1rem 1rem 1rem 3.2rem;
	font-size: 1rem;
	background: #fff;
}

.st-form form.sent .wpcf7-response-output::before {
	content: "";
	position: absolute;
	left: 1rem;
	top: 50%;
	width: 26px;
	height: 26px;
	margin-top: -13px;
	border-radius: 50%;
	background: var(--navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 15px no-repeat;
}

.st-form form.sent .st-form__row,
.st-form form.sent .st-form__consent { display: none; }

.st-form .wpcf7-spinner { display: none !important; }

.st-form form.submitting .wpcf7-submit { opacity: .6; cursor: wait; pointer-events: none; }

.grecaptcha-badge { visibility: hidden !important; }

.st-form .st-form__recaptcha { display: block; white-space: normal; }
.st-form__recaptcha a { text-decoration: underline; text-underline-offset: 2px; }

.st-form .wpcf7 [inert] { opacity: .6; }

.st-form__legal {
	display: grid;
	gap: .1rem;
	font-size: .7rem;
	line-height: 1.45;
	color: var(--text-3);
	white-space: pre-line;
}

.st-form__company { font-weight: 700; }
.st-form--dark .st-form__legal { color: var(--peri); }

/* ═══ 15. Newsletter band & modal ═════════════════════════════════════════ */
.cta {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(28px, 4vw, 64px);
	align-items: center;
	margin: var(--gap) auto 0;
	width: calc(100% - 2 * var(--gutter));
}

.cta__pitch { display: grid; gap: 1.6rem; }

.cta .checks { color: #fff; }
.cta .check { border-color: rgba(255, 255, 255, .45); }
.cta .check__mark { background: #fff; color: var(--navy); }

.cta__card {
	display: grid;
	gap: 1rem;
	padding: clamp(20px, 3vw, 34px);
	color: var(--navy);
	background: #fff;
	border-radius: var(--r-panel);
}

.cta__lead { font-size: 1rem; font-weight: 600; line-height: 1.45; }

/* Modal. */
.st-modal {
	position: fixed;
	inset: 0;
	z-index: 400;
	display: grid;
	place-items: center;
	padding: 12px;
	opacity: 0;
	transition: opacity .25s ease;
}

.st-modal.is-open { opacity: 1; }

.st-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(22, 30, 59, .6);
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
}

.st-modal__dialog {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	width: min(100%, 840px);
	max-height: calc(100dvh - 24px);
	overflow-y: auto;
	overscroll-behavior: contain;
	background: #fff;
	border-radius: var(--r-sheet);
	transform: translateY(14px);
	transition: transform .3s cubic-bezier(.2, .8, .2, 1);
}

.st-modal.is-open .st-modal__dialog { transform: none; }

.st-modal__close {
	position: absolute;
	top: 14px;
	right: 14px;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	color: var(--navy);
	background: #fff;
	border: var(--stroke) solid var(--navy);
	border-radius: 50%;
}

.st-modal__close:hover { background: var(--navy); color: #fff; }

.st-modal__side {
	position: relative;
	display: grid;
	align-content: end;
	gap: 1rem;
	padding: 56px 28px 30px;
	color: #fff;
	background: var(--navy);
}

.st-modal__side .sheet__dots { left: 26px; right: auto; color: #fff; }

.st-modal__script {
	font-family: var(--script);
	font-size: 4rem;
	line-height: .6;
	color: var(--rose);
	transform: rotate(-8deg);
	margin-bottom: -.2rem;
}

.st-modal__title { font-size: clamp(3rem, 6vw, 4.4rem); color: #fff; }

.st-modal__side .check { padding: .55rem .8rem; font-size: .88rem; border-color: rgba(255, 255, 255, .4); }
.st-modal__side .check__mark { width: 24px; height: 24px; background: #fff; color: var(--navy); }
.st-modal__side .check { grid-template-columns: 24px 1fr; }

.st-modal__main {
	display: grid;
	align-content: center;
	gap: 1.2rem;
	padding: 64px 32px 32px;
}

.st-modal__sub { font-size: 1.02rem; line-height: 1.5; color: var(--text-2); }

/* ═══ 16. Footer ══════════════════════════════════════════════════════════ */
.site-footer {
	padding: var(--gap) var(--gutter) var(--gutter);
}

.site-footer__inner {
	max-width: var(--wrap);
	margin: 0 auto;
	padding: clamp(32px, 5vw, 60px) var(--pad) 24px;
	color: #fff;
	background: var(--deep);
	border-radius: var(--r-sheet);
	overflow: hidden;
}

.footer__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr));
	gap: 2rem clamp(24px, 4vw, 56px);
}

.footer-brand { display: grid; gap: 1.2rem; align-content: start; }

.footer-brand__plate {
	justify-self: start;
	max-width: 260px;
	padding: 12px 16px;
	background: #fff;
	border-radius: 12px;
}

.footer-brand__plate .custom-logo { max-height: 48px; max-width: 100%; }
.footer-brand__plate .site-logo { font-size: 1.8rem; }

.footer-brand__text { max-width: 38ch; font-size: .95rem; line-height: 1.55; color: var(--mist); }

.footer-col { display: grid; gap: 1rem; align-content: start; justify-items: start; }

.footer-col__heading {
	font-size: .7rem;
	font-weight: 700;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--peri);
}

.footer-links { display: grid; gap: .55rem; }

.footer-links a { font-size: .98rem; color: #fff; }
.footer-links a:hover { text-decoration: underline; text-underline-offset: 4px; }

.footer-word {
	margin: clamp(28px, 4vw, 48px) 0 0;
	font-stretch: 62%;
	font-weight: 900;
	font-size: clamp(3.6rem, 15vw, 13rem);
	line-height: .8;
	text-transform: uppercase;
	color: transparent;
	-webkit-text-stroke: 1.5px rgba(201, 208, 224, .28);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: clip;
	user-select: none;
}

.footer-base {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: .6rem 2rem;
	margin-top: 20px;
	padding-top: 18px;
	font-size: .78rem;
	color: var(--peri);
	border-top: 1px solid rgba(255, 255, 255, .14);
}

.to-top {
	position: fixed;
	right: 18px;
	bottom: 18px;
	z-index: 150;
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	color: #fff;
	background: var(--navy);
	border: 2px solid #fff;
	border-radius: 50%;
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: opacity .25s ease, transform .25s ease, visibility .25s;
}

.to-top.is-visible { opacity: 1; visibility: visible; transform: none; }
.to-top:hover { background: var(--navy-2); }

/* ═══ 17. Responsive & motion ═════════════════════════════════════════════ */
@media (max-width: 1180px) {
	.dossier { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.content-sidebar { grid-template-columns: minmax(0, 1fr) 300px; }
}

@media (max-width: 1080px) {
	.masthead__nav { display: none; }
	.masthead__cta { margin-left: auto; }
	.menu-toggle { display: inline-flex; }

	.poster--lead .poster__intro { grid-column: 1 / -1; grid-row: 2; padding: 1.2rem 0 0; max-width: 52ch; }
	.poster--lead .poster__title { grid-column: 1 / -1; grid-row: 1; }
	.poster__art { grid-column: 3 / 11; grid-row: 3; margin-top: 1.6rem; }
	.poster--lead .poster__foot .statbox { grid-column: 1 / -1; grid-row: 4; margin-top: 1.6rem; }
	.poster--lead .poster__foot .btn { grid-column: 1 / -1; grid-row: 4; margin-top: 1.6rem; }

	.content-sidebar { grid-template-columns: 1fr; }
	.sidebar { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }

	.footer__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.footer-brand { grid-column: 1 / -1; }

	.gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
	.duo { grid-template-columns: 1fr; }

	.sheet__titlebar,
	.band__head { grid-template-columns: 1fr; align-items: start; }
	.band__aside { justify-items: start; text-align: left; padding-bottom: 0; }

	.feed { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tiles > .tile,
	.tiles:has(> .tile:nth-child(5):last-child) > .tile:nth-child(-n + 2) { grid-column: span 3; }
	.tiles .tile__media { aspect-ratio: 4 / 3; }
	.tiles > .tile:last-child:nth-child(odd) { grid-column: 1 / -1; }
	.tiles > .tile:last-child:nth-child(odd) .tile__media { aspect-ratio: 16 / 9; }

	.feed > .card:nth-child(3n + 2) { margin-top: 0; }
	.feed > .card:nth-child(even) { margin-top: 40px; }
	.is-filtered .feed > .card,
	.feed--flat > .card:nth-child(even) { margin-top: 0; }

	.casefile__lead { grid-template-columns: 1fr; }
	.casefile__media { min-height: 0; aspect-ratio: 16 / 10; order: -1; }
	.casefile__rail { grid-template-columns: 1fr; }

	.planner { grid-template-columns: 1fr; }

	.cta { grid-template-columns: 1fr; }

	.archive-head { grid-template-columns: 1fr; align-items: start; }
	.archive-head__aside { justify-items: start; }
	.archive-head__desc { text-align: left; }
	.archive-head--page { justify-items: center; }

	.st-modal__dialog { grid-template-columns: 1fr; }
	.st-modal__side { padding: 46px 22px 22px; }
	.st-modal__side .checks { display: none; }
	.st-modal__title { font-size: 3rem; }
	.st-modal__main { padding: 22px 22px 26px; }
}

@media (max-width: 640px) {
	body { font-size: 1rem; }

	.masthead { min-height: 62px; padding: 8px 8px 8px 14px; border-radius: 14px; }
	.masthead__cta { display: none !important; }
	.menu-toggle { margin-left: auto; }
	.edition__date { display: none; }

	.sheet { border-radius: 18px; }
	.sheet > .sheet__dots { display: none; }
	.script-over { left: 0; }

	.poster--lead .poster__title { font-size: clamp(2.9rem, 13vw, 4.6rem); padding-right: 14px; }
	.poster--lead.lead--medium .poster__title { font-size: clamp(2.5rem, 11vw, 3.8rem); }
	.poster--lead.lead--long .poster__title { font-size: clamp(2.2rem, 9.4vw, 3.2rem); }
	.poster__art { grid-column: 1 / -1; padding: 0 10%; }
	.poster--lead .poster__script { left: -4%; font-size: 3.8rem; }
	.poster--lead .poster__foot .btn { grid-row: 5; margin-top: 1rem; width: 100%; }

	.statbox { width: 100%; grid-auto-columns: minmax(0, 1fr); }
	.statbox__item { padding: .65rem .7rem; }
	.statbox__item strong { font-size: 1.35rem; }

	.duo__item--desks .chips--stack { padding-right: 0; padding-bottom: 130px; }
	.duo__item--desks .chips--stack li:nth-child(even) { margin-left: 18px; }
	.duo__seal { width: 116px; }

	.dossier { grid-template-columns: 1fr; }

	.tiles > .tile,
	.tiles:has(> .tile:nth-child(5):last-child) > .tile:nth-child(-n + 2) { grid-column: 1 / -1; }
	.tiles .tile__media,
	.tiles > .tile:last-child:nth-child(odd) .tile__media { aspect-ratio: 4 / 3; }
	.feed { grid-template-columns: 1fr; padding-bottom: 0; }
	.feed > .card:nth-child(even) { margin-top: 0; }
	.filters { border-radius: 16px; }
	.filters__btn { padding: .5rem .8rem; }


	.gallery { gap: 14px 10px; }

	.grid { grid-template-columns: 1fr; }
	.sidebar { grid-template-columns: 1fr; }

	.post-nav { grid-template-columns: 1fr; }
	.post-nav__item--next { grid-column: auto; }

	.planner__results .statbox { grid-auto-flow: row; }
	.planner__results .statbox__item + .statbox__item { border-left: 0; border-top: 1px solid var(--navy); }
	.compare { grid-template-columns: 1fr; }

	.footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

	.entry-content .alignleft,
	.entry-content .alignright { float: none; margin: 1em 0; max-width: 100%; }

	.st-modal { padding: 8px; align-items: end; }
	.st-modal__dialog { max-height: calc(100dvh - 16px); }
}

@media (max-width: 420px) {
	.st-form__row { flex-direction: column; align-items: stretch; }
	.st-form .wpcf7-submit { width: 100%; }
	.edition__issue { display: none; }
	.edition__inner { justify-content: center; }
	.menu-toggle__label { display: none; }
	.menu-toggle { padding: 0 7px; width: 46px; justify-content: center; }
	.footer__grid { grid-template-columns: 1fr; }
}

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

	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}