/* ============ Design tokens ============ */
:root{
  --bg:            #f3eedd;
  --bg-soft:       #e8e0c6;
  --ink:           #20301f;
  --ink-soft:      #4a5748;
  --forest:        #33513a;
  --forest-deep:   #1b2a1c;
  --ember:         #c0432b;
  --ember-hover:   #a5371f;
  --gold:          #c89a3e;
  --border:        rgba(32,48,31,.14);
  --shadow:        0 20px 40px -24px rgba(27,42,28,.35);
  --radius:        .5rem;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:          #131b12;
    --bg-soft:     #1c261a;
    --ink:         #ece5d0;
    --ink-soft:    #b8bfae;
    --forest:      #8fb897;
    --forest-deep: #0e150e;
    --ember:       #e2643f;
    --ember-hover: #ef815f;
    --gold:        #d9ae55;
    --border:      rgba(236,229,208,.14);
    --shadow:      0 20px 40px -24px rgba(0,0,0,.6);
  }
}

*{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ *{ scroll-behavior:auto !important; animation:none !important; transition:none !important; } }

body{
  background:var(--bg);
  color:var(--ink);
  font-family:"Source Sans 3", system-ui, sans-serif;
  font-size:1.05rem;
  line-height:1.65;
}
h1,h2,h3,h4,.font-display{
  font-family:"Fraunces","Georgia",serif;
  font-weight:600;
  color:var(--ink);
  text-wrap:balance;
}
h2{ font-size:clamp(1.75rem,1.4rem + 1.4vw,2.6rem); }
h3{ font-size:clamp(1.25rem,1.1rem + .6vw,1.6rem); }
p{ color:var(--ink-soft); max-width:62ch; }
a{ color:var(--ember); }

.eyebrow{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:"Source Sans 3",sans-serif;
  font-weight:700; font-size:.75rem;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--ember);
}
.eyebrow::before{
  content:""; width:1.5rem; height:2px; background:var(--gold);
  display:inline-block;
}

.section{ padding:5.5rem 0; }
.section-soft{ background:var(--bg-soft); }
@media (max-width:767px){ .section{ padding:3.5rem 0; } }

/* ---- Navbar ---- */
.navbar-pion{
  background:color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
.navbar-pion .navbar-brand{
  font-family:"Fraunces",serif; font-weight:600; font-size:1.15rem;
  color:var(--ink); display:flex; align-items:center; gap:.6rem;
}
.navbar-pion .nav-link{
  color:var(--ink-soft); font-weight:600; font-size:.94rem;
  padding:.5rem .9rem !important;
}
.navbar-pion .nav-link:hover,
.navbar-pion .nav-link.active{ color:var(--ember); }
.navbar-pion .navbar-toggler{
  border-color:var(--border);
}
.navbar-pion .navbar-toggler:focus{
  box-shadow:0 0 0 .2rem color-mix(in srgb, var(--ember) 25%, transparent);
}
.navbar-pion .navbar-toggler-icon{
  /* Bootstrap's default icon bakes in a fixed dark stroke colour, which
     disappears against a dark navbar in dark mode — swap in a light-stroke
     version to match the --ink light-mode/dark-mode split used elsewhere. */
  background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%2320301f' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
@media (prefers-color-scheme: dark){
  .navbar-pion .navbar-toggler-icon{
    background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23ece5d0' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  }
}
.flame-badge{
  width:2.1rem; height:2.1rem; border-radius:50%;
  background:var(--ember); color:#fff;
  display:inline-flex; align-items:center; justify-content:center;
  flex:none;
}

/* ---- Buttons ---- */
/* Keeps label centered even when a flex row stretches a button taller than its own padding */
.btn{ display:inline-flex; align-items:center; justify-content:center; text-align:center; }
.btn-ember{
  background:var(--ember); border-color:var(--ember); color:#fff;
  font-weight:600; padding:.7rem 1.5rem; border-radius:var(--radius);
}
.btn-ember:hover{ background:var(--ember-hover); border-color:var(--ember-hover); color:#fff; }
.btn-outline-forest{
  border:1.5px solid var(--forest); color:var(--forest); font-weight:600;
  padding:.65rem 1.45rem; border-radius:var(--radius); background:transparent;
}
.btn-outline-forest:hover{ background:var(--forest); color:#fff; }
.btn-outline-light-custom{
  border:1.5px solid rgba(255,255,255,.55); color:#fff; font-weight:600;
  padding:.65rem 1.45rem; border-radius:var(--radius); background:transparent;
}
.btn-outline-light-custom:hover{ background:rgba(255,255,255,.15); color:#fff; }

/* ---- Hero ---- */
.hero{
  position:relative; overflow:hidden;
  background:linear-gradient(180deg, var(--forest) 0%, var(--forest-deep) 100%);
  color:#f3eedd; padding:8.5rem 0 0;
}
.hero .eyebrow{ color:var(--gold); }
.hero .eyebrow::before{ background:var(--gold); }
.hero h1{ color:#fff; font-size:clamp(2.2rem,1.6rem + 3vw,3.6rem); line-height:1.08; }
.hero .lead-text{ color:rgba(243,238,221,.85); font-size:1.15rem; }
.hero .lead-text p{ color:inherit; max-width:none; }
.hero-treeline{ display:block; width:100%; height:auto; margin-top:4rem; }

.turnus-strip{
  background:rgba(0,0,0,.18);
  border-top:1px solid rgba(255,255,255,.12);
}
.turnus-chip{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18);
  border-radius:.6rem; padding:1rem 1.3rem;
}
.turnus-chip .num{ font-family:"Fraunces",serif; font-weight:600; color:var(--gold); font-size:1.05rem; }
.turnus-chip small{ color:rgba(243,238,221,.7); }

/* ---- Feature cards ---- */
.feature-card{
  background:var(--bg); border:1px solid var(--border); border-radius:var(--radius);
  padding:2.1rem 1.8rem; height:100%;
}
.feature-icon{
  width:3.1rem; height:3.1rem; border-radius:50%;
  background:color-mix(in srgb, var(--ember) 14%, transparent);
  color:var(--ember); display:flex; align-items:center; justify-content:center;
  font-size:1.35rem; margin-bottom:1.1rem;
}

/* ---- Theme / campaign banner ---- */
.theme-panel{
  background:var(--forest-deep); color:#f3eedd; border-radius:1rem;
  padding:3rem; position:relative; overflow:hidden;
}
.theme-panel h2{ color:#fff; }
.theme-panel p{ color:rgba(243,238,221,.82); }
.theme-badge{
  display:inline-block; background:var(--gold); color:var(--forest-deep);
  font-weight:700; font-size:.78rem; letter-spacing:.08em; text-transform:uppercase;
  padding:.35rem .8rem; border-radius:2rem; margin-bottom:1rem;
}

/* ---- CTA band ---- */
.cta-band{ background:var(--ember); color:#fff; }
.cta-band h2{ color:#fff; }
.cta-band p{ color:rgba(255,255,255,.85); margin-inline:auto; }

/* ---- Gallery ---- */
.gallery-tile{
  position:relative; aspect-ratio:4/3; border-radius:var(--radius);
  background:linear-gradient(155deg, var(--forest) 0%, var(--forest-deep) 100%);
  display:flex; align-items:flex-end; overflow:hidden; isolation:isolate;
}
.gallery-tile::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(circle at 30% 20%, rgba(255,255,255,.14), transparent 60%);
}
.gallery-tile i{ position:absolute; top:1rem; right:1rem; color:rgba(255,255,255,.55); font-size:1.4rem; }
.gallery-tile span{
  position:relative; color:#fff; font-weight:600; font-size:.92rem;
  padding:.9rem 1rem; background:linear-gradient(0deg, rgba(0,0,0,.55), transparent);
  width:100%;
}

/* ---- Accordion (Pro rodiče) ---- */
.accordion-pion .accordion-item{
  background:transparent; border:0; border-bottom:1px solid var(--border);
  border-radius:0;
}
.accordion-pion .accordion-button{
  background:transparent; color:var(--ink); font-family:"Fraunces",serif;
  font-weight:600; font-size:1.1rem; padding:1.3rem .25rem; box-shadow:none;
}
.accordion-pion .accordion-button:not(.collapsed){ color:var(--ember); }
.accordion-pion .accordion-button::after{ filter:none; }
.accordion-pion .accordion-body{ padding:0 .25rem 1.5rem; color:var(--ink-soft); }

/* ---- Contact ---- */
.contact-card{
  background:var(--bg-soft); border-radius:1rem; padding:2.5rem;
  border:1px solid var(--border);
}
.contact-row{ display:flex; gap:1rem; align-items:flex-start; margin-bottom:1.4rem; }
.contact-row i{ color:var(--ember); font-size:1.15rem; margin-top:.2rem; }
.form-control{
  background:var(--bg); border:1px solid var(--border); color:var(--ink);
  border-radius:.5rem; padding:.7rem .9rem;
}
.form-control:focus{
  background:var(--bg); color:var(--ink); border-color:var(--ember);
  box-shadow:0 0 0 .2rem color-mix(in srgb, var(--ember) 20%, transparent);
}
label.form-label{ font-weight:600; font-size:.9rem; color:var(--ink-soft); }
.map-placeholder{
  border-radius:1rem; border:1px dashed var(--border);
  background:repeating-linear-gradient(135deg, var(--bg-soft), var(--bg-soft) 10px, var(--bg) 10px, var(--bg) 20px);
  min-height:260px; display:flex; align-items:center; justify-content:center;
  color:var(--ink-soft); text-align:center; padding:2rem;
}
.map-embed{
  border-radius:1rem; overflow:hidden; border:1px solid var(--border);
  min-height:260px;
}
.map-embed iframe{ display:block; width:100%; height:100%; min-height:260px; }

/* ---- Sub-page header (shorter hero + breadcrumb) ---- */
.subhero{
  background:linear-gradient(180deg, var(--forest) 0%, var(--forest-deep) 100%);
  color:#f3eedd; padding:7.5rem 0 3rem;
}
.subhero .eyebrow{ color:var(--gold); }
.subhero .eyebrow::before{ background:var(--gold); }
.subhero h1{ color:#fff; font-size:clamp(1.9rem,1.5rem + 2vw,2.9rem); line-height:1.12; margin:.75rem 0 .9rem; }
.subhero .lead-text{ color:rgba(243,238,221,.85); font-size:1.08rem; }
.subhero .lead-text p{ color:inherit; max-width:none; margin:0; }

.breadcrumb-pion{
  display:flex; flex-wrap:wrap; gap:.4rem; align-items:center;
  font-size:.82rem; font-weight:600; color:rgba(243,238,221,.6);
  margin-bottom:1.2rem; list-style:none; padding:0;
}
.breadcrumb-pion a{ color:rgba(243,238,221,.75); text-decoration:none; }
.breadcrumb-pion a:hover{ color:var(--gold); }
.breadcrumb-pion .sep{ opacity:.5; }
.breadcrumb-pion .current{ color:#fff; }

/* ---- Section sidebar nav (info pages) ---- */
.info-sidebar{
  background:var(--bg-soft); border:1px solid var(--border);
  border-radius:1rem; padding:1.5rem;
}
.info-sidebar .sidebar-heading{
  font-family:"Source Sans 3",sans-serif; font-weight:700; font-size:.72rem;
  letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft);
  margin-bottom:1rem;
}
.info-nav{ list-style:none; padding:0; margin:0 0 1.4rem; display:flex; flex-direction:column; gap:.2rem; }
.info-nav-link{
  display:block; padding:.6rem .75rem; border-radius:.5rem;
  color:var(--ink-soft); font-weight:600; font-size:.95rem; text-decoration:none;
  border-left:3px solid transparent;
}
.info-nav-link:hover{ background:var(--bg); color:var(--ink); }
.info-nav-link.active{
  background:var(--bg); color:var(--ember); border-left-color:var(--ember);
}

/* ---- Info tiles (key facts) ---- */
.info-tile{
  background:var(--bg-soft); border:1px solid var(--border); border-radius:1rem;
  padding:1.4rem 1.5rem; height:100%;
}
.info-tile i{ color:var(--ember); font-size:1.3rem; margin-bottom:.6rem; display:block; }
.info-tile .label{ font-weight:700; font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); }
.info-tile .value{ font-family:"Fraunces",serif; font-weight:600; font-size:1.15rem; margin-top:.2rem; }

/* ---- Generic content card ---- */
.info-card{
  background:var(--bg-soft); border:1px solid var(--border); border-radius:1rem;
  padding:2rem;
}

/* ---- Checklist ---- */
.check-list{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:.65rem; }
.check-list li{ display:flex; align-items:flex-start; gap:.6rem; color:var(--ink-soft); }
.check-list i{ color:var(--forest); margin-top:.2rem; flex:none; }

.checklist-card{
  background:var(--bg-soft); border:1px solid var(--border); border-radius:.75rem;
  padding:1.5rem; height:100%;
}
.checklist-card h3{ font-size:1.05rem; margin-bottom:1rem; }

/* ---- Callout / note ---- */
.note-callout{
  display:flex; gap:.9rem; align-items:center;
  background:color-mix(in srgb, var(--ember) 10%, var(--bg-soft));
  border:1px solid color-mix(in srgb, var(--ember) 30%, var(--border));
  border-left:3px solid var(--ember);
  border-radius:.75rem; padding:1.1rem 1.3rem;
}
.note-callout i{ color:var(--ember); font-size:1.15rem; flex:none; }
.note-callout p{ margin:0; color:var(--ink); font-size:.95rem; max-width:none; }
.note-callout p strong{ font-weight:700; }

/* ---- Person cards (Vedoucí) ---- */
.person-card{
  background:var(--bg-soft); border:1px solid var(--border); border-radius:.75rem;
  padding:1.3rem 1.4rem; height:100%;
}
.person-card__icon{
  width:2.4rem; height:2.4rem; border-radius:50%;
  background:color-mix(in srgb, var(--ember) 14%, transparent);
  color:var(--ember); display:flex; align-items:center; justify-content:center;
  font-size:1.1rem; margin-bottom:.7rem;
}
.person-card__role{ color:var(--ember); font-weight:600; font-size:.85rem; margin-bottom:.3rem; }
.person-card p{ color:var(--ink-soft); }

/* ---- Info section index cards ---- */
.info-index-card{
  background:var(--bg-soft); border:1px solid var(--border); border-radius:1rem;
  padding:1.8rem; color:var(--ink); display:block; transition:border-color .15s ease;
}
.info-index-card:hover{ border-color:var(--ember); }
.info-index-card h2{ color:var(--ink); font-size:clamp(1.25rem,1.1rem + .6vw,1.6rem); }
.info-index-card p{ color:var(--ink-soft); }
.info-index-card__more{
  display:inline-flex; align-items:center; gap:.4rem; margin-top:1rem;
  color:var(--ember); font-weight:600; font-size:.9rem;
}

/* ---- Footer ---- */
.footer-pion{ background:var(--forest-deep); color:rgba(243,238,221,.75); }
.footer-pion .footer-heading{ color:#fff; font-family:"Fraunces",serif; font-weight:600; letter-spacing:.02em; }
.footer-pion a{ color:rgba(243,238,221,.75); text-decoration:none; }
.footer-pion a:hover{ color:var(--gold); }
.footer-social{
  width:2.4rem; height:2.4rem; border-radius:50%;
  border:1px solid rgba(243,238,221,.3);
  display:inline-flex; align-items:center; justify-content:center;
  color:#fff;
}
.footer-social:hover{ background:var(--ember); border-color:var(--ember); }

.skip-link{
  position:absolute; left:-999px; top:0; background:var(--ember); color:#fff;
  padding:.6rem 1rem; z-index:2000; border-radius:0 0 .4rem 0;
}
.skip-link:focus{ left:0; }