/* ═══════════════════════════════════
   AKTIVITY PODSTRÁNKA
   css/aktivity.css
═══════════════════════════════════ */

/* ── Body override ── */
.subpage { padding-top: 0; }
/* Navbar na podstránce — průhledný na dark hero, pak přechod na světlý jako na indexu */
.subpage .bar { background: rgba(10,8,6,.55); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.subpage .bar__logo-name,
.subpage .bar__logo-place { color: #fff !important; }
.subpage .bar__toggle span { background: #fff; }
.subpage .bar__cta { color: var(--ink); }

/* Po scrollu — stejný světlý frosted glass jako na indexu */
.subpage .bar.scrolled {
  background: rgba(248,245,240,.82) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  box-shadow: 0 1px 0 rgba(0,0,0,.08) !important;
}
.subpage .bar.scrolled .bar__logo-name { color: var(--ink) !important; }
.subpage .bar.scrolled .bar__logo-place { color: var(--muted) !important; }
.subpage .bar.scrolled .bar__toggle span { background: var(--ink) !important; }
.subpage .bar.scrolled .bar__label { color: var(--ink) !important; }

/* Otevřené menu — bílé jako na hlavní stránce (včetně po scrollu) */
html body.menu-open.subpage .bar,
html body.menu-open.subpage .bar.scrolled,
html body.menu-closing.subpage .bar,
html body.menu-closing.subpage .bar.scrolled {
  background: transparent !important;
  box-shadow: none !important;
}
html body.menu-open.subpage .bar .bar__logo-name,
html body.menu-open.subpage .bar.scrolled .bar__logo-name,
html body.menu-closing.subpage .bar .bar__logo-name {
  color: #fff !important;
}
html body.menu-open.subpage .bar .bar__logo-place,
html body.menu-open.subpage .bar.scrolled .bar__logo-place,
html body.menu-closing.subpage .bar .bar__logo-place {
  color: rgba(255,255,255,.38) !important;
}
html body.menu-open.subpage .bar .bar__toggle span,
html body.menu-open.subpage .bar.scrolled .bar__toggle span,
html body.menu-closing.subpage .bar .bar__toggle span,
html body.menu-closing.subpage .bar.scrolled .bar__toggle span {
  background: #fff !important;
}
html body.menu-open.subpage .bar .bar__label,
html body.menu-open.subpage .bar.scrolled .bar__label,
html body.menu-closing.subpage .bar .bar__label,
html body.menu-closing.subpage .bar.scrolled .bar__label {
  color: rgba(255,255,255,.4) !important;
}

/* Třída z JS — spolehlivě bílé při otevřeném menu na podstránce */
.bar.bar--menu-light,
.bar.bar--menu-light.scrolled {
  background: transparent !important;
  box-shadow: none !important;
}
.bar.bar--menu-light .bar__logo-name { color: #fff !important; }
.bar.bar--menu-light .bar__logo-place { color: rgba(255,255,255,.38) !important; }
.bar.bar--menu-light .bar__toggle span { background: #fff !important; }
.bar.bar--menu-light .bar__label { color: rgba(255,255,255,.4) !important; }

/* Zpět odkaz */
.akt__back-link {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 12px; font-weight: 600; letter-spacing: .1em;
  text-transform: uppercase; color: rgba(255,255,255,.5);
  text-decoration: none;
  transition: color .2s;
}
.akt__back-link:hover { color: rgba(255,255,255,.9); }
.akt__back-link svg { width: 14px; height: 14px; }

/* ─────────────────────────────────────
   HERO
───────────────────────────────────── */
.akt__hero {
  position: relative;
  height: 100vh; min-height: 620px;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  overflow: hidden;
}
.akt__hero-bg {
  position: absolute; inset: -40px 0;
  background-size: cover; background-position: center;
  animation: heroZoom 20s ease-in-out infinite alternate;
  will-change: transform;
}
.akt__hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(10,8,6,.55) 0%,
    rgba(10,8,6,.35) 50%,
    rgba(10,8,6,.88) 100%
  );
}
.akt__hero-body {
  position: relative; z-index: 2;
  text-align: center; padding: 0 40px;
  display: flex; flex-direction: column; align-items: center; gap: 20px;
}
.akt__hero-label {
  font-size: 10px; font-weight: 700; letter-spacing: .26em;
  text-transform: uppercase; color: var(--gold);
}
.akt__hero-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(52px, 9vw, 110px);
  font-weight: 900; line-height: 1.0; color: #fff;
  margin: 0;
}
.akt__hero-title em { font-style: italic; color: var(--gold); }
.akt__hero-sub {
  font-size: clamp(14px, 1.6vw, 17px);
  color: rgba(255,255,255,.6); line-height: 1.7; margin: 0;
}
.akt__hero-scroll {
  position: absolute; bottom: 110px; left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  display: flex; flex-direction: column; align-items: center; gap: 7px;
  font-size: 9px; font-weight: 700; letter-spacing: .22em;
  text-transform: uppercase; color: rgba(255,255,255,.6);
  white-space: nowrap;
  animation: breakBounce 2.8s ease-in-out infinite;
}
.akt__hero-scroll svg { width: 16px; height: 16px; stroke: rgba(255,255,255,.4); }

/* Přehled kapitol dole */
.akt__hero-chapters {
  position: absolute; bottom: 0; left: 0; right: 0; z-index: 2;
  display: flex;
  background: rgba(255,255,255,.04);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-top: 1px solid rgba(255,255,255,.08);
}
.akt__hero-ch {
  flex: 1; padding: 16px 10px;
  display: flex; flex-direction: column; align-items: center; gap: 5px;
  text-decoration: none;
  border-right: 1px solid rgba(255,255,255,.07);
  transition: background .25s;
}
.akt__hero-ch:last-child { border-right: none; }
.akt__hero-ch:hover { background: rgba(255,255,255,.06); }
.akt__hero-ch-n {
  font-family: 'Playfair Display', serif;
  font-size: 13px; font-weight: 700; color: var(--gold);
}
.akt__hero-ch-name {
  font-size: 9px; font-weight: 600; letter-spacing: .12em;
  text-transform: uppercase; color: rgba(255,255,255,.45);
  text-align: center; line-height: 1.4;
}

/* ─────────────────────────────────────
   FIXNÍ CHAPTER NAV
───────────────────────────────────── */
.akt__chapnav {
  position: fixed; left: 28px; top: 50%;
  transform: translateY(-50%);
  z-index: 100;
  display: flex; flex-direction: column; align-items: center;
  gap: 14px;
  opacity: 0; pointer-events: none;
  transition: opacity .4s;
}
.akt__chapnav.is-visible {
  opacity: 1; pointer-events: all;
}
.akt__chapnav-dot {
  position: relative;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: rgba(255,255,255,.25);
  border: 1.5px solid rgba(255,255,255,.2);
  transition: background .25s, transform .25s, border-color .25s;
  text-decoration: none;
}
.akt__chapnav-dot::before {
  content: attr(data-label);
  position: absolute; left: 20px; top: 50%;
  transform: translateY(-50%);
  white-space: nowrap;
  font-size: 10px; font-weight: 600; letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(255,255,255,.7);
  background: rgba(10,8,6,.7);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 4px; padding: 4px 10px;
  opacity: 0; pointer-events: none;
  transition: opacity .2s, transform .2s;
  transform: translateY(-50%) translateX(-4px);
}
.akt__chapnav-dot:hover::before {
  opacity: 1;
  transform: translateY(-50%) translateX(0);
}
.akt__chapnav-dot:hover {
  background: rgba(255,255,255,.5);
  transform: scale(1.3);
}
.akt__chapnav-dot.is-active {
  background: var(--gold);
  border-color: var(--gold);
  transform: scale(1.2);
}

/* Dark chapters — nav dots dark */
.akt__chapnav.on-dark .akt__chapnav-dot {
  background: rgba(255,255,255,.25);
  border-color: rgba(255,255,255,.2);
}
.akt__chapnav.on-light .akt__chapnav-dot {
  background: rgba(0,0,0,.2);
  border-color: rgba(0,0,0,.15);
}
.akt__chapnav.on-light .akt__chapnav-dot.is-active {
  background: var(--gold);
  border-color: var(--gold);
}

/* ─────────────────────────────────────
   KAPITOLY
───────────────────────────────────── */
.akt__ch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  position: relative;
}
.akt__ch--alt { }
.akt__ch--alt .akt__ch-content { order: 1; }
.akt__ch--alt .akt__ch-photo  { order: 2; }

/* Foto panel */
.akt__ch-photo {
  position: relative; overflow: hidden;
  min-height: 440px;
}
.akt__ch-img {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  transition: transform .8s cubic-bezier(.25,.46,.45,.94);
}
.akt__ch-photo:hover .akt__ch-img { transform: scale(1.04); }

/* Placeholder foto */
.akt__ch-img--ph {
  background: linear-gradient(135deg, #1e1b17 0%, #2c2720 100%);
}
.akt__ch-img-ph {
  position: absolute; inset: 0;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 12px;
  color: rgba(255,255,255,.2);
  font-size: 12px; letter-spacing: .06em;
  text-align: center; line-height: 1.5;
}
.akt__ch-img-ph svg { width: 36px; height: 36px; }

/* Velké číslo kapitoly */
.akt__ch-num {
  position: absolute; bottom: -20px; right: -10px;
  font-family: 'Playfair Display', serif;
  font-size: clamp(100px, 16vw, 200px);
  font-weight: 900; line-height: 1; color: rgba(255,255,255,.05);
  pointer-events: none; user-select: none; z-index: 2;
}

/* Textový panel */
.akt__ch-content {
  background: var(--bg);
  padding: clamp(60px, 7vw, 100px) clamp(40px, 5vw, 80px);
  display: flex; flex-direction: column;
  justify-content: flex-start; gap: 24px;
  position: relative;
}
/* Alternující pozadí */
.akt__ch--alt .akt__ch-content { background: var(--cream); }

/* Kategorie nad tagem (nahrazuje cat-bridge) */
.akt__ch-cat-label {
  font-size: 9px; font-weight: 700; letter-spacing: .3em;
  text-transform: uppercase; color: rgba(196,154,91,.55);
  display: flex; align-items: center; gap: 10px;
  margin-bottom: -8px;
}
.akt__ch-cat-label::before {
  content: ''; display: block;
  width: 24px; height: 1px;
  background: rgba(196,154,91,.35);
  flex-shrink: 0;
}

.akt__ch-tag {
  font-size: 10px; font-weight: 700; letter-spacing: .22em;
  text-transform: uppercase; color: var(--gold);
}
.akt__ch-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(32px, 4vw, 52px);
  font-weight: 900; line-height: 1.05; color: var(--ink);
  margin: 0;
}
.akt__ch-lead {
  font-size: 16px; color: var(--muted); line-height: 1.75;
  max-width: 460px; margin: 0;
  font-style: italic;
}
.akt__ch-text {
  font-size: 14px; color: var(--ink); line-height: 1.8;
  max-width: 480px; margin: 0;
  opacity: .75;
}

/* Info chipy */
.akt__chips {
  display: flex; flex-wrap: wrap; gap: 8px;
}
.akt__chip {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 11px; font-weight: 600; letter-spacing: .08em;
  padding: 7px 14px;
  border-radius: 40px; border: 1px solid;
}
.akt__chip svg { width: 13px; height: 13px; flex-shrink: 0; }

.akt__chip--dist {
  background: rgba(196,158,82,.1); color: var(--gold);
  border-color: rgba(196,158,82,.25);
}
.akt__chip--time {
  background: rgba(100,130,100,.08); color: #4a6a4a;
  border-color: rgba(100,130,100,.2);
}
.akt__chip--diff {
  background: rgba(80,100,160,.08); color: #3a5080;
  border-color: rgba(80,100,160,.18);
}
.akt__chip--note {
  background: rgba(120,100,80,.08); color: #6a5030;
  border-color: rgba(120,100,80,.18);
}

/* Tipy box */
.akt__tips {
  background: rgba(0,0,0,.03);
  border: 1px solid rgba(0,0,0,.07);
  border-left: 3px solid var(--gold);
  border-radius: 0 6px 6px 0;
  padding: 20px 24px;
  max-width: 480px;
}
.akt__tips-title {
  font-size: 10px; font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase; color: var(--gold);
  margin-bottom: 12px;
}
.akt__tips-list {
  list-style: none; display: flex; flex-direction: column; gap: 8px;
}
.akt__tips-list li {
  font-size: 12.5px; color: var(--ink); line-height: 1.55;
  opacity: .7; padding-left: 16px; position: relative;
}
.akt__tips-list li::before {
  content: '—';
  position: absolute; left: 0;
  color: var(--gold); font-weight: 700;
}

/* ─────────────────────────────────────
   CTA BLOK
───────────────────────────────────── */
.akt__cta {
  background: var(--dark);
  padding: 80px 0;
  position: relative; overflow: hidden;
}
.akt__cta::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 60% 80% at 80% 50%, rgba(196,158,82,.07) 0%, transparent 60%);
  pointer-events: none;
}
.akt__cta-inner {
  display: flex; align-items: center;
  justify-content: space-between; gap: 32px;
  flex-wrap: wrap;
}
.akt__cta-label {
  font-size: 10px; font-weight: 700; letter-spacing: .2em;
  text-transform: uppercase; color: var(--gold); margin-bottom: 10px;
}
.akt__cta-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(28px, 3.5vw, 46px);
  font-weight: 900; line-height: 1.1; color: #fff; margin: 0;
}
.akt__cta-title em { font-style: italic; color: var(--gold); }

/* ─────────────────────────────────────
   FOOTER (zkrácený)
───────────────────────────────────── */
.akt__foot {
  background: #0c0a08;
  border-top: 1px solid rgba(255,255,255,.06);
  padding: 24px 0;
}
.akt__foot-inner {
  display: flex; align-items: center;
  justify-content: space-between; gap: 20px;
  flex-wrap: wrap;
}
.akt__foot-logo {
  display: flex; align-items: center; gap: 10px;
  text-decoration: none;
  font-family: 'Playfair Display', serif;
  font-size: 15px; font-weight: 700; color: #fff;
}
.akt__foot-copy { font-size: 12px; color: rgba(255,255,255,.22); }
.akt__foot-links {
  display: flex; gap: 20px;
}
.akt__foot-links a {
  font-size: 12px; color: rgba(255,255,255,.35);
  text-decoration: none; transition: color .2s;
}
.akt__foot-links a:hover { color: rgba(255,255,255,.7); }

/* ─────────────────────────────────────
   RESPONSIVE
───────────────────────────────────── */
@media (max-width: 900px) {
  .akt__ch { grid-template-columns: 1fr; }
  .akt__ch--alt .akt__ch-content { order: 2; }
  .akt__ch--alt .akt__ch-photo  { order: 1; }
  .akt__ch-photo { min-height: 280px; }
  .akt__ch-content { padding: 44px 32px; }
  .akt__chapnav { display: none; }
  .akt__hero-chapters { display: none; }
  .akt__cta-inner { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 560px) {
  .akt__hero-title { font-size: clamp(44px, 12vw, 72px); }
  .akt__ch-content { padding: 44px 24px; }
  .akt__foot-inner { flex-direction: column; align-items: flex-start; }
  .akt__foot-copy { display: none; }
}
