/* Typography is treated like a robot nameplate: tactile in display roles, plain everywhere else. */
.hero h1,
.about-copy h2,
.section-intro h2,
.directions h2,
.moments-heading h2,
.honors-heading h2,
.faq-layout h2,
.apply-heading h2 {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 900;
  text-shadow: 0 1px 0 rgba(255,255,255,.14), 0 3px 0 rgba(84,43,27,.72), 0 12px 26px rgba(0,0,0,.28);
}

.hero h1 {
  color: #f8f4ec;
  filter: drop-shadow(0 0 17px rgba(240,120,67,.13));
  position: relative;
}

.hero h1:after {
  background: linear-gradient(90deg, var(--orange), var(--gold), transparent 72%);
  bottom: -17px;
  content: '';
  height: 2px;
  left: 2px;
  position: absolute;
  width: min(330px, 56%);
}

.hero h1 em {
  color: var(--orange);
  text-shadow: 0 1px 0 rgba(255,220,186,.25), 0 3px 0 #8a3720, 0 13px 26px rgba(0,0,0,.34);
}

.hero-title {
  -webkit-text-fill-color: currentColor !important;
  background: none !important;
  display: grid;
  filter: none;
  justify-items: start;
  line-height: 0 !important;
  row-gap: clamp(7px, .75vw, 13px);
  text-shadow: none !important;
  width: min(42vw, 600px);
}

.hero-title-art { display: block; line-height: 0; max-width: 100%; }
.hero-title-art img { display: block; filter: drop-shadow(0 13px 18px rgba(0,0,0,.35)); height: auto; max-width: 100%; }
.hero-title-lead { margin-left: 1.5%; width: 84%; }
.hero-title-main { margin-left: 4%; width: 96%; }
.sr-only { clip: rect(0, 0, 0, 0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }


.about-copy h2 em,
.section-intro h2 em,
.directions h2 em,
.moments-heading h2 em,
.honors-heading h2 em,
.faq-layout h2 em,
.apply-heading h2 em {
  color: var(--gold);
  text-shadow: 0 1px 0 rgba(255,247,213,.22), 0 2px 0 #665120, 0 10px 22px rgba(0,0,0,.2);
}

.moments-heading h2 span {
  display: block;
  font-size: clamp(25px, 3.2vw, 38px);
  letter-spacing: 0;
  line-height: 1.2;
  margin-bottom: 12px;
}

.moments-heading h2 span strong {
  color: var(--gold);
  display: inline-block;
  font-family: "Arial Narrow", "Noto Sans SC", "PingFang SC", sans-serif;
  font-size: clamp(39px, 4.8vw, 62px);
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: .9;
  margin-right: .12em;
  text-shadow: 0 2px 0 rgba(0,0,0,.45), 0 9px 20px rgba(0,0,0,.24);
}

.moments-heading h2 span:last-child { margin-bottom: 0; }

.about-facts strong,
.event-mark strong,
.direction-story h3,
.honor-overlay strong {
  font-family: "Arial Narrow", "Noto Sans SC", "PingFang SC", sans-serif;
  font-weight: 900;
  text-shadow: 0 2px 0 rgba(0,0,0,.45), 0 9px 20px rgba(0,0,0,.24);
}

.about-facts strong { color: var(--gold); }
.direction-story h3 { color: var(--direction-accent, var(--orange)); }

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .hero h1 {
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    background-image: linear-gradient(180deg, #fffdf8 2%, #c9c5bb 45%, #fff5e8 51%, #b8b3aa 100%);
  }
  .hero h1 em {
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    background-image: linear-gradient(180deg, #ffb080 2%, #f07843 42%, #a53f22 100%);
  }
  .about-facts strong,
  .event-mark:not(.official-mark) strong {
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    background-image: linear-gradient(180deg, #fff1bd, #d1ad62 46%, #80642b 100%);
  }
}

@media (max-width: 700px) {
  html { scroll-padding-top: 64px; }
  .topbar { height: 64px; padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); }
  .brand { gap: 9px; min-width: 0; }
  .brand img { height: 32px; width: 32px; }
  .brand strong { font-size: 12px; }
  .brand small { font-size: 7px; }
  .menu-toggle { align-items: center; border: 1px solid rgba(255,255,255,.2); display: inline-flex; height: 38px; justify-content: center; line-height: 1; padding: 0; width: 38px; }
  .menu-toggle[aria-expanded="true"] { border-color: var(--orange); color: var(--orange); }
  .desktop-nav[data-open="true"] { background: #141718; border: 1px solid rgba(255,255,255,.16); border-top: 2px solid var(--orange); display: grid; gap: 0; left: 14px; margin: 0; padding: 8px 16px; position: fixed; right: 14px; top: 74px; z-index: 30; }
  .desktop-nav[data-open="true"] a { border-bottom: 1px solid rgba(255,255,255,.12); color: var(--cream); font-size: 12px; padding: 14px 0; }
  .desktop-nav[data-open="true"] a:last-child { border-bottom: 0; }
  .nav-open { overflow: hidden; }

  .section-grid, .section, .apply-inner, .footer { padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); }
  .hero { min-height: calc(100svh - 64px); }
  .hero-copy { left: max(16px, env(safe-area-inset-left)); right: max(16px, env(safe-area-inset-right)); top: clamp(68px, 12svh, 106px); }
  .hero h1 { font-size: clamp(46px, 13.2vw, 64px); line-height: .94; }
  .hero h1:after { bottom: -17px; }
  .hero-title { row-gap: 8px; width: min(100%, 360px); }
  .hero-title-lead { font-size: 1em; margin-left: 1%; width: 86%; }
  .hero-title-main { font-size: 1em; margin-left: 3%; width: 97%; }
  .hero-lede { font-size: 13px; line-height: 1.8; margin: 23px 0; max-width: 32rem; }
  .hero-actions { gap: 18px; }
  .hero-actions .button { min-height: 46px; padding: 0 17px; }
  .hero-visual { bottom: 72px; opacity: .2; right: -26vw; transform: rotate(-4deg); width: 78vw; }
  .hero-stamp { bottom: 16px; padding: 7px; right: 16px; }
  .hero-stamp b { font-size: 16px; }
  .hero-meta { bottom: 17px; left: max(16px, env(safe-area-inset-left)); line-height: 1.85; right: max(16px, env(safe-area-inset-right)); }
  .hero-hud { bottom: 103px; right: 16px; }
  .hud-reticle { opacity: .45; }

  .intro-band { padding-bottom: 76px; padding-top: 76px; }
  .about-copy { margin-top: 34px; }
  .about-copy h2, .section-intro h2, .directions h2, .honors-heading h2, .faq-layout h2, .moments-heading h2, .apply-heading h2 { font-size: clamp(38px, 11.4vw, 54px); line-height: 1.02; }
  .about-facts { gap: 12px; }
  .about-facts div { min-width: 0; }
  .about-facts strong { font-size: 22px; }
  .about-facts span { font-size: 7px; overflow-wrap: anywhere; }
  .section { padding-bottom: 76px; padding-top: 82px; }
  .section-note { font-size: 13px; line-height: 1.8; }
  .stage-photo img { aspect-ratio: 4 / 3; object-fit: cover; }
  .stage-photo span { font-size: 8px; padding: 9px 10px; }
  .competition-copy article { padding: 22px 0; }
  .competition-copy h3 { font-size: 20px; }

  .event-lockups { margin-bottom: 34px; }
  .event-mark { min-height: 76px; padding: 13px 10px; }
  .event-mark strong { font-size: 17px; }
  .event-mark span { font-size: 7px; line-height: 1.45; }
  .event-mark img { max-width: 128px; }

  .rm-system-map { margin-bottom: 34px; padding: 28px 0; }
  .rm-map-copy h3 { font-size: clamp(28px, 9vw, 40px); }
  .rm-map-graph { display: grid; gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 24px; min-height: 0; }
  .rm-map-graph svg { display: none; }
  .rm-node, .rm-node.control { left: auto !important; min-height: 82px; padding: 11px; position: static; top: auto !important; transform: none; width: auto; }
  .rm-node.control { grid-column: 1 / -1; }
  .rm-node strong { font-size: 12px; }
  .rm-node small { font-size: 8px; }
  .rm-node:hover, .rm-node:focus-visible { box-shadow: none; transform: none; }
  .roles-fold summary { grid-template-columns: 74px minmax(0, 1fr) 18px; min-height: 64px; }
  .roles-fold summary strong { font-size: 13px; line-height: 1.45; }
  .role-grid { grid-template-columns: 1fr; }
  .role-grid article, .role-grid article:nth-child(n) { border-right: 0; min-height: 0; padding: 19px 0; }
  .role-grid article + article { border-top: 1px solid var(--line); }

  .direction-theater { padding-top: 24px; }
  .direction-story>p:not(.direction-kicker):not(.direction-signal) { font-size: 13px; line-height: 1.8; }
  .direction-controls button { height: 42px; width: 42px; }
  .direction-stage { height: 268px; margin-top: 14px; touch-action: pan-y; }
  .direction-card { height: 224px; padding: 18px; width: min(258px, 78vw); }
  .direction-card[data-offset='-2'], .direction-card[data-offset='2'] { opacity: .14; }
  .direction-card[data-offset='-1'] { transform: translate(-50%,-50%) translateX(-74px) translateZ(-60px) rotateY(17deg) scale(.84); }
  .direction-card[data-offset='1'] { transform: translate(-50%,-50%) translateX(74px) translateZ(-60px) rotateY(-17deg) scale(.84); }
  .direction-card strong { font-size: 28px; }

  .moments-band { padding-bottom: 76px; padding-top: 82px; }
  .moments-heading h2 span { font-size: clamp(25px, 8vw, 34px); }
  .moments-heading h2 span strong { font-size: clamp(36px, 12vw, 50px); }
  .moments-heading .button { margin-top: 6px; }
  .photo-mosaic { gap: 10px; }
  .photo-mosaic figure { aspect-ratio: 4 / 3; }
  .photo-mosaic img { height: 100%; object-fit: cover; }
  .honors-heading { margin-bottom: 30px; }
  .honor-feature { aspect-ratio: 1 / 1; }
  .honor-overlay { bottom: 18px; left: 18px; }
  .honor-list { margin-top: 22px; }
  .honor-row { grid-template-columns: 50px minmax(0, 1fr); padding: 16px 0; }
  .honor-row strong { font-size: 12px; line-height: 1.55; }
  .honor-row b { grid-column: 2; margin-top: -5px; text-align: left; }

  .faq-section { padding-bottom: 76px; padding-top: 82px; }
  .faq-list { margin-top: 32px; }
  .faq-list details { padding: 16px 8px; }
  .faq-list summary { display: grid; font-size: 14px; gap: 12px; grid-template-columns: minmax(0, 1fr) 22px; line-height: 1.6; }
  .faq-list summary span { float: none; text-align: right; }
  .faq-list details p { font-size: 12px; line-height: 1.8; margin-right: 0; }

  .apply-section { padding-bottom: max(74px, env(safe-area-inset-bottom)); padding-top: 82px; }
  .apply-heading .button { min-height: 50px; width: 100%; }
  .recruit-qr-card { gap: 22px; margin-top: 32px; padding: 24px 20px; }
  .recruit-qr-card strong { font-size: clamp(34px, 10vw, 46px); }
  .recruit-qr { justify-self: stretch; max-width: 224px; }
  .recruit-qr figcaption { font-size: 8px; }
  .benefit-row { gap: 8px 14px; }
  .footer { padding-bottom: max(28px, env(safe-area-inset-bottom)); padding-top: 28px; }
}

@media (max-width: 390px) {
  .hero h1 { font-size: 45px; }
  .hero-title { width: min(100%, 328px); }
  .hero-lede { font-size: 12px; }
  .hero-visual { display: none; }
  .event-mark span { font-size: 6.5px; }
  .rm-map-graph { grid-template-columns: 1fr; }
  .rm-node.control { grid-column: auto; }
  .direction-stage { height: 242px; }
  .direction-card { height: 212px; width: min(252px, 84vw); }
  .direction-card:not(.is-active) { opacity: 0; pointer-events: none; transform: translate(-50%, -50%) !important; }
  .honor-feature { aspect-ratio: 4 / 5; }
}

@media (max-width: 700px), (prefers-reduced-motion: reduce) {
  .hero h1, .hero h1 em, .about-facts strong, .event-mark:not(.official-mark) strong {
    -webkit-text-fill-color: currentColor;
    background-image: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .desktop-nav[data-open="true"], .faq-list details, .direction-card { transition: none; }
}
