/* reset */
* { margin:0; padding:0; box-sizing: border-box; }
html,body { height:100%; min-height: 100vh;}

/* tło */
body {
  background-image: url("../images/background.png");
  background-color: #000;
  background-size: cover;
  background-repeat: no-repeat;
  font-family: 'Fredoka One', sans-serif;
  color: white;
  -webkit-font-smoothing:antialiased;
}

/* NAV - desktop first with responsive shrink */
.navigator-topbar-content{
  position: fixed;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 32px);
  max-width: 1200px;
  height: 72px;
  display:flex;
  align-items:center;
  gap: 12px;
  padding: 0 16px;
  background: rgba(0,0,0,0.9);
  border-radius: 10px;
  z-index: 60;
}

/* title */
.navigator-topbar-title-container { width: 18%; display:flex; justify-content:center; align-items:center; }
.navigator-topbar-title { font-size: 26px; color: #fff; }

/* main menu - visible on wide screens */
.navigator-topbar-menu-content { width: 60%; display:flex; justify-content:center; align-items:center; }
.navigator-topbar-menu-list { list-style:none; display:flex; gap: 40px; font-size:18px; }
.navigator-topbar-menu-list a { color: #fff; text-decoration:none; }
.navigator-topbar-media-container { width: 22%; display:flex; justify-content:center; gap:18px; align-items:center; }

/* icons */
.navigator-topbar-icon { width: 32px; height:auto; display:block; }

/* HAMBURGER - hidden on desktop */
.nav-toggle {
  display:none;
  background:none;
  border:0;
  cursor:pointer;
  padding:8px;
}
.hamburger{
  display:block;
  width:28px;
  height:2px;
  background:#fff;
  position:relative;
}
.hamburger::before, .hamburger::after{
  content:"";
  position:absolute;
  left:0;
  width:28px;
  height:2px;
  background:#fff;
}
.hamburger::before { top:-8px; }
.hamburger::after  { top:8px; }

/* MOBILE DRAWER */
.mobile-drawer{
  position: fixed;
  top:0;
  left:0;
  height:100vh;
  width: 280px;
  max-width: 80%;
  background: #000;
  transform: translateX(-110%);
  transition: transform 0.28s ease;
  z-index: 80;
  padding: 40px 20px;
  overflow-y:auto;
}
.mobile-drawer.open { transform: translateX(0); }
.mobile-drawer nav ul { list-style:none; display:flex; flex-direction:column; gap:18px; }
.mobile-drawer nav a { color:#fff; font-size:18px; text-decoration:none; }
.drawer-media { margin-top: 24px; display:flex; gap:12px; }
.drawer-media img { width:36px; height:auto; }

/* overlay */
.drawer-overlay {
  position:fixed;
  inset:0;
  background: rgba(0,0,0,0.45);
  z-index:70;
}

/* HERO */
.faq-hero{padding:120px 16px 24px}
.faq-hero-inner{max-width:1200px;margin:0 auto;text-align:center}
.faq-hero h2{font-size:clamp(24px,5vw,40px);margin-bottom:8px}
.faq-hero p{font-size:clamp(14px,2.4vw,18px);color:#d0d0d0}

/* FAQ list */
.faq-list{max-width:1200px;margin:12px auto;padding:0 16px 48px;display:flex;flex-direction:column;gap:12px}
.faq-item{border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,.06)}

/* question (ciemniejsze tło) */
.faq-question{
  width:100%;text-align:left;padding:16px 18px;font-size:18px;background:rgba(0,0,0,.9);
  color:#fff;border:0;cursor:pointer;display:flex;justify-content:space-between;align-items:center;
}
.faq-question::after{content:"+";font-weight:700}

/* answer (jaśniejsze tło) */
.faq-item[open] .faq-question::after{content:"–"}
.faq-answer{background:rgba(255, 255, 255, 0.349);padding:18px;color:#e6e6e6;font-size:16px;line-height:1.5}

/* accessible show/hide handling via [hidden] (we toggle hidden in JS) */
.faq-answer[hidden]{display:none}

/* footer */
/* SITE FOOTER with ® */
.site-footer {
  flex-shrink: 0;
  margin-top: auto;
  background: rgba(0,0,0,0.9);
  padding: 16px 0;
  text-align: center;
}
.site-footer-inner { max-width:1200px; margin:0 auto; font-size:14px; }
.registered { font-weight:700; margin-left:6px; }

/* links */
a:link,a:visited{color:#fff;text-decoration:none} a:hover{color:#b6b6b6;text-decoration:underline}

/* RESPONSIVE */
@media (max-width:920px){
  .navigator-topbar-menu-content{display:none}
  .nav-toggle{display:block;margin-left:auto}
  .navigator-topbar-media-container{display:none}
  .faq-hero{padding-top:100px}
  .faq-list{padding:0 12px 48px}
}
@media (max-width:420px){
  .faq-question{font-size:16px;padding:14px}
  .faq-answer{font-size:14px;padding:14px}
  .mobile-drawer{width:85%}
}



/* --- sticky footer fix --- */
html, body {
  height: 100%;
  min-height: 100vh;
}
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

/* main zajmuje pozostałą przestrzeń; zostaw miejsce pod fixed navbar
   navbar: top:16px; height:72px -> padding-top = 16px + 72px = 88px */
main {
  flex: 1 0 auto;
  padding-top: calc(72px + 16px); /* zmień jeśli wysokość navbaru inna */
}

/* stopka nie kurczy się i siedzi na dole */
.site-footer {
  margin-top: auto;
  flex-shrink: 0;
  background: rgba(0,0,0,0.9);
}