/* ==========================================================
   THE INSTITUTE'S TYPE SYSTEM (Oct 29, 2026)
   One sheet, loaded after every page's own styles, so the whole
   site reads as one publication. Layout, colours and artwork are
   the pages' own; this sets only type.

   Cormorant Garamond  headlines and editorial statements
   DM Sans             everything people read: body, programs, forms, notes
   IBM Plex Mono       labels, navigation, dates, status, small metadata
   Oswald              buttons and high-impact campaign moments
   ========================================================== */
:root{
  --f-head: "Cormorant Garamond", Georgia, serif;
  --f-body: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
  --f-cta:  "Oswald", "Arial Narrow", sans-serif;

  /* the scale: phone size first, desktop size last */
  --t-colossal: clamp(2.625rem, 1.4rem + 5.6vw, 6rem);      /* hero 42–96px */
  --t-room:     clamp(2rem, 1.35rem + 3.2vw, 4rem);         /* section 32–64px */
  --t-quote:    clamp(1.75rem, 1.2rem + 2.6vw, 3.25rem);
  --t-program:  clamp(1.5625rem, 1.3rem + 1.1vw, 2.25rem);  /* program title 25–36px */
  --t-body:     clamp(1rem, .93rem + .3vw, 1.1875rem);      /* body 16–19px */
  --t-button:   clamp(.8125rem, .78rem + .15vw, .9375rem);  /* buttons 13–15px */
  --t-label:    clamp(.6875rem, .66rem + .12vw, .8125rem);  /* labels 11–13px */
  --track: .12em;

  /* a touch more contrast for reading text */
  --ink-soft: rgba(19,17,9,.84);
  --ink-faint: rgba(19,17,9,.7);
  --bone-dim: rgba(238,231,218,.8);
}

/* ---- reading text ---- */
body{ font-family: var(--f-body); font-size: var(--t-body); line-height: 1.62; font-weight: 400;
      -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
p, li, dd, td, label, input, textarea, select{ font-family: var(--f-body); }
.body-copy, .mcard p, .exec .exec-copy, .status-main, .wings .meta p, .who-row p,
.roles p, .founding p, .impact p, .vision p, .lineage p{ font-size: var(--t-body); line-height: 1.62; }
strong, b{ font-weight: 600; }

/* ---- headlines: Cormorant, a little tighter, italics for emphasis only ---- */
h1, h2, h3, .entrance h1, .programs .model-h, .lineage .thesis, .exec .exec-title{
  font-family: var(--f-head); font-weight: 500; letter-spacing: -.025em; }
h1, .entrance h1{ font-size: var(--t-colossal); line-height: 1.02; letter-spacing: -.032em; font-weight: 500; }
h2{ font-size: var(--t-room); line-height: 1.06; }
.programs .model-h{ font-size: var(--t-room); }
h2 em, h1 em{ font-style: italic; font-weight: 500; letter-spacing: -.02em; }
.exec .exec-title{ letter-spacing: -.01em; }
blockquote p, .legacy blockquote p{ font-family: var(--f-head); letter-spacing: -.02em; line-height: 1.18; }

/* ---- labels, navigation, dates, status: IBM Plex Mono ---- */
.caps, .lintel .caps, .fcaps, .site-header nav a, .menu-btn, .mnav .mclose,
.wall-label .wl-credit, .wall-label .wl-acc, .placard, .who-row .n, .vision .defn dt,
.legacy blockquote footer, .video-cover .vc-label, .site-footer .lineage-note, .stay-form label .caps,
.status-sub .caps, .wings .acc, .intro .skip, .skip-link, .floorplan a{
  font-family: var(--f-mono); font-weight: 500; text-transform: uppercase;
  letter-spacing: var(--track); font-size: var(--t-label); }
.site-header nav a{ letter-spacing: .1em; }
.mnav a{ font-family: var(--f-mono); font-weight: 500; letter-spacing: .1em; text-transform: uppercase; font-size: clamp(.9rem, .85rem + .3vw, 1.05rem); }
/* the Institute's name beside the mark stays as drawn: Oswald, readable tracking */
.site-header .brand .caps, .site-header .brand span, .top .brand .caps, .top .brand span, .site-footer .brand .caps, .site-footer .brand span{ font-family: var(--f-cta); font-weight: 500; letter-spacing: .2em; }
/* the logo lockup under the mark keeps its own wide tracking, which its centring is built for */
.lockup span{ font-family: var(--f-cta); }

/* ---- buttons: Oswald, 44px minimum ---- */
.founding .cta, .btn, .stay-btn, .ascend-btn, .wings .meta a.door, .mcard a.door, .site-header nav a.cta, .site-header nav a.donate{
  font-family: var(--f-cta); font-weight: 500; letter-spacing: .1em; text-transform: uppercase;
  font-size: var(--t-button); min-height: 44px; }
.founding .cta-donate{ font-family: var(--f-cta); font-weight: 500; letter-spacing: .1em; font-size: var(--t-button);
  min-height: 44px; display: inline-flex; align-items: center; }
a.plate-btn, .visit a.fest-plate, .ascend-submit, .stay-plate{ min-height: 44px; }

/* ---- program cards ---- */
.mcard h3{ font-family: var(--f-head); font-weight: 600; letter-spacing: -.02em; line-height: 1.08; }
.mcard.major h3{ font-size: clamp(1.9rem, 1.4rem + 2vw, 3rem); }
.mcard.minor h3{ font-size: var(--t-program); }
.mcard{ gap: 1.15rem; }

/* ---- the founding disclosure, forms and notes: upright and readable ---- */
.founding .quiet, .stay-note, .credit-block p{
  font-family: var(--f-body); font-style: normal; font-size: clamp(.9375rem, .9rem + .15vw, 1rem);
  line-height: 1.65; color: var(--ink-soft); max-width: 40rem; }
.night .founding .quiet, .night .stay-note{ color: var(--bone-dim); }
.stay-form label .caps i, .fcaps i{ font-family: var(--f-body); font-style: normal; text-transform: none;
  letter-spacing: 0; font-weight: 400; opacity: .75; }
.stay-form input, input[type="text"], input[type="email"], input[type="tel"], textarea{
  font-family: var(--f-body); font-size: clamp(1rem, .95rem + .2vw, 1.125rem); }

/* ---- captions stay short and italic ---- */
.wall-label .wl-title{ font-family: var(--f-head); font-weight: 600; letter-spacing: -.01em; }
.wall-label .wl-medium, .lintel .folio, .continue a{ font-family: var(--f-head); font-style: italic; }

@media (max-width: 640px){
  h2{ line-height: 1.08; }
  .caps, .placard{ letter-spacing: .1em; }
}

/* ---- the other pages: their hints, notes and intros read upright too ---- */
.lede, .hint, .note, .small, .empty, .carpet figcaption{ font-family: var(--f-body); font-style: normal; line-height: 1.62; }
.lede{ font-size: var(--t-body); }
.hint, .small, .empty{ font-size: clamp(.9375rem, .9rem + .15vw, 1rem); color: var(--ink-soft); }
.note{ font-size: 1rem; }
.lede i, .lede em{ font-family: var(--f-head); font-style: italic; font-size: 1.08em; }
select, main input, main textarea{ font-family: var(--f-body); }
body > p, main > p{ font-family: var(--f-body); }

/* the Institute's name in the masthead, unbolded (Oct 29) */
.site-header .brand .caps, .site-header .brand span, .top .brand .caps, .top .brand span{ font-weight: 400; }

/* the Institute's name, lighter at the top (Oct 29, v3) */
.lockup span, .site-header .brand .caps, .site-header .brand span{ font-weight: 300; }

/* ---- one gold for every accent word, the logo's own (Oct 29) ----
   Text in gold on cream already reads --gold-deep; it now is the logo's gold.
   Gold words on the dark rooms take the same colour. Buttons, rules and glows keep their own gold. */
:root{ --gold-deep: #9e712c; }
h1 em, h2 em, h3 em, .thesis em, .legacy h2 em, .night h2 em, .night .wall-label .wl-acc,
.legacy .lintel .caps, .legacy blockquote p, .exec .exec-soon,
.lineage .year-block:last-child .yr{ color: #9e712c; }
