/* OFERTA — końcowa sekcja sprzedażowa (#oferta). Układ „W osi” wybrany przez Kubę 06.10.2026 w nocy (narzędzie final.hvmbak-landing.pages.dev);
   od 06.10 po południu BEZ wielkiej ceny: wariant 1 z narzędzia https://cta.hvmbak-landing.pages.dev/ (~/Desktop/strony/HVMBAK-DOSTEP, pliki cta*),
   tekst w dwóch stopniach. Poprzednie wersje: _kopie/2026-10-06-przed-cta/ (z ceną 999 ZŁ krojem HVMBAK Pro) i _kopie/2026-10-06-przed-finalem/ (dwie listy).
   Czarny panel, wszystko na środku: etykieta z licznikiem dni do końca pre-orderu (liczba biała), tekst Kuby (pierwsze zdanie duże, drugie mniejsze
   i cichsze), zdanie o zestawie, a pod nim blok zakupu 470 px: trzy wiersze warunków, zdanie o cenie po pre-orderze tuż nad przyciskiem, przycisk,
   zdanie o regulaminie. Cena 999 zł stoi tylko w przycisku (Kuba: wielka cena „za bardzo bije w oczy”).
   Duże zdanie ma grubość 400 (Kuba 06.10 w nocy: 500 było „za grube… wygląda jakby to był jakiś cytat ważny”).
   CENA: 1199 zł to zapowiedź ceny PO pre-orderze, zwykłym zdaniem; bez przekreślenia i bez „oszczędzasz” (ta cena jeszcze nie obowiązywała, UOKiK).
   WARUNKI: „bez limitu czasu” = regulamin § 2 ust. 3 (czas nieoznaczony; NIE „na zawsze” ani „dożywotnio”, bo kurs można zamknąć po 12 miesiącach),
   „bez dopłaty” = § 2 ust. 4, „jednorazowa, bez subskrypcji” (słowa Kuby) dotyczy kursu.
   id="oferta" musi zostać: celuje w nie przyklejony przycisk „Dołącz” (HVMBAK-DOSTEP/przycisk). */

.kn-of{position:relative;z-index:2;background:var(--black);color:#fff;
  --f-etyk:'Inter',-apple-system,BlinkMacSystemFont,'SF Pro Text',system-ui,sans-serif;--of-cichy:rgba(255,255,255,.62);--of-tekst:rgba(255,255,255,.84);--of-kreska:rgba(255,255,255,.2);
  padding:calc(var(--vh,1svh)*16) 5vw calc(var(--vh,1svh)*16)}
.kn-of-in{position:relative;max-width:760px;margin:0 auto;display:flex;flex-direction:column;align-items:center;text-align:center}
.kn-of-etyk{display:flex;justify-content:center;align-items:center;gap:10px;margin:0 0 26px;font-family:var(--f-etyk);font-stretch:normal;font-weight:600;font-size:10.5px;
  letter-spacing:.08em;text-transform:uppercase;line-height:1;color:var(--of-cichy)}
.kn-of-etyk i{flex:none;width:9px;height:2.5px;background:var(--baby)}
.kn-of-etyk b{font-weight:600;color:#fff;white-space:nowrap}                     /* liczba dni w liczniku */
/* tekst w dwóch stopniach: pierwsze zdanie duże, ale zwykłej grubości (500 → 400), drugie mniejsze i cichsze */
.kn-zd{margin:0;max-width:17em;font-family:'Archivo',sans-serif;font-stretch:var(--text-wdth);font-weight:400;font-size:clamp(25px,2.9vw,42px);line-height:1.17;
  letter-spacing:-.004em;color:#fff;text-wrap:balance}
.kn-zd2{margin:clamp(18px,1.9vw,26px) 0 0;max-width:31em;font-family:'Archivo',sans-serif;font-stretch:var(--text-wdth);font-weight:400;font-size:clamp(17px,1.5vw,21px);
  line-height:1.45;color:var(--of-tekst);text-wrap:pretty}
.kn-zest{width:100%;margin:clamp(34px,4vw,56px) 0 0;padding:14px 0 0;border-top:1px solid var(--of-kreska);font-family:'Archivo',sans-serif;font-stretch:var(--text-wdth);
  font-weight:400;font-size:clamp(15.5px,1.22vw,17px);line-height:1.5;color:var(--of-tekst);text-wrap:pretty}
.kn-zest b{display:block;margin:0 0 9px;font-family:var(--f-etyk);font-stretch:normal;font-weight:600;font-size:10.5px;line-height:1;letter-spacing:.08em;text-transform:uppercase;
  color:var(--of-cichy)}

/* blok zakupu: wąski, na środku, w środku od lewej: warunki, zdanie o cenie po pre-orderze, przycisk, zdanie o regulaminie */
.kn-kup{width:min(470px,100%);margin-top:clamp(40px,4.6vw,64px);text-align:left}
.kn-potem{margin:20px 0 0;font-family:'Archivo',sans-serif;font-stretch:var(--text-wdth);font-weight:400;font-size:17px;line-height:1.4;color:var(--of-tekst)}
.kn-potem b{font-weight:600;color:#fff;white-space:nowrap}
.kn-spec{list-style:none;margin:0;padding:0}
.kn-spec li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:10px 0 9px;border-top:1px solid var(--of-kreska);font-family:'Archivo',sans-serif;
  font-stretch:var(--text-wdth);font-weight:400;font-size:16.5px;line-height:1.3;color:#fff}
.kn-spec li:last-child{border-bottom:1px solid var(--of-kreska)}
.kn-spec b{font-family:var(--f-etyk);font-stretch:normal;font-weight:600;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--of-cichy);white-space:nowrap}
.kn-spec span{text-align:right}
.kn-btn{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:22px;padding:23px 26px 22px;background:#fff;color:var(--black);
  font-family:var(--f-etyk);font-stretch:normal;font-weight:600;font-size:14px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;white-space:nowrap;
  transition:background .18s,color .18s,transform .18s}
.kn-btn i{font-style:normal;transition:transform .18s}
.kn-btn:hover{background:var(--orange);color:#fff;transform:translateY(-1px)}      /* jak każdy przycisk na stronie: po najechaniu pomarańcz */
.kn-btn:hover i{transform:translateX(4px)}
.kn-btn:focus-visible{outline:2px solid var(--baby);outline-offset:3px}
/* zdanie o akceptacji regulaminu: drobny druk pod przyciskiem (wymóg Przelewy24, zdanie zamiast pola wyboru) */
.kn-zgoda{margin:14px 0 0;font-family:'Archivo',sans-serif;font-stretch:var(--text-wdth);font-weight:400;font-size:13.5px;line-height:1.4;color:var(--of-cichy)}
.kn-zgoda a{color:var(--of-tekst);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;transition:color .18s}
.kn-zgoda a:hover{color:#fff}
.kn-zgoda a:focus-visible{outline:2px solid var(--baby);outline-offset:3px}
@media(prefers-reduced-motion:reduce){.kn-btn,.kn-btn i,.kn-zgoda a{transition:none}}

@media(max-width:820px){
  .kn-of{padding:calc(var(--vh,1svh)*11) 18px calc(var(--vh,1svh)*11)}
  .kn-of-etyk{margin-bottom:18px;font-size:9.5px;letter-spacing:.06em}
  .kn-zd{font-size:26px;line-height:1.18}
  .kn-zd2{margin-top:16px;font-size:16.5px;line-height:1.46}
  .kn-zest{margin-top:28px;padding-top:12px;font-size:15px;line-height:1.46}
  .kn-zest b{font-size:9.5px;margin-bottom:8px}
  .kn-kup{width:100%;margin-top:36px}
  .kn-potem{margin-top:16px;font-size:15.5px}
  .kn-spec li{padding:9px 0 8px;font-size:15px}
  .kn-spec b{font-size:9.5px}
  .kn-btn{margin-top:18px;padding:19px 18px 18px;font-size:12.5px;letter-spacing:.08em}
  .kn-zgoda{margin-top:12px;font-size:12.5px}
}
