/* ============================================================
   The Aeverest Report — Memory department (memory.html)
   Page-specific styles. Design tokens live in colors.css,
   typography.css, and styles.css.
   ============================================================ */

body { background: var(--surface-dept); }
#root { min-height: 100vh; }

:root { --dept-accent: var(--slate-500); }

/* Brand seal / mark (shared) */
.mark { display: block; flex: none; }
.mark-ae       { font-family: var(--font-display); font-weight: 500; font-variation-settings: "opsz" 44; }
.mark-ae--base { fill: var(--navy-800); }
.mark-ae--cap  { fill: var(--mark-summit); }
.mark--cream .mark-ae--base { fill: var(--paper-050); }
.mark--cream .mark-ae--cap  { fill: var(--mark-summit-on-ink); }

/* Masthead (shared crest) */
.masthead { background: var(--paper-000); border-bottom: 1px solid var(--line); }
.masthead__utility { background: var(--slate-700); }
.masthead__utility-inner { max-width: 1200px; margin: 0 auto; padding: 9px clamp(24px, 5vw, 72px); display: flex; align-items: center; justify-content: space-between; }
.masthead__date, .masthead__credential { font-family: var(--font-mono); letter-spacing: 0.16em; text-transform: uppercase; font-size: 10.5px; white-space: nowrap; }
.masthead__date { color: #cdd8e6; }
.masthead__credential { color: var(--gold-300); }
.masthead__bar { max-width: 1200px; margin: 0 auto; padding: clamp(18px,2.4vw,24px) clamp(24px, 5vw, 72px); display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.masthead__lockup { display: flex; align-items: center; gap: 12px; text-decoration: none; min-width: 0; }
.masthead__wordmark { display: flex; flex-direction: column; line-height: 1.0; }
.masthead__the { font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold-500); margin-bottom: 5px; }
.masthead__name { font-family: var(--font-display); font-weight: 500; font-variation-settings: "opsz" 60, "wght" 500; font-size: clamp(19px, 2vw, 22px); letter-spacing: -0.005em; color: var(--navy-800); }
.masthead__nav { display: flex; align-items: center; gap: clamp(14px, 2vw, 26px); flex-wrap: wrap; }
.nav-item { text-decoration: none; font-family: var(--font-sans); font-size: 15px; font-weight: 500; color: var(--navy-800); padding-bottom: 2px; border-bottom: 2px solid transparent; }
.nav-item--active { color: var(--clay-600); font-weight: 600; border-bottom-color: var(--clay-600); }

/* Photo placeholders (striped) */
.photo-ph {
  background-image: repeating-linear-gradient(135deg, #efe7d6 0 11px, #e7ddc8 11px 22px);
  display: grid; place-items: center; overflow: hidden;
}
.photo-ph__note {
  font-family: var(--font-mono); font-size: 12px; color: var(--ink-500);
  background: var(--paper-000); border: 1px solid var(--line);
  padding: 7px 13px; border-radius: var(--radius-sm);
  text-align: center; max-width: 82%;
}

/* Underlined arrow link (shared) */
.link-arrow {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: var(--font-sans); font-weight: 600; font-size: 16px;
  color: var(--navy-800); text-decoration: none;
  border-bottom: 2px solid var(--gold-400); padding-bottom: 3px;
}
.link-arrow--nowrap { white-space: nowrap; }
.link-arrow__icon { font-family: var(--font-mono); color: var(--gold-500); }

/* Site footer (shared) */
.site-footer {
  background: var(--navy-900); border-top: 3px solid var(--gold-400);
  padding: clamp(44px,5vw,56px) clamp(24px,5vw,72px) 36px;
}
.site-footer__inner { max-width: 1200px; margin: 0 auto; }
.site-footer__grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: clamp(28px,4vw,40px); }
.site-footer__brand-row { display: flex; align-items: center; gap: 13px; }
.site-footer__brand-text { line-height: 1; }
.site-footer__brand-the {
  font-family: var(--font-mono); letter-spacing: 0.16em; text-transform: uppercase;
  font-size: 9px; color: var(--gold-300);
}
.site-footer__brand-name {
  font-family: var(--font-display); font-weight: 450; font-variation-settings: "opsz" 60, "wght" 450; font-size: 17px;
  letter-spacing: -0.005em; color: var(--paper-000); margin-top: 5px;
}
.site-footer__tagline {
  font-family: var(--font-display); font-style: italic; font-size: 17px;
  color: var(--gold-300); margin: 18px 0 0;
}
.site-footer__col-head {
  font-family: var(--font-mono); letter-spacing: 0.16em; text-transform: uppercase;
  font-size: 10px; color: var(--slate-300); margin-bottom: 14px;
}
.site-footer__links { display: flex; flex-direction: column; gap: 10px; }
.site-footer__link {
  font-family: var(--font-sans); font-size: 14px; color: var(--paper-050);
  text-decoration: none; opacity: 0.85;
}
.site-footer__fine {
  font-family: var(--font-sans); font-size: 12px; line-height: 1.6;
  color: var(--slate-300); margin: 36px 0 0;
  border-top: 1px solid var(--line-on-ink); padding-top: 20px;
}

/* Department section-front layout (accent via --dept-accent) */
.dept-header { max-width: 1200px; margin: 0 auto; padding: clamp(40px,5vw,64px) clamp(24px,5vw,72px) clamp(20px,3vw,28px); }
.dept-header__rule { display: flex; align-items: center; justify-content: space-between; gap: 16px; border-top: 2px solid var(--dept-accent); padding-top: 13px; }
.dept-header__label { font-family: var(--font-mono); letter-spacing: 0.16em; text-transform: uppercase; font-weight: 500; font-size: 11.5px; color: var(--dept-accent); white-space: nowrap; }
.dept-header__meta { font-family: var(--font-mono); letter-spacing: 0.16em; text-transform: uppercase; font-size: 11.5px; color: var(--text-muted); white-space: nowrap; }
.dept-header__grid { display: grid; grid-template-columns: 1.25fr 0.75fr; gap: clamp(24px,4vw,56px); align-items: end; margin-top: 26px; }
.dept-header__title { font-family: var(--font-display); font-weight: 600; font-size: clamp(36px,5vw,68px); line-height: 1.0; letter-spacing: -0.02em; color: var(--navy-800); margin: 0; }
.dept-header__desc { font-family: var(--font-sans); font-size: 17px; line-height: 1.6; color: var(--ink-500); margin: 0; max-width: 40ch; }

.dept-lead { max-width: 1200px; margin: 0 auto; padding: clamp(16px,2vw,24px) clamp(24px,5vw,72px) clamp(36px,4vw,52px); }
.dept-lead__grid { display: grid; grid-template-columns: 1.04fr 0.96fr; gap: clamp(28px,4vw,56px); align-items: center; border-top: 1px solid var(--line); padding-top: clamp(28px,3vw,40px); }
.dept-lead__eyebrow { font-family: var(--font-mono); letter-spacing: 0.16em; text-transform: uppercase; font-size: 11px; color: var(--dept-accent); margin-bottom: 16px; }
.dept-lead__headline-link { text-decoration: none; }
.dept-lead__headline { font-family: var(--font-display); font-weight: 600; font-size: clamp(28px,3.6vw,46px); line-height: 1.06; letter-spacing: -0.018em; color: var(--navy-800); margin: 0 0 18px; }
.dept-lead__dek { font-family: var(--font-sans); font-size: 18px; line-height: 1.6; color: var(--ink-700); margin: 0 0 24px; max-width: 48ch; }
.dept-lead__actions { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.dept-lead__readmeta { font-family: var(--font-mono); font-size: 12px; color: var(--text-muted); }
.dept-lead__figure { margin: 0; }
.dept-lead__photo { aspect-ratio: 4 / 3.1; border-radius: var(--radius-lg); }

.dept-grid { max-width: 1200px; margin: 0 auto; padding: 0 clamp(24px,5vw,72px) clamp(48px,5vw,64px); }
.dept-grid__head { display: flex; align-items: flex-end; justify-content: space-between; border-top: 1.5px solid var(--navy-800); padding-top: 13px; margin-bottom: 28px; }
.dept-grid__title { font-family: var(--font-display); font-weight: 600; font-size: 26px; color: var(--navy-800); margin: 0; }
.dept-grid__count { font-family: var(--font-mono); letter-spacing: 0.16em; text-transform: uppercase; font-weight: 500; font-size: 11.5px; color: var(--dept-accent); }
.dept-grid__cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(20px,2.5vw,30px); }

.report-card { display: block; text-decoration: none; background: var(--paper-000); border: 1px solid var(--line); border-top: 2px solid var(--dept-accent); border-radius: var(--radius-md); overflow: hidden; transition: transform var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out); }
.report-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.report-card__photo { aspect-ratio: 16 / 9; }
.report-card__body { padding: 18px 20px 22px; }
.report-card__meta { display: flex; align-items: baseline; gap: 10px; margin-bottom: 9px; }
.report-card__cat { font-family: var(--font-mono); letter-spacing: 0.16em; text-transform: uppercase; font-size: 10.5px; color: var(--dept-accent); }
.report-card__read { font-family: var(--font-mono); font-size: 10.5px; color: var(--text-muted); }
.report-card__title { font-family: var(--font-display); font-weight: 600; font-size: 20px; line-height: 1.18; color: var(--navy-800); margin-bottom: 7px; }
.report-card__dek { font-family: var(--font-sans); font-size: 14.5px; line-height: 1.5; color: var(--ink-500); }

.review { max-width: 1200px; margin: 0 auto; padding: 0 clamp(24px,5vw,72px) clamp(56px,6vw,80px); }
.review__box { background: var(--evidence-050); border-left: 3px solid var(--sage-600); border-radius: var(--radius-md); padding: clamp(26px,3vw,38px) clamp(26px,3vw,40px); display: grid; grid-template-columns: 1fr auto; gap: clamp(24px,4vw,48px); align-items: center; }
.review__label { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--evidence-700); margin-bottom: 12px; }
.review__text { font-family: var(--font-display); font-weight: 400; font-size: clamp(19px,2vw,24px); line-height: 1.42; color: var(--ink-800); margin: 0; max-width: 52ch; }
