/* Strona zapisu na KIA — dodatek do `styl.css`.
   Wspólnego arkusza nie ruszamy: tu żyje tylko to, czego strona sprzedażowa nie ma. */

/* ── nagłówek strony ─────────────────────────────────── */
.zapisy-glowa{
  position:relative;overflow:hidden;background:var(--ws-granat);color:#fff;
  min-height:min(640px, 70vh);            /* wyższy kadr zdjęcia */
  display:flex;align-items:center;         /* napisy na środku w pionie */
  padding:64px 0;text-align:center;
}
/* zdjęcie pod gradientem — układ jak w hero strony oferty */
.zapisy-glowa img.tlo{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center 34%;
}
.zapisy-glowa::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(65,85,143,.90) 0%,rgba(102,66,117,.86) 52%,rgba(var(--ws-rozowy-rgb),.80) 100%);
}
.zapisy-glowa .wrap{position:relative;z-index:2;width:100%}
.zapisy-glowa h1{
  font-size:46px;line-height:1.12;margin:0 auto 22px;max-width:900px;color:#fff;
}
.zapisy-glowa .eyebrow{color:var(--ws-rozowy-jasny);justify-content:center}
.zapisy-glowa .eyebrow::before{background:var(--ws-rozowy-jasny)}
.zapisy-glowa .lead{
  max-width:720px;margin:0 auto;font-size:18px;line-height:1.7;color:rgba(255,255,255,.9);
}

.zapisy-kroki{
  display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:40px;
}
.zapisy-kroki .krok{
  display:flex;align-items:center;gap:12px;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.24);
  border-radius:999px;padding:12px 24px 12px 12px;font-size:14px;font-weight:600;
}
.zapisy-kroki .krok b{
  display:grid;place-items:center;width:30px;height:30px;border-radius:50%;
  background:#fff;color:var(--ws-malina);font-size:14px;font-weight:800;
}

/* ── regulamin: kolumna do czytania ──────────────────── */
.regulamin-tresc{
  max-width:820px;margin:0 auto;font-size:15.5px;line-height:1.78;color:var(--tekst-jasny);
}
.regulamin-tresc h3{
  margin:44px 0 18px;font-size:15px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ws-rozowy);border-top:1px solid rgba(var(--ws-granat-rgb),.12);padding-top:26px;
}
.regulamin-tresc h3:first-child{margin-top:0;border-top:0;padding-top:0}
.regulamin-tresc p.par{
  margin:26px 0 6px;color:var(--ws-granat);font-size:16px;
}
.regulamin-tresc p.par strong{letter-spacing:.02em}
.regulamin-tresc ul,.regulamin-tresc ol{margin:0 0 1.05em;padding-left:22px}
.regulamin-tresc li{margin-bottom:.4em}
.regulamin-tresc a{color:var(--ws-malina)}

/* ── zgoda na regulamin ──────────────────────────────── */
.zgoda{
  display:flex;align-items:flex-start;gap:14px;text-align:left;
  max-width:640px;margin:0 auto var(--odstep-ceny);
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.28);
  border-radius:18px;padding:20px 24px;transition:border-color .2s, background .2s;
}
.zgoda input[type=checkbox]{
  flex:0 0 auto;width:24px;height:24px;margin:0;accent-color:#fff;cursor:pointer;
}
.zgoda label{font-size:15px;line-height:1.6;color:#fff;cursor:pointer}
.zgoda label a{color:#fff;text-decoration:underline}
/* Próba zapisu bez akceptacji: ramka i poświata w kolorze --ws-zloty.
   Wcześniej były maliny — na różowo-fioletowym tle bloku ceny zlewały się
   z tłem i podświetlenie w ogóle nie czytało się jako podświetlenie
   (obserwacja Piotra 2026-08-19). Złoty to jedyny kolor palety kontrastujący
   z tym tłem; ten sam, którym świecą raty w cenie. */
.zgoda.brak-zgody{
  background:rgba(255,255,255,.18);
  border-color:var(--ws-zloty);
  box-shadow:0 0 0 2px var(--ws-zloty), 0 0 22px 6px rgba(var(--ws-zloty-rgb),.55);
  animation:zgoda-poswiata 1.1s ease-in-out 3;
}
@keyframes zgoda-poswiata{
  0%,100%{box-shadow:0 0 0 2px var(--ws-zloty), 0 0 18px 4px rgba(var(--ws-zloty-rgb),.45)}
  50%    {box-shadow:0 0 0 3px var(--ws-zloty), 0 0 34px 12px rgba(var(--ws-zloty-rgb),.85)}
}

/* przycisk zapisu przed zaznaczeniem zgody */
.btn.zablokowany{opacity:.55;cursor:not-allowed;box-shadow:none}
.btn.zablokowany:hover{
  transform:none;background:#fff;color:var(--ws-malina);border-color:#fff;box-shadow:none;
}

/* ── wąskie ekrany ───────────────────────────────────── */
@media (max-width:760px){
  .zapisy-glowa{min-height:min(520px, 62vh);padding:48px 0}
  .zapisy-glowa h1{font-size:31px}
  .zapisy-glowa .lead{font-size:16px}
  .zapisy-kroki{flex-direction:column;align-items:stretch}
  .regulamin-tresc{font-size:15px}
  .zgoda{padding:18px}
}

/* akapit prowadzący nad filmem (przeniesiony z nagłówka strony) */
.wideo-wstep{
  max-width:720px;margin:0 auto 44px;text-align:center;
  font-size:18px;line-height:1.7;color:var(--tekst-jasny);
}
@media (max-width:760px){
  .wideo-wstep{font-size:16px;margin-bottom:32px}
}

/* nagłówek nad akapitem prowadzącym — bez dużej przerwy między nimi */
#wideo .naglowek{margin-bottom:20px}
#wideo .naglowek h2{color:var(--tekst)}

/* nadtytuły na tej stronie bez kreski (decyzja Piotra 2026-08-18) */
.eyebrow::before{display:none}
