/*
 * Reset + skala typografii. Klasy nazwane tak samo jak w projekcie źródłowym
 * (Tailwind v4 @utility) — port jest 1:1, tylko bez warstwy Tailwinda.
 */

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
  background-color: var(--background);
  color: var(--color-body);
  font-family: var(--font-sans);
  font-size: 18px;
  font-weight: 400;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 { color: var(--foreground); }

img, svg { max-width: 100%; display: block; }
button, input, textarea, select { font: inherit; color: inherit; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }

/* ---------- Skala typografii ---------- */

.heading-1 { font-size: 56px; font-weight: 700; line-height: 1.1; }
.heading-2 { font-size: 48px; font-weight: 700; line-height: 1.15; }
.heading-2-small { font-size: 36px; font-weight: 700; line-height: 1.2; }
.heading-3 { font-size: 21px; font-weight: 600; line-height: 1.3; }

.body-text { font-size: 18px; font-weight: 400; line-height: 1.65; color: var(--color-body); }
.body-text p + p { margin-top: 1.25em; }

.body-small { font-size: 17px; font-weight: 400; line-height: 1.6; }
.list-text { font-size: 17px; font-weight: 400; line-height: 1.6; }
.price-text { font-size: 17px; font-weight: 600; line-height: 1.5; }
.stat-number { font-size: 32px; font-weight: 700; line-height: 1; }
.phone-large { font-size: 24px; font-weight: 700; line-height: 1.2; }
.small-text { font-size: 15px; line-height: 1.5; }

.eyebrow {
  display: block;
  font-size: 15px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.12em; color: var(--primary);
}
.eyebrow-on-dark, .label-on-dark {
  display: block;
  font-size: 15px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.12em; color: var(--color-mint);
}
.label-small {
  font-size: 15px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.12em; color: var(--muted-foreground);
}
.menu-text { font-size: 15px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; }

.text-body { color: var(--color-body); }
.text-muted-custom { color: var(--muted-foreground); }
.footer-muted { color: #adb3b0; }
.text-white { color: #fff; }
.text-mint { color: var(--color-mint); }

.form-note { font-size: 15px; line-height: 1.5; color: var(--muted-foreground); }

/* Jedna wspólna reguła dla akapitu wprowadzającego pod H2 w każdej sekcji: szeroki limit
   (krótkie wstępy mieszczą się w jednej-dwóch liniach), a text-wrap: pretty pilnuje, żeby
   w ostatniej linii nie został sam wyraz. Nie dodawać własnych max-width w szablonach. */
section .heading-2 + .body-text,
section .heading-2 + .intro-text,
section .heading-2 + p {
  max-width: 68rem;
  text-wrap: pretty;
}

/* Treść z edytora WP (single/page) — te same tokeny, luźniejsze reguły niż w sekcjach. */
.stc-content h2 { font-size: 32px; font-weight: 700; line-height: 1.2; margin-top: 2.5rem; margin-bottom: 1rem; }
.stc-content h3 { font-size: 21px; font-weight: 600; line-height: 1.3; margin-top: 2rem; margin-bottom: 0.75rem; }
.stc-content p { margin-top: 1.25rem; }
.stc-content p:first-child { margin-top: 0; }
.stc-content ul, .stc-content ol { margin-top: 1.25rem; padding-left: 1.5rem; }
.stc-content ul { list-style: disc; }
.stc-content ol { list-style: decimal; }
.stc-content li + li { margin-top: 0.5rem; }
.stc-content a { color: var(--primary); text-decoration: underline; text-underline-offset: 2px; }
.stc-content a:hover { color: var(--color-accent-dark); }
.stc-content img { margin-top: 1.5rem; border-radius: 8px; }
.stc-content hr { margin: 2.5rem 0; border: 0; border-top: 1px solid var(--border); }
.stc-content blockquote {
  margin-top: 1.5rem; padding-left: 1.5rem; border-left: 3px solid var(--color-gold);
  font-style: italic; color: var(--muted-foreground);
}

@media (max-width: 767px) {
  .heading-1 { font-size: 36px; }
  .heading-2 { font-size: 32px; }

  /* Minimalne pole dotyku na mobile — dostępność i wygoda kciuka. */
  a, button, summary { min-height: 44px; }
}