:root {
  --ink: #080c0e;
  --ink-soft: #11191b;
  --cream: #f2e9c8;
  --cream-2: #fff8df;
  --teal: #286f70;
  --deep-teal: #123f43;
  --sky: #2f78ad;
  --turquoise: #2fc8c1;
  --green: #76cf6e;
  --yellow: #f0dc72;
  --coral: #df745d;
  --crimson: #8f2224;
  --crimson-deep: #3b0c0e;
  --gold: #dc9f28;
  --shadow: 0 24px 55px rgba(0, 0, 0, 0.18);
  --radius: 18px;
  --content: 1180px;
  --header-h: 72px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--cream);
  font-family: Georgia, 'Times New Roman', serif;
  line-height: 1.65;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }

.skip-link {
  position: fixed;
  z-index: 9999;
  top: 8px;
  left: 8px;
  transform: translateY(-150%);
  padding: 10px 14px;
  background: var(--cream-2);
  color: var(--ink);
  border-radius: 6px;
}
.skip-link:focus { transform: translateY(0); }

.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  height: var(--header-h);
  background: rgba(4, 9, 13, 0.97);
  color: var(--cream);
  border-bottom: 1px solid rgba(242, 233, 200, 0.14);
  backdrop-filter: blur(12px);
}
.nav-wrap {
  width: min(var(--content), calc(100% - 40px));
  height: 100%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}
.brand {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.55rem;
  font-weight: 800;
  text-decoration: none;
  letter-spacing: -0.02em;
  color: var(--gold);
}
.site-nav {
  display: flex;
  align-items: center;
  gap: clamp(20px, 3vw, 44px);
  font-family: 'Arial Narrow', Arial, sans-serif;
  font-size: 0.83rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.site-nav a {
  text-decoration: none;
  position: relative;
  padding: 8px 0;
}
.site-nav a::after {
  content: '';
  position: absolute;
  left: 0;
  right: 100%;
  bottom: 3px;
  height: 2px;
  background: var(--gold);
  transition: right 180ms ease;
}
.site-nav a:hover::after,
.site-nav a:focus-visible::after { right: 0; }
.menu-toggle {
  display: none;
  background: transparent;
  border: 1px solid rgba(242, 233, 200, 0.35);
  color: var(--cream);
  padding: 8px 11px;
  border-radius: 7px;
  font-weight: 700;
}

.hero {
  position: relative;
  background: #091318;
  overflow: hidden;
}
.hero-image-link { display: block; color: inherit; text-decoration: none; cursor: pointer; }
.hero-image-link:focus-visible { outline: 4px solid var(--gold); outline-offset: -4px; }
.hero-media {
  width: 100%;
  height: clamp(520px, calc(100vh - var(--header-h)), 900px);
  overflow: hidden;
  background: #091318;
}
.hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}
.hero-accessible-copy {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.section { padding: clamp(76px, 9vw, 126px) 0; }
section[id], article[id] { scroll-margin-top: calc(var(--header-h) + 18px); }
.section-inner {
  width: min(var(--content), calc(100% - 40px));
  margin: 0 auto;
}
.two-column {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
  gap: clamp(48px, 7vw, 100px);
  align-items: center;
}
h1, h2, h3, .footer-title {
  font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', 'Arial Narrow', sans-serif;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  line-height: 0.98;
}
h2 {
  margin: 0 0 30px;
  font-size: clamp(2.65rem, 6vw, 5.4rem);
}
h3 {
  margin: 0 0 18px;
  font-size: clamp(2.1rem, 4vw, 4.2rem);
}
p { margin: 0 0 1.2rem; }
.copy-block > p:not(.eyebrow) { max-width: 760px; font-size: clamp(1rem, 1.25vw, 1.14rem); }
.eyebrow {
  margin: 0 0 12px;
  font: 800 0.78rem/1.2 'Arial Narrow', Arial, sans-serif;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.eyebrow.light { color: var(--cream); opacity: 0.84; }
.spectrum-rule,
.gold-rule {
  display: block;
  width: 112px;
  height: 5px;
  margin-bottom: 20px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--sky), var(--turquoise), var(--green), var(--yellow), var(--coral));
}
.gold-rule { background: var(--gold); }
.centered { text-align: center; }
.centered .spectrum-rule { margin-left: auto; margin-right: auto; }
.section-heading { max-width: 850px; margin: 0 auto clamp(60px, 8vw, 100px); }
.section-lede { max-width: 700px; margin: 0 auto; font-size: 1.08rem; }

.button,
.text-link {
  font-family: 'Arial Narrow', Arial, sans-serif;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 48px;
  padding: 13px 20px 12px;
  border-radius: 4px;
  transition: transform 150ms ease, box-shadow 150ms ease, background 150ms ease;
  font-size: 0.84rem;
}
.button:hover,
.button:focus-visible { transform: translateY(-2px); box-shadow: 0 10px 25px rgba(0,0,0,0.16); }
.button[data-pending-link], .text-link[data-pending-link] { cursor: not-allowed; }
.button-primary { background: var(--ink); color: var(--cream-2); }
.button-outline { border: 2px solid var(--ink); color: var(--ink); background: transparent; }
.button-dark { background: var(--ink); color: var(--cream-2); }
.button-cream { background: var(--cream-2); color: var(--deep-teal); }
.button-gold { background: var(--gold); color: #160708; }
.text-link { display: inline-block; margin-top: 8px; padding-bottom: 4px; border-bottom: 2px solid var(--ink); font-size: 0.84rem; }
.button-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.action-space { margin-top: 55px; }

.intro-section { background: var(--cream-2); }
.sketchbook-art { text-align: center; color: #5e5a4f; font-size: 0.9rem; margin: 0; }
.approved-sketchbook { align-self: center; }
.sketchbook-figure {
  display: block;
  width: min(500px, 100%);
  margin: 0 auto 16px;
  border-radius: 14px;
  border: 2px solid rgba(8,12,14,0.12);
  box-shadow: var(--shadow);
  background: #e9dfbf;
}
.sketchbook-art figcaption {
  max-width: 500px;
  margin: 0 auto;
  line-height: 1.5;
  color: #5e5a4f;
}

.books-section { background: #efe5c4; }
.book-feature {
  display: grid;
  grid-template-columns: minmax(300px, 0.8fr) minmax(0, 1.2fr);
  gap: clamp(45px, 8vw, 110px);
  align-items: center;
  padding: 10px 0 80px;
}
.book-feature.reverse { grid-template-columns: minmax(0, 1.2fr) minmax(300px, 0.8fr); }
.book-feature.reverse .book-cover-wrap { order: 2; }
.book-feature.reverse .book-copy { order: 1; }
.book-cover-wrap { position: relative; width: min(410px, 100%); margin: 0 auto; }
.book-cover-wrap::before {
  content: '';
  position: absolute;
  inset: 18px -18px -18px 18px;
  background: var(--deep-teal);
  border-radius: 5px;
  z-index: 0;
}
.book-cover { position: relative; z-index: 1; width: 100%; box-shadow: var(--shadow); border-radius: 2px; }
.book-copy { max-width: 650px; }
.book-copy h3 { color: var(--ink); }
.book-hook {
  font-size: clamp(1.25rem, 2vw, 1.65rem);
  font-weight: 700;
  line-height: 1.35;
  color: var(--deep-teal);
}
.journey-divider {
  display: flex;
  align-items: center;
  gap: 18px;
  margin: 0 auto 80px;
  max-width: 620px;
  font: 800 0.7rem/1 Arial, sans-serif;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(8,12,14,0.58);
}
.journey-divider i {
  flex: 1;
  height: 3px;
  background: linear-gradient(90deg, var(--coral), var(--yellow), var(--green), var(--turquoise), var(--sky));
  border-radius: 99px;
}

.coming-section {
  position: relative;
  min-height: 620px;
  display: flex;
  align-items: center;
  color: var(--ink);
  background:
    linear-gradient(180deg, rgba(47,120,173,0.93), rgba(47,200,193,0.88) 35%, rgba(118,207,110,0.84) 56%, rgba(240,220,114,0.9) 76%, rgba(223,116,93,0.92));
  overflow: hidden;
}
.coming-section::before,
.coming-section::after {
  content: '';
  position: absolute;
  bottom: -100px;
  width: 420px;
  height: 270px;
  border-radius: 50% 50% 0 0;
  background: rgba(8,12,14,0.78);
}
.coming-section::before { left: -70px; transform: rotate(8deg); }
.coming-section::after { right: -90px; transform: rotate(-8deg); }
.coming-inner { position: relative; z-index: 2; text-align: center; max-width: 800px; padding: 95px 20px; }
.coming-inner h2 { margin-bottom: 12px; }
.book-number { margin: 0 0 8px; font: 900 1rem/1 Arial, sans-serif; letter-spacing: 0.18em; text-transform: uppercase; }
.release { display: inline-block; margin: 8px 0 28px; padding: 9px 14px; background: var(--ink); color: var(--cream-2); font: 900 0.84rem/1 Arial, sans-serif; letter-spacing: 0.12em; text-transform: uppercase; }
.coming-inner > p:not(.eyebrow):not(.book-number):not(.release) { max-width: 680px; margin-left: auto; margin-right: auto; font-size: 1.12rem; }

.characters-section { background: var(--deep-teal); color: var(--cream-2); }
.light-heading h2 { color: var(--cream-2); }
.character-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 24px;
  align-items: stretch;
}
.character-card {
  grid-column: span 2;
  padding: 24px;
  background: rgba(255,248,223,0.075);
  border: 1px solid rgba(255,248,223,0.17);
  border-radius: var(--radius);
  min-height: 390px;
  transition: transform 180ms ease, background 180ms ease;
}
.character-card:nth-child(4) { grid-column: 2 / span 2; }
.character-card:nth-child(5) { grid-column: 4 / span 2; }
.character-card:hover { transform: translateY(-5px); background: rgba(255,248,223,0.11); }
.character-card h3 { font-size: 1.9rem; margin-bottom: 10px; }
.character-role { color: var(--yellow); font-weight: 700; font-style: italic; line-height: 1.4; }
.character-card > p:last-child { color: rgba(255,248,223,0.78); font-size: 0.95rem; }

.world-section { background: var(--cream-2); }
.world-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.world-card {
  overflow: hidden;
  border: 2px solid var(--ink);
  background: #eee4c3;
  border-radius: var(--radius);
  box-shadow: 0 18px 40px rgba(8,12,14,0.09);
}
.world-art {
  height: 240px;
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, var(--sky), var(--turquoise) 46%, var(--yellow) 74%, var(--coral));
  display: grid;
  place-items: center;
}
.world-art::after { content: ''; position: absolute; left: -5%; right: -5%; bottom: -42%; height: 60%; border-radius: 50% 50% 0 0; background: var(--ink); }
.world-image-art { background: #d7d0b1; }
.world-image-art::after { display: none; }
.world-image-art img { display: block; width: 100%; height: 100%; object-fit: cover; }
.world-copy { padding: 28px; }
.world-copy h3 { font-size: clamp(1.8rem, 3vw, 2.8rem); margin-bottom: 10px; }
.world-hook { color: var(--deep-teal); font-weight: 800; font-style: italic; }
.water-tower {
  position: relative; z-index: 2; margin-top: 15px; display: grid; place-items: center; width: 105px; height: 96px; border-radius: 50% 50% 23% 23%; background: var(--ink); color: var(--cream); font: 900 0.75rem/1.05 Arial, sans-serif; letter-spacing: 0.06em; text-align: center;
}
.water-tower::before, .water-tower::after { content: ''; position: absolute; top: 88px; width: 8px; height: 112px; background: var(--ink); transform-origin: top; }
.water-tower::before { left: 22px; transform: rotate(7deg); } .water-tower::after { right: 22px; transform: rotate(-7deg); }
.dome-art span { z-index: 2; font: 900 4.5rem/1 Impact, sans-serif; color: var(--cream-2); text-shadow: 4px 4px 0 var(--ink); }
.town-art span { z-index: 2; padding: 10px 14px; background: var(--ink); color: var(--cream); font: 900 1.4rem/1 Arial, sans-serif; letter-spacing: 0.15em; }
.tuner-art { background: #0a252a; color: var(--cream-2); align-content: center; gap: 22px; padding: 40px; }
.tuner-art::after { display: none; }
.tuner-scale { width: 100%; display: flex; justify-content: space-between; color: rgba(255,248,223,0.62); font: 700 0.67rem/1 Arial, sans-serif; }
.tuner-line { position: relative; width: 100%; height: 4px; background: rgba(255,248,223,0.38); }
.tuner-line i { position: absolute; top: -15px; left: 7%; width: 3px; height: 34px; background: var(--coral); box-shadow: 0 0 14px rgba(223,116,93,0.9); transition: left 650ms cubic-bezier(.22,.9,.3,1); }
.kemu-card:hover .tuner-line i, .kemu-card:focus .tuner-line i { left: 18.5%; }
.tuner-art strong { font: 900 4.8rem/0.9 Impact, sans-serif; letter-spacing: 0.02em; color: var(--yellow); }

.tau-section {
  position: relative;
  padding: clamp(90px, 11vw, 150px) 0;
  overflow: hidden;
  text-align: center;
  color: var(--cream-2);
  background: radial-gradient(circle at top, #64191b 0, var(--crimson-deep) 57%, #220708 100%);
  border-top: 5px solid var(--gold);
}
.tau-pattern { position: absolute; right: -4vw; top: -7vw; color: rgba(220,159,40,0.05); font: 900 min(58vw, 800px)/1 Georgia, serif; transform: rotate(8deg); user-select: none; }
.tau-inner { position: relative; z-index: 2; max-width: 780px; }
.tau-crest { width: min(300px, 70vw); margin: 0 auto 15px; filter: drop-shadow(0 22px 34px rgba(0,0,0,0.28)); }
.greek { margin: 0; color: var(--gold); font: 900 1.5rem/1 Georgia, serif; letter-spacing: 0.16em; }
.tau-inner h2 { margin: 10px 0 16px; }
.latin { margin: 0; color: var(--gold); font: 900 1.2rem/1.2 Georgia, serif; letter-spacing: 0.14em; text-transform: uppercase; }
.translation { margin: 8px 0 30px; font-style: italic; font-size: 1.08rem; color: rgba(255,248,223,0.82); }
.tau-copy { max-width: 690px; margin: 0 auto 34px; font-size: 1.08rem; color: rgba(255,248,223,0.87); }

.about-section { background: var(--cream-2); border-top: 3px solid var(--gold); }
.about-grid { grid-template-columns: minmax(320px, 0.82fr) minmax(0, 1.18fr); }

.site-footer { background: #060b0e; color: rgba(255,248,223,0.76); padding: 65px 20px 28px; text-align: center; }
.footer-inner { max-width: 850px; margin: 0 auto; }
.footer-title { margin: 0 0 24px; color: var(--cream-2); font-size: clamp(1.5rem, 4vw, 2.8rem); }
.footer-nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 26px; margin: 0 0 28px; font: 800 0.74rem/1 Arial, sans-serif; letter-spacing: 0.1em; text-transform: uppercase; }
.footer-nav a { text-decoration: none; }
.footer-nav a:hover { color: var(--gold); }
.fiction-note { max-width: 720px; margin: 0 auto 28px; font-size: 0.76rem; color: rgba(255,248,223,0.45); }
.kemu-signoff { margin: 0; color: var(--yellow); font: 900 0.7rem/1 Arial, sans-serif; letter-spacing: 0.16em; text-transform: uppercase; }
.kemu-signoff span { color: var(--coral); margin: 0 6px; }

.site-toast {
  position: fixed;
  z-index: 4000;
  left: 50%;
  bottom: 26px;
  transform: translate(-50%, 150%);
  max-width: min(480px, calc(100% - 40px));
  padding: 14px 18px;
  border-radius: 10px;
  background: var(--ink);
  color: var(--cream-2);
  box-shadow: var(--shadow);
  font: 700 0.86rem/1.45 Arial, sans-serif;
  transition: transform 220ms ease;
}
.site-toast.show { transform: translate(-50%, 0); }


:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 4px;
}
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 520ms ease, transform 520ms ease;
}
.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.site-header.scrolled {
  box-shadow: 0 8px 24px rgba(0,0,0,0.18);
}
@media (max-width: 980px) {
  :root { --header-h: 64px; }
  .hero-media { height: auto; }
  .hero-media img { height: auto; object-fit: contain; }
  .site-nav { gap: 18px; font-size: 0.72rem; letter-spacing: 0.12em; }
  .two-column, .about-grid { grid-template-columns: 1fr; }
  .sketchbook-art { order: 2; }
  .book-feature, .book-feature.reverse { grid-template-columns: minmax(240px, 0.72fr) minmax(0, 1.28fr); gap: 45px; }
  .character-grid { grid-template-columns: repeat(2, 1fr); }
  .character-card, .character-card:nth-child(4), .character-card:nth-child(5) { grid-column: auto; }
  .character-card:last-child { grid-column: 1 / -1; width: calc(50% - 12px); justify-self: center; }
}

@media (max-width: 760px) {
  .nav-wrap { width: min(100% - 28px, var(--content)); }
  .menu-toggle { display: block; }
  .site-nav {
    position: absolute;
    left: 14px;
    right: 14px;
    top: calc(100% + 8px);
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 10px;
    border: 1px solid rgba(242,233,200,0.16);
    border-radius: 10px;
    background: rgba(4,9,13,0.98);
    box-shadow: var(--shadow);
  }
  .site-nav.open { display: flex; }
  .site-nav a { padding: 13px 12px; }
  .section-inner { width: min(var(--content), calc(100% - 30px)); }
  .book-feature, .book-feature.reverse { grid-template-columns: 1fr; padding-bottom: 70px; }
  .book-feature.reverse .book-cover-wrap, .book-feature.reverse .book-copy { order: initial; }
  .book-cover-wrap { width: min(350px, 88vw); }
  .book-copy { text-align: left; }
  .journey-divider { margin-bottom: 70px; }
  .character-grid, .world-grid { grid-template-columns: 1fr; }
  .character-card:last-child { grid-column: auto; width: auto; }
  .character-card { min-height: 0; }
  .world-art { height: 210px; }
  .button-row { flex-direction: column; align-items: stretch; }
  .button-row .button { width: 100%; }
  .coming-section { min-height: 560px; }
}

@media (max-width: 470px) {
  .brand { font-size: 1.3rem; }
  .section { padding: 68px 0; }
  h2 { font-size: 2.55rem; }
  .tau-crest { width: 235px; }
  .footer-nav { flex-direction: column; gap: 15px; }
}

@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; }
  .reveal { opacity: 1 !important; transform: none !important; }
}

/* ---------- Interior pages ---------- */
.site-nav a.active { color: var(--gold); }
.interior-hero {
  position: relative;
  overflow: hidden;
  color: var(--cream-2);
  background:
    linear-gradient(115deg, rgba(7,17,21,.97), rgba(18,63,67,.92) 48%, rgba(47,120,173,.78)),
    linear-gradient(180deg, var(--sky), var(--turquoise) 45%, var(--yellow) 72%, var(--coral));
}
.interior-hero::after {
  content: '';
  position: absolute;
  left: -4%; right: -4%; bottom: -160px;
  height: 260px;
  border-radius: 50% 50% 0 0;
  background: rgba(8,12,14,.55);
}
.interior-hero-inner { position: relative; z-index: 2; padding: clamp(90px, 11vw, 155px) 0 clamp(85px, 10vw, 135px); }
.interior-hero h1,
.book-detail-hero h1 {
  margin: 0 0 24px;
  font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', 'Arial Narrow', sans-serif;
  font-size: clamp(4.4rem, 12vw, 9.4rem);
  line-height: .86;
  letter-spacing: .015em;
  text-transform: uppercase;
}
.interior-lede { max-width: 760px; margin: 0; font-size: clamp(1.1rem, 2vw, 1.45rem); color: rgba(255,248,223,.84); }
.library-section { background: var(--cream-2); }
.library-book {
  display: grid;
  grid-template-columns: minmax(250px, .7fr) minmax(0, 1.3fr);
  gap: clamp(44px, 8vw, 110px);
  align-items: center;
  padding: 10px 0 clamp(80px, 10vw, 135px);
}
.library-book.reverse { grid-template-columns: minmax(0, 1.3fr) minmax(250px, .7fr); }
.library-book.reverse .library-cover-link { order: 2; }
.library-cover-link { width: min(360px, 100%); margin: 0 auto; position: relative; transition: transform 180ms ease; }
.library-cover-link:hover, .library-cover-link:focus-visible { transform: translateY(-6px) rotate(-.4deg); }
.library-cover-link img { width: 100%; box-shadow: var(--shadow); }
.library-copy h2 { margin-bottom: 20px; }
.library-copy { max-width: 720px; }
.future-book-panel {
  position: relative;
  overflow: hidden;
  min-height: 440px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 40px;
  align-items: center;
  padding: clamp(50px, 7vw, 86px);
  color: var(--cream-2);
  border-top: 5px solid var(--gold);
  background: radial-gradient(circle at 85% 20%, #702124 0, var(--crimson-deep) 52%, #170607 100%);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.future-book-panel h2 { color: var(--cream-2); margin-bottom: 15px; }
.future-book-panel p:not(.eyebrow):not(.release) { max-width: 700px; font-size: 1.08rem; color: rgba(255,248,223,.82); }
.future-mark { color: rgba(220,159,40,.13); font: 900 clamp(8rem, 17vw, 15rem)/1 Georgia, serif; }

/* ---------- High School Lineman detail ---------- */
.book-detail-hero {
  position: relative;
  overflow: hidden;
  color: var(--cream-2);
  background:
    linear-gradient(105deg, rgba(5,12,15,.96) 0 43%, rgba(8,18,21,.62) 64%, rgba(8,18,21,.76)),
    linear-gradient(180deg, #2f78ad 0, #2fc8c1 34%, #76cf6e 52%, #f0dc72 70%, #df745d 100%);
}
.book-detail-hero::before {
  content: '';
  position: absolute;
  left: -8%; right: 42%; bottom: -120px;
  height: 270px;
  background: #05090b;
  border-radius: 50% 50% 0 0;
  transform: rotate(2deg);
}
.book-detail-grid {
  position: relative;
  z-index: 2;
  min-height: 690px;
  display: grid;
  grid-template-columns: minmax(260px, .72fr) minmax(0, 1.28fr);
  gap: clamp(48px, 8vw, 110px);
  align-items: center;
  padding: clamp(80px, 8vw, 120px) 0;
}
.detail-cover-wrap { width: min(410px, 100%); margin: 0 auto; position: relative; }
.detail-cover-wrap::before { content: ''; position: absolute; inset: 18px -18px -18px 18px; border: 2px solid var(--gold); z-index: -1; }
.detail-cover-wrap img { width: 100%; box-shadow: 0 28px 70px rgba(0,0,0,.42); }
.detail-title-copy h1 { color: var(--cream-2); text-shadow: 0 3px 0 rgba(0,0,0,.25); }
.detail-tagline { max-width: 690px; font-size: clamp(1.3rem, 2.4vw, 1.85rem); line-height: 1.3; color: var(--yellow); font-weight: 700; }
.detail-status { display: inline-block; margin: 10px 0 5px; padding: 9px 12px; border: 1px solid rgba(255,248,223,.28); color: rgba(255,248,223,.8); font: 900 .74rem/1 Arial, sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.book-detail-meta { background: #080c0e; color: var(--cream-2); border-top: 1px solid rgba(255,248,223,.12); }
.meta-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.meta-grid div { padding: 26px 25px; border-right: 1px solid rgba(255,248,223,.12); }
.meta-grid div:first-child { border-left: 1px solid rgba(255,248,223,.12); }
.meta-grid span { display: block; margin-bottom: 7px; color: var(--gold); font: 900 .7rem/1 Arial, sans-serif; letter-spacing: .15em; text-transform: uppercase; }
.meta-grid strong { display: block; font-size: .98rem; line-height: 1.35; color: rgba(255,248,223,.88); }
.detail-about { background: var(--cream-2); }
.detail-content-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); gap: clamp(50px, 8vw, 110px); align-items: center; }
.redfield-card { overflow: hidden; border: 2px solid var(--ink); border-radius: var(--radius); background: #efe5c4; box-shadow: var(--shadow); }
.redfield-setting-image { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; object-position: center; }
.redfield-sky { position: relative; height: 245px; background: linear-gradient(180deg, var(--sky), var(--turquoise) 42%, var(--yellow) 70%, var(--coral)); }
.redfield-sky::after { content: ''; position: absolute; left: -10%; right: -10%; bottom: -60px; height: 120px; border-radius: 50% 50% 0 0; background: var(--ink); }
.redfield-tower { position: relative; z-index: 2; width: 120px; min-height: 98px; margin: -175px auto 78px; display: grid; place-items: center; border-radius: 50% 50% 22% 22%; background: var(--ink); color: var(--cream); font: 900 .78rem/1.15 Arial, sans-serif; letter-spacing: .08em; text-align: center; }
.redfield-tower::before, .redfield-tower::after { content: ''; position: absolute; top: 86px; width: 8px; height: 120px; background: var(--ink); transform-origin: top; }
.redfield-tower::before { left: 24px; transform: rotate(8deg); }
.redfield-tower::after { right: 24px; transform: rotate(-8deg); }
.redfield-copy { position: relative; z-index: 3; padding: 30px; background: #efe5c4; }
.redfield-copy h3 { font-size: clamp(2rem, 3vw, 3.2rem); }
.themes-section { background: var(--deep-teal); color: var(--cream-2); }
.theme-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.theme-grid article { padding: 34px; border: 1px solid rgba(255,248,223,.16); background: rgba(255,248,223,.055); border-radius: var(--radius); }
.theme-grid article > span { color: var(--gold); font: 900 1rem/1 Arial, sans-serif; letter-spacing: .15em; }
.theme-grid h3 { margin-top: 18px; margin-bottom: 14px; font-size: clamp(1.9rem, 3vw, 2.8rem); color: var(--cream-2); }
.theme-grid p { color: rgba(255,248,223,.76); }
.opening-section { background: #efe5c4; }
.opening-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(48px, 8vw, 110px); align-items: center; }
.opening-quote { padding: clamp(35px, 5vw, 58px); background: var(--ink); color: var(--cream-2); border-left: 6px solid var(--gold); box-shadow: var(--shadow); }
.opening-quote blockquote { margin: 22px 0 28px; font-size: clamp(2rem, 4.5vw, 4.3rem); line-height: 1.02; font-style: italic; color: var(--yellow); }
.opening-quote > p:last-child { color: rgba(255,248,223,.76); }
.opening-note h2 { font-size: clamp(2.6rem, 5vw, 4.8rem); }
.next-book-section { padding: clamp(80px, 10vw, 135px) 0; color: var(--cream-2); background: linear-gradient(120deg, #0b2227, var(--deep-teal)); border-top: 5px solid var(--gold); }
.next-book-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, .4fr); gap: clamp(50px, 8vw, 100px); align-items: center; }
.next-book-grid h2 { color: var(--cream-2); }
.next-book-grid p:not(.eyebrow) { max-width: 690px; font-size: 1.1rem; color: rgba(255,248,223,.8); }
.next-book-grid img { width: min(300px, 100%); margin-left: auto; box-shadow: var(--shadow); transform: rotate(2deg); }

@media (max-width: 900px) {
  .library-book, .library-book.reverse, .book-detail-grid, .detail-content-grid, .opening-grid, .next-book-grid { grid-template-columns: 1fr; }
  .library-book.reverse .library-cover-link { order: initial; }
  .book-detail-grid { text-align: center; min-height: 0; }
  .detail-title-copy .button-row { justify-content: center; }
  .detail-tagline { margin-left: auto; margin-right: auto; }
  .meta-grid { grid-template-columns: repeat(2, 1fr); }
  .meta-grid div:nth-child(3) { border-left: 1px solid rgba(255,248,223,.12); }
  .theme-grid { grid-template-columns: 1fr; }
  .future-book-panel { grid-template-columns: 1fr; }
  .future-mark { position: absolute; right: 15px; bottom: -35px; }
  .next-book-grid img { margin: 20px auto 0; }
}
@media (max-width: 600px) {
  .interior-hero h1, .book-detail-hero h1 { font-size: clamp(3.7rem, 18vw, 6rem); }
  .meta-grid { grid-template-columns: 1fr; }
  .meta-grid div, .meta-grid div:first-child, .meta-grid div:nth-child(3) { border-left: 1px solid rgba(255,248,223,.12); border-right: 1px solid rgba(255,248,223,.12); border-bottom: 1px solid rgba(255,248,223,.12); }
  .detail-cover-wrap { width: min(330px, 86vw); }
  .redfield-card { width: 100%; }
}

/* ---------- Freshman Year detail ---------- */
.freshman-detail-page .book-detail-hero {
  background:
    linear-gradient(105deg, rgba(5,12,15,.95) 0 40%, rgba(8,18,21,.54) 63%, rgba(8,18,21,.7)),
    linear-gradient(180deg, #2e74a8 0, #30c1bd 35%, #72cb71 54%, #eee075 72%, #d86e5a 100%);
}
.freshman-detail-page .book-detail-hero::before {
  left: 32%; right: -10%; bottom: -142px;
  height: 300px;
  background: #081013;
  border-radius: 50% 50% 0 0;
  transform: rotate(-1deg);
}
.freshman-detail-page .detail-cover-wrap::before { border-color: var(--cream-2); opacity: .85; }
.freshman-detail-page .detail-tagline { color: var(--cream-2); }

.ninety-four-card {
  overflow: hidden;
  border: 2px solid var(--ink);
  border-radius: var(--radius);
  background: #d9d1b4;
  box-shadow: var(--shadow);
}
.crt-shell {
  width: min(360px, calc(100% - 50px));
  margin: 48px auto 30px;
  padding: 20px 20px 16px;
  border: 3px solid #3b3a33;
  border-radius: 26px 26px 18px 18px;
  background: #b8b29c;
  box-shadow: inset -10px -12px 0 rgba(0,0,0,.08), 0 18px 35px rgba(0,0,0,.18);
}
.crt-screen {
  min-height: 230px;
  padding: 28px 25px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  justify-content: center;
  border: 8px solid #45443d;
  border-radius: 42% / 12%;
  background:
    repeating-linear-gradient(0deg, rgba(101,255,164,.035) 0 2px, transparent 2px 5px),
    #07120d;
  color: #91e1a8;
  text-shadow: 0 0 10px rgba(111,255,168,.55);
  font: 700 .84rem/1.25 'Courier New', monospace;
  overflow: hidden;
}
.crt-screen span { opacity: .7; font-size: .72rem; letter-spacing: .08em; }
.crt-screen strong { font-size: clamp(.78rem, 2.2vw, 1.02rem); font-weight: 700; }
.crt-screen em, .crt-screen i { font-style: normal; }
.crt-screen i { animation: cursorBlink 1.05s steps(1) infinite; }
.crt-controls { display: flex; justify-content: flex-end; gap: 9px; margin-top: 13px; }
.crt-controls b { width: 13px; height: 13px; border-radius: 50%; background: #49483f; box-shadow: inset 2px 2px 0 rgba(255,255,255,.18); }
.ninety-four-copy { padding: 0 32px 34px; }
.ninety-four-copy h3 { font-size: clamp(2rem, 3vw, 3.05rem); }
.ninety-four-copy p:last-child { margin-bottom: 0; }
@keyframes cursorBlink { 0%, 48% { opacity: 1; } 49%, 100% { opacity: .35; } }

.freshman-themes { background: linear-gradient(130deg, #123f43, #174e53); }
.people-year-section { background: var(--cream-2); }
.people-year-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) repeat(2, minmax(260px, .85fr));
  gap: 24px;
  align-items: stretch;
}
.people-year-intro { padding: 28px 35px 28px 0; align-self: center; }
.people-year-intro h2 { font-size: clamp(2.7rem, 5.4vw, 5rem); }
.people-year-intro > p:last-child { max-width: 610px; font-size: 1.08rem; }
.freshman-person-card {
  overflow: hidden;
  min-height: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  border: 2px solid var(--ink);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  background: #123f43;
}
.freshman-person-image {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: center 24%;
  background: #0d3034;
}
.freshman-person-copy {
  flex: 1;
  padding: 30px 32px 34px;
  background: linear-gradient(145deg, #123f43, #0d3034);
  color: var(--cream-2);
}
.freshman-person-card .eyebrow { color: var(--gold); }
.freshman-person-card h3 { margin-bottom: 15px; color: var(--cream-2); font-size: clamp(2.2rem, 3.3vw, 3.4rem); }
.freshman-person-card p:last-child { margin-bottom: 0; color: rgba(255,248,223,.88); }
.alex-card .freshman-person-image { object-position: center 22%; }
.chip-card .freshman-person-image { object-position: center 25%; }
.freshman-opening .opening-quote blockquote { font-size: clamp(1.85rem, 3.7vw, 3.6rem); }
.freshman-next-book { background: linear-gradient(115deg, #27080a, var(--crimson-deep)); }
.next-release { color: var(--gold) !important; font: 900 .78rem/1.2 Arial, sans-serif !important; letter-spacing: .14em; text-transform: uppercase; }
.tpe-next-mark {
  display: grid;
  place-items: center;
  width: min(310px, 60vw);
  aspect-ratio: 1;
  margin-left: auto;
  border: 3px solid rgba(220,159,40,.42);
  border-radius: 50%;
  color: var(--gold);
  background: rgba(220,159,40,.055);
  font: 900 clamp(5rem, 11vw, 10rem)/1 Georgia, serif;
  box-shadow: inset 0 0 0 14px rgba(220,159,40,.045);
}

@media (max-width: 1050px) {
  .people-year-grid { grid-template-columns: 1fr 1fr; }
  .people-year-intro { grid-column: 1 / -1; padding-right: 0; }
}
@media (max-width: 720px) {
  .people-year-grid { grid-template-columns: 1fr; }
  .people-year-intro { grid-column: auto; }
  .crt-shell { width: calc(100% - 30px); margin-top: 30px; }
  .ninety-four-copy { padding: 0 24px 28px; }
  .tpe-next-mark { margin: 22px auto 0; }
}

/* ---------- Version 5: Strength in Unity / Book Three ---------- */
.coming-feature-grid {
  position: relative;
  z-index: 2;
  width: min(var(--content), calc(100% - 40px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(250px, .62fr) minmax(0, 1.38fr);
  gap: clamp(46px, 7vw, 100px);
  align-items: center;
  padding: clamp(78px, 9vw, 118px) 0;
}
.coming-feature-grid .coming-inner {
  max-width: 760px;
  padding: 0;
  text-align: left;
  margin: 0;
}
.coming-feature-grid .coming-inner > p:not(.eyebrow):not(.book-number):not(.release) {
  margin-left: 0;
  margin-right: 0;
}
.coming-cover-link {
  display: block;
  width: min(360px, 100%);
  margin: 0 auto;
  position: relative;
  transform: rotate(-1deg);
  transition: transform 180ms ease;
}
.coming-cover-link::after {
  content: '';
  position: absolute;
  inset: 18px -18px -18px 18px;
  z-index: -1;
  border: 2px solid rgba(8,12,14,.7);
}
.coming-cover-link img { width: 100%; box-shadow: 0 28px 60px rgba(0,0,0,.34); }
.coming-cover-link:hover,
.coming-cover-link:focus-visible { transform: translateY(-6px) rotate(-1deg); }

.future-book-panel {
  grid-template-columns: minmax(220px, .48fr) minmax(0, 1.52fr);
}
.future-cover-link {
  width: min(310px, 100%);
  margin: 0 auto;
  position: relative;
  z-index: 2;
  transition: transform 180ms ease;
}
.future-cover-link img { width: 100%; box-shadow: 0 24px 55px rgba(0,0,0,.42); }
.future-cover-link:hover,
.future-cover-link:focus-visible { transform: translateY(-6px) rotate(-.5deg); }
.future-book-copy { position: relative; z-index: 2; }
.future-book-copy .button { margin-top: 10px; }
.future-book-panel::after {
  content: 'ΤΦΕ';
  position: absolute;
  right: -18px;
  bottom: -52px;
  color: rgba(220,159,40,.08);
  font: 900 clamp(9rem, 22vw, 18rem)/1 Georgia, serif;
  pointer-events: none;
}

.next-book-cover-link {
  display: block;
  width: min(300px, 100%);
  margin-left: auto;
  transition: transform 180ms ease;
}
.next-book-cover-link img { width: 100%; margin: 0; transform: rotate(2deg); box-shadow: var(--shadow); }
.next-book-cover-link:hover,
.next-book-cover-link:focus-visible { transform: translateY(-5px); }

/* Book Three preview page */
.strength-detail-page { background: #efe5c4; }
.strength-detail-hero {
  background:
    radial-gradient(circle at 74% 32%, rgba(220,159,40,.16), transparent 28%),
    linear-gradient(105deg, rgba(30,6,8,.98) 0 42%, rgba(59,12,14,.87) 66%, rgba(8,12,14,.86)),
    linear-gradient(180deg, var(--sky) 0, var(--turquoise) 34%, var(--green) 52%, var(--yellow) 70%, var(--coral) 100%);
}
.strength-detail-hero::before {
  left: 40%;
  right: -10%;
  bottom: -145px;
  height: 310px;
  background: #120506;
  opacity: .92;
  transform: rotate(-2deg);
}
.strength-cover-wrap::before { border-color: var(--gold); background: rgba(220,159,40,.06); }
.strength-detail-page .detail-title-copy h1 { color: var(--cream-2); }
.strength-detail-page .detail-tagline { color: #f3ce70; }
.strength-status { border-color: rgba(220,159,40,.7); color: #f3ce70; }
.strength-meta { border-top: 4px solid var(--gold); }

.strength-preview-section { background: var(--cream-2); }
.strength-preview-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
  gap: clamp(48px, 8vw, 105px);
  align-items: center;
}
.tpe-preview-card {
  position: relative;
  overflow: hidden;
  padding: clamp(34px, 5vw, 54px);
  border-radius: var(--radius);
  border-top: 5px solid var(--gold);
  color: var(--cream-2);
  background: radial-gradient(circle at 50% 6%, #7e2023 0, var(--crimson-deep) 62%, #170607 100%);
  box-shadow: var(--shadow);
}
.tpe-preview-card::before {
  content: 'ΤΦΕ';
  position: absolute;
  right: -20px;
  bottom: -38px;
  color: rgba(220,159,40,.075);
  font: 900 10rem/1 Georgia, serif;
}
.tpe-preview-card > * { position: relative; z-index: 2; }
.tpe-preview-card img { width: min(230px, 70%); margin: 0 auto 28px; }
.tpe-preview-card h3 { color: var(--gold); font-size: clamp(2.5rem, 4vw, 4.2rem); }
.tpe-preview-card p:not(.eyebrow) { color: rgba(255,248,223,.8); }
.strength-text-link { color: var(--gold); border-color: var(--gold); }

.strength-threads-section {
  background: linear-gradient(125deg, #220708, var(--crimson-deep) 55%, #11191b);
  color: var(--cream-2);
}
.strength-thread-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.strength-thread-grid article {
  min-height: 400px;
  padding: clamp(30px, 4vw, 42px);
  border: 1px solid rgba(220,159,40,.28);
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(255,248,223,.07), rgba(255,248,223,.035));
}
.strength-thread-grid article > span { color: var(--gold); font: 900 .95rem/1 Arial, sans-serif; letter-spacing: .16em; }
.strength-thread-grid h3 { color: var(--cream-2); margin-top: 24px; font-size: clamp(2rem, 3.2vw, 3.35rem); }
.strength-thread-grid p { color: rgba(255,248,223,.77); }

.strength-cover-story-section { background: #efe5c4; }
.strength-cover-story-grid {
  display: grid;
  grid-template-columns: minmax(320px, .9fr) minmax(0, 1.1fr);
  gap: clamp(50px, 8vw, 105px);
  align-items: center;
}
.strength-house-art {
  overflow: hidden;
  border: 2px solid var(--ink);
  border-radius: var(--radius);
  background: #0d3034;
  box-shadow: var(--shadow);
}
.strength-house-art::before { display: none; }
.strength-house-image { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; object-position: center; }
.house-body {
  position: relative;
  z-index: 2;
  width: 72%;
  height: 240px;
  margin-bottom: 62px;
  border: 6px solid var(--cream);
  border-bottom-width: 14px;
  background: #07090a;
  box-shadow: 0 14px 0 var(--crimson);
}
.house-roof {
  position: absolute;
  z-index: 3;
  width: 62%;
  height: 150px;
  bottom: 286px;
  background: #07090a;
  border: 6px solid var(--cream);
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
.house-window {
  position: absolute;
  top: 55px;
  width: 42px;
  height: 56px;
  border: 5px solid var(--cream);
  background: transparent;
}
.house-window::before { content:''; position:absolute; left:50%; top:0; bottom:0; width:4px; transform:translateX(-50%); background:var(--cream); }
.house-window::after { content:''; position:absolute; left:0; right:0; top:50%; height:4px; transform:translateY(-50%); background:var(--cream); }
.house-window.w1 { left: 12%; }
.house-window.w2 { left: 50%; transform: translateX(-50%); }
.house-window.w3 { right: 12%; }
.house-door {
  position: absolute;
  left: 50%; bottom: 0;
  transform: translateX(-50%);
  width: 70px;
  height: 94px;
  display: grid;
  place-items: start center;
  padding-top: 12px;
  border: 5px solid var(--cream);
  background: var(--crimson);
  color: var(--cream);
  font: 900 .72rem/1 Arial, sans-serif;
}

.strength-opening-section { background: var(--cream-2); }
.strength-opening-quote { background: var(--crimson-deep); border-left-color: var(--gold); }
.strength-opening-quote blockquote { color: var(--gold); font-size: clamp(3.2rem, 8vw, 7rem); }

.strength-release-section {
  padding: clamp(82px, 10vw, 135px) 0;
  color: var(--cream-2);
  border-top: 5px solid var(--gold);
  background: linear-gradient(118deg, #130506, #3b0c0e 55%, #071215);
}
.strength-release-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(230px, .5fr);
  gap: clamp(50px, 8vw, 100px);
  align-items: center;
}
.strength-release-grid h2 { color: var(--cream-2); }
.strength-release-grid p:not(.eyebrow) { max-width: 760px; color: rgba(255,248,223,.8); font-size: 1.08rem; }
.release-cover { width: min(290px, 100%); margin-left: auto; transition: transform 180ms ease; }
.release-cover img { width: 100%; box-shadow: 0 26px 58px rgba(0,0,0,.44); transform: rotate(1.5deg); }
.release-cover:hover,
.release-cover:focus-visible { transform: translateY(-5px); }

@media (max-width: 900px) {
  .coming-feature-grid,
  .strength-preview-grid,
  .strength-cover-story-grid,
  .strength-release-grid { grid-template-columns: 1fr; }
  .coming-feature-grid .coming-inner { text-align: center; margin: 0 auto; }
  .coming-feature-grid .coming-inner > p:not(.eyebrow):not(.book-number):not(.release) { margin-left: auto; margin-right: auto; }
  .future-book-panel { grid-template-columns: 1fr; }
  .future-cover-link { width: min(300px, 75vw); }
  .next-book-cover-link,
  .release-cover { margin: 24px auto 0; }
  .strength-thread-grid { grid-template-columns: 1fr; }
  .strength-thread-grid article { min-height: 0; }
}

@media (max-width: 600px) {
  .coming-cover-link { width: min(285px, 78vw); }
  .coming-section::before, .coming-section::after { opacity: .45; }
  .house-body { height: 185px; margin-bottom: 50px; border-width: 4px; border-bottom-width: 10px; }
  .house-roof { height: 118px; bottom: 235px; border-width: 4px; }
  .house-window { top: 40px; width: 32px; height: 44px; border-width: 4px; }
  .house-window::before { width: 3px; }
  .house-window::after { height: 3px; }
  .house-door { width: 56px; height: 75px; border-width: 4px; }
  .tpe-preview-card img { width: min(200px, 72%); }
}


/* ---------- Version 6: approved character art ---------- */
.character-card-link { color: inherit; text-decoration: none; }
.character-card-link:focus-visible { outline: 3px solid var(--yellow); outline-offset: 4px; }
.character-portrait {
  height: 245px;
  margin: -10px -10px 22px;
  overflow: hidden;
  border-radius: 12px;
  border: 1px solid rgba(255,248,223,.22);
  background: #0b2528;
}
.character-portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 27%;
  transition: transform 420ms ease;
}
.character-card-link:hover .character-portrait img,
.character-card-link:focus-visible .character-portrait img { transform: scale(1.035); }

/* ---------- Characters interior page ---------- */
.characters-page { background: var(--cream-2); }
.character-hero {
  position: relative;
  overflow: hidden;
  color: var(--cream-2);
  border-bottom: 5px solid var(--gold);
  background:
    radial-gradient(circle at 18% 72%, rgba(223,116,93,.62), transparent 24%),
    radial-gradient(circle at 83% 78%, rgba(240,220,114,.4), transparent 24%),
    linear-gradient(118deg, #071316 0, #123f43 48%, #286f70 70%, #2f78ad 100%);
}
.character-hero::before,
.character-hero::after {
  content: '';
  position: absolute;
  bottom: -110px;
  width: 46%;
  height: 255px;
  border-radius: 52% 52% 0 0;
  background: rgba(5,10,12,.7);
}
.character-hero::before { left: -9%; transform: rotate(5deg); }
.character-hero::after { right: -8%; transform: rotate(-4deg); }
.character-hero-inner {
  position: relative;
  z-index: 2;
  padding: clamp(90px, 11vw, 150px) 0 clamp(96px, 11vw, 155px);
}
.character-hero h1 {
  max-width: 940px;
  margin: 0 0 28px;
  font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', 'Arial Narrow', sans-serif;
  font-size: clamp(4.1rem, 10vw, 8.5rem);
  line-height: .86;
  letter-spacing: .01em;
  text-transform: uppercase;
}
.spoiler-note {
  display: inline-block;
  margin: 28px 0 0;
  padding: 9px 13px;
  border: 1px solid rgba(255,248,223,.28);
  color: rgba(255,248,223,.72);
  font-size: .83rem;
}
.character-feature-section { background: var(--cream-2); }
.character-feature-grid {
  display: grid;
  grid-template-columns: minmax(300px, .78fr) minmax(0, 1.22fr);
  gap: clamp(48px, 8vw, 110px);
  align-items: center;
}
.character-feature-image,
.character-profile-image {
  overflow: hidden;
  border: 2px solid var(--ink);
  border-radius: var(--radius);
  background: #15292a;
  box-shadow: var(--shadow);
}
.character-feature-image { min-height: 620px; }
.character-feature-image img,
.character-profile-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.character-feature-image img { min-height: 620px; object-position: center 24%; }
.character-feature-copy h2 { margin-bottom: 18px; }
.character-feature-role {
  margin-bottom: 24px;
  color: var(--deep-teal);
  font-weight: 800;
  font-style: italic;
  font-size: 1.12rem;
}
.character-feature-copy > p:not(.eyebrow):not(.character-feature-role) { font-size: 1.07rem; }
.character-facts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin: 32px 0 8px;
  border-top: 2px solid var(--ink);
  border-bottom: 2px solid var(--ink);
}
.character-facts div { padding: 18px 18px 16px 0; }
.character-facts div + div { padding-left: 18px; border-left: 1px solid rgba(8,12,14,.25); }
.character-facts dt {
  margin-bottom: 5px;
  font: 900 .7rem/1 'Arial Narrow', Arial, sans-serif;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--deep-teal);
}
.character-facts dd { margin: 0; font-weight: 700; }

.character-roots-section { background: #eee4c3; }
.character-profile {
  display: grid;
  grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr);
  gap: clamp(42px, 7vw, 92px);
  align-items: center;
  padding: 18px 0 clamp(82px, 10vw, 125px);
}
.character-profile.reverse { grid-template-columns: minmax(0, 1.28fr) minmax(280px, .72fr); }
.character-profile.reverse .character-profile-image { order: 2; }
.character-profile-image { min-height: 505px; }
.character-profile-image img { min-height: 505px; object-position: center 27%; }
.character-profile-copy h3 { margin-bottom: 18px; }
.profile-hook {
  max-width: 700px;
  color: var(--deep-teal);
  font-size: 1.22rem;
  line-height: 1.45;
  font-weight: 800;
  font-style: italic;
}
.character-profile-copy > p:not(.eyebrow):not(.profile-hook):not(.profile-note) { max-width: 740px; font-size: 1.07rem; }
.profile-note {
  max-width: 700px;
  margin-top: 24px;
  padding: 18px 20px;
  border-left: 4px solid var(--gold);
  background: rgba(255,248,223,.7);
  font-style: italic;
}

.character-emu-section {
  color: var(--cream-2);
  background:
    radial-gradient(circle at 88% 15%, rgba(47,120,173,.35), transparent 25%),
    linear-gradient(125deg, #082b2f, var(--deep-teal) 60%, #091a1d);
}
.character-emu-section .section-lede { color: rgba(255,248,223,.78); }
.emu-profile .character-profile-image { border-color: rgba(255,248,223,.22); }
.emu-profile .character-profile-copy h3 { color: var(--cream-2); }
.emu-profile .profile-hook { color: var(--yellow); }
.emu-profile .character-profile-copy > p:not(.eyebrow):not(.profile-hook):not(.profile-note) { color: rgba(255,248,223,.8); }
.emu-profile .profile-note { color: rgba(255,248,223,.87); background: rgba(255,248,223,.07); border-left-color: var(--yellow); }
.emu-profile .eyebrow { color: rgba(255,248,223,.7); }

.character-pathways-section {
  padding: clamp(70px, 9vw, 115px) 0;
  color: var(--cream-2);
  border-top: 5px solid var(--gold);
  background: linear-gradient(115deg, #130607, var(--crimson-deep) 56%, #0a2529);
}
.character-pathways-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(300px, .8fr);
  gap: clamp(45px, 7vw, 90px);
  align-items: center;
}
.character-pathways-grid h2 { margin-bottom: 22px; color: var(--cream-2); }
.character-pathways-grid p:not(.eyebrow) { max-width: 710px; color: rgba(255,248,223,.78); font-size: 1.06rem; }
.pathway-buttons { display: grid; gap: 13px; }
.button-tau { background: var(--crimson); color: var(--cream-2); border: 1px solid var(--gold); }

@media (max-width: 900px) {
  .character-feature-grid,
  .character-profile,
  .character-profile.reverse,
  .character-pathways-grid { grid-template-columns: 1fr; }
  .character-feature-image { min-height: 540px; width: min(560px, 100%); margin: 0 auto; }
  .character-profile-image { min-height: 500px; width: min(520px, 100%); margin: 0 auto; }
  .character-profile.reverse .character-profile-image { order: 0; }
  .character-profile-copy { width: min(760px, 100%); margin: 0 auto; }
  .character-facts { grid-template-columns: 1fr; }
  .character-facts div + div { padding-left: 0; border-left: 0; border-top: 1px solid rgba(8,12,14,.2); }
}
@media (max-width: 760px) {
  .character-portrait { height: 280px; }
  .character-feature-image,
  .character-feature-image img { min-height: 450px; }
  .character-profile-image,
  .character-profile-image img { min-height: 430px; }
  .character-hero h1 { font-size: clamp(3.55rem, 17vw, 6rem); }
}
@media (max-width: 470px) {
  .character-portrait { height: 245px; }
  .character-feature-image,
  .character-feature-image img { min-height: 390px; }
  .character-profile-image,
  .character-profile-image img { min-height: 380px; }
}

/* ---------- Version 7: The World ---------- */
.world-page { background: var(--cream-2); }
.site-nav a.active::after { right: 0; }

.world-hero {
  position: relative;
  min-height: 660px;
  overflow: hidden;
  color: var(--cream-2);
  border-bottom: 5px solid var(--gold);
  background: linear-gradient(180deg, #153b59 0%, #2f78ad 25%, #2fc8c1 51%, #f0dc72 72%, #df745d 89%, #351519 100%);
}
.world-hero::after {
  content: '';
  position: absolute;
  left: -5%; right: -5%; bottom: -150px;
  height: 320px;
  border-radius: 46% 54% 0 0;
  background: #071012;
  opacity: .96;
}
.world-hero-inner {
  position: relative;
  z-index: 5;
  padding-top: clamp(105px, 13vw, 165px);
  padding-bottom: clamp(120px, 15vw, 190px);
}
.world-hero h1 {
  max-width: 960px;
  margin: 0 0 28px;
  font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', 'Arial Narrow', sans-serif;
  font-size: clamp(4.3rem, 10.5vw, 9rem);
  line-height: .86;
  text-transform: uppercase;
}
.world-hero .interior-lede { max-width: 760px; color: rgba(255,248,223,.9); }
.world-horizon-art { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.world-hero-tower {
  position: absolute; left: 5vw; bottom: 130px; width: 92px; height: 82px;
  border-radius: 52% 52% 22% 22%; display: grid; place-items: center;
  text-align: center; color: var(--cream); background: var(--ink);
  font: 900 .7rem/1.05 Arial, sans-serif; letter-spacing: .06em;
}
.world-hero-tower::before, .world-hero-tower::after { content:''; position:absolute; top:75px; width:7px; height:130px; background:var(--ink); transform-origin:top; }
.world-hero-tower::before { left:20px; transform:rotate(7deg); }
.world-hero-tower::after { right:20px; transform:rotate(-7deg); }
.world-hero-road { position:absolute; left:34%; right:34%; bottom:0; height:260px; background:linear-gradient(100deg, transparent 0 37%, #101314 38% 62%, transparent 63%); opacity:.78; }
.world-hero-dome {
  position:absolute; right:15vw; bottom:125px; width:180px; height:125px; display:grid; place-items:end center;
  padding-bottom:18px; color:var(--cream); background:#071012; border-radius:52% 52% 5px 5px;
  font:900 2.2rem/1 Impact, sans-serif; letter-spacing:.05em;
}
.world-hero-dome::before { content:''; position:absolute; left:29px; right:29px; top:-54px; height:82px; border-radius:55% 55% 0 0; background:#071012; }
.world-hero-radio { position:absolute; right:5vw; bottom:230px; color:var(--yellow); font:900 2rem/1 Impact,sans-serif; transform:rotate(-2deg); }

.world-journey-strip { padding: 28px 0; color: var(--cream-2); background: var(--ink); border-bottom: 1px solid rgba(255,248,223,.16); }
.world-journey-inner { display:grid; grid-template-columns:auto 1fr auto 1fr auto; gap:20px; align-items:center; }
.journey-stop { display:grid; grid-template-columns:auto auto; grid-template-rows:auto auto; column-gap:10px; align-items:center; }
.journey-stop strong { font-family:'Arial Narrow',Arial,sans-serif; text-transform:uppercase; letter-spacing:.08em; }
.journey-stop small { grid-column:2; color:rgba(255,248,223,.6); }
.journey-dot { grid-row:1 / 3; width:12px; height:12px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 4px rgba(220,159,40,.12); }
.journey-track { height:1px; position:relative; background:rgba(255,248,223,.26); }
.journey-track span { position:absolute; right:0; top:-14px; color:var(--gold); font-size:1.3rem; }

.location-section { background: var(--cream-2); }
.location-grid { display:grid; grid-template-columns:minmax(330px,.9fr) minmax(0,1.1fr); gap:clamp(50px,8vw,110px); align-items:center; }
.reverse-location { grid-template-columns:minmax(0,1.1fr) minmax(330px,.9fr); }
.reverse-location .location-art { order:2; }
.location-art { position:relative; min-height:540px; overflow:hidden; border:2px solid var(--ink); border-radius:var(--radius); box-shadow:var(--shadow); }
.location-copy h2 { margin-bottom:18px; }
.location-hook { color:var(--deep-teal); font-size:1.28rem; font-weight:800; font-style:italic; line-height:1.42; }
.location-copy > p:not(.eyebrow):not(.location-hook) { font-size:1.07rem; }
.location-facts { display:grid; grid-template-columns:repeat(2,1fr); margin:30px 0; border-top:2px solid var(--ink); border-bottom:2px solid var(--ink); }
.location-facts div { padding:16px 18px 14px 0; }
.location-facts div:nth-child(even) { padding-left:18px; border-left:1px solid rgba(8,12,14,.22); }
.location-facts dt { margin-bottom:5px; color:var(--deep-teal); font:900 .68rem/1 'Arial Narrow',Arial,sans-serif; letter-spacing:.14em; text-transform:uppercase; }
.location-facts dd { margin:0; font-weight:700; }

.redfield-location { background:#eee4c3; }
.redfield-location-art { background:linear-gradient(180deg,#397da4 0,#47c7bd 38%,#ece06e 63%,#df745d 79%,#102124 80%); }
.location-sun { position:absolute; width:170px; height:170px; border-radius:50%; background:#f5dd7d; left:50%; bottom:105px; transform:translateX(-50%); opacity:.85; }
.location-water-tower { position:absolute; z-index:3; left:16%; top:17%; width:132px; height:112px; display:grid; place-items:center; border-radius:52% 52% 22% 22%; background:var(--ink); color:var(--cream); text-align:center; font:900 .75rem/1.05 Arial,sans-serif; letter-spacing:.08em; }
.location-water-tower::before, .location-water-tower::after { content:''; position:absolute; top:104px; width:9px; height:260px; background:var(--ink); transform-origin:top; }
.location-water-tower::before { left:27px; transform:rotate(7deg); }
.location-water-tower::after { right:27px; transform:rotate(-7deg); }
.location-rail { position:absolute; left:-10%; right:-10%; bottom:70px; height:9px; background:var(--cream); box-shadow:0 26px 0 var(--cream); transform:rotate(-2deg); opacity:.9; }
.location-wheat { position:absolute; bottom:-20px; width:85px; height:245px; border-left:7px solid var(--cream); transform-origin:bottom; opacity:.95; }
.location-wheat::before { content:'✦ ✦ ✦ ✦ ✦'; position:absolute; left:-31px; top:12px; width:70px; color:var(--cream); font-size:34px; line-height:1.1; transform:rotate(12deg); }
.wheat-one { right:13%; transform:rotate(7deg); }
.wheat-two { right:29%; bottom:-55px; transform:scale(.8) rotate(-9deg); }

.hillcrest-location { background:#fff8df; border-top:1px solid rgba(8,12,14,.1); }
.hillcrest-location-art { background:linear-gradient(180deg,#2f78ad 0,#67bfc1 43%,#f0dc72 68%,#df745d 88%); }
.hillcrest-hill { position:absolute; bottom:120px; width:75%; height:220px; border-radius:52% 52% 0 0; background:#164a48; }
.hill-a { left:-25%; transform:rotate(8deg); }
.hill-b { right:-28%; transform:rotate(-7deg); background:#0f3738; }
.hillcrest-river { position:absolute; left:-10%; right:-10%; bottom:75px; height:95px; border-radius:50%; background:#348da0; transform:rotate(-3deg); box-shadow:0 -8px 0 rgba(255,248,223,.35); }
.hillcrest-storefronts { position:absolute; left:8%; right:8%; bottom:0; height:125px; background:repeating-linear-gradient(90deg,#091315 0 82px,#eedda5 83px 87px,#091315 88px 166px); clip-path:polygon(0 24%,7% 24%,7% 5%,22% 5%,22% 30%,31% 30%,31% 15%,50% 15%,50% 26%,59% 26%,59% 0,78% 0,78% 23%,89% 23%,89% 12%,100% 12%,100% 100%,0 100%); }
.hillcrest-mainstreet { position:absolute; z-index:4; left:50%; bottom:115px; transform:translateX(-50%); padding:10px 16px; background:var(--ink); color:var(--cream); font:900 1.25rem/1 'Arial Narrow',Arial,sans-serif; letter-spacing:.18em; }

.emu-world-section { color:var(--cream-2); background:radial-gradient(circle at 75% 15%,rgba(47,120,173,.35),transparent 28%),linear-gradient(125deg,#082b2f,var(--deep-teal) 60%,#091a1d); }
.emu-world-section .section-lede { color:rgba(255,248,223,.76); }
.emu-world-grid { display:grid; grid-template-columns:minmax(320px,.9fr) minmax(0,1.1fr); gap:clamp(50px,8vw,105px); align-items:center; }
.emu-campus-art { position:relative; min-height:520px; overflow:hidden; border:2px solid rgba(255,248,223,.25); border-radius:var(--radius); background:linear-gradient(180deg,#235a79,#3aa6a7 45%,#e8d273 73%,#1b2829 74%); box-shadow:var(--shadow); }
.emu-campus-sky { position:absolute; inset:0; background:radial-gradient(circle at 72% 32%,rgba(255,244,180,.48),transparent 22%); }
.emu-campus-dome { position:absolute; left:50%; bottom:92px; transform:translateX(-50%); width:260px; height:220px; display:grid; place-items:end center; padding-bottom:40px; background:#0a1112; color:var(--cream); font:900 3rem/1 Impact,sans-serif; border-radius:4px; }
.emu-campus-dome::before { content:''; position:absolute; width:170px; height:130px; left:45px; top:-100px; border-radius:55% 55% 0 0; background:#0a1112; }
.emu-campus-dome::after { content:''; position:absolute; width:18px; height:72px; left:121px; top:-145px; background:#0a1112; }
.emu-campus-walk { position:absolute; left:36%; right:36%; bottom:-30px; height:155px; background:var(--cream); clip-path:polygon(40% 0,60% 0,100% 100%,0 100%); opacity:.85; }
.emu-campus-lamp { position:absolute; bottom:50px; width:7px; height:160px; background:#080c0e; }
.emu-campus-lamp::before { content:''; position:absolute; left:-12px; top:-24px; width:31px; height:30px; border:5px solid #080c0e; border-radius:5px 5px 45% 45%; }
.lamp-one { left:16%; } .lamp-two { left:29%; transform:scale(.82); transform-origin:bottom; } .lamp-three { right:16%; }
.emu-world-copy p { color:rgba(255,248,223,.82); font-size:1.08rem; }
.campus-places-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin-top:70px; }
.campus-place { position:relative; min-height:260px; padding:34px; border:1px solid rgba(255,248,223,.22); background:rgba(255,248,223,.055); border-radius:12px; overflow:hidden; }
.campus-place h3 { margin-bottom:14px; color:var(--cream-2); font-size:clamp(1.7rem,3vw,2.7rem); }
.campus-place p { color:rgba(255,248,223,.74); }
.campus-place-number { position:absolute; right:18px; top:8px; color:rgba(240,220,114,.13); font:900 5.5rem/1 Impact,sans-serif; }

.kemu-world-section { padding:clamp(90px,11vw,145px) 0; color:var(--cream-2); background:#07181b; border-top:5px solid var(--gold); }
.kemu-world-grid { display:grid; grid-template-columns:minmax(320px,.95fr) minmax(0,1.05fr); gap:clamp(50px,8vw,110px); align-items:center; }
.kemu-console { position:relative; min-height:460px; padding:50px; border:2px solid rgba(255,248,223,.28); border-radius:18px; background:linear-gradient(145deg,#0c2b30,#071418); box-shadow:inset 0 0 0 8px rgba(0,0,0,.22),0 30px 55px rgba(0,0,0,.28); }
.kemu-label { color:var(--cream); font:900 .9rem/1 'Arial Narrow',Arial,sans-serif; letter-spacing:.22em; }
.kemu-frequency { margin:22px 0 36px; color:var(--yellow); font:900 clamp(5rem,10vw,8rem)/.8 Impact,sans-serif; text-shadow:0 0 28px rgba(240,220,114,.14); }
.kemu-tuner-scale { display:flex; justify-content:space-between; color:rgba(255,248,223,.52); font:700 .7rem/1 Arial,sans-serif; }
.kemu-tuner-track { position:relative; height:5px; margin:12px 0 45px; background:rgba(255,248,223,.25); }
.kemu-tuner-track i { position:absolute; left:18.5%; top:-16px; width:3px; height:38px; background:var(--coral); box-shadow:0 0 14px rgba(223,116,93,.9); }
.kemu-meter-row { display:flex; gap:8px; align-items:end; height:52px; }
.kemu-meter-row b { flex:1; height:25%; background:var(--teal); }
.kemu-meter-row b:nth-child(2),.kemu-meter-row b:nth-child(7) { height:45%; }
.kemu-meter-row b:nth-child(3),.kemu-meter-row b:nth-child(6) { height:70%; background:var(--green); }
.kemu-meter-row b:nth-child(4),.kemu-meter-row b:nth-child(5) { height:92%; background:var(--yellow); }
.kemu-mic { position:absolute; right:34px; bottom:28px; width:54px; height:54px; border-radius:50%; border:3px solid rgba(255,248,223,.3); display:grid; place-items:center; color:var(--coral); }
.kemu-world-copy h2 { margin-bottom:16px; color:var(--cream-2); }
.kemu-tagline { color:var(--yellow); font-size:1.25rem; font-weight:800; font-style:italic; }
.kemu-world-copy > p:not(.eyebrow):not(.kemu-tagline) { color:rgba(255,248,223,.8); font-size:1.08rem; }

.world-pathways-section { padding:clamp(72px,9vw,115px) 0; color:var(--cream-2); border-top:5px solid var(--gold); background:linear-gradient(115deg,#130607,var(--crimson-deep) 56%,#0a2529); }
.world-pathways-grid { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr); gap:clamp(45px,7vw,90px); align-items:center; }
.world-pathways-grid h2 { margin-bottom:22px; color:var(--cream-2); }
.world-pathways-grid p:not(.eyebrow) { max-width:710px; color:rgba(255,248,223,.78); font-size:1.06rem; }

.world-card-link { display:block; color:inherit; text-decoration:none; transition:transform 180ms ease,box-shadow 180ms ease; }
.world-card-link:hover,.world-card-link:focus-visible { transform:translateY(-5px); box-shadow:0 22px 44px rgba(8,12,14,.14); outline:none; }
.world-card-link:focus-visible { box-shadow:0 0 0 4px var(--gold),0 22px 44px rgba(8,12,14,.14); }

@media (max-width: 900px) {
  .world-journey-inner { grid-template-columns:1fr; gap:10px; }
  .journey-track { height:36px; width:1px; margin-left:5px; }
  .journey-track span { right:auto; left:-5px; top:7px; transform:rotate(90deg); }
  .location-grid,.reverse-location,.emu-world-grid,.kemu-world-grid,.world-pathways-grid { grid-template-columns:1fr; }
  .reverse-location .location-art { order:0; }
  .location-art,.emu-campus-art { min-height:480px; width:min(620px,100%); margin:0 auto; }
  .campus-places-grid { grid-template-columns:1fr; }
  .kemu-console { width:min(620px,100%); margin:0 auto; }
}
@media (max-width: 650px) {
  .world-hero { min-height:620px; }
  .world-hero h1 { font-size:clamp(3.7rem,18vw,6.2rem); }
  .world-hero-tower { left:3vw; transform:scale(.78); transform-origin:bottom left; }
  .world-hero-dome { right:3vw; transform:scale(.75); transform-origin:bottom right; }
  .world-hero-radio { display:none; }
  .location-art,.emu-campus-art { min-height:410px; }
  .location-water-tower { transform:scale(.82); transform-origin:top left; }
  .location-facts { grid-template-columns:1fr; }
  .location-facts div:nth-child(even) { padding-left:0; border-left:0; }
  .location-facts div + div { border-top:1px solid rgba(8,12,14,.16); }
  .kemu-console { min-height:400px; padding:38px 28px; }
  .kemu-frequency { font-size:clamp(4.8rem,23vw,7rem); }
}

/* ---------- Version 8: coordinated landing banners + approved World art ---------- */
.characters-landing-hero {
  background:
    radial-gradient(circle at 82% 18%, rgba(77,155,151,.16), transparent 28%),
    linear-gradient(118deg, #061315 0%, #0b292d 44%, #123f43 72%, #183f45 100%);
}
.world-landing-hero {
  background:
    radial-gradient(circle at 78% 20%, rgba(78,137,142,.16), transparent 30%),
    linear-gradient(118deg, #0a171b 0%, #183337 46%, #31585c 76%, #405e61 100%);
}
.characters-landing-hero::after,
.world-landing-hero::after {
  background: rgba(5,10,12,.42);
}
.characters-landing-hero .spoiler-note,
.world-landing-hero .spoiler-note {
  display:inline-block;
  margin:28px 0 0;
  padding:9px 13px;
  border:1px solid rgba(255,248,223,.25);
  color:rgba(255,248,223,.70);
  font-size:.83rem;
}

.location-photo,
.emu-campus-photo {
  margin:0;
  overflow:hidden;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.location-photo {
  min-height:520px;
  border:2px solid var(--ink);
  background:#182629;
}
.location-photo img,
.emu-campus-photo img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.location-photo img { min-height:520px; }
.reverse-location .location-photo { order:2; }

.emu-campus-photo {
  min-height:510px;
  border:2px solid rgba(255,248,223,.24);
  background:#0c2428;
}
.emu-campus-photo img { min-height:510px; }

/* The secondary EMU locations are intentionally text-forward rather than image cards. */
.campus-place {
  background:rgba(255,248,223,.045);
}

.kemu-world-section {
  background:linear-gradient(118deg,#07181b,#0b2b30 62%,#102d31);
}
.kemu-simple-grid {
  display:grid;
  grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);
  gap:clamp(50px,8vw,110px);
  align-items:center;
}
.kemu-station-mark {
  min-height:360px;
  padding:clamp(38px,6vw,70px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  border-top:1px solid rgba(255,248,223,.25);
  border-bottom:1px solid rgba(255,248,223,.25);
  color:var(--cream-2);
}
.kemu-station-mark span {
  color:rgba(255,248,223,.64);
  font:900 .82rem/1 'Arial Narrow',Arial,sans-serif;
  letter-spacing:.26em;
  text-transform:uppercase;
}
.kemu-station-mark strong {
  margin:18px 0 14px;
  color:var(--yellow);
  font:900 clamp(6rem,13vw,10rem)/.82 Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  letter-spacing:.01em;
}
.kemu-station-mark em {
  color:rgba(255,248,223,.84);
  font-size:1.08rem;
  font-weight:800;
  letter-spacing:.05em;
}

@media (max-width:900px) {
  .reverse-location .location-photo { order:0; }
  .location-photo,
  .emu-campus-photo { width:min(720px,100%); margin:0 auto; min-height:0; }
  .location-photo img,
  .emu-campus-photo img { min-height:0; aspect-ratio:16/9; }
  .kemu-simple-grid { grid-template-columns:1fr; }
  .kemu-station-mark { min-height:0; width:min(720px,100%); margin:0 auto; }
}

@media (max-width:650px) {
  .characters-landing-hero h1,
  .world-landing-hero h1 { font-size:clamp(3.7rem,18vw,6.2rem); }
  .kemu-station-mark strong { font-size:clamp(5.3rem,27vw,7.5rem); }
}

/* ---------- Version 9: Tau Phi Epsilon mini-site ---------- */
.tpe-page { background:#efe5c4; }
.tpe-landing-hero {
  background:
    radial-gradient(circle at 78% 18%, rgba(220,159,40,.13), transparent 28%),
    linear-gradient(118deg,#160607 0%,#2a090b 38%,#4a1013 72%,#2d0a0c 100%);
}
.tpe-landing-hero::after { background:rgba(9,3,4,.30); }
.tpe-hero-copy { position:relative; }
.tpe-hero-greek {
  position:absolute;
  right:0;
  top:50%;
  transform:translateY(-50%);
  margin:0;
  color:rgba(220,159,40,.075);
  font:900 clamp(9rem,24vw,18rem)/.75 Georgia,serif;
  letter-spacing:-.08em;
  pointer-events:none;
}
.tpe-hero-motto {
  margin:-8px 0 20px;
  color:#efc65e;
  font:italic 700 clamp(1.15rem,2.2vw,1.65rem)/1.3 Georgia,serif;
  letter-spacing:.06em;
}

.tpe-subnav {
  position:sticky;
  top:var(--header-h);
  z-index:800;
  border-top:1px solid rgba(220,159,40,.28);
  border-bottom:1px solid rgba(220,159,40,.35);
  background:rgba(28,6,8,.97);
  color:var(--cream);
  backdrop-filter:blur(10px);
}
.tpe-subnav-inner {
  min-height:54px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px clamp(14px,3vw,36px);
}
.tpe-subnav a {
  padding:16px 0 13px;
  color:rgba(255,248,223,.82);
  font:900 .72rem/1 'Arial Narrow',Arial,sans-serif;
  letter-spacing:.14em;
  text-decoration:none;
  text-transform:uppercase;
  border-bottom:2px solid transparent;
}
.tpe-subnav a:hover,.tpe-subnav a:focus-visible { color:var(--gold); border-color:var(--gold); outline:none; }

.tpe-welcome { background:#f5edcf; }
.tpe-welcome-grid,.tpe-crest-grid,.tpe-house-grid,.tpe-read-grid {
  display:grid;
  grid-template-columns:minmax(320px,.9fr) minmax(0,1.1fr);
  gap:clamp(50px,8vw,110px);
  align-items:center;
}
.tpe-crest-stage {
  position:relative;
  min-height:540px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border-radius:var(--radius);
  border:1px solid rgba(59,12,14,.16);
  background:radial-gradient(circle at 50% 42%,#fff8df 0,#efe5c4 48%,#d9c79a 100%);
  box-shadow:var(--shadow);
}
.tpe-crest-stage::before {
  content:'ΤΦΕ';
  position:absolute;
  right:-40px;
  bottom:-50px;
  color:rgba(143,34,36,.055);
  font:900 13rem/1 Georgia,serif;
}
.tpe-crest-stage img { position:relative; z-index:2; width:min(360px,72%); filter:drop-shadow(0 18px 25px rgba(0,0,0,.15)); }
.crest-halo { position:absolute; width:370px; height:370px; border:1px solid rgba(143,34,36,.14); border-radius:50%; box-shadow:0 0 0 28px rgba(220,159,40,.055),0 0 0 56px rgba(143,34,36,.035); }
.tpe-founded { position:relative; z-index:2; margin:26px 0 0; color:var(--crimson-deep); font:900 .78rem/1.3 'Arial Narrow',Arial,sans-serif; letter-spacing:.18em; text-transform:uppercase; }
.tpe-intro-copy h2,.tpe-crest-copy h2,.tpe-house-copy h2 { color:var(--crimson-deep); }
.tpe-value-row { display:flex; flex-wrap:wrap; gap:9px; margin-top:32px; }
.tpe-value-row span,.house-places span {
  padding:8px 12px;
  border:1px solid rgba(59,12,14,.24);
  background:rgba(255,255,255,.25);
  color:var(--crimson-deep);
  font:900 .70rem/1 'Arial Narrow',Arial,sans-serif;
  letter-spacing:.11em;
  text-transform:uppercase;
}

.tpe-history-section { color:var(--cream-2); background:linear-gradient(120deg,#170607,var(--crimson-deep) 57%,#160607); }
.tpe-history-section .section-lede { color:rgba(255,248,223,.73); }
.tpe-history-grid { display:grid; grid-template-columns:minmax(250px,.36fr) minmax(0,1.64fr); gap:clamp(44px,7vw,95px); align-items:center; }
.tpe-date-card {
  min-height:360px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(220,159,40,.45);
  background:linear-gradient(145deg,rgba(220,159,40,.10),rgba(255,248,223,.025));
  box-shadow:inset 0 0 0 8px rgba(0,0,0,.12);
}
.date-month,.date-year { color:var(--gold); font:900 .9rem/1 'Arial Narrow',Arial,sans-serif; letter-spacing:.28em; }
.tpe-date-card strong { margin:18px 0 12px; color:var(--cream-2); font:900 clamp(7rem,14vw,10rem)/.7 Impact,sans-serif; }
.tpe-history-copy > p { color:rgba(255,248,223,.82); font-size:1.08rem; }
.founders-list { display:grid; grid-template-columns:repeat(2,1fr); gap:8px 30px; margin-top:28px; padding-top:25px; border-top:1px solid rgba(220,159,40,.26); }
.founders-list span { color:#f1d084; font:800 .82rem/1.4 'Arial Narrow',Arial,sans-serif; letter-spacing:.08em; text-transform:uppercase; }
.tpe-letter-meaning { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:70px; }
.tpe-letter-meaning div { min-height:180px; display:flex; align-items:center; justify-content:center; gap:20px; border-top:1px solid rgba(220,159,40,.35); border-bottom:1px solid rgba(220,159,40,.18); }
.tpe-letter-meaning strong { color:var(--gold); font:900 clamp(3.5rem,7vw,6.5rem)/1 Georgia,serif; }
.tpe-letter-meaning span { color:var(--cream-2); font:900 .88rem/1.3 'Arial Narrow',Arial,sans-serif; letter-spacing:.16em; text-transform:uppercase; }

.tpe-crest-section { background:#fff8df; }
.tpe-crest-grid { grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr); align-items:start; }
.tpe-crest-large-wrap { position:sticky; top:calc(var(--header-h) + 78px); padding:44px; border:2px solid var(--crimson-deep); background:#efe5c4; border-radius:var(--radius); box-shadow:var(--shadow); }
.tpe-crest-large-wrap img { width:min(430px,100%); margin:auto; }
.symbol-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:38px 0 34px; }
.symbol-grid article { padding:24px 20px; border:1px solid rgba(59,12,14,.17); background:#f5edcf; }
.symbol-grid h3 { margin:10px 0; color:var(--crimson-deep); font-size:1.45rem; }
.symbol-grid p { margin:0; font-size:.92rem; }
.symbol-icon { display:block; min-height:36px; color:var(--gold); font:900 1.7rem/1 Georgia,serif; }
.tpe-colors { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.color-swatch { min-height:120px; padding:20px; display:flex; flex-direction:column; justify-content:flex-end; border:1px solid rgba(0,0,0,.12); }
.color-swatch span { font:900 1.35rem/1 'Arial Narrow',Arial,sans-serif; letter-spacing:.09em; text-transform:uppercase; }
.color-swatch small { margin-top:7px; font-size:.86rem; }
.crimson-swatch { background:var(--crimson); color:var(--cream-2); }
.gold-swatch { background:var(--gold); color:#21090a; }
.tpe-canon-note { margin-top:18px; padding-left:14px; border-left:3px solid var(--gold); color:#594f40; font-size:.88rem; font-style:italic; }

.tpe-house-section { background:#efe5c4; }
.tpe-house-grid { grid-template-columns:minmax(340px,.95fr) minmax(0,1.05fr); }
.tpe-house-art { min-height:510px; background:linear-gradient(180deg,#2a5875,#43a7a1 35%,#b8ce74 57%,#e6c768 75%,#b35845); }
.tpe-house-art .house-body { width:74%; height:260px; }
.tpe-house-art .house-roof { width:64%; bottom:306px; }
.house-places { display:flex; flex-wrap:wrap; gap:8px; margin-top:28px; }

.tpe-traditions-section { background:#f8f0d5; }
.centered-rule { margin-left:auto; margin-right:auto; }
.traditions-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.traditions-grid article { position:relative; min-height:310px; padding:34px 28px; overflow:hidden; border-top:4px solid var(--crimson); background:#fff8df; box-shadow:0 12px 32px rgba(59,12,14,.08); }
.tradition-number { position:absolute; right:16px; top:10px; color:rgba(143,34,36,.08); font:900 5rem/1 Impact,sans-serif; }
.traditions-grid h3 { position:relative; margin-top:30px; color:var(--crimson-deep); font-size:clamp(1.6rem,2.6vw,2.35rem); }
.traditions-grid p { position:relative; }
.tpe-safety-note { margin-top:28px; padding:22px 26px; display:flex; gap:16px; align-items:flex-start; border-left:5px solid var(--gold); background:#2b0a0c; color:rgba(255,248,223,.84); }
.tpe-safety-note strong { color:var(--gold); white-space:nowrap; text-transform:uppercase; font:900 .76rem/1.4 'Arial Narrow',Arial,sans-serif; letter-spacing:.12em; }

.tpe-brotherhood-section { padding:clamp(90px,11vw,145px) 0; color:var(--cream-2); background:radial-gradient(circle at 82% 26%,rgba(220,159,40,.10),transparent 26%),linear-gradient(120deg,#120506,#330b0e 58%,#140607); }
.tpe-brotherhood-inner { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr); gap:clamp(50px,8vw,100px); align-items:center; }
.tpe-brotherhood-inner h2 { color:var(--gold); }
.tpe-brotherhood-inner > div > p:not(.eyebrow) { color:rgba(255,248,223,.80); font-size:1.08rem; }
.tpe-brotherhood-inner blockquote { position:relative; margin:0; padding:46px 38px 38px; border:1px solid rgba(220,159,40,.36); background:rgba(255,248,223,.045); }
.tpe-brotherhood-inner blockquote p { position:relative; margin:0 0 20px; color:var(--cream-2); font:italic 700 clamp(1.5rem,3vw,2.35rem)/1.35 Georgia,serif; }
.tpe-brotherhood-inner cite { color:var(--gold); font:900 .72rem/1.3 'Arial Narrow',Arial,sans-serif; letter-spacing:.12em; text-transform:uppercase; font-style:normal; }
.quote-mark { position:absolute; top:-18px; left:18px; color:rgba(220,159,40,.18); font:900 8rem/1 Georgia,serif; }

.tpe-read-section { background:#fff8df; }
.tpe-read-grid { grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr); }
.tpe-read-grid h2 { color:var(--crimson-deep); }
.tpe-read-actions { display:flex; flex-direction:column; gap:12px; align-items:stretch; }
.tpe-read-actions .button { width:100%; }
.tpe-footer { border-top:4px solid var(--gold); background:#100405; }
.tpe-footer-motto { color:var(--gold); font-style:italic; }

@media (max-width: 980px) {
  .tpe-welcome-grid,.tpe-crest-grid,.tpe-house-grid,.tpe-read-grid,.tpe-brotherhood-inner { grid-template-columns:1fr; }
  .tpe-crest-stage { min-height:470px; }
  .tpe-crest-large-wrap { position:relative; top:auto; width:min(600px,100%); margin:0 auto; }
  .symbol-grid { grid-template-columns:1fr; }
  .traditions-grid { grid-template-columns:repeat(2,1fr); }
  .tpe-house-art { width:min(700px,100%); margin:0 auto; }
}
@media (max-width: 760px) {
  .tpe-subnav { position:relative; top:auto; }
  .tpe-subnav-inner { justify-content:flex-start; padding-top:5px; padding-bottom:5px; }
  .tpe-history-grid { grid-template-columns:1fr; }
  .tpe-date-card { min-height:280px; width:min(360px,100%); margin:0 auto; }
  .tpe-letter-meaning { grid-template-columns:1fr; }
  .tpe-letter-meaning div { min-height:120px; }
  .traditions-grid { grid-template-columns:1fr; }
  .tpe-colors { grid-template-columns:1fr; }
  .tpe-safety-note { flex-direction:column; }
  .tpe-safety-note strong { white-space:normal; }
}
@media (max-width: 650px) {
  .tpe-hero-greek { opacity:.65; right:-34px; }
  .tpe-crest-stage { min-height:390px; }
  .tpe-crest-stage img { width:min(290px,76%); }
  .founders-list { grid-template-columns:1fr; }
  .tpe-house-art { min-height:390px; }
}

/* ---------- Version 10: About B. Mac + approved Tau Phi house ---------- */
.author-home-portrait {
  display:block;
  overflow:hidden;
  border-radius:var(--radius);
  border:2px solid var(--ink);
  background:#d8c7a5;
  box-shadow:var(--shadow);
  transition:transform 180ms ease, box-shadow 180ms ease;
}
.author-home-portrait:hover,
.author-home-portrait:focus-visible { transform:translateY(-5px); box-shadow:0 28px 60px rgba(0,0,0,.22); }
.author-home-portrait img { width:100%; aspect-ratio:1/1; object-fit:cover; }

.about-page { background:#f2e9c8; }
.about-landing-hero {
  background:
    radial-gradient(circle at 80% 16%, rgba(220,159,40,.12), transparent 30%),
    linear-gradient(118deg,#100d0b 0%,#241b15 42%,#493425 75%,#5f4633 100%);
}
.about-landing-hero::after { background:rgba(8,7,6,.34); }

.author-intro-section { background:var(--cream-2); }
.author-intro-grid {
  display:grid;
  grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr);
  gap:clamp(46px,8vw,105px);
  align-items:center;
}
.author-portrait-card {
  margin:0;
  overflow:hidden;
  border:2px solid var(--ink);
  border-radius:var(--radius);
  background:#d6c4a1;
  box-shadow:var(--shadow);
}
.author-portrait-card img { width:100%; aspect-ratio:1/1; object-fit:cover; }
.author-portrait-card figcaption {
  padding:15px 18px 17px;
  background:#0b1517;
  color:rgba(255,248,223,.76);
  text-align:center;
  font-size:.82rem;
  letter-spacing:.04em;
}
.author-intro-copy h2 { max-width:780px; }

.why-bear-section {
  position:relative;
  overflow:hidden;
  background:#e9ddbb;
}
.why-bear-section::before {
  content:'BEAR';
  position:absolute;
  right:-1vw;
  bottom:-5vw;
  color:rgba(8,12,14,.035);
  font:900 clamp(10rem,28vw,26rem)/.75 Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif;
  letter-spacing:-.04em;
  pointer-events:none;
}
.about-copy-narrow { position:relative; z-index:1; max-width:900px; }
.about-copy-narrow p { font-size:1.04rem; }

.nineties-about-section {
  color:var(--cream-2);
  background:
    radial-gradient(circle at 18% 25%,rgba(47,200,193,.12),transparent 27%),
    linear-gradient(125deg,#071114,#102a2d 58%,#173a3d);
}
.about-split-grid {
  display:grid;
  grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);
  gap:clamp(50px,8vw,110px);
  align-items:center;
}
.nineties-about-section .copy-block p { color:rgba(255,248,223,.84); }
.nineties-about-section h2 { color:var(--cream-2); }
.nineties-mark {
  min-height:430px;
  padding:42px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  border:1px solid rgba(255,248,223,.18);
  border-radius:var(--radius);
  background:linear-gradient(145deg,rgba(255,248,223,.06),rgba(255,248,223,.015));
  box-shadow:0 24px 55px rgba(0,0,0,.20);
}
.nineties-mark span,
.nineties-mark strong {
  font-family:Impact,Haettenschweiler,'Arial Narrow Bold','Arial Narrow',sans-serif;
  line-height:.72;
  letter-spacing:.01em;
}
.nineties-mark span { color:rgba(255,248,223,.34); font-size:clamp(5rem,12vw,8.5rem); }
.nineties-mark strong { color:var(--gold); font-size:clamp(8rem,19vw,13rem); }
.nineties-mark small {
  max-width:280px;
  margin-top:34px;
  color:rgba(255,248,223,.65);
  font:800 .78rem/1.5 'Arial Narrow',Arial,sans-serif;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.stories-about-section { background:var(--cream-2); }
.about-theme-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  margin-top:52px;
}
.about-theme-grid article {
  position:relative;
  min-height:290px;
  padding:34px 26px;
  overflow:hidden;
  background:#f4e9c8;
  border-top:4px solid var(--teal);
  box-shadow:0 12px 32px rgba(8,12,14,.08);
}
.about-theme-number {
  position:absolute;
  top:8px;
  right:14px;
  color:rgba(18,63,67,.07);
  font:900 4.8rem/1 Impact,sans-serif;
}
.about-theme-grid h3 { position:relative; margin-top:38px; color:var(--deep-teal); font-size:clamp(1.45rem,2.2vw,2rem); }
.about-theme-grid p { position:relative; }
.about-manifesto {
  max-width:920px;
  margin:54px auto 0;
  padding:28px 34px;
  border-left:6px solid var(--gold);
  background:#0b2225;
  color:var(--cream-2);
  font-size:clamp(1.35rem,2.5vw,2.05rem);
  font-style:italic;
}
.about-manifesto p { margin:0; }

.about-series-section { background:#e7dab7; }
.about-series-grid {
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);
  gap:clamp(50px,8vw,105px);
  align-items:center;
}
.about-book-links { display:grid; gap:12px; }
.about-book-links a {
  display:flex;
  flex-direction:column;
  padding:20px 22px;
  text-decoration:none;
  border:1px solid rgba(8,12,14,.15);
  border-left:5px solid var(--gold);
  background:rgba(255,248,223,.56);
  transition:transform 160ms ease, background 160ms ease;
}
.about-book-links a:hover,
.about-book-links a:focus-visible { transform:translateX(5px); background:var(--cream-2); }
.about-book-links span { color:#6e5b3b; font:900 .7rem/1.3 'Arial Narrow',Arial,sans-serif; letter-spacing:.12em; text-transform:uppercase; }
.about-book-links strong { margin-top:5px; color:var(--ink); font-size:1.35rem; }

.author-note-section {
  padding:clamp(95px,12vw,160px) 0;
  color:var(--cream-2);
  background:
    radial-gradient(circle at 80% 18%,rgba(220,159,40,.10),transparent 26%),
    linear-gradient(120deg,#090b0c,#13282b 58%,#0a1113);
}
.author-note-inner { max-width:900px; }
.author-note-inner h2 { color:var(--cream-2); }
.author-note-inner > p:not(.eyebrow):not(.author-signoff) { color:rgba(255,248,223,.82); font-size:1.06rem; }
.author-signoff { margin:36px 0 0; color:var(--gold); font-size:1.45rem; font-style:italic; }
.author-note-actions { margin-top:36px; }

.tpe-house-photo {
  margin:0;
  overflow:hidden;
  border-radius:var(--radius);
  border:2px solid #431013;
  box-shadow:var(--shadow);
  background:#1b0b0c;
}
.tpe-house-photo img { width:100%; height:100%; min-height:510px; object-fit:cover; object-position:center; }

@media (max-width: 980px) {
  .author-intro-grid,
  .about-split-grid,
  .about-series-grid { grid-template-columns:1fr; }
  .author-portrait-card { width:min(520px,100%); margin:0 auto; }
  .nineties-mark { width:min(640px,100%); margin:0 auto; min-height:330px; }
  .about-theme-grid { grid-template-columns:repeat(2,1fr); }
  .tpe-house-photo { width:min(700px,100%); margin:0 auto; }
  .tpe-house-photo img { min-height:0; aspect-ratio:4/5; }
}

@media (max-width: 650px) {
  .about-landing-hero h1 { font-size:clamp(3.7rem,18vw,6.2rem); }
  .about-theme-grid { grid-template-columns:1fr; }
  .about-theme-grid article { min-height:230px; }
  .nineties-mark { min-height:280px; padding:30px; }
  .about-manifesto { padding:24px 25px; }
  .author-note-actions { flex-direction:column; align-items:stretch; }
  .author-note-actions .button { text-align:center; }
}

/* ---------- 404 ---------- */
.not-found-section { min-height: calc(100vh - var(--header-h)); display:grid; place-items:center; background:linear-gradient(135deg,#071417,#123f43 55%,#193a47); color:var(--cream-2); }
.not-found-inner { max-width:820px; text-align:center; padding-top:40px; padding-bottom:40px; }
.not-found-inner h1 { margin:0 0 28px; font-size:clamp(4rem,12vw,9rem); line-height:.86; }
.not-found-inner > p:not(.eyebrow) { max-width:650px; margin:0 auto 30px; font-size:1.15rem; color:rgba(255,248,223,.82); }
.not-found-inner .button-row { justify-content:center; }
