/*
Theme Name: Equator
Theme URI: https://jakartatourism.org/
Author: jakartatourism.org
Author URI: https://jakartatourism.org/
Description: Equator is the bespoke editorial theme for jakartatourism.org — warm sand paper, ink text, a clay accent, oversized grotesk display type with one Bodoni italic word, hairline rules and a "sun on the horizon" mark. Built for a guidebook-authority tourism site: derived contents rails, verification notes, pillar guides, section hubs and faceted search, with self-hosted fonts and no plugin dependencies.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: equator
Tags: blog, news, one-column, two-columns, right-sidebar, custom-colors, custom-logo, custom-menu, editor-style, featured-images, threaded-comments, translation-ready, block-styles, wide-blocks, accessibility-ready
*/

/* =========================================================================
   1. TOKENS
   ========================================================================= */

:root {
	/* Identity colours — grounds, fills, borders, large display type */
	--eq-sand: #efe7d8;
	--eq-sand-2: #e9e0cf;
	--eq-ink: #1b1814;
	--eq-clay: #a14d2f;
	--eq-clay-deep: #8e3b1c;
	--eq-palm: #0b7643;

	/* Text-safe variants — anything set below 16px, or on the tinted ground */
	--eq-clay-text: var(--eq-clay-deep);
	--eq-ink-meta: rgba(27, 24, 20, .64);
	--eq-sand-meta: rgba(239, 231, 216, .52);

	/* Ink tints */
	--eq-ink-88: rgba(27, 24, 20, .88);
	--eq-ink-80: rgba(27, 24, 20, .80);
	--eq-ink-78: rgba(27, 24, 20, .78);
	--eq-ink-75: rgba(27, 24, 20, .75);
	--eq-ink-70: rgba(27, 24, 20, .70);
	--eq-ink-55: rgba(27, 24, 20, .55);
	/* The wordmark's light half. The comp sets it at 55% (3.71:1); 64% keeps the
	   two-tone reading and clears AA, so automated checkers do not flag the
	   brand name on every page. */
	--eq-ink-wordmark: rgba(27, 24, 20, .64);
	--eq-ink-30: rgba(27, 24, 20, .30);
	--eq-hairline: rgba(27, 24, 20, .16);

	/* Sand tints (on ink) */
	--eq-sand-70: rgba(239, 231, 216, .70);
	--eq-sand-55: rgba(239, 231, 216, .55);
	--eq-sand-hair: rgba(239, 231, 216, .14);

	/* Families */
	--eq-display: "Familjen Grotesk", "Helvetica Neue", Helvetica, Arial, sans-serif;
	--eq-accent: "Bodoni Moda", "Didot", "Times New Roman", Georgia, serif;
	--eq-body: "Instrument Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
	--eq-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

	/* Scale */
	--eq-display-xl: clamp(56px, 9vw, 118px);
	--eq-display-l: clamp(48px, 7.6vw, 104px);
	--eq-display-l-page: clamp(48px, 7vw, 96px);
	--eq-display-m: clamp(40px, 5.4vw, 76px);
	--eq-h2-xl: clamp(34px, 4vw, 56px);
	--eq-h2: clamp(32px, 3.2vw, 42px);
	--eq-h2-article: clamp(27px, 2.6vw, 34px);
	--eq-h3: clamp(24px, 2.2vw, 30px);

	/* Layout */
	--eq-container: 1200px;
	--eq-gutter: 40px;
	--eq-measure: 700px;
	--eq-rail: 240px;
	--eq-rail-gap: 60px;

	/* Surfaces */
	--eq-stripe: repeating-linear-gradient(135deg, #e2d8c4 0 7px, #e9e0cf 7px 14px);
	--eq-photo-shadow: 0 40px 70px -30px rgba(27, 24, 20, .4);

	/* Motion */
	--eq-t-colour: 200ms ease;
	--eq-t-lift: 400ms ease;
}

@supports (color: oklch(52% 0.12 40)) {
	:root {
		--eq-clay: oklch(52% 0.12 40);
		--eq-clay-deep: oklch(46% 0.12 40);
		--eq-palm: oklch(50% 0.12 155);
	}
}

/* =========================================================================
   2. RESET & BASE
   ========================================================================= */

*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
	margin: 0;
	background: var(--eq-sand);
	color: var(--eq-ink);
	font: 400 17px/1.65 var(--eq-body);
	font-synthesis-weight: none;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	overflow-wrap: break-word;
}

img,
svg,
video,
iframe { max-width: 100%; }

img { height: auto; }

a {
	color: var(--eq-clay);
	text-decoration-color: color-mix(in srgb, currentColor 35%, transparent);
	text-underline-offset: 3px;
	transition: color var(--eq-t-colour);
}

a:hover { color: var(--eq-clay-deep); }

h1, h2, h3, h4, h5, h6 {
	font-family: var(--eq-display);
	font-weight: 700;
	margin: 0;
	text-wrap: balance;
}

p, ul, ol, figure, blockquote, table, pre { margin: 0; }

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

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--eq-clay);
	outline-offset: 3px;
	border-radius: 2px;
}

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

.eq-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100;
}

.eq-skip-link:focus {
	left: 12px;
	top: 12px;
	background: var(--eq-ink);
	color: var(--eq-sand);
	border-radius: 999px;
	padding: 10px 18px;
	font: 600 12px/1 var(--eq-display);
	letter-spacing: .06em;
	text-decoration: none;
}

/* The single italic accent word, wherever an editor sets it */
h1 em,
h2 em.eq-accent,
.eq-accent-word,
.eq-display em {
	font-family: var(--eq-accent);
	font-style: italic;
	font-weight: 400;
	font-size: inherit;
	line-height: inherit;
	letter-spacing: -.02em;
	color: var(--eq-clay);
}

/* Shared atoms ---------------------------------------------------------- */

.eq-eyebrow {
	font: 500 12px/1 var(--eq-mono);
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--eq-clay-text);
}

.eq-label {
	font: 500 11px/1 var(--eq-mono);
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--eq-ink-meta);
}

.eq-meta {
	font: 500 11px/1.6 var(--eq-mono);
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--eq-ink-meta);
}

.eq-meta-clay { color: var(--eq-clay-text); }

.eq-caption {
	font: 400 12px/1.5 var(--eq-mono);
	color: var(--eq-ink-meta);
	letter-spacing: .01em;
}

.eq-container {
	max-width: var(--eq-container);
	margin-inline: auto;
	padding-inline: var(--eq-gutter);
}

.eq-frame {
	background: var(--eq-stripe);
	background-color: var(--eq-sand-2);
	overflow: hidden;
	position: relative;
	display: block;
}

.eq-frame img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.eq-frame--21x9 { aspect-ratio: 21 / 9; }
.eq-frame--4x3 { aspect-ratio: 4 / 3; }
.eq-frame--3x2 { aspect-ratio: 3 / 2; }
.eq-frame--4x5 { aspect-ratio: 4 / 5; }

.eq-hairline-top {
	border-top: 1px solid var(--eq-hairline);
}

/* Buttons --------------------------------------------------------------- */

.eq-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border-radius: 999px;
	padding: 14px 26px;
	font: 600 14px/1 var(--eq-display);
	letter-spacing: .01em;
	text-decoration: none;
	border: 1px solid transparent;
	cursor: pointer;
	transition: background-color var(--eq-t-colour), color var(--eq-t-colour), border-color var(--eq-t-colour);
}

.eq-btn--primary {
	background: var(--eq-clay);
	color: var(--eq-sand);
	border-color: var(--eq-clay);
}

.eq-btn--primary:hover,
.eq-btn--primary:focus-visible {
	background: var(--eq-ink);
	border-color: var(--eq-ink);
	color: var(--eq-sand);
}

.eq-btn--secondary {
	background: transparent;
	color: var(--eq-ink);
	border-color: var(--eq-ink);
}

.eq-btn--secondary:hover,
.eq-btn--secondary:focus-visible {
	background: var(--eq-ink);
	color: var(--eq-sand);
}

/* Chips ----------------------------------------------------------------- */

.eq-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.eq-chip {
	display: inline-block;
	border: 1px solid var(--eq-ink-30);
	border-radius: 999px;
	padding: 9px 16px;
	font: 500 13px/1 var(--eq-display);
	color: var(--eq-ink);
	text-decoration: none;
	transition: border-color var(--eq-t-colour), background-color var(--eq-t-colour), color var(--eq-t-colour);
}

.eq-chip:hover,
.eq-chip:focus-visible {
	border-color: var(--eq-ink);
	color: var(--eq-ink);
}

.eq-chip.is-active,
.eq-chip[aria-current="page"] {
	background: var(--eq-ink);
	border-color: var(--eq-ink);
	color: var(--eq-sand);
}

/* The mark -------------------------------------------------------------- */

.eq-mark {
	flex: none;
	display: block;
	border-radius: 50%;
	background:
		linear-gradient(var(--eq-mark-line, var(--eq-sand)), var(--eq-mark-line, var(--eq-sand)))
		center / 100% var(--eq-mark-rule, 2px) no-repeat,
		var(--eq-clay);
}

/* =========================================================================
   3. SITE HEADER
   ========================================================================= */

.eq-header {
	position: relative;
	z-index: 20;
}

.eq-header--ruled { border-bottom: 1px solid var(--eq-hairline); }

.eq-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding-block: 22px;
}

.eq-brand {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	text-decoration: none;
	color: inherit;
	flex: none;
}

.eq-brand .eq-mark {
	width: 28px;
	height: 28px;
	--eq-mark-rule: 2px;
}

.eq-brand__text {
	font: 700 22px/1 var(--eq-display);
	letter-spacing: -.02em;
	color: var(--eq-ink);
}

.eq-brand__text span {
	font-weight: 400;
	color: var(--eq-ink-wordmark);
}

.eq-brand__logo { display: block; max-height: 44px; width: auto; }

.eq-nav ul {
	display: flex;
	align-items: center;
	gap: 28px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.eq-nav a {
	font: 500 14px/1 var(--eq-display);
	color: var(--eq-ink);
	text-decoration: none;
	transition: color var(--eq-t-colour);
}

.eq-nav a:hover,
.eq-nav a:focus-visible { color: var(--eq-clay); }

.eq-nav .current-menu-item > a,
.eq-nav .current-menu-parent > a,
.eq-nav .current-menu-ancestor > a,
.eq-nav .eq-nav-current > a,
.eq-nav li.is-current > a { color: var(--eq-clay); }

.eq-nav .sub-menu {
	display: none;
	position: absolute;
	background: var(--eq-sand);
	border: 1px solid var(--eq-hairline);
	padding: 12px 18px;
	flex-direction: column;
	gap: 10px;
	margin-top: 10px;
	z-index: 30;
}

.eq-nav li:hover > .sub-menu,
.eq-nav li:focus-within > .sub-menu { display: flex; }

.eq-header__actions {
	display: flex;
	align-items: center;
	gap: 10px;
	flex: none;
}

.eq-pill {
	display: inline-flex;
	align-items: center;
	background: var(--eq-ink);
	color: var(--eq-sand);
	border: 1px solid var(--eq-ink);
	border-radius: 999px;
	padding: 10px 18px;
	font: 600 12px/1 var(--eq-display);
	letter-spacing: .06em;
	text-decoration: none;
	cursor: pointer;
	transition: background-color var(--eq-t-colour), border-color var(--eq-t-colour), color var(--eq-t-colour);
}

.eq-pill:hover,
.eq-pill:focus-visible {
	background: var(--eq-clay);
	border-color: var(--eq-clay);
	color: var(--eq-sand);
}

.eq-pill--active,
.eq-pill--active:hover {
	background: var(--eq-clay);
	border-color: var(--eq-clay);
}

.eq-pill--ghost {
	background: transparent;
	color: var(--eq-ink);
	border-color: var(--eq-ink);
}

.eq-pill--ghost:hover,
.eq-pill--ghost:focus-visible {
	background: var(--eq-ink);
	color: var(--eq-sand);
	border-color: var(--eq-ink);
}

.eq-menu-toggle { display: none; }

/* Full-screen mobile menu */
.eq-mobile-menu {
	position: fixed;
	inset: 0;
	z-index: 90;
	background: var(--eq-sand);
	padding: 22px var(--eq-gutter) 40px;
	overflow-y: auto;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	/* Visibility flips instantly on open so the first link is focusable straight
	   away, and is held back until the fade finishes on close. */
	transition: opacity 250ms ease, visibility 0s linear 250ms;
}

.eq-mobile-menu.is-open {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transition: opacity 250ms ease, visibility 0s;
}

.eq-mobile-menu__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 40px;
}

.eq-mobile-menu ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.eq-mobile-menu ul a {
	font: 700 var(--eq-h2) / 1 var(--eq-display);
	letter-spacing: -.03em;
	color: var(--eq-ink);
	text-decoration: none;
}

.eq-mobile-menu ul a:hover { color: var(--eq-clay); }

.eq-mobile-menu .sub-menu { display: none; }

.eq-mobile-menu__search { margin-top: 40px; }

/* =========================================================================
   4. SITE FOOTER
   ========================================================================= */

.eq-footer {
	background: var(--eq-ink);
	color: var(--eq-sand);
	margin-top: 0;
}

.eq-footer__inner { padding-block: 56px 28px; }

.eq-footer__grid {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr;
	gap: 40px;
	border-bottom: 1px solid var(--eq-sand-hair);
	padding-bottom: 44px;
}

.eq-footer .eq-brand__text { color: var(--eq-sand); }
.eq-footer .eq-brand__text span { color: var(--eq-sand-55); }

.eq-footer .eq-mark {
	width: 26px;
	height: 26px;
	--eq-mark-line: var(--eq-ink);
	--eq-mark-rule: 2px;
}

.eq-footer__tagline {
	margin-top: 18px;
	max-width: 340px;
	font: 400 14.5px/1.55 var(--eq-body);
	color: var(--eq-sand-70);
}

.eq-footer__label {
	font: 500 11px/1 var(--eq-mono);
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--eq-sand-meta);
	margin-bottom: 18px;
}

.eq-footer__list,
.eq-footer ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 11px;
}

.eq-footer__list a,
.eq-footer ul a {
	font: 500 15px/1.3 var(--eq-display);
	color: var(--eq-sand);
	text-decoration: none;
	transition: color var(--eq-t-colour);
}

.eq-footer__list a:hover,
.eq-footer ul a:hover { color: var(--eq-clay); }

.eq-footer__bottom {
	display: flex;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	padding-top: 24px;
	font: 500 11px/1.6 var(--eq-mono);
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--eq-sand-meta);
}

/* =========================================================================
   5. HOME
   ========================================================================= */

.eq-hero {
	position: relative;
	padding: 76px var(--eq-gutter) 0;
	min-height: 740px;
	overflow: hidden;
	max-width: var(--eq-container);
	margin-inline: auto;
}

.eq-hero__sun {
	position: absolute;
	right: 120px;
	top: 110px;
	width: 440px;
	height: 440px;
	border-radius: 50%;
	background:
		linear-gradient(var(--eq-sand), var(--eq-sand)) center / 100% 3px no-repeat,
		var(--eq-clay);
	will-change: transform;
	pointer-events: none;
}

.eq-hero__photo {
	position: absolute;
	right: var(--eq-gutter);
	top: 230px;
	width: 380px;
	aspect-ratio: 4 / 5;
	transform: rotate(-4deg);
	box-shadow: var(--eq-photo-shadow);
	transition: transform 500ms ease;
}

.eq-hero__photo:hover { transform: rotate(-1deg); }

.eq-hero__photo .eq-caption {
	position: absolute;
	left: 14px;
	bottom: 12px;
	font-size: 11px;
	line-height: 1;
	color: var(--eq-ink-meta);
}

.eq-hero__copy {
	position: relative;
	max-width: 760px;
	padding-bottom: 90px;
}

.eq-hero__eyebrow { margin-bottom: 28px; }

.eq-hero__title {
	font: 700 var(--eq-display-xl) / .92 var(--eq-display);
	letter-spacing: -.045em;
	margin: 0;
}

.eq-hero__deck {
	margin-top: 38px;
	max-width: 500px;
	font: 400 19px/1.5 var(--eq-body);
	color: var(--eq-ink-80);
}

.eq-hero__actions {
	margin-top: 36px;
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

/* Marquee --------------------------------------------------------------- */

.eq-marquee {
	background: var(--eq-clay);
	color: var(--eq-sand);
	padding-block: 17px;
	overflow: hidden;
	position: relative;
}

.eq-marquee__track {
	display: flex;
	width: max-content;
	gap: 40px;
	padding-left: 40px;
	animation: eq-marquee 30s linear infinite;
}

.eq-marquee:hover .eq-marquee__track { animation-play-state: paused; }

.eq-marquee__item {
	font: 600 17px/1 var(--eq-display);
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--eq-sand);
	text-decoration: none;
	white-space: nowrap;
	display: flex;
	align-items: center;
	gap: 40px;
}

.eq-marquee__item::after {
	content: "\2726";
	letter-spacing: 0;
	opacity: .8;
}

.eq-marquee a.eq-marquee__item:hover { color: var(--eq-sand); text-decoration: underline; text-underline-offset: 4px; }

@keyframes eq-marquee {
	to { transform: translateX(-50%); }
}

/* Start here ------------------------------------------------------------ */

.eq-section { max-width: var(--eq-container); margin-inline: auto; padding-inline: var(--eq-gutter); }

.eq-start { padding-block: 64px 20px; }

.eq-section-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 24px;
	margin-bottom: 28px;
}

.eq-section-head h2 {
	font: 700 var(--eq-h2) / 1 var(--eq-display);
	letter-spacing: -.03em;
}

.eq-tiles {
	display: grid;
	grid-template-columns: 1.2fr 1fr 1fr;
	gap: 16px;
}

.eq-tile {
	position: relative;
	min-height: 380px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 28px;
	text-decoration: none;
	color: var(--eq-ink);
	transition: transform var(--eq-t-lift);
	overflow: hidden;
}

.eq-tile:hover,
.eq-tile:focus-visible { transform: translateY(-6px); }

.eq-tile__num,
.eq-tile__title,
.eq-tile__text,
.eq-tile__plate { display: block; }

.eq-tile__num {
	font: italic 400 64px/1 var(--eq-accent);
	color: var(--eq-clay);
}

.eq-tile__title {
	font: 700 var(--eq-h3) / 1.05 var(--eq-display);
	letter-spacing: -.02em;
	margin-bottom: 10px;
}

.eq-tile__text {
	font: 400 15px/1.5 var(--eq-body);
	color: var(--eq-ink-75);
	max-width: 34ch;
}

.eq-tile--palm {
	background: var(--eq-palm);
	color: var(--eq-sand);
}

.eq-tile--palm .eq-tile__num,
.eq-tile--palm .eq-tile__text { color: var(--eq-sand); }

.eq-tile--outline { border: 1px solid var(--eq-ink); }

.eq-tile--photo {
	padding: 0;
	background: var(--eq-stripe);
	background-color: var(--eq-sand-2);
	justify-content: flex-end;
	align-items: flex-start;
}

.eq-tile--photo img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.eq-tile__plate {
	position: relative;
	background: var(--eq-clay);
	color: var(--eq-sand);
	max-width: 78%;
	padding: 22px 24px 24px;
}

.eq-tile__plate .eq-tile__num {
	font-size: 30px;
	color: var(--eq-sand);
	display: block;
	margin-bottom: 6px;
}

.eq-tile__plate .eq-tile__title {
	font-size: 24px;
	margin-bottom: 6px;
	color: var(--eq-sand);
}

.eq-tile__plate .eq-tile__text {
	font-size: 13.5px;
	color: var(--eq-sand);
}

/* Latest guides: row list ------------------------------------------------ */

.eq-latest { padding-block: 44px 56px; }

.eq-rows {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 40px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.eq-row {
	border-bottom: 1px solid var(--eq-hairline);
}

.eq-row a {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 20px;
	padding-block: 18px;
	text-decoration: none;
	color: var(--eq-ink);
	transition: color var(--eq-t-colour);
}

.eq-row a:hover,
.eq-row a:focus-visible { color: var(--eq-clay); }

.eq-row a:hover .eq-row__meta,
.eq-row a:focus-visible .eq-row__meta { color: var(--eq-clay); }

.eq-row__title {
	font: 600 19px/1.2 var(--eq-display);
	letter-spacing: -.01em;
}

.eq-row__meta {
	flex: none;
	font: 500 11px/1 var(--eq-mono);
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--eq-ink-meta);
	transition: color var(--eq-t-colour);
}

.eq-link-mono {
	font: 500 11px/1 var(--eq-mono);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--eq-clay-text);
	text-decoration: none;
}

.eq-link-mono:hover { text-decoration: underline; text-underline-offset: 4px; }

/* Trust band ------------------------------------------------------------- */

.eq-trust {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 60px;
	align-items: end;
	padding-bottom: 72px;
}

.eq-trust h2 {
	font: 700 var(--eq-h2-xl) / .98 var(--eq-display);
	letter-spacing: -.035em;
}

.eq-trust p {
	font: 400 17px/1.55 var(--eq-body);
	color: var(--eq-ink-80);
	margin-bottom: 18px;
}

/* =========================================================================
   6. ARTICLE (single) & PAGE
   ========================================================================= */

.eq-article-head {
	padding: 60px var(--eq-gutter) 0;
	max-width: var(--eq-container);
	margin-inline: auto;
}

.eq-article-head__inner { max-width: 1000px; }

.eq-breadcrumb {
	font: 500 12px/1.5 var(--eq-mono);
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--eq-clay-text);
	margin-bottom: 24px;
}

.eq-breadcrumb a { color: inherit; text-decoration: none; }
.eq-breadcrumb a:hover { text-decoration: underline; text-underline-offset: 4px; }
.eq-breadcrumb .eq-sep,
.eq-breadcrumb .separator { color: var(--eq-ink-meta); padding-inline: 6px; }

.eq-title {
	font: 700 var(--eq-display-m) / .95 var(--eq-display);
	letter-spacing: -.04em;
}

.eq-deck {
	margin-top: 28px;
	max-width: 760px;
	font: 400 21px/1.45 var(--eq-body);
	color: var(--eq-ink-78);
}

.eq-byline {
	margin-top: 34px;
	padding-bottom: 34px;
	display: flex;
	align-items: center;
	gap: 14px;
}

.eq-byline__avatar {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	overflow: hidden;
	flex: none;
	background: var(--eq-sand-2);
}

.eq-byline__avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }

.eq-byline__name {
	font: 600 15px/1.3 var(--eq-display);
	color: var(--eq-ink);
}

.eq-byline__name a { color: inherit; text-decoration: none; }
.eq-byline__name a:hover { color: var(--eq-clay); }

.eq-byline__meta {
	margin-top: 5px;
	font: 500 11.5px/1.4 var(--eq-mono);
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--eq-ink-meta);
}

.eq-featured {
	max-width: var(--eq-container);
	margin-inline: auto;
	padding-inline: var(--eq-gutter);
}

.eq-featured figcaption { padding-top: 10px; }

/* Body grid ------------------------------------------------------------- */

.eq-body {
	max-width: var(--eq-container);
	margin-inline: auto;
	padding: 56px var(--eq-gutter) 64px;
	display: grid;
	grid-template-columns: var(--eq-rail) var(--eq-measure);
	gap: var(--eq-rail-gap);
	align-items: start;
}

.eq-rail {
	position: sticky;
	top: 24px;
	min-width: 0;
}

.eq-rail__label { margin-bottom: 16px; }

.eq-toc {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.eq-toc a {
	display: block;
	font: 500 14px/1.35 var(--eq-display);
	color: var(--eq-ink-70);
	text-decoration: none;
	border-left: 2px solid transparent;
	padding-left: 12px;
	margin-left: -14px;
	transition: color var(--eq-t-colour), border-color var(--eq-t-colour);
}

.eq-toc a:hover { color: var(--eq-ink); }

.eq-toc a.is-active {
	color: var(--eq-clay);
	border-left-color: var(--eq-clay);
}

.eq-toc--sub a { padding-left: 24px; font-size: 13px; }

.eq-rail__actions {
	margin-top: 36px;
	padding-top: 20px;
	border-top: 1px solid var(--eq-hairline);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
}

.eq-rail__actions button,
.eq-rail__actions a {
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
	font: 500 12px/1 var(--eq-mono);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--eq-ink-meta);
	text-decoration: none;
	transition: color var(--eq-t-colour);
	text-align: left;
}

.eq-rail__actions button:hover,
.eq-rail__actions a:hover { color: var(--eq-clay); }

.eq-rail__reviewed {
	margin-top: 36px;
	padding-top: 20px;
	border-top: 1px solid var(--eq-hairline);
}

.eq-rail__reviewed strong {
	display: block;
	margin-top: 8px;
	font: 500 12px/1.4 var(--eq-mono);
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--eq-ink);
}

.eq-rail-collapsed { display: none; }

/* Prose ----------------------------------------------------------------- */

.eq-prose {
	min-width: 0;
	font: 400 17px/1.65 var(--eq-body);
	color: var(--eq-ink-88);
}

.eq-prose > * { margin-bottom: 18px; }
.eq-prose > *:last-child { margin-bottom: 0; }

.eq-prose p.is-lead,
.eq-prose > p:first-child {
	font-size: 20px;
	line-height: 1.55;
	color: var(--eq-ink);
}

.eq-prose a { color: var(--eq-clay); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.eq-prose a:hover { color: var(--eq-clay-deep); }

.eq-prose h2 {
	display: grid;
	grid-template-columns: 14px 1fr;
	gap: 12px;
	align-items: start;
	font: 700 var(--eq-h2-article) / 1.05 var(--eq-display);
	letter-spacing: -.03em;
	color: var(--eq-ink);
	margin: 44px 0 16px;
	scroll-margin-top: 24px;
}

.eq-prose h2::before {
	content: "";
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background:
		linear-gradient(var(--eq-sand), var(--eq-sand)) center / 100% 1.5px no-repeat,
		var(--eq-clay);
	margin-top: .32em;
	margin-top: calc((1lh - 14px) / 2);
}

.eq-prose h3 {
	font: 600 23px/1.2 var(--eq-display);
	letter-spacing: -.02em;
	color: var(--eq-ink);
	margin: 32px 0 12px;
	scroll-margin-top: 24px;
}

.eq-prose h4 {
	font: 600 19px/1.25 var(--eq-display);
	letter-spacing: -.01em;
	color: var(--eq-ink);
	margin: 26px 0 10px;
}

.eq-prose ul,
.eq-prose ol {
	padding-left: 22px;
	margin-bottom: 18px;
}

.eq-prose li { margin-bottom: 8px; }
.eq-prose li:last-child { margin-bottom: 0; }

.eq-prose figure { margin-block: 32px; }

.eq-prose figcaption {
	font: 400 12px/1.5 var(--eq-mono);
	color: var(--eq-ink-meta);
	padding-top: 10px;
}

.eq-prose img { display: block; }

.eq-prose figure img,
.eq-prose .wp-block-image img { width: 100%; }

.eq-prose hr {
	border: 0;
	border-top: 1px solid var(--eq-hairline);
	margin-block: 40px;
}

.eq-prose strong { font-weight: 600; color: var(--eq-ink); }

.eq-prose table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
	margin-block: 32px;
}

.eq-prose th,
.eq-prose td {
	text-align: left;
	padding: 12px 14px;
	border-bottom: 1px solid var(--eq-hairline);
	vertical-align: top;
}

.eq-prose th {
	font: 500 11.5px/1.4 var(--eq-mono);
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--eq-ink-meta);
}

.eq-prose code {
	font: 400 14px/1.5 var(--eq-mono);
	background: var(--eq-sand-2);
	padding: 2px 6px;
}

.eq-prose pre {
	background: var(--eq-sand-2);
	padding: 18px 20px;
	overflow-x: auto;
	font: 400 14px/1.6 var(--eq-mono);
	margin-block: 28px;
}

/* Pull quote (core/quote, style "pull") */
.eq-prose blockquote,
.eq-prose .is-style-eq-pull {
	padding-left: 28px;
	border-left: 3px solid var(--eq-clay);
	margin-block: 40px;
}

.eq-prose blockquote p {
	font: italic 400 34px/1.2 var(--eq-accent);
	color: var(--eq-clay);
	margin-bottom: 12px;
}

.eq-prose blockquote cite,
.eq-prose blockquote .wp-block-quote__citation,
.eq-prose blockquote footer {
	display: block;
	font: 500 11.5px/1.5 var(--eq-mono);
	letter-spacing: .1em;
	text-transform: uppercase;
	font-style: normal;
	color: var(--eq-ink-meta);
}

/* Fact box ("At a glance") */
.eq-fact {
	border: 1px solid var(--eq-ink);
	padding: 24px 26px 26px;
	margin-block: 32px;
}

.eq-fact__label {
	font: 500 11px/1 var(--eq-mono);
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--eq-clay-text);
	margin-bottom: 18px;
}

.eq-fact__grid {
	display: grid;
	grid-template-columns: 140px 1fr;
	row-gap: 12px;
	column-gap: 16px;
	margin: 0;
}

.eq-fact__grid dt {
	font: 500 11.5px/1.5 var(--eq-mono);
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--eq-ink-meta);
}

.eq-fact__grid dd {
	margin: 0;
	font: 400 15px/1.45 var(--eq-body);
	color: var(--eq-ink-88);
}

.eq-fact ul {
	list-style: none;
	padding-left: 0;
	margin: 0;
}

/* Verified note */
.eq-verified {
	background: var(--eq-sand-2);
	padding: 22px 26px;
	margin-block: 36px;
}

.eq-verified__label {
	font: 500 11px/1 var(--eq-mono);
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--eq-ink-meta);
	margin-bottom: 12px;
}

.eq-verified p {
	font: 400 14.5px/1.55 var(--eq-body);
	color: var(--eq-ink-80);
	margin: 0;
}

.eq-verified a {
	color: var(--eq-clay-deep);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Tag chips at the foot of a guide */
.eq-tags { margin-top: 36px; }

.eq-tags .eq-chip { font-size: 13px; padding: 8px 14px; }

/* Related --------------------------------------------------------------- */

.eq-related {
	max-width: var(--eq-container);
	margin-inline: auto;
	padding: 0 var(--eq-gutter) 56px;
}

.eq-related__inner {
	border-top: 1px solid var(--eq-hairline);
	padding-top: 40px;
}

.eq-related h2 {
	font: 700 36px/1 var(--eq-display);
	letter-spacing: -.03em;
}

.eq-grid-3 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px 24px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.eq-card {
	display: block;
	text-decoration: none;
	color: var(--eq-ink);
	transition: transform var(--eq-t-lift);
	min-width: 0;
}

.eq-card:hover,
.eq-card:focus-visible { transform: translateY(-6px); }

.eq-card__meta {
	margin: 14px 0 6px;
	font: 500 11px/1.4 var(--eq-mono);
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--eq-clay-text);
}

.eq-card__title {
	font: 600 22px/1.15 var(--eq-display);
	letter-spacing: -.02em;
	color: var(--eq-ink);
}

.eq-card:hover .eq-card__title { color: var(--eq-clay); }

.eq-card__excerpt {
	margin-top: 8px;
	font: 400 14.5px/1.5 var(--eq-body);
	color: var(--eq-ink-70);
}

/* Author box ------------------------------------------------------------ */

.eq-author {
	max-width: var(--eq-container);
	margin-inline: auto;
	padding: 0 var(--eq-gutter) 64px;
}

.eq-author__inner {
	border-top: 1px solid var(--eq-hairline);
	padding-top: 28px;
	display: flex;
	gap: 24px;
	align-items: flex-start;
}

.eq-author__avatar {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	overflow: hidden;
	flex: none;
	background: var(--eq-sand-2);
}

.eq-author__avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }

.eq-author__name {
	font: 700 22px/1.2 var(--eq-display);
	letter-spacing: -.02em;
	margin: 10px 0 8px;
}

.eq-author__name a { color: inherit; text-decoration: none; }
.eq-author__name a:hover { color: var(--eq-clay); }

.eq-author__bio {
	font: 400 15px/1.55 var(--eq-body);
	color: var(--eq-ink-75);
	max-width: 620px;
	margin-bottom: 12px;
}

/* =========================================================================
   7. HUB / ARCHIVE
   ========================================================================= */

.eq-hub-head {
	position: relative;
	overflow: hidden;
	max-width: var(--eq-container);
	margin-inline: auto;
	padding: 64px var(--eq-gutter) 40px;
}

.eq-hub-head__sun {
	position: absolute;
	right: -60px;
	top: -120px;
	width: 360px;
	height: 360px;
	border-radius: 50%;
	background:
		linear-gradient(var(--eq-sand), var(--eq-sand)) center / 100% 3px no-repeat,
		var(--eq-clay);
	pointer-events: none;
}

.eq-hub-head__grid {
	position: relative;
	display: grid;
	grid-template-columns: 1fr 360px;
	gap: 60px;
	align-items: start;
}

.eq-hub-head h1 {
	margin-top: 22px;
	font: 700 var(--eq-display-l) / .90 var(--eq-display);
	letter-spacing: -.045em;
}

.eq-hub-head__desc {
	/* The comp bottom-aligns this column, which lands the description on solid
	   clay (ink on clay is 3.05:1). Starting it below the disc keeps the sun's
	   geometry exactly as designed and the description legible, whatever its
	   length. */
	padding-top: 176px;
	font: 400 17px/1.55 var(--eq-body);
	color: var(--eq-ink-80);
}

.eq-hub-head .eq-chips { position: relative; margin-top: 44px; }

.eq-pillar {
	max-width: var(--eq-container);
	margin-inline: auto;
	padding-inline: var(--eq-gutter);
}

.eq-pillar__card {
	display: grid;
	grid-template-columns: 1.25fr 1fr;
	border: 1px solid var(--eq-ink);
	transition: transform var(--eq-t-lift);
	text-decoration: none;
	color: var(--eq-ink);
	min-width: 0;
}

.eq-pillar__card:hover { transform: translateY(-4px); }

.eq-pillar__body {
	padding: 36px 36px 32px;
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.eq-pillar__label { margin-bottom: 16px; color: var(--eq-clay-text); }

.eq-pillar__title {
	font: 700 var(--eq-h2) / 1 var(--eq-display);
	letter-spacing: -.035em;
	margin-bottom: 16px;
}

.eq-pillar__card:hover .eq-pillar__title { color: var(--eq-clay); }

.eq-pillar__excerpt {
	font: 400 16px/1.55 var(--eq-body);
	color: var(--eq-ink-78);
	margin-bottom: 28px;
}

.eq-pillar__foot {
	margin-top: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
}

.eq-hub-grid {
	max-width: var(--eq-container);
	margin-inline: auto;
	padding: 56px var(--eq-gutter) 20px;
}

.eq-hub-grid .eq-card__title { font-size: 23px; }

/* Pagination ------------------------------------------------------------ */

.eq-pagination {
	max-width: var(--eq-container);
	margin-inline: auto;
	padding-inline: var(--eq-gutter);
}

.eq-pagination__inner {
	margin-bottom: 64px;
	padding-top: 22px;
	border-top: 1px solid var(--eq-hairline);
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	font: 500 12px/1 var(--eq-mono);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--eq-ink-meta);
}

.eq-pagination__links {
	display: flex;
	align-items: baseline;
	gap: 14px;
	flex-wrap: wrap;
}

.eq-pagination__links a,
.eq-pagination__links span {
	text-decoration: none;
	color: var(--eq-ink-meta);
	transition: color var(--eq-t-colour);
}

.eq-pagination__links a:hover { color: var(--eq-clay); }

.eq-pagination__links .current { color: var(--eq-ink); }

.eq-pagination__links .next,
.eq-pagination__links .prev { color: var(--eq-clay-text); }

/* =========================================================================
   8. PAGE HEADER
   ========================================================================= */

.eq-page-head {
	max-width: var(--eq-container);
	margin-inline: auto;
	padding: 64px var(--eq-gutter) 48px;
}

.eq-page-head__inner {
	border-bottom: 1px solid var(--eq-hairline);
	padding-bottom: 48px;
}

.eq-page-head h1 {
	margin-top: 22px;
	max-width: 900px;
	font: 700 var(--eq-display-l-page) / .92 var(--eq-display);
	letter-spacing: -.045em;
}

.eq-page-head__intro {
	margin-top: 34px;
	max-width: 680px;
	font: 400 21px/1.45 var(--eq-body);
	color: var(--eq-ink-78);
}

/* Page patterns --------------------------------------------------------- */

.eq-team {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
	list-style: none;
	margin: 32px 0;
	padding: 0;
}

.eq-team__card {
	border: 1px solid var(--eq-hairline);
	padding: 20px;
}

.eq-team__avatar {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--eq-sand-2);
	margin-bottom: 16px;
	overflow: hidden;
}

.eq-team__name {
	font: 700 18px/1.2 var(--eq-display);
	letter-spacing: -.01em;
	margin-bottom: 6px;
}

.eq-team__role {
	font: 500 11px/1.4 var(--eq-mono);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--eq-clay-text);
}

.eq-steps {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 28px 32px;
	list-style: none;
	margin: 32px 0;
	padding: 0;
}

.eq-step {
	border-top: 1px solid var(--eq-ink);
	padding-top: 16px;
}

.eq-step__num {
	font: italic 400 44px/1 var(--eq-accent);
	color: var(--eq-clay);
	display: block;
	margin-bottom: 12px;
}

.eq-step__title {
	font: 700 19px/1.25 var(--eq-display);
	letter-spacing: -.01em;
	margin-bottom: 8px;
}

.eq-step__text {
	font: 400 15px/1.55 var(--eq-body);
	color: var(--eq-ink-75);
}

.eq-contact {
	border: 1px solid var(--eq-ink);
	padding: 24px 26px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	flex-wrap: wrap;
	margin-block: 32px;
}

.eq-contact__label { margin-bottom: 12px; color: var(--eq-clay-text); }

.eq-contact__email {
	font: 700 22px/1.2 var(--eq-display);
	letter-spacing: -.02em;
	margin-bottom: 8px;
}

.eq-contact__email a { color: var(--eq-ink); text-decoration: none; }
.eq-contact__email a:hover { color: var(--eq-clay); }

.eq-contact__text {
	font: 400 14.5px/1.55 var(--eq-body);
	color: var(--eq-ink-75);
	max-width: 46ch;
}

/* =========================================================================
   9. SEARCH
   ========================================================================= */

.eq-search-head {
	max-width: var(--eq-container);
	margin-inline: auto;
	padding: 64px var(--eq-gutter) 0;
}

.eq-search-title {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 28px;
	flex-wrap: wrap;
	border-bottom: 2px solid var(--eq-ink);
	padding-bottom: 14px;
	margin-top: 24px;
}

.eq-search-title h1 {
	font: 700 var(--eq-display-m) / 1 var(--eq-display);
	letter-spacing: -.045em;
	min-width: 0;
	overflow-wrap: anywhere;
}

.eq-search-count {
	flex: none;
	font: 500 12px/1 var(--eq-mono);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--eq-ink-meta);
}

.eq-search-head .eq-chips { margin-top: 28px; }

.eq-results {
	max-width: var(--eq-container);
	margin-inline: auto;
	padding: 0 var(--eq-gutter);
	list-style: none;
}

.eq-results__list {
	margin-top: 40px;
	border-top: 1px solid var(--eq-hairline);
	list-style: none;
	padding: 0;
}

.eq-result { border-bottom: 1px solid var(--eq-hairline); }

.eq-result__link {
	display: grid;
	grid-template-columns: 150px 1fr auto;
	gap: 28px;
	align-items: center;
	padding-block: 24px;
	text-decoration: none;
	color: var(--eq-ink);
	transition: color var(--eq-t-colour);
}

.eq-result__link:hover,
.eq-result__link:focus-visible { color: var(--eq-clay); }

.eq-result__link:hover .eq-result__meta { color: var(--eq-clay); }

.eq-result__body { min-width: 0; }

.eq-result__meta {
	font: 500 11px/1.4 var(--eq-mono);
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--eq-ink-meta);
	margin-bottom: 8px;
	transition: color var(--eq-t-colour);
}

.eq-result__title {
	font: 600 26px/1.15 var(--eq-display);
	letter-spacing: -.025em;
	margin-bottom: 8px;
}

.eq-result__excerpt {
	font: 400 15px/1.5 var(--eq-body);
	color: var(--eq-ink-70);
	max-width: 720px;
}

.eq-result__arrow {
	font-size: 26px;
	line-height: 1;
	flex: none;
	color: inherit;
}

.eq-result mark {
	background: none;
	color: inherit;
	text-decoration: underline;
	text-decoration-color: var(--eq-clay);
	text-decoration-thickness: 1px;
	text-underline-offset: 5px;
}

.eq-results__foot {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	padding: 22px 0 64px;
	font: 500 12px/1 var(--eq-mono);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--eq-ink-meta);
}

.eq-empty {
	max-width: var(--eq-container);
	margin-inline: auto;
	padding: 56px var(--eq-gutter) 72px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 60px;
}

.eq-empty h2 {
	font: 700 clamp(32px, 3.4vw, 44px) / 1 var(--eq-display);
	letter-spacing: -.035em;
	margin-bottom: 20px;
}

.eq-empty p {
	font: 400 17px/1.55 var(--eq-body);
	color: var(--eq-ink-80);
	margin-bottom: 24px;
}

.eq-empty p a { color: var(--eq-clay); text-decoration: underline; text-underline-offset: 3px; }

.eq-sections-list {
	list-style: none;
	margin: 18px 0 0;
	padding: 0;
	border-top: 1px solid var(--eq-hairline);
}

.eq-sections-list li { border-bottom: 1px solid var(--eq-hairline); }

.eq-sections-list a {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 20px;
	padding-block: 16px;
	font: 600 19px/1.2 var(--eq-display);
	letter-spacing: -.01em;
	color: var(--eq-ink);
	text-decoration: none;
	transition: color var(--eq-t-colour);
}

.eq-sections-list a:hover { color: var(--eq-clay); }

.eq-sections-list span {
	font: 500 11px/1 var(--eq-mono);
	letter-spacing: .1em;
	color: var(--eq-ink-meta);
}

/* Search form ----------------------------------------------------------- */

.eq-searchform {
	display: flex;
	gap: 10px;
	align-items: stretch;
	max-width: 520px;
}

.eq-searchform input[type="search"] {
	flex: 1 1 auto;
	min-width: 0;
	background: transparent;
	border: 1px solid var(--eq-ink-30);
	border-radius: 999px;
	padding: 12px 20px;
	font: 400 16px/1.2 var(--eq-body);
	color: var(--eq-ink);
}

.eq-searchform input[type="search"]::placeholder { color: var(--eq-ink-meta); }
.eq-searchform input[type="search"]:focus { border-color: var(--eq-ink); }

.eq-searchform button {
	flex: none;
	border: 1px solid var(--eq-ink);
	background: var(--eq-ink);
	color: var(--eq-sand);
	border-radius: 999px;
	padding: 12px 24px;
	font: 600 12px/1 var(--eq-display);
	letter-spacing: .06em;
	cursor: pointer;
	transition: background-color var(--eq-t-colour), border-color var(--eq-t-colour);
}

.eq-searchform button:hover { background: var(--eq-clay); border-color: var(--eq-clay); }

/* =========================================================================
   10. COMMENTS
   ========================================================================= */

.eq-comments {
	max-width: var(--eq-container);
	margin-inline: auto;
	padding: 0 var(--eq-gutter) 64px;
}

.eq-comments__inner {
	max-width: var(--eq-measure);
	margin-left: calc(var(--eq-rail) + var(--eq-rail-gap));
	border-top: 1px solid var(--eq-hairline);
	padding-top: 32px;
}

.eq-comments h2 {
	font: 700 28px/1.1 var(--eq-display);
	letter-spacing: -.03em;
	margin-bottom: 24px;
}

.eq-comments ol { list-style: none; margin: 0; padding: 0; }
.eq-comments .children { list-style: none; padding-left: 28px; }

.eq-comments .comment-body {
	padding-block: 20px;
	border-bottom: 1px solid var(--eq-hairline);
}

.eq-comments .comment-author {
	font: 600 15px/1.3 var(--eq-display);
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 6px;
}

.eq-comments .comment-author img { border-radius: 50%; }

.eq-comments .comment-metadata,
.eq-comments .reply {
	font: 500 11px/1.4 var(--eq-mono);
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--eq-ink-meta);
}

.eq-comments .comment-metadata a,
.eq-comments .reply a { color: inherit; text-decoration: none; }
.eq-comments .reply a:hover { color: var(--eq-clay); }

.eq-comments .comment-content { font: 400 16px/1.6 var(--eq-body); margin-block: 10px; }

.eq-comments input[type="text"],
.eq-comments input[type="email"],
.eq-comments input[type="url"],
.eq-comments textarea {
	width: 100%;
	background: transparent;
	border: 1px solid var(--eq-ink-30);
	padding: 12px 14px;
	font: 400 16px/1.5 var(--eq-body);
	margin-top: 6px;
}

.eq-comments .comment-form p { margin-bottom: 16px; }

.eq-comments .comment-form label {
	font: 500 11px/1.4 var(--eq-mono);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--eq-ink-meta);
}

.eq-comments .form-submit input[type="submit"] {
	background: var(--eq-clay);
	color: var(--eq-sand);
	border: 1px solid var(--eq-clay);
	border-radius: 999px;
	padding: 14px 26px;
	font: 600 14px/1 var(--eq-display);
	cursor: pointer;
	transition: background-color var(--eq-t-colour), border-color var(--eq-t-colour);
}

.eq-comments .form-submit input[type="submit"]:hover { background: var(--eq-ink); border-color: var(--eq-ink); }

/* =========================================================================
   11. MISC
   ========================================================================= */

.eq-404 {
	max-width: var(--eq-container);
	margin-inline: auto;
	padding: 0 var(--eq-gutter);
}

.eq-none {
	max-width: var(--eq-container);
	margin-inline: auto;
	padding: 40px var(--eq-gutter) 72px;
	font: 400 17px/1.6 var(--eq-body);
	color: var(--eq-ink-80);
}

.eq-sticky-flag {
	display: inline-block;
	font: 500 11px/1 var(--eq-mono);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--eq-clay-text);
}

/* WordPress alignment + caption defaults */
.alignleft { float: left; margin: 6px 24px 18px 0; }
.alignright { float: right; margin: 6px 0 18px 24px; }
.aligncenter { display: block; margin-inline: auto; }

.eq-prose .alignwide {
	width: calc(var(--eq-measure) + var(--eq-rail-gap) + 60px);
	max-width: calc(100vw - var(--eq-gutter) * 2);
	margin-left: calc(-1 * (var(--eq-rail-gap) / 2 + 30px));
}

.eq-prose .alignfull {
	width: calc(var(--eq-measure) + var(--eq-rail) + var(--eq-rail-gap));
	max-width: calc(100vw - var(--eq-gutter) * 2);
	margin-left: calc(-1 * (var(--eq-rail) + var(--eq-rail-gap)));
}

.wp-caption { max-width: 100%; }

.wp-caption-text,
.eq-prose .wp-element-caption {
	font: 400 12px/1.5 var(--eq-mono);
	color: var(--eq-ink-meta);
	padding-top: 10px;
}

/* Entrance reveals */
.eq-reveal {
	opacity: 0;
	transform: translateY(16px);
	transition: opacity 500ms ease-out, transform 500ms ease-out;
}

.eq-reveal.is-in {
	opacity: 1;
	transform: none;
}

.eq-hero .eq-reveal { transform: translateY(24px); transition-duration: 600ms; }

.no-js .eq-reveal { opacity: 1; transform: none; }

/* =========================================================================
   12. RESPONSIVE
   ========================================================================= */

@media (max-width: 1199px) {
	:root {
		--eq-gutter: 32px;
		--eq-rail: 200px;
		--eq-rail-gap: 44px;
	}

	.eq-body { grid-template-columns: var(--eq-rail) minmax(0, 700px); }
	.eq-hero { min-height: 660px; }
	.eq-hero__sun { width: 340px; height: 340px; right: 60px; top: 130px; }
	.eq-hero__photo { width: 300px; top: 260px; }
	.eq-hero__copy { max-width: 620px; }
	.eq-hub-head__grid { grid-template-columns: 1fr 300px; gap: 40px; }
}

@media (max-width: 899px) {
	:root {
		--eq-gutter: 24px;
	}

	.eq-nav { display: none; }
	.eq-menu-toggle { display: inline-flex; }

	.eq-hero {
		min-height: 0;
		padding-top: 56px;
		padding-bottom: 8px;
	}

	.eq-hero__sun {
		width: 220px;
		height: 220px;
		right: -50px;
		top: -70px;
		background-size: 100% 2px;
	}

	.eq-hero__copy { max-width: none; padding-bottom: 0; }
	.eq-hero__deck { max-width: 560px; }

	.eq-hero__photo {
		position: relative;
		right: auto;
		top: auto;
		width: 100%;
		max-width: 420px;
		margin: 40px 0 0;
		transform: none;
		box-shadow: none;
	}

	.eq-hero__photo:hover { transform: none; }

	.eq-tiles { grid-template-columns: 1fr; }
	.eq-tile { min-height: 220px; }
	.eq-tile--photo { min-height: 300px; }
	.eq-tile__plate { max-width: 100%; }

	.eq-rows { grid-template-columns: 1fr; }

	.eq-trust { grid-template-columns: 1fr; gap: 28px; }

	.eq-body {
		grid-template-columns: minmax(0, 1fr);
		gap: 32px;
	}

	.eq-rail {
		position: static;
		top: auto;
	}

	.eq-rail-open { display: none; }

	.eq-rail details.eq-rail-collapsed {
		display: block;
		border-top: 1px solid var(--eq-hairline);
		border-bottom: 1px solid var(--eq-hairline);
		padding-block: 14px;
	}

	.eq-rail details.eq-rail-collapsed > summary {
		cursor: pointer;
		list-style: none;
		font: 500 11px/1 var(--eq-mono);
		letter-spacing: .18em;
		text-transform: uppercase;
		color: var(--eq-ink-meta);
		display: flex;
		justify-content: space-between;
	}

	.eq-rail details.eq-rail-collapsed > summary::-webkit-details-marker { display: none; }
	.eq-rail details.eq-rail-collapsed > summary::after { content: "+"; }
	.eq-rail details.eq-rail-collapsed[open] > summary::after { content: "\2212"; }
	.eq-rail details.eq-rail-collapsed .eq-toc { margin-top: 16px; }

	.eq-rail__actions { flex-direction: row; flex-wrap: wrap; gap: 20px; }

	.eq-prose .alignwide,
	.eq-prose .alignfull { width: 100%; margin-left: 0; }

	.eq-comments__inner { margin-left: 0; max-width: none; }

	.eq-grid-3 { grid-template-columns: repeat(2, 1fr); }

	.eq-hub-head__grid { grid-template-columns: 1fr; gap: 24px; align-items: start; }
	.eq-hub-head__desc { padding-top: 0; }
	.eq-hub-head__sun { width: 220px; height: 220px; right: -70px; top: -90px; }

	.eq-pillar__card { grid-template-columns: 1fr; }

	.eq-result__link { grid-template-columns: 1fr auto; }
	.eq-result__thumb { display: none; }

	.eq-empty { grid-template-columns: 1fr; gap: 40px; }

	.eq-footer__grid { grid-template-columns: 1fr; gap: 32px; }

	.eq-team { grid-template-columns: 1fr 1fr; }
	.eq-steps { grid-template-columns: 1fr; }
}

@media (max-width: 599px) {
	/* Brand plus two pills has to fit a 360px viewport without a scrollbar. */
	.eq-header__inner { gap: 12px; }
	.eq-header__actions { gap: 8px; }
	.eq-brand .eq-mark { width: 24px; height: 24px; }
	.eq-brand__text { font-size: 19px; }
	.eq-pill { padding: 9px 13px; font-size: 11px; letter-spacing: .04em; }

	.eq-grid-3 { grid-template-columns: 1fr; }
	.eq-team { grid-template-columns: 1fr; }

	.eq-fact__grid { grid-template-columns: 1fr; row-gap: 4px; }
	.eq-fact__grid dd { margin-bottom: 10px; }

	.eq-prose blockquote p { font-size: 26px; }

	.eq-section-head { flex-direction: column; align-items: flex-start; gap: 10px; }

	.eq-hub-head .eq-chips,
	.eq-search-head .eq-chips {
		flex-wrap: nowrap;
		overflow-x: auto;
		padding-bottom: 8px;
		scrollbar-width: thin;
	}

	.eq-hub-head .eq-chip,
	.eq-search-head .eq-chip { flex: none; }

	.eq-contact { flex-direction: column; align-items: flex-start; gap: 18px; }

	.eq-result__title { font-size: 22px; }
	.eq-related h2 { font-size: 30px; }
}

/* =========================================================================
   13. MOTION & PRINT
   ========================================================================= */

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

	.eq-marquee__track { animation: none; transform: none; }
	.eq-hero__photo { transform: rotate(-4deg); }
	.eq-reveal { opacity: 1; transform: none; }
}

@media print {
	.eq-header,
	.eq-footer,
	.eq-rail,
	.eq-related,
	.eq-marquee,
	.eq-hero__sun { display: none !important; }

	body { background: #fff; color: #000; font-size: 12pt; }
	.eq-body { display: block; padding: 0; }
}