/*
 * Elementy strukturalne wspólne dla każdej strony klienckiej:
 * kontener, odstępy sekcji, tła alternatywne/ciemne, nagłówek sticky, stopka.
 */

.container-custom {
  width: 100%;
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 32px;
  padding-right: 32px;
}

.section-padding { padding-top: 96px; padding-bottom: 96px; }

.bg-background { background-color: var(--background); }
.section-alt, .bg-section-alt { background-color: var(--color-section-alt); }
.section-dark { background-color: var(--color-band); color: #fff; }
.border-custom { border-color: var(--border); }

@media (max-width: 767px) {
  .container-custom { padding-left: 20px; padding-right: 20px; }
  .section-padding { padding-top: 64px; padding-bottom: 64px; }
}

/* ---------- Nagłówek ---------- */

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  width: 100%;
  border-bottom: 1px solid var(--border);
  background-color: var(--background);
}

.site-header__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  height: 88px;
  gap: 1.5rem;
}

.site-header__logo img { height: 44px; width: auto; }

.site-header__nav {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 1.75rem;
  min-width: 0;
  flex-wrap: nowrap;
}
.site-header__nav a {
  white-space: nowrap;
  transition: color 150ms ease;
}
.site-header__nav a:hover { color: var(--color-accent-dark); }

/* Podmenu (pozycja z 'children' w stc_nav_items_*): rozwijane po najechaniu i z klawiatury. */
.menu-group { position: relative; }
.site-header__nav .menu-sub {
  position: absolute; top: 100%; left: 50%; z-index: 60;
  display: flex; flex-direction: column;
  min-width: 240px; padding: 12px 0; margin-top: 12px;
  background: var(--background, #fff); box-shadow: 0 12px 32px rgba(0,0,0,0.1);
  opacity: 0; visibility: hidden; transform: translate(-50%, 6px);
  transition: opacity 150ms ease, transform 150ms ease, visibility 150ms;
}
.site-header__nav .menu-sub::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; } /* mostek dla myszy */
.site-header__nav .menu-group:hover .menu-sub,
.site-header__nav .menu-group:focus-within .menu-sub { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.site-header__nav .menu-sub a { padding: 10px 24px; white-space: nowrap; }
.site-header__mobile-nav .menu-group { display: flex; flex-direction: column; }
.site-header__mobile-nav .menu-sub { display: flex; flex-direction: column; }

.site-header__actions {
  display: none;
  align-items: center;
  justify-content: flex-end;
  gap: 1.5rem;
}
.site-header__actions .phone-link {
  font-size: 15px; font-weight: 600; color: var(--primary);
  white-space: nowrap; transition: color 150ms ease;
}
.site-header__actions .phone-link:hover { color: var(--color-accent-dark); }

.site-header__mobile {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 1rem;
}
.site-header__icon-btn {
  display: flex; align-items: center; justify-content: center;
  height: 44px; width: 44px; flex-shrink: 0; color: var(--foreground);
  background: none; border: none; cursor: pointer;
}
.site-header__icon-btn.phone { color: var(--primary); }
.site-header__icon-btn svg { width: 22px; height: 22px; }

.nav-toggle__close { display: none; }
.nav-toggle.is-open .nav-toggle__open { display: none; }
.nav-toggle.is-open .nav-toggle__close { display: block; }

.site-header__mobile-panel {
  display: none;
  border-bottom: 1px solid var(--border);
  background-color: var(--background);
}
.site-header__mobile-panel.is-open { display: block; }
.site-header__mobile-panel .container-custom {
  display: flex; flex-direction: column; gap: 1.5rem; padding-top: 1.5rem; padding-bottom: 1.5rem;
}
.site-header__mobile-nav { display: flex; flex-direction: column; gap: 1rem; }
.site-header__mobile-nav a { display: flex; min-height: 44px; align-items: center; }

@media (min-width: 1024px) {
  .site-header__inner { grid-template-columns: auto minmax(0, 1fr) auto; }
  .site-header__nav { display: flex; }
  .site-header__actions { display: flex; }
  .site-header__mobile { display: none; }
  .site-header__mobile-panel { display: none !important; }
}

/* ---------- Stopka ---------- */

.site-footer {
  background-color: #1f2321;
  color: #fff;
  padding-top: 64px;
  padding-bottom: 80px;
}
.site-footer__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 48px;
}
.site-footer__brand { display: flex; flex-direction: column; gap: 1rem; }
.site-footer__brand img { height: 44px; width: auto; }
.site-footer__social { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.25rem; }
.site-footer__social-link { display: inline-flex; align-items: center; gap: 0.75rem; min-height: 0; font-size: 15px; color: #fff; transition: color 150ms ease; }
.site-footer__social-icon {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 40px; height: 40px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.2); color: var(--color-mint);
  transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease;
}
.site-footer__social-link:hover { color: var(--color-mint); }
.site-footer__social-link:hover .site-footer__social-icon { background-color: var(--color-mint); border-color: var(--color-mint); color: #1f2321; }
.site-footer__social .stc-icon { width: 18px; height: 18px; }
.site-footer__col { display: flex; flex-direction: column; gap: 1rem; }
.site-footer__col a { transition: color 150ms ease; }
.site-footer__col a:hover { color: var(--color-mint); }
.site-footer__nav { display: flex; flex-direction: column; gap: 1rem; }
.site-footer__bottom {
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,0.15);
  display: flex; flex-direction: column; align-items: center; justify-content: space-between;
  gap: 1rem;
}

@media (min-width: 768px) {
  .site-footer__bottom { flex-direction: row; }
}

@media (min-width: 1024px) {
  .site-footer { padding-top: 64px; padding-bottom: 64px; }
  .site-footer__grid { grid-template-columns: repeat(3, 1fr); }
}

/* Układ "kolumny" (stc_footer_legal_column): nagłówki kolumn, jeden rozmiar tekstu,
   kontakt z ikonami. Telefon: marka i kontakt na całą szerokość, "Na skróty"
   i "Dokumenty" obok siebie (krótkie pozycje). */
.site-footer--columns .site-footer__grid { grid-template-columns: 1fr 1fr; gap: 40px 24px; }
.site-footer--columns .site-footer__brand,
.site-footer--columns .site-footer__contact { grid-column: 1 / -1; }
.site-footer--columns .site-footer__col { gap: 0.75rem; font-size: 15px; line-height: 1.6; }
.site-footer--columns .site-footer__col p { margin: 0; }
.site-footer--columns .site-footer__nav { gap: 0; }
/* Globalne min-height: 44px dla linków na telefonie rozjeżdżało odstępy (link
   w jednym wierszu dostawał 44px, w dwóch — swoją wysokość). Tu obszar dotyku
   daje padding, więc odstępy są równe niezależnie od długości pozycji. */
.site-footer--columns .site-footer__col a { min-height: 0; }
.site-footer--columns .site-footer__nav a,
.site-footer--columns .site-footer__legal a { display: block; padding: 0.375rem 0; }
.site-footer--columns .site-footer__legal { gap: 0; }
.site-footer--columns .site-footer__nav { margin-top: -0.375rem; }
.site-footer--columns .site-footer__legal .site-footer__heading { margin-bottom: 0.625rem !important; }
.site-footer--columns .site-footer__nav .menu-text { font-size: inherit; font-weight: 400; text-transform: none; letter-spacing: normal; }
.site-footer__heading {
  font-size: 13px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.12em; color: var(--color-mint);
  margin-bottom: 0.25rem !important;
}
.site-footer__item { display: flex; gap: 0.75rem; align-items: flex-start; }
/* W kolumnie Kontakt link do profilu wyrównany z ikonami pozostałych pozycji
   (bez kółka — 18px jak pin/telefon/koperta). */
.site-footer__contact .site-footer__social { margin-top: 0; }
.site-footer__contact .site-footer__social-icon { width: 18px; height: 18px; border: 0; border-radius: 0; }
.site-footer__contact .site-footer__social-link:hover .site-footer__social-icon { background: none; color: var(--color-mint); }
.site-footer__item .stc-icon { width: 18px; height: 18px; flex: none; margin-top: 3px; color: var(--color-mint); }
.site-footer--columns .stc-address-link { text-decoration-color: rgba(255,255,255,0.3); }
.site-footer--columns .site-footer__legal a:hover { color: var(--color-mint); }
.site-footer--columns .site-footer__bottom { margin-top: 40px; }
@media (min-width: 768px) {
  .site-footer--columns .site-footer__grid { grid-template-columns: 1.3fr 1fr 1.1fr; }
  .site-footer--columns .site-footer__contact { grid-column: auto; }
}
@media (min-width: 1024px) {
  .site-footer--columns .site-footer__grid { grid-template-columns: 1.2fr 1.3fr 0.9fr 1.1fr; gap: 40px; }
  .site-footer--columns .site-footer__brand { grid-column: auto; }
}