/* Mikrokoncept strony: druk na planszy z siatką milimetrową (jak scena miesiąca i „Zmiana biura”), papier, żywe cyfry.
   Plik wygenerowany przez narzedzia/miks2/hero-kadry-buduj.mjs. Rozmiary: tekst ≥ 14 px, kwoty ≥ 16 px; od 1001 px skala okna --p (wysoki.css), poniżej px. */
.hero-rozliczenia-podatkowe { --t: 14.5px; --k: 16px; --kod: 30px; --w: 26px; position: relative; margin: 0; min-width: 0; }
@media (max-width: 1000px) { .hero-rozliczenia-podatkowe { max-width: 640px; } }
@media (min-width: 1001px) { .hero-rozliczenia-podatkowe { --t: calc(15 * var(--p)); --k: calc(17 * var(--p)); --kod: calc(34 * var(--p)); --w: calc(30 * var(--p)); } }
.hero-rozliczenia-podatkowe-plansza { container: hero / inline-size; padding: clamp(14px, 2.4vw, 28px) clamp(12px, 2.4vw, 26px); border: 1px solid var(--linia);
  background-image: linear-gradient(90deg, rgba(38, 64, 90, .5) 1px, transparent 1px), linear-gradient(rgba(38, 64, 90, .5) 1px, transparent 1px); background-size: 56px 56px; }
.hero-rozliczenia-podatkowe-papier { position: relative; padding: clamp(12px, 2vw, 22px) clamp(12px, 2.2vw, 24px) clamp(10px, 1.8vw, 18px); background: var(--papier); color: var(--tusz); border-radius: 2px; box-shadow: var(--cien-papieru);
  rotate: .4deg; font: 500 var(--t)/1.3 var(--sans); }
.hero-rozliczenia-podatkowe-gora { display: flex; align-items: baseline; flex-wrap: wrap; gap: .2em .9em; padding-bottom: .6em; margin-bottom: .2em; border-bottom: 1.5px solid var(--druk-l); }
.hero-rozliczenia-podatkowe-kod { font: 800 var(--kod)/1 var(--sans); font-stretch: 75%; font-variation-settings: "opsz" 84; letter-spacing: -.005em; color: var(--tusz); }
.hero-rozliczenia-podatkowe-nazwa { color: var(--tusz-2); }
.hero-rozliczenia-podatkowe-okres { margin-left: auto; font: 500 var(--t)/1 var(--mono); color: var(--tusz-2); white-space: nowrap; }
.hero-rozliczenia-podatkowe-kw { display: inline-block; font: 500 var(--k)/1.2 var(--mono); font-variant-numeric: tabular-nums; white-space: pre; }
.hero-rozliczenia-podatkowe-r { text-align: right; white-space: nowrap; }
.hero-rozliczenia-podatkowe-wynik { display: flex; align-items: baseline; gap: .8em; margin-top: .1em; padding-top: .5em; border-top: 1.5px solid var(--tusz); }
.hero-rozliczenia-podatkowe-opis { font-weight: 650; min-width: 0; }
.hero-rozliczenia-podatkowe-wynik .hero-rozliczenia-podatkowe-kw { margin-left: auto; color: var(--druk); font-size: var(--w); line-height: 1.1; }
.hero-rozliczenia-podatkowe-przyklad { margin: 10px 0 0; font-size: 14px; line-height: 1.3; color: var(--tx-3); }
.hero-rozliczenia-podatkowe table { width: 100%; border-collapse: collapse; }
.hero-rozliczenia-podatkowe th, .hero-rozliczenia-podatkowe td { padding: .3em 0 .26em; text-align: left; vertical-align: baseline; font-weight: 500; border-top: 1px solid var(--papier-2); }
.hero-rozliczenia-podatkowe td.hero-rozliczenia-podatkowe-r { padding-left: .55em; }
.hero-rozliczenia-podatkowe th.hero-rozliczenia-podatkowe-r, .hero-rozliczenia-podatkowe td.hero-rozliczenia-podatkowe-r { text-align: right; }
@media (max-width: 420px) { .hero-rozliczenia-podatkowe-plansza { padding: 10px 8px; } .hero-rozliczenia-podatkowe-papier { padding: 11px 10px 10px; } }
.hero-rozliczenia-podatkowe b { font: 500 1em/1 var(--mono); color: var(--druk); }
/* ruch: do pierwszego odsłonięcia kwoty ukrywa maska; hero.js nakłada ją inline (gsap.set), zdejmuje tę klasę i dopiero potem gra oś; zdjęcie awaryjne po 5 s w hero.html */
.hero-rozliczenia-podatkowe.hero-rozliczenia-podatkowe-anim [data-hk] { clip-path: inset(0 100% 0 0); }
.hero-rozliczenia-podatkowe-lot { --tlo: 0; position: absolute; left: 0; top: 0; z-index: 3; margin: 0; display: flex; visibility: hidden; pointer-events: none; font: 500 var(--k)/1.2 var(--mono); font-variant-numeric: tabular-nums; white-space: pre; will-change: transform; }
/* kopia kwoty: wspólny początek zapisu stoi, końcówka (grosze albo ostatnia cyfra) wymienia się z dokładnej na zaokrągloną; papier i cień na czas lotu */
.hero-rozliczenia-podatkowe-lot::before { content: ""; position: absolute; inset: -.3em -.4em; z-index: -1; background: var(--papier); border-radius: 2px; opacity: var(--tlo);
  box-shadow: 0 0 0 1px rgba(12, 24, 37, .12), 0 18px 30px -14px rgba(0, 0, 0, .6), 0 5px 12px -5px rgba(0, 0, 0, .45); }
.hero-rozliczenia-podatkowe-lot-t { display: grid; }
.hero-rozliczenia-podatkowe-lot-a, .hero-rozliczenia-podatkowe-lot-b { grid-area: 1 / 1; }

.hero-rozliczenia-podatkowe-ew { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(14px, 2.4vw, 26px); align-items: start; }
.hero-rozliczenia-podatkowe-ew caption, .hero-rozliczenia-podatkowe-dekl caption { padding: .55em 0 .2em; text-align: left; font-weight: 650; color: var(--tusz-2); }
.hero-rozliczenia-podatkowe-ew thead th { padding: .2em 0 .25em; font-weight: 600; color: var(--tusz-2); border-top: 0; border-bottom: 1.5px solid var(--tusz); vertical-align: bottom; line-height: 1.2; }
.hero-rozliczenia-podatkowe-ew thead th b { display: block; margin-top: .15em; }
.hero-rozliczenia-podatkowe-lp { font-family: var(--mono); color: var(--tusz-2); padding-right: .4em; }
.hero-rozliczenia-podatkowe-dow { white-space: nowrap; }
.hero-rozliczenia-podatkowe-dow .hero-rozliczenia-podatkowe-kw { font-size: var(--t); }
.hero-rozliczenia-podatkowe-ew tbody tr:first-child th, .hero-rozliczenia-podatkowe-ew tbody tr:first-child td { border-top: 0; }
.hero-rozliczenia-podatkowe-razem { display: flex; align-items: baseline; justify-content: space-between; gap: .6em; padding-top: .3em; border-top: 1.5px solid var(--tusz); font-weight: 650; }
.hero-rozliczenia-podatkowe-dekl { margin-top: .5em; }
.hero-rozliczenia-podatkowe-dekl caption small { margin-left: .6em; font-weight: 500; font-size: 1em; color: var(--tusz-2); }
.hero-rozliczenia-podatkowe-dekl th { color: var(--tusz); font-weight: 600; padding-right: .6em; }
.hero-rozliczenia-podatkowe-dekl th b { margin-left: .4em; }
.hero-rozliczenia-podatkowe-pole { font: 500 1em/1 var(--mono); color: var(--druk); }
.hero-rozliczenia-podatkowe-opis-k { display: none; }
@container hero (max-width: 539px) { .hero-rozliczenia-podatkowe-dow { display: none; } .hero-rozliczenia-podatkowe-opis-d, .hero-rozliczenia-podatkowe-dekl caption small { display: none; } .hero-rozliczenia-podatkowe-opis-k { display: inline; } }
@container hero (max-width: 289px) { .hero-rozliczenia-podatkowe-ew { grid-template-columns: minmax(0, 1fr); } }
@container hero (max-width: 340px) { .hero-rozliczenia-podatkowe-nazwa { display: none; } .hero-rozliczenia-podatkowe-razem { gap: .15em; } .hero-rozliczenia-podatkowe-ew { column-gap: 8px; } .hero-rozliczenia-podatkowe-ew td.hero-rozliczenia-podatkowe-r { padding-left: .3em; } .hero-rozliczenia-podatkowe-lp { padding-right: .2em; } }
