/* doorfit „kino” na podstronach (01.11.2026): jasne tło pod zdjęciami drzwi (decyzja Michała),
   a rama strony jak na nowej stronie głównej: ciemna belka i stopka, czarno-białe logo, kwadratowe przyciski w akcencie,
   cienkie wielkie litery Tomorrow. Nakładany NA style.css. */
/* czcionki Tomorrow 200/300/500 i Sora 300: lokalnie w assets/fonty (fonty.css) */

:root{
  --bg:#F4F1EC; --card:#ffffff; --ink:#0B0A09; --muted:#6E6860; --line:#E2DCD3;
  --dark:#0B0A09; --dark2:#141210; --on-dark:#F3EFE8; --on-dark-muted:#A39D94;
  --accent:#E94625; --accent-ink:#fff; --radius:0px; --radius-lg:0px;
}
body{background:var(--bg)}
::selection{background:var(--accent);color:#fff}

/* typografia jak na stronie głównej: cienkie wielkie litery, pogrubione słowo */
.display{font-weight:300;letter-spacing:-.02em;line-height:.92}
.display b,.display strong,.display .accent{font-weight:700}
.eyebrow{font-family:var(--display);font-weight:500;font-size:.72rem;letter-spacing:.3em;color:var(--muted)}

/* nawigacja: ciemna belka na całą szerokość */
.nav{position:sticky;top:0;margin:0;max-width:none;padding:0;background:rgba(11,10,9,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);z-index:60}
.nav-in{max-width:1440px;margin:0 auto;background:transparent;backdrop-filter:none;border:0;border-radius:0;padding:12px max(20px,env(safe-area-inset-left,0px))}
.nav .logo{color:var(--on-dark)}
.nav-links{font-family:var(--display);font-weight:500;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--on-dark)}
.nav-links a{opacity:.8}.nav-links a:hover{opacity:1;color:var(--accent)}
.menu-btn{background:transparent;border-color:rgba(243,239,232,.25)}
.menu-btn span{background:var(--on-dark)}
.nav-links.open{background:var(--dark2);color:var(--on-dark);border:1px solid rgba(243,239,232,.12);box-shadow:0 30px 60px rgba(0,0,0,.4)}
.nav-links.open a:hover{background:#1C1916}

/* logo: czarno-biały napis (door cienko, fit grubo, .pl mniejsze i szare) */
.logo{font-family:var(--display);font-weight:300;font-size:1.5rem;letter-spacing:-.02em;text-transform:lowercase}
.logo b{color:inherit;font-weight:700}
.logo small{font-size:.55em;font-weight:500;color:var(--on-dark-muted);letter-spacing:0;margin-left:1px}

/* przyciski: kwadratowe, w akcencie, napis wielkimi literami */
.btn{background:var(--accent);color:#fff;font-family:var(--display);font-weight:500;font-size:.76rem;letter-spacing:.16em;text-transform:uppercase}
.btn .arr{background:rgba(0,0,0,.22)}
.btn.light{background:var(--card);color:var(--ink)}
.btn.light .arr{background:var(--accent)}
.btn:hover{transform:none;filter:brightness(1.08)}

/* wybrane elementy: czarne zamiast domyślnych */
.chip[aria-pressed="true"],.or-marki .chip.on,.kl-prod button[aria-pressed="true"]{background:var(--ink);color:#fff}

/* ciemne sekcje, stopka, pasek na telefonie, czat */
.dark,.cta,.reviews,.offer.hot{background:var(--dark2)}
footer{background:var(--dark);color:var(--on-dark-muted);border-top:0}
footer a{color:var(--on-dark)}
.mbar{background:rgba(11,10,9,.95)}
.mbar-tel{background:var(--accent)}
.mbar-wyc{background:var(--on-dark);color:var(--ink)}
.mbar-wyc svg{stroke:var(--ink)}
.chat-fab{background:var(--dark);font-family:var(--display);font-weight:500;letter-spacing:.1em;text-transform:uppercase;font-size:.76rem}
.chat-h{background:var(--dark)}

/* kwadratowo jak na stronie głównej (style.css ma tu zaokrąglenia i pigułki) */
.wstecz,.chat-fab,.chat-fab .dot,.menu-btn,.chip,.chips button,.search,.search input,.achip,.tag,.odr-znak,.kl-btn,.qty,.qty button,.presety button,.do-gory,.baner-ai,.baner-ai-b,.mbar a,.mbar button,.consent,.consent button,.chat,.msg,.chat-f input,.chat-f button,.sw,.fsw,.fbox,.kat-bar select,.atuty-m span,.mbar-tel,.mbar-wyc,.btn,.card,.prod,.offer,.quote,.opt,.osc,.filtry,.pp-szybko,.or-pas,.odr-pas,.promo-kl img{border-radius:0}
/* bez pomarańczowej poświaty za nagłówkiem */
.hero::before,body::before{display:none}
.promo-img{background:var(--dark2)}

/* baner cookies czytelny także na ciemnej stronie głównej */
.consent{color:var(--ink)}
body.dom .consent{background:#141210;color:#F3EFE8;border:1px solid rgba(243,239,232,.13)}
body.dom .consent-nie{color:#A39D94}

/* Strona główna: delikatniej (decyzja Michała 01.11.2026). Pomarańczowy zostaje tylko przy kontakcie i wycenie:
   przyciski, telefon, czat, formularz, suwak. Słowa-klucze w nagłówkach: białe z cienką pomarańczową kreską. */
body.dom .k-dsp .k-a{color:inherit;background:linear-gradient(#E94625,#E94625) left 100%/100% .055em no-repeat;padding-bottom:.1em}
body.dom .k-hook b{color:#F3EFE8}
body.dom .k-hook{border-color:rgba(243,239,232,.3)}
body.dom .k-sv-big span{color:#F3EFE8}
body.dom .k-sv-big small b{color:#E94625}
body.dom .k-mq .k-t span::after{color:rgba(243,239,232,.25)}
body.dom .k-fr .k-pr small{color:#A39D94}
body.dom .k-facts .k-st,body.dom .k-rate .k-st{color:#D9B48A}
body.dom .k-door .k-msg li b::before,body.dom .k-steps li::before{background:rgba(243,239,232,.45)}
body.dom .k-bt.k-all{background:#1C1916;border:1px solid rgba(243,239,232,.2);color:#F3EFE8}
body.dom .k-bt.k-all:hover{border-color:#E94625}
body.dom .k-cue::after{background:rgba(243,239,232,.5)}
body.dom .k-hero h1 .k-ln{padding-bottom:.26em;margin-bottom:-.22em}
body.dom .k-hero h1 .k-a{background-position:left 100%;padding-bottom:.04em}
body.dom .k-hook{margin-top:clamp(30px,4.2vw,68px)}   /* odstęp rośnie z wielkością hasła, żeby kreska nie wchodziła na pole −30% */   /* w haśle linia ma overflow:hidden: kreska wyżej, żeby jej nie ucinało */

/* kreska rysuje się płynnie od lewej (pomysł Michała): w haśle po wjechaniu napisu, w innych nagłówkach przy przewinięciu */
@keyframes kreska{from{background-size:0% .055em}to{background-size:100% .055em}}
body.dom .k-hero h1 .k-a{animation:kreska 1.1s cubic-bezier(.65,0,.2,1) 1.25s both}
body.dom .k-rv .k-a{background-size:0% .055em;transition:background-size 1.1s cubic-bezier(.65,0,.2,1) .5s}
body.dom .k-rv.k-on .k-a{background-size:100% .055em}
@media(prefers-reduced-motion:reduce){body.dom .k-hero h1 .k-a{animation:none}body.dom .k-rv .k-a{background-size:100% .055em;transition:none}}

/* Bobo przejmuje wycenę: na dolnym pasku telefonu zostaje sam „Zadzwoń” (01.11.2026) */
.mbar-tel{flex:1 1 100%!important;background:var(--accent)!important;color:#fff;font-family:var(--display);font-weight:500;letter-spacing:.14em;text-transform:uppercase;font-size:.85rem}
.mbar-tel::after{content:" 506 24 26 28";margin-left:.4em;font-weight:700;letter-spacing:.04em}

/* czat zawsze jasny i czytelny, także na ciemnej stronie głównej (zgłoszenie Michała 01.11.2026: tekst w kolorze tła) */
.chat{color:#0B0A09;color-scheme:light}
.chat-h,.chat-h b,.chat-h button{color:#fff}
.chat-h small{color:#A39D94}
.msg.ai,.chips button,.chips.akcje button{color:#0B0A09}
.chips.akcje button.glowny{color:#fff}
.chat-f input,.tel-f input{color:#0B0A09;background:#fff;color-scheme:light}
.chat-f input::placeholder{color:#8a8a93}
.chat-note{color:#6E6860}

/* pasek nawigacji na średnich ekranach: bez łamania numeru telefonu i nazw */
.nav .btn,.nav-links a{white-space:nowrap}
@media(max-width:1240px){.nav-links{gap:16px;font-size:.64rem;letter-spacing:.14em}}

/* stopka: informacja prawna (obszar sprzedaży, art. 66/71 KC) – czytelna, ale drobna */
footer .stopka-prawna{display:block;font-size:.78em;line-height:1.5;opacity:.85;max-width:90ch}

/* nagłówki sekcji: kreska pod słowem-kluczem nie może nachodzić na następną linię (zgłoszenie 02.11).
   inline-block powiększa wiersz o miejsce na kreskę, więc kolejna linia odsuwa się w dół. */
body.dom .k-hd .k-dsp .k-a,body.dom .k-promo .k-dsp .k-a{display:inline-block;line-height:1;padding-bottom:.12em;margin-bottom:.1em;background-position:left 100%}
