/* Układ stron regulaminów. Kolory i typografia wyłącznie z colors_and_type.css. */
* { box-sizing: border-box; }
body { margin: 0; }

.doc-header,
.layout,
.home,
.doc-footer {
  max-width: 1160px;
  margin: 0 auto;
  padding-left: var(--space-4);
  padding-right: var(--space-4);
}

.doc-header {
  padding-top: var(--space-8);
  padding-bottom: var(--space-8);
  border-bottom: 1px solid var(--stroke);
}
.logo { width: 200px; max-width: 60%; height: auto; display: block; margin-bottom: var(--space-8); }
.doc-header .eyebrow { color: var(--gold-500); margin-bottom: var(--space-4); }
.doc-header h1 { font-size: clamp(1.75rem, 5vw, var(--fs-48)); max-width: 22ch; }
.meta { margin-top: var(--space-4); color: var(--fg-quiet); font-size: var(--fs-14); }

.layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-8); padding-top: var(--space-8); padding-bottom: var(--space-10); }
@media (min-width: 1000px) {
  .layout { grid-template-columns: 280px minmax(0, 1fr); }
  .toc { position: sticky; top: var(--space-6); align-self: start; max-height: calc(100vh - 48px); overflow-y: auto; }
}

.toc { font-size: var(--fs-14); }
.toc-title { color: var(--fg-white); font-weight: 600; margin-bottom: var(--space-3); }
.toc ol { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--stroke); }
.toc li a { display: block; padding: var(--space-1) var(--space-4); color: var(--fg-mute); }
.toc li a:hover { color: var(--gold-500); }

.doc { max-width: 72ch; }
.doc h2 {
  font-size: var(--fs-24);
  color: var(--fg-white);
  margin: var(--space-9) 0 var(--space-4);
  padding-top: var(--space-4);
  border-top: 1px solid var(--stroke);
  scroll-margin-top: var(--space-6);
}
.doc h2:first-child { margin-top: 0; border-top: 0; padding-top: 0; }
.doc h3 { font-size: var(--fs-18); color: var(--gold-300); margin: var(--space-6) 0 var(--space-2); }
.doc p { margin: 0 0 var(--space-3); }
.doc strong { color: var(--fg-white); font-weight: 600; }
.doc ul, .doc ol { color: var(--fg-mute); margin: 0 0 var(--space-4); padding-left: var(--space-6); }
.doc li { margin-bottom: var(--space-1); }
.doc li::marker { color: var(--gold-500); }
.doc a { color: var(--gold-500); text-decoration: underline; text-underline-offset: 3px; }

.callout {
  background: var(--bg-navy-2);
  border-left: 2px solid var(--gold-500);
  padding: var(--space-4) var(--space-5);
  margin: var(--space-5) 0;
}
.callout p:last-child { margin-bottom: 0; }

.table-wrap { overflow-x: auto; margin: var(--space-4) 0 var(--space-6); }
.doc table { width: 100%; border-collapse: collapse; font-size: var(--fs-14); }
.doc th, .doc td { text-align: left; vertical-align: top; padding: var(--space-3); border-bottom: 1px solid var(--stroke); }
.doc th { color: var(--gold-500); border-bottom-color: var(--stroke-gold); }
.doc td p, .doc th p { margin: 0; }

.doc-footer { border-top: 1px solid var(--stroke); padding-top: var(--space-7); padding-bottom: var(--space-8); }
.doc-footer p { font-size: var(--fs-14); color: var(--fg-quiet); margin-bottom: var(--space-2); }
.doc-footer a:hover { color: var(--gold-500); }

/* Strona główna */
.links { display: grid; gap: var(--space-4); padding: var(--space-8) 0 var(--space-10); }
@media (min-width: 720px) { .links { grid-template-columns: 1fr 1fr; } }
.links .card { display: block; padding: var(--space-7); }
.links .card strong { display: block; color: var(--fg-white); font-family: var(--font-display); font-size: var(--fs-20); margin-bottom: var(--space-2); }
.links .card span { color: var(--fg-mute); font-size: var(--fs-14); }

/* Druk: jasne tło, token marki dla dokumentów papierowych */
@media print {
  html, body { background: #fff; color: var(--ink-on-light); }
  .toc { display: none; }
  .layout { display: block; padding: 0; }
  .doc { max-width: none; }
  .doc h1, .doc h2, .doc h3, .doc p, .doc li, .doc strong, .doc th, .doc td,
  .doc-header h1, .meta, .doc-footer p { color: var(--ink-on-light); }
  .doc th { color: var(--gold-700); }
  .callout { background: var(--bg-light); }
  .doc h2 { break-after: avoid; }
}