/* NABOR · CANDIDATE 2026-09-17 · MOBILE PASS na bazie zamrożonego candidate-20260916
   Ładowany PO recovery-20260914.css i candidate-20260916.css. Desktop (≥1024px) ma wyglądać jak 20260916.
   Zasady: zero nowego copy. Kafelki zdjęć/wideo obok siebie (2 kolumny), długie listy w kartach cenowych
   składane, duble treści (product-rows) schowane na telefonie, opisy przy przemianach skrócone do liczb. */

/* ---------- 0. wspólne przełączniki widoczności ---------- */
.sum-m{display:none}
@media(max-width:759px){.sum-m{display:inline}.sum-d{display:none}}

/* ---------- 0b. oddech w tekście i między blokami (wszystkie szerokości) ----------
   Michał 2026-09-15: bloki tekstu bez oddechu ciężko się czyta, zbita strona traci premium. */
.wrap>p,.wrap>.lead,.pickpanel,.faq p,.plan>p,.reframe p,.priceproof p,.hypolist li span,.beyond li span,.scenes li span,.dscope .dgrid li span{line-height:1.72}
section p+p{margin-top:22px}
.wrap>.h+p,.wrap>.h+.lead{margin-top:24px}
h2.h{margin-bottom:26px}
.chap{margin-bottom:36px}
.pick{margin-top:32px}
.pickout{margin-top:28px}
.worksteps{margin-top:40px}

/* ---------- 1. Google: 4 opinie od razu, reszta pod przyciskiem ---------- */
.opwall{display:flex;flex-direction:column}
.opwall-head{order:0}
.opwall .opgrid{order:1}
.opwall .opgrid--tail{order:2}
.opwall .opmore{order:3}
@media(max-width:759px){
  .opwall .opgrid--tail{display:none;order:4}
  .opwall:has(.opmore[open]) .opgrid--tail{display:block}
}

/* ---------- 2. karty cenowe: szczegóły składane na telefonie ---------- */
.plan__more{margin-top:12px}
.plan__more>summary{list-style:none;cursor:pointer;display:none;padding:12px 0 4px;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);border-top:1px solid var(--line)}
.plan__more>summary::-webkit-details-marker{display:none}
.plan__more>summary::after{content:"+";float:right;font-family:var(--fd);font-size:1.1rem;line-height:.8}
.plan__more[open]>summary::after{content:"–"}
.plan__more .plan__head:first-of-type{margin-top:4px}
@media(max-width:1023px){
  .plan__more>summary{display:block}
}

/* ---------- 3. TELEFON ---------- */
@media(max-width:759px){
  :root{--sec:clamp(84px,16vw,120px)}
  .chap{margin-bottom:30px}
  .wrap>.h+p,.wrap>.h+.lead{margin-top:22px}
  .wrap>.lead{font-size:.98rem}
  section p+p{margin-top:20px}
  .ctarow{margin-top:34px}

  /* hero: liczby zaufania ciaśniej */
  .trust{gap:10px}
  .trust b{font-size:1.5rem}

  /* proof: nagrania podopiecznych obok siebie */
  .vids{grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
  .vcard{max-height:none;border-radius:10px}
  .vcard .play{width:46px;height:46px;font-size:1rem;top:42%;box-shadow:0 0 0 6px rgba(212,168,83,.14)}
  /* postery mają wypalone napisy u dołu: przy 2 kolumnach podpis dostaje kryjące tło, żeby się nie nakładały */
  .vcard .cap{padding:26px 10px 10px;font-size:.68rem;line-height:1.3;background:linear-gradient(180deg,rgba(7,6,6,0) 0,rgba(7,6,6,.96) 24px,rgba(7,6,6,.96) 100%)}
  .vcard .cap b{font-size:.98rem;margin-bottom:3px}
  .proof .small{margin-top:12px;font-size:.84rem}

  /* proof: liczby pod suwakiem */
  .nums{gap:12px;justify-content:space-between}
  .nums b{font-size:clamp(1.7rem,7.4vw,2.4rem)}
  .nums span{font-size:.54rem}

  /* proof: cztery przemiany w dwóch kolumnach, opis skrócony do liczb */
  .bapairs{margin-top:48px;grid-template-columns:1fr 1fr;gap:12px 10px}
  .bapairs .proofstrip-head{grid-column:1/-1}
  .bapairs figcaption{padding:9px 10px 11px;font-size:.78rem;line-height:1.4}
  .bapairs figcaption b{font-size:.56rem;letter-spacing:.1em;margin-bottom:3px}
  .bapairs figcaption .fc-more{display:none}
  .proofgrid{gap:10px}
  .pairbox{gap:5px}

  /* proof: co wraca pierwsze */
  .beyond{gap:8px}
  .beyond li{padding:12px 12px 13px}
  .beyond li span{font-size:.9rem;line-height:1.45}
  .beyond-head{margin-top:44px}
  .pv{margin-top:28px}
  .pv video{max-width:200px}
  .pv figcaption span{font-size:.9rem}
  .kchange__q li{font-size:.98rem}

  /* google */
  .opwall{margin-top:40px}
  .googlehead strong{font-size:clamp(2.6rem,11vw,4rem)}
  .googlehead p{font-size:.94rem}

  /* 04: wybór */
  .pick{gap:10px}
  .pick li button{padding:13px 14px 12px 40px}
  .pick b{font-size:1.2rem}
  .pick span{font-size:.9rem}

  /* 05: za co płacisz */
  .worksteps{margin-top:40px;gap:22px}
  .wstep{padding:16px 16px 17px}
  .hypo{margin-top:48px}
  .hypolist{gap:10px;margin-top:24px}
  .hypolist li{padding:12px 14px}
  .hypolist li span{font-size:.9rem}
  .dcard{margin-top:32px}
  .dcard__props{grid-template-columns:repeat(3,1fr);gap:6px}
  .dcard__props div{padding:6px 8px}
  .dcard blockquote{font-size:.88rem;line-height:1.55}
  .nocopy{margin-top:44px}
  .dscope{margin-top:44px}
  .dscope .dgrid{grid-template-columns:1fr 1fr;gap:8px}
  .dscope .dgrid li{padding:16px 12px 14px}
  .dscope .dgrid li::after{font-size:1.3rem;right:10px;top:8px}
  .dscope .dgrid li span{font-size:.84rem;line-height:1.42}
  .dscope .dgrid li:last-child{grid-column:1/-1}

  /* 06: 168 */
  .s168 .inst{margin-top:28px;padding:12px 10px 14px}
  .loop{margin-top:30px;font-size:.62rem}

  /* 07: sześć miesięcy */
  .split{gap:16px;margin-top:30px}
  .split .pic{aspect-ratio:16/10}
  .scope{gap:10px;margin-top:30px}
  .scope li{padding:12px 12px 11px}
  .scope b{font-size:1.3rem}
  .scope span{font-size:.84rem}
  .months{margin-top:32px;grid-template-columns:1fr 1fr;gap:10px}
  .months li{grid-template-columns:1fr;gap:4px;padding:12px 12px 12px}
  .months li b{grid-row:auto;font-size:1.6rem}
  .months li strong{font-size:.95rem}
  .months li span{font-size:.84rem;line-height:1.4}
  .keeps{margin-top:40px}
  .szesc .pay{gap:10px}
  .szescend{margin-top:36px}

  /* 08: sceny obok siebie */
  .scenes{grid-template-columns:1fr 1fr;gap:10px;margin-top:32px}
  .scenes li{padding:14px 13px 15px}
  .scenes li span{font-size:.9rem;line-height:1.5}
  .dreamend{margin-top:32px}

  /* 09: kto */
  .ktogrid{margin-top:32px;gap:10px}
  .ktogrid div{padding:12px 12px 13px}
  .ktogrid b{font-size:1.2rem}
  .ktogrid div span{font-size:.9rem}

  /* 10: kogo biorę */
  .qualgrid{gap:12px;margin-top:32px}

  /* 11: cena */
  .holo{margin-top:32px;padding:16px 14px}
  .holo__shots{gap:10px;margin-top:14px}
  .price .product-rows{display:none}
  .price>.wrap>.small{margin-top:22px}
  .planvs{margin-top:32px;gap:10px}
  .planvs__col{padding:14px}
  .planvs__col li{font-size:.92rem}
  .plans{margin-top:36px;gap:14px}
  .plan{padding:18px 16px 14px}
  .plan>strong{font-size:clamp(2.4rem,11vw,3.6rem);margin:10px 0 10px}
  .plan>p{font-size:.94rem}
  .plan .payment{font-size:.88rem}
  .plan li{padding:9px 0 9px 20px;font-size:.92rem}
  .tiers{margin-top:32px}
  .trow{padding:13px 14px;gap:6px}
  .trow span{font-size:.86rem;padding-left:88px}
  .reframe{margin-top:32px;padding:16px 15px 17px}
  .priceproof{margin-top:36px;padding:16px}

  /* 13: obiekcje */
  .faq summary{padding:13px 14px;font-size:.96rem}
  .faq p{padding:0 14px 14px;font-size:.94rem}
  .pv--faq video{max-width:160px}

  /* 14: formularz */
  .steps li{padding:11px 0}
  .steps span{font-size:.92rem}
  .chips span{font-size:.58rem;padding:6px 9px}
  .embed{margin-top:30px}
}

/* ---------- 4. tablet (760-1023): to samo, co telefon, tam gdzie ma sens ---------- */
@media(min-width:760px) and (max-width:1023px){
  .vids{grid-template-columns:repeat(4,1fr);gap:12px}
  .vcard{max-height:none}
  .price .product-rows{display:none}
}