/* ==========================================================================
   dorotheebar.com — responsive layer (mobile-first; widen progressively)
   ========================================================================== */

@media (max-width: 420px) {
  :root { --header-h: 64px; }
  .brand__mark { width: 36px; height: 36px; }
  .brand__name { font-size: 1rem; }
  .brand__sub { display: none; }
  .menu-btn { padding: 0 .85rem; }
  .menu-btn__label { display: none; }
  .spec dl > div { grid-template-columns: minmax(0, 1fr); }
  .chrono::before { left: 4.2rem; }
  .chrono > li { grid-template-columns: 4.2rem minmax(0, 1fr); gap: 0 1.6rem; }
  .chrono__year { font-size: .82rem; padding-right: .8rem; }
  .chrono__body::before { left: -2.02rem; }
  .acc .acc__body { padding-left: 0; }
  .acc summary { grid-template-columns: 2.2rem 1fr 28px; }
  .pull { grid-template-columns: 1fr; }
  .pull::before { font-size: 3rem; }
  .pull figcaption { grid-column: 1; }
}

@media (min-width: 640px) {
  .gallery { columns: 2; }
  .persp { grid-template-columns: 1fr 1fr; }
  .glossary > div { grid-template-columns: 14rem minmax(0, 1fr); }
  .footer__nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sources ol { columns: 2; }
  .archive-tools { grid-template-columns: 2fr 1fr 1fr; align-items: end; }
}

@media (min-width: 900px) {
  .ph--split .ph__grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 4rem; }
  .ph--split.ph--flip .ph__grid > :first-child { order: 2; }
  .ph--spec .ph__grid { grid-template-columns: minmax(0, 1.3fr) minmax(300px, .7fr); gap: 4rem; }
  .ph--diagram .ph__grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 3rem; }
  .split { grid-template-columns: 1fr 1fr; gap: 4rem; }
  .split--wide-left { grid-template-columns: 1.3fr .7fr; }
  .split--wide-right { grid-template-columns: .7fr 1.3fr; }
  .split--flip > :first-child { order: 2; }
  .section-head { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: end; }
  .section-head--stack { grid-template-columns: minmax(0, 1fr); }
  .related__grid { grid-template-columns: minmax(220px, 300px) 1fr; gap: 3rem; }
  .sources__grid { grid-template-columns: 220px 1fr; }
  .record { grid-template-columns: 210px minmax(0, 1fr); }
  .footer__top { grid-template-columns: 1.1fr 2fr 1.1fr; gap: 3rem; }
  .gallery { columns: 3; }
}

@media (min-width: 1100px) {
  .dossier { grid-template-columns: 220px minmax(0, 1fr); gap: 4rem; }
  .dossier--marg { grid-template-columns: 220px minmax(0, 1fr) 240px; gap: 3.5rem; }
  .dossier .toc { position: sticky; top: calc(var(--header-h) + 2rem); align-self: start; max-height: calc(100vh - var(--header-h) - 4rem); overflow-y: auto; }
  .dossier__marg { position: sticky; top: calc(var(--header-h) + 2rem); align-self: start; display: grid; gap: 2rem; }
}
@media (max-width: 1099.98px) {
  .dossier .toc { border: 1px solid var(--rule); border-radius: var(--radius-sm); padding: 1rem 1.1rem; background: var(--white); }
  .dossier .toc ol { columns: 2 220px; column-gap: 1.5rem; border-left: 0; }
  .dossier .toc a { border-left: 0; padding-left: 0; break-inside: avoid; }
  .dossier__marg { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
}

/* desktop navigation threshold */
@media (min-width: 1180px) {
  .nav { display: block; }
  .menu-btn { display: none; }
  .sheet { display: none !important; }
}
@media (max-width: 1179.98px) {
  .masthead__contact, .masthead__lock { display: none; }
  .mega { display: none !important; }
}
@media (max-width: 1279.98px) and (min-width: 1180px) {
  .nav__trigger { padding: 0 .6rem; font-size: .9rem; }
  .nav__trigger .idx { display: none; }
  .brand__sub { display: none; }
}

@media (min-width: 1400px) {
  :root { --wrap: 1340px; }
}
