/* ==========================================================================
   NOVA × ANCIENT GREECE — classical type, gold, Greek-key friezes, laurel and marble.
   Fonts (SIL OFL): Cinzel (inscriptional capitals) and Cormorant Garamond.
   ========================================================================== */
@font-face { font-family: "NovaDisplay"; src: url("../fonts/CormorantGaramond-Variable.ttf") format("truetype"); font-weight: 300 700; font-style: normal; font-display: swap; }
@font-face { font-family: "NovaDisplay"; src: url("../fonts/CormorantGaramond-Italic-Variable.ttf") format("truetype"); font-weight: 300 700; font-style: italic; font-display: swap; }
@font-face { font-family: "NovaInscription"; src: url("../fonts/Cinzel-Variable.ttf") format("truetype"); font-weight: 400 900; font-display: swap; }

:root {
  --nv-gold: #d6b46a;
  --nv-gold-2: #f1dfb2;
  --nv-gold-dim: rgba(214, 180, 106, .38);
  --nv-marble: #ece6da;
  --nv-serif: "NovaDisplay", "Cormorant Garamond", "Bodoni 72", Didot, Baskerville, Georgia, serif;
  --nv-inscr: "NovaInscription", "Cinzel", "Trajan Pro", "Optima", serif;
  --nv-meander: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='12' viewBox='0 0 24 12'%3E%3Cpath d='M0 11.25H24M0 .75H24M2 11.25V3H10V9H5V5.5H7.5' fill='none' stroke='%23d6b46a' stroke-width='1.1' stroke-linecap='square'/%3E%3Cpath d='M14 11.25V3H22V9H17V5.5H19.5' fill='none' stroke='%23d6b46a' stroke-width='1.1' stroke-linecap='square'/%3E%3C/svg%3E");
  --nv-laurel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='62' viewBox='0 0 40 62'%3E%3Cg fill='%23d6b46a' stroke='none'%3E%3Cellipse cx='4.0' cy='52.2' rx='7.2' ry='2.5' transform='rotate(-141 4.0 52.2) translate(5.8 0)' /%3E%3Cellipse cx='4.0' cy='52.2' rx='7.2' ry='2.5' transform='rotate(-45 4.0 52.2) translate(5.8 0)' /%3E%3Cellipse cx='4.8' cy='46.4' rx='6.9' ry='2.4' transform='rotate(-131 4.8 46.4) translate(5.5 0)' /%3E%3Cellipse cx='4.8' cy='46.4' rx='6.9' ry='2.4' transform='rotate(-35 4.8 46.4) translate(5.5 0)' /%3E%3Cellipse cx='6.6' cy='40.7' rx='6.6' ry='2.3' transform='rotate(-120 6.6 40.7) translate(5.3 0)' /%3E%3Cellipse cx='6.6' cy='40.7' rx='6.6' ry='2.3' transform='rotate(-24 6.6 40.7) translate(5.3 0)' /%3E%3Cellipse cx='9.4' cy='34.9' rx='6.3' ry='2.2' transform='rotate(-112 9.4 34.9) translate(5.1 0)' /%3E%3Cellipse cx='9.4' cy='34.9' rx='6.3' ry='2.2' transform='rotate(-16 9.4 34.9) translate(5.1 0)' /%3E%3Cellipse cx='13.2' cy='29.1' rx='6.0' ry='2.1' transform='rotate(-105 13.2 29.1) translate(4.8 0)' /%3E%3Cellipse cx='13.2' cy='29.1' rx='6.0' ry='2.1' transform='rotate(-9 13.2 29.1) translate(4.8 0)' /%3E%3Cellipse cx='17.7' cy='23.3' rx='5.8' ry='2.0' transform='rotate(-100 17.7 23.3) translate(4.6 0)' /%3E%3Cellipse cx='17.7' cy='23.3' rx='5.8' ry='2.0' transform='rotate(-4 17.7 23.3) translate(4.6 0)' /%3E%3Cellipse cx='22.8' cy='17.6' rx='5.5' ry='1.9' transform='rotate(-97 22.8 17.6) translate(4.4 0)' /%3E%3Cellipse cx='22.8' cy='17.6' rx='5.5' ry='1.9' transform='rotate(-1 22.8 17.6) translate(4.4 0)' /%3E%3Cellipse cx='28.3' cy='11.8' rx='5.2' ry='1.8' transform='rotate(-94 28.3 11.8) translate(4.1 0)' /%3E%3Cellipse cx='28.3' cy='11.8' rx='5.2' ry='1.8' transform='rotate(2 28.3 11.8) translate(4.1 0)' /%3E%3Cellipse cx='34.0' cy='6.0' rx='4.9' ry='1.7' transform='rotate(-93 34.0 6.0) translate(3.9 0)' /%3E%3C/g%3E%3Cpath d='M4.4 58.0 L4.0 52.2 L4.8 46.4 L6.6 40.7 L9.4 34.9 L13.2 29.1 L17.7 23.3 L22.8 17.6 L28.3 11.8 L34.0 6.0' fill='none' stroke='%23d6b46a' stroke-width='1'/%3E%3C/svg%3E");
  --nv-veins: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600'%3E%3Cfilter id='m'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.004 .018' numOctaves='5' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 1  0 0 0 0 .97  0 0 0 0 .92  0 0 0 -9 4.6'/%3E%3C/filter%3E%3Crect width='600' height='600' filter='url(%23m)'/%3E%3C/svg%3E");
}

/* ---------- Classical display type ---------- */
.nh-giant, .nh-big, .nh-hmw-text, .nh-story-title, .nh-sol-title, .nv-hero-title, .nh-count, .nh-year,
.desc-read h2, .edu-read h2, .nv-orbit-title, .roster-section > h2, .nh-hub-label, .stoa-pager-title, .nv-menu-link, .nh-quote-t, .nh-panel .nh-mid:first-of-type {
  font-family: var(--nv-serif) !important;
}
.nh-giant, .nh-big, .nh-hmw-text, .nh-story-title, .nh-sol-title, .nv-hero-title, .desc-read h2, .edu-read h2, .nv-orbit-title, .roster-section > h2 {
  font-weight: 400 !important; letter-spacing: -.012em !important; line-height: 1 !important;
}
.nv-hero-title { font-size: clamp(60px, 11vw, 184px) !important; }
.nh-giant { font-size: clamp(48px, 8.2vw, 144px); }
.nh-count { font-weight: 300 !important; letter-spacing: -.03em; }
.nh-year { font-weight: 400 !important; letter-spacing: -.02em; -webkit-text-stroke: 1px rgba(214, 180, 106, .75); }
.nh-hub-label { font-weight: 400; letter-spacing: -.005em; font-size: clamp(30px, 3vw, 50px); }
.nh-giant .hl, .nh-big .hl, .nh-hmw-text .hl, .nh-giant .hl2, .nh-hmw-text .hl2, .nh-hmw-text .lg { font-style: italic; font-weight: 500; }
.nh-quote-t { font-size: 22px; line-height: 1.4; font-style: italic; }

/* inscription capitals for labels and small headings */
.nv-label, .nv-brand-text, .nh-types-detail h3, .nh-quote-n, .nh-tag, .nh-bal-tag, .nh-pin-tag i, .nh-body-tip, .nv-menu-group-label, .stoa-pager-label, .desc-num, .site-footer-connect, .site-footer-thanks {
  font-family: var(--nv-inscr) !important; font-weight: 500 !important; letter-spacing: .2em !important;
}
.nv-label { color: #a99d86; }
.nh-types-detail h3, .nh-quote-n { color: var(--nv-gold) !important; }

/* ---------- Gold accents ---------- */
.nh-track-bar i, .nh-sol-bar i { background: linear-gradient(90deg, var(--nv-gold), var(--nv-gold-2)); }
.nh-types-list button.is-active::after { color: var(--nv-gold); }
.nh-types-list button::before { background: var(--nv-gold); }
.nh-step.is-active::before { color: var(--nv-gold); }
.nh-quote { border-left: 3px double var(--nv-gold-dim); }
.nh-hub-card.is-lit { border-color: var(--nv-gold-dim) !important; }
.nh-hub-card.is-lit .nh-hub-arrow, .nh-hub-card:hover .nh-hub-arrow { color: var(--nv-gold-2) !important; }
.nh-pin-tag { border-color: var(--nv-gold-dim); }
.nh-pin-tag i, .nh-pin-tag b { color: var(--nv-gold) !important; }

/* ---------- Greek-key friezes ---------- */
.nv-frieze, .site-footer::before, .nh-hub-grid::before, .roster-section > h2::after, .desc-read h2::after, .edu-read h2::after, .nv-menu::after {
  content: ""; display: block; height: 12px; background: var(--nv-meander) repeat-x left center; background-size: 24px 12px; opacity: .55;
}
.site-footer::before { position: absolute; left: 0; right: 0; top: 0; opacity: .45; }
.nh-hub-grid { position: relative; }
.nh-hub-grid::before { position: absolute; left: -1px; right: 0; top: -26px; opacity: .5; }
.desc-read h2::after, .edu-read h2::after, .roster-section > h2::after { width: 168px; margin-top: 18px; }
.nv-menu::after { position: absolute; left: 0; right: 0; bottom: 0; opacity: .35; }
.nv-header.is-scrolled { border-bottom-color: rgba(214, 180, 106, .22); }

/* ---------- Laurels ---------- */
.nh-hero-kicker, .nv-laurels { display: inline-flex; align-items: center; gap: 16px; }
.nh-hero-kicker::before, .nh-hero-kicker::after, .nv-laurels::before, .nv-laurels::after {
  content: ""; width: 22px; height: 34px; background: var(--nv-laurel) no-repeat center / contain; opacity: .85;
}
.nh-hero-kicker::after, .nv-laurels::after { transform: scaleX(-1); }

/* ---------- Gilded edge on glass panels ---------- */
.nh-quote, .nv-orbit-panel { box-shadow: inset 0 1px 0 rgba(214, 180, 106, .18); }

/* ==========================================================================
   TEAM — "Hall of Heroes": marble stelae with arched niches, full-colour portraits
   ========================================================================== */
.roster-section > h2 { text-align: center; font-size: clamp(46px, 5.6vw, 92px) !important; }
.roster-section > h2::after { margin: 20px auto 0; width: 240px; }
.roster-grid { display: flex !important; flex-wrap: wrap; justify-content: center; gap: clamp(18px, 2.4vw, 34px); border: 0 !important; padding: 40px 0 10px; perspective: 1400px; }
.roster-grid.is-center { padding-bottom: 0; }
.roster-card {
  --mx: 50%; --my: 30%; --rx: 0deg; --ry: 0deg;
  position: relative; width: clamp(168px, 17vw, 228px); padding: 40px 16px 0 !important; border: 0 !important; overflow: visible !important;
  background: none !important; transform: rotateX(var(--rx)) rotateY(var(--ry)) translateZ(0); transform-style: preserve-3d;
  transition: transform .7s var(--nv-ease), filter .6s;
}
/* the stele: marble slab with a pediment on top and a stepped base */
.roster-card::before {
  content: ""; position: absolute; inset: 0 0 34px; z-index: 0; pointer-events: none;
  background:
    radial-gradient(260px 220px at var(--mx) var(--my), rgba(255, 214, 150, .35), transparent 60%),
    var(--nv-veins),
    linear-gradient(170deg, #f1ebdf 0%, #dcd3c2 55%, #c8bda8 100%);
  background-size: auto, 420px, auto; background-blend-mode: normal, multiply, normal;
  clip-path: polygon(50% 0, 100% 26px, 100% 100%, 0 100%, 0 26px);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .4);
  filter: drop-shadow(0 30px 40px rgba(0, 0, 0, .55));
}
.roster-card::after {
  content: ""; position: absolute; left: -8px; right: -8px; bottom: 0; height: 34px; z-index: 0; pointer-events: none;
  background:
    linear-gradient(#cfc5b1, #b3a78f) top / 100% 12px no-repeat,
    linear-gradient(#e2dacb, #c3b8a2) 0 12px / 100% 22px no-repeat;
  clip-path: polygon(8px 0, calc(100% - 8px) 0, calc(100% - 8px) 12px, 100% 12px, 100% 100%, 0 100%, 0 12px, 8px 12px);
}
.roster-card > * { position: relative; z-index: 1; }
/* gilded line along the pediment */
.roster-card .roster-frame { display: block !important; position: absolute !important; left: 0; right: 0; top: 0; height: 28px; aspect-ratio: auto !important; background: none !important; z-index: 2;
  background-image: linear-gradient(to top right, transparent calc(50% - 1px), var(--nv-gold) 50%, transparent calc(50% + 1px)), linear-gradient(to top left, transparent calc(50% - 1px), var(--nv-gold) 50%, transparent calc(50% + 1px)) !important;
  background-size: 50% 26px, 50% 26px !important; background-position: left top, right top !important; background-repeat: no-repeat !important; opacity: .9; overflow: visible; }
/* the arched niche holding the portrait */
.roster-photo {
  aspect-ratio: 4 / 5.2 !important; border-radius: 999px 999px 4px 4px / 46% 46% 4px 4px; overflow: hidden;
  background: #3b3328 !important; box-shadow: inset 0 10px 24px rgba(0, 0, 0, .55), 0 0 0 3px #efe8da, 0 0 0 4px var(--nv-gold), 0 2px 0 5px rgba(0, 0, 0, .12);
}
.roster-photo img {
  filter: sepia(.28) saturate(1.08) contrast(1.06) brightness(.98) !important;
  transition: filter .8s var(--nv-ease), transform 1.2s var(--nv-ease) !important;
}
.roster-photo::after { background: radial-gradient(120% 90% at 50% 10%, transparent 55%, rgba(40, 24, 10, .45)), linear-gradient(180deg, transparent 70%, rgba(30, 18, 8, .35)) !important; }
.roster-card:hover .roster-photo img { filter: sepia(0) saturate(1.12) contrast(1.04) brightness(1.04) !important; transform: scale(1.06); }
/* the inscription */
.roster-info { margin: 0 !important; padding: 16px 4px 50px; text-align: center; }
.roster-name {
  font: 600 clamp(15px, 1.25vw, 19px)/1.15 var(--nv-inscr) !important; letter-spacing: .14em !important; text-transform: uppercase;
  color: #2a2117 !important; text-shadow: 0 1px 0 rgba(255, 255, 255, .65), 0 -1px 0 rgba(0, 0, 0, .18);
}
.roster-name.is-long { font-size: clamp(12px, 1vw, 15px) !important; }
.roster-role { display: block !important; margin-top: 7px !important; font: italic 500 clamp(14px, 1.05vw, 16px)/1.25 var(--nv-serif) !important; letter-spacing: .01em !important; text-transform: none !important; color: #7a5a24 !important; }
.roster-role::before, .roster-role::after { content: "\2014"; margin: 0 .4em; color: rgba(122, 90, 36, .5); }
/* hover: the statue steps forward into torchlight */
.roster-card:hover { filter: drop-shadow(0 0 30px rgba(255, 190, 110, .18)); }
.roster-card.is-tilting { transition: transform .12s linear, filter .6s; }
/* the captain stands larger, crowned with laurel */
.roster-grid.is-center .roster-card { width: clamp(220px, 22vw, 290px); }
.roster-grid.is-center .roster-info::before {
  content: ""; display: block; height: 30px; margin: 0 auto 6px; width: 92px;
  background: var(--nv-laurel) left center / 26px 30px no-repeat, var(--nv-laurel) right center / 26px 30px no-repeat;
}
.roster-grid.is-center .roster-name { font-size: clamp(18px, 1.6vw, 24px) !important; }
/* unveiling: each stele rises from its plinth as it scrolls into view */
.roster-card.nv-unveil { opacity: 0; transform: translateY(60px) rotateX(10deg); }
.roster-card.nv-unveiled { opacity: 1; transform: rotateX(var(--rx)) rotateY(var(--ry)); transition: opacity 1s var(--nv-ease), transform 1.2s var(--nv-ease); }
.roster-hero-photo { border: 0 !important; border-radius: 999px 999px 6px 6px / 22% 22% 6px 6px; box-shadow: 0 0 0 3px #e9e1d1, 0 0 0 4px var(--nv-gold), 0 40px 80px rgba(0, 0, 0, .55); }
.roster-hero-photo img { filter: sepia(.18) saturate(1.05) contrast(1.04) !important; }
@media (max-width: 600px) {
  .roster-grid { gap: 22px 14px; }
  .roster-card { width: calc(50% - 10px); padding: 34px 10px 0 !important; }
  .roster-grid.is-center .roster-card { width: 70%; }
  .roster-name { font-size: 13px !important; letter-spacing: .1em !important; }
  .roster-role { font-size: 13px !important; }
}
@media (prefers-reduced-motion: reduce) { .roster-card.nv-unveil { opacity: 1; transform: none; } }

.nv-gnum { font-family: var(--nv-serif); font-weight: 600; letter-spacing: .02em; color: var(--nv-gold); font-size: 1.2em; }