/* ============================================================
   KEK 一般公開 2026 (V5) — the 4 design variations
   All variants share the kek.jp-inspired layout (see site.css);
   themes change palette, hero treatment and section texture.
   t-b1 ナイト / t-b2 デイライト / t-c1 エディトリアル / t-c2 フィールドガイド
   ============================================================ */

/* ============================================================
   B1 — night immersive: dark app UI, banner as night sky
   ============================================================ */
body.t-b1 {
  --bg:        #0c1424;
  --surface:   #16203a;
  --surface-2: #1c2946;
  --line:      #273350;
  --line-2:    #35426a;
  --ink:       #eef2fa;
  --ink-2:     #c0cade;
  --ink-3:     #8b98b3;
  --ink-soft:  #64718c;
  --accent:    #f2799f;
  --accent-ink:#2b0a18;
  --footer-bg: #060b16;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.35), 0 2px 8px rgba(0,0,0,.3);
  --shadow:    0 4px 16px rgba(0,0,0,.4);
  --shadow-lg: 0 18px 50px rgba(0,0,0,.55);
}
body.t-b1 .overview, body.t-b1 .mapsec, body.t-b1 .food, body.t-b1 .qa { background: #101a30; }
body.t-b1 .cat-shisetsu { --cat: #ff5ea8; --cat-soft: rgba(224,0,122,.16); }
body.t-b1 .cat-booth    { --cat: #57a9e8; --cat-soft: rgba(60,150,230,.16); }
body.t-b1 .cat-taiken   { --cat: #2fd0c6; --cat-soft: rgba(0,190,197,.16); }
body.t-b1 .cat-talk     { --cat: #ffb054; --cat-soft: rgba(241,141,0,.16); }
body.t-b1 .badge-reserve { background: rgba(255,90,80,.18); color: #ff9b93; }
body.t-b1 .badge-kids { background: rgba(255,200,60,.15); color: #ffd77e; }
body.t-b1 .badge-photo { background: rgba(255,94,168,.15); color: #ff9ec7; }
body.t-b1 .tt-time { color: #ffb054; }
body.t-b1 .food-note { background: rgba(242,121,159,.12); color: var(--ink-2); }
body.t-b1 .map-marker { color: #0c1424; }
body.t-b1 .qa-gname { color: #2b0a18; }

body.t-b1 .hero-band .scrim {
  background: linear-gradient(180deg, rgba(12,20,36,.16) 0%, rgba(12,20,36,0) 32%, rgba(12,20,36,.5) 100%);
}
body.t-b1 .hero-tagbox {
  background: rgba(14,22,40,.82); color: #fff; backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.14);
}
body.t-b1 .hero-tagbox .hero-theme { color: #ffc2d6; }
body.t-b1 .hero-info { background: rgba(14,22,40,.88); backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,.14); }
body.t-b1 .hi-row span:last-child { color: #eef2fa; }

/* ============================================================
   B2 — daylight immersive: kek.jp classic white box on banner
   ============================================================ */
body.t-b2 {
  --accent: #0f8f86;
  --accent-ink: #ffffff;
  --bg: #f2f6f5;
  --footer-bg: #0f2a33;
}
body.t-b2 .overview, body.t-b2 .mapsec, body.t-b2 .food, body.t-b2 .qa { background: var(--surface); }
body.t-b2 .catalog, body.t-b2 .timetable, body.t-b2 .access, body.t-b2 .quicknav { background: var(--bg); }
body.t-b2 .hero-band .scrim { background: linear-gradient(180deg, rgba(255,244,248,0) 58%, rgba(20,60,70,.16) 100%); }
body.t-b2 .hero-tag-en { color: var(--bn-pink-dk); }
body.t-b2 .hero-tagbox .hero-theme { color: var(--bn-teal-dk); }

/* ============================================================
   C1 — editorial: paper magazine + chapter numbers
   ============================================================ */
body.t-c1 {
  --bg:        #faf6ee;
  --surface:   #fffdf8;
  --surface-2: #f6f1e6;
  --line:      #e9e2d2;
  --line-2:    #d8cfba;
  --ink:       #241f18;
  --ink-2:     #4f483c;
  --ink-3:     #7d7565;
  --ink-soft:  #a89e8c;
  --accent:    #d84f7e;
  --accent-ink:#ffffff;
  --footer-bg: #241f18;
  --radius: 10px; --radius-sm: 7px; --radius-lg: 16px;
}
body.t-c1 .overview, body.t-c1 .mapsec, body.t-c1 .food, body.t-c1 .qa { background: var(--surface); }
body.t-c1 .catalog, body.t-c1 .timetable, body.t-c1 .access, body.t-c1 .quicknav { background: var(--bg); }
body.t-c1 { counter-reset: chapter; }
body.t-c1 .sec-en { color: var(--ink); }
body.t-c1 .sec-en::before {
  counter-increment: chapter;
  content: "0" counter(chapter);
  color: var(--accent); margin-right: 14px;
  font-family: var(--font-mono); font-weight: 600; font-size: .55em; vertical-align: .35em;
}
body.t-c1 .sec-ja { color: var(--accent); }
body.t-c1 .hero-band .scrim { background: linear-gradient(180deg, rgba(36,31,24,0) 62%, rgba(36,31,24,.24) 100%); }
body.t-c1 .hero-tagbox { background: var(--surface); border: 1px solid var(--line-2); border-radius: 4px; }
body.t-c1 .hero-tag-en { color: var(--bn-teal); }
body.t-c1 .hero-info { border-radius: 6px; }
body.t-c1 .qn-band { background: var(--ink); color: #fffdf8; }
body.t-c1 .nav-mark { border-radius: 6px; }

/* ============================================================
   C2 — field guide: dense, boxy, utilitarian
   ============================================================ */
body.t-c2 {
  --bg:        #f6f7f4;
  --surface:   #ffffff;
  --surface-2: #f1f3ee;
  --line:      #d9ddd2;
  --line-2:    #b9c0ad;
  --ink:       #1c2418;
  --ink-2:     #46523e;
  --ink-3:     #6f7a64;
  --ink-soft:  #98a18c;
  --accent:    #0f6e68;
  --accent-ink:#ffffff;
  --footer-bg: #16211a;
  --radius: 4px; --radius-sm: 3px; --radius-lg: 6px;
  --shadow-sm: 0 1px 0 rgba(28,36,24,.08);
  --shadow:    0 3px 0 rgba(28,36,24,.1);
  --shadow-lg: 0 10px 30px rgba(28,36,24,.18);
}
body.t-c2 .overview, body.t-c2 .mapsec, body.t-c2 .food, body.t-c2 .qa { background: var(--surface); }
body.t-c2 .catalog, body.t-c2 .timetable, body.t-c2 .access, body.t-c2 .quicknav { background: var(--bg); }
body.t-c2 .pcard:hover { transform: none; box-shadow: 4px 4px 0 rgba(15,110,104,.25); }
body.t-c2 .section { padding: 56px 0; }
body.t-c2 .sec-en { font-size: clamp(28px, 3.6vw, 42px); }
body.t-c2 .sec-en::before { content: "■ "; font-size: .5em; vertical-align: .5em; }
body.t-c2 .hero-band { min-height: clamp(460px, calc(100vh - 210px), 780px); }
body.t-c2 .hero-band .scrim { background: linear-gradient(95deg, rgba(9,42,48,.38) 0%, rgba(9,42,48,.14) 45%, rgba(9,42,48,0) 70%); }
body.t-c2 .hero-tagbox { border-radius: 0; border-left: 6px solid var(--accent); padding: 16px 22px 15px; }
body.t-c2 .hero-tagbox h1 { font-size: clamp(24px, 3.4vw, 36px); }
body.t-c2 .hero-info { border-radius: 0; }
body.t-c2 .qn-band { border-radius: 0; }
body.t-c2 .nav-mark { border-radius: 4px; }

/* c2 hero quick-jump strip */
.hero-jump { position: relative; background: var(--accent); }
.hero-jump-inner { display: flex; flex-wrap: wrap; }
.hero-jump a {
  display: inline-flex; align-items: center; gap: 7px;
  color: #fff; padding: 12px 18px; font-size: 13px; font-weight: 700;
  border-right: 1px solid rgba(255,255,255,.22);
}
.hero-jump a:first-child { border-left: 1px solid rgba(255,255,255,.22); }
.hero-jump a:hover { background: rgba(255,255,255,.14); }