/* === LEGAL LAYOUT dla Polityki (spójny z Regulaminem) === */
.hero-compact {
  min-height: 40svh;
  display: grid;
  place-items: center;
  text-align: center;
}

.legal-layout {
  display: grid;
  grid-template-columns: 1fr;   /* mobile: jedna kolumna */
  gap: var(--gap, 24px);
}

/* Spis treści – ukryty na mobile, sticky na desktopie */
.legal-toc { display: none; }
.legal-toc nav ol {
  list-style: decimal-leading-zero;
  padding-left: 1.125rem;
  margin: 0;
}
.legal-toc a { display:inline-block; padding:.25rem 0; text-decoration:none; }
.legal-toc a:hover { text-decoration: underline; }

/* Artykuł */
.legal{
  background: var(--paper, #F8F8F6);
  border-radius: 14px;
  padding: clamp(16px, 2.2vw, 32px);
  line-height: 1.75;
  font-size: clamp(16px, 1.05vw + .6rem, 18px);
  color: var(--black, #0A0A0A);
  text-wrap: pretty;
}
.legal h2{
  font-weight: 700;
  font-size: clamp(20px, 1.2vw + .8rem, 28px);
  margin: 1.25em 0 .5em;
  scroll-margin-top: calc(var(--nav-h) + 16px); /* linki z TOC nie chowają się pod navem */
}
.legal p, .legal li { color: var(--graphite, #1C1C1C); }
.legal strong { font-weight: 600; }

.legal ul, .legal ol { padding-left: 1.25rem; margin: .5rem 0 1rem; }
.legal a { color: inherit; text-underline-offset: 2px; }

.legal .legal-updated {
  margin-top: 2rem;
  font-size: .95em;
  color: var(--muted, #6F6F6F);
}

/* Tabele – bezpieczne na mobile */
.legal .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.legal table { width:100%; border-collapse: collapse; font-size:.95em; }
.legal th, .legal td { padding:.6rem .8rem; border-bottom:1px solid rgba(0,0,0,.08); }

/* Cytaty/info */
.legal blockquote{
  margin:1rem 0; padding:.8rem 1rem; border-left:4px solid var(--gold, #D4AF37);
  background: var(--paper-2, #F2F1EE); border-radius: 8px;
}

/* Breakpoint – TOC po prawej */
@media (min-width: 992px) {
  .legal-layout {
    grid-template-columns: minmax(220px, 280px) 1fr;
    align-items: start;
  }
  .legal-toc {
    display: block;
    position: sticky;
    top: calc(var(--nav-h) + 16px);
    background: var(--paper, #F8F8F6);
    border-radius: 14px;
    padding: 16px 18px;
    max-height: calc(100svh - 96px);
    overflow: auto;
  }
}

/* Estetyczne odstępy między sekcjami */
.legal section + section { margin-top: 1.25rem; }

/* Bezpieczne paddingi kontenerów na małych ekranach */
.section-light .container,
.section-paper .container{
  padding-left: clamp(16px, 4vw, 32px);
  padding-right: clamp(16px, 4vw, 32px);
}

/* Media w treści */
.legal img, .legal video, .legal iframe{
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

/* Preferencje ruchu */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important}
}



/* Większe „ramki” tylko na stronach prawnych */
.page-legal .container{
  /* większy margines od krawędzi na dużych ekranach */
  width: min(100% - clamp(32px, 6vw, 96px), var(--maxw));
}

/* Hero bardziej oddechowy (tak jak w regulaminie) */
.hero-compact{
  padding-block: clamp(40px, 8vh, 96px);
}

/* Lepszy odstęp między kolumnami TOC ↔ treść */
.legal-layout{
  gap: clamp(18px, 2.4vw, 32px);
}

/* Czytelniejsze „powietrze” w artykule */
.legal{
  padding: clamp(20px, 2.6vw, 36px);
}

/* Delikatne odstępy w spisie treści */
.legal-toc nav ol li{ margin: 6px 0; }

/* Bezpieczne paddingi wewnątrz kontenerów (mobile i tablet) */
.section-light .container,
.section-paper .container{
  padding-left: clamp(20px, 5vw, 48px);
  padding-right: clamp(20px, 5vw, 48px);
}

/* Dodatkowa przerwa nad sekcją z treścią */
.page-legal main {
  margin-top: clamp(32px, 6vh, 64px);
}
