/* sprzedaz.css: elementy sprzedażowe (02.10). Kotwica przed cenami, 3 karty, gwarancja, „zmiana jest mała”,
   ankieta „Twój plan porządku”, „Pewnie myślisz…”, dopiski przy CTA. Mobile first, bez animacji poza drobnymi przejściami. */

/* hero i kontakt: dopiski */
.hero .lead{margin-bottom:14px}
.cta-dopisek{margin-bottom:12px;font:600 14px/1.4 var(--f-tekst);color:var(--noc-tekst)}
@media (min-width:1024px){.hero .lead{margin-bottom:20px}.cta-dopisek{margin-bottom:14px;font-size:15px}}
.kontakt-zasady{display:grid;gap:8px;max-width:62ch;margin-top:28px}
.kontakt-zasady li{position:relative;padding-left:32px;font-size:16px;line-height:1.5;color:var(--noc-tekst)}
.kontakt-zasady li::before{content:"";position:absolute;left:0;top:2px;width:20px;height:20px;background:var(--ik-ok-z) center/contain no-repeat}
.kontakt-zasady a{color:var(--zolty);text-underline-offset:3px}

/* koszt: rama straty */
.ak-strata{font-weight:700}
.ak-duzy .ak-tresc p.ak-strata{color:var(--tusz)}

/* koszt: ankieta */
.ankieta{margin-top:56px;padding:26px 20px 22px;border:2px solid var(--tusz);border-radius:var(--r-karta);background:var(--karta)}
.ankieta .etykieta{margin-bottom:14px}
.ankieta h3{font:600 clamp(1.9rem,1.3rem + 2.4vw,3rem)/1.08 var(--f-display);text-transform:uppercase;text-wrap:balance}
/* zwinięty formularz: summary w stylu akordeonu, otwarty od razu tylko przy zapisanym wyborze (sprzedaz.js) */
.ankieta-fold{margin-top:18px;border-top:1.5px solid var(--tusz)}
.ankieta .ankieta-fold:last-of-type{border-bottom:0}
.ankieta-fold>summary{min-height:64px;padding:14px 0}
.ankieta-fold .ak-t{font-size:17px}
.ankieta-fold .ak-plus{border-color:var(--tusz)}
.ankieta-fold[open]>summary{border-bottom:1px solid var(--linia)}
.ankieta-cialo{padding:4px 0 2px}
.ankieta-pola{min-width:0;margin:16px 0 0;padding:0;border:0}
.ankieta-pola legend{padding:0;font-size:16.5px;font-weight:800}
.ankieta-opis{margin:4px 0 12px;font-size:15px;line-height:1.5;color:var(--tusz2)}
.przel{position:relative;display:flex;align-items:center;gap:14px;min-height:60px;margin-top:8px;padding:12px 14px;border:1.5px solid var(--linia);border-radius:14px;background:var(--papier2);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background-color .2s,border-color .2s}
.przel input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.przel-pole{position:relative;flex:none;width:28px;height:28px;border:2px solid var(--tusz);border-radius:8px;background:var(--karta);transition:background-color .2s}
.przel-pole::after{content:"";position:absolute;inset:3px;background:var(--ik-ok-z) center/contain no-repeat;opacity:0;transform:scale(.6);transition:opacity .2s,transform .3s var(--ease)}
.przel-t{font-size:16.5px;font-weight:700;line-height:1.35}
.przel:hover{border-color:var(--tusz)}
.przel:has(input:checked){border-color:var(--tusz);background:var(--zolty-jasny)}
.przel input:checked+.przel-pole{background:var(--tusz)}
.przel input:checked+.przel-pole::after{opacity:1;transform:none}
.przel:has(input:focus-visible){outline:3px solid var(--tusz);outline-offset:3px}
.ankieta-wynik{margin-top:18px;padding:18px 18px 16px;border-radius:16px;background:var(--tusz);color:var(--noc-tekst)}
.wynik-pusty{font-size:15.5px;line-height:1.5;color:var(--noc-mute)}
.ankieta:not(.ma) .ankieta-wynik{border:1.5px dashed #BDBDB5;background:transparent}
@media (max-width:1023px){.ankieta:not(.ma) .ankieta-wynik{display:none}}
.ankieta:not(.ma) .wynik-pusty{color:var(--tusz2)}
.ankieta:not(.ma) .wynik-pelny,.ankieta.ma .wynik-pusty{display:none}
.wynik-tytul{font:600 clamp(1.55rem,1.2rem + 1.5vw,2.2rem)/1.1 var(--f-display);text-transform:uppercase}
.wynik-tytul b{font-weight:700;color:var(--zolty);white-space:nowrap}
.wynik-pod{margin-top:6px;font-size:15px;line-height:1.45;color:var(--noc-mute)}
.wynik-lista{margin-top:12px;counter-reset:w}
.wynik-lista li{display:flex;gap:12px;padding:9px 0;border-top:1px solid var(--noc-linia);font-size:15.5px;font-weight:700;line-height:1.4;counter-increment:w}
.wynik-lista li::before{content:counter(w,decimal-leading-zero);flex:none;font:500 12px/1.75 var(--f-mono);color:var(--zolty)}
.ankieta-wa{width:100%;gap:8px;margin-top:16px;padding-inline:14px;font-size:15.5px}
@media (min-width:1024px){
  .ankieta{padding:44px 44px 40px}
  .ankieta-cialo{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:48px;align-items:start}
  .ankieta-cialo .ankieta-pola{margin-top:0}
  .ankieta-cialo .ankieta-wynik{margin-top:0}
  .ankieta-wa{width:auto}
}

/* założyciel: dowód z własnej firmy */
.zal-dowod{position:relative;max-width:52ch;margin-top:36px;padding:18px 0 0 22px;border-top:1px solid var(--noc-linia);font-size:16.5px;line-height:1.55;color:var(--noc-mute)}
.zal-dowod::before{content:"";position:absolute;left:0;top:26px;width:8px;height:8px;background:var(--zolty);box-shadow:0 0 0 4px rgba(255,196,0,.18)}
.zal-dowod b{display:block;margin-bottom:4px;font-size:clamp(1.15rem,1rem + .6vw,1.45rem);font-weight:800;line-height:1.35;color:var(--noc-tekst)}
@media (min-width:1024px){.zal-dowod{grid-column:2;margin-top:28px}}

/* cena: kotwica na przykładzie */
.kotwica{max-width:1140px;margin:0 auto 32px;padding:22px 20px 24px;border:1px solid var(--linia);border-radius:var(--r-karta);background:var(--karta)}
.kotwica-glowa{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}
.kotwica-tytul{font:500 12px/1.3 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--tusz2)}
.kotwica .chip-dane{padding:6px 9px;font-size:10px}
.kotwica-tor li{display:grid;justify-items:start;gap:6px;padding:16px 0}
.kotwica-tor li+li{border-top:1px solid var(--linia)}
.kotwica-k{font:700 clamp(2.5rem,1.8rem + 3vw,4rem)/1 var(--f-display);letter-spacing:-.01em;font-variant-numeric:tabular-nums;white-space:nowrap}
.kotwica-a .kotwica-k{font-size:clamp(3.1rem,2.1rem + 4.4vw,4.75rem)}
.kotwica-b .kotwica-k{color:var(--czerwony)}
@media (max-width:480px){.kotwica-glowa{flex-direction:column;align-items:flex-start;gap:8px}}
.kotwica-o{max-width:32ch;font-size:15px;line-height:1.45;color:var(--tusz2)}
.kotwica-wniosek{padding-top:16px;border-top:2px solid var(--tusz);font-size:clamp(1.15rem,.95rem + .9vw,1.6rem);font-weight:800;line-height:1.3;letter-spacing:-.012em;text-wrap:balance}
@media (min-width:960px){
  .kotwica{padding:30px 36px 32px}
  .kotwica-tor{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:10px 0 20px}
  .kotwica-tor li{align-content:start;padding:8px 24px}
  .kotwica-tor li:first-child{padding-left:0}
  .kotwica-tor li+li{border-top:0;border-left:1px solid var(--linia)}
}

/* cena: trzy karty */
.plan-dzien{margin:2px 0 12px;font:500 12.5px/1.35 var(--f-mono);letter-spacing:.02em;color:var(--tusz2)}
.plan-wyrozniony .plan-dzien{color:var(--noc-tekst)}
.plan-zysk{max-width:36ch;margin:-8px 0 24px;padding-left:12px;border-left:3px solid var(--zolty);font-size:15px;line-height:1.45;color:var(--noc-tekst)}
.plan-wycena{font:600 clamp(1.7rem,1.4rem + 1vw,2.2rem)/1.05 var(--f-display);text-transform:uppercase}
.plan-miara{border:1.5px dashed #BDBDB5;background:transparent}
.plan-poza{margin-bottom:10px;font:500 11px/1.3 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--tusz2)}
/* „Na miarę” to prace płatne osobno: neutralny myślnik zamiast ✓ */
.plan-miara .plan-lista li::before{left:3px;top:23px;width:13px;height:2px;background:var(--tusz2)}
@media (max-width:959px){.plany-3 .plan-wyrozniony{order:-1}}
@media (min-width:960px) and (max-width:1199px){
  .plany-3 .plan-miara{grid-column:1/-1}
  .plany-3 .plan-miara .plan-lista{columns:2;column-gap:32px}
  .plany-3 .plan-miara .plan-lista li{break-inside:avoid}
  .plany-3 .plan-miara .plan-cta{max-width:360px}
}
@media (min-width:1200px){
  .plany-3{max-width:1240px;grid-template-columns:minmax(0,1fr) minmax(0,1.14fr) minmax(0,.86fr);gap:18px;align-items:start}
  .plany-3 .plan{padding:38px 28px 30px}
  .plany-3 .plan-wyrozniony{padding:46px 32px 36px}
  .plany-3 .plan-badge{right:28px;top:38px}
  .plany-3 .plan-wyrozniony .plan-badge{right:32px;top:46px}
  .plany-3 .plan-kwota{font-size:clamp(3.6rem,1.2rem + 3.4vw,5.4rem)}
  .plany-3 .plan-miara{margin-top:24px}
  .cena .kotwica,.cena .decyzja,.cena-pewnosc,.plany-3~.cena-dodatki{max-width:1240px}
}
.decyzja{max-width:1140px;margin:22px auto 0;font-size:16px;font-weight:700;text-align:center;text-wrap:balance}

/* cena: gwarancja i „zmiana jest mała” */
.cena-pewnosc{display:grid;gap:14px;max-width:1140px;margin:36px auto 0}
.gwarancja,.zmiana{padding:26px 22px 24px;border-radius:var(--r-karta);background:var(--karta)}
.gwarancja{border:2px solid var(--tusz)}
.zmiana{border:1px solid var(--linia)}
.gwarancja .etykieta{margin-bottom:12px;color:var(--tusz)}
.gwarancja .etykieta .ik{width:20px;height:20px}
.gwarancja h3,.zmiana h3{margin-bottom:18px;font:600 clamp(1.85rem,1.4rem + 1.9vw,2.75rem)/1.12 var(--f-display);text-transform:uppercase;text-wrap:balance}
.gwar-dni{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}
.gwar-dni p{flex:1 1 130px;display:grid;align-content:start;gap:6px;padding:12px 14px 14px;border:1px solid var(--linia);border-radius:14px;background:var(--papier2)}
.gwar-dni b{font:700 2.3rem/1 var(--f-display);font-variant-numeric:tabular-nums}
.gwar-dni span{font-size:13.5px;line-height:1.35;color:var(--tusz2)}
.gwar-dni .gwar-10{border-color:var(--zolty);background:var(--zolty-jasny)}
.gwarancja>p{font-size:16px;line-height:1.55}
.gwarancja>p.gwar-warunek{margin-top:10px;font-size:14.5px;color:var(--tusz2)}
.gwarancja a{color:var(--tusz);font-weight:700;text-underline-offset:3px}
.zmiana-lista li{position:relative;padding:12px 0 12px 32px;border-top:1px solid var(--linia);font-size:15.5px;line-height:1.5;color:var(--tusz2)}
.zmiana-lista li::before{content:"";position:absolute;left:0;top:14px;width:20px;height:20px;background:var(--ik-ok) center/contain no-repeat}
.zmiana-lista b{color:var(--tusz)}
/* telefon: ciaśniej, żeby #cena nie rosła */
@media (max-width:600px){
  .gwarancja,.zmiana{padding:22px 18px 18px}
  .gwarancja h3,.zmiana h3{margin-bottom:14px;font-size:1.7rem}
  .zmiana-lista li{padding:10px 0 10px 30px;font-size:15px}
  .zmiana-lista li::before{top:12px}
}
@media (min-width:960px){
  .cena-pewnosc{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:44px}
  .gwarancja,.zmiana{padding:36px 36px 32px}
}

/* FAQ: „Pewnie myślisz…” */
.obawy{margin-bottom:32px;padding:24px 20px 8px;border-radius:var(--r-karta);background:var(--tusz);color:var(--noc-tekst)}
.obawy h3{margin-bottom:6px;font:600 clamp(1.85rem,1.4rem + 1.9vw,2.6rem)/1.05 var(--f-display);text-transform:uppercase}
/* każda obawa zwinięta (akordeon na ciemnym tle) */
.obawy{padding-bottom:12px}
.obawy .ak{border-top:1px solid var(--noc-linia)}
.obawy .ak:first-child{border-top:0}
.obawy .ak:last-of-type{border-bottom:0}
.obawy .ak>summary{min-height:64px;padding:14px 0}
.obawy .ak-t{font-size:17.5px;font-weight:800;line-height:1.35;color:var(--noc-tekst)}
.obawy .ak-plus{border-color:#4A4A50;color:var(--noc-tekst)}
.obawy .ak>summary:hover .ak-plus{border-color:var(--noc-tekst)}
.obawy .ak[open] .ak-plus{color:var(--tusz)}
.obawy .ak-tresc{padding-bottom:14px}
.obawy-lista p{font-size:15.5px;line-height:1.5;color:var(--noc-mute)}
.obawy-lista a{display:flex;align-items:center;gap:6px;width:max-content;min-height:44px;margin-top:4px;font-weight:700;color:var(--zolty);text-underline-offset:3px}
.obawy-lista a::after{content:"↓";text-decoration:none}
.obawy-lista a[href="#cena"]::after,.obawy-lista a[href="#preise"]::after{content:"↑"}
.obawy :focus-visible{outline-color:var(--zolty)}
@media (min-width:1024px){.obawy{padding:32px 32px 16px}.obawy .ak-t{font-size:19px}}