/* Wygląd zachowań strony bez skryptów Webflow (spec 008) - uzupełnienie stylów Webflow.
   Breakpointy strony publicznej jak w Webflow: 991px, 767px, 479px (CLAUDE.md). */

/* ---------- menu: przycisk ☰ zmienia się w krzyżyk (jak interakcja Webflow „Mobile menu”) ---------- */
.hamburger-top-line,
.hamburger-bottom-line {
  transition: transform 0.5s ease;
}

.hamburger-menu.w--open .hamburger-middle-line {
  opacity: 0;
}

.hamburger-menu.w--open .hamburger-top-line {
  transform: translateY(14px) rotate(-45deg);
}

.hamburger-menu.w--open .hamburger-bottom-line {
  transform: translateY(-14px) rotate(45deg);
}

@media screen and (max-width: 991px) {
  .w-nav-menu[data-nav-menu-open] {
    animation: menu-rozwin 0.4s ease;
  }
}

@keyframes menu-rozwin {
  from {
    opacity: 0;
    transform: translateY(-0.5rem);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

/* ---------- pytania FAQ: odpowiedź rozwija się płynnie, plus obraca się, tło pytania ---------- */
.faq-single-question {
  transition: background-color 0.5s ease;
}

.faq-single-question.faq-otwarte {
  background-color: rgb(255 246 235);
}

.faq-question-bar {
  cursor: pointer;
}

.faq-content {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.5s ease;
}

.faq-content > * {
  min-height: 0;
  overflow: hidden;
}

.faq-otwarte .faq-content {
  grid-template-rows: 1fr;
}

.faq-plus-icon-vertical-line {
  transition: transform 0.5s ease;
}

.faq-otwarte .faq-plus-icon-vertical-line {
  transform: rotate(90deg);
}

.faq-single-question > .spacer-20px {
  transition: height 0.5s ease;
}

.faq-otwarte > .spacer-20px {
  height: 20px;
}

/* ---------- „Rozwiń pełny tekst” / „Zwiń tekst” ---------- */
.zwijany {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 1s ease;
}

.zwijany > * {
  min-height: 0;
  overflow: hidden;
}

.zwijany.rozwiniety {
  grid-template-rows: 1fr;
}

.read-more-links .link-collapse,
.read-more-links.rozwiniete .link-expand {
  display: none;
}

.read-more-links.rozwiniete .link-collapse {
  display: block;
}

/* ---------- płynne pojawianie się przy przewijaniu (tylko gdy działa skrypt: klasa w-mod-js) ---------- */
html.w-mod-js .pojaw-sie {
  opacity: 0;
  transition: opacity 0.5s ease 0.3s;
}

html.w-mod-js .pojaw-sie.widoczne {
  opacity: 1;
}

/* ---------- górna belka (spec 009): pokazywana dopiero po odczycie ustawienia z panelu ---------- */
html.w-mod-js .scrolled-text-block {
  display: none;
}

html.w-mod-js .scrolled-text-block.belka-widoczna {
  display: block;
}

/* ---------- kotwice sekcji strony głównej (spec 010): sekcja zaczyna się pod przyklejonym menu ---------- */
html {
  scroll-behavior: smooth;
}

#trener,
#grupy,
#terminy,
#lokalizacja,
#cennik,
#uczestnicy {
  scroll-margin-top: 92px;
}

@media screen and (max-width: 991px) {
  #trener,
  #grupy,
  #terminy,
  #lokalizacja,
  #cennik,
  #uczestnicy {
    scroll-margin-top: 56px;
  }
}

/* ---------- galeria zdjęć ---------- */
.galeria {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3rem 4rem;
  background-color: rgb(0 0 0 / 0.9);
}

.galeria-obraz {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.galeria-przycisk {
  position: absolute;
  width: 3rem;
  height: 3rem;
  padding: 0;
  font-size: 2rem;
  line-height: 1;
  color: #fff;
  background: none;
  border: 0;
  cursor: pointer;
}

.galeria-zamknij {
  top: 0.5rem;
  right: 0.5rem;
}

.galeria-poprzednie {
  top: 50%;
  left: 0.5rem;
  transform: translateY(-50%);
}

.galeria-nastepne {
  top: 50%;
  right: 0.5rem;
  transform: translateY(-50%);
}

body.galeria-otwarta {
  overflow: hidden;
}

@media screen and (max-width: 479px) {
  .galeria {
    padding: 3rem 0.5rem;
  }
}

/* ---------- wynik wysłania formularza (zamiast przełączania przez jQuery) ---------- */
.w-form-done.wynik-widoczny,
.w-form-fail.wynik-widoczny {
  display: block;
}

form.formularz-wyslany {
  display: none;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .hamburger-top-line,
  .hamburger-bottom-line,
  .faq-single-question,
  .faq-content,
  .faq-plus-icon-vertical-line,
  .faq-single-question > .spacer-20px,
  .zwijany,
  html.w-mod-js .pojaw-sie {
    transition: none;
  }

  .w-nav-menu[data-nav-menu-open] {
    animation: none;
  }
}
