/* ============================================================================
   SADER — LEGAL ARCHIVE  (s-archive)
   Museum-grade, image-driven. Eight editorial sections that carry the weight
   of a 160-year institution: full-bleed heritage imagery, archival document
   gallery, ledger rules, paper-grain light grounds, vignette dark grounds.
   Class system matched 1:1 with archive.html and ar/archive.html. RTL-native.
   ============================================================================ */

/* Shared archival image treatment — aged, warm-grey, high presence.
   (The intro portrait is exempt: it shows in full colour.) */
.s-archive-hero__img,
.archive-doc__frame img,
.s-archive-access__media img {
  filter: grayscale(1) sepia(0.10) contrast(1.05) brightness(0.96);
  transition: filter 700ms var(--ease), transform 900ms var(--ease);
}


/* ============================================================================
   1 · HERO — full-bleed heritage tomes, ledger of figures
   ============================================================================ */
.s-archive-hero {
  position: relative;
  min-block-size: 100svh;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  overflow: hidden;
  background-color: #080808;
}

.s-archive-hero__media {
  position: absolute;
  inset: -8% 0;            /* bleed for parallax travel */
  z-index: 0;
  transform: translateY(var(--parallax-y, 0));
}
.s-archive-hero__img {
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
  object-position: center 28%;
  filter: grayscale(1) sepia(0.10) contrast(1.06) brightness(0.42);
}
/* Video source runs darker than the archival still it replaced — same
   grayscale/sepia language, lighter brightness so the frame stays legible. */
video.s-archive-hero__img {
  filter: grayscale(1) sepia(0.10) contrast(1.04) brightness(0.85);
}

/* Layered scrim: vertical lift + lateral vignette + top fade under header */
.s-archive-hero__scrim {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(to top, #080808 2%, rgba(8,8,8,0.20) 48%, rgba(8,8,8,0.55) 100%),
    linear-gradient(to right, rgba(8,8,8,0.80) 0%, transparent 62%);
  pointer-events: none;
}
[dir="rtl"] .s-archive-hero__scrim {
  background:
    linear-gradient(to top, #080808 2%, rgba(8,8,8,0.20) 48%, rgba(8,8,8,0.55) 100%),
    linear-gradient(to left, rgba(8,8,8,0.80) 0%, transparent 62%);
}

.s-archive-hero__inner {
  position: relative;
  z-index: 2;
  inline-size: min(var(--container), 100% - 2 * var(--gutter));
  margin-inline: auto;
  /* Shared hero offset: eyebrow starts at header-h + space-9 from the top. */
  padding-block: calc(var(--header-h) + var(--space-9)) clamp(var(--space-9), 10vh, var(--space-11));
}

.s-archive-hero__kicker {
  color: rgba(255,255,255,0.55);
  margin-block-end: var(--space-6);
}

.s-archive-hero__headline {
  font-family: var(--font-display);
  font-size: clamp(3.25rem, 1.4rem + 7.6vw, 8.5rem);
  font-weight: var(--fw-light);
  line-height: 0.96;
  letter-spacing: var(--tracking-display);
  color: var(--text);
  margin: 0 0 var(--space-7);
}
.s-archive-hero__headline em {
  font-style: italic;
  font-weight: var(--fw-regular);
  color: rgba(246,244,240,0.72);
}
[dir="rtl"] .s-archive-hero__headline { line-height: 1.12; }
[dir="rtl"] .s-archive-hero__headline em { font-style: normal; }

.s-archive-hero__lead {
  font-family: var(--font-body);
  font-size: clamp(var(--fs-body), 0.95rem + 0.5vw, var(--fs-lead));
  line-height: var(--lh-body);
  color: rgba(255,255,255,0.60);
  max-inline-size: 50ch;
  margin: 0 0 var(--space-8);
}

/* Ledger strip — three figures separated by hairlines */
.s-archive-hero__ledger {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(var(--space-6), 5vw, var(--space-10));
  margin: 0;
  padding-block-start: var(--space-6);
  border-block-start: 1px solid rgba(255,255,255,0.16);
  max-inline-size: 44rem;
}
.s-archive-hero__fig { display: flex; flex-direction: column; gap: 2px; }
.s-archive-hero__fig dt {
  order: 2;
  font-family: var(--font-body);
  font-size: var(--fs-micro);
  font-weight: var(--fw-medium);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: rgba(255,255,255,0.40);
}
[dir="rtl"] .s-archive-hero__fig dt { letter-spacing: var(--tracking-wide); }
.s-archive-hero__fig dd {
  order: 1;
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 1rem + 2vw, 2.75rem);
  font-weight: var(--fw-light);
  line-height: 1;
  letter-spacing: var(--tracking-tight);
  color: var(--text);
}

/* Scroll cue */
.s-archive-hero__scroll {
  position: absolute;
  z-index: 3;
  inset-block-end: clamp(var(--space-5), 4vh, var(--space-7));
  inset-inline-start: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-3);
  color: rgba(255,255,255,0.40);
  font-family: var(--font-body);
  font-size: var(--fs-micro);
  font-weight: var(--fw-medium);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease);
}
[dir="rtl"] .s-archive-hero__scroll { transform: translateX(50%); letter-spacing: var(--tracking-wide); }
.s-archive-hero__scroll:hover { color: rgba(255,255,255,0.80); }
.s-archive-hero__scroll-line {
  inline-size: 1px;
  block-size: clamp(36px, 5vh, 54px);
  background: linear-gradient(to bottom, rgba(255,255,255,0.45), transparent);
  transform-origin: top center;
}
.js-motion .s-archive-hero__scroll-line { animation: archive-cue 2.2s var(--ease-in-out) infinite; }
@keyframes archive-cue {
  0%,100% { transform: scaleY(1);   opacity: 0.55; }
  50%     { transform: scaleY(1.35); opacity: 1;   }
}
@media (max-width: 640px) { .s-archive-hero__scroll-label { display: none; } }


/* ============================================================================
   2 · CUSTODIAN'S NOTE — split: archival image + manuscript note
   ============================================================================ */
.s-archive-intro {
  position: relative;
  padding-block: clamp(var(--space-10), 8vw, var(--space-12));
  background-color: #0C0C0C;
  background-image: radial-gradient(120% 75% at 18% 0%, rgba(255,255,255,0.045), transparent 55%);
  overflow: hidden;
}

.s-archive-intro__inner {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1fr);
  gap: clamp(var(--space-8), 6vw, var(--space-11));
  align-items: center;
  inline-size: min(var(--container), 100% - 2 * var(--gutter));
  margin-inline: auto;
}

/* Image column */
.s-archive-intro__media {
  position: relative;
  margin: 0;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background-color: #1A1A1A;
  border: 1px solid rgba(255,255,255,0.10);
}
.s-archive-intro__media img {
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
  object-position: center;
}
.s-archive-intro__caption {
  position: absolute;
  inset-block-end: 0;
  inset-inline: 0;
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-5);
  font-family: var(--font-body);
  font-size: var(--fs-micro);
  font-weight: var(--fw-medium);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: rgba(255,255,255,0.62);
  background: linear-gradient(to top, rgba(0,0,0,0.78), transparent);
}
[dir="rtl"] .s-archive-intro__caption { letter-spacing: 0; }
.s-archive-intro__caption-mark {
  font-family: var(--font-display);
  font-size: var(--fs-body);
  letter-spacing: 0.16em;
  color: rgba(255,255,255,0.85);
  text-transform: none;
}

/* Note column */
.s-archive-intro__body { display: flex; flex-direction: column; }
.s-archive-intro__body .eyebrow { color: rgba(255,255,255,0.45); margin-block-end: var(--space-5); }

.s-archive-intro__heading {
  font-family: var(--font-display);
  font-size: clamp(2rem, 1.2rem + 3vw, 3.5rem);
  font-weight: var(--fw-light);
  line-height: 1.06;
  letter-spacing: var(--tracking-tight);
  color: #F4F2EE;
  margin: 0 0 var(--space-6);
}
.s-archive-intro__heading em { font-style: italic; color: rgba(244,242,238,0.66); }
[dir="rtl"] .s-archive-intro__heading { line-height: 1.3; }
[dir="rtl"] .s-archive-intro__heading em { font-style: normal; }

.s-archive-intro__quote {
  position: relative;
  font-family: var(--font-display);
  font-size: clamp(1.3rem, 0.9rem + 1.4vw, 1.9rem);
  font-weight: var(--fw-light);
  font-style: italic;
  line-height: 1.4;
  color: rgba(255,255,255,0.82);
  margin: 0 0 var(--space-5);
  padding-inline-start: 0;
}
[dir="rtl"] .s-archive-intro__quote { font-style: normal; }

/* Big decorative quotation marks in place of the vertical rule — mirrors
   .s-mission__quote on the homepage founder pullquote. */
.s-archive-intro__quote::before,
.s-archive-intro__quote::after {
  position: absolute;
  inline-size: auto;
  background: none;
  font-family: var(--font-display);
  font-size: clamp(2.5rem, 4vw, 4rem);
  line-height: 1;
  color: rgba(255,255,255,0.30);
  pointer-events: none;
}
.s-archive-intro__quote::before {
  content: "\201C";
  inset-block-start: -0.35em;
  inset-inline-start: -0.5em;
}
.s-archive-intro__quote::after {
  content: "\201D";
  inset-block-end: -0.75em;
  inset-inline-end: -0.1em;
}

.s-archive-intro__sig {
  display: flex;
  flex-direction: column;
  gap: 3px;
  inline-size: fit-content;
  margin-inline-start: auto;
  text-align: start;
  padding-block-end: var(--space-6);
  margin-block-end: var(--space-6);
  border-block-end: 1px solid rgba(255,255,255,0.12);
}
.s-archive-intro__sig-name {
  font-family: var(--font-display);
  font-size: var(--fs-lead);
  color: rgba(255,255,255,0.88);
}
.s-archive-intro__sig-role {
  font-family: var(--font-body);
  font-size: var(--fs-caption);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: rgba(255,255,255,0.34);
}
[dir="rtl"] .s-archive-intro__sig-role { letter-spacing: 0; }

.s-archive-intro__text {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: rgba(255,255,255,0.52);
  margin: 0 0 var(--space-6);
}

.s-archive-intro__scope {
  list-style: none;
  margin: 0;
  padding: 0;
  columns: 2;
  column-gap: var(--space-6);
}
.s-archive-intro__scope li {
  break-inside: avoid;
  display: flex;
  gap: var(--space-3);
  padding-block: var(--space-3);
  font-family: var(--font-body);
  font-size: var(--fs-small);
  line-height: 1.4;
  color: rgba(255,255,255,0.58);
  border-block-start: 1px solid rgba(255,255,255,0.08);
}
.s-archive-intro__scope li::before {
  content: "—";
  color: rgba(255,255,255,0.28);
  flex-shrink: 0;
}
.s-archive-intro__scope em { font-style: italic; color: rgba(255,255,255,0.74); }
[dir="rtl"] .s-archive-intro__scope em { font-style: normal; }

@media (max-width: 860px) {
  .s-archive-intro__inner { grid-template-columns: 1fr; gap: var(--space-8); }
  .s-archive-intro__media { aspect-ratio: 16 / 10; max-block-size: 56vh; }
}
@media (max-width: 480px) {
  .s-archive-intro__scope { columns: 1; }
}


/* ============================================================================
   3 · COLLECTIONS — light gallery of archival documents
   ============================================================================ */
.s-archive-collections {
  padding-block: clamp(var(--space-10), 7vw, var(--space-12));
  background-color: var(--bg);
  /* faint paper-grain: two near-invisible ledger gradients */
  background-image:
    repeating-linear-gradient(0deg, transparent 0 47px, rgba(127,127,127,0.05) 47px 48px),
    radial-gradient(140% 60% at 50% -10%, rgba(127,127,127,0.08), transparent 50%);
  border-block-start: 1px solid var(--line);
}

.s-archive-collections__head {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  inline-size: min(var(--container), 100% - 2 * var(--gutter));
  margin-inline: auto;
  margin-block-end: clamp(var(--space-8), 5vw, var(--space-10));
  padding-block-end: var(--space-6);
  border-block-end: 1px solid var(--line);
}
.s-archive-collections__title {
  font-family: var(--font-display);
  font-size: clamp(2rem, 1.2rem + 2.8vw, 3.5rem);
  font-weight: var(--fw-light);
  line-height: 1.08;
  letter-spacing: var(--tracking-tight);
  color: var(--text);
  margin: 0;
}
.s-archive-collections__title em { font-style: italic; color: var(--text-muted); }
[dir="rtl"] .s-archive-collections__title { line-height: 1.3; }
[dir="rtl"] .s-archive-collections__title em { font-style: normal; }

.s-archive-collections__grid {
  list-style: none;
  margin: 0 auto;
  padding: 0;
  inline-size: min(var(--container), 100% - 2 * var(--gutter));
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(var(--space-6), 3vw, var(--space-8)) clamp(var(--space-5), 2.5vw, var(--space-7));
}

.archive-doc { display: flex; flex-direction: column; }
.archive-doc__frame {
  position: relative;
  display: block;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background-color: var(--surface);
  border: 1px solid var(--line);
}
.archive-doc__frame img {
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
  object-position: center;
}
.archive-doc:hover .archive-doc__frame img {
  filter: grayscale(0.15) sepia(0.06) contrast(1.04) brightness(1.0);
  transform: scale(1.045);
}
.archive-doc__period {
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  padding: var(--space-2) var(--space-3);
  font-family: var(--font-body);
  font-size: var(--fs-micro);
  font-weight: var(--fw-semi);
  letter-spacing: var(--tracking-wide);
  color: var(--text);
  background-color: rgba(14,14,14,0.78);
  backdrop-filter: blur(2px);
}

.archive-doc__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding-block-start: var(--space-4);
  border-block-start: 2px solid var(--text);
  margin-block-start: var(--space-4);
}
.archive-doc__title {
  font-family: var(--font-display);
  font-size: var(--fs-h4);
  font-weight: var(--fw-regular);
  line-height: 1.2;
  color: var(--text);
  margin: 0;
}
.archive-doc__desc {
  font-family: var(--font-body);
  font-size: var(--fs-small);
  line-height: var(--lh-body);
  color: var(--text-muted);
  margin: 0;
  flex: 1;
}
.archive-doc__tag {
  font-family: var(--font-body);
  font-size: var(--fs-micro);
  font-weight: var(--fw-medium);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--text-faint);
  margin-block-start: var(--space-2);
}
[dir="rtl"] .archive-doc__tag,
[dir="rtl"] .archive-doc__period { letter-spacing: 0; }

@media (max-width: 860px) {
  .s-archive-collections__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
  .s-archive-collections__grid { grid-template-columns: 1fr; max-inline-size: 24rem; }
}


/* ============================================================================
   4 · VALUE — dark, ruled grid with ghost numerals
   ============================================================================ */
.s-archive-values {
  position: relative;
  padding-block: clamp(var(--space-10), 7vw, var(--space-12));
  background-color: #0C0C0C;
  background-image: radial-gradient(120% 70% at 82% 8%, rgba(255,255,255,0.04), transparent 55%);
  border-block-start: 1px solid rgba(255,255,255,0.06);
}
.s-archive-values__inner {
  inline-size: min(var(--container), 100% - 2 * var(--gutter));
  margin-inline: auto;
}
.s-archive-values__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
}
.archive-value {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  /* equal inline padding on both sides so the text never touches the divider
     lines (logical, so it mirrors correctly in RTL); the first/last columns
     drop their outer padding below to stay flush with the section edges */
  padding-block: var(--space-7) var(--space-6);
  padding-inline: var(--space-6);
  border-block-start: 1px solid rgba(255,255,255,0.14);
  border-inline-end: 1px solid rgba(255,255,255,0.07);
}
.archive-value:nth-child(4n)   { border-inline-end: 0; padding-inline-end: 0; }
.archive-value:nth-child(4n+1) { padding-inline-start: 0; }
.archive-value__num {
  font-family: var(--font-display);
  font-size: var(--fs-h3);
  font-weight: var(--fw-light);
  font-style: italic;
  line-height: 1;
  color: rgba(255,255,255,0.20);
}
[dir="rtl"] .archive-value__num { font-style: normal; }
.archive-value__title {
  font-family: var(--font-display);
  font-size: var(--fs-h4);
  font-weight: var(--fw-light);
  line-height: 1.25;
  color: rgba(255,255,255,0.88);
  margin: 0;
}
.archive-value__body {
  font-family: var(--font-body);
  font-size: var(--fs-small);
  line-height: var(--lh-body);
  color: rgba(255,255,255,0.42);
  margin: 0;
}
@media (max-width: 860px) {
  .s-archive-values__grid { grid-template-columns: repeat(2, 1fr); }
  .archive-value { padding-inline-end: var(--space-6); border-inline-end: 1px solid rgba(255,255,255,0.07); }
  .archive-value:nth-child(2n)   { border-inline-end: 0; padding-inline-end: 0; }
  .archive-value:nth-child(2n+1) { padding-inline-start: 0; }
}
@media (max-width: 520px) {
  .s-archive-values__grid { grid-template-columns: 1fr; }
  .archive-value { padding-inline: 0; border-inline-end: 0; }
}


/* ============================================================================
   5 · MISSION — light, numbered pillar grid
   ============================================================================ */
.s-archive-mission {
  padding-block: clamp(var(--space-10), 7vw, var(--space-12));
  background-color: var(--bg);
  background-image: repeating-linear-gradient(0deg, transparent 0 47px, rgba(127,127,127,0.04) 47px 48px);
  border-block-start: 1px solid var(--line);
}
.s-archive-mission__inner {
  inline-size: min(var(--container), 100% - 2 * var(--gutter));
  margin-inline: auto;
}
.s-archive-mission__head {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  margin-block-end: clamp(var(--space-8), 5vw, var(--space-10));
  padding-block-end: var(--space-6);
  border-block-end: 1px solid var(--line);
}
.s-archive-mission__title {
  font-family: var(--font-display);
  font-size: clamp(2rem, 1.2rem + 2.8vw, 3.5rem);
  font-weight: var(--fw-light);
  line-height: 1.08;
  letter-spacing: var(--tracking-tight);
  color: var(--text);
  margin: 0;
}
.s-archive-mission__title em { font-style: italic; color: var(--text-muted); }
[dir="rtl"] .s-archive-mission__title em { font-style: normal; }

.s-archive-mission__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0;
}
.archive-pillar {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-8) var(--space-8) var(--space-8) 0;
  border-block-end: 1px solid var(--line);
  border-inline-end: 1px solid var(--line);
}
.archive-pillar:nth-child(2n)   { padding-inline: var(--space-8) 0; border-inline-end: 0; }
.archive-pillar:nth-child(2n+1) { padding-inline-start: 0; }
.archive-pillar:nth-last-child(-n+2) { border-block-end: 0; }
.archive-pillar__num {
  font-family: var(--font-display);
  font-size: var(--fs-h4);
  font-style: italic;
  line-height: 1;
  color: var(--text-faint);
}
[dir="rtl"] .archive-pillar__num { font-style: normal; }
.archive-pillar__title {
  font-family: var(--font-display);
  font-size: var(--fs-h3);
  font-weight: var(--fw-light);
  line-height: 1.2;
  color: var(--text);
  margin: 0;
}
.archive-pillar__body {
  font-family: var(--font-body);
  font-size: var(--fs-small);
  line-height: var(--lh-body);
  color: var(--text-muted);
  margin: 0;
}
@media (max-width: 600px) {
  .s-archive-mission__grid { grid-template-columns: 1fr; }
  .archive-pillar { padding-inline: 0; border-inline-end: 0; }
  .archive-pillar:nth-last-child(-n+2) { border-block-end: 1px solid var(--line); }
  .archive-pillar:last-child { border-block-end: 0; }
}


/* ============================================================================
   6 · TEAM — dark portrait cards
   ============================================================================ */
.s-archive-team {
  padding-block: clamp(var(--space-10), 7vw, var(--space-12));
  background-color: #0C0C0C;
  border-block-start: 1px solid rgba(255,255,255,0.06);
}
.s-archive-team__inner {
  inline-size: min(var(--container), 100% - 2 * var(--gutter));
  margin-inline: auto;
}
.s-archive-team__head {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  margin-block-end: clamp(var(--space-8), 5vw, var(--space-10));
  padding-block-end: var(--space-6);
  border-block-end: 1px solid rgba(255,255,255,0.08);
}
.s-archive-team__title {
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 1.1rem + 2.2vw, 2.75rem);
  font-weight: var(--fw-light);
  line-height: 1.1;
  letter-spacing: var(--tracking-tight);
  color: rgba(255,255,255,0.88);
  margin: 0;
}
.s-archive-team__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(var(--space-6), 4vw, var(--space-8));
}
.archive-team-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(140px, 172px) 1fr;
  gap: clamp(var(--space-5), 2.4vw, var(--space-7));
  align-items: stretch;
  padding: clamp(var(--space-5), 2.4vw, var(--space-7));
  border: 1px solid rgba(255,255,255,0.09);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.028), rgba(255,255,255,0)),
    rgba(255,255,255,0.012);
  overflow: hidden;
  transition:
    border-color var(--dur-base) var(--ease),
    background-color var(--dur-base) var(--ease),
    transform var(--dur-base) var(--ease),
    box-shadow var(--dur-base) var(--ease);
}
/* a fine accent rule along the top edge that draws in on hover */
.archive-team-card::before {
  content: "";
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  inline-size: 0;
  block-size: 2px;
  background: linear-gradient(90deg, rgba(255,255,255,0.65), rgba(255,255,255,0));
  transition: inline-size 0.7s var(--ease);
  pointer-events: none;
}
.archive-team-card:hover {
  border-color: rgba(255,255,255,0.20);
  background-color: rgba(255,255,255,0.04);
  transform: translateY(-4px);
  box-shadow: 0 24px 50px rgba(0,0,0,0.45);
}
.archive-team-card:hover::before { inline-size: 42%; }

.archive-team-card__portrait {
  position: relative;
  /* a full-height portrait column; cover-fit keeps the 3:4 photo crisp without
     coupling width to height (which would overflow the grid track) */
  align-self: stretch;
  min-block-size: clamp(15rem, 19vw, 18rem);
  overflow: hidden;
  background-color: #1A1A1A;
  border: 1px solid rgba(255,255,255,0.08);
}
.archive-team-card__portrait img {
  inline-size: 100%; block-size: 100%;
  object-fit: cover;
  /* monochrome by default, warming to near-full colour as you hover (editorial reveal) */
  filter: grayscale(1) contrast(1.03) brightness(0.96);
  transition: filter var(--dur-slow, 800ms) var(--ease), transform 900ms var(--ease);
}
.archive-team-card:hover .archive-team-card__portrait img {
  filter: grayscale(0.1) contrast(1.02);
  transform: scale(1.05);
}
/* soft bottom scrim gives the portrait depth and seats it on the card */
.archive-team-card__portrait::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 52%, rgba(0,0,0,0.5));
}

/* legacy initials placeholder, kept for any card without a photo */
.archive-team-card__portrait--placeholder {
  display: flex; align-items: center; justify-content: center;
  background:
    radial-gradient(120% 120% at 30% 20%, rgba(255,255,255,0.05), transparent 60%), #161616;
}
.archive-team-card__portrait--placeholder::after { content: none; }
.archive-team-card__portrait--placeholder::before {
  content: attr(data-initials);
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  font-weight: var(--fw-light);
  letter-spacing: 0.08em;
  color: rgba(255,255,255,0.16);
}

.archive-team-card__info { display: flex; flex-direction: column; min-inline-size: 0; }
/* museum-plate index numeral */
.archive-team-card__index {
  font-family: var(--font-display);
  font-size: var(--fs-caption);
  font-weight: var(--fw-light);
  letter-spacing: 0.2em;
  color: rgba(255,255,255,0.3);
  margin-block-end: var(--space-3);
}
.archive-team-card__name {
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 1rem + 1vw, 1.625rem);
  font-weight: var(--fw-light);
  line-height: 1.15;
  color: rgba(255,255,255,0.92);
  margin: 0 0 var(--space-3);
}
.archive-team-card__role {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  font-family: var(--font-body);
  font-size: var(--fs-caption);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
  margin: 0 0 var(--space-4);
  padding-block-end: var(--space-4);
  border-block-end: 1px solid rgba(255,255,255,0.10);
}
/* a short accent tick leading the role label */
.archive-team-card__role::before {
  content: "";
  flex: none;
  inline-size: 1.5rem;
  block-size: 1px;
  background: rgba(255,255,255,0.4);
}
[dir="rtl"] .archive-team-card__role { letter-spacing: 0; }
.archive-team-card__bio {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  margin: 0;
}
.archive-team-card__bio p {
  font-family: var(--font-body);
  font-size: var(--fs-small);
  line-height: var(--lh-body);
  color: rgba(255,255,255,0.52);
  margin: 0;
}
@media (max-width: 680px) { .s-archive-team__grid { grid-template-columns: 1fr; } }
@media (max-width: 420px) {
  .archive-team-card { grid-template-columns: 1fr; gap: var(--space-5); }
  .archive-team-card__portrait { aspect-ratio: 3 / 4; max-inline-size: 13rem; }
}


/* ============================================================================
   7 · PARTNERSHIP — pale, lead + ledger list
   ============================================================================ */
.s-archive-partnership {
  padding-block: clamp(var(--space-10), 7vw, var(--space-12));
  background-color: var(--bg);
  border-block-start: 1px solid var(--line);
}
.s-archive-partnership__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(var(--space-8), 7vw, var(--space-12));
  inline-size: min(var(--container), 100% - 2 * var(--gutter));
  margin-inline: auto;
  align-items: center;
}
.s-archive-partnership__lead .eyebrow { color: var(--text-muted); }
.s-archive-partnership__title {
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 1.1rem + 2.2vw, 2.75rem);
  font-weight: var(--fw-light);
  line-height: 1.12;
  letter-spacing: var(--tracking-tight);
  color: var(--text);
  margin-block: var(--space-4) var(--space-5);
}
.s-archive-partnership__intro {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--text-muted);
  margin: 0;
}
.s-archive-partnership__list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 0;
  counter-reset: pact;
}
.s-archive-partnership__list li {
  counter-increment: pact;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-4);
  align-items: baseline;
  padding-block: var(--space-5);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--text);
  border-block-end: 1px solid var(--line);
}
.s-archive-partnership__list li:first-child { border-block-start: 1px solid var(--line); }
.s-archive-partnership__list li::before {
  content: counter(pact, decimal-leading-zero);
  font-family: var(--font-display);
  font-style: italic;
  font-size: var(--fs-small);
  color: var(--text-faint);
}
[dir="rtl"] .s-archive-partnership__list li::before { font-style: normal; }
@media (max-width: 760px) {
  .s-archive-partnership__inner { grid-template-columns: 1fr; gap: var(--space-8); align-items: start; }
}


/* ============================================================================
   8 · ACCESS — full-bleed close, single CTA
   ============================================================================ */
.s-archive-access {
  position: relative;
  overflow: hidden;
  padding-block: clamp(var(--space-11), 12vw, calc(var(--space-12) + var(--space-6)));
  background-color: #080808;
}
.s-archive-access__media {
  position: absolute;
  inset: -8% 0;
  z-index: 0;
  transform: translateY(var(--parallax-y, 0));
}
.s-archive-access__media img {
  inline-size: 100%; block-size: 100%;
  object-fit: cover; object-position: center;
  filter: grayscale(1) sepia(0.10) contrast(1.05) brightness(0.34);
}
.s-archive-access__scrim {
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(to right, rgba(8,8,8,0.88) 0%, rgba(8,8,8,0.55) 55%, rgba(8,8,8,0.30) 100%),
    linear-gradient(to top, rgba(8,8,8,0.6), transparent 60%);
  pointer-events: none;
}
[dir="rtl"] .s-archive-access__scrim {
  background:
    linear-gradient(to left, rgba(8,8,8,0.88) 0%, rgba(8,8,8,0.55) 55%, rgba(8,8,8,0.30) 100%),
    linear-gradient(to top, rgba(8,8,8,0.6), transparent 60%);
}
.s-archive-access__inner {
  position: relative;
  z-index: 2;
  inline-size: min(var(--container), 100% - 2 * var(--gutter));
  margin-inline: auto;
}
.s-archive-access__eyebrow { color: rgba(255,255,255,0.5); }
.s-archive-access__title {
  font-family: var(--font-display);
  font-size: clamp(2.25rem, 1.4rem + 3.4vw, 4.5rem);
  font-weight: var(--fw-light);
  line-height: 1.02;
  letter-spacing: var(--tracking-display);
  color: var(--text);
  margin-block: var(--space-5) var(--space-6);
}
[dir="rtl"] .s-archive-access__title { line-height: 1.2; }
.s-archive-access__desc {
  font-family: var(--font-body);
  font-size: var(--fs-lead);
  line-height: var(--lh-body);
  color: rgba(255,255,255,0.58);
  max-inline-size: 50ch;
  margin: 0 0 var(--space-8);
}
.s-archive-access__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-5) var(--space-7);
  margin-block-end: var(--space-6);
}
.s-archive-access__btn {
  --_bg: var(--accent); --_fg: var(--on-accent);
  background-color: var(--_bg);
  color: var(--_fg);
  border-color: var(--_bg);
}
.s-archive-access__btn:hover { --_bg: #FFFFFF; --_fg: #0E0E0E; }
.s-archive-access__secondary {
  font-family: var(--font-body);
  font-size: var(--fs-caption);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: rgba(255,255,255,0.45);
  text-decoration: none;
  border-block-end: 1px solid rgba(255,255,255,0.25);
  padding-block-end: 3px;
  transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.s-archive-access__secondary:hover { color: #fff; border-color: rgba(255,255,255,0.6); }
[dir="rtl"] .s-archive-access__secondary { letter-spacing: 0; }
.s-archive-access__terms {
  font-family: var(--font-body);
  font-size: var(--fs-caption);
  color: rgba(255,255,255,0.28);
  margin: 0;
  max-inline-size: 46ch;
}


/* ============================================================================
   6 · THE EXHIBITION — a gallery of the house's published works
   ============================================================================ */
.s-archive-exhibition {
  padding-block: clamp(var(--space-10), 8vw, var(--space-12));
  background-color: #0C0C0C;
  background-image: radial-gradient(130% 60% at 50% -8%, rgba(255,255,255,0.05), transparent 55%);
  border-block-start: 1px solid rgba(255,255,255,0.06);
}
.s-archive-exhibition__inner {
  inline-size: min(var(--container), 100% - 2 * var(--gutter));
  margin-inline: auto;
}

/* Header — title left, descriptive text right */
.s-archive-exhibition__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(var(--space-7), 6vw, var(--space-11));
  align-items: end;
  margin-block-end: clamp(var(--space-8), 5vw, var(--space-10));
  padding-block-end: var(--space-7);
  border-block-end: 1px solid rgba(255,255,255,0.08);
}
@media (max-width: 768px) {
  .s-archive-exhibition__head { grid-template-columns: 1fr; gap: var(--space-5); }
}
.s-archive-exhibition__head-text .eyebrow { color: rgba(255,255,255,0.45); margin-block-end: var(--space-4); display: inline-flex; }
.s-archive-exhibition__title {
  font-family: var(--font-display);
  font-size: clamp(2rem, 1.2rem + 2.8vw, 3.5rem);
  font-weight: var(--fw-light);
  line-height: 1.06;
  letter-spacing: var(--tracking-tight);
  color: #F4F2EE;
  margin: 0;
}
.s-archive-exhibition__title em { font-style: italic; color: rgba(244,242,238,0.6); }
[dir="rtl"] .s-archive-exhibition__title { line-height: 1.3; }
[dir="rtl"] .s-archive-exhibition__title em { font-style: normal; }
.s-archive-exhibition__text {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: rgba(255,255,255,0.5);
  margin: 0;
  max-inline-size: 50ch;
}

/* ── Book shelf — interactive 3D library volumes ───────────────────────────── */
.s-archive-books {
  list-style: none;
  margin: 0 0 clamp(var(--space-9), 6vw, var(--space-11));
  padding: 0;
  display: grid;
  /* minmax(0,1fr) so the cover aspect-ratio can't inflate track auto-minimums
     and make volumes grow unequally across a row (same fix as s-library). */
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(var(--space-9), 6vw, var(--space-11)) clamp(var(--space-7), 4vw, var(--space-10));
}
@media (max-width: 900px) { .s-archive-books { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 600px) { .s-archive-books { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-9) var(--space-7); } }

.s-archive-books__loading {
  grid-column: 1 / -1;
  font-family: var(--font-body);
  font-size: var(--fs-small);
  color: rgba(255,255,255,0.25);
  font-style: italic;
}

.lib-book {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  animation: lib-book-in 0.7s var(--ease) backwards;
  animation-delay: calc(var(--i, 0) * 60ms);
}
@keyframes lib-book-in {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: none; }
}

/* Stage gives each volume its own perspective + holds the contact shadow. */
.lib-book__stage {
  position: relative;
  perspective: 1500px;
}
.lib-book__stage::after {           /* shadow on the shelf */
  content: "";
  position: absolute;
  z-index: 0;
  inset-inline: 9%;
  inset-block-end: -12px;
  block-size: 20px;
  background: radial-gradient(ellipse at center, rgba(0,0,0,0.65), transparent 72%);
  filter: blur(5px);
  opacity: 0.7;
  transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
  pointer-events: none;
}
.lib-book:hover .lib-book__stage::after { opacity: 0.4; transform: translateY(7px) scaleX(1.06); }

/* The volume — angled on the shelf, rotates flat + lifts forward on hover. */
.lib-book__vol {
  --rot: -26deg;
  position: relative;
  aspect-ratio: 3 / 4.3;
  transform-style: preserve-3d;
  transform: rotateY(var(--rot));
  transition: transform 0.8s cubic-bezier(0.2, 0.85, 0.25, 1);
  cursor: pointer;
}
[dir="rtl"] .lib-book__vol { --rot: 26deg; }
.lib-book__vol:focus-visible { outline: none; }
.lib-book:hover .lib-book__vol,
.lib-book__vol:focus-visible { transform: rotateY(0deg) translateZ(30px); }

/* Spotlight — recede the other volumes while one is engaged. */
.s-archive-books:hover .lib-book:not(:hover) .lib-book__vol { opacity: 0.5; filter: brightness(0.62); }

/* Front cover face */
.lib-book__face {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border-radius: 1px 3px 3px 1px;
  background: #1a1a1a;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.5), 0 22px 34px -18px rgba(0,0,0,0.85);
}
[dir="rtl"] .lib-book__face { border-radius: 3px 1px 1px 3px; }
.lib-book__face img {
  inline-size: 100%; block-size: 100%;
  object-fit: cover; object-position: center; display: block;
}
.lib-book__face::after {           /* sheen + binding shade */
  content: "";
  position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(100deg,
    rgba(255,255,255,0.20) 0%, rgba(255,255,255,0.03) 14%,
    transparent 48%, rgba(0,0,0,0.18) 100%);
}

/* Spine — left face, swung back; carries the title vertically */
.lib-book__spine {
  position: absolute; top: 0; bottom: 0; inset-inline-start: 0;
  inline-size: 26px;
  transform-origin: left center;
  transform: rotateY(-90deg);
  background: linear-gradient(to right, #34302b 0%, #211e1b 58%, #100e0d 100%);
  border-radius: 2px 0 0 2px;
  display: flex; align-items: center; justify-content: center;
  box-shadow: inset -8px 0 12px -8px rgba(0,0,0,0.9);
}
[dir="rtl"] .lib-book__spine {
  inset-inline-start: auto; inset-inline-end: 0;
  transform-origin: right center; transform: rotateY(90deg);
  border-radius: 0 2px 2px 0;
}
.lib-book__spine-text {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  max-block-size: 84%;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  font-family: var(--font-display);
  font-size: 9px; letter-spacing: 0.02em;
  color: rgba(255,255,255,0.52);
}

/* Page block — right edge, cream paper striations */
.lib-book__edge {
  position: absolute; top: 1.5%; bottom: 1.5%; inset-inline-end: 0;
  inline-size: 24px;
  transform-origin: right center;
  transform: rotateY(90deg);
  background: repeating-linear-gradient(90deg, #ece6d4 0 1.2px, #cdc6b0 1.2px 2.4px);
  border-radius: 0 2px 2px 0;
}
[dir="rtl"] .lib-book__edge {
  inset-inline-end: auto; inset-inline-start: 0;
  transform-origin: left center; transform: rotateY(-90deg);
  border-radius: 2px 0 0 2px;
}

.lib-book__label {
  font-family: var(--font-body);
  font-size: var(--fs-caption);
  line-height: 1.4;
  color: rgba(255,255,255,0.55);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color var(--dur-fast) var(--ease);
}
.lib-book:hover .lib-book__label { color: rgba(255,255,255,0.85); }

@media (prefers-reduced-motion: reduce) {
  .lib-book__vol { --rot: 0deg; }
  .lib-book:hover .lib-book__vol,
  .lib-book__vol:focus-visible { transform: translateZ(20px); }
  .lib-book { animation: none; }
}

.s-archive-exhibition__cta { color: rgba(255,255,255,0.7); }


/* ============================================================================
   ACCESS REQUEST MODAL + FORM
   ============================================================================ */
html.archive-modal-open { overflow: hidden; }

.archive-modal {
  position: fixed;
  inset: 0;
  z-index: var(--z-modal, 1100);
  display: grid;
  place-items: center;
  padding: clamp(var(--space-4), 3vw, var(--space-8));
}
.archive-modal[hidden] { display: none; }

.archive-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(6,6,6,0.74);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  animation: archive-modal-fade var(--dur-fast) var(--ease);
}
@keyframes archive-modal-fade { from { opacity: 0; } to { opacity: 1; } }

.archive-modal__dialog {
  position: relative;
  inline-size: min(40rem, 100%);
  max-block-size: min(88vh, 56rem);
  overflow-y: auto;
  background-color: #111110;
  border: 1px solid rgba(255,255,255,0.12);
  padding: clamp(var(--space-6), 4vw, var(--space-9));
  animation: archive-modal-rise var(--dur-base) var(--ease);
}
@keyframes archive-modal-rise {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: none; }
}

.archive-modal__close {
  position: absolute;
  inset-block-start: var(--space-4);
  inset-inline-end: var(--space-4);
  display: inline-flex;
  padding: var(--space-2);
  color: rgba(255,255,255,0.45);
  background: none;
  border: none;
  cursor: pointer;
  transition: color var(--dur-fast) var(--ease);
}
.archive-modal__close:hover { color: #fff; }

.archive-modal__head { margin-block-end: var(--space-7); padding-inline-end: var(--space-8); }
.archive-modal__head .eyebrow { color: rgba(255,255,255,0.4); }
.archive-modal__title {
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.25rem);
  font-weight: var(--fw-light);
  line-height: 1.15;
  letter-spacing: var(--tracking-tight);
  color: #F4F2EE;
  margin: var(--space-4) 0 var(--space-3);
}
.archive-modal__intro {
  font-family: var(--font-body);
  font-size: var(--fs-small);
  line-height: var(--lh-body);
  color: rgba(255,255,255,0.46);
  margin: 0;
}

/* Form */
.archive-form__group { border: 0; margin: 0 0 var(--space-7); padding: 0; }
.archive-form__legend {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  inline-size: 100%;
  font-family: var(--font-body);
  font-size: var(--fs-caption);
  font-weight: var(--fw-semi);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: rgba(255,255,255,0.72);
  padding-block-end: var(--space-4);
  margin-block-end: var(--space-5);
  border-block-end: 1px solid rgba(255,255,255,0.10);
}
[dir="rtl"] .archive-form__legend { letter-spacing: var(--tracking-wide); }
.archive-form__legend-no {
  font-family: var(--font-display);
  font-style: italic;
  font-size: var(--fs-body);
  font-weight: var(--fw-regular);
  letter-spacing: 0;
  color: rgba(255,255,255,0.30);
}
[dir="rtl"] .archive-form__legend-no { font-style: normal; }

.archive-form__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-5);
}
.archive-form__field { display: flex; flex-direction: column; gap: var(--space-2); }
.archive-form__field--full { grid-column: 1 / -1; }
.archive-form__label {
  font-family: var(--font-body);
  font-size: var(--fs-caption);
  letter-spacing: 0.04em;
  color: rgba(255,255,255,0.55);
}
.archive-form__label i {
  font-style: normal;
  color: rgba(255,255,255,0.5);
  margin-inline-start: 2px;
}
.archive-form__input {
  inline-size: 100%;
  font-family: var(--font-body);
  font-size: var(--fs-small);
  color: #F4F2EE;
  background-color: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: var(--radius-xs);
  padding: var(--space-3) var(--space-4);
  transition: border-color var(--dur-fast) var(--ease), background-color var(--dur-fast) var(--ease);
  -webkit-appearance: none;
  appearance: none;
}
textarea.archive-form__input { resize: vertical; min-block-size: 3rem; line-height: var(--lh-body); }
select.archive-form__input {
  background-image: linear-gradient(45deg, transparent 50%, rgba(255,255,255,0.5) 50%),
                    linear-gradient(135deg, rgba(255,255,255,0.5) 50%, transparent 50%);
  background-position: calc(100% - 18px) 1.15em, calc(100% - 12px) 1.15em;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  padding-inline-end: var(--space-8);
}
[dir="rtl"] select.archive-form__input {
  background-position: 18px 1.15em, 12px 1.15em;
  padding-inline-end: var(--space-4);
  padding-inline-start: var(--space-8);
}
.archive-form__input:focus {
  outline: none;
  border-color: rgba(255,255,255,0.55);
  background-color: rgba(255,255,255,0.06);
}
.archive-form__input.is-invalid { border-color: #C2554E; }
.archive-form__input::placeholder { color: rgba(255,255,255,0.25); }

.archive-form__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-4) var(--space-6);
  margin-block-start: var(--space-6);
  padding-block-start: var(--space-6);
  border-block-start: 1px solid rgba(255,255,255,0.10);
}
.archive-form__submit {
  --_bg: #F4F2EE; --_fg: #0E0E0E;
  background-color: var(--_bg); color: var(--_fg); border-color: var(--_bg);
}
.archive-form__submit:hover { --_bg: #FFFFFF; --_fg: #0E0E0E; }
.archive-form__cancel {
  font-family: var(--font-body);
  font-size: var(--fs-caption);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: rgba(255,255,255,0.42);
  background: none; border: none; cursor: pointer;
  transition: color var(--dur-fast) var(--ease);
}
[dir="rtl"] .archive-form__cancel { letter-spacing: 0; }
.archive-form__cancel:hover { color: rgba(255,255,255,0.8); }

/* Success panel */
.archive-modal__success { text-align: center; padding-block: var(--space-6) var(--space-4); }
.archive-modal__success[hidden] { display: none; }
.archive-modal__success-mark { color: rgba(255,255,255,0.85); margin-block-end: var(--space-4); }
.archive-modal__success-title {
  font-family: var(--font-display);
  font-size: var(--fs-h3);
  font-weight: var(--fw-light);
  color: #F4F2EE;
  margin: 0 0 var(--space-3);
}
.archive-modal__success-text {
  font-family: var(--font-body);
  font-size: var(--fs-small);
  line-height: var(--lh-body);
  color: rgba(255,255,255,0.52);
  max-inline-size: 40ch;
  margin: 0 auto var(--space-7);
}

@media (max-width: 560px) {
  .archive-form__grid { grid-template-columns: 1fr; }
}


/* ============================================================================
   Reduced motion
   ============================================================================ */
@media (prefers-reduced-motion: reduce) {
  .s-archive-hero__media,
  .s-archive-access__media { transform: none !important; }
  .s-archive-hero__scroll-line { animation: none; }
  .archive-modal__backdrop,
  .archive-modal__dialog { animation: none; }
}


/* ============================================================================
   3 · HISTORY — the archive's origin story (1863 → 2024), white ground.
   Editorial split: serif title + lead | hairline-ledger dateline.
   ============================================================================ */
.s-archive-history {
  padding-block: clamp(var(--space-10), 7vw, var(--space-12));
  background-color: var(--bg);                 /* pure white ground */
  border-block-start: 1px solid var(--line);
}
.s-archive-history__inner {
  inline-size: min(var(--container), 100% - 2 * var(--gutter));
  margin-inline: auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(var(--space-8), 5vw, var(--space-10));
}
@media (min-width: 920px) {
  .s-archive-history__inner {
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    align-items: start;
    gap: clamp(var(--space-9), 6vw, var(--space-12));
  }
}

/* Intro column */
.s-archive-history__head { display: flex; flex-direction: column; gap: var(--space-4); }
.s-archive-history__title {
  font-family: var(--font-display);
  font-size: clamp(2rem, 1.2rem + 2.8vw, 3.5rem);
  font-weight: var(--fw-light);
  line-height: 1.08;
  letter-spacing: var(--tracking-tight);
  color: var(--text);
  margin: 0;
}
.s-archive-history__title em { font-style: italic; color: var(--text-muted); }
[dir="rtl"] .s-archive-history__title em { font-style: normal; }
.s-archive-history__lead {
  margin: var(--space-6) 0 0;
  max-inline-size: 46ch;
  font-family: var(--font-body);
  font-size: var(--fs-lead);
  line-height: var(--lh-body);
  color: var(--text-muted);
}
[dir="rtl"] .s-archive-history__lead { line-height: var(--lh-body-ar); }

/* Dateline column — milestones as ledger entries divided by hairlines */
.s-archive-history__line {
  list-style: none;
  margin: 0; padding: 0;
  display: flex;
  flex-direction: column;
}
@media (min-width: 920px) {
  .s-archive-history__line {
    padding-inline-start: clamp(var(--space-8), 4vw, var(--space-11));
    border-inline-start: 1px solid var(--line);
  }
}
.archive-epoch {
  display: grid;
  grid-template-columns: minmax(5rem, auto) 1fr;
  column-gap: clamp(var(--space-5), 3vw, var(--space-8));
  align-items: baseline;
  padding-block: clamp(var(--space-6), 3.5vw, var(--space-8));
  border-block-start: 1px solid var(--line);
}
.archive-epoch:first-child { border-block-start: 0; padding-block-start: 0; }
.archive-epoch__year {
  font-family: var(--font-display);
  font-size: clamp(2.75rem, 1.6rem + 3.4vw, 4.5rem);
  font-weight: var(--fw-light);
  line-height: 0.9;
  letter-spacing: var(--tracking-tight);
  color: var(--text);
  font-variant-numeric: lining-nums;
}
.archive-epoch__text { min-inline-size: 0; }
.archive-epoch__label {
  font-family: var(--font-display);
  font-size: var(--fs-h4);
  font-weight: var(--fw-regular);
  font-style: italic;
  line-height: var(--lh-snug);
  color: var(--text);
  margin: 0 0 var(--space-3);
}
[dir="rtl"] .archive-epoch__label { font-style: normal; }
.archive-epoch__note {
  margin: 0;
  max-inline-size: 44ch;
  font-family: var(--font-body);
  font-size: var(--fs-small);
  line-height: var(--lh-body);
  color: var(--text-muted);
}
[dir="rtl"] .archive-epoch__note { line-height: var(--lh-body-ar); }
@media (max-width: 479px) {
  .archive-epoch { grid-template-columns: 1fr; row-gap: var(--space-3); }
}
