/* ==========================================================================
   Historical Ramblings theme
   The first blocks are design tokens. Most of them can also be changed in
   Appearance > Customize > Historical Ramblings (colors and fonts).
   ========================================================================== */

/* ---------- Fonts (self-hosted, Latin subset, SIL Open Font License) ----------
   Declared here, downloaded only when something on the page uses them. */
@font-face { font-family: "UnifrakturCook"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/unifrakturcook-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Playfair Display"; font-style: normal; font-weight: 400 900; font-display: swap; src: url("../fonts/playfair-display-latin-wght-normal.woff2") format("woff2"); }
@font-face { font-family: "Abril Fatface"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/abril-fatface-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Old Standard TT"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/old-standard-tt-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Old Standard TT"; font-style: italic; font-weight: 400; font-display: swap; src: url("../fonts/old-standard-tt-latin-400-italic.woff2") format("woff2"); }
@font-face { font-family: "Old Standard TT"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/old-standard-tt-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "League Gothic"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/league-gothic-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Serif 4"; font-style: normal; font-weight: 200 900; font-display: swap; src: url("../fonts/source-serif-4-latin-wght-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Serif 4"; font-style: italic; font-weight: 200 900; font-display: swap; src: url("../fonts/source-serif-4-latin-wght-italic.woff2") format("woff2"); }

/* ---------- Tokens ---------- */
:root {
	--hr-paper: #f3ebd8;
	--hr-parchment: #e8ddc5;
	--hr-ink: #302d29;
	--hr-ink-soft: #5a554d;
	--hr-accent: #a6473f;       /* vintage red, used for text and lines */
	--hr-fill: #a6473f;         /* vintage red, used behind text (buttons, blocks) */
	--hr-fill-ink: #fbf6ea;     /* text on top of --hr-fill */
	--hr-rule: #aaa18e;
	--hr-band: #302d29;
	--hr-band-ink: #f3ebd8;
	--hr-band-accent: #e8705f;

	--hr-font-nameplate: "Old Standard TT", Georgia, serif;
	--hr-font-head: "Old Standard TT", Georgia, "Times New Roman", serif;
	--hr-head-weight: 700;
	--hr-head-case: none;
	--hr-head-track: -0.012em;
	--hr-font-deck: "Old Standard TT", Georgia, "Times New Roman", serif;
	--hr-font-body: "Source Serif 4", Georgia, "Times New Roman", serif;
	--hr-font-ui: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

	--hr-max: 1240px;
	--hr-read: 52rem;
	--hr-gutter: clamp(16px, 4vw, 40px);
	--hr-colgap: 1.6rem;
	--hr-sticky-top: 1.25rem;
	color-scheme: light;
}
/* Night edition. Same vintage red; text uses a brighter shade of it so it stays readable on dark paper. */
:root[data-theme="dark"] {
	--hr-paper: #1a1714;
	--hr-parchment: #26221e;
	--hr-ink: #eee4cf;
	--hr-ink-soft: #bdb3a0;
	--hr-accent: #e0533f;
	--hr-fill: #a6473f;
	--hr-fill-ink: #fbf6ea;
	--hr-rule: #5b544a;
	--hr-band: #100e0c;
	--hr-band-ink: #eee4cf;
	--hr-band-accent: #e8705f;
	color-scheme: dark;
}
body.admin-bar { --hr-sticky-top: calc(1.25rem + 32px); }

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 1rem; }
body {
	margin: 0; background: var(--hr-paper); color: var(--hr-ink);
	font: 400 1.0625rem/1.65 var(--hr-font-body);
	/* A very faint paper grain, drawn in CSS so it costs no download. */
	background-image: radial-gradient(rgba(70, 55, 30, 0.045) 1px, transparent 1px);
	background-size: 5px 5px;
}
img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: var(--hr-accent); text-underline-offset: 0.18em; text-decoration-thickness: 1px; transition: color 0.15s ease; }
a:hover { color: var(--hr-ink); }
:focus-visible { outline: 3px solid var(--hr-accent); outline-offset: 3px; }
::selection { background: var(--hr-fill); color: var(--hr-fill-ink); }
h1, h2, h3, h4, h5, h6 { margin: 0; font-family: "Old Standard TT", Georgia, serif; font-weight: 700; }
p { margin: 0 0 1.1em; }
.screen-reader-text, .sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link { position: absolute; left: 8px; top: -60px; background: var(--hr-ink); color: var(--hr-paper); padding: 0.7rem 1rem; z-index: 100; font-family: var(--hr-font-ui); }
.skip-link:focus { top: 8px; }
.wrap { width: 100%; max-width: calc(var(--hr-max) + var(--hr-gutter) * 2); margin: 0 auto; padding-left: var(--hr-gutter); padding-right: var(--hr-gutter); }
.wrap--narrow { max-width: calc(48rem + var(--hr-gutter) * 2); }
.empty { padding: 3rem 0; text-align: center; font-family: var(--hr-font-deck); font-size: 1.2rem; color: var(--hr-ink-soft); }
.head-font, .card__title, .story__title, .section-head__title, .archive-head__title, .entry h2, .glance__big, .glance__heading, .numbers__n, .feature-band__title, .newsletter__title, .comments__title, .otd__title, .hr-htl__when, .hr-timeline__when {
	font-family: var(--hr-font-head); font-weight: var(--hr-head-weight); text-transform: var(--hr-head-case); letter-spacing: var(--hr-head-track);
}

/* ---------- Small shared pieces ---------- */
.kicker { font: 700 0.7rem/1.2 var(--hr-font-ui); letter-spacing: 0.15em; text-transform: uppercase; color: var(--hr-accent); margin: 0 0 0.5rem; }
.kicker a { color: inherit; text-decoration: none; }
.kicker--light { color: var(--hr-band-accent); }
.btn {
	display: inline-block; font: 700 0.78rem/1 var(--hr-font-ui); letter-spacing: 0.1em; text-transform: uppercase; text-decoration: none; cursor: pointer;
	background: var(--hr-fill); color: var(--hr-fill-ink); border: 1px solid var(--hr-fill); padding: 0.95rem 1.3rem; min-height: 44px; border-radius: 0;
	transition: background 0.15s ease, color 0.15s ease;
}
.btn:hover { background: var(--hr-ink); border-color: var(--hr-ink); color: var(--hr-paper); }
.btn--ghost { background: transparent; color: var(--hr-ink); border-color: var(--hr-ink); }
.btn--ghost:hover { background: var(--hr-ink); color: var(--hr-paper); }
.btn--light { background: var(--hr-band-ink); border-color: var(--hr-band-ink); color: var(--hr-band); }
.btn--light:hover { background: var(--hr-fill); border-color: var(--hr-fill); color: var(--hr-fill-ink); }

/* Section heading: thick-and-thin newspaper rules above, title between, thin rule below */
.section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin: 2.75rem 0 1.5rem; padding: 0.8rem 0; border-top: 3px double var(--hr-ink); border-bottom: 1px solid var(--hr-ink); }
.section-head__title { font-size: clamp(1.5rem, 3.4vw, 2.1rem); line-height: 1.05; text-transform: uppercase; letter-spacing: 0.06em; }
.section-head__title--center { text-align: center; width: 100%; }
.section-head__more { font: 700 0.72rem/1.2 var(--hr-font-ui); letter-spacing: 0.1em; text-transform: uppercase; color: var(--hr-ink); text-decoration: none; white-space: nowrap; }
.section-head__more:hover { color: var(--hr-accent); }

/* ---------- Masthead ---------- */
.masthead { background: var(--hr-paper); }
.masthead__bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 54px; position: relative; border-bottom: 1px solid var(--hr-ink); }
.masthead__nav .menu, .masthead__nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 1.5rem; }
.masthead__nav a, .menu--utility a {
	display: inline-flex; align-items: center; min-height: 44px;
	font: 700 0.72rem/1 var(--hr-font-ui); letter-spacing: 0.12em; text-transform: uppercase; color: var(--hr-ink); text-decoration: none;
}
.masthead__nav li a::before { content: "\2022\00a0"; color: var(--hr-accent); }
.masthead__nav a:hover, .menu--utility a:hover { color: var(--hr-accent); }
.masthead__nav .current-menu-item > a, .masthead__nav .current-cat > a { box-shadow: inset 0 -2px 0 var(--hr-accent); }
.masthead__tools { display: flex; align-items: center; gap: 0.15rem; }
.masthead__tools .menu--utility { list-style: none; margin: 0 0.6rem 0 0; padding: 0; display: flex; gap: 1.1rem; }
.icon-btn {
	display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0;
	background: none; border: 0; border-radius: 0; cursor: pointer; color: var(--hr-ink); text-decoration: none;
}
.icon-btn svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.icon-btn:hover { color: var(--hr-accent); }
.icon-btn[aria-expanded="true"] { color: var(--hr-accent); box-shadow: inset 0 -2px 0 var(--hr-accent); }
.icon--sun { display: none; }
:root[data-theme="dark"] .icon--moon { display: none; }
:root[data-theme="dark"] .icon--sun { display: block; }
.brand { text-decoration: none; display: block; }
.brand__block { display: block; background: var(--hr-fill); color: var(--hr-fill-ink); font: 400 1.65rem/1 var(--hr-font-nameplate); letter-spacing: 0.01em; padding: 0.35rem 0.9rem 0.45rem; white-space: nowrap; }
.brand__logo { max-height: 48px; width: auto; }
.brand-spacer { flex: 1; }
.masthead__menu-btn { display: none; }

/* Dropdowns use separate 44px disclosure buttons, leaving parent links clickable. */
.hr-dropdowns .menu-item-has-children { position: relative; display: flex; flex-wrap: wrap; align-items: center; }
.hr-dropdowns .menu-item-has-children > a { flex: 1; min-width: 0; }
.submenu-toggle { display: inline-flex; align-items: center; justify-content: center; width: 44px; min-height: 44px; padding: 0; background: none; border: 0; color: var(--hr-ink); cursor: pointer; }
.submenu-toggle::after { content: ""; width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-2px); }
.submenu-toggle[aria-expanded="true"]::after { transform: rotate(225deg) translate(-2px, -1px); }
.submenu-toggle:hover { color: var(--hr-accent); }
.hr-dropdowns ul.sub-menu { display: block; list-style: none; margin: 0; padding: 0.35rem 0.8rem; width: 18rem; max-width: calc(100vw - 2rem); position: absolute; top: 100%; left: 0; z-index: 60; background: var(--hr-paper); border: 1px solid var(--hr-ink); box-shadow: 0 5px 12px rgb(0 0 0 / 12%); max-height: 65vh; overflow-y: auto; }
.hr-dropdowns ul.sub-menu[hidden] { display: none; }
.hr-dropdowns .sub-menu a { line-height: 1.5; padding: 0.65rem 0; overflow-wrap: anywhere; }
.hr-dropdowns .sub-menu a::before { content: none; }
.hr-dropdowns .sub-menu .sub-menu { position: static; flex-basis: 100%; width: auto; max-width: 100%; max-height: none; box-shadow: none; border: 0; border-left: 1px solid var(--hr-rule); padding: 0 0 0 0.8rem; }

/* Nameplate (front page): blackletter title between two "ears", framed by double rules */
.nameplate { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 1.5rem; padding: 1.1rem 0 1.2rem; border-bottom: 4px double var(--hr-ink); }
.nameplate__title { text-align: center; }
.nameplate__title h1 { font: 700 clamp(3rem, 7.2vw, 6.2rem)/0.95 var(--hr-font-nameplate); letter-spacing: 0; text-transform: none; }
.nameplate__title h1 a { color: var(--hr-ink); text-decoration: none; }
.nameplate__logo { margin: 0 auto; max-height: 150px; width: auto; }
.nameplate__tagline { margin: 0.5rem 0 0; font: 700 clamp(0.66rem, 1.6vw, 0.82rem)/1.3 var(--hr-font-ui); letter-spacing: 0.22em; text-transform: uppercase; }
.nameplate__ear {
	position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.5rem;
	width: 9.6rem; padding: 0.9rem 0.6rem 0.8rem; text-align: center;
	border: 1px solid var(--hr-ink); outline: 1px solid var(--hr-ink); outline-offset: 4px;
	background: linear-gradient(var(--hr-paper), var(--hr-paper)) padding-box, repeating-linear-gradient(0deg, transparent 0 3px, rgba(60, 45, 25, 0.05) 3px 4px);
	color: var(--hr-ink);
}
.nameplate__ear::before, .nameplate__ear::after { content: "\2605"; position: absolute; top: -0.65rem; font-size: 0.7rem; line-height: 1; color: var(--hr-accent); background: var(--hr-paper); padding: 0 0.25rem; }
.nameplate__ear::before { left: 0.7rem; }
.nameplate__ear::after { right: 0.7rem; }
.ear__art { display: block; width: 4.6rem; height: 4.6rem; color: var(--hr-ink); }
.ear__art svg { width: 100%; height: 100%; }
.ear__text { display: block; padding-top: 0.5rem; border-top: 1px solid var(--hr-ink); font: 700 0.62rem/1.45 var(--hr-font-ui); letter-spacing: 0.16em; text-transform: uppercase; }
.nameplate__ear--l { justify-self: start; }
.nameplate__ear--r { justify-self: end; }
.nameplate__ear small { display: block; font: italic 400 0.8rem/1.3 var(--hr-font-body); text-transform: none; letter-spacing: 0; color: var(--hr-ink-soft); margin-top: 0.2rem; }

.search-panel { border-bottom: 1px solid var(--hr-rule); background: var(--hr-parchment); padding: 1rem 0; }
.js .search-panel { display: none; }
.js .search-panel.is-open { display: block; }
.search-form { display: flex; gap: 0.5rem; max-width: 40rem; margin: 0 auto; }
.search-form__input { flex: 1; min-width: 0; font: 400 1rem/1.4 var(--hr-font-body); padding: 0.8rem 1rem; min-height: 44px; border: 1px solid var(--hr-ink); border-radius: 0; background: var(--hr-paper); color: var(--hr-ink); }

/* ---------- Story cards ("clippings") ---------- */
.card { position: relative; display: flex; flex-direction: column; gap: 0.7rem; }
.card__media { position: relative; overflow: hidden; background: var(--hr-parchment); aspect-ratio: 8 / 5; border: 1px solid var(--hr-ink); }
.card__media img { width: 100%; height: 100%; object-fit: cover; transition: filter 0.3s ease; filter: sepia(0.28) contrast(1.04); }
.card:hover .card__media img, .card:focus-within .card__media img { filter: sepia(0); }
.thumb-empty {
	display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding: 1rem; text-align: center;
	font: 700 1.2rem/1.1 var(--hr-font-head); text-transform: uppercase; letter-spacing: 0.1em; color: var(--hr-ink-soft);
	background: repeating-linear-gradient(135deg, var(--hr-parchment), var(--hr-parchment) 8px, var(--hr-paper) 8px, var(--hr-paper) 16px);
}
.card__title { font-size: 1.4rem; line-height: 1.12; }
.card__link { color: var(--hr-ink); text-decoration: none; background-image: linear-gradient(var(--hr-accent), var(--hr-accent)); background-size: 0 2px; background-position: 0 100%; background-repeat: no-repeat; transition: background-size 0.25s ease; }
.card__link::after { content: ""; position: absolute; inset: 0; z-index: 1; } /* the whole card is the link */
.card:hover .card__link, .card__link:focus-visible { background-size: 100% 2px; }
.card__link:focus-visible { outline: 3px solid var(--hr-accent); outline-offset: 4px; }
.card__excerpt { margin: 0; font-size: 0.95rem; line-height: 1.55; text-align: justify; hyphens: auto; }
.card__meta { margin: 0; font: 700 0.66rem/1.4 var(--hr-font-ui); letter-spacing: 0.1em; text-transform: uppercase; color: var(--hr-ink-soft); }
.card__more { font: 700 0.72rem/1 var(--hr-font-ui); letter-spacing: 0.1em; text-transform: uppercase; color: var(--hr-accent); }
.card--lead { gap: 0.9rem; }
.card--lead .card__title { font-size: clamp(2.3rem, 4.6vw, 3.9rem); line-height: 1; text-align: center; }
.card--lead .kicker { text-align: center; }
.card--lead .card__excerpt { font: 400 1.1rem/1.55 var(--hr-font-body); text-align: justify; }
.card--lead .card__excerpt::first-letter { font: 400 3.4em/0.8 var(--hr-font-nameplate); float: left; padding: 0.08em 0.08em 0 0; color: var(--hr-accent); }
.card--lead .card__media { aspect-ratio: 3 / 2; }
.card--lead .card__meta, .card--lead .card__more { text-align: center; }
.card--brief .card__title, .card--plain .card__title { font-size: 1.2rem; line-height: 1.16; }
.card--brief .card__media { aspect-ratio: 4 / 3; }
.card--plain { padding: 0.95rem 0; border-top: 1px solid var(--hr-rule); }
.card--plain:first-child { border-top: 0; padding-top: 0; }
.card--text { padding: 1.1rem 1.15rem; background: var(--hr-parchment); border: 1px solid var(--hr-ink); outline: 1px solid var(--hr-ink); outline-offset: -5px; }
.card--text .card__title { font-size: 1.45rem; }
.card--compact .card__title { font-size: 1.1rem; line-height: 1.2; }

/* ---------- Front page: a real newspaper grid ---------- */
.front-top {
	display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-areas: "left lead lead right";
	padding: 1.6rem 0 1.8rem; border-bottom: 1px solid var(--hr-ink);
}
.front-top__left { grid-area: left; padding-right: var(--hr-colgap); border-right: 1px solid var(--hr-ink); }
.front-top__lead { grid-area: lead; padding: 0 var(--hr-colgap); border-right: 1px solid var(--hr-ink); }
.front-top__right { grid-area: right; padding-left: var(--hr-colgap); display: flex; flex-direction: column; gap: 1.4rem; }

/* Under the lead story: two newspaper columns that fill in with more stories */
.front-top__cols { margin-top: 1.4rem; padding-top: 1.2rem; border-top: 3px double var(--hr-ink); column-count: 2; column-gap: calc(var(--hr-colgap) * 1.5); column-rule: 1px solid var(--hr-ink); }
.front-top__cols > .card { break-inside: avoid; padding: 0 0 0.95rem; margin-bottom: 0.95rem; border-bottom: 1px solid var(--hr-rule); border-top: 0; }

/* Newspaper flow: stories run down one column, then the next, with thin rules between */
.front-grid { column-count: 4; column-gap: calc(var(--hr-colgap) * 2); column-rule: 1px solid var(--hr-ink); }
.hr-cols-3 .front-grid { column-count: 3; }
.front-grid > .card { break-inside: avoid; margin-bottom: 1.6rem; padding-bottom: 1.6rem; border-bottom: 1px solid var(--hr-rule); }
.front-grid > .card--text { padding-bottom: 1.1rem; }
.front-grid--topics { column-count: var(--hr-topic-cols, 4); }
.topic { break-inside: avoid; margin-bottom: 1.6rem; }
.topic__head { margin: 0 0 0.9rem; padding-bottom: 0.5rem; border-bottom: 3px double var(--hr-ink); font: 900 1.1rem/1.2 var(--hr-font-head); letter-spacing: 0.1em; text-transform: uppercase; }
.topic__head a { color: var(--hr-ink); text-decoration: none; }
.topic__head a:hover { color: var(--hr-accent); }

.numbers { margin: 3rem 0 0; }
.numbers .section-head__title { display: block; padding: 0; }
.numbers__list { list-style: none; margin: 0; padding: 1.5rem 0 0.5rem; display: flex; justify-content: center; flex-wrap: wrap; }
.numbers__list li { flex: 1 1 160px; text-align: center; padding: 0.5rem 1rem; border-left: 1px solid var(--hr-ink); }
.numbers__list li:first-child { border-left: 0; }
.numbers__n { display: block; font-size: clamp(2.4rem, 6vw, 3.6rem); line-height: 1; }
.numbers__l { display: block; font: 700 0.7rem/1.3 var(--hr-font-ui); letter-spacing: 0.14em; text-transform: uppercase; color: var(--hr-accent); margin-top: 0.4rem; }

/* On this day in history */
.otd { border: 1px solid var(--hr-ink); outline: 1px solid var(--hr-ink); outline-offset: 3px; padding: 1rem 1.05rem; background: var(--hr-parchment); }
.otd__title { font-size: 1.25rem; line-height: 1.1; text-align: center; text-transform: uppercase; letter-spacing: 0.04em; }
.otd__day { text-align: center; margin: 0.15rem 0 0.7rem; padding-bottom: 0.6rem; border-bottom: 1px solid var(--hr-ink); font: 700 0.7rem/1.2 var(--hr-font-ui); letter-spacing: 0.16em; text-transform: uppercase; color: var(--hr-accent); }
.otd__list { list-style: none; margin: 0; padding: 0; }
.otd__item { display: grid; grid-template-columns: 3.4rem 1fr; gap: 0.5rem; padding: 0.55rem 0; border-top: 1px solid var(--hr-rule); font-size: 0.9rem; line-height: 1.4; }
.otd__item:first-child { border-top: 0; }
.otd__year { font: 900 1.05rem/1.2 var(--hr-font-head); color: var(--hr-accent); }
.otd__text a { color: var(--hr-ink); font-weight: 700; text-decoration-color: var(--hr-accent); }
.otd__ours { display: block; font: 700 0.64rem/1.3 var(--hr-font-ui); letter-spacing: 0.12em; text-transform: uppercase; font-style: normal; color: var(--hr-accent); margin-top: 0.15rem; }
.otd__credit { margin: 0.7rem 0 0; font: 400 0.7rem/1.4 var(--hr-font-ui); color: var(--hr-ink-soft); }
.otd__credit a { color: inherit; }

.feature-band { background: var(--hr-band); color: var(--hr-band-ink); margin: 3.5rem 0 0; padding: 3rem 0; border-top: 4px double var(--hr-band-ink); }
.feature-band__inner { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 3rem; align-items: center; }
.feature-band__title { font-size: clamp(2rem, 4.6vw, 3.4rem); line-height: 1.02; margin: 0 0 1rem; }
.feature-band__text p { font-family: var(--hr-font-deck); font-size: 1.05rem; line-height: 1.6; }
.feature-band .hr-video { margin: 0; }
.map-teaser { padding-bottom: 1rem; }

/* ---------- Story page ---------- */
.story__head { text-align: center; max-width: 52rem; margin: 0 auto; padding: 2.25rem 0 1.5rem; }
.story__title { font-size: clamp(2.3rem, 6.4vw, 4.4rem); line-height: 1.02; }
.story__deck { font: italic 400 clamp(1.1rem, 2.4vw, 1.4rem)/1.45 var(--hr-font-deck); margin: 1rem auto 0; color: var(--hr-ink); }
.story__byline { display: flex; justify-content: center; gap: 1.2rem; margin: 1.1rem 0 0; padding-top: 0.9rem; border-top: 1px solid var(--hr-ink); font: 700 0.7rem/1 var(--hr-font-ui); letter-spacing: 0.12em; text-transform: uppercase; color: var(--hr-ink-soft); }
.story__byline span + span::before { content: "\2022"; margin-right: 1.2rem; color: var(--hr-accent); }
.story__figure { margin: 0 0 1.8rem; max-width: var(--hr-read); }
.story__figure img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; background: var(--hr-parchment); border: 1px solid var(--hr-ink); }
.story__figure figcaption, .hr-clipping figcaption { margin-top: 0.5rem; font: italic 400 0.85rem/1.45 var(--hr-font-body); color: var(--hr-ink-soft); }
.hr-credit { font-style: normal; font-family: var(--hr-font-ui); font-size: 0.7rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--hr-ink-soft); }
.hr-credit a { color: inherit; }
.story__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; padding-bottom: 3rem; }
.story__content { min-width: 0; }

/* "At a glance": sticky column on wide screens */
.glance { display: grid; gap: 1rem; align-content: start; }
.glance__heading { font-size: 1.3rem; line-height: 1; text-transform: uppercase; letter-spacing: 0.06em; padding-bottom: 0.6rem; border-bottom: 3px double var(--hr-ink); }
.glance__box { background: var(--hr-parchment); border: 1px solid var(--hr-ink); outline: 1px solid var(--hr-rule); outline-offset: -5px; padding: 1.1rem 1.2rem; }
.glance__box--note { background: transparent; border-style: dashed; }
.glance__label { font: 700 0.68rem/1.2 var(--hr-font-ui); letter-spacing: 0.15em; text-transform: uppercase; color: var(--hr-accent); margin: 0 0 0.45rem; }
.glance__big { font-size: 1.75rem; line-height: 1.08; margin: 0; }
.glance__big--sm { font-size: 1.3rem; }
.glance__small { margin: 0.35rem 0 0; font-size: 0.9rem; color: var(--hr-ink-soft); }
.glance__links { margin: 0.6rem 0 0; display: flex; flex-wrap: wrap; gap: 0.3rem 0.9rem; font: 700 0.72rem/1.4 var(--hr-font-ui); letter-spacing: 0.06em; text-transform: uppercase; }
.glance__links a { color: var(--hr-ink); text-decoration-color: var(--hr-accent); }
.glance__people { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; }
.glance__people li { font-size: 0.95rem; line-height: 1.35; }
.glance__people span { display: block; font: 400 0.8rem/1.3 var(--hr-font-ui); color: var(--hr-ink-soft); }
.glance__toc { padding: 0.25rem 0 0; }
.glance__toc ol { margin: 0; padding-left: 1.1rem; font: 400 0.92rem/1.4 var(--hr-font-ui); }
.glance__toc li { margin: 0.35rem 0; }
.glance__toc a { color: var(--hr-ink); text-decoration: none; }
.glance__toc a:hover, .glance__toc a.is-current { color: var(--hr-accent); text-decoration: underline; }
.glance .hr-map { margin: 0.6rem 0 0; }
.glance__map summary, .glance__toc summary { cursor: pointer; list-style-position: inside; min-height: 32px; padding: 0.3rem 0; font: 700 0.72rem/1.3 var(--hr-font-ui); letter-spacing: 0.1em; text-transform: uppercase; }
.glance__toc summary { margin: 0; color: var(--hr-accent); }
.glance__map { margin-top: 0.5rem; }

/* Reading column */
.entry { font-size: 1.15rem; line-height: 1.72; max-width: var(--hr-read); }
.entry > * { max-width: 100%; }
.entry h2 { font-size: clamp(1.7rem, 3.6vw, 2.3rem); line-height: 1.1; margin: 2.1em 0 0.55em; padding-top: 0.6em; border-top: 3px double var(--hr-ink); }
.entry h3 { font: 700 1.3rem/1.25 var(--hr-font-deck); margin: 1.8em 0 0.5em; }
.entry h4 { font: 700 1.1rem/1.3 var(--hr-font-head); text-transform: uppercase; letter-spacing: 0.12em; margin: 1.6em 0 0.4em; color: var(--hr-accent); }
.hr-dropcap .entry > p:first-of-type::first-letter { font: 400 4.4em/0.78 var(--hr-font-nameplate); float: left; padding: 0.07em 0.1em 0 0; color: var(--hr-accent); }
.entry img { height: auto; }
.entry figure, .entry .wp-caption { margin: 1.8rem 0; max-width: 100%; }
.entry .wp-caption-text, .entry figcaption { font: italic 400 0.85rem/1.45 var(--hr-font-body); color: var(--hr-ink-soft); margin-top: 0.4rem; }
.entry blockquote:not(.hr-quote) { margin: 1.8rem 0; padding: 0.2rem 0 0.2rem 1.3rem; border-left: 3px solid var(--hr-accent); font-style: italic; }
.entry ul, .entry ol { padding-left: 1.4rem; }
.entry li { margin: 0.35em 0; }
.entry a { text-decoration-color: color-mix(in srgb, var(--hr-accent) 55%, transparent); }
.entry table { width: 100%; border-collapse: collapse; font: 0.95rem/1.4 var(--hr-font-ui); display: block; overflow-x: auto; }
.entry th, .entry td { border: 1px solid var(--hr-rule); padding: 0.5rem 0.7rem; text-align: left; }
.entry hr { border: 0; border-top: 3px double var(--hr-ink); margin: 2.5rem 0; }
.entry details { margin: 1.5rem 0; }

/* Shortcode parts */
.hr-quote { margin: 2.2rem 0; padding: 1.4rem 0 1.2rem; border-top: 3px double var(--hr-ink); border-bottom: 3px double var(--hr-ink); text-align: center; }
.hr-quote__text { font: italic 700 clamp(1.3rem, 3vw, 1.75rem)/1.3 var(--hr-font-deck); }
.hr-quote__text p { margin: 0; }
.hr-quote__by { margin-top: 0.8rem; font: 700 0.7rem/1.3 var(--hr-font-ui); letter-spacing: 0.14em; text-transform: uppercase; color: var(--hr-accent); }
.hr-sources { margin: 2rem 0; border: 1px solid var(--hr-ink); background: var(--hr-parchment); }
.hr-sources summary, .entry details > summary { cursor: pointer; padding: 1rem 1.2rem; font: 700 0.78rem/1.3 var(--hr-font-ui); letter-spacing: 0.1em; text-transform: uppercase; min-height: 44px; }
.hr-sources summary:hover { color: var(--hr-accent); }
.hr-sources__body { padding: 0 1.2rem 1.1rem; font-size: 0.95rem; line-height: 1.55; }
.hr-sources__body ol, .hr-sources__body ul { padding-left: 1.2rem; }
.hr-clipping { margin: 2rem 0; padding: 0.7rem 0.7rem 0.6rem; background: #fbf7ec; border: 1px solid var(--hr-ink); box-shadow: 3px 3px 0 var(--hr-rule); }
.hr-clipping__zoom { position: relative; display: block; cursor: zoom-in; }
.hr-clipping__img { width: 100%; filter: sepia(0.18) contrast(1.02); }
.hr-clipping__hint { position: absolute; right: 8px; bottom: 8px; font: 700 0.66rem/1 var(--hr-font-ui); letter-spacing: 0.08em; text-transform: uppercase; background: var(--hr-ink); color: var(--hr-paper); padding: 0.45rem 0.6rem; opacity: 0; transition: opacity 0.2s ease; }
.hr-clipping__zoom:hover .hr-clipping__hint, .hr-clipping__zoom:focus-visible .hr-clipping__hint { opacity: 1; }
.hr-clipping figcaption { color: #4b463e; }
.hr-timeline { list-style: none; margin: 1.6rem 0; padding: 0; border-left: 2px solid var(--hr-ink); }
.hr-timeline li { position: relative; padding: 0 0 1.1rem 1.4rem; margin: 0; display: grid; gap: 0.1rem; }
.hr-timeline li::before { content: ""; position: absolute; left: -7px; top: 0.45rem; width: 12px; height: 12px; border-radius: 50%; background: var(--hr-accent); border: 2px solid var(--hr-paper); }
.hr-timeline__when { font-size: 1.1rem; line-height: 1.2; text-transform: uppercase; letter-spacing: 0.04em; }
.hr-timeline__what { font-size: 1rem; line-height: 1.55; }
.story__timeline h2 { margin-top: 2.2em; }
.hr-affiliate { font: italic 400 0.85rem/1.4 var(--hr-font-body); color: var(--hr-ink-soft); border-top: 1px solid var(--hr-rule); border-bottom: 1px solid var(--hr-rule); padding: 0.5rem 0; }
.hr-onthisday { list-style: none; padding: 0; }
.hr-onthisday__year { font: 900 1.3rem/1 var(--hr-font-head); color: var(--hr-accent); margin-right: 0.4rem; }

/* Tooltip triggers: restrained, only a dotted underline */
.hr-term { all: unset; cursor: help; border-bottom: 1px dotted var(--hr-accent); }
.hr-term:hover, .hr-term:focus-visible { color: var(--hr-accent); }
.hr-term:focus-visible { outline: 3px solid var(--hr-accent); outline-offset: 2px; }
.hr-note { all: unset; cursor: pointer; color: var(--hr-accent); font: 700 0.7rem/1 var(--hr-font-ui); padding: 0 0.15em; }
.hr-note:focus-visible { outline: 3px solid var(--hr-accent); outline-offset: 2px; }
.hr-tip {
	position: absolute; z-index: 60; max-width: min(20rem, calc(100vw - 24px)); padding: 0.7rem 0.9rem;
	background: var(--hr-ink); color: var(--hr-paper); font: 400 0.85rem/1.45 var(--hr-font-ui); border-radius: 0;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25); pointer-events: none; opacity: 0; transition: opacity 0.12s ease;
}
.hr-tip.is-on { opacity: 1; }

/* Reading progress bar */
.read-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 50; background: transparent; }
.read-progress span { display: block; height: 100%; background: var(--hr-accent); transform-origin: 0 50%; transform: scaleX(0); }

/* Lightbox for clippings */
.hr-lightbox { border: 0; padding: 0; background: transparent; max-width: 96vw; max-height: 96vh; }
.hr-lightbox::backdrop { background: rgba(20, 17, 14, 0.88); }
.hr-lightbox img { max-width: 96vw; max-height: 92vh; object-fit: contain; background: #fbf7ec; }
.hr-lightbox button { position: absolute; top: 8px; right: 8px; font: 700 0.75rem/1 var(--hr-font-ui); text-transform: uppercase; letter-spacing: 0.08em; background: var(--hr-paper); color: var(--hr-ink); border: 0; padding: 0.7rem 0.9rem; min-height: 44px; cursor: pointer; }

/* Tags, related, archive heads */
.story__tags { margin-top: 2rem; display: flex; flex-wrap: wrap; gap: 0.4rem; font: 700 0.7rem/1 var(--hr-font-ui); letter-spacing: 0.08em; text-transform: uppercase; }
.story__tags a { border: 1px solid var(--hr-rule); padding: 0.55rem 0.7rem; color: var(--hr-ink); text-decoration: none; min-height: 34px; }
.story__tags a:hover { border-color: var(--hr-accent); color: var(--hr-accent); }
.related { padding-bottom: 3rem; }
.archive-head { text-align: center; padding: 2.5rem 0 1.5rem; border-bottom: 3px double var(--hr-ink); margin-bottom: 2rem; }
.archive-head__title { font-size: clamp(2.2rem, 6.4vw, 3.8rem); line-height: 1.02; }
.archive-head__desc { max-width: 40rem; margin: 0.8rem auto 0; font-family: var(--hr-font-deck); }
.archive-head__search { margin-top: 1.2rem; }
.filters { display: flex; flex-wrap: wrap; gap: 1rem; align-items: flex-end; margin: 0 0 2rem; padding: 1.2rem; background: var(--hr-parchment); border: 1px solid var(--hr-ink); }
.filters__field { display: grid; gap: 0.3rem; flex: 1 1 150px; font: 700 0.68rem/1.2 var(--hr-font-ui); letter-spacing: 0.1em; text-transform: uppercase; }
.filters__field--wide { flex: 2 1 240px; }
.filters select, .filters input { font: 400 1rem/1.3 var(--hr-font-body); padding: 0.7rem; min-height: 44px; border: 1px solid var(--hr-ink); border-radius: 0; background: var(--hr-paper); color: var(--hr-ink); }
.pagination { margin: 2.5rem 0; }
.pagination ul { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 0.4rem; padding: 0; margin: 0; }
.pagination a, .pagination span { display: block; min-width: 44px; min-height: 44px; padding: 0.7rem 0.9rem; text-align: center; font: 700 0.75rem/1.6 var(--hr-font-ui); letter-spacing: 0.06em; text-transform: uppercase; border: 1px solid var(--hr-rule); color: var(--hr-ink); text-decoration: none; }
.pagination .current { background: var(--hr-ink); color: var(--hr-paper); border-color: var(--hr-ink); }
.pagination a:hover { border-color: var(--hr-accent); color: var(--hr-accent); }

/* Ads: reserved space only (switched on in the Customizer) */
.ad-slot { margin: 1.5rem 0; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: var(--ad-hm, 0); background: transparent; overflow: hidden; }
.ad-slot::before { content: attr(aria-label); font: 700 0.6rem/1 var(--hr-font-ui); letter-spacing: 0.14em; text-transform: uppercase; color: var(--hr-ink-soft); margin-bottom: 0.4rem; }
.ad-slot__admin { border: 1px dashed var(--hr-ink-soft); padding: 1rem; font: 400 0.8rem/1.4 var(--hr-font-ui); color: var(--hr-ink-soft); text-align: center; }
@media (min-width: 760px) { .ad-slot { min-height: var(--ad-h, 0); } }
.ad-slot--story-side { display: none; }
@media (min-width: 960px) { .ad-slot--story-side { display: flex; } }

/* Newsletter + footer */
.newsletter { background: var(--hr-parchment); border-top: 4px double var(--hr-ink); border-bottom: 1px solid var(--hr-ink); margin-top: 3.5rem; padding: 2.5rem 0; }
.newsletter__inner { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 2.5rem; align-items: center; }
.newsletter__title { font-size: clamp(1.7rem, 3.6vw, 2.4rem); line-height: 1.05; margin-bottom: 0.4rem; }
.newsletter p { margin: 0; }
.site-footer { padding: 2rem 0 2.5rem; }
.site-footer__row { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; flex-wrap: wrap; border-bottom: 1px solid var(--hr-ink); padding-bottom: 1.2rem; }
.site-footer ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.2rem 1.4rem; }
.site-footer a { font: 700 0.72rem/1 var(--hr-font-ui); letter-spacing: 0.1em; text-transform: uppercase; color: var(--hr-ink); text-decoration: none; display: inline-flex; align-items: center; padding: 0.8rem 0; min-height: 44px; }
.site-footer a:hover { color: var(--hr-accent); }
.site-footer__social { gap: 0.4rem !important; }
.site-footer__social a { padding: 0; min-width: 44px; justify-content: center; }
.site-footer__social a { border: 1px solid var(--hr-ink); border-radius: 50%; width: 44px; height: 44px; transition: background 0.15s ease, color 0.15s ease; }
.site-footer__social a:hover { background: var(--hr-ink); color: var(--hr-paper); }
.site-footer__social svg { width: 20px; height: 20px; fill: currentColor; }
.site-footer__fine { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin: 1rem 0 0; font: italic 400 0.8rem/1.4 var(--hr-font-body); color: var(--hr-ink-soft); }
.site-footer__fine > span { min-width: 0; overflow-wrap: anywhere; }

/* Comments */
.comments { padding: 1rem 0 3rem; }
.comments__title { font-size: 1.8rem; line-height: 1; margin-bottom: 1rem; }
.comments__list, .comments__list ol { list-style: none; padding: 0; }
.comments__list .children { padding-left: 1.2rem; border-left: 1px solid var(--hr-rule); }
.comment__body { padding: 1rem 0; border-top: 1px solid var(--hr-rule); }
.comment__meta { display: flex; align-items: center; gap: 0.6rem; font-family: var(--hr-font-ui); font-size: 0.9rem; }
.comment__meta img { border-radius: 50%; }
.comments input[type="text"], .comments input[type="email"], .comments input[type="url"], .comments textarea { width: 100%; font: 400 1rem/1.4 var(--hr-font-body); padding: 0.7rem; border: 1px solid var(--hr-ink); border-radius: 0; background: var(--hr-paper); color: var(--hr-ink); }
.comments input[type="submit"] { font: 700 0.78rem/1 var(--hr-font-ui); letter-spacing: 0.1em; text-transform: uppercase; background: var(--hr-fill); color: var(--hr-fill-ink); border: 0; padding: 0.95rem 1.3rem; min-height: 44px; cursor: pointer; }

/* ==========================================================================
   Wide screens: sticky facts column
   ========================================================================== */
@media (min-width: 960px) {
	.story__grid { grid-template-columns: minmax(0, 1fr) 20rem; gap: 3rem; align-items: start; }
	.story__content { grid-column: 1; grid-row: 1; }
	.glance { grid-column: 2; grid-row: 1; position: sticky; top: var(--hr-sticky-top); }
}

/* ==========================================================================
   Tablets
   ========================================================================== */
@media (max-width: 1023px) {
	.front-top { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "lead lead" "left right"; }
	.front-top__lead { padding: 0 0 1.6rem; border-right: 0; border-bottom: 1px solid var(--hr-ink); margin-bottom: 1.6rem; }
	.front-top__left { padding-right: var(--hr-colgap); }
	.front-grid, .hr-cols-3 .front-grid { column-count: 2; }
	.front-grid--topics { column-count: 2; }
}

@media (max-width: 1179px) {
	.nameplate { grid-template-columns: 1fr; }
	.nameplate__ear { display: none; }
	.nameplate__title h1 { font-size: clamp(3rem, 9.5vw, 7.2rem); }
}

/* ==========================================================================
   Tablets and phones
   ========================================================================== */
@media (max-width: 959px) {
	.feature-band__inner, .newsletter__inner { grid-template-columns: 1fr; gap: 1.5rem; }
	.glance { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
	.glance__heading, .glance__toc { grid-column: 1 / -1; }

	/* Navigation collapses into a Menu button */
	.masthead__menu-btn { display: inline-flex; align-items: center; gap: 0.6rem; background: none; border: 0; cursor: pointer; font: 700 0.72rem/1 var(--hr-font-ui); letter-spacing: 0.1em; text-transform: uppercase; color: var(--hr-ink); min-height: 44px; padding: 0 0.2rem; }
	.menu-icon, .menu-icon::before, .menu-icon::after { display: block; width: 20px; height: 2px; background: var(--hr-ink); position: relative; content: ""; }
	.menu-icon::before { position: absolute; top: -6px; }
	.menu-icon::after { position: absolute; top: 6px; }
	.masthead__bar { flex-wrap: wrap; }
	.masthead__nav { order: 5; flex-basis: 100%; }
	.js .masthead__nav { display: none; }
	.js .masthead__nav.is-open { display: block; padding-bottom: 0.5rem; border-top: 1px solid var(--hr-rule); }
	.masthead__nav .menu, .masthead__nav ul { flex-direction: column; gap: 0; }
	.masthead__nav a { display: flex; padding: 0.8rem 0; border-bottom: 1px solid var(--hr-rule); }
	.masthead__nav.hr-dropdowns ul.sub-menu { position: static; flex-basis: 100%; width: 100%; max-width: 100%; max-height: none; box-shadow: none; border: 0; border-left: 1px solid var(--hr-rule); padding: 0 0 0 0.8rem; margin-left: 0 !important; }
	.masthead__nav .menu-item-has-children > a { width: calc(100% - 44px); }
	.masthead__nav.is-open { max-height: 75vh; overflow-y: auto; }
	.brand { order: 2; margin: 0 auto; }
	.masthead__menu-btn { order: 1; }
	.masthead__tools { order: 3; }
	.masthead__tools .menu--utility { display: none; }
	.brand-spacer { display: none; }
	.masthead--home .masthead__tools { margin-left: auto; }
}

@media (max-width: 679px) {
	.front-top { grid-template-columns: 1fr; grid-template-areas: "lead" "left" "right"; }
	.front-top__lead { padding-bottom: 1.4rem; margin-bottom: 1.4rem; }
	.front-top__cols { column-count: 1; column-rule: 0; }
	.front-top__left { padding-right: 0; border-right: 0; padding-bottom: 1.4rem; border-bottom: 1px solid var(--hr-ink); margin-bottom: 1.4rem; }
	.front-top__right { padding-left: 0; }
	.front-grid, .hr-cols-3 .front-grid, .front-grid--topics { column-count: 1; column-rule: 0; }
	.numbers__list li { flex-basis: 100%; border-left: 0; border-top: 1px solid var(--hr-rule); }
	.numbers__list li:first-child { border-top: 0; }
	.section-head { flex-direction: column; align-items: flex-start; gap: 0.4rem; }
	.glance { grid-template-columns: 1fr 1fr; gap: 0.6rem; }
	.glance__box { padding: 0.8rem 0.9rem; }
	.glance__box:has(.glance__map), .glance__box--note, .glance__box:has(.glance__people) { grid-column: 1 / -1; }
	.glance__big { font-size: 1.45rem; }
	.glance__big--sm { font-size: 1.2rem; }
	.entry { font-size: 1.08rem; }
	.hr-dropcap .entry > p:first-of-type::first-letter { font-size: 4em; }
	.story__byline { flex-wrap: wrap; }
	.site-footer__fine { flex-direction: column; }
	.card--lead .card__title { font-size: 2.3rem; }
}

@media (max-width: 479px) {
	.masthead__menu-btn .menu-label { display: none; }
	.brand__block { font-size: 1.3rem; padding: 0.3rem 0.7rem 0.4rem; }
	.masthead__bar { flex-wrap: nowrap; }
	.masthead__nav { position: absolute; left: var(--hr-gutter); right: var(--hr-gutter); top: 100%; z-index: 40; background: var(--hr-paper); }
}

/* ==========================================================================
   Motion: small and optional
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition-duration: 0.001ms !important; animation-duration: 0.001ms !important; scroll-behavior: auto !important; }
}

/* ==========================================================================
   Print: clean article with link addresses
   ========================================================================== */
@media print {
	:root, :root[data-theme="dark"] { --hr-paper: #fff; --hr-parchment: #fff; --hr-ink: #000; --hr-ink-soft: #333; --hr-accent: #000; --hr-rule: #999; }
	body { background: #fff; font-size: 11pt; }
	.masthead__bar, .search-panel, .nameplate__tagline, .nameplate__ear, .read-progress, .newsletter, .site-footer__row, .ad-slot, .hr-video, .hr-map, .related, .comments, .glance__toc, .filters, .pagination, .hr-clipping__hint, .otd { display: none !important; }
	.nameplate__title h1 { font-size: 28pt; }
	.story__grid { display: block; }
	.glance { position: static; max-height: none; margin-bottom: 1rem; }
	.entry a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 0.8em; word-break: break-all; }
	.entry { max-width: none; font-size: 11pt; }
	.entry h2, .entry h3 { break-after: avoid; }
	img, figure, .hr-quote, .hr-clipping { break-inside: avoid; }
}

/* Approved October 15: A1 book-and-HR newspaper identity. */
h1,h2,h3,h4,h5,h6 { font-family:"Old Standard TT",Georgia,serif !important; font-weight:700 !important; }
.hr-logo-mark { display:inline-flex; align-items:center; justify-content:center; width:70px; height:70px; flex:none; padding:4px; border:1px solid currentColor; outline:1px solid currentColor; outline-offset:4px; }
.hr-logo-mark svg { width:100%; height:100%; }
.hr-logo-type { min-width:0; display:block; }
.hr-brand-name { font-family:"Old Standard TT",Georgia,serif; font-weight:700; text-transform:uppercase; }
.nameplate { grid-template-columns: minmax(110px,1fr) auto minmax(110px,1fr); gap:1.4rem; }
.nameplate__title { min-width:0; }
.nameplate__title h1 { font-size:clamp(1.15rem,3.2vw,2.8rem); line-height:1.12; }
.nameplate__title h1 a { display:flex; align-items:center; justify-content:center; gap:18px; padding:5px; }
.nameplate .hr-brand-name { white-space:nowrap; }
.hr-logo-rule { display:flex; align-items:center; gap:10px; border-top:1px solid currentColor; padding-top:7px; margin-top:7px; font:400 8px/1.2 var(--hr-font-ui); letter-spacing:2px; }
.hr-logo-rule::before,.hr-logo-rule::after { content:""; height:1px; background:currentColor; flex:1; }
.nameplate__tagline { font:400 clamp(.72rem,1vw,.88rem)/1.5 var(--hr-font-body); text-transform:none; letter-spacing:0; margin:.9rem auto 0; max-width:46rem; }
.brand__block { display:flex; align-items:center; gap:12px; background:transparent; color:var(--hr-ink); padding:7px; font:700 1.2rem/1.1 "Old Standard TT",Georgia,serif; }
.brand__block .hr-logo-mark { width:32px; height:32px; padding:1px; outline-offset:2px; }
.brand__block .hr-brand-name { white-space:nowrap; }
.hr-dropcap .entry > p:first-of-type::first-letter { font-family:"Old Standard TT",Georgia,serif; font-weight:700; }
@media(max-width:1179px){.nameplate{grid-template-columns:1fr;padding-inline:var(--hr-gutter)}.nameplate__title h1{font-size:clamp(1.15rem,4.2vw,3rem)}}
@media(max-width:599px){.nameplate__title h1{font-size:clamp(1rem,5.15vw,1.8rem)}.nameplate__title h1 a{gap:10px;padding:4px 0}.nameplate .hr-logo-mark{width:39px;height:39px;padding:2px;outline-offset:2px}.hr-logo-rule{font-size:6px;letter-spacing:1px;gap:5px;margin-top:5px;padding-top:4px}.nameplate__tagline{max-width:31rem}.brand__block{gap:8px;font-size:.8rem}.brand__block .hr-logo-mark{width:25px;height:25px}.brand__block .hr-brand-name{max-width:135px;white-space:normal}.section-head__title{overflow-wrap:anywhere}}

/* Owner alignment: center the description under the lettering, excluding the book. */
.nameplate__tagline { width:calc(100% - 88px); max-width:none; margin:.9rem 0 0 88px; text-align:center; }
@media(max-width:599px){.nameplate__tagline{width:calc(100% - 49px);margin-left:49px}}

/* Owner refinement: book in the left ear; fireside chair in the right ear. */
.nameplate__tagline { width:100%; max-width:none; margin:.9rem auto 0; text-align:center; }
.nameplate__ear--l .ear__art { width:4.8rem; height:4.8rem; }
.nameplate__ear--r .ear__art { width:6rem; height:4.8rem; }
@media(max-width:599px){.nameplate__title h1{font-size:clamp(1.15rem,6.2vw,1.8rem)}.nameplate__tagline{width:100%;margin-left:auto}}

/* Owner refinement: give the lead story breathing room and center its reading link. */
.card--lead .card__excerpt { margin-top:1.15rem; }
.card--lead .card__more { display:block; width:100%; margin-top:.8rem; text-align:center; }

/* Footer copyright can contain simple HTML such as links. */
.site-footer__copyright a { font: inherit; letter-spacing: 0; text-transform: none; text-decoration: underline; display: inline; padding: 0; min-height: 0; }

/* Inner pages (not the front page): a top bar with the logo on the left and the icons on the right,
   then the menu bar underneath. */
.masthead__top { border-bottom: 1px solid var(--hr-rule); }
.masthead__topbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 64px; padding-top: 0.35rem; padding-bottom: 0.35rem; }
.masthead__topbar .brand { flex: 0 1 auto; min-width: 0; margin: 0; }
.masthead__topbar .masthead__tools { flex: none; margin-left: auto; }
.masthead:not(.masthead--home) .masthead__bar { justify-content: flex-start; }
@media (min-width: 960px) {
	.masthead:not(.masthead--home) .masthead__nav { margin-left: 0; }
	.masthead:not(.masthead--home) .masthead__menu-btn { display: none; }
}
@media (max-width: 959px) {
	.masthead:not(.masthead--home) .masthead__bar { flex-wrap: wrap; }
	.masthead:not(.masthead--home) .masthead__menu-btn { order: 1; }
	.masthead:not(.masthead--home) .masthead__nav { order: 5; }
	.masthead__topbar .masthead__tools .menu--utility { display: none; }
}
@media (max-width: 479px) {
	.masthead:not(.masthead--home) .masthead__bar { flex-wrap: wrap; }
	.masthead__topbar { min-height: 56px; gap: 0.25rem; }
	.masthead__topbar .masthead__tools { gap: 0; }
	.masthead__topbar .icon-btn { width: 40px; }
	.masthead__menu-btn .menu-label { display: inline; }
	.masthead:not(.masthead--home) .masthead__nav { position: absolute; left: var(--hr-gutter); right: var(--hr-gutter); top: 100%; z-index: 40; background: var(--hr-paper); }
}

/* Ears sit at the page edges, nudged in 20px. */
@media (min-width: 1180px) {
	.nameplate__ear--l { margin-left: 20px; }
	.nameplate__ear--r { margin-right: 20px; }
}

/* Back to top arrow: floats in the bottom right corner and appears after scrolling down. */
.to-top { position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 45; display: block; padding: 0; }
.to-top__btn { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; border: 1px solid var(--hr-ink); border-radius: 50%; color: var(--hr-ink); background: var(--hr-paper); outline: 1px solid var(--hr-ink); outline-offset: 3px; transition: background 0.15s ease, color 0.15s ease; }
.to-top__btn svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.to-top__btn:hover, .to-top__btn:focus-visible { background: var(--hr-fill); color: var(--hr-fill-ink); }
@media print { .to-top { display: none; } }

/* Scroll bars everywhere (page, menus, timeline strip, map list, side column) use the dark vintage red. */
:root { scrollbar-color: var(--hr-fill) var(--hr-parchment); }
* { scrollbar-color: var(--hr-fill) var(--hr-parchment); }
*::-webkit-scrollbar { width: 12px; height: 12px; }
*::-webkit-scrollbar-track { background: var(--hr-parchment); }
*::-webkit-scrollbar-thumb { background: var(--hr-fill); border: 2px solid var(--hr-parchment); border-radius: 8px; }
*::-webkit-scrollbar-thumb:hover { background: var(--hr-ink); }

/* Animated back-to-top arrow: a gentle float, a lift on hover, and a launch when clicked. */
.to-top__btn svg { animation: hr-arrow-float 2.6s ease-in-out infinite; }
.to-top__btn:hover svg, .to-top__btn:focus-visible svg { animation: hr-arrow-lift 0.7s ease-in-out infinite; }
.to-top__btn.is-launching svg { animation: hr-arrow-launch 0.6s cubic-bezier(.5, 0, .2, 1) 1; }
@keyframes hr-arrow-float { 0%, 100% { transform: translateY(2px); } 50% { transform: translateY(-3px); } }
@keyframes hr-arrow-lift { 0%, 100% { transform: translateY(2px); } 50% { transform: translateY(-5px); } }
@keyframes hr-arrow-launch { 0% { transform: translateY(0); opacity: 1; } 45% { transform: translateY(-34px); opacity: 0; } 46% { transform: translateY(34px); opacity: 0; } 100% { transform: translateY(0); opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .to-top__btn svg, .to-top__btn:hover svg, .to-top__btn.is-launching svg { animation: none !important; } }

.to-top__btn { box-shadow: 0 3px 10px rgba(0, 0, 0, 0.22); transition: background 0.15s ease, color 0.15s ease, opacity 0.25s ease, visibility 0.25s ease; }
.js .to-top__btn:not(.is-visible) { opacity: 0; visibility: hidden; pointer-events: none; }
@media (max-width: 599px) { .to-top { right: 0.9rem; bottom: 0.9rem; } .to-top__btn { width: 46px; height: 46px; } }

/* Footer: everything centered. */
.site-footer__row { flex-direction: column; justify-content: center; align-items: center; text-align: center; gap: 0.6rem; }
.site-footer__nav ul, .site-footer__social { justify-content: center; }
.site-footer__fine { flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 0.3rem; }
