/* ============================================================
   American Studies Program — University of Bucharest
   "The transatlantic reading room"
   Type: Libre Caslon Text (display) · Public Sans (body/UI)
   See /DESIGN.md for the system rationale.
   ============================================================ */

/* ---------- Page parts (per-page styles; must precede rules) ---------- */
@import "parts/contact.css";

/* ---------- Fonts (self-hosted, latin + latin-ext) ---------- */
@font-face {
  font-family: "Libre Caslon Text";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/libre-caslon-400-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Libre Caslon Text";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/libre-caslon-400-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Libre Caslon Text";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/libre-caslon-700-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Libre Caslon Text";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/libre-caslon-700-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Libre Caslon Text";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/libre-caslon-italic-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Libre Caslon Text";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/libre-caslon-italic-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Public Sans";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("../fonts/public-sans-var-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Public Sans";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("../fonts/public-sans-var-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Public Sans";
  font-style: italic;
  font-weight: 400 800;
  font-display: swap;
  src: url("../fonts/public-sans-italic-var-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Public Sans";
  font-style: italic;
  font-weight: 400 800;
  font-display: swap;
  src: url("../fonts/public-sans-italic-var-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- Tokens ---------- */
:root {
  /* hex fallbacks first, OKLCH source of truth below */
  --bg: #ffffff;
  --surface: #edf4f6;
  --line: #d1dbdf;
  --ink: #101d21;
  --muted: #43565c;
  --blue-deep: #003544;
  --blue: #00576d;
  --red: #bc2826;
  --red-deep: #971b1a;
  --on-blue: #eef5f7;
  --on-blue-muted: #a9c3cb;

  --serif: "Libre Caslon Text", Georgia, "Times New Roman", serif;
  --sans: "Public Sans", system-ui, "Segoe UI", sans-serif;

  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --container: min(1140px, 92vw);
  --section: clamp(4rem, 9vw, 7.5rem);

  --z-nav: 100;
  --z-overlay: 200;
}
@supports (color: oklch(50% 0 0)) {
  :root {
    --bg: oklch(1 0 0);
    --surface: oklch(0.963 0.008 220);
    --line: oklch(0.885 0.012 220);
    --ink: oklch(0.22 0.02 220);
    --muted: oklch(0.44 0.025 220);
    --blue-deep: oklch(0.3 0.065 220);
    --blue: oklch(0.42 0.085 220);
    --red: oklch(0.52 0.185 27);
    --red-deep: oklch(0.44 0.16 27);
    --on-blue: oklch(0.965 0.008 220);
    --on-blue-muted: oklch(0.8 0.03 220);
  }
}

/* ---------- Reset & base ---------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 1.0625rem;
  line-height: 1.65;
  font-optical-sizing: auto;
}
img, video, svg { display: block; max-width: 100%; }
[hidden] { display: none !important; } /* universal svg{display:block} must not defeat the hidden attr (icon sprite) */
a { color: var(--blue); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--red-deep); }
:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; border-radius: 2px; }
.on-dark :focus-visible, .on-dark:focus-visible { outline-color: var(--on-blue); }
h1, h2, h3 { font-family: var(--serif); font-weight: 700; line-height: 1.14; letter-spacing: -0.015em; text-wrap: balance; }
p { text-wrap: pretty; }

.container { width: var(--container); margin-inline: auto; }
.prose { max-width: 68ch; }

.skip-link {
  position: absolute; left: -999px; top: 0; z-index: calc(var(--z-overlay) + 1);
  background: var(--blue-deep); color: var(--on-blue);
  padding: 0.7rem 1.2rem; font-weight: 600; text-decoration: none;
}
.skip-link:focus { left: 0; color: var(--on-blue); }

.star { width: 1em; height: 1em; fill: currentColor; flex: none; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 0.55em;
  font: 600 1rem/1 var(--sans);
  padding: 0.95em 1.5em;
  text-decoration: none;
  border: 1px solid transparent;
  transition: background-color 0.25s var(--ease-out), color 0.25s var(--ease-out), border-color 0.25s var(--ease-out), transform 0.25s var(--ease-out);
}
.btn:active { transform: translateY(1px); }
.btn--red { background: var(--red-deep); color: #fff; }
.btn--red:hover { background: var(--red); color: #fff; }
.btn--ghost { border-color: currentColor; color: var(--on-blue); background: transparent; }
.btn--ghost:hover { background: var(--on-blue); color: var(--blue-deep); }
.btn--quiet { border-color: var(--line); color: var(--ink); background: var(--bg); }
.btn--quiet:hover { border-color: var(--ink); color: var(--ink); }

/* Text links with arrow */
.more {
  display: inline-flex; align-items: baseline; gap: 0.4em;
  font: 600 0.95rem/1.4 var(--sans);
  color: var(--blue); text-decoration: none;
}
.more::after { content: "→"; transition: transform 0.25s var(--ease-out); }
.more:hover::after { transform: translateX(4px); }
.more:hover { color: var(--red-deep); }

/* ---------- Header ---------- */
.site-head {
  position: sticky; top: 0; z-index: var(--z-nav);
  background: var(--bg);
  border-bottom: 1px solid var(--line);
  transition: box-shadow 0.3s var(--ease-out);
}
.site-head.is-scrolled { box-shadow: 0 2px 18px rgb(0 30 40 / 0.08); }
.site-head__row {
  display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
  min-height: 4.5rem;
}
.brand { display: flex; align-items: center; gap: 0.7rem; text-decoration: none; color: var(--ink); }
.brand:hover { color: var(--ink); }
.brand__star { color: var(--red); width: 1.5rem; height: 1.5rem; }
.brand__name { font: 700 1.14rem/1.15 var(--serif); letter-spacing: -0.01em; }
.brand__sub { font: 600 0.66rem/1.3 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }

.site-nav { display: flex; align-items: center; gap: clamp(1rem, 2.2vw, 2rem); }
.site-nav a {
  font: 600 0.95rem/1 var(--sans); color: var(--ink); text-decoration: none;
  padding: 0.5rem 0; border-bottom: 2px solid transparent;
  transition: border-color 0.2s var(--ease-out), color 0.2s var(--ease-out);
}
.site-nav a:hover { color: var(--blue); border-bottom-color: var(--red); }

.lang { display: flex; align-items: center; gap: 0.5rem; font: 700 0.85rem/1 var(--sans); letter-spacing: 0.06em; }
.lang a { color: var(--muted); text-decoration: none; padding: 0.6rem 0.45rem; }
.lang a:hover { color: var(--red-deep); }
.lang [aria-current] { color: var(--ink); }
.lang__sep { color: var(--line); }

.nav-toggle {
  display: none;
  appearance: none; background: none; border: 1px solid var(--line);
  padding: 0.6rem 0.7rem; cursor: pointer; color: var(--ink);
}
.nav-toggle svg { width: 1.25rem; height: 1.25rem; stroke: currentColor; }

/* Mobile menu */
@media (max-width: 900px) {
  .site-nav {
    position: fixed; inset: 0; z-index: var(--z-overlay);
    flex-direction: column; justify-content: safe center; align-items: flex-start;
    gap: 0.4rem;
    padding: clamp(2rem, 8vw, 4rem);
    max-height: 100dvh; overflow-y: auto;   /* short/landscape viewports: scroll, never clip */
    background: var(--blue-deep);
    visibility: hidden; opacity: 0;
    transition: opacity 0.35s var(--ease-out), visibility 0s linear 0.35s;
  }
  .site-nav.is-open { visibility: visible; opacity: 1; transition-delay: 0s; }
  .site-nav a {
    font: 700 clamp(1.6rem, 6vw, 2.2rem)/1.3 var(--serif);
    color: var(--on-blue); letter-spacing: -0.01em;
  }
  .site-nav a:hover { color: #fff; border-bottom-color: var(--red); }
  .site-nav .lang { margin-top: 2rem; }
  .site-nav .lang a, .site-nav .lang [aria-current] { font: 700 1rem/1 var(--sans); color: var(--on-blue-muted); }
  .site-nav .lang [aria-current] { color: var(--on-blue); }
  .nav-toggle { display: inline-flex; }
  body.menu-open { overflow: hidden; }
}

/* ---------- Hero ---------- */
.hero {
  position: relative;
  background: var(--blue-deep);
  color: var(--on-blue);
  overflow: hidden;
}
/* eleventy-img wraps each image in <picture>; contents lets the <img> lay out
   exactly as a bare <img> would (no stray inline box behind the hero). */
.hero picture, .beyond__media picture { display: contents; }
.hero__img {
  position: absolute; inset: 0;
  width: 100%; height: 100%; object-fit: cover;
  filter: saturate(0.55) contrast(1.02);
}
.hero__scrim {
  position: absolute; inset: 0;
  /* left-anchored panel keeps the text legible over the bright sky, while the
     right of the photograph stays open — two layers, not one flat wash */
  background:
    linear-gradient(105deg, rgb(0 26 34 / 0.82) 0%, rgb(0 26 34 / 0.5) 38%, rgb(0 26 34 / 0.12) 68%, transparent 100%),
    linear-gradient(to top, rgb(0 34 44 / 0.9) 0%, rgb(0 34 44 / 0.42) 55%, rgb(0 34 44 / 0.5) 100%);
}
@supports (color: oklch(50% 0 0)) {
  .hero__scrim {
    background:
      linear-gradient(105deg, oklch(0.26 0.055 220 / 0.82) 0%, oklch(0.26 0.055 220 / 0.5) 38%, oklch(0.26 0.055 220 / 0.12) 68%, transparent 100%),
      linear-gradient(to top, oklch(0.28 0.06 220 / 0.9) 0%, oklch(0.28 0.06 220 / 0.42) 55%, oklch(0.28 0.06 220 / 0.5) 100%);
  }
}
.hero__content {
  position: relative;
  padding: clamp(6rem, 14vh, 9.5rem) 0 clamp(7rem, 15vh, 10rem);
  max-width: 54rem;
}
.hero__affil {
  font: 600 0.8rem/1.5 var(--sans);
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--on-blue-muted);
  text-shadow: 0 1px 2px rgb(0 18 24 / 0.55);
  display: flex; align-items: center; gap: 0.6rem;
  margin-bottom: 1.6rem;
}
.hero__affil .star { color: var(--red); width: 0.85rem; height: 0.85rem; }
.hero__title {
  font-size: clamp(2.5rem, 5vw, 4rem);
  font-weight: 700;
  color: #fff;
  margin-bottom: 1.4rem;
}
.hero__title .line { display: block; }
.hero__lede {
  font-size: clamp(1.05rem, 1.6vw, 1.25rem);
  line-height: 1.6;
  max-width: 38rem;
  color: var(--on-blue);
  text-shadow: 0 1px 2px rgb(0 18 24 / 0.5);
  margin-bottom: 2.2rem;
}
.hero__cta { display: flex; flex-wrap: wrap; gap: 0.9rem; }

/* Hero entrance — pure CSS so it never gates content. The photo (LCP) and the
   headline lines animate transform only (compositor-only, never opacity-gated),
   so the largest-contentful frame is never held behind a fade. */
@keyframes rise   { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes rise-y { from { transform: translateY(26px); }             to { transform: none; } }
@keyframes heroImg { from { transform: scale(1.045); } to { transform: none; } }
.hero__affil  { animation: rise 0.7s var(--ease-out) 0.05s both; }
.hero__title .line:nth-child(1) { animation: rise-y 0.85s var(--ease-out) 0.1s both; }
.hero__title .line:nth-child(2) { animation: rise-y 0.85s var(--ease-out) 0.19s both; }
.hero__lede   { animation: rise 0.8s var(--ease-out) 0.32s both; }
.hero__cta    { animation: rise 0.8s var(--ease-out) 0.42s both; }
.hero__img    { animation: heroImg 1.8s var(--ease-out) both; }

/* ---------- Admissions card (overlaps hero) ---------- */
.admit { position: relative; margin-top: clamp(-4.5rem, -6vw, -3.5rem); }
.admit__card {
  background: var(--bg);
  border: 1px solid var(--line);
  box-shadow: 0 18px 50px rgb(0 30 40 / 0.12);
  padding: clamp(1.4rem, 3vw, 2rem) clamp(1.4rem, 3.4vw, 2.5rem);
  animation: rise 0.8s var(--ease-out) 0.5s both;
}
.admit__head {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0.6rem;
  padding-bottom: 1rem; border-bottom: 1px solid var(--ink);
}
.admit__title { font: 700 1.35rem/1.2 var(--serif); display: inline-flex; align-items: center; gap: 0.55rem; }
.admit__title .star { color: var(--red); width: 1rem; height: 1rem; }
.admit__status { font: 700 0.78rem/1 var(--sans); letter-spacing: 0.13em; text-transform: uppercase; color: var(--red-deep); }
.admit__rows { display: grid; grid-template-columns: repeat(3, 1fr); }
.admit__row {
  padding: 1.1rem 1.4rem 1.2rem 0;
  border-right: 1px solid var(--line);
}
.admit__row + .admit__row { padding-left: 1.4rem; }
.admit__row:last-child { border-right: 0; padding-right: 0; }
.admit__label { font: 600 0.74rem/1.4 var(--sans); letter-spacing: 0.13em; text-transform: uppercase; color: var(--muted); margin-bottom: 0.3rem; }
.admit__value { font: 400 1.22rem/1.35 var(--serif); }
.admit__foot {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.8rem;
  border-top: 1px dotted var(--line); padding-top: 1rem; margin-top: 0.2rem;
  font-size: 0.92rem; color: var(--muted);
}
@media (max-width: 820px) {
  .admit__rows { grid-template-columns: 1fr; }
  .admit__row { border-right: 0; border-bottom: 1px solid var(--line); padding: 0.9rem 0; }
  .admit__row + .admit__row { padding-left: 0; }
  .admit__row:last-child { border-bottom: 0; }
}

/* ---------- Sections ---------- */
.section { padding-block: var(--section); }
.section--tight { padding-block: calc(var(--section) * 0.66); }
.section-head { margin-bottom: clamp(2.2rem, 5vw, 3.6rem); }
.section-head--row { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 1rem; }
.section-title { font-size: clamp(1.8rem, 3.6vw, 2.6rem); }
.section-title .star { display: inline-block; width: 0.55em; height: 0.55em; color: var(--red); margin-right: 0.35em; transform: translateY(-0.06em); }
.section-lede { color: var(--muted); max-width: 56ch; margin-top: 0.8rem; font-size: 1.05rem; }

/* ---------- Who we are (editorial + catalog card) ---------- */
.who { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(2.5rem, 6vw, 5rem); align-items: start; }
.who__prose p { margin-bottom: 1.2rem; }
.who__prose .lead {
  font-family: var(--serif);
  font-size: clamp(1.18rem, 1.9vw, 1.42rem);
  line-height: 1.55;
}
.who__prose .lead::first-letter {
  font-family: var(--serif); font-weight: 700; color: var(--blue-deep);
  float: left; font-size: 3.3em; line-height: 0.78;
  padding: 0.06em 0.12em 0 0;
}
/* Where supported, a true three-line dropped initial that sits on the baseline
   grid instead of a floated approximation. */
@supports (initial-letter: 3) or (-webkit-initial-letter: 3) {
  .who__prose .lead::first-letter {
    float: none; font-size: inherit; line-height: inherit; padding: 0;
    -webkit-initial-letter: 3 3; initial-letter: 3 3;
    margin-right: 0.14em;
  }
}
.who__links { display: flex; flex-wrap: wrap; gap: 1.6rem; margin-top: 1.8rem; }

.catalog {
  border: 1px solid var(--ink);
  background: var(--bg);
  box-shadow: 6px 6px 0 var(--surface), 6px 6px 0 1px var(--line);
}
.catalog__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0.85rem 1.3rem;
  border-bottom: 1px solid var(--ink);
  font: 600 0.74rem/1.4 var(--sans); letter-spacing: 0.14em; text-transform: uppercase;
}
.catalog__head .star { color: var(--red); width: 0.8rem; height: 0.8rem; }
.catalog dl { padding: 0.4rem 1.3rem 0.9rem; }
.catalog__row { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding: 0.72rem 0; }
.catalog__row + .catalog__row { border-top: 1px dotted var(--line); }
.catalog dt { font: 400 0.95rem/1.4 var(--sans); color: var(--muted); }
.catalog dd { font: 700 1.02rem/1.35 var(--serif); text-align: right; }
.catalog__note { padding: 0.7rem 1.3rem 1rem; font-size: 0.8rem; color: var(--muted); border-top: 1px solid var(--line); }
@media (max-width: 900px) { .who { grid-template-columns: 1fr; } }

/* ---------- Bookshelf: a real shelf you can handle ---------- */
.shelf-wrap { background: var(--surface); overflow: hidden; }
.shelf-scroller {
  overflow-x: auto;
  overflow-y: hidden;                    /* explicit: don't let implicit-auto clip pulled-out books */
  padding-block: 2rem 1.1rem;            /* headroom for lifted spines + the tilted card's shadow */
  scrollbar-width: thin;
  scrollbar-color: var(--blue) transparent;
  cursor: grab;
  overscroll-behavior-x: contain;
}
.shelf-scroller.is-dragging { cursor: grabbing; scroll-behavior: auto; user-select: none; }
.shelf-scroller:focus-visible { outline: 2px solid var(--blue); outline-offset: 4px; border-radius: 2px; }

.shelf { display: flex; align-items: flex-end; gap: 18px; width: max-content; margin-inline: auto; padding: 0 0.6rem; }
.shelf__row {
  position: relative;
  display: flex; align-items: flex-end; gap: 7px;
  list-style: none; margin: 0; padding: 0 0 13px;   /* books rest in the content box; plank fills the padding below */
}
/* the plank the books stand on — its own species of shadow, cast on the surface below */
.shelf__row::after {
  content: ""; position: absolute; left: -7px; right: -7px; bottom: 0; height: 13px;
  background: linear-gradient(to bottom, var(--blue) 0, var(--blue-deep) 60%, #001f28 100%);
  border-radius: 0 0 3px 3px;
  box-shadow: 0 8px 16px -5px rgb(0 25 35 / 0.5);
}
.book {
  position: relative; z-index: 1;
  writing-mode: vertical-rl;
  display: flex; align-items: center; justify-content: center; gap: 0.55rem;
  width: 58px;
  padding: 1.35rem 0 1.55rem;
  font: 620 1rem/1.15 var(--sans);
  letter-spacing: 0.015em;
  color: #fff;
  border: 1px solid rgb(0 0 0 / 0.26);
  border-bottom: none;
  border-radius: 3px 4px 0 0;
  background-color: var(--blue-deep);
  /* head band · tail band · rounded-spine sheen across the width */
  background-image:
    linear-gradient(to bottom, transparent 11px, rgb(255 255 255 / .22) 11px 12px, transparent 12px 16px, rgb(0 0 0 / .26) 16px 17px, transparent 17px),
    linear-gradient(to top,    transparent 13px, rgb(255 255 255 / .14) 13px 14px, transparent 14px 18px, rgb(0 0 0 / .30) 18px 19px, transparent 19px),
    linear-gradient(to right,  rgb(0 0 0 / .28) 0, rgb(255 255 255 / .05) 15%, rgb(255 255 255 / .17) 46%, rgb(255 255 255 / .03) 63%, rgb(0 0 0 / .12) 83%, rgb(0 0 0 / .30) 100%);
  box-shadow: 0 2px 5px rgb(0 18 28 / 0.3);
  transition: transform 0.34s var(--ease-out), box-shadow 0.34s var(--ease-out);
}
.book > span { display: block; }
/* pull a book up off the shelf — pointer hover, keyboard focus, or a touch tap (JS adds .is-pulled) */
@media (hover: hover) {
  .book:hover { transform: translateY(-16px); box-shadow: 0 22px 32px -12px rgb(0 20 30 / 0.55); z-index: 3; }
  .book--lean:hover { transform: translateY(-14px) rotate(4deg); }
}
.book.is-pulled { transform: translateY(-16px); box-shadow: 0 22px 32px -12px rgb(0 20 30 / 0.55); z-index: 3; }
.book--lean.is-pulled { transform: translateY(-14px) rotate(4deg); }

/* bindings — blue / red / neutral; the craft gradients above ride on top of these */
.book--1  { height: 266px; background-color: var(--blue-deep); }
.book--2  { height: 224px; background-color: #e4edef; color: var(--ink); border-color: rgb(0 30 40 / .16); }
.book--3  { height: 292px; background-color: var(--blue); }
.book--4  { height: 208px; background-color: var(--ink); }
.book--5  { height: 276px; background-color: var(--red-deep); }
.book--6  { height: 238px; background-color: #e4edef; color: var(--ink); border-color: rgb(0 30 40 / .16); }
.book--7  { height: 298px; background-color: var(--blue-deep); }
.book--8  { height: 220px; background-color: var(--blue); }
.book--9  { height: 258px; background-color: #d7e2e6; color: var(--ink); border-color: rgb(0 30 40 / .16); }
.book--10 { height: 244px; background-color: var(--ink); }
.book--lean { transform: rotate(5.5deg); transform-origin: bottom right; margin-left: 12px; }

/* the star — foil-stamped on the deep-red spine, mid-shelf */
.book .star { width: 0.82rem; height: 0.82rem; color: #f2e6c4; filter: drop-shadow(0 1px 0 rgb(0 0 0 / .45)); }

.shelf-card {
  align-self: flex-end;
  max-width: 240px;
  background: var(--bg);
  border: 1px solid var(--line);
  padding: 1.1rem 1.2rem;
  transform: rotate(-1.6deg);
  box-shadow: 0 12px 26px rgb(0 30 40 / 0.12);
  font-family: var(--serif); font-style: italic; font-size: 0.98rem; line-height: 1.5;
}
.shelf-card strong { font-style: normal; }
.shelf-note { margin-top: 1.7rem; color: var(--muted); font-size: 0.95rem; max-width: 60ch; }

/* Phones: stack the books into a real pile — spines facing out so titles read,
   varied thickness + width, each book shaded by the one resting on top of it.
   No sideways scroll. */
@media (max-width: 600px) {
  .shelf-scroller { overflow-x: visible; padding-block: 0.25rem 0; cursor: auto; }
  .shelf { flex-direction: column; align-items: stretch; width: auto; gap: 1.1rem; padding: 0; }
  .shelf__row {
    flex-direction: column;
    align-items: stretch;
    gap: 0;                 /* books touch — a pile, not a spaced-out list */
    padding: 0 3px;
  }
  .shelf__row::after { display: none; }    /* a stack resting on a surface, not a shelf edge */
  .book {
    writing-mode: horizontal-tb;
    width: auto;
    height: auto;
    min-height: 0;
    justify-content: flex-start;
    align-items: center;
    text-align: left;
    gap: 0.5rem;
    padding-inline: 1.15rem;
    padding-block: 0.82rem;      /* overridden per book = thickness */
    border: 1px solid rgb(0 0 0 / 0.16);
    border-radius: 3px;
    /* spine curvature: light along the top, falling to shade at the base */
    background-image: linear-gradient(to bottom,
      rgb(255 255 255 / 0.14) 0,
      rgb(255 255 255 / 0) 22%,
      rgb(0 0 0 / 0) 72%,
      rgb(0 0 0 / 0.20) 100%);
    /* inset top shade = shadow the book above casts down onto this one
       (inset so the next book in the stack can't paint over it) */
    box-shadow:
      inset 0 5px 6px -4px rgb(0 12 20 / 0.45),
      inset 0 -1px 0 rgb(255 255 255 / 0.10),
      0 2px 4px rgb(0 18 28 / 0.14);
    font-size: 1.04rem;
    transform: none !important;      /* the pile is a static presentation — no pull-out */
  }
  .book .star { filter: none; }
  /* no two books alike: vary thickness (padding-block) and width/offset (margins) */
  .book--1  { padding-block: 0.95rem; margin: 0 0.5rem 0 0;    }
  .book--2  { padding-block: 0.62rem; margin: 0 1.9rem 0 9px;  }
  .book--3  { padding-block: 0.82rem; margin: 0 0.8rem 0 3px;  }
  .book--4  { padding-block: 0.56rem; margin: 0 2.7rem 0 12px; }
  .book--5  { padding-block: 0.9rem;  margin: 0 1.2rem 0 2px;  }
  .book--6  { padding-block: 0.66rem; margin: 0 2.3rem 0 8px;  }
  .book--7  { padding-block: 1rem;    margin: 0 0.3rem 0 0;    }
  .book--8  { padding-block: 0.6rem;  margin: 0 2.9rem 0 11px; }
  .book--9  { padding-block: 0.84rem; margin: 0 1.5rem 0 5px;  }
  .book--10 { padding-block: 0.72rem; margin: 0 2rem 0 8px;    }
  .book--lean { margin-left: 0; }
  .shelf-card {
    align-self: stretch;
    transform: none;
    margin: 0;
    max-width: none;
  }
}

/* ---------- Programs (BA / MA) ---------- */
.programs { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.5rem, 3.5vw, 3rem); align-items: stretch; }
.program {
  border-top: 3px solid var(--blue-deep);
  background: var(--bg);
  padding-top: 1.6rem;
  display: flex; flex-direction: column;
}
.program--ma { border-top-color: var(--red-deep); }
.program__kind { font: 600 0.78rem/1.4 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); margin-bottom: 0.5rem; }
.program__title { font-size: clamp(1.5rem, 2.6vw, 1.9rem); margin-bottom: 1rem; }
.program__body { color: var(--ink); }
.program__body p { margin-bottom: 1rem; }
.program__facts { list-style: none; padding: 0; margin: 0.4rem 0 1.4rem; }
.program__facts li {
  display: flex; gap: 0.7rem; align-items: baseline;
  padding: 0.55rem 0;
  border-top: 1px dotted var(--line);
  font-size: 0.98rem;
}
.program__facts li::before {
  content: ""; flex: none; width: 0.72em; height: 0.72em; transform: translateY(0.12em);
  background: var(--red);
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20d='M12%201.7l2.94%207.06%207.62.61-5.8%204.97%201.77%207.44L12%2017.79l-6.53%203.99%201.77-7.44-5.8-4.97%207.62-.61z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20d='M12%201.7l2.94%207.06%207.62.61-5.8%204.97%201.77%207.44L12%2017.79l-6.53%203.99%201.77-7.44-5.8-4.97%207.62-.61z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.program__links { margin-top: auto; display: flex; flex-wrap: wrap; gap: 1.4rem; padding-top: 0.4rem; }
@media (max-width: 820px) { .programs { grid-template-columns: 1fr; } }

/* ---------- Quote band ---------- */
.quoteband {
  background: var(--blue-deep);
  color: var(--on-blue);
  padding-block: calc(var(--section) * 0.8);
  position: relative;
  overflow: hidden;
}
.quoteband .star { width: 1.4rem; height: 1.4rem; color: var(--red); margin: 0 auto 1.6rem; }
.quoteband blockquote {
  max-width: 46rem; margin-inline: auto; text-align: center;
}
.quoteband blockquote p {
  font: italic 400 clamp(1.4rem, 3vw, 2.1rem)/1.45 var(--serif);
  color: #fff;
  text-wrap: balance;
}
.quoteband cite {
  display: block; margin-top: 1.5rem;
  font: 600 0.82rem/1.5 var(--sans); font-style: normal;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--on-blue-muted);
}

/* ---------- Beyond the classroom ---------- */
.beyond { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(2.5rem, 6vw, 5rem); align-items: center; }
.beyond__media figure { position: relative; }
.beyond__media img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border: 1px solid var(--line); }
.beyond__media figcaption {
  margin-top: 0.7rem;
  font-size: 0.85rem; color: var(--muted);
  display: flex; gap: 0.5rem; align-items: baseline;
}
.beyond__media figcaption::before {
  content: ""; flex: none; width: 0.72em; height: 0.72em; transform: translateY(0.1em);
  background: var(--red);
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20d='M12%201.7l2.94%207.06%207.62.61-5.8%204.97%201.77%207.44L12%2017.79l-6.53%203.99%201.77-7.44-5.8-4.97%207.62-.61z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20d='M12%201.7l2.94%207.06%207.62.61-5.8%204.97%201.77%207.44L12%2017.79l-6.53%203.99%201.77-7.44-5.8-4.97%207.62-.61z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.beyond__text p { margin-bottom: 1.1rem; }
.beyond__partners {
  margin: 1.4rem 0 1.8rem; padding: 1.1rem 0;
  border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
  font-size: 0.95rem; color: var(--muted); line-height: 1.9;
}
.beyond__partners strong { color: var(--ink); font-weight: 700; }
@media (max-width: 900px) { .beyond { grid-template-columns: 1fr; } }

/* ---------- Student voices ---------- */
.voices { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(1.2rem, 2.6vw, 2.4rem); }
.voice { display: flex; flex-direction: column; gap: 1.1rem; }
.voice__quote { font: italic 400 1.16rem/1.55 var(--serif); }
.voice__quote::before { content: "“" / ""; display: block; font: 700 3rem/0.4 var(--serif); color: var(--red); margin-bottom: 0.6rem; }
.voice__who { display: flex; align-items: center; gap: 0.9rem; margin-top: auto; }
.voice__who img { width: 3.4rem; height: 3.4rem; border-radius: 50%; object-fit: cover; border: 1px solid var(--line); }
.voice__name { font: 700 0.95rem/1.3 var(--sans); }
.voice__affil { font: 400 0.85rem/1.4 var(--sans); color: var(--muted); }
/* Placement cycles every 4 by DOM position, so the composed masonry survives a
   CMS-added 5th/6th testimonial instead of collapsing to a 1/12-width sliver. */
.voice:nth-child(4n + 1) { grid-column: 1 / span 5; }
.voice:nth-child(4n + 2) { grid-column: 7 / span 6; margin-top: 3.2rem; }
.voice:nth-child(4n + 3) { grid-column: 2 / span 5; margin-top: 1rem; }
.voice:nth-child(4n + 4) { grid-column: 8 / span 5; margin-top: 4rem; }
@media (max-width: 900px) {
  .voices { grid-template-columns: 1fr; }
  .voice { grid-column: auto !important; margin-top: 0 !important; }
}

/* ---------- News ---------- */
.news-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ink); }
.news-item { border-bottom: 1px solid var(--line); }
.news-item a {
  display: grid; grid-template-columns: 11.5rem minmax(0, 1fr) auto;
  gap: 1.5rem; align-items: baseline;
  padding: 1.15rem 0.2rem;
  text-decoration: none; color: var(--ink);
  transition: background-color 0.2s var(--ease-out);
}
.news-item a:hover { background: var(--surface); }
.news-item time { font: 600 0.82rem/1.5 var(--sans); letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
.news-item .t { font: 400 1.15rem/1.4 var(--serif); }
.news-item a:hover .t { color: var(--blue); }
.news-item .c { font: 600 0.8rem/1.5 var(--sans); color: var(--muted); }
@media (max-width: 700px) {
  .news-item a { grid-template-columns: 1fr; gap: 0.15rem; }
}

/* ---------- Founder ---------- */
.founder { text-align: center; max-width: 44rem; margin-inline: auto; }
.founder .star { width: 1.1rem; height: 1.1rem; color: var(--red); margin: 0 auto 1.4rem; }
.founder blockquote p { font: italic 400 clamp(1.2rem, 2.2vw, 1.5rem)/1.55 var(--serif); }
.founder cite { display: block; margin-top: 1.2rem; font: 600 0.85rem/1.5 var(--sans); font-style: normal; color: var(--muted); }
.founder .more { margin-top: 1.4rem; }

/* ============================================================
   Admissions page
   ============================================================ */
.lead { font-family: var(--serif); font-size: clamp(1.15rem, 1.8vw, 1.35rem); line-height: 1.55; }

/* Blue page header — no photo (the homepage owns the hero image) */
.page-head { background: var(--blue-deep); color: var(--on-blue); }
.page-head__inner { padding-block: clamp(3rem, 8vh, 5.5rem) clamp(2.5rem, 6vh, 4rem); max-width: 52rem; }
.page-head__kicker {
  font: 600 0.8rem/1.5 var(--sans); letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--on-blue-muted); display: flex; align-items: center; gap: 0.6rem; margin-bottom: 1.4rem;
}
.page-head__kicker .star { color: var(--red); width: 0.85rem; height: 0.85rem; }
.page-head__title { font-size: clamp(2.2rem, 5vw, 3.6rem); color: #fff; }
.page-head__lede { font-size: clamp(1.05rem, 1.6vw, 1.25rem); line-height: 1.6; color: var(--on-blue); margin-top: 1.2rem; max-width: 40rem; }
.page-head__status {
  display: inline-flex; align-items: center; gap: 0.55rem; margin-top: 1.8rem;
  font: 700 0.78rem/1 var(--sans); letter-spacing: 0.12em; text-transform: uppercase; color: #fff;
}
.page-head__dot { width: 0.6rem; height: 0.6rem; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 4px rgb(188 40 38 / 0.28); }
.page-head__jump { display: flex; flex-wrap: wrap; gap: 0.7rem; margin-top: 1.9rem; }
.chip {
  display: inline-flex; align-items: center; gap: 0.45rem;
  font: 600 0.9rem/1 var(--sans);
  padding: 0.62rem 1.05rem; border: 1px solid var(--on-blue-muted); border-radius: 2px;
  color: var(--on-blue); text-decoration: none;
  transition: background-color 0.2s var(--ease-out), color 0.2s var(--ease-out), border-color 0.2s var(--ease-out);
}
.chip::before { content: "↓"; opacity: 0.7; }
.chip:hover { background: var(--on-blue); color: var(--blue-deep); border-color: var(--on-blue); }

/* Section variants + shared footer row */
.section--surface { background: var(--surface); }
.section-foot {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 1rem;
  margin-top: 2rem; padding-top: 1.2rem; border-top: 1px solid var(--line);
}
.fineprint { font-size: 0.9rem; color: var(--muted); max-width: 60ch; }

/* Calendar timeline */
.timeline { list-style: none; margin: 0; padding: 0; position: relative; }
.timeline::before { content: ""; position: absolute; left: 0.85rem; top: 1.7rem; bottom: 1.7rem; width: 1px; background: var(--line); }
.tl { display: grid; grid-template-columns: 1.7rem 1fr; align-items: start; gap: 0 1.3rem; padding: 1.15rem 0; }
.tl + .tl { border-top: 1px dotted var(--line); }
.tl__node { display: grid; place-items: center; width: 1.7rem; height: 1.7rem; background: var(--bg); border-radius: 50%; }
.section--surface .tl__node { background: var(--surface); }
.tl__node .star { width: 0.95rem; height: 0.95rem; color: var(--red); }
.tl__body { display: grid; grid-template-columns: 10rem 1fr; gap: 0.3rem 1.6rem; align-items: baseline; }
.tl__date { font: 400 1.18rem/1.3 var(--serif); color: var(--ink); }
.tl--start .tl__date { color: var(--blue); }
.tl__label { font-size: 0.98rem; color: var(--muted); }
@media (max-width: 620px) {
  .tl__body { grid-template-columns: 1fr; gap: 0.15rem; }
  .tl__date { font-size: 1.1rem; }
}

/* BA / MA path sections */
.path { scroll-margin-top: 5rem; }
.path--ma { background: var(--surface); }
.path__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(2.5rem, 6vw, 5rem); align-items: start; }
.path__kind { font: 600 0.78rem/1.4 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); margin-bottom: 0.6rem; }
.path__title { font-size: clamp(1.8rem, 3.4vw, 2.5rem); border-top: 3px solid var(--blue-deep); padding-top: 1rem; }
.path--ma .path__title { border-top-color: var(--red-deep); }
.path__lede { margin-top: 1.2rem; }
.path__cta { margin-top: 0.4rem; }
@media (max-width: 900px) { .path__grid { grid-template-columns: 1fr; } }

/* Admission formula (BA) + interview panel (MA) share the ledger frame */
.formula, .interview { border: 1px solid var(--ink); background: var(--bg); margin: 1.8rem 0; }
.formula__title {
  font: 600 0.74rem/1.4 var(--sans); letter-spacing: 0.14em; text-transform: uppercase;
  padding: 0.85rem 1.3rem; border-bottom: 1px solid var(--ink); margin: 0;
}
.formula__row { display: flex; align-items: baseline; gap: 1.1rem; padding: 1rem 1.3rem; }
.formula__row + .formula__row { border-top: 1px dotted var(--line); }
.formula__pct { font: 700 1.9rem/1 var(--serif); color: var(--blue); flex: none; width: 3.4rem; }
.formula__label { font-size: 1rem; color: var(--ink); }
.formula__note { padding: 0.9rem 1.3rem; border-top: 1px solid var(--line); font-size: 0.9rem; color: var(--muted); margin: 0; }

.ticks { list-style: none; margin: 0; padding: 0.3rem 1.3rem 0.4rem; }
.ticks li { display: flex; gap: 0.7rem; align-items: baseline; padding: 0.6rem 0; font-size: 1rem; }
.ticks li + li { border-top: 1px dotted var(--line); }
.ticks li::before {
  content: ""; flex: none; width: 0.72em; height: 0.72em; transform: translateY(0.12em); background: var(--red);
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20d='M12%201.7l2.94%207.06%207.62.61-5.8%204.97%201.77%207.44L12%2017.79l-6.53%203.99%201.77-7.44-5.8-4.97%207.62-.61z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20d='M12%201.7l2.94%207.06%207.62.61-5.8%204.97%201.77%207.44L12%2017.79l-6.53%203.99%201.77-7.44-5.8-4.97%207.62-.61z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Second languages (BA) */
.langs { margin: 1.6rem 0; }
.langs__label { font: 600 0.74rem/1.4 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); margin-bottom: 0.5rem; }
.langs__list { font-family: var(--serif); font-size: 1.08rem; line-height: 1.75; }
.langs__note { font-size: 0.9rem; color: var(--muted); margin-top: 0.5rem; }

/* How to apply — numbered steps (a genuine ordered procedure) */
.steps { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.5rem, 4vw, 3rem); }
.steps__track { font: 700 0.8rem/1 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--red-deep); padding-bottom: 0.9rem; border-bottom: 1px solid var(--ink); }
.steps__list { margin: 0.4rem 0 0; padding: 0; list-style: none; counter-reset: step; }
.steps__list li { display: grid; grid-template-columns: 2rem 1fr; gap: 0.8rem; align-items: baseline; padding: 1rem 0; font-size: 1rem; }
.steps__list li + li { border-top: 1px dotted var(--line); }
.steps__list li::before { counter-increment: step; content: counter(step); font: 700 1.05rem/1 var(--serif); color: var(--blue); }
@media (max-width: 720px) { .steps { grid-template-columns: 1fr; gap: 2.2rem; } }

/* What to prepare — ruled columns, not cards */
.prepare { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); }
.prepare__item { padding: 1.4rem 1.6rem 1.4rem 0; border-right: 1px solid var(--line); }
.prepare__item:last-child { border-right: 0; }
.prepare__item + .prepare__item { padding-left: 1.6rem; }
.prepare__t { font: 700 1.05rem/1.3 var(--serif); margin-bottom: 0.5rem; }
.prepare__b { font-size: 0.96rem; color: var(--muted); }
@media (max-width: 760px) {
  .prepare { grid-template-columns: 1fr; }
  .prepare__item { border-right: 0; border-bottom: 1px solid var(--line); padding: 1.2rem 0; }
  .prepare__item + .prepare__item { padding-left: 0; }
  .prepare__item:last-child { border-bottom: 0; }
}

/* Places & fees */
.fees { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.fees__main .fineprint { margin: 1rem 0 1.6rem; }
.fees__intl { border: 1px solid var(--line); background: var(--surface); padding: 1.3rem 1.4rem; }
.fees__intl-t { font: 600 0.74rem/1.4 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); margin-bottom: 0.6rem; }
.fees__intl p { font-size: 0.96rem; color: var(--ink); margin-bottom: 0.7rem; }
@media (max-width: 900px) { .fees { grid-template-columns: 1fr; } }

/* Contact band (blue) */
.contact-band { background: var(--blue-deep); color: var(--on-blue); padding-block: clamp(3rem, 7vw, 5rem); }
.contact-band a { color: #fff; text-decoration-color: rgb(255 255 255 / 0.4); }
.contact-band .more, .contact-band .more:hover { color: #fff; }
.contact { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.contact__intro .star { width: 1.3rem; height: 1.3rem; color: var(--red); margin-bottom: 1rem; }
.contact__intro .section-title { color: #fff; }
.contact__lede { color: var(--on-blue-muted); margin-top: 0.8rem; }
.contact__cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); gap: 1.8rem; }
.contact__label { font: 600 0.74rem/1.4 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--on-blue-muted); margin-bottom: 0.7rem; }
.contact__block p, .contact__block address { font-size: 0.98rem; line-height: 1.7; color: var(--on-blue); font-style: normal; }
.contact__block .more { margin-top: 0.6rem; }
@media (max-width: 820px) { .contact { grid-template-columns: 1fr; } }

/* ============================================================
   Faculty page
   ============================================================ */
.fac-group + .fac-group { margin-top: clamp(2.5rem, 5vw, 4rem); }
.fac-group__title {
  display: flex; align-items: baseline; gap: 0.8rem;
  font-size: clamp(1.3rem, 2.4vw, 1.7rem);
  padding-bottom: 0.9rem; border-bottom: 1px solid var(--ink); margin-bottom: 1.8rem;
}
.fac-group__count { font: 600 0.8rem/1 var(--sans); letter-spacing: 0.12em; color: var(--muted); }

.fac-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: clamp(1.3rem, 2.6vw, 2rem); }
.fac__portrait {
  position: relative; aspect-ratio: 4 / 5; overflow: hidden;
  display: grid; place-items: center;
  background: var(--surface); border: 1px solid var(--line);
  margin-bottom: 0.85rem;
}
.fac__portrait img { width: 100%; height: 100%; object-fit: cover; }
.fac__mono { font: 700 clamp(2rem, 5vw, 2.8rem)/1 var(--serif); color: var(--blue); letter-spacing: 0.02em; }
.fac__star { position: absolute; top: 0.6rem; right: 0.6rem; width: 0.8rem; height: 0.8rem; color: var(--red); opacity: 0.75; }
/* bookplate rhythm on the monogram tiles — only shows until real photos land,
   since a filled photo covers the tile background entirely */
.fac:nth-child(3n + 2) .fac__portrait { background: var(--blue-deep); border-color: transparent; }
.fac:nth-child(3n + 2) .fac__mono { color: var(--on-blue); }
.fac:nth-child(3n + 3) .fac__portrait { background: var(--bg); }
.fac__name { font: 700 1.02rem/1.3 var(--serif); }
.fac__title { font: 400 0.88rem/1.4 var(--sans); color: var(--muted); margin-top: 0.15rem; }
.fac__email { display: inline-block; margin-top: 0.4rem; font: 600 0.82rem/1.4 var(--sans); color: var(--blue); text-decoration: none; }
.fac__email:hover { color: var(--red-deep); }
@media (max-width: 520px) { .fac-grid { grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); } }

.fac-note { text-align: center; max-width: 44rem; margin-inline: auto; }
.fac-note .star { width: 1.1rem; height: 1.1rem; color: var(--red); margin: 0 auto 1.2rem; }
.fac-note p { color: var(--muted); margin: 0.8rem auto 1.6rem; max-width: 40ch; }

/* ============================================================
   About page
   ============================================================ */
#founder, #offer, #partners { scroll-margin-top: 5rem; }

/* opening story with a dropped initial */
.dropcap::first-letter {
  font-family: var(--serif); font-weight: 700; color: var(--blue-deep);
  float: left; font-size: 3.3em; line-height: 0.78; padding: 0.06em 0.12em 0 0;
}
@supports (initial-letter: 3) or (-webkit-initial-letter: 3) {
  .dropcap::first-letter { float: none; font-size: inherit; line-height: inherit; padding: 0; -webkit-initial-letter: 3 3; initial-letter: 3 3; margin-right: 0.14em; }
}
.story p + p { margin-top: 1.2rem; }

/* Founder's message */
.founder-grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.founder-card { position: sticky; top: 5.5rem; }
.founder-card__mono {
  display: grid; place-items: center; width: 5.5rem; height: 5.5rem;
  background: var(--blue-deep); color: var(--on-blue);
  font: 700 2rem/1 var(--serif); letter-spacing: 0.02em; margin-bottom: 1.2rem;
}
.founder-card__label { font: 600 0.74rem/1.4 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); margin-bottom: 0.7rem; }
.founder-card__name { font: 700 1.5rem/1.2 var(--serif); }
.founder-card__role { font-size: 0.92rem; color: var(--muted); margin-top: 0.3rem; }
.founder-msg p { margin-bottom: 1.15rem; max-width: 62ch; }
.founder-quote { margin: 1.9rem 0; padding: 1.4rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.founder-quote .star { width: 1.1rem; height: 1.1rem; color: var(--red); margin-bottom: 0.7rem; }
.founder-quote p { font: italic 400 clamp(1.2rem, 2vw, 1.45rem)/1.5 var(--serif); color: var(--ink); max-width: 54ch; margin: 0; }
.founder-sign { font: 600 0.95rem/1.4 var(--sans); color: var(--muted); margin-top: 1.4rem; }
@media (max-width: 820px) {
  .founder-grid { grid-template-columns: 1fr; }
  .founder-card { position: static; }
}

/* What we offer */
.offer-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.offer__main p { margin-bottom: 1.1rem; }
.offer__dest-label { font: 600 0.74rem/1.4 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); margin: 1.6rem 0 0.9rem; }
.offer__dest { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.6rem; }
.offer__dest li { font: 600 0.9rem/1 var(--sans); padding: 0.55rem 0.9rem; border: 1px solid var(--line); background: var(--bg); border-radius: 2px; }
.offer__fulbright { border: 1px solid var(--ink); background: var(--bg); padding: 1.4rem 1.5rem; }
.offer__fulbright-t { display: flex; align-items: center; gap: 0.5rem; font: 700 1.05rem/1.3 var(--serif); margin-bottom: 0.7rem; }
.offer__fulbright-t .star { width: 0.9rem; height: 0.9rem; color: var(--red); flex: none; }
.offer__fulbright p { font-size: 0.96rem; color: var(--muted); margin: 0; }
@media (max-width: 820px) { .offer-grid { grid-template-columns: 1fr; } }

/* Partners — a ruled directory of names */
.partners { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); }
.partner { display: flex; align-items: center; gap: 0.7rem; background: var(--bg); padding: 1.1rem 1.3rem; font: 600 1rem/1.3 var(--sans); }
.partner .star { width: 0.85rem; height: 0.85rem; color: var(--red); flex: none; }

/* Closing CTA (on the blue contact band) */
.about-cta { text-align: center; max-width: 44rem; margin-inline: auto; }
.about-cta .star { width: 1.3rem; height: 1.3rem; color: var(--red); margin: 0 auto 1.2rem; }
.about-cta .section-title { color: #fff; }
.about-cta p { color: var(--on-blue-muted); margin: 0.8rem auto 1.8rem; max-width: 46ch; }

/* ---------- Footer ---------- */
.site-foot { background: var(--blue-deep); color: var(--on-blue); }
.site-foot a { color: var(--on-blue); }
.site-foot a:hover { color: #fff; }
.foot-grid {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 4fr) minmax(0, 3fr);
  gap: clamp(2rem, 5vw, 4rem);
  padding-block: clamp(3rem, 6vw, 4.5rem) clamp(2.2rem, 4vw, 3rem);
}
.foot-brand .brand__name { color: #fff; }
.foot-brand .brand__sub { color: var(--on-blue-muted); }
.foot-mission { margin-top: 1.1rem; color: var(--on-blue-muted); font-size: 0.95rem; max-width: 38ch; }
.foot-social { display: flex; gap: 1.1rem; margin-top: 1.5rem; }
.foot-social a { display: inline-flex; padding: 0.35rem; }
.foot-social svg { width: 1.3rem; height: 1.3rem; fill: currentColor; }
.foot-h { font: 600 0.78rem/1.4 var(--sans); letter-spacing: 0.15em; text-transform: uppercase; color: var(--on-blue-muted); margin-bottom: 1.1rem; }
.foot-addr { font-style: normal; line-height: 1.8; font-size: 0.98rem; }
.foot-addr a { text-decoration-color: rgb(255 255 255 / 0.35); }
.foot-links { list-style: none; margin: 0; padding: 0; line-height: 2.1; font-size: 0.98rem; }
.foot-links a { text-decoration: none; }
.foot-links a:hover { text-decoration: underline; }
.foot-bar {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.8rem;
  border-top: 1px solid rgb(255 255 255 / 0.16);
  padding-block: 1.3rem;
  font-size: 0.85rem; color: var(--on-blue-muted);
}
.foot-bar a { color: var(--on-blue-muted); }
.foot-bar a:hover { color: #fff; }
.foot-bar .lang a, .foot-bar .lang [aria-current] { color: var(--on-blue-muted); }
.foot-bar .lang [aria-current] { color: var(--on-blue); }
@media (max-width: 900px) { .foot-grid { grid-template-columns: 1fr; } }

/* ---------- Scroll reveals (JS adds .will-reveal only when allowed) ---------- */
.will-reveal { opacity: 0; transform: translateY(16px); transition: opacity 0.7s var(--ease-out), transform 0.7s var(--ease-out); }
.will-reveal.is-in { opacity: 1; transform: none; }

/* ---------- Scroll-driven motion layer (progressive enhancement) ----------
   Where supported (Chromium/Safari), reveals run off the scroll timeline in CSS
   instead of JS. Gated on html.sd, which main.js adds ONLY after confirming
   support + motion preference — so a no-JS page never carries .sd and every
   [data-reveal] stays fully visible. A 4s failsafe / beforeprint adds
   .reveal-static to snap everything on. The same vocabulary is reusable on
   inner pages: mark an element [data-reveal] and it inherits this behaviour. */
@keyframes sd-rise { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
@keyframes img-pan { from { object-position: 50% 34%; } to { object-position: 50% 66%; } }
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    html.sd [data-reveal] {
      animation: sd-rise both;
      animation-timeline: view();
      animation-range: entry 6% cover 22%;
    }
    html.sd.reveal-static [data-reveal] { animation: none; opacity: 1; transform: none; }

    /* Editorial parallax: the conference photograph pans within its own frame as
       it crosses the viewport. object-position shifts the crop — no transform,
       no clipping, no border artefacts, and the image is always fully painted. */
    .beyond__media img {
      animation: img-pan linear both;
      animation-timeline: view();
      animation-range: cover;
    }
  }
}

/* ---------- Stub page ---------- */
.stub { padding-block: calc(var(--section) * 1.2); text-align: center; }
.stub .star { width: 1.2rem; height: 1.2rem; color: var(--red); margin: 0 auto 1.5rem; }
.stub h1 { font-size: clamp(2rem, 5vw, 3.2rem); margin-bottom: 1rem; }
.stub p { color: var(--muted); max-width: 46ch; margin: 0 auto 2rem; }
.stub__actions { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .hero__affil, .hero__title .line, .hero__lede, .hero__cta, .hero__img, .admit__card { animation: none; }
  .will-reveal { opacity: 1; transform: none; transition: none; }
  .btn, .more::after, .news-item a, .book { transition: none; }
}

/* ---------- Print ---------- */
@media print {
  .site-head, .site-foot, .hero__img, .hero__scrim { display: none; }
  .hero { background: none; color: #000; }
  /* nothing may print blank because a scroll/observer timeline never advanced */
  [data-reveal], .will-reveal, .beyond__media img {
    animation: none !important; opacity: 1 !important; transform: none !important;
    object-position: center !important;
  }
}

/* ===== inner-page parts merged from workflow (contact, faq, for-students, ba-courses) ===== */
/* ============================================================
   BA Courses — undergraduate curriculum page
   Page-scoped classes only (prefix: bac-). Shared classes
   (.page-head, .section, .container, .section-title, .lead,
   .fineprint, .contact-band, .btn, .chip, .star, .on-dark)
   are defined in main.css and reused as-is.
   ============================================================ */

/* --- Two-semester layout within each year --- */
.bac-year {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(2rem, 5vw, 4rem);
  margin-top: 2rem;
}

/* Semester subhead — a real heading, not an eyebrow: a hairline
   rule and a red star mark it without shouting. */
.bac-sem__head {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  font-family: var(--sans);
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0;
  color: var(--ink);
  padding-bottom: 0.7rem;
  border-bottom: 2px solid var(--blue-deep);
}
.bac-sem__head::before {
  content: "";
  width: 0.6rem;
  height: 0.6rem;
  flex: none;
  background: var(--red);
  clip-path: polygon(50% 0, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
}

/* --- Ruled course list (hairlines, not cards) --- */
.bac-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.bac-course {
  padding: 0.95rem 0;
  border-bottom: 1px solid var(--line);
}
.bac-course__title {
  font-family: var(--serif);
  font-size: 1.08rem;
  font-weight: 700;
  line-height: 1.28;
  letter-spacing: -0.01em;
  color: var(--ink);
}
.bac-course__by {
  margin-top: 0.28rem;
  font-family: var(--sans);
  font-size: 0.92rem;
  line-height: 1.4;
  color: var(--muted);
}
/* "Taught by" is announced to screen readers but visually the muted
   instructor name is self-explanatory next to its course. */
.bac-course__by-label {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* --- Complementary language section --- */
.bac-comp {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: start;
}
.bac-comp__lede {
  margin-top: 1.2rem;
  max-width: 44rem;
}
.bac-langs {
  list-style: none;
  padding: 0;
  margin: 1.6rem 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}
.bac-lang {
  font-family: var(--sans);
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--ink);
  padding: 0.35rem 0.85rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--bg);
}
.bac-comp__note {
  margin-top: 1.8rem;
}
.bac-comp__aside {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 1.5rem 1.6rem;
}
.bac-comp__aside-label {
  font-family: var(--sans);
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--muted);
  margin-bottom: 0.4rem;
}
.bac-comp__reqs {
  list-style: none;
  padding: 0;
  margin: 0;
}
.bac-comp__req {
  font-family: var(--serif);
  font-size: 1.02rem;
  line-height: 1.4;
  color: var(--ink);
  padding: 0.9rem 0;
  border-top: 1px solid var(--line);
}
.bac-comp__req:first-child {
  border-top: 0;
  padding-top: 0.2rem;
}

/* --- Closing band (reuses .contact-band) --- */
.bac-cta { max-width: 44rem; }
.bac-cta .star { width: 1.1rem; height: 1.1rem; color: var(--red); margin-bottom: 1.1rem; }
.bac-cta p { color: var(--on-blue); margin: 0.9rem 0 1.6rem; }

/* --- Responsive: single column on narrow screens --- */
@media (max-width: 720px) {
  .bac-year { grid-template-columns: 1fr; gap: 2.4rem; }
  .bac-comp { grid-template-columns: 1fr; }
}
/* ============================================================
   Contact page — new classes only (prefix: ct-).
   Reuses shared chrome: .page-head, .chip, .section(+--surface),
   .section-head/-title/-lede, .catalog(+__head), .btn/.btn--red,
   .more, .contact-band, .on-dark, .star. Nothing shared is redefined.
   ============================================================ */

/* ---------- Primary CTA in the blue page head ---------- */
.ct-primary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 1.6rem;
  margin-top: 1.9rem;
  padding-top: 1.6rem;
  border-top: 1px solid rgb(255 255 255 / 0.18);
}
.ct-primary__promise {
  font-family: var(--serif);
  font-size: clamp(1.05rem, 1.6vw, 1.25rem);
  line-height: 1.5;
  color: #fff;
  max-width: 26rem;
}

/* ---------- Reach-us cards ---------- */
.ct-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1.5rem, 4vw, 2.5rem);
  align-items: start;
}
.ct-body {
  display: grid;
  gap: 1.05rem;
  padding: 1.15rem 1.3rem 1.4rem;
}
.ct-note {
  font-size: 0.98rem;
  line-height: 1.6;
  color: var(--muted);
}
.ct-line__k {
  font: 600 0.72rem/1.4 var(--sans);
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 0.3rem;
}
.ct-line__v {
  font: 400 1.02rem/1.45 var(--sans);
  color: var(--ink);
  word-break: break-word;
}
.ct-line__v--link {
  font-weight: 600;
  color: var(--red-deep);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}
.ct-line__v--link:hover { color: var(--red); }
.ct-name {
  font-family: var(--serif);
  font-size: 1.2rem;
  line-height: 1.3;
  color: var(--ink);
}
.ct-role {
  font: 400 0.9rem/1.4 var(--sans);
  color: var(--muted);
  margin-top: 0.25rem;
}

/* ---------- Visit us: details + map ---------- */
.ct-visit {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: clamp(2rem, 5vw, 3.5rem);
  align-items: stretch;
}
.ct-visit__details {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.4rem;
}
.ct-address {
  font-style: normal;
  display: grid;
  gap: 0.2rem;
}
.ct-address__faculty {
  font-family: var(--serif);
  font-size: clamp(1.15rem, 2vw, 1.4rem);
  line-height: 1.3;
  color: var(--ink);
  margin-bottom: 0.35rem;
}
.ct-address__line {
  font: 400 1.05rem/1.5 var(--sans);
  color: var(--muted);
}
.ct-visit__hours { margin-top: -0.2rem; }

/* Lightweight, self-contained "map" link — no external scripts. */
.ct-map {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  min-height: clamp(240px, 32vw, 320px);
  padding: 2rem 1.5rem;
  text-align: center;
  text-decoration: none;
  color: var(--ink);
  border: 1px solid var(--ink);
  background-color: var(--surface);
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 34px 34px;
  box-shadow: 6px 6px 0 var(--bg), 6px 6px 0 1px var(--line);
  transition: transform 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out);
}
.ct-map:hover {
  transform: translate(-2px, -2px);
  box-shadow: 8px 8px 0 var(--bg), 8px 8px 0 1px var(--line);
}
.ct-map__pin {
  width: 2rem;
  height: 2rem;
  color: var(--red);
  filter: drop-shadow(0 2px 0 rgb(0 0 0 / 0.12));
}
.ct-map__label {
  font-family: var(--serif);
  font-size: 1.1rem;
  line-height: 1.3;
  color: var(--ink);
}
.ct-map__addr {
  font: 400 0.9rem/1.4 var(--sans);
  color: var(--muted);
}
.ct-map__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: 0.3rem;
  font: 600 0.85rem/1 var(--sans);
  letter-spacing: 0.02em;
  color: var(--red-deep);
}
.ct-map__cta::after {
  content: "→";
  transition: transform 0.25s var(--ease-out);
}
.ct-map:hover .ct-map__cta::after { transform: translateX(4px); }

/* ---------- Follow us (blue band) ---------- */
.ct-follow {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}
.ct-follow__intro .star {
  width: 1.3rem;
  height: 1.3rem;
  color: var(--red);
  margin-bottom: 1rem;
}
.ct-follow__intro .section-title { color: #fff; }
.ct-follow__lede {
  color: var(--on-blue-muted);
  margin-top: 0.8rem;
  max-width: 34ch;
}
.ct-social {
  display: grid;
  gap: 1rem;
}
.ct-social__link {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.3rem;
  text-decoration: none;
  color: #fff;
  border: 1px solid rgb(255 255 255 / 0.28);
  transition: border-color 0.2s var(--ease-out), background 0.2s var(--ease-out);
}
.ct-social__link:hover {
  background: rgb(255 255 255 / 0.08);
  border-color: #fff;
}
.ct-social__net {
  font-family: var(--serif);
  font-size: 1.2rem;
}
.ct-social__handle {
  font: 400 0.95rem/1 var(--sans);
  color: var(--on-blue-muted);
}

/* ---------- Responsive ---------- */
@media (max-width: 820px) {
  .ct-grid,
  .ct-visit,
  .ct-follow { grid-template-columns: 1fr; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .ct-map,
  .ct-map__cta::after,
  .ct-social__link { transition: none; }
  .ct-map:hover { transform: none; }
  .ct-map:hover .ct-map__cta::after { transform: none; }
}
/* ============================================================
   F.A.Q. page — accessible native <details> accordions.
   Reuses shared: .page-head, .section, .section-head,
   .section-title, .container, .contact-band, .about-cta,
   .btn, .star. Only FAQ-specific classes live here.
   ============================================================ */

.faq {
  max-width: 52rem;
  border-top: 1px solid var(--line);
}

.faq__item {
  border-bottom: 1px solid var(--line);
}

/* --- Question (the clickable summary) --- */
.faq__q {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: baseline;
  column-gap: 0.9rem;
  padding: 1.35rem 0;
  cursor: pointer;
  list-style: none;                 /* strip default disclosure triangle */
  font-family: var(--serif);
  font-size: clamp(1.12rem, 2.2vw, 1.4rem);
  line-height: 1.3;
  color: var(--ink);
}
.faq__q::-webkit-details-marker { display: none; }

.faq__q:hover .faq__q-text { color: var(--blue-deep); }
.faq__q:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 3px;
  border-radius: 2px;
}

.faq__star {
  width: 0.85rem;
  height: 0.85rem;
  color: var(--red);
  position: relative;
  top: 0.15rem;
  flex: none;
}

.faq__q-text {
  transition: color 0.2s var(--ease-out);
}

/* --- Open / closed marker (+ / −), pure CSS --- */
.faq__marker {
  position: relative;
  top: 0.35rem;
  width: 1rem;
  height: 1rem;
  flex: none;
}
.faq__marker::before,
.faq__marker::after {
  content: "";
  position: absolute;
  background: var(--muted);
  transition: transform 0.25s var(--ease-out), opacity 0.25s var(--ease-out);
}
.faq__marker::before {           /* horizontal bar */
  top: 50%;
  left: 0;
  width: 100%;
  height: 1.5px;
  transform: translateY(-50%);
}
.faq__marker::after {            /* vertical bar (hidden when open) */
  left: 50%;
  top: 0;
  height: 100%;
  width: 1.5px;
  transform: translateX(-50%);
}
.faq__item[open] .faq__marker::after { opacity: 0; transform: translateX(-50%) rotate(90deg); }
.faq__item[open] .faq__q .faq__q-text { color: var(--blue-deep); }

/* --- Answer --- */
.faq__a {
  padding: 0 0 1.5rem;
  /* align answer under the question text, past the star column */
  padding-left: calc(0.85rem + 0.9rem);
}
.faq__a p {
  margin: 0;
  max-width: 68ch;              /* keep a comfortable reading measure */
  color: var(--muted);
  line-height: 1.65;
}

/* Subtle expand animation, only when motion is welcome */
@media (prefers-reduced-motion: no-preference) {
  .faq__item[open] .faq__a {
    animation: faq-open 0.28s var(--ease-out) both;
  }
}
@keyframes faq-open {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .faq__q-text,
  .faq__marker::before,
  .faq__marker::after { transition: none; }
}

/* --- Mobile --- */
@media (max-width: 620px) {
  .faq__q { column-gap: 0.7rem; }
  .faq__a { padding-left: 0; }
}
/* ============================================================
   For Students hub — page-specific classes only.
   Reuses shared: .page-head*, .section*, .container, .section-head,
   .section-title, .section-lede, .contact-band, .on-dark, .star.
   Prefixed .fs- to avoid collisions.
   ============================================================ */

/* ---------- Hub links: a ruled directory (not a card grid) ---------- */
.fs-list { list-style: none; margin: 2rem 0 0; padding: 0; border-top: 1px solid var(--line); }
.fs-list__item { border-bottom: 1px solid var(--line); }

.fs-link {
  display: grid;
  grid-template-columns: 2.6rem 1fr 1.6rem;
  align-items: start;
  gap: 0 1.4rem;
  padding: 1.6rem 0.4rem;
  text-decoration: none;
  color: var(--ink);
  transition: background-color 0.2s var(--ease-out);
}
.fs-link:hover,
.fs-link:focus-visible { background: var(--surface); }
.fs-link:focus-visible { outline: 2px solid var(--blue); outline-offset: -2px; }

.fs-link__num {
  font: 400 1.05rem/1.5 var(--serif);
  color: var(--red);
  padding-top: 0.15rem;
}

.fs-link__body { display: block; }
.fs-link__kind {
  display: block;
  font: 600 0.72rem/1.4 var(--sans);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 0.35rem;
}
.fs-link__title {
  display: block;
  font: 400 clamp(1.35rem, 2.4vw, 1.7rem)/1.2 var(--serif);
  color: var(--ink);
}
.fs-link:hover .fs-link__title { color: var(--blue-deep); }
.fs-link__desc {
  display: block;
  margin-top: 0.5rem;
  max-width: 54ch;
  font: 400 1rem/1.6 var(--sans);
  color: var(--muted);
}
.fs-link__cta {
  display: inline-block;
  margin-top: 0.75rem;
  font: 600 0.9rem/1 var(--sans);
  color: var(--blue);
}
.fs-link:hover .fs-link__cta { color: var(--red-deep); }

.fs-link__arrow {
  width: 1.4rem; height: 1.4rem;
  color: var(--muted);
  align-self: center;
  transition: transform 0.25s var(--ease-out), color 0.2s var(--ease-out);
}
.fs-link:hover .fs-link__arrow { transform: translateX(5px); color: var(--red); }

/* ---------- Program office (inside the closing blue band) ---------- */
.fs-office { max-width: 44rem; }
.fs-office > .star { width: 1.2rem; height: 1.2rem; color: var(--red); margin-bottom: 1rem; }
.fs-office__lede {
  margin-top: 0.9rem;
  font: 400 clamp(1.05rem, 1.6vw, 1.2rem)/1.6 var(--sans);
  color: var(--on-blue);
  max-width: 40rem;
}
.fs-office__label {
  margin-top: 1.8rem;
  font: 700 0.75rem/1 var(--sans);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--on-blue-muted);
}
.fs-office__email {
  margin-top: 0.5rem;
  font: 400 clamp(1.2rem, 2.2vw, 1.6rem)/1.3 var(--serif);
}
.fs-office__email a { color: #fff; }
.fs-office__faculty {
  margin-top: 0.8rem;
  font: 400 0.92rem/1.5 var(--sans);
  color: var(--on-blue-muted);
}

/* ---------- Mobile ---------- */
@media (max-width: 34rem) {
  .fs-link { grid-template-columns: 1fr 1.4rem; gap: 0 1rem; padding: 1.35rem 0.2rem; }
  .fs-link__num { display: none; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .fs-link, .fs-link__arrow { transition: none; }
  .fs-link:hover .fs-link__arrow { transform: none; }
}
/* ============================================================
   MA Courses page — only classes unique to this page.
   Reuses shared components: .page-head, .section(+--surface),
   .section-head/-title/-lede/-foot, .container, .prose, .lead,
   .chip, .catalog(+__head), .fineprint, .contact-band, .about-cta,
   .btn/.more, .star. All new classes are prefixed `mac-`.
   ============================================================ */

/* Three track cards side by side; collapses to 2 then 1 column.
   Cards align to the top so uneven course counts read cleanly. */
.mac-tracks {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.8rem 1.5rem;
  align-items: start;
  margin-top: clamp(1.8rem, 4vw, 2.6rem);
}

/* Course list living inside a reused .catalog card shell.
   Padding mirrors the shared `.catalog dl` rhythm. */
.mac-list {
  list-style: none;
  padding: 0.35rem 1.3rem 0.95rem;
}
.mac-course { padding: 0.75rem 0; }
.mac-course + .mac-course { border-top: 1px dotted var(--line); }
.mac-course__title { font: 700 1.02rem/1.35 var(--serif); }
.mac-course__who {
  margin-top: 0.22rem;
  font: 400 0.9rem/1.45 var(--sans);
  color: var(--muted);
}

/* The single, full-width card for seminars / research / practice. */
.mac-prog {
  max-width: 44rem;
  margin-top: clamp(1.6rem, 4vw, 2.4rem);
}

/* Secondary link under the closing CTA button. */
.mac-close__alt { margin-top: 0.2rem; }

@media (max-width: 900px) {
  .mac-tracks { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .mac-tracks { grid-template-columns: 1fr; }
}

/* MA courses page (mac-) */
.mac-tracks { display:flex; flex-wrap:wrap; gap:.6rem; margin:1.2rem 0 2.2rem; list-style:none; padding:0; }
.mac-tracks li { font:600 .88rem/1 var(--sans); padding:.55rem .95rem; border:1px solid var(--line); background:var(--bg); }
.mac-list { list-style:none; margin:0; padding:0; border-top:1px solid var(--ink); }
.mac-course { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:.3rem 1.5rem; padding:.95rem 0; border-bottom:1px dotted var(--line); }
.mac-course > :first-child, .mac-course__title { font:400 1.08rem/1.4 var(--serif); color:var(--ink); }
.mac-course > :last-child, .mac-course__prof { font:600 .9rem/1.4 var(--sans); color:var(--muted); }
.mac-close { margin-top:1.8rem; color:var(--muted); font-size:.92rem; max-width:60ch; }

/* ==========================================================================
   Announcements — listing feed (news-*) + single post (post-*)
   ========================================================================== */

/* ---- Filter bar ---- */
.news-filter { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:clamp(2rem,4vw,3rem); }
.news-filter__btn {
  font:600 .82rem/1 var(--sans); letter-spacing:.02em;
  padding:.6rem 1.1rem; border:1px solid var(--line); border-radius:2rem;
  background:transparent; color:var(--muted); cursor:pointer;
  transition:color .2s var(--ease-out), border-color .2s var(--ease-out), background-color .2s var(--ease-out);
}
.news-filter__btn:hover { color:var(--blue); border-color:var(--blue); }
.news-filter__btn:focus-visible { outline:2px solid var(--blue); outline-offset:2px; }
.news-filter__btn.is-active { background:var(--blue-deep); color:#fff; border-color:var(--blue-deep); }

/* ---- Year groups ---- */
.news-year + .news-year { margin-top:clamp(2.4rem,5vw,3.6rem); }
.news-year__label {
  font:400 1.5rem/1 var(--serif); color:var(--muted);
  padding-bottom:.6rem; margin-bottom:0;
}
.news-index { list-style:none; margin:0; padding:0; border-top:2px solid var(--ink); }
.news-row { border-bottom:1px solid var(--line); }

.news-row__link {
  display:grid; grid-template-columns:8.5rem minmax(0,1fr) auto auto;
  align-items:start; gap:.3rem clamp(1rem,3vw,2rem);
  padding:1.5rem .75rem; text-decoration:none; color:inherit;
  transition:background-color .18s var(--ease-out);
}
.news-row__link:hover { background:var(--surface); }
.news-row__link:focus-visible { outline:2px solid var(--blue); outline-offset:-2px; }

.news-row__meta { display:flex; flex-direction:column; gap:.55rem; padding-top:.15rem; }
.news-row__date { font:600 .78rem/1.4 var(--sans); letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }

/* Category chip (shared by feed rows + post header) */
.news-row__chip, .post__chip {
  display:inline-flex; align-items:center; gap:.42em; align-self:flex-start;
  font:600 .68rem/1.4 var(--sans); letter-spacing:.09em; text-transform:uppercase; color:var(--muted);
}
.news-row__chip::before, .post__chip::before {
  content:""; width:.5em; height:.5em; border-radius:50%; background:currentColor; opacity:.85; flex:none;
}
.news-row__chip--books::before, .post__chip--books::before { background:var(--blue); opacity:1; }
.news-row__chip--events::before, .news-row__chip--ba-events::before, .news-row__chip--ma-events::before,
.post__chip--events::before, .post__chip--ba-events::before, .post__chip--ma-events::before { background:var(--red); opacity:1; }

.news-row__body { min-width:0; }
.news-row__title { display:block; font:400 1.24rem/1.35 var(--serif); color:var(--ink); transition:color .18s var(--ease-out); }
.news-row__link:hover .news-row__title { color:var(--blue-deep); }
.news-row__excerpt {
  display:block; margin-top:.4rem; color:var(--muted); font-size:.96rem; line-height:1.55; max-width:60ch;
  overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
}
.news-row__lang {
  display:inline-block; margin-top:.55rem; font:600 .68rem/1 var(--sans);
  letter-spacing:.06em; text-transform:uppercase; color:var(--muted);
  padding:.28rem .5rem; border:1px solid var(--line); border-radius:.25rem;
}
.news-row__thumb { align-self:center; }
.news-row__thumb img { display:block; width:5rem; height:5rem; object-fit:cover; background:var(--surface); }
.news-row__arrow { align-self:center; width:1.25rem; height:1.25rem; color:var(--muted); opacity:.55; transition:transform .22s var(--ease-out), color .22s var(--ease-out), opacity .22s var(--ease-out); }
.news-row__link:hover .news-row__arrow { color:var(--red); opacity:1; transform:translateX(4px); }

.news-empty { margin-top:2rem; color:var(--muted); font-size:1.05rem; text-align:center; }

@media (max-width:720px) {
  .news-row__link { grid-template-columns:1fr auto; gap:.5rem 1rem; padding:1.25rem .25rem; }
  .news-row__meta { grid-column:1 / -1; flex-direction:row; align-items:center; gap:.85rem; padding-top:0; }
  .news-row__body { grid-column:1; }
  .news-row__thumb { grid-column:2; grid-row:2; align-self:start; }
  .news-row__thumb img { width:4rem; height:4rem; }
  .news-row__arrow { display:none; }
}

/* ---- Single post ---- */
.post { padding-block:clamp(2.5rem,6vw,4.5rem) clamp(4rem,9vw,7rem); }
.post__wrap { max-width:44rem; }
.post__back {
  display:inline-flex; align-items:center; gap:.45rem; margin-bottom:2rem;
  font:600 .82rem/1 var(--sans); letter-spacing:.04em; text-transform:uppercase;
  color:var(--muted); text-decoration:none; transition:color .2s var(--ease-out);
}
.post__back svg { width:1.05rem; height:1.05rem; transition:transform .2s var(--ease-out); }
.post__back:hover { color:var(--blue); }
.post__back:hover svg { transform:translateX(-3px); }

.post__meta { display:flex; flex-wrap:wrap; align-items:center; gap:.9rem 1.2rem; margin-bottom:1.1rem; }
.post__date { font:600 .8rem/1.4 var(--sans); letter-spacing:.05em; text-transform:uppercase; color:var(--muted); }
.post__title { font:400 clamp(2rem,4.4vw,3.05rem)/1.13 var(--serif); color:var(--ink); letter-spacing:-0.01em; }
.post__lang {
  display:flex; align-items:center; gap:.6rem; margin-top:1.3rem;
  padding:.75rem 1rem; background:var(--surface); border-left:3px solid var(--blue);
  font-size:.9rem; color:var(--muted);
}
.post__lang svg { width:1.1rem; height:1.1rem; color:var(--blue); flex:none; }

.post__hero { margin:clamp(1.8rem,4vw,2.6rem) 0 0; text-align:center; }
.post__hero img { max-width:100%; max-height:72vh; width:auto; margin-inline:auto; background:var(--surface); }

/* Prose body */
.post-body { margin-top:clamp(1.8rem,4vw,2.6rem); color:var(--ink); font-size:1.08rem; line-height:1.72; }
.post-body > * + * { margin-top:1.2rem; }
.post-body h2 { font:400 1.7rem/1.25 var(--serif); margin-top:2.4rem; }
.post-body h3 { font:400 1.35rem/1.3 var(--serif); margin-top:2rem; }
.post-body h4 { font:600 1.05rem/1.35 var(--sans); margin-top:1.8rem; }
.post-body a { color:var(--blue); text-decoration:underline; text-decoration-color:rgb(0 87 109 / .35); text-underline-offset:2px; }
.post-body a:hover { color:var(--red-deep); text-decoration-color:currentColor; }
.post-body ul, .post-body ol { padding-left:1.4rem; }
.post-body li + li { margin-top:.4rem; }
.post-body blockquote { margin-inline:0; padding:.4rem 0 .4rem 1.3rem; border-left:3px solid var(--line); color:var(--muted); font-style:italic; }
.post-body hr { border:0; border-top:1px solid var(--line); margin:2rem 0; }
.post-body strong { font-weight:700; }
.post-body figure { margin:1.8rem 0; }
.post-body figure img { display:block; max-width:100%; height:auto; margin-inline:auto; background:var(--surface); }
.post-body figcaption { margin-top:.6rem; font-size:.85rem; color:var(--muted); text-align:center; }
/* standalone-link paragraph => button (Gutenberg buttons import this way) */
.post-body p > a:only-child {
  display:inline-block; margin-top:.4rem; padding:.7rem 1.3rem;
  font:600 .9rem/1 var(--sans); letter-spacing:.02em;
  color:#fff; background:var(--blue-deep); border:0; text-decoration:none;
  transition:background-color .2s var(--ease-out), transform .2s var(--ease-out);
}
.post-body p > a:only-child:hover { background:var(--blue); transform:translateY(-1px); color:#fff; }
/* tables (defense/admission schedules) */
.post-body figure:has(> table) { overflow-x:auto; }
.post-body table { width:100%; border-collapse:collapse; font-size:.92rem; }
.post-body th, .post-body td { padding:.55rem .8rem; border:1px solid var(--line); text-align:left; vertical-align:top; }
.post-body tr:first-child td, .post-body th { font-weight:700; background:var(--surface); }

/* Prev / next */
.post-nav {
  display:grid; grid-template-columns:1fr 1fr; gap:1rem;
  margin-top:clamp(3rem,7vw,5rem); padding-top:2rem; border-top:1px solid var(--ink);
}
.post-nav__link {
  display:flex; flex-direction:column; gap:.4rem; padding:1.1rem 1.2rem;
  border:1px solid var(--line); text-decoration:none; color:inherit;
  transition:background-color .18s var(--ease-out), border-color .18s var(--ease-out);
}
.post-nav__link:hover { background:var(--surface); border-color:var(--blue); }
.post-nav__link--older { text-align:right; }
.post-nav__dir { font:600 .74rem/1 var(--sans); letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.post-nav__title { font:400 1.05rem/1.35 var(--serif); color:var(--ink); }
.post-nav__link:hover .post-nav__title { color:var(--blue-deep); }

@media (max-width:640px) {
  .post-nav { grid-template-columns:1fr; }
  .post-nav__link--older { text-align:left; }
}

/* ==========================================================================
   Research — hub (Center rc-*, projects rp-*) + project detail (rproj-*)
   ========================================================================== */

/* ---- The Center ---- */
.rc-grid { display:grid; grid-template-columns:minmax(0,7fr) minmax(0,4fr); gap:clamp(2rem,5vw,4rem); align-items:start; }
.rc-main { min-width:0; }
.rc-director { font-size:1.1rem; margin-bottom:2rem; }
.rc-label { display:block; font:600 .72rem/1.4 var(--sans); letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-bottom:.25rem; }
.rc-sub { font:600 .8rem/1.4 var(--sans); letter-spacing:.1em; text-transform:uppercase; color:var(--blue); margin:2rem 0 .9rem; }
.rc-main > .rc-sub:first-of-type { margin-top:0; }
.rc-text { color:var(--muted); line-height:1.7; max-width:60ch; }
.rc-domains { list-style:none; margin:0; padding:0; }
.rc-domains li { position:relative; padding:.55rem 0 .55rem 1.4rem; border-bottom:1px solid var(--line); line-height:1.5; }
.rc-domains li::before { content:""; position:absolute; left:0; top:1.05rem; width:.5rem; height:.5rem; background:var(--red); border-radius:50%; }
.rc-journals { list-style:none; margin:0; padding:0; }
.rc-journals li { padding:.9rem 0; border-bottom:1px solid var(--line); }
.rc-journal__name { display:block; font:400 1.15rem/1.3 var(--serif); }
.rc-journal__name a { color:var(--blue); text-decoration:none; }
.rc-journal__name a:hover { text-decoration:underline; }
.rc-journal__issn { font:600 .68rem/1 var(--sans); letter-spacing:.06em; color:var(--muted); vertical-align:middle; }
.rc-journal__desc { display:block; color:var(--muted); font-size:.94rem; line-height:1.5; margin-top:.3rem; max-width:52ch; }

.rc-aside { display:flex; flex-direction:column; gap:1.2rem; }
.rc-card { border:1px solid var(--line); padding:1.4rem 1.5rem; background:var(--bg); }
.rc-card .rc-sub { margin-top:0; }
.rc-members { list-style:none; margin:0; padding:0; }
.rc-members li { padding:.4rem 0; border-bottom:1px dotted var(--line); font-size:.95rem; line-height:1.4; }
.rc-members li:last-child { border-bottom:0; }
.rc-card--contact { background:var(--surface); }
.rc-contact__line { font-size:.95rem; line-height:1.6; color:var(--muted); }
.rc-contact__line a { color:var(--blue); }

/* ---- Funded-project cards (ruled rows) ---- */
.rp-list { list-style:none; margin:0; padding:0; border-top:1px solid var(--ink); }
.rp-item { border-bottom:1px solid var(--line); }
.rp-link { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:start; gap:.2rem clamp(1.2rem,3vw,2.4rem); padding:1.8rem .75rem; text-decoration:none; color:inherit; transition:background-color .18s var(--ease-out); }
.rp-link:hover { background:var(--bg); }
.rp-link:focus-visible { outline:2px solid var(--blue); outline-offset:-2px; }
.rp-num { font:400 1.4rem/1 var(--serif); color:var(--red); padding-top:.2rem; }
.rp-body { min-width:0; display:flex; flex-direction:column; gap:.5rem; }
.rp-meta { display:flex; align-items:center; gap:.9rem; }
.rp-chip { font:600 .66rem/1.4 var(--sans); letter-spacing:.09em; text-transform:uppercase; color:var(--blue); }
.rp-years { font:600 .78rem/1 var(--sans); letter-spacing:.05em; color:var(--muted); }
.rp-title { font:400 1.35rem/1.3 var(--serif); color:var(--ink); transition:color .18s var(--ease-out); }
.rp-link:hover .rp-title { color:var(--blue-deep); }
.rp-summary { color:var(--muted); line-height:1.55; max-width:64ch; }
.rp-pi { font:600 .82rem/1.4 var(--sans); color:var(--muted); }
.rp-cta { font:600 .82rem/1 var(--sans); letter-spacing:.03em; color:var(--red-deep); margin-top:.2rem; }
.rp-arrow { align-self:center; width:1.35rem; height:1.35rem; color:var(--muted); opacity:.55; transition:transform .22s var(--ease-out), color .22s var(--ease-out), opacity .22s var(--ease-out); }
.rp-link:hover .rp-arrow { color:var(--red); opacity:1; transform:translateX(5px); }

/* ---- Earlier projects ---- */
.rpast-list { list-style:none; margin:0; padding:0; display:grid; gap:.3rem; }
.rpast-item { display:flex; gap:.8rem; align-items:baseline; padding:.75rem 0; border-bottom:1px solid var(--line); line-height:1.45; }
.rpast-item .star { flex:none; width:.7rem; height:.7rem; color:var(--red); transform:translateY(.05em); }

@media (max-width:820px) {
  .rc-grid { grid-template-columns:1fr; }
  .rp-link { grid-template-columns:auto minmax(0,1fr); }
  .rp-arrow { display:none; }
}

/* ---- Research project detail ---- */
.rproj { padding-block:clamp(2.5rem,6vw,4.5rem) clamp(4rem,9vw,7rem); }
.rproj__head { max-width:52rem; margin-bottom:clamp(2rem,4vw,3rem); }
.rproj__title { font:400 clamp(1.8rem,3.8vw,2.7rem)/1.18 var(--serif); color:var(--ink); letter-spacing:-0.01em; margin-top:.3rem; }
.rproj__grid { display:grid; grid-template-columns:19rem minmax(0,1fr); gap:clamp(2rem,5vw,4rem); align-items:start; }
.rproj__main { min-width:0; max-width:44rem; }

.factsheet { position:sticky; top:5.5rem; border:1px solid var(--line); border-top:3px solid var(--blue); padding:1.5rem 1.6rem; background:var(--surface); }
.factsheet__title { font:600 .74rem/1.4 var(--sans); letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-bottom:1.1rem; }
.factsheet__dl { margin:0; }
.factsheet__dl dt { font:600 .7rem/1.4 var(--sans); letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-top:1.1rem; }
.factsheet__dl dt:first-child { margin-top:0; }
.factsheet__dl dd { margin:.25rem 0 0; font-size:.95rem; line-height:1.5; color:var(--ink); }
.factsheet__team { list-style:none; margin:0; padding:0; }
.factsheet__team li { padding:.3rem 0; border-bottom:1px dotted var(--line); }
.factsheet__team li:last-child { border-bottom:0; }
.factsheet__affil { color:var(--muted); font-size:.86rem; }
.factsheet__role { display:inline-block; font:600 .6rem/1.4 var(--sans); letter-spacing:.08em; text-transform:uppercase; color:var(--blue); }
.research-body h3 { color:var(--blue-deep); border-bottom:1px solid var(--line); padding-bottom:.4rem; }
.research-body h4 { color:var(--muted); font:600 .78rem/1.4 var(--sans); letter-spacing:.1em; text-transform:uppercase; margin-top:1.6rem; }

@media (max-width:820px) {
  .rproj__grid { grid-template-columns:1fr; }
  .factsheet { position:static; }
}

/* ---- 404 ---- */
.notfound { text-align:center; }
.notfound__inner { max-width:40rem; margin-inline:auto; padding-block:clamp(2rem,6vw,4rem); }
.notfound__code { display:inline-flex; align-items:center; gap:.5rem; font:700 1.1rem/1 var(--sans); letter-spacing:.2em; color:var(--muted); }
.notfound__code .star { width:1rem; height:1rem; color:var(--red); }
.notfound__title { font:400 clamp(2rem,5vw,3rem)/1.15 var(--serif); color:var(--ink); margin:1rem 0 .8rem; }
.notfound__lede { color:var(--muted); line-height:1.6; }
.notfound__lede span { display:block; margin-top:.3rem; font-size:.95rem; }
.notfound__links { display:flex; flex-wrap:wrap; gap:.8rem; justify-content:center; margin:2rem 0 1.6rem; }
.notfound__cta { display:inline-block; padding:.75rem 1.5rem; font:600 .9rem/1 var(--sans); color:#fff; background:var(--blue-deep); text-decoration:none; transition:background-color .2s var(--ease-out), transform .2s var(--ease-out); }
.notfound__cta:hover { background:var(--blue); transform:translateY(-1px); }
.notfound__cta--ghost { color:var(--blue-deep); background:transparent; border:1px solid var(--line); }
.notfound__cta--ghost:hover { color:#fff; background:var(--blue-deep); border-color:var(--blue-deep); }
.notfound__nav { display:flex; flex-wrap:wrap; gap:.5rem 1.4rem; justify-content:center; padding-top:1.4rem; border-top:1px solid var(--line); }
.notfound__nav a { font:600 .85rem/1.6 var(--sans); color:var(--muted); text-decoration:none; }
.notfound__nav a:hover { color:var(--blue); }

/* ---- Legal (Privacy & Cookies) ---- */
.legal { max-width:44rem; }
.legal__block + .legal__block { margin-top:2.4rem; }
.legal__h { font:400 1.4rem/1.3 var(--serif); color:var(--ink); margin-bottom:.8rem; }
.legal__block p { color:var(--muted); line-height:1.72; max-width:64ch; }
.legal__block p + p { margin-top:1rem; }
.legal__block a { color:var(--blue); }