/* ============================================================
   Sagelion site — applies design-system tokens to the live
   marketing site. Studio register (warm paper, rounded cards,
   gold accent) — not museum mode.
   ============================================================ */

@import url("colors_and_type.css?v=202605311715");

* { box-sizing: border-box; }

html, body { margin: 0; padding: 0; }

body {
  background: linear-gradient(180deg, var(--bg) 0%, var(--bg-warm) 60%, var(--bg) 100%);
  color: var(--fg-1);
  min-height: 100vh;
}

img, video { max-width: 100%; display: block; }

::selection { background: var(--gold-soft); color: var(--ink); }

/* Accessibility — visible keyboard focus on every interactive element */
a:focus-visible,
button:focus-visible,
.button:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--gold-deep);
  outline-offset: 3px;
  border-radius: var(--r-xs);
}
:focus:not(:focus-visible) { outline: none; }

/* Respect users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .button:hover, .card:hover, .help-card:hover,
  .donation-tier:hover, .gallery-item:hover { transform: none; }
}

/* ---------- LAYOUT ---------- */
.container {
  width: min(1120px, calc(100% - 40px));
  margin: 0 auto;
}

main > section { padding: var(--section-y) 0; }
main > section.alt {
  background: rgba(255, 255, 255, 0.42);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
main > section.warm-band {
  background: linear-gradient(180deg, var(--bg-warm), var(--bg-warmer));
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

/* ---------- HEADER ---------- */
.site-header {
  position: sticky; top: 0; z-index: 20;
  background: var(--paper-veil);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
}
.site-header .nav {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 0;
  gap: 20px;
}
.brand {
  display: flex; align-items: center; gap: 12px;
  text-decoration: none;
}
.brand-mark {
  width: 40px; height: 40px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--ink);
  border: 1px solid var(--line);
  flex: none;
}
.brand-mark img { width: 100%; height: 100%; object-fit: cover; display: block; }
.brand-name {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 22px;
  line-height: 1;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ink);
  margin: 0;
}
.brand-tag {
  font-family: var(--font-sans);
  font-size: 10px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 500;
  margin-top: 4px;
}
.nav-links {
  display: flex; gap: 28px;
  font-family: var(--font-sans);
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 500;
}
.nav-links a {
  color: var(--muted);
  text-decoration: none;
  border-bottom: 0;
  transition: color var(--t-fast) var(--ease-out);
}
.nav-links a:hover { color: var(--ink); }

/* Persistent donate button in the nav — the cause's primary action */
.nav-links a.nav-donate {
  color: var(--ink);
  background: var(--gold);
  padding: 8px 16px;
  border-radius: var(--r-pill);
  letter-spacing: 0.12em;
  font-weight: 600;
  box-shadow: var(--shadow-card);
  transition: transform var(--t-fast) var(--ease-out),
              background var(--t-fast) var(--ease-out);
}
.nav-links a.nav-donate:hover {
  color: var(--ink);
  background: var(--gold-light);
  transform: translateY(-1px);
}

/* Skip link — visible only on keyboard focus */
.skip-link {
  position: absolute;
  left: 16px; top: -60px;
  z-index: 50;
  background: var(--ink);
  color: #fff;
  padding: 10px 18px;
  border-radius: var(--r-pill);
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  box-shadow: var(--shadow-btn);
  transition: top var(--t-fast) var(--ease-out);
}
.skip-link:focus { top: 12px; color: #fff; }

/* ---------- BUTTONS ---------- */
.button {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 8px;
  min-width: 158px;
  padding: 14px 22px;
  border-radius: var(--r-pill);
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: 14px;
  letter-spacing: 0.02em;
  border: 0;
  cursor: pointer;
  text-decoration: none;
  transition: all var(--t-base) ease;
}
.button.primary {
  background: var(--ink); color: #fff;
  box-shadow: var(--shadow-btn);
}
.button.primary:hover {
  background: var(--ink-strong);
  transform: translateY(-2px);
  box-shadow: var(--shadow-btn-hv);
}
.button.secondary {
  background: rgba(255, 255, 255, 0.65);
  color: var(--ink);
  border: 1px solid var(--line);
}
.button.secondary:hover {
  background: #fff;
  border-color: var(--gold-line);
  transform: translateY(-2px);
}

/* About — closing coda line */
.about-coda {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 600;
  font-size: 22px;
  line-height: 1.2;
  letter-spacing: -0.015em;
  color: var(--ink) !important;
  margin: 22px 0 0 !important;
  padding-top: 16px;
  border-top: 1px solid var(--gold-line);
  max-width: 32ch;
}

/* ---------- ATOMS ---------- */
.eyebrow, .section-label {
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin: 0 0 12px;
}
.lead {
  font-family: var(--font-sans);
  font-size: 18px;
  line-height: 1.55;
  color: var(--ink-subtle);
  max-width: 56ch;
  margin: 0 0 24px;
}

/* ---------- HERO ---------- */
.hero { padding: 64px 0 56px; }
.hero-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 48px;
  align-items: center;
}
.hero h1 {
  font-size: clamp(44px, 6vw, 70px);
  line-height: 0.96;
  max-width: 13ch;
  margin: 0 0 20px;
}
.cta-row { display: flex; gap: 12px; margin-top: 28px; flex-wrap: wrap; }

.premium-hero {
  padding: 12px;
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: var(--r-3xl);
  box-shadow: var(--shadow-float);
}
.premium-hero > .hero-video,
.premium-hero > video {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: var(--r-xl);
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.05);
}

/* ---------- MISSION ---------- */
.mission { display: grid; gap: 40px; }
.mission-statement { max-width: 60ch; }
.mission-statement h2 {
  font-size: clamp(28px, 3.4vw, 42px);
  line-height: 1.04;
  max-width: 20ch;
  margin: 4px 0 18px;
}
.mission-statement .lead { margin: 0; max-width: 62ch; }

.mission-pledges {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top: 1px solid var(--ink);
}
.mission-pledges li {
  padding: 22px 28px 6px 0;
  border-right: 1px solid var(--line);
  color: var(--muted);
}
.mission-pledges li:not(:first-child) { padding-left: 28px; }
.mission-pledges li:last-child { border-right: 0; padding-right: 0; }
.mission-pledges .pledge-h {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 21px;
  line-height: 1.15;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 8px;
  display: flex; align-items: baseline; gap: 10px;
}
.mission-pledges .pledge-h::before {
  content: "";
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--gold);
  flex: none;
  transform: translateY(-3px);
}
.mission-pledges li p:last-child {
  font-size: 14.5px;
  line-height: 1.55;
  margin: 0;
}

.mission-serves {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 12px 16px;
  padding-top: 28px;
  border-top: 1px solid var(--line);
}
.mission-serves .serves-label {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 700;
  margin: 0;
  flex: none;
}
.serves-list {
  list-style: none;
  padding: 0; margin: 0;
  display: flex; flex-wrap: wrap; gap: 10px;
}
.serves-list li {
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.01em;
  color: var(--ink-subtle);
  background: rgba(255,255,255,0.7);
  border: 1px solid var(--gold-line);
  padding: 7px 14px;
  border-radius: var(--r-pill);
  line-height: 1.2;
}

/* ---------- TWO-COL ---------- */
.two-col {
  display: grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap: 48px;
  align-items: start;
}
.two-col h2 { margin: 6px 0 0; max-width: 14ch; }
.two-col p { color: var(--muted); }
.two-col strong { color: var(--ink); font-weight: 600; }

.founder-links {
  margin-top: 20px;
  display: flex; gap: 14px; align-items: center;
  font-family: var(--font-sans);
  font-size: 13px;
  color: var(--muted);
  letter-spacing: 0.02em;
}
.founder-links .label {
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--ink-subtle);
}
.founder-links a { display: inline-flex; line-height: 0; }
.founder-links a img {
  width: 22px; height: 22px;
  transition: transform 200ms ease, filter 200ms ease;
}
.founder-links a:hover img { transform: translateY(-2px); filter: brightness(0.8); }

.founder-links a.icon-link-svg {
  color: var(--gold);
  line-height: 0;
  transition: transform 200ms ease, color 200ms ease;
}
.founder-links a.icon-link-svg svg { display: block; }
.founder-links a.icon-link-svg:hover { transform: translateY(-2px); color: var(--gold-deep); }

/* ---------- PILLAR CARDS ---------- */
.cards.three-up {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px;
  margin-top: 32px;
  align-items: start;
}
.cards.two-up {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px;
  margin-top: 32px;
}
.card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: 24px;
  box-shadow: var(--shadow-card);
  transition: transform var(--t-slow) var(--ease-out),
              box-shadow var(--t-slow) var(--ease-out),
              border-color var(--t-slow) var(--ease-out);
  display: flex; flex-direction: column;
}
.card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-hover);
  border-color: var(--gold-line);
}
.card .icon {
  font-size: 22px;
  color: var(--gold);
  line-height: 1;
  margin-bottom: 14px;
}
.card h3 {
  font-family: var(--font-serif);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 0 0 10px;
}
.card p {
  color: var(--muted);
  font-size: 15px;
  line-height: 1.65;
  margin: 0;
}
.card .mini-art {
  width: 100%;
  height: auto;
  border-radius: var(--r-md);
  margin: 12px 0;
  border: 1px solid var(--line);
}

/* ---------- GALLERY ---------- */
.gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 22px;
  margin-top: 32px;
}
.gallery-item {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  overflow: hidden;
  box-shadow: var(--shadow-card);
  display: flex; flex-direction: column;
  transition: transform var(--t-slow) var(--ease-out),
              box-shadow var(--t-slow) var(--ease-out),
              border-color var(--t-slow) var(--ease-out);
  margin: 0;
}
.gallery-item:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-hover);
  border-color: var(--gold-line);
}
.gallery-item img {
  width: 100%; aspect-ratio: 1 / 1;
  object-fit: cover;
}
.gallery-item.large { grid-column: span 2; }
.gallery-item.large img { aspect-ratio: 2.1 / 1; }
.gallery-item figcaption {
  padding: 14px 16px;
  font-family: var(--font-sans-text);
  font-size: 13px;
  color: var(--muted);
  border-top: 1px solid var(--line);
  line-height: 1.45;
}
.gallery-item.premium {
  padding: 12px;
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-radius: var(--r-3xl);
  box-shadow: var(--shadow-float);
}
.gallery-item.premium img { border-radius: var(--r-md); aspect-ratio: 4 / 5; }
.gallery-item.premium figcaption {
  border: 0;
  padding: 14px 4px 4px;
  font-family: var(--font-serif);
  font-size: 17px;
  font-weight: 600;
  color: var(--ink);
  font-style: italic;
  letter-spacing: -0.01em;
}

/* ---------- CATALOGUE (museum register) ---------- */
.catalogue-head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 24px; flex-wrap: wrap;
  margin-bottom: 36px;
}
.catalogue-head h2 { margin: 4px 0 0; }
.catalogue-meta {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 600;
  margin: 0;
}

.catalogue {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 36px 26px;
}
.work { margin: 0; }
.work.feature { grid-column: span 2; }
.work-image {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  background: var(--paper);
  display: block;
  border: 1px solid var(--line);
  transition: opacity var(--t-base) var(--ease-out),
              border-color var(--t-base) var(--ease-out);
}
.work.feature .work-image {
  aspect-ratio: 2 / 1;
  object-fit: contain;
  background: var(--paper);
}
.work:hover .work-image { border-color: var(--gold-line); opacity: 0.94; }

.wall-label {
  display: grid;
  gap: 6px;
  padding: 14px 0 0;
  border-top: 1px solid var(--ink);
  margin-top: 14px;
}
.wall-label .catalog-no {
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin: 0;
}
.wall-label .title {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 600;
  font-size: 20px;
  letter-spacing: -0.015em;
  color: var(--ink);
  line-height: 1.15;
  margin: 0;
  display: flex; align-items: baseline; gap: 10px;
  flex-wrap: wrap;
}
.wall-label .medium {
  font-family: var(--font-sans-text);
  font-size: 12.5px;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin: 0;
  line-height: 1.3;
}
.tbd-tag {
  display: inline-block;
  font-family: var(--font-sans);
  font-size: 9px;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-deep);
  background: var(--gold-soft);
  padding: 3px 9px;
  border-radius: var(--r-pill);
  vertical-align: middle;
  transform: translateY(-2px);
}
.status-tag {
  display: inline-block;
  font-family: var(--font-sans);
  font-size: 9px;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ink);
  background: transparent;
  border: 1px solid var(--ink);
  padding: 3px 9px;
  border-radius: var(--r-pill);
  vertical-align: middle;
  transform: translateY(-2px);
}

@media (max-width: 900px) {
  .catalogue { grid-template-columns: 1fr 1fr; gap: 28px 18px; }
  .work.feature { grid-column: span 2; }
  .work.feature .work-image { aspect-ratio: 16 / 9; }
}
@media (max-width: 560px) {
  .catalogue { grid-template-columns: 1fr; }
  .work.feature, .work { grid-column: span 1; }
  .work.feature .work-image { aspect-ratio: 1 / 1; }
}

/* ---------- WORKFLOWS BAND ---------- */
.workflows-band {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 48px;
  align-items: center;
  padding: 32px 36px;
  background:
    linear-gradient(135deg, var(--gold-soft), rgba(255,255,255,0.7));
  border: 1px solid var(--gold-line);
  border-radius: var(--r-2xl);
  box-shadow: var(--shadow-card);
}
.workflows-band h3 {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: clamp(24px, 2.4vw, 32px);
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 4px 0 12px;
  max-width: 22ch;
}
.workflows-band p { color: var(--ink-subtle); margin: 0; max-width: 56ch; }
.workflows-cta {
  display: flex; flex-direction: column;
  gap: 10px;
  align-items: flex-start;
}
.workflows-cta .button { min-width: 0; padding: 14px 26px; }
.workflows-note {
  font-family: var(--font-sans);
  font-size: 11px !important;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-deep) !important;
  font-weight: 700;
  margin: 0;
}

@media (max-width: 900px) {
  .workflows-band {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 28px 24px;
  }
}

/* ---------- EXHIBITION (museum hero) ---------- */
.exhibition { display: grid; gap: 56px; }

.exhibition-hero {
  display: grid;
  grid-template-columns: 0.95fr 1.05fr;
  gap: 56px;
  align-items: center;
}
.exhibition-plate {
  margin: 0;
  padding: 22px;
  background: var(--paper);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-card);
}
.exhibition-plate img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  display: block;
  border: 1px solid var(--ink);
}

/* Designed exhibition poster (replaces single image) */
.exhibition-plate.poster {
  padding: 28px 26px 24px;
  background: linear-gradient(180deg, var(--bg) 0%, var(--bg-warm) 100%);
  border: 1px solid var(--ink);
  box-shadow: var(--shadow-float);
  display: grid;
  gap: 18px;
  position: relative;
}
.exhibition-plate.poster::before,
.exhibition-plate.poster::after {
  content: "";
  position: absolute;
  left: 12px; right: 12px;
  height: 1px;
  background: var(--ink);
  opacity: 0.5;
}
.exhibition-plate.poster::before { top: 18px; }
.exhibition-plate.poster::after  { bottom: 18px; }

.poster-top {
  display: flex; align-items: center; justify-content: space-between;
  gap: 14px;
  padding-top: 8px;
}
.poster-mark {
  width: 28px; height: 28px;
  border-radius: 50%; overflow: hidden;
  background: var(--ink);
  flex: none;
  border: 1px solid var(--line);
}
.poster-mark img { width: 100%; height: 100%; object-fit: cover; display: block; aspect-ratio: 1 / 1; border: 0; }
.poster-meta {
  font-family: var(--font-sans);
  font-size: 10.5px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink);
  font-weight: 600;
}

/* Artwork wrapper — holds image, corner ticks, gold seal, and overlaid title */
.poster-artwork {
  position: relative;
  margin: 0;
  line-height: 0;
}
.poster-artwork img {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  display: block;
  border: 1px solid var(--ink);
  filter: saturate(0.96) contrast(1.03);
}
/* Dark vignette across bottom half for title legibility */
.poster-artwork::after {
  content: "";
  position: absolute;
  inset: 1px;
  background: linear-gradient(180deg,
    transparent 35%,
    rgba(20, 15, 10, 0.30) 55%,
    rgba(20, 15, 10, 0.78) 100%);
  pointer-events: none;
  z-index: 1;
}

/* Overlaid title */
.poster-title {
  position: absolute;
  left: 20px; right: 20px; bottom: 22px;
  z-index: 2;
  font-family: var(--font-serif);
  font-weight: 700;
  letter-spacing: -0.035em;
  line-height: 0.88;
  color: #fdfcf9;
  font-size: clamp(40px, 5.4vw, 62px);
  display: grid;
  margin: 0;
  text-shadow: 0 1px 2px rgba(0,0,0,0.25);
}
.poster-title .line { display: block; }
.poster-title .line em {
  font-style: italic;
  font-weight: 500;
  color: var(--gold-light);
  font-size: 0.78em;
  letter-spacing: -0.025em;
  padding-left: 8px;
}

/* Corner registration ticks */
.reg {
  position: absolute;
  width: 14px; height: 14px;
  z-index: 3;
  pointer-events: none;
}
.reg::before, .reg::after {
  content: "";
  position: absolute;
  background: #fdfcf9;
  opacity: 0.85;
}
.reg::before { width: 100%; height: 1px; }
.reg::after  { width: 1px;  height: 100%; }
.reg.tl { top: 10px; left: 10px; }
.reg.tl::before, .reg.tl::after { top: 0; left: 0; }
.reg.tr { top: 10px; right: 10px; }
.reg.tr::before, .reg.tr::after { top: 0; right: 0; }
.reg.bl { bottom: 10px; left: 10px; }
.reg.bl::before, .reg.bl::after { bottom: 0; left: 0; }
.reg.br { bottom: 10px; right: 10px; }
.reg.br::before, .reg.br::after { bottom: 0; right: 0; }

/* Gold wax seal */
.poster-seal {
  position: absolute;
  top: 18px; right: 18px;
  z-index: 3;
  width: 78px; height: 78px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 30% 30%, var(--gold-light), var(--gold) 60%, var(--gold-deep) 100%);
  color: var(--ink);
  display: grid;
  place-items: center;
  text-align: center;
  box-shadow:
    0 6px 14px rgba(30,25,20,0.30),
    inset 0 1px 0 rgba(255,255,255,0.4),
    inset 0 -2px 4px rgba(30,25,20,0.20);
  transform: rotate(-8deg);
  line-height: 1.05;
  padding: 2px;
}
.poster-seal::before {
  content: "";
  position: absolute;
  inset: 5px;
  border-radius: 50%;
  border: 1px solid rgba(26,23,20,0.45);
  pointer-events: none;
}
.poster-seal .seal-arc {
  display: block;
  font-family: var(--font-sans);
  font-size: 7.5px;
  letter-spacing: 0.20em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--ink);
}
.poster-seal .seal-mark {
  display: block;
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 700;
  font-size: 26px;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 1px 0;
}

.poster-foot {
  display: flex; justify-content: space-between; gap: 14px;
  padding-bottom: 6px;
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-deep);
  font-weight: 700;
}

@media (max-width: 900px) {
  .exhibition-plate.poster { padding: 22px 18px 18px; }
  .poster-title { font-size: clamp(36px, 9.5vw, 56px); }
  .poster-seal { width: 64px; height: 64px; }
  .poster-seal .seal-mark { font-size: 22px; }
}

.exhibition-body { display: grid; gap: 14px; }
.exhibition-title {
  font-size: clamp(36px, 4.4vw, 56px);
  margin: 6px 0 0;
  line-height: 0.98;
  display: inline-flex; align-items: baseline; gap: 14px;
  flex-wrap: wrap;
  max-width: 14ch;
}
.exhibition-title .tbd-tag { transform: translateY(-6px); }
.exhibition-kicker {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 700;
  margin: 6px 0 0;
}
.exhibition-body .lead { margin: 10px 0 0; }

/* Three numbered pillars */
.exhibition-pillars {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top: 1px solid var(--ink);
  padding-top: 20px;
}
.exhibition-pillars > div {
  padding: 4px 24px 0 0;
  border-right: 1px solid var(--line);
}
.exhibition-pillars > div:not(:first-child) { padding-left: 24px; }
.exhibition-pillars > div:last-child { border-right: 0; padding-right: 0; }
.pillar-no {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 600;
  font-size: 26px;
  line-height: 1;
  color: var(--gold);
  margin: 0 0 10px;
  letter-spacing: -0.01em;
}
.pillar-h {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 20px;
  line-height: 1.15;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 8px;
}
.exhibition-pillars > div p:last-child {
  font-size: 14px;
  color: var(--muted);
  line-height: 1.5;
  margin: 0;
}

/* Meta strip — reuses workshop-meta visual language */
.exhibition-meta {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin: 0;
  padding: 22px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.exhibition-meta > div { padding: 0 24px; border-left: 1px solid var(--line); }
.exhibition-meta > div:first-child { border-left: 0; padding-left: 0; }
.exhibition-meta dt {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 600;
  margin: 0 0 8px;
}
.exhibition-meta dd {
  margin: 0;
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 19px;
  line-height: 1.15;
  letter-spacing: -0.015em;
  color: var(--ink);
}

/* Preview grid */
.exhibition-previews .section-label { margin-bottom: 22px; }
.preview-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
}

@media (max-width: 900px) {
  .exhibition { gap: 40px; }
  .exhibition-hero { grid-template-columns: 1fr; gap: 28px; }
  .exhibition-title { font-size: clamp(30px, 6vw, 40px); max-width: none; }
  .exhibition-pillars { grid-template-columns: 1fr; gap: 0; }
  .exhibition-pillars > div {
    padding: 16px 0;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .exhibition-pillars > div:not(:first-child) { padding-left: 0; }
  .exhibition-pillars > div:last-child { border-bottom: 0; }
  .exhibition-meta { grid-template-columns: 1fr 1fr; gap: 18px 0; }
  .exhibition-meta > div { border-left: 0; padding: 0; }
  .exhibition-meta > div:nth-child(odd) { border-right: 1px solid var(--line); padding-right: 18px; }
  .exhibition-meta > div:nth-child(even) { padding-left: 18px; }
  .preview-grid { grid-template-columns: 1fr; gap: 28px; }
}

/* ---------- EVENT (workshop + exhibition) ---------- */
.event-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: start;
}
.event-grid h2 {
  font-size: clamp(28px, 3vw, 36px);
  margin: 6px 0 18px;
  line-height: 1.08;
  max-width: 22ch;
}
.event-grid p { color: var(--muted); }
.event-grid p + p { margin-top: 14px; }
.event-visual {
  margin: 20px 0 24px;
}
.event-visual img {
  width: 100%;
  border-radius: var(--r-xl);
  background: var(--paper);
  border: 1px solid var(--line);
  padding: 14px;
  box-shadow: var(--shadow-card);
}

.bullet-list { padding-left: 0; list-style: none; margin: 18px 0 0; }
.bullet-list li {
  position: relative;
  padding: 10px 0 10px 28px;
  border-top: 1px solid var(--line);
  color: var(--ink-subtle);
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 1.4;
}
.bullet-list li:last-child { border-bottom: 1px solid var(--line); }
.bullet-list li::before {
  content: "✦";
  position: absolute;
  left: 4px; top: 10px;
  color: var(--gold);
  font-size: 12px;
}

/* ---------- WORKSHOP (dedicated section) ---------- */
.workshop { display: grid; gap: 36px; }

.workshop-head { max-width: none; }
.workshop-head h2 { margin: 4px 0 18px; font-size: clamp(36px, 4.4vw, 56px); }
.workshop-free {
  display: inline-block;
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink);
  background: var(--gold);
  padding: 7px 16px 6px;
  border-radius: var(--r-pill);
  margin: 10px 0 14px;
  box-shadow: var(--shadow-card);
}
.workshop-hook {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(20px, 1.9vw, 26px);
  line-height: 1.2;
  letter-spacing: -0.015em;
  color: var(--gold-deep);
  margin: 0 0 10px;
  white-space: nowrap;
}
.workshop-why {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(16px, 1.35vw, 19px);
  line-height: 1.4;
  color: var(--ink-subtle);
  margin: 0 0 16px;
  max-width: 56ch;
}
.workshop-lede {
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 1.5;
  color: var(--ink-subtle);
  max-width: none;
  margin: 0;
  text-wrap: balance;
}

/* Meta strip — date / time / venue / audience / cost */
.workshop-meta {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin: 0;
  padding: 22px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.workshop-meta > div:last-child dd { color: var(--gold-deep); }
.workshop-meta > div { padding: 0 24px; border-left: 1px solid var(--line); }
.workshop-meta > div:first-child { border-left: 0; padding-left: 0; }
.workshop-meta dt {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 600;
  margin: 0 0 8px;
}
.workshop-meta dd {
  margin: 0;
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 19px;
  line-height: 1.15;
  letter-spacing: -0.015em;
  color: var(--ink);
}

.workshop-visual { margin: 0; }
.workshop-visual img {
  width: 100%;
  aspect-ratio: 20/ 11;
  object-fit: cover;
  border-radius: var(--r-xl);
  background: var(--paper);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-card);
}

/* Two-column chapter grid */
.workshop-chapters {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 56px;
  border-top: 1px solid var(--line);
}
.workshop-chapter {
  padding: 22px 0 18px;
  border-bottom: 1px solid var(--line);
}
.workshop-chapter:last-child { border-bottom: 1px solid var(--line); }
.workshop-chapter .chapter-label {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 22px;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 0 0 12px;
  display: flex; align-items: baseline; gap: 12px;
}
.workshop-chapter .chapter-label::before {
  content: "";
  display: inline-block;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--gold);
  transform: translateY(-4px);
  flex: none;
}
.workshop-chapter p {
  color: var(--muted);
  margin: 0 0 6px;
  font-size: 15.5px;
  line-height: 1.6;
}
.workshop-chapter .bullet-list {
  margin: 6px 0 0;
}
.workshop-chapter .bullet-list li {
  font-size: 15px;
  border-top: 1px solid var(--hairline);
  padding: 9px 0 9px 24px;
}
.workshop-chapter .bullet-list li:last-child { border-bottom: 0; }
.workshop-chapter em {
  font-style: italic;
  color: var(--ink);
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 1.06em;
  letter-spacing: -0.01em;
}

/* The path — gold ribbon, full-width */
.workshop-path {
  background: linear-gradient(135deg, var(--gold-soft), rgba(255,255,255,0.6));
  border: 1px solid var(--gold-line);
  border-radius: var(--r-xl);
  padding: 22px 28px;
}
.workshop-path .chapter-label {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--gold-deep);
  margin: 0 0 10px;
}
.path-steps {
  font-family: var(--font-serif);
  font-size: clamp(22px, 2.4vw, 30px);
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  display: flex; flex-wrap: wrap; align-items: baseline;
  gap: 14px;
  margin: 0;
}
.path-steps span {
  color: var(--gold);
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: 0.7em;
  transform: translateY(-2px);
}

.workshop-cta {
  display: flex; gap: 12px; flex-wrap: wrap;
}
.workshop-cta-note {
  font-family: var(--font-sans-text, var(--font-sans));
  font-size: 13px;
  line-height: 1.4;
  color: var(--muted);
  margin: 12px 0 0;
}

/* Upcoming sessions schedule */
.workshop-sessions { margin: 0; }
.sessions-label {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 700;
  margin: 0 0 14px;
}
.session-list {
  list-style: none;
  padding: 0; margin: 0;
  border-top: 1px solid var(--line);
}
.session {
  display: grid;
  grid-template-columns: 1.1fr 1fr auto;
  align-items: center;
  gap: 20px;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}
.session.is-next { background: linear-gradient(90deg, var(--gold-soft), transparent 60%); }
.session.is-more { opacity: 0.92; }
.session-when { display: flex; align-items: center; gap: 16px; }
.session-no {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 700;
  font-size: 26px;
  line-height: 1;
  color: var(--gold);
  min-width: 28px;
}
.session-date {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 19px;
  line-height: 1.15;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0;
}
.session-time {
  font-family: var(--font-sans-text);
  font-size: 13px;
  color: var(--muted);
  margin: 2px 0 0;
}
.session-venue {
  font-family: var(--font-sans);
  font-size: 13px;
  color: var(--ink-subtle);
  margin: 0;
}
.session-status {
  justify-self: end;
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 6px 14px;
  border-radius: var(--r-pill);
  white-space: nowrap;
}
.status-open { color: var(--ink); background: var(--gold); }
.status-planning { color: var(--gold-deep); background: var(--gold-soft); border: 1px solid var(--gold-line); }
.status-link {
  color: var(--gold-deep);
  background: transparent;
  border: 1px solid var(--gold-line);
  transition: background var(--t-fast) var(--ease-out);
}
.status-link:hover { background: var(--gold-soft); color: var(--gold-deep); }

/* Featured themed workshop card */
.workshop-feature {
  background: var(--paper);
  border: 1px solid var(--gold-line);
  border-radius: var(--r-2xl);
  box-shadow: var(--shadow-float);
  overflow: hidden;
}
.feature-banner {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; flex-wrap: wrap;
  padding: 14px 28px;
  background: linear-gradient(135deg, var(--gold-soft), rgba(255,255,255,0.6));
  border-bottom: 1px solid var(--gold-line);
}
.feature-flag {
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gold-deep);
}
.feature-free {
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink);
  background: var(--gold);
  padding: 6px 14px;
  border-radius: var(--r-pill);
}
.workshop-feature .feature-image {
  width: 100%;
  aspect-ratio: 21 / 9;
  object-fit: cover;
  display: block;
  border-bottom: 1px solid var(--gold-line);
}
.feature-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 36px;
  padding: 32px;
}
.feature-main h3 {
  font-family: var(--font-serif);
  font-size: clamp(24px, 2.6vw, 32px);
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 0 0 8px;
}
.feature-sub {
  font-family: var(--font-sans);
  font-size: 15px;
  color: var(--ink-subtle);
  margin: 0 0 14px;
}
.feature-lede {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 600;
  font-size: 20px;
  line-height: 1.25;
  color: var(--gold-deep);
  margin: 0 0 20px;
  padding: 14px 0;
  border-top: 1px solid var(--gold-line);
  border-bottom: 1px solid var(--gold-line);
}
.feature-h {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 700;
  margin: 0;
}
.feature-main .bullet-list { margin: 8px 0 24px; }
.feature-cta {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
}
.feature-cta-note {
  font-family: var(--font-sans-text);
  font-size: 13px;
  color: var(--muted);
}
.feature-side {
  background: var(--bg-warm);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: 24px;
  align-self: start;
}
.feature-meta { margin: 0; display: grid; gap: 0; }
.feature-meta > div {
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}
.feature-meta > div:first-child { padding-top: 0; }
.feature-meta > div:last-child { border-bottom: 0; padding-bottom: 0; }
.feature-meta dt {
  font-family: var(--font-sans);
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 700;
  margin: 0 0 4px;
}
.feature-meta dd {
  margin: 0;
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 18px;
  line-height: 1.1;
  letter-spacing: -0.015em;
  color: var(--ink);
}
.feature-meta dd span {
  display: inline-block;
  font-family: var(--font-sans);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gold-deep);
  background: var(--gold-soft);
  padding: 2px 8px;
  border-radius: var(--r-pill);
  margin-left: 6px;
  vertical-align: middle;
}

/* Single-column event grid (exhibition only) */
.event-grid.single { grid-template-columns: 1fr; gap: 0; }
.event-grid.single h2 { max-width: 24ch; }

.event-mini-gallery { margin: 24px 0 0; }
.event-mini-gallery .gallery-label {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 600;
  margin: 0 0 12px;
}
.mini-gallery-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.mini-gallery-grid figure {
  margin: 0;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: 10px;
  text-align: center;
  box-shadow: var(--shadow-card);
}
.mini-gallery-grid img {
  width: 100%; aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 8px;
}
.mini-gallery-grid figcaption {
  margin-top: 10px;
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 500;
}

/* ---------- JOURNAL CARDS ---------- */
.article-card { padding: 0; overflow: hidden; }
.article-card .article-image {
  width: 100%; aspect-ratio: 16 / 9;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  background: var(--gold-soft);
}
/* Movie poster — show the full frame, never crop */
.article-card video.article-image {
  width: 100%;
  height: auto;
  aspect-ratio: auto;
  object-fit: contain;
  background: var(--ink);
}
/* Feature card — full-width project highlight above the journal grid */
.article-card--feature {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  margin: 28px 0 36px;
  align-items: stretch;
  overflow: hidden;
}
.article-card--feature .feature-image {
  width: 100%;
  height: 100%;
  min-height: 480px;
  object-fit: contain;
  background: var(--bg-warm);
  padding: 32px;
  border-right: 1px solid var(--line);
  display: block;
}
/* Photo variant — fill the frame instead of letterboxing artwork */
.article-card--photo .feature-image {
  object-fit: cover;
  padding: 0;
  background: var(--ink);
}
.article-card--feature .article-body {
  padding: 44px 48px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 14px;
}
.article-card--feature .meta { margin: 0; }
.article-card--feature h3 {
  font-size: clamp(28px, 2.6vw, 38px);
  line-height: 1.12;
  margin: 0;
}
.article-card--feature p { max-width: 52ch; }
.article-card .article-body { padding: 22px 24px 24px; }
.article-card .meta {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 600;
  margin: 0 0 10px;
}
.article-card h3 {
  font-family: var(--font-serif);
  font-size: 22px;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -0.02em;
  margin: 0 0 10px;
}
.article-card h3 a {
  color: var(--ink);
  border-bottom: 0;
  font-weight: 600;
  transition: color var(--t-fast) var(--ease-out);
}
.article-card h3 a:hover { color: var(--gold-deep); }
.article-card p {
  color: var(--muted);
  font-size: 15px;
  line-height: 1.65;
  margin: 0;
}
.article-card.text-only {
  background: linear-gradient(180deg, var(--gold-soft) 0%, var(--paper) 100%);
}
.article-card.text-only .article-body { padding-top: 60px; }

/* Movie-studio card — TikTok feed clip as the card media */
.article-card--clip .clip-media {
  display: flex;
  justify-content: center;
  padding: 16px;
  background: var(--ink);
  border-bottom: 1px solid var(--line);
}
.article-card--clip .clip-media .tiktok-embed {
  width: 100% !important;
  max-width: 325px;
  margin: 0 auto !important;
}

/* ---------- ADVISOR ---------- */
.advisor-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-2xl);
  padding: 36px;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 36px;
  align-items: center;
  box-shadow: var(--shadow-card);
}
.advisor-head {
  display: flex; align-items: center; gap: 16px;
  margin-bottom: 16px;
}
.advisor-avatar {
  width: 56px; height: 56px;
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid var(--line);
  flex: none;
}
.advisor-head .eyebrow { margin: 0; line-height: 1.2; }
.advisor-head h2 {
  margin: 0; line-height: 1.2;
  font-size: 32px;
}
.advisor-card p { color: var(--muted); margin: 0; }

.pull-quote {
  padding: 28px 28px;
  border-radius: var(--r-lg);
  background: linear-gradient(135deg, rgba(195,152,85,0.12), rgba(255,255,255,0.7));
  border: 1px solid rgba(195,152,85,0.24);
}
.pull-quote p {
  margin: 0;
  font-family: var(--font-serif);
  font-size: 28px;
  line-height: 1.1;
  font-weight: 600;
  color: var(--ink);
  letter-spacing: -0.02em;
}

/* ---------- WHY (premium band) ---------- */
.premium-grid {
  display: grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap: 48px;
  align-items: start;
}
.premium-grid h2 { max-width: 16ch; margin: 6px 0 0; }
.premium-grid p { color: var(--muted); }
.premium-grid p + p { margin-top: 14px; }

/* ---------- DONATION (placeholder) ---------- */
.donation { display: grid; gap: 36px; }
.donation-head { max-width: 720px; }
.donation-head h2 { margin: 4px 0 16px; max-width: 18ch; }
.donation-head .lead { margin: 0; }

.donation-tiers {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.donation-tier {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: 28px;
  display: flex; flex-direction: column;
  gap: 10px;
  box-shadow: var(--shadow-card);
  transition: transform var(--t-slow) var(--ease-out),
              box-shadow var(--t-slow) var(--ease-out),
              border-color var(--t-slow) var(--ease-out);
}
.donation-tier:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-hover);
  border-color: var(--gold-line);
}
.donation-tier.featured {
  background: linear-gradient(180deg, var(--gold-soft), var(--paper));
  border-color: var(--gold-line);
  box-shadow: var(--shadow-float);
}
.donation-tier .tier-eyebrow {
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin: 0;
}
.donation-tier .tier-amount {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 44px;
  line-height: 1;
  letter-spacing: -0.025em;
  color: var(--ink);
  margin: 0 0 6px;
  display: flex; align-items: baseline; gap: 6px;
}
.donation-tier .tier-amount span {
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--muted);
  text-transform: uppercase;
}
.donation-tier .tier-body {
  color: var(--muted);
  font-size: 15px;
  line-height: 1.55;
  margin: 0 0 14px;
  flex: 1;
}
.donation-tier .button { width: 100%; min-width: 0; }

.donation-note {
  display: flex; align-items: center; gap: 12px;
  margin: 0;
  padding: 14px 18px;
  border: 1px dashed var(--line-strong);
  border-radius: var(--r-md);
  font-family: var(--font-sans-text);
  font-size: 13px;
  color: var(--muted);
  background: rgba(255,255,255,0.5);
}
.donation-note .note-tag {
  font-family: var(--font-sans);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-deep);
  background: var(--gold-soft);
  padding: 4px 10px;
  border-radius: var(--r-pill);
  flex: none;
}

/* Transparency — where every dollar goes */
.donation-allocation {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: 24px 28px;
  box-shadow: var(--shadow-card);
}
.alloc-label {
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 700;
  margin: 0 0 14px;
}
.alloc-bar {
  display: flex;
  height: 16px;
  border-radius: var(--r-pill);
  overflow: hidden;
  background: var(--gold-soft);
}
.alloc-seg { display: block; height: 100%; }
.seg-seats { background: var(--gold-deep); }
.seg-materials { background: var(--gold); }
.seg-venue { background: var(--gold-light); }
.alloc-legend {
  list-style: none;
  padding: 0;
  margin: 16px 0 0;
  display: flex; flex-wrap: wrap; gap: 10px 28px;
}
.alloc-legend li {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-subtle);
}
.alloc-legend .dot {
  width: 11px; height: 11px;
  border-radius: 50%;
  flex: none;
}
.dot-seats { background: var(--gold-deep); }
.dot-materials { background: var(--gold); }
.dot-venue { background: var(--gold-light); }

/* More ways to help */
.help-more { margin-top: 8px; }
.help-more-label {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: clamp(20px, 2vw, 26px);
  line-height: 1.2;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 20px;
  max-width: 32ch;
}
.help-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.help-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: 24px;
  box-shadow: var(--shadow-card);
  display: flex; flex-direction: column;
  transition: transform var(--t-slow) var(--ease-out),
              box-shadow var(--t-slow) var(--ease-out),
              border-color var(--t-slow) var(--ease-out);
}
.help-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-hover);
  border-color: var(--gold-line);
}
.help-card h3 {
  font-family: var(--font-serif);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 0 0 10px;
}
.help-card p {
  color: var(--muted);
  font-size: 14.5px;
  line-height: 1.6;
  margin: 0 0 16px;
  flex: 1;
}
.help-link {
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--gold-deep);
  border-bottom: 0;
}
.help-link:hover { color: var(--gold); }

/* ---------- CONTACT ---------- */
.contact-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-2xl);
  padding: 40px;
  display: grid;
  grid-template-columns: 1.4fr 0.8fr;
  gap: 36px;
  align-items: center;
  box-shadow: var(--shadow-card);
}
.contact-card h2 { font-size: clamp(28px, 3vw, 36px); margin: 6px 0 16px; max-width: 20ch; }
.contact-card p { color: var(--muted); margin: 0; }
.contact-actions { display: flex; flex-direction: column; gap: 12px; }
.contact-actions .button { width: 100%; }

/* ---------- FOOTER ---------- */
.site-footer {
  padding: 36px 0 48px;
  border-top: 1px solid var(--line);
  background: var(--bg);
}
.footer-inner {
  display: flex; justify-content: space-between;
  gap: 24px;
  align-items: end;
}
.footer-inner .signoff,
.footer-inner .entity-note {
  font-family: var(--font-sans);
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 500;
}

/* ---------- MOBILE ---------- */
@media (max-width: 900px) {
  .hero-grid, .two-col, .event-grid, .premium-grid,
  .advisor-card, .contact-card,
  .cards.three-up, .cards.two-up,
  .donation-tiers { grid-template-columns: 1fr; gap: 28px; }
  .workshop-chapters { grid-template-columns: 1fr; gap: 0; }
  .workshop-meta { grid-template-columns: 1fr 1fr; gap: 18px 0; }
  .workshop-meta > div { border-left: 0; padding: 0; }
  .workshop-meta > div:nth-child(odd) { border-right: 1px solid var(--line); padding-right: 18px; }
  .workshop-meta > div:nth-child(even) { padding-left: 18px; }
  .workshop-meta > div:nth-child(5) {
    grid-column: 1 / -1;
    border-right: 0;
    padding: 14px 0 0;
    margin-top: 14px;
    border-top: 1px solid var(--line);
    text-align: center;
  }
  .workshop-visual img { aspect-ratio: 16 / 10; }
  .article-card--feature { grid-template-columns: 1fr; }
  .article-card--feature .feature-image {
    min-height: 320px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
    padding: 22px;
  }
  .article-card--feature .article-body { padding: 28px 24px 30px; }
  .site-header .nav {
    flex-wrap: wrap;
    gap: 10px 16px;
    justify-content: space-between;
  }
  .nav-links {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    font-size: 11px;
    letter-spacing: 0.14em;
    width: 100%;
    justify-content: flex-start;
    padding-top: 4px;
    border-top: 1px solid var(--line);
  }
  .gallery-item.large { grid-column: span 1; }
  .gallery-item.large img { aspect-ratio: 1 / 1; }
  .footer-inner { flex-direction: column; align-items: start; }
  main > section { padding: 56px 0; }
  .advisor-card, .contact-card { padding: 24px; }

  /* Mission band */
  .mission-pledges { grid-template-columns: 1fr; }
  .mission-pledges li {
    padding: 18px 0;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .mission-pledges li:not(:first-child) { padding-left: 0; }
  .mission-pledges li:last-child { border-bottom: 0; }

  /* Workshop sessions */
  .session {
    grid-template-columns: 1fr;
    gap: 10px;
    align-items: start;
  }
  .session-status { justify-self: start; }

  /* Featured workshop */
  .feature-grid { grid-template-columns: 1fr; gap: 24px; padding: 24px; }

  /* Help cards + donation allocation */
  .help-cards { grid-template-columns: 1fr; }
  .alloc-legend { gap: 10px 18px; }
}
