/* =====================================================================================================================
   MEBLE DLA DEWELOPERA — komponenty stron tresciowych (2026-11-12): hero z liniami wymiarowymi, sekcja „zero montazu”,
   rzut interaktywny (demo), linie wykonczenia, atuty, os procesu, producent, opinie, CTA, kolekcje, katalog, produkt, pakiety.
   Wspolne tokeny: mdd.css. Kalkulator: wycena.css.
*/
/* HERO */
.hero { padding-block: clamp(28px, 5vw, 64px) clamp(48px, 7vw, 96px); border-bottom: 1px solid var(--linia); }
.hero-g { display: grid; grid-template-columns: 1.02fr 1fr; gap: clamp(28px, 5vw, 72px); align-items: center; }
.hero h1 { margin-bottom: 22px; }
.hero .lead { font-size: clamp(1.05rem, 1.4vw, 1.2rem); color: var(--grafit-3); max-width: 54ch; margin-bottom: 28px; }
.hero-m { margin-top: 44px; }
.hero-m b { font-size: clamp(1.8rem, 3vw, 2.6rem); }
.hero-f { margin: 0; position: relative; }
.hero-zdj { position: relative; aspect-ratio: 4 / 3.3; overflow: hidden; background: var(--grafit); box-shadow: var(--cien); }
.hero-zdj img { width: 100%; height: 100%; object-fit: cover; }
.hero-wym { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.hero-wym path { stroke: rgba(251, 248, 243, .9); stroke-width: 1.3; fill: none; vector-effect: non-scaling-stroke; }
.hw { position: absolute; color: #fff; background: rgba(43, 39, 36, .7); padding: 4px 7px; font-size: .68rem; }
.hw-ls { left: 50%; top: 7%; transform: translate(-50%, -50%); }
.hw-lw { right: 4%; top: 52%; transform: translate(50%, -50%) rotate(90deg); }
.hero-f figcaption { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: 10px; color: var(--szary); }
.hero-f figcaption .mono { font-size: .66rem; }
.hero-wyc { position: absolute; left: clamp(-56px, -4vw, -16px); bottom: -34px; width: min(330px, 86%); background: var(--papier); border: 1px solid var(--linia-2); padding: 16px 18px; box-shadow: 0 24px 50px -20px rgba(43, 39, 36, .45); }
.hero-wyc > .mono { color: var(--mosiadz-ciem); font-size: .64rem; }
.hero-wyc > b { display: block; font: 400 1.45rem/1.1 var(--serif); margin-top: 6px; }
.hero-wyc > small { color: var(--szary); font-size: .8rem; }
.hw-l { margin: 10px 0; border-top: 1px solid var(--linia); }
.hw-l span { display: flex; justify-content: space-between; font-size: .84rem; padding: 4px 0; border-bottom: 1px dotted var(--linia-2); }
.hw-l i { font-style: normal; color: var(--grafit-3); } .hw-l em { font-style: normal; }
.hw-s { display: flex; justify-content: space-between; align-items: baseline; }
.hw-s span { font: 400 .7rem var(--mono); color: var(--szary); text-transform: uppercase; }
.hw-s b { font: 400 1.5rem/1 var(--serif); } .hw-s b small { font: 400 .72rem var(--sans); color: var(--szary); }
.hw-a { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; font-size: .82rem; font-weight: 600; color: var(--mosiadz-ciem); }
.hw-a svg { width: 15px; height: 15px; }

/* A-02 zero montazu */
.zero { display: grid; grid-template-columns: 1fr 1.25fr; gap: clamp(28px, 5vw, 72px); align-items: start; }
.zero .cyt { font-size: clamp(1.4rem, 2.6vw, 2.2rem); color: var(--papier); }
.zero-k { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--linia-j); border: 1px solid var(--linia-j); }
.zero-k li { background: var(--grafit); padding: 22px; display: grid; gap: 6px; position: relative; }
.zero-k li > i { font-style: normal; color: var(--mosiadz-2); }
.zero-k li > svg { width: 30px; height: 30px; color: var(--mosiadz-2); margin: 6px 0; }
.zero-k b { font: 400 1.45rem/1.1 var(--serif); }
.zero-k small { color: var(--szary-2); font-size: .86rem; }
.zero-z { margin-top: 22px; }

/* A-03 demo rzutu */
.demo-st { display: flex; flex-wrap: wrap; gap: 12px 18px; align-items: center; margin-bottom: 22px; }
.d-lin { display: flex; align-items: center; gap: 10px; margin-left: auto; } .d-lin select { width: auto; min-width: 210px; }
.demo { display: grid; grid-template-columns: 1fr 1.15fr; gap: clamp(20px, 4vw, 48px); align-items: start; }
.demo-l { background: var(--papier); border: 1px solid var(--linia); padding: clamp(14px, 2vw, 24px); position: sticky; top: calc(var(--hh) + 20px); }
.demo-p { background: var(--papier); border: 1px solid var(--linia); padding: clamp(16px, 2.4vw, 28px); min-width: 0; }
.dp-h { display: flex; justify-content: space-between; gap: 16px; align-items: flex-end; border-bottom: 1px solid var(--linia); padding-bottom: 14px; flex-wrap: wrap; }
.dp-h h3 { font-size: 2.2rem; margin: 4px 0 0; } .dp-h .mono { color: var(--mosiadz-ciem); }
.dp-s { text-align: right; } .dp-s b { display: block; font: 400 1.8rem/1 var(--serif); } .dp-s small { color: var(--szary); font-size: .8rem; }
.dp-r { padding: 18px 0 8px; max-width: 560px; margin: 0 auto; }
.dp-l { list-style: none; margin: 0; padding: 0; }
.dp-l li { display: grid; grid-template-columns: 26px 64px 1fr auto; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--linia); }
.dp-l li > i { font-style: normal; width: 26px; height: 26px; border-radius: 50%; background: var(--grafit); color: #fff; display: grid; place-items: center; font: 600 .78rem var(--sans); }
.dp-f { width: 64px; height: 48px; overflow: hidden; background: var(--len-2); } .dp-f img { width: 100%; height: 100%; object-fit: cover; }
.dp-l b { font-weight: 600; font-size: .95rem; } .dp-l small { display: block; color: var(--szary); font-size: .8rem; } .dp-l a { text-decoration: none; }
.dp-l .cyf { font-size: .92rem; }
.dp-t { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 14px 0 8px; padding: 14px; background: var(--grafit); color: var(--papier); align-items: baseline; }
.dp-t span { font-size: .86rem; color: rgba(251, 248, 243, .8); } .dp-t b { font: 400 1.5rem/1 var(--serif); }

/* A-04 linie */
.linie { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.lin { background: var(--bialy); border: 1px solid var(--linia); display: flex; flex-direction: column; }
.lin-f { position: relative; aspect-ratio: 5 / 4; overflow: hidden; } .lin-f img { width: 100%; height: 100%; object-fit: cover; }
.lin-f .mono { position: absolute; left: 12px; top: 12px; background: var(--grafit); color: #fff; padding: 5px 8px; }
.lin-b { padding: 22px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.lin-b h3 { font-size: 2rem; margin: 0; } .lin-b p { color: var(--grafit-3); margin: 0; }
.lin-k { display: flex; flex-wrap: wrap; gap: 4px 12px; font: 400 .74rem var(--mono); text-transform: uppercase; letter-spacing: .06em; }
.lin-k a { text-decoration: none; color: var(--mosiadz-ciem); }
.lin-c { margin-top: auto; border-top: 1px dashed var(--linia-2); padding-top: 12px; display: flex; justify-content: space-between; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.lin-c .mono { color: var(--szary); font-size: .66rem; } .lin-c b { font: 400 1.5rem/1 var(--serif); } .lin-c small { font: 400 .74rem var(--sans); color: var(--szary); }
.lin .btn { align-self: flex-start; }

/* A-05 atuty */
.atuty { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--linia-2); border-left: 1px solid var(--linia); }
.at { padding: 28px 26px; border-right: 1px solid var(--linia); border-bottom: 1px solid var(--linia); display: flex; flex-direction: column; gap: 10px; position: relative; }
.at-i svg { width: 34px; height: 34px; color: var(--mosiadz); }
.at-n { position: absolute; right: 22px; top: 26px; color: var(--szary-2); }
.at h3 { margin: 4px 0 0; } .at p { color: var(--grafit-3); margin: 0; font-size: .96rem; }
.at-z { margin-top: auto; color: var(--szary); font-size: .64rem; }

/* A-06 os procesu */
.os { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, 1fr); gap: 0; position: relative; }
.os::before { content: ''; position: absolute; left: 0; right: 0; top: 23px; height: 1px; background: var(--grafit); }
.os li { padding: 0 18px 0 0; position: relative; }
.os-n { position: relative; display: inline-grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--grafit); color: var(--papier); font: 500 .8rem var(--mono); margin-bottom: 16px; }
.os li:nth-child(4) .os-n { background: var(--mosiadz); }
.os b { display: block; font: 400 1.35rem/1.15 var(--serif); margin-bottom: 8px; }
.os p { font-size: .9rem; color: var(--grafit-3); margin: 0; }

/* A-07 producent */
.prod { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(28px, 5vw, 80px); align-items: center; }
.prod-f { display: grid; grid-template-columns: 1fr 1fr 1fr; border-top: 1px solid var(--linia-j); border-left: 1px solid var(--linia-j); }
.prod-f div { padding: 22px 18px; border-right: 1px solid var(--linia-j); border-bottom: 1px solid var(--linia-j); }
.prod-f b { display: block; font: 400 clamp(2.2rem, 3.4vw, 3rem)/1 var(--serif); color: var(--mosiadz-2); }
.prod-f span { display: block; margin-top: 8px; font: 400 .7rem/1.4 var(--mono); text-transform: uppercase; letter-spacing: .05em; color: var(--szary-2); }
.jasny-na-ciemnym { color: var(--papier); border-color: var(--linia-j); } .jasny-na-ciemnym:hover { background: var(--papier); color: var(--grafit); }

/* A-08 opinie */
.opinie { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.op { margin: 0; padding: 28px; background: var(--papier); border: 1px solid var(--linia); display: flex; flex-direction: column; gap: 18px; }
.op blockquote { margin: 0; font: 400 1.32rem/1.35 var(--serif); }
.op blockquote::before { content: '„'; color: var(--mosiadz); font-size: 2.6rem; line-height: 0; vertical-align: -.35em; margin-right: 2px; }
.op figcaption { margin-top: auto; display: flex; flex-direction: column; gap: 4px; border-top: 1px solid var(--linia); padding-top: 12px; }
.op figcaption .mono { color: var(--szary); font-size: .62rem; }

/* A-09 FAQ i CTA */
.faq-g { display: grid; grid-template-columns: .8fr 1.4fr; gap: clamp(24px, 5vw, 80px); align-items: start; }
.faq-g > div:first-child { position: sticky; top: calc(var(--hh) + 24px); }
.cta { background-color: var(--mosiadz-3); padding-block: clamp(48px, 7vw, 90px); }
.cta-in { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; }
.cta h2 { max-width: 22ch; margin: 0; }

/* KOLEKCJE */
.kol-l { display: grid; gap: 64px; }
.kol { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(20px, 4vw, 56px); align-items: start; scroll-margin-top: calc(var(--hh) + 20px); }
.kol:nth-child(even) .kol-f { order: 2; }
.kol-f { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--grafit); }
.kol-f img { width: 100%; height: 100%; object-fit: cover; }
.kol-f .mono { position: absolute; left: 14px; bottom: 14px; background: var(--papier); padding: 6px 9px; }
.kol h2 { font-size: clamp(2.4rem, 5vw, 4rem); margin-bottom: 6px; }
.kol-m { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 12px 0 16px; font: 400 .72rem var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--szary); }
.kol-m b { color: var(--grafit); font-weight: 500; }
.dekory { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.dek { display: inline-flex; align-items: center; gap: 6px; font-size: .8rem; border: 1px solid var(--linia-2); padding: 4px 9px 4px 5px; border-radius: 999px; background: var(--papier); }
.dek i { width: 16px; height: 16px; border-radius: 50%; border: 1px solid rgba(0, 0, 0, .15); flex: none; }
.kol-p { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.kol-p a { text-decoration: none; background: var(--papier); border: 1px solid var(--linia); display: flex; flex-direction: column; }
.kol-p a:hover { border-color: var(--mosiadz); }
.kol-p span.f { aspect-ratio: 4 / 3; overflow: hidden; background: var(--len-2); } .kol-p img { width: 100%; height: 100%; object-fit: cover; }
.kol-p b { font-size: .86rem; font-weight: 600; padding: 8px 10px 0; line-height: 1.25; } .kol-p small { padding: 2px 10px 10px; color: var(--szary); font-size: .76rem; }
.lin-nav { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }

/* KATALOG */
.kat { display: grid; grid-template-columns: 270px 1fr; gap: 32px; align-items: start; padding-block: 32px 80px; }
.filtry { position: sticky; top: calc(var(--hh) + 16px); max-height: calc(100vh - var(--hh) - 32px); overflow-y: auto; padding-right: 6px; }
.filtry h4 { font: 500 .72rem var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--grafit-3); margin: 18px 0 8px; }
.filtry h4:first-child { margin-top: 0; }
.fl { display: flex; flex-direction: column; gap: 2px; }
.fl label { display: flex; align-items: center; gap: 10px; min-height: 36px; font-size: .92rem; cursor: pointer; }
.fl label small { margin-left: auto; color: var(--szary); font: 400 .72rem var(--mono); }
.kat-h { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.kat-h select { width: auto; }
.kat-n { font: 400 .74rem var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--szary); }
.fil-b { display: none; }
.akt-f { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.akt-f button { min-height: 34px; border: 1px solid var(--linia-2); background: var(--papier); border-radius: 999px; padding: 0 10px; font-size: .8rem; cursor: pointer; }

/* PRODUKT */
.pr > * { min-width: 0; }
.pr { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(24px, 4vw, 64px); padding-block: 28px 64px; align-items: start; }
.gal-g { aspect-ratio: 4 / 3; background: var(--grafit); overflow: hidden; } .gal-g img { width: 100%; height: 100%; object-fit: cover; }
.gal-m { display: flex; gap: 8px; margin-top: 8px; overflow-x: auto; padding-bottom: 4px; }
.gal-m button { flex: none; width: 88px; height: 66px; border: 2px solid transparent; padding: 0; background: var(--len-2); cursor: pointer; overflow: hidden; }
.gal-m button.on { border-color: var(--mosiadz); } .gal-m img { width: 100%; height: 100%; object-fit: cover; }
.pr-i h1 { font-size: clamp(2.2rem, 4.4vw, 3.6rem); margin-bottom: 10px; }
.pr-c { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; margin: 18px 0; padding: 16px 0; border-block: 1px solid var(--linia-2); }
.pr-c b { font: 400 2.4rem/1 var(--serif); } .pr-c small { color: var(--szary); }
.warianty { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 18px; }
.warianty button { min-height: 44px; padding: 6px 12px; border: 1px solid var(--linia-2); background: var(--papier); border-radius: var(--r); cursor: pointer; font-size: .86rem; text-align: left; display: flex; flex-direction: column; gap: 2px; }
.warianty button small { color: var(--szary); font: 400 .7rem var(--mono); }
.warianty button.on { border-color: var(--grafit); box-shadow: inset 0 0 0 1px var(--grafit); }
.pr-kup { display: grid; grid-template-columns: auto 1fr; gap: 10px; margin: 6px 0 12px; }
.pr-kup .btn { width: 100%; }
.pr-blok { background: var(--papier); border: 1px solid var(--linia); padding: 16px 18px; margin-top: 14px; }
.pr-blok h4 { font: 500 .74rem var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--grafit-3); margin: 0 0 8px; }
.pr-blok ul { margin: 0; padding-left: 18px; } .pr-blok li { margin: 3px 0; font-size: .93rem; }
.pr-dost { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--linia); border: 1px solid var(--linia); margin-top: 14px; }
.pr-dost div { background: var(--papier); padding: 12px 14px; display: flex; gap: 10px; align-items: flex-start; font-size: .88rem; }
.pr-dost svg { width: 22px; height: 22px; color: var(--mosiadz); flex: none; }
.pr-dost b { display: block; font-size: .9rem; }
.pr-opis { columns: 2; column-gap: 40px; color: var(--grafit-3); } .pr-opis p { break-inside: avoid; }
.wymiar-svg { width: 100%; max-width: 420px; display: block; margin: 10px auto 0; }
.wymiar-svg rect { fill: var(--mosiadz-3); stroke: var(--mosiadz-ciem); stroke-width: 2; }
.wymiar-svg path { stroke: var(--grafit-3); stroke-width: 1.2; fill: none; } .wymiar-svg text { font: 400 13px var(--mono); fill: var(--grafit-3); text-anchor: middle; }

/* PAKIETY */
.pk-st { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: flex-end; padding: 20px; background: var(--papier); border: 1px solid var(--linia); margin-bottom: 30px; }
.pk-st .grp { display: flex; flex-direction: column; gap: 8px; }
.pk-room { padding-block: 38px; border-top: 1px solid var(--linia-2); scroll-margin-top: calc(var(--hh) + 120px); }
.pk-room-h { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.pk-room-h h2 { margin: 0; }
.pk-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.pkk { background: var(--papier); border: 1px solid var(--linia); display: flex; flex-direction: column; min-width: 0; }
.pkk.prem { border-color: var(--grafit); }
.pkk-h { display: flex; justify-content: space-between; align-items: baseline; padding: 14px 16px; border-bottom: 1px solid var(--linia); gap: 8px; }
.pkk-h b { font: 400 1.5rem/1 var(--serif); } .pkk-h .mono { color: var(--mosiadz-ciem); }
.pkk.prem .pkk-h { background: var(--grafit); color: var(--papier); } .pkk.prem .pkk-h .mono { color: var(--mosiadz-2); }
.pkk-r { padding: 10px 16px 0; }
.pkk ol { list-style: none; margin: 0; padding: 6px 16px; flex: 1; }
.pkk li { display: grid; grid-template-columns: 22px 48px 1fr; gap: 10px; align-items: center; padding: 7px 0; border-bottom: 1px dotted var(--linia-2); font-size: .86rem; }
.pkk li > i { font-style: normal; width: 22px; height: 22px; border-radius: 50%; background: var(--grafit); color: #fff; display: grid; place-items: center; font: 600 .7rem var(--sans); }
.pkk li .f { width: 48px; height: 36px; overflow: hidden; background: var(--len-2); } .pkk li img { width: 100%; height: 100%; object-fit: cover; }
.pkk li b { font-weight: 600; display: block; line-height: 1.25; } .pkk li small { color: var(--szary); font-size: .76rem; }
.pkk li a { text-decoration: none; }
.pkk-s { padding: 12px 16px 16px; border-top: 1px solid var(--linia); display: flex; justify-content: space-between; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.pkk-s b { font: 400 1.6rem/1 var(--serif); } .pkk-s small { color: var(--szary); font-size: .78rem; }

/* tabele -> karty (mobile, standard) */
.tab { width: 100%; border-collapse: collapse; font-size: .92rem; }
.tab th { text-align: left; font: 500 .7rem var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--szary); padding: 10px 12px; border-bottom: 1px solid var(--linia-2); }
.tab td { padding: 11px 12px; border-bottom: 1px solid var(--linia); vertical-align: top; }
.tab .r { text-align: right; } .tab tfoot td { font-weight: 600; border-top: 1px solid var(--grafit); }

/* tresc prawna / dokumentow */
.dok { max-width: 820px; padding-block: 36px 80px; }
.dok h2 { font-size: 1.9rem; margin-top: 36px; } .dok li { margin: 6px 0; }
.dok .note { margin: 18px 0; }

@media (max-width: 1100px) { .os { grid-template-columns: repeat(3, 1fr); gap: 32px 0; } .os::before { display: none; } }
@media (max-width: 980px) {
  .hero-g, .zero, .demo, .prod, .kol, .pr, .faq-g { grid-template-columns: 1fr; }
  .hero-wyc { position: relative; left: 0; bottom: 0; width: 100%; margin-top: 16px; }
  .demo-l { position: static; }
  .kol:nth-child(even) .kol-f { order: 0; }
  .linie, .opinie, .pk-3 { grid-template-columns: 1fr; }
  .atuty { grid-template-columns: 1fr 1fr; }
  .kat { grid-template-columns: 1fr; }
  .filtry { position: fixed; inset: 0; z-index: 220; background: var(--papier); max-height: none; padding: 20px 20px 90px; transform: translateX(-100%); transition: transform .3s; }
  body.fil-on .filtry { transform: none; } body.fil-on { overflow: hidden; }
  .fil-b { display: inline-flex; }
  .fil-x { position: sticky; bottom: 0; display: flex !important; gap: 8px; padding-top: 14px; background: var(--papier); }
  .faq-g > div:first-child { position: static; }
  .pr-opis { columns: 1; }
}
@media (min-width: 981px) { .fil-x { display: none !important; } }
@media (max-width: 767px) {
  .zero-k { grid-template-columns: 1fr; }
  .atuty { grid-template-columns: 1fr; }
  .os { grid-template-columns: 1fr; gap: 0; }
  .os li { display: grid; grid-template-columns: 56px 1fr; padding: 0 0 22px; } .os li .os-n { grid-row: span 2; margin: 0; }
  .prod-f { grid-template-columns: 1fr 1fr; }
  .d-lin { margin-left: 0; width: 100%; } .d-lin select { flex: 1; min-width: 0; }
  .dp-s { text-align: left; }
  .dp-l li { grid-template-columns: 26px 56px 1fr; } .dp-l li > .cyf { grid-column: 3; }
  .pr-dost { grid-template-columns: 1fr; }
  .pk-st { position: static; }
  /* tabela jako karty */
  .tab thead { display: none; }
  .tab, .tab tbody, .tab tr, .tab td, .tab tfoot { display: block; width: 100%; }
  .tab tr { border: 1px solid var(--linia); background: var(--papier); margin-bottom: 10px; padding: 8px 12px; }
  .tab td { border: 0; padding: 4px 0; display: flex; justify-content: space-between; gap: 12px; text-align: right; }
  .tab td::before { content: attr(data-l); font: 500 .68rem var(--mono); text-transform: uppercase; color: var(--szary); text-align: left; }
  .tab td:first-child { font-weight: 600; text-align: left; } .tab td:first-child::before { display: none; }
  .tab tfoot td { border-top: 0; } .tab tfoot tr.raz { background: var(--grafit); } .tab tfoot tr.raz td::before { color: var(--szary-2); }
}

/* =====================================================================================================================
   SEO (2026-11-12) — strony generowane przez db/generuj-seo.py (kategorie /komody-premium, pomieszczenia /meble-premium-do-salonu,
   kolekcje /kolekcja-…-meble-premium, karty /meble-premium/<slug>) oraz naglowki H2–H5 w miejscach, gdzie wczesniej byly H4
   (stopka, filtry, bloki karty produktu). Wyglad bez zmian tam, gdzie zmienil sie tylko znacznik naglowka.
*/
h5 { font: 600 .82rem/1.3 var(--sans); letter-spacing: .02em; margin: 0 0 6px; color: var(--grafit); }
h4 { font-size: clamp(1.15rem, 1.6vw, 1.35rem); }
/* stopka statyczna: H2 (haslo) → H3 (kolumny) → H4 / H5 (kontakt) */
.st h3 { color: var(--mosiadz-2); margin: 6px 0 14px; }
.st-h2 { font: 400 clamp(1.3rem, 2vw, 1.6rem)/1.15 var(--serif); color: var(--papier); margin: 18px 0 0; max-width: 24ch; }
.st-h2 em { color: var(--mosiadz-2); font-style: italic; }
.st-h4 { font: 600 .9rem/1.3 var(--sans); color: var(--papier); margin: 0 0 4px; letter-spacing: 0; }
.st-h5 { font: 500 .7rem/1.3 var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--szary-2); margin: 14px 0 4px; }
.st-k { margin: 0 0 6px; color: rgba(251, 248, 243, .8); } .st-k a { padding: 2px 0; }
.st-in { grid-template-columns: 1.5fr repeat(4, 1fr); }
/* filtry katalogu i licznik wynikow (wczesniej H4 / span) */
.filtry .fh { font: 500 .72rem var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--grafit-3); margin: 18px 0 8px; }
.filtry .fh:first-child { margin-top: 0; }
h2.kat-n { margin: 0; line-height: 1.4; }
.kat-kat { margin-top: 22px; }
/* karta produktu: male naglowki blokow */
.pr-h { font: 500 .74rem var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--grafit-3); margin: 0 0 8px; }
.pr-kr { margin-top: 14px; color: var(--grafit-3); }
.pr-sek { padding-top: 8px; }
.pr-lead { font-size: 1.12rem; color: var(--grafit); max-width: 70ch; border-left: 2px solid var(--mosiadz); padding-left: 18px; margin: 0 0 26px; }
.pr-sek h3 { margin-top: 8px; }
.pr-spec { background: var(--papier); border: 1px solid var(--linia); padding: clamp(18px, 3vw, 30px); align-self: start; }
.pr-h2 { font-size: clamp(1.6rem, 2.6vw, 2.1rem); }
.pr-spec h3 { font-size: 1.25rem; margin: 22px 0 10px; } .pr-spec h4 { margin: 18px 0 10px; font-size: 1.1rem; }
.seo-dl { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 1px; background: var(--linia); border: 1px solid var(--linia); margin: 0; }
.seo-dl > div { background: var(--bialy); padding: 10px 12px; } .seo-dl dt { font: 400 .68rem var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--szary); }
.seo-dl dd { margin: 2px 0 0; font: 400 1.3rem/1.1 var(--serif); }
.tab-w { overflow-x: auto; }
.seo-tab { width: 100%; border-collapse: collapse; font-size: .88rem; } .seo-tab th { text-align: left; font: 400 .68rem var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--szary); padding: 6px 8px; border-bottom: 1px solid var(--linia-2); }
.seo-tab td { padding: 8px; border-bottom: 1px solid var(--linia); } .seo-tab td.cyf { white-space: nowrap; }
.seo-pakr { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 14px; }
.seo-pakr > div { border-top: 1px solid var(--linia-2); padding-top: 10px; } .seo-pakr p { margin: 0; color: var(--grafit-3); }
.seo-h2m { font-size: clamp(1.6rem, 3vw, 2.4rem); margin-bottom: 22px; }
/* strony list (kategoria / pomieszczenie / kolekcja) */
.seo-gl { display: grid; grid-template-columns: 1.25fr .75fr; gap: clamp(24px, 4vw, 56px); align-items: end; }
.seo-gl .glowa { display: block; }
.seo-gl .lead { margin: 0 0 26px; }
.seo-gl-f { margin: 0; aspect-ratio: 4 / 5; overflow: hidden; border: 1px solid var(--linia); box-shadow: var(--cien); max-height: 480px; }
.seo-gl-f img { width: 100%; height: 100%; object-fit: cover; }
.seo-metr b { font-size: clamp(1.6rem, 2.6vw, 2.4rem); }
.seo-lista { padding-top: clamp(40px, 6vw, 72px); }
.seo-kol { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 5vw, 72px); align-items: start; }
.seo-kol-p { grid-template-columns: 1.25fr 1fr; }
.seo-kol h3 { font-size: clamp(1.3rem, 2vw, 1.6rem); margin: 0 0 10px; } .seo-kol p + h3, .seo-kol .seo-chipy + h3 { margin-top: 28px; }
.seo-kol p { color: var(--grafit-3); }
.seo-opis .glowa { margin-bottom: 28px; }
.seo-chipy { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; } .seo-chipy .mono { color: var(--szary); margin-right: 8px; }
.seo-chipy a.chip { text-decoration: none; }
.seo-linie { display: grid; gap: 12px; }
.seo-lin { border-left: 2px solid var(--mosiadz); padding: 2px 0 2px 14px; } .seo-lin small { color: var(--szary); margin-left: 6px; font-weight: 400; }
.seo-lin p { margin: 2px 0 4px; } .seo-kl a { margin-right: 10px; font-size: .9rem; }
.seo-inne { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 40px; padding-top: 18px; border-top: 1px solid var(--linia-2); align-items: baseline; }
.seo-inne .mono { width: 100%; color: var(--szary); } .seo-inne a { font-size: .95rem; }
.seo-pak-l { margin-top: 26px; } .seo-pak-l h3 small { font-size: .68rem; color: var(--szary); margin-left: 8px; vertical-align: middle; }
.seo-pak-g { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--linia); border: 1px solid var(--linia); }
.seo-pak { background: var(--papier); padding: 16px 18px; }
.seo-pak h4 { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; flex-wrap: wrap; margin: 0 0 10px; }
.seo-pak h4 .cyf { font: 400 1.05rem var(--serif); color: var(--mosiadz-ciem); } .seo-pak h4 small { font: .7rem var(--mono); color: var(--szary); }
.seo-pak ul { margin: 0; padding: 0; list-style: none; } .seo-pak li { padding: 6px 0; border-top: 1px solid var(--linia); font-size: .9rem; display: flex; flex-direction: column; }
.seo-pak li small { color: var(--szary); font-size: .78rem; }
.cta-p { margin: 12px 0 0; max-width: 60ch; color: var(--grafit-3); }
/* strona glowna: kafle kategorii (A-04) */
.kat-kafle { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1px; background: var(--linia); border: 1px solid var(--linia); }
.kat-k { background: var(--papier); text-decoration: none; display: flex; flex-direction: column; transition: background .2s; }
.kat-k:hover { background: var(--bialy); color: inherit; }
.kat-f { aspect-ratio: 4 / 3; overflow: hidden; display: block; } .kat-f img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.kat-k:hover .kat-f img { transform: scale(1.04); }
.kat-t { padding: 14px 16px 16px; display: block; } .kat-t h3 { font-size: 1.35rem; margin: 0 0 4px; } .kat-t small { color: var(--szary); }
.kat-pom { margin-top: 22px; }
/* FAQ: pytanie jako H3 wewnatrz <summary> */
.faq summary h3.faq-q { font: inherit; margin: 0; display: inline; }
/* kolekcje: nazwa kolekcji H3 (pod linia H2) w rozmiarze dawnego H2 */
.kol-h { font-size: clamp(2rem, 4vw, 3.3rem); } .kol-h a { text-decoration: none; } .kol-h a:hover { color: var(--mosiadz-ciem); }
.mp-h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); margin: 28px 0 14px; }
@media (max-width: 1100px) { .st-in { grid-template-columns: 1fr 1fr 1fr; } .seo-pak-g { grid-template-columns: 1fr 1fr; } }
@media (max-width: 900px) {
  .seo-gl, .seo-kol, .seo-kol-p { grid-template-columns: 1fr; }
  .seo-gl-f { aspect-ratio: 16 / 10; max-height: 360px; order: -1; }
  .seo-pak-g { grid-template-columns: 1fr; }
}
@media (max-width: 768px) { .st-in { grid-template-columns: 1fr 1fr; } .seo-metr { grid-template-columns: 1fr 1fr; } .seo-metr > div:nth-child(3) { padding-left: 0; } .seo-metr > div:nth-child(2) { border-right: 0; } }
@media (max-width: 400px) { .st-in { grid-template-columns: 1fr; } }
/* SEO — poprawki po przegladzie (2026-11-12): naglowki sekcji opisowych na cala szerokosc, wymiary bez pustych pol siatki,
   karta produktu na telefonie: zdjecia -> nazwa i cena -> rysunek wymiarowy; tabela wariantow jako karty (standard: mobile bez tabel) */
.pr-sek .glowa, .seo-opis .glowa { display: block; }
.pr-sek .glowa h2, .seo-opis .glowa h2 { max-width: 24ch; }
.seo-dl { display: flex; flex-wrap: wrap; background: none; border: 0; gap: 0; }
.seo-dl > div { flex: 1 1 110px; border: 1px solid var(--linia); margin: 0 -1px -1px 0; }
@media (max-width: 980px) {
  .pr > div:first-child { display: contents; }
  .pr .gal-g, .pr .gal-m { order: 0; } .pr-i { order: 1; } .pr > div:first-child > .pr-blok { order: 2; margin-top: 0; }
}
@media (max-width: 767px) {
  .seo-tab thead { display: none; }
  .seo-tab tr { display: block; border: 1px solid var(--linia); background: var(--bialy); margin-bottom: 8px; padding: 6px 10px; }
  .seo-tab td { display: flex; justify-content: space-between; gap: 12px; border: 0; padding: 4px 0; text-align: right; }
  .seo-tab td::before { content: attr(data-l); font: 500 .66rem var(--mono); text-transform: uppercase; color: var(--szary); text-align: left; }
}