/* ==========================================================================
   Responsive layer — 1920 → 320
   ========================================================================== */

/* ---- ≤ 1280: compact desktop nav ---- */
@media (max-width: 1280px) {
  .nav__link, .nav__trigger { padding-inline: .6rem; font-size: .86rem; }
  .nav__link::after, .nav__trigger::after { left: .6rem; right: .6rem; }
  .brand__name { font-size: 1.15rem; }
  .dispatches { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dispatch--lead { grid-column: 1 / -1; padding-right: 0; }
  .dispatch:nth-child(2) { border-left: 0; padding-left: 0; }
  .cm-index { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cm-index a:nth-child(3) { border-right: 0; }
  .cm-index a:nth-child(4) { padding-left: 0; }
  .cm-index a:nth-child(n+4) { border-top: 1px solid var(--line-dark); }
}

/* ---- ≤ 1120: switch to drawer navigation ---- */
@media (max-width: 1120px) {
  .nav { display: none; }
  .menu-toggle { display: inline-flex; }
  .masthead__coords span:nth-child(2) { display: none; }
}
@media (min-width: 1121px) {
  .drawer { display: none; }
}

/* ---- ≤ 1024: laptop / large tablet ---- */
@media (max-width: 1024px) {
  :root { --header-h: 68px; }
  .hero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .strip__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .strip__item:nth-child(3) { border-left: 0; padding-left: 0; }
  .strip__item:nth-child(n+3) { border-top: 1px solid var(--line-dark); }
  .split { grid-template-columns: minmax(0, 1fr); }
  .split__statement { position: static; }
  .themes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .themes li:not(:nth-child(3n+1)) { padding-left: 0; border-left: 0; }
  .themes li:nth-child(even) { padding-left: 1.6rem; border-left: 1px solid var(--line-dark); }
  .contents a { grid-template-columns: 3.5rem minmax(0, 1fr) 2rem; }
  .contents .d { grid-column: 2; grid-row: 2; }
  .contents svg { grid-row: 1 / span 2; grid-column: 3; }
  .dossier { grid-template-columns: minmax(0, 1fr); }
  .dossier__card { max-width: 560px; }
  .bio { grid-template-columns: minmax(0, 1fr); }
  .bio__toc { position: static; }
  .bio__toc ol { display: flex; flex-wrap: wrap; border-left: 0; border-top: 1px solid var(--line-strong); }
  .bio__toc a { border-left: 0; border-top: 2px solid transparent; padding: .6rem 1rem .6rem 0; margin: -1px 0 0; }
  .bio__toc a:hover, .bio__toc a.is-active { border-top-color: var(--bronze); }
  .longform { grid-template-columns: minmax(0, 1fr); }
  .longform__margin .note { position: static; }
  .longform__margin--side { display: none; }
  .longform__margin--lead { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
  .longform__margin--lead .note + .note { margin-top: 0; }
  .tech-grid { grid-template-columns: minmax(0, 1fr); }
  .chain { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 1.5rem; }
  .chain li + li { padding-left: 0; }
  .chain li:nth-child(even) { padding-left: 1.2rem; }
  .chain li + li::after { left: 0; }
  .chain li:nth-child(even)::after { left: 1.2rem; }
  .rec, .archive-head { grid-template-columns: 6rem minmax(0, 1fr) minmax(0, 1.4fr); }
  .rec__inst { grid-column: 2; grid-row: 2; }
  .rec__act { grid-column: 3; grid-row: 1 / span 2; }
  .archive-head span:nth-child(3) { display: none; }
  .media-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .story-card:not(:nth-child(3n+1)) { padding-left: 0; border-left: 0; }
  .story-card:nth-child(even) { padding-left: 1.6rem; border-left: 1px solid var(--line); }
  .foot__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .foot__top { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .contact-wrap { grid-template-columns: minmax(0, 1fr); }
}

/* ---- ≤ 900: tablet ---- */
@media (max-width: 900px) {
  .sec-head { grid-template-columns: minmax(0, 1fr); }
  .sec-head__aside { justify-self: start; }
  .hero__grid { grid-template-columns: minmax(0, 1fr); }
  .hero__visual { justify-self: center; max-width: 400px; margin-top: 2rem; }
  .ledger { grid-template-columns: minmax(0, 1fr); }
  .ledger__col + .ledger__col { border-left: 0; border-top: 1px solid var(--line-dark); }
  .strata-notes { grid-template-columns: minmax(0, 1fr); }
  .strata-notes li + li { padding-left: 0; border-left: 0; }
  .doc-head__grid, .pj-head__grid, .parl-head__grid, .cm-head__grid { grid-template-columns: minmax(0, 1fr); }
  .doc-head__chapter { justify-self: start; }
  .column-key { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 1rem; }
  .column-key li:nth-child(3) { padding-left: 0; }
  .stratum { grid-template-columns: 54px minmax(0, 1fr); }
  .stratum__when { grid-column: 2; grid-row: 1; text-align: left; padding: 2.4rem 0 0; }
  .stratum__core { grid-column: 1; grid-row: 1 / span 2; }
  .stratum__body { grid-column: 2; padding-top: 1rem; }
  .kv { grid-template-columns: minmax(0, 1fr); }
  .kv div + div { padding-left: 0; border-left: 0; }
  .duo { grid-template-columns: minmax(0, 1fr); }
  .journal__year { grid-template-columns: minmax(0, 1fr); }
  .journal__marker { position: static; }
  .lead-story { grid-template-columns: minmax(0, 1fr); }
  .gallery { --g: 16px; }
  .photo-index { columns: 1; }
  .stat-row { grid-template-columns: minmax(0, 1fr); }
  .stat-row > div + div { padding-left: 0; border-left: 0; }
}

/* ---- ≤ 900: image story — main image full width; the two supporting images sit
   side by side with widths proportional to 1/aspect-ratio so their heights match ---- */
@media (max-width: 900px) {
  .story { --g: 16px; }
  .story__plates { grid-template-columns: minmax(0, 1fr); }
  .story__side { grid-template-columns: minmax(0, 1.0100fr) minmax(0, 1.1671fr); }
  .story__caps { grid-template-columns: minmax(0, 1.0100fr) minmax(0, 1.1671fr); }
  .story__cap--main { grid-column: 1 / -1; grid-row: 1; }
  .story__cap--a { grid-column: 1; grid-row: 2; }
  .story__cap--b { grid-column: 2; grid-row: 2; }
}
@media (max-width: 480px) {
  .story__side, .story__caps { grid-template-columns: minmax(0, 1fr); }
  .story__cap--main, .story__cap--a, .story__cap--b { grid-column: 1; grid-row: auto; }
}

/* ---- ≤ 767: large phones / portrait tablet ---- */
@media (max-width: 767px) {
  :root { --header-h: 64px; }
  .masthead__meta .wrap { justify-content: center; }
  .masthead__meta .masthead__coords { display: none; }
  .brand__mark { width: 34px; height: 34px; }
  .brand__name { font-size: 1.08rem; }
  .brand__sub { font-size: .58rem; letter-spacing: .12em; }
  .menu-toggle__txt { display: none; }
  .hero__title .l2 { padding-left: 0; }
  .hero__coord { display: none; }
  .hero__tag { display: none; }
  .hero__caption { margin-left: 0; }
  .hero__block { left: -3%; }
  .strip__list { grid-template-columns: minmax(0, 1fr); }
  .strip__item, .strip__item:nth-child(3) { border-left: 0; padding: 1.2rem 0 1.3rem; }
  .strip__item + .strip__item { border-top: 1px solid var(--line-dark); }
  .strip__item::before { right: auto; width: 48px; }
  .facts { grid-template-columns: minmax(0, 1fr); }
  .facts div:nth-child(even) { padding-left: 0; border-left: 0; }
  .strata-chart__axis { display: none; }
  .strata-row { grid-template-columns: minmax(0, 1fr); padding: 1rem 0; min-height: 0; }
  .strata-row__name { padding: 0 0 .6rem; }
  .strata-row__track { height: 34px; }
  .strata-row__bar { top: 4px; bottom: 4px; }
  .strata-chart__now span { top: auto; bottom: -1.4rem; }
  .themes { grid-template-columns: minmax(0, 1fr); }
  .themes li:nth-child(even) { padding-left: 0; border-left: 0; }
  .ledger__list li { grid-template-columns: minmax(0, 1fr); gap: .2rem; }
  .dispatch-head { grid-template-columns: minmax(0, 1fr); }
  .dispatch-head .rule { display: none; }
  .dispatches { grid-template-columns: minmax(0, 1fr); }
  .dispatch, .dispatch + .dispatch, .dispatch:nth-child(2) { border-left: 0; padding-left: 0; padding-right: 0; }
  .dispatch--lead p { column-count: 1; }
  .contents a { grid-template-columns: 2.6rem minmax(0, 1fr) 1.4rem; gap: .4rem 1rem; }
  .record div { grid-template-columns: minmax(0, 1fr); gap: .15rem; }
  .longform__margin--lead { grid-template-columns: minmax(0, 1fr); }
  .archival { grid-template-columns: minmax(0, 1fr); }
  .geo-card dl { grid-template-columns: minmax(0, 1fr); }
  .tally { grid-template-columns: minmax(0, 1fr); }
  .tally div + div { border-left: 0; padding-left: 0; border-top: 1px solid var(--line); }
  .tech-sec__head { grid-template-columns: minmax(0, 1fr); gap: .8rem; }
  .tech-code { justify-self: start; }
  .cm-index { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cm-index a, .cm-index a + a { padding-left: 0; border-right: 0; }
  .cm-index a:nth-child(even) { padding-left: 1rem; border-left: 1px solid var(--line-dark); }
  .cm-index a:nth-child(n+3) { border-top: 1px solid var(--line-dark); }
  .chain { grid-template-columns: minmax(0, 1fr); }
  .chain li:nth-child(even) { padding-left: 0; }
  .chain li:nth-child(even)::after { left: 0; }
  .bars li { grid-template-columns: 4.6rem minmax(0, 1fr) 4.4rem; gap: .6rem; font-size: .74rem; }
  .entry { grid-template-columns: minmax(0, 1fr); gap: .6rem; }
  .entry__date .d { display: inline; font-size: 1.6rem; margin-right: .5rem; }
  .entry__date .m { display: inline; }
  .rec, .archive-head { grid-template-columns: minmax(0, 1fr); gap: .5rem; }
  .rec__inst, .rec__act { grid-column: auto; grid-row: auto; }
  .archive-head { display: none; }
  .media-grid { grid-template-columns: minmax(0, 1fr); }
  .story-card, .story-card:nth-child(even) { padding-left: 0; padding-right: 0; border-left: 0; }
  .grow--pair, .grow--trio { grid-template-columns: minmax(0, 1fr); }
  .form__grid { grid-template-columns: minmax(0, 1fr); }
  .contact-lines li { grid-template-columns: minmax(0, 1fr); gap: .2rem; }
  .foot__cols { grid-template-columns: minmax(0, 1fr); gap: 1.6rem; }
  .foot__bottom { flex-direction: column; align-items: flex-start; }
  .lightbox__bar { flex-wrap: wrap; gap: .5rem; }
}

/* ---- ≤ 640: record tables become stacked label/value rows ---- */
@media (max-width: 640px) {
  .table-wrap { overflow: visible; }
  .rtable { min-width: 0; }
  .rtable thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .rtable tr { display: block; padding: .9rem 0; border-bottom: 1px solid var(--line-strong); }
  .rtable td { display: grid; grid-template-columns: 6.8rem minmax(0, 1fr); gap: .8rem; padding: .3rem 0; border: 0; white-space: normal !important; }
  .rtable td::before { content: attr(data-label); font-family: var(--f-mono); font-size: .64rem; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-muted); padding-top: .2rem; }
  .rtable td:first-child { font-size: .85rem; }
  .rtable caption { display: block; }
  .rtable td > * { justify-self: start; }
}

/* ---- ≤ 430: phones ---- */
@media (max-width: 430px) {
  .hero__label .sep { display: none; }
  .hero__label { flex-direction: column; align-items: flex-start; gap: .3rem; }
  .hero__actions .btn { width: 100%; justify-content: center; }
  .facts dd { font-size: .96rem; }
  .column-key { grid-template-columns: minmax(0, 1fr); }
  .column-key li + li { padding-left: 0; }
  .stratum { grid-template-columns: 36px minmax(0, 1fr); gap: 0 1rem; }
  .stratum__core::after { font-size: .6rem; }
  .cm-index { grid-template-columns: minmax(0, 1fr); }
  .cm-index a:nth-child(even) { padding-left: 0; border-left: 0; }
  .cm-index a:nth-child(n+2) { border-top: 1px solid var(--line-dark); }
  .archival__img { width: 150px; }
  .form { padding: 1.2rem; }
  .form__foot .btn { width: 100%; justify-content: center; }
  .readout__row { grid-template-columns: minmax(0, 1fr); gap: .2rem; }
  .readout__row b { text-align: left; }
}

/* ---- ≤ 360 / 320: small phones ---- */
@media (max-width: 360px) {
  :root { --gutter: 14px; }
  .brand__sub { display: none; }
  .brand__name { font-size: 1rem; }
  .menu-toggle { padding: 0 .7rem; }
  .bars li { grid-template-columns: minmax(0, 1fr) 4rem; }
  .bars li .yr { grid-column: 1 / -1; }
  .lb-btn span { display: none; }
}

/* ---- Wide screens ---- */
@media (min-width: 1600px) {
  :root { --maxw: 1440px; }
}
@media (min-width: 1900px) {
  :root { --maxw: 1520px; }
}

/* ---- Landscape phones: keep the drawer usable ---- */
@media (max-height: 480px) and (orientation: landscape) {
  .drawer a { min-height: 44px; font-size: 1.25rem; padding: .45rem 0; }
  .hero__visual { max-width: 300px; }
}
