/*
Theme Name: Katarzyna Mołas
Template: generatepress
Version: 4.0.0
Text Domain: katarzyna-molas
Description: Marka „Fala”, kierunek „Rozmowa w gabinecie” (12.10.2026): Newsreader 500 (opsz 36) w nagłówkach, Satoshi w tekście i interfejsie; biel, piasek, atrament, żar. Zdjęcia zawsze w całości. Zasady: marka-katarzyna-molas.md.
*/

/* ---------- Fonts (assets/fonts/LICENSES.txt) ----------
   Newsreader: OFL 1.1, Production Type. The voice of the page: headings, Kasia's sentences, the three situations, product names.
   Satoshi: Fontshare, ITF FFL 2.0, file as distributed. Everything functional: text, buttons, prices, numbers, forms.
   Cabinet Grotesk stays only inside the outlined logo SVG. */
/* Newsreader: variable instance wght 400–600 with the full opsz axis, subset to Latin with Polish (113 KB instead of the 441 KB TTF); built with fontTools, name table "Newsreader Web" (OFL). Source TTF kept in work/2026-10/fonty/. */
@font-face { font-family: "Newsreader"; src: url(assets/fonts/newsreader-web.woff2) format("woff2"); font-weight: 400 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Satoshi"; src: url(assets/fonts/satoshi-variable.woff2) format("woff2"); font-weight: 300 900; font-style: normal; font-display: swap; }

/* ---------- Tokens: every colour has one job ---------- */
:root {
  --ink: #17151B;         /* atrament: tekst, logo, drobne elementy (numery, znaczniki, przełącznik), przycisk na żarze */
  --ink-2: #2E2A31;       /* atrament po najechaniu */
  --paper: #FFFFFF;       /* biel: tło strony */
  --sand: #F4EFE7;        /* piasek: sekcja akcentu i panele (podsumowanie zamówienia, karty na bieli) */
  --card: #FFFFFF;        /* pola i karty */
  --ember: #FF6A3D;       /* żar: przycisk, fala, podkreślenia i dekoracje (atrament na żarze 6,4:1); nie tekst i nie tło sekcji */
  --muted: #5A534D;       /* tekst pomocniczy (7,6:1 na bieli, 6,6:1 na piasku) */
  --line: #DDD5CA;        /* linie i obramowania */
  --line-soft: rgba(23, 21, 27, .14); /* linie na piasku */
  --line-strong: #8F877C; /* obramowanie pól (3,5:1 na bieli) */
  --error: #9E3627;
  --ok: #2E6340;
  --wait: #7A5310;


  --night: #17151B;       /* atrament jako tło jednej sekcji na stronę: trzy zdania z gabinetu (rozmowa wieczorem) */
  --on-night: #F4EFE7;    /* piasek na atramencie, 15,8:1 */
  --on-night-2: rgba(244, 239, 231, .78);
  --line-night: rgba(244, 239, 231, .2);

  --font-display: "Newsreader", Georgia, "Times New Roman", serif;
  --font-text: "Satoshi", "Segoe UI", Arial, sans-serif;

  --step--1: .875rem;
  --step-0: 1.0625rem;
  --step-1: clamp(1.1875rem, 1.1rem + .4vw, 1.375rem);
  --step-2: clamp(1.625rem, 1.3rem + 1.1vw, 2.125rem);
  --step-3: clamp(2rem, 1.35rem + 2.3vw, 3.125rem);
  --step-4: clamp(2.625rem, 1.5rem + 3.6vw, 4.5rem);

  --gutter: clamp(20px, 5vw, 64px);
  --wrap: 1200px;
  /* Shapes: photos have no rounding at all; the button is the one clearly rounded object, cards and fields stay quiet. */
  --radius: 12px;
  --radius-sm: 10px;
  --radius-btn: 12px;
  --radius-lg: 16px;      /* duże panele: podziękowanie, oferta */
  --shadow: 0 24px 48px -30px rgba(23, 21, 27, .45);

  /* Motion (Emil Kowalski): strong custom curves, UI under 300 ms, press feedback 160 ms. */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --press: scale(0.97);
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 96px; }
/* opsz 36 everywhere: Newsreader keeps its text optical size at display sizes (warmer, sturdier, less "newspaper headline").
   Satoshi has no opsz axis, so the setting does not touch it; weights still come from font-weight. */
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 var(--step-0)/1.6 var(--font-text); font-variation-settings: "opsz" 36; overflow-wrap: break-word; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; font-variant-numeric: lining-nums; }
@media (min-width: 900px) { body { font-size: 1.125rem; } }
img, svg, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration-thickness: 1.5px; text-underline-offset: 4px; text-decoration-color: currentColor; transition: text-decoration-thickness 160ms ease, text-decoration-color 160ms ease, color 160ms ease; }
@media (hover: hover) and (pointer: fine) { a:hover { text-decoration-thickness: 2.5px; text-decoration-color: var(--ember); } }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
::selection { background: var(--ember); color: var(--ink); }
p, ul, ol, dl, figure, blockquote { margin: 0 0 1em; }
h1, h2, h3, h4 { margin: 0 0 .5em; color: inherit; }
h1, h2, .display { font-family: var(--font-display); font-weight: 500; line-height: 1.02; letter-spacing: -.012em; text-wrap: balance; }
h1 { font-size: var(--step-4); }
h2 { font-size: var(--step-3); line-height: 1.06; }
h3 { font: 700 var(--step-1)/1.3 var(--font-text); letter-spacing: -.005em; }
h4 { font: 600 1.0625rem/1.3 var(--font-text); }
p { max-width: 66ch; text-wrap: pretty; }
small, .small { font-size: var(--step--1); }
.lead { font-size: var(--step-1); line-height: 1.5; }
.muted { color: var(--muted); }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: absolute; left: 12px; top: -80px; z-index: 1000; padding: 12px 18px; background: var(--ink); color: var(--paper); border-radius: var(--radius-btn); text-decoration: none; font-weight: 600; }
.skip:focus { top: 12px; }

/* Breath wave under one word (the wave under the logo, in żar). */

/* Saying it plainly: the euphemism is crossed out, the direct words follow. */

/* ---------- Layout ---------- */
.wrap { width: min(var(--wrap), calc(100% - 2 * var(--gutter))); margin-inline: auto; }
.wrap--narrow { width: min(760px, calc(100% - 2 * var(--gutter))); margin-inline: auto; }
.section { padding-block: clamp(64px, 9vw, 128px); }
.section--tight { padding-block: clamp(44px, 6vw, 80px); }
/* Piasek as the accent: a few sections per page; emphasis comes from the wave, underlines and strikes, not from colour blocks. */
.on-sand { background: var(--sand); }
.section:not(.on-sand):not(.lp-voices) + .section:not(.on-sand):not(.lp-voices) { padding-top: 0; }
.section:not(.on-sand):not(.lp-voices) + .section:not(.on-sand):not(.lp-voices) > .wrap { border-top: 1px solid var(--line); padding-top: clamp(56px, 8vw, 104px); }
.km-section-line { border-top: 1px solid var(--line); }
.section-head { max-width: 760px; margin-bottom: clamp(32px, 5vw, 56px); }
.section-head p { font-size: var(--step-1); line-height: 1.5; }
.split { display: grid; gap: clamp(32px, 5vw, 80px); }
@media (min-width: 900px) { .split { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; } .split--top { align-items: start; } }

/* ---------- Buttons and links ---------- */
/* Primary: żar with atrament text. Hover (fine pointers only): atrament fills up from the bottom. Press: scale 0.97 in 160 ms (Emil Kowalski). */
.km-btn, .button, .woocommerce .button, .woocommerce button.button, .woocommerce a.button, button[type="submit"]:not(.km-plain):not(.km-bump__input) {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  min-height: 56px; padding: 0 28px; border: 2px solid var(--ember); border-radius: var(--radius-btn);
  background: var(--ember); color: var(--ink); font: 700 1.0625rem/1.15 var(--font-text); letter-spacing: 0;
  text-decoration: none; cursor: pointer; text-align: center; -webkit-tap-highlight-color: transparent; user-select: none;
  transition: transform 160ms var(--ease-out), background-color 160ms ease, color 160ms ease 60ms, border-color 160ms ease;
  position: relative; isolation: isolate; overflow: hidden; background-clip: padding-box;
}
.km-btn::before, .button::before, .woocommerce .button::before, button[type="submit"]:not(.km-plain):not(.km-bump__input)::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--ink); transform: translateY(101%); transition: transform 240ms var(--ease-out); }
.km-btn:active, .button:active, .woocommerce .button:active, button[type="submit"]:not(.km-plain):not(.km-bump__input):active { transform: var(--press); }
/* The price inside the button follows a middle dot, not a divider line (a divider reads as a split button with a menu). */
.km-btn__price { font-variant-numeric: tabular-nums; }
.km-btn__price::before { content: "·"; margin-right: 10px; }
.km-btn--ghost { background: transparent; color: var(--ink); border-color: var(--ink); }
@media (hover: hover) and (pointer: fine) {
  .km-btn:hover, .button:hover, .woocommerce .button:hover, button[type="submit"]:not(.km-plain):not(.km-bump__input):hover { color: var(--paper); border-color: var(--ink); text-decoration: none; }
  .km-btn:hover::before, .button:hover::before, .woocommerce .button:hover::before, button[type="submit"]:not(.km-plain):not(.km-bump__input):hover::before { transform: none; }
  .km-btn[aria-disabled="true"]:hover::before, button:disabled:hover::before { transform: translateY(101%); }
}
.km-btn--block { width: 100%; }
.km-btn--sm { min-height: 44px; padding: 0 20px; font-size: .9375rem; }
.km-btn[aria-disabled="true"], .km-btn:disabled, button:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.km-link { color: inherit; font-weight: 700; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 5px; }
@media (hover: hover) and (pointer: fine) { .km-link:hover { text-decoration-thickness: 3px; text-decoration-color: var(--ember); } }
.km-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 26px; }
/* Secondary actions are km-btn--ghost buttons (12.10), not links with arrows; links stay inside sentences. */
.header-link { display: inline-block; padding-block: 10px; }

/* ---------- Forms ---------- */
label { font-weight: 600; }
input:not([type]), input[type="text"], input[type="email"], input[type="tel"], input[type="password"], input[type="number"], input[type="search"], textarea, select, .select2-container .select2-selection--single {
  width: 100%; min-height: 54px; padding: 13px 16px; border: 1.5px solid var(--line-strong); border-radius: var(--radius-sm);
  background: var(--card); color: var(--ink); font: 400 1.0625rem/1.4 var(--font-text); box-shadow: none; transition: border-color 160ms ease, box-shadow 160ms ease;
}
@media (hover: hover) and (pointer: fine) { input:hover, textarea:hover, select:hover { border-color: var(--muted); } }
textarea { min-height: 150px; resize: vertical; }
::placeholder { color: #8F877C; opacity: 1; }
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, textarea:-webkit-autofill, select:-webkit-autofill { -webkit-text-fill-color: var(--ink); -webkit-box-shadow: 0 0 0 1000px #FFFDF8 inset; caret-color: var(--ink); transition: background-color 600000s 0s; }
input:focus-visible, textarea:focus-visible, select:focus-visible, input:focus, textarea:focus, select:focus { outline: 2px solid var(--ink); outline-offset: 2px; border-color: var(--ink); }
input[aria-invalid="true"], textarea[aria-invalid="true"], .woocommerce-invalid input.input-text { border-color: var(--error) !important; box-shadow: 0 0 0 3px rgba(158, 54, 39, .12); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--ink); width: 20px; height: 20px; }
.km-field { margin: 0 0 18px; }
.km-field label, .woocommerce form .form-row label { display: block; margin: 0 0 7px; font: 600 .9375rem/1.4 var(--font-text); color: var(--ink); }
.km-field-note, .form-row .description { display: block; margin-top: 7px; color: var(--muted); font-size: .875rem; line-height: 1.5; }
.km-field-error, .checkout-inline-error-message { display: block; position: relative; margin-top: 8px; padding-left: 24px; color: var(--error); font-size: .875rem; line-height: 1.45; font-weight: 600; transition: opacity 200ms var(--ease-out), transform 200ms var(--ease-out); }
.km-field-error::before, .checkout-inline-error-message::before { content: ""; position: absolute; left: 0; top: 1px; width: 18px; height: 18px; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><circle cx='10' cy='10' r='8.5' fill='none' stroke='%239E3627' stroke-width='1.6'/><path d='M10 5.6v5.4' stroke='%239E3627' stroke-width='1.8' stroke-linecap='round'/><circle cx='10' cy='14.2' r='1.1' fill='%239E3627'/></svg>") center / 18px no-repeat; }
@starting-style { .km-field-error { opacity: 0; transform: translateY(-4px); } }
.km-honeypot { position: absolute; left: -9999px; }

/* ---------- Notices ---------- */
.km-notice, .woocommerce-message, .woocommerce-info, .woocommerce-error { list-style: none; margin: 0 0 20px; padding: 14px 16px 14px 46px; border: 0; border-left: 3px solid var(--ink); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; background: var(--sand) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><circle cx='10' cy='10' r='8.5' fill='none' stroke='%2317151B' stroke-width='1.6'/><path d='M10 9v5.2' stroke='%2317151B' stroke-width='1.8' stroke-linecap='round'/><circle cx='10' cy='5.9' r='1.1' fill='%2317151B'/></svg>") 15px 15px / 20px no-repeat; color: var(--ink); font-size: .9375rem; line-height: 1.55; font-weight: 500; }
.woocommerce-error { border-left-color: var(--error); background-color: #FDF4F1; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><circle cx='10' cy='10' r='8.5' fill='none' stroke='%239E3627' stroke-width='1.6'/><path d='M10 5.6v5.4' stroke='%239E3627' stroke-width='1.8' stroke-linecap='round'/><circle cx='10' cy='14.2' r='1.1' fill='%239E3627'/></svg>"); color: #6E2418; }
.woocommerce-error li { margin: 0 0 4px; }
.woocommerce-message, .km-notice--ok { border-left-color: var(--ok); background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><circle cx='10' cy='10' r='8.5' fill='none' stroke='%232E6340' stroke-width='1.6'/><path d='M6.4 10.3l2.4 2.4 4.8-5' fill='none' stroke='%232E6340' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>"); }
.woocommerce-info { border-left-color: var(--ink); }
.woocommerce-error li + li { margin-top: 6px; }
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before { display: none; }
.woocommerce-message .button, .woocommerce-info .button { min-height: 40px; padding: 0 16px; font-size: .875rem; margin-left: 12px; }
.km-notice, .woocommerce-message, .woocommerce-info, .woocommerce-error, .km-alert { transition: opacity 250ms var(--ease-out), transform 250ms var(--ease-out); }
@starting-style { .km-notice, .woocommerce-message, .woocommerce-info, .woocommerce-error, .km-alert { opacity: 0; transform: translateY(-6px); } }
/* Form states: one line with an icon; error on a warm red tint, confirmation on piasek. */
.km-alert { display: flex; gap: 12px; align-items: flex-start; max-width: none; margin: 0 0 20px; padding: 14px 16px; border-left: 3px solid; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; font-size: .9375rem; line-height: 1.5; font-weight: 500; }
.km-alert::before { content: ""; flex: 0 0 20px; height: 20px; margin-top: 1px; background: center / 20px no-repeat; }
.km-alert--error { background: #FDF4F1; color: #6E2418; border-left-color: var(--error); }
.km-alert--error::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><circle cx='10' cy='10' r='8.5' fill='none' stroke='%239E3627' stroke-width='1.6'/><path d='M10 5.6v5.4' stroke='%239E3627' stroke-width='1.8' stroke-linecap='round'/><circle cx='10' cy='14.2' r='1.1' fill='%239E3627'/></svg>"); }
.km-alert--ok { background: var(--sand); color: var(--ink); border-left-color: var(--ok); }
.km-alert--ok::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><circle cx='10' cy='10' r='8.5' fill='none' stroke='%232E6340' stroke-width='1.6'/><path d='M6.4 10.3l2.4 2.4 4.8-5' fill='none' stroke='%232E6340' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>"); }
/* Sent: the card enters and the check draws itself once. */
.km-success { padding: 6px 0; transition: opacity 300ms var(--ease-out), transform 300ms var(--ease-out); }
@starting-style { .km-success { opacity: 0; transform: translateY(8px); } }
.km-success:focus { outline: none; }
.km-success__icon { width: 56px; height: 56px; margin: 0 0 18px; overflow: visible; }
.km-success__icon circle { fill: var(--sand); stroke: var(--ok); stroke-width: 2; stroke-dasharray: 1; animation: km-draw 500ms var(--ease-out) 100ms backwards; }
.km-success__icon path { fill: none; stroke: var(--ok); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; animation: km-draw 350ms var(--ease-out) 450ms backwards; }
.km-success h2 { font-size: clamp(1.75rem, 1.4rem + 1.4vw, 2.25rem); margin: 0 0 10px; }
.km-success p { color: var(--muted); }
/* Busy submit: the label stays, a small spinner follows it. */
.km-btn.is-busy { cursor: progress; }
.km-btn.is-busy::after { content: ""; width: 16px; height: 16px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; animation: km-spin 700ms linear infinite; }

/* ---------- Header ---------- */
.staging-note { background: var(--ink); color: var(--paper); text-align: center; font: 500 .8125rem/1.4 var(--font-text); padding: 7px 12px; }
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255, 255, 255, .95); backdrop-filter: saturate(1.3) blur(10px); -webkit-backdrop-filter: saturate(1.3) blur(10px); border-bottom: 1px solid transparent; transition: border-color 200ms ease, box-shadow 200ms var(--ease-out); }
@media (max-width: 759px) { .is-focused .site-header { position: static; } }
.site-header.is-scrolled { border-bottom-color: var(--line); box-shadow: 0 8px 24px -18px rgba(23, 21, 27, .35); }
.brand:focus-visible, .footer-focused > a:focus-visible { outline: none; }
.brand:focus-visible img, .footer-focused > a:focus-visible img { outline: 2px solid var(--ink); outline-offset: 4px; border-radius: 4px; }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 72px; }
.brand { display: inline-flex; align-items: center; gap: 18px; flex: 0 0 auto; text-decoration: none; }
/* The shop's name next to Kasia's logo: hairline, two short lines, on wide screens of the browsing pages.
   Landing page and checkout show only Kasia's name: the visitor came for her, a second label makes it look like a platform. */
.brand__tag { display: none; padding-left: 18px; border-left: 1px solid var(--line); font: 700 .875rem/1.3 var(--font-text); color: var(--ink); white-space: nowrap; }
.brand__tag span { display: block; font-weight: 500; color: var(--muted); }
@media (min-width: 1100px) { body:not(.is-focused) .brand__tag { display: block; } }
.brand img { width: 220px; height: auto; transform: translateY(20%); }
@media (max-width: 599px) { .brand img { width: 176px; } .header-inner { min-height: 62px; } }
.main-nav { display: flex; align-items: center; gap: 30px; }
.main-nav a { text-decoration: none; font-weight: 500; font-size: 1rem; }
@media (min-width: 900px) {
  .main-nav a:not(.km-btn) { position: relative; padding-block: 10px; }
  .main-nav a:not(.km-btn)::after { content: ""; position: absolute; left: 0; right: 0; bottom: 4px; height: 2px; border-radius: 2px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform 200ms var(--ease-out); }
  .main-nav a[aria-current="page"]::after { transform: scaleX(1); background: var(--ember); }
}
@media (min-width: 900px) and (hover: hover) and (pointer: fine) { .main-nav a:not(.km-btn):hover::after { transform: scaleX(1); } }
@media (max-width: 899px) { .main-nav a:not(.km-btn)[aria-current="page"] { text-decoration: underline; text-decoration-color: var(--ember); text-decoration-thickness: 2px; text-underline-offset: 8px; } }
.header-note { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--muted); font-size: .9375rem; line-height: 1.4; }
.header-note .km-icon { width: 20px; height: 20px; }
@media (max-width: 419px) { .header-note span { display: none; } }
.header-link { font-weight: 600; font-size: .9375rem; white-space: nowrap; }
@media (max-width: 599px) { .header-link__more { display: none; } }
.menu-toggle { display: none; }
@media (max-width: 899px) {
  .menu-toggle { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 16px; border: 1.5px solid var(--ink); border-radius: var(--radius-btn); background: transparent; font-weight: 600; cursor: pointer; }
  .menu-toggle__icon { width: 18px; height: 12px; position: relative; }
  .menu-toggle__icon::before, .menu-toggle__icon::after { content: ""; position: absolute; left: 0; right: 0; height: 2px; background: currentColor; border-radius: 2px; transition: transform 200ms var(--ease-out); }
  .menu-toggle__icon::before { top: 1px; } .menu-toggle__icon::after { top: 9px; }
  .menu-toggle[aria-expanded="true"] .menu-toggle__icon::before { transform: translateY(4px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] .menu-toggle__icon::after { transform: translateY(-4px) rotate(-45deg); }
  .menu-toggle { transition: transform 160ms var(--ease-out); }
  .menu-toggle:active { transform: var(--press); }
  .main-nav { position: fixed; inset: 62px 0 auto 0; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 8px var(--gutter) 24px; background: var(--paper); border-bottom: 1px solid var(--line); box-shadow: var(--shadow); max-height: calc(100vh - 62px); overflow-y: auto; }
  .admin-bar .main-nav { top: 108px; }
  .main-nav.is-open { display: flex; opacity: 1; transform: none; transition: opacity 200ms var(--ease-out), transform 200ms var(--ease-out); }
  @starting-style { .main-nav.is-open { opacity: 0; transform: translateY(-6px); } }
  .main-nav a:not(.km-btn) { padding: 16px 0; border-bottom: 1px solid var(--line); font-size: 1.1875rem; }
  .main-nav .km-btn { margin-top: 20px; }

}

/* ---------- Footer ---------- */
.site-footer { background: var(--paper); color: var(--ink); border-top: 1px solid var(--line); padding: clamp(56px, 8vw, 96px) 0 32px; }
.site-footer a { color: var(--ink); }
.footer-grid { display: grid; gap: 40px; }
@media (max-width: 699px) { .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 20px; } .footer-brand { grid-column: 1 / -1; } }
@media (min-width: 700px) { .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .footer-grid { grid-template-columns: 1.5fr repeat(3, minmax(0, 1fr)); gap: 48px; } }
.footer-brand img { width: 240px; height: auto; margin-bottom: 22px; }
.footer-brand p { color: var(--muted); max-width: 34ch; margin: 0; }
.footer-brand p strong { color: var(--ink); font-weight: 600; }
/* Social icons: 40 px circles, hover fills żar softly (fine pointers), opens in a new tab. */
.km-social { list-style: none; display: flex; gap: 10px; margin: 22px 0 0; padding: 0; }
.km-social a { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 50%; color: var(--ink); transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms var(--ease-out); }
.km-social svg { width: 20px; height: 20px; }
.km-social a:active { transform: var(--press); }
@media (hover: hover) and (pointer: fine) { .km-social a:hover { background: var(--ember); border-color: var(--ember); color: var(--ink); } }
.footer-col h2 { font: 600 .9375rem/1.4 var(--font-text); color: var(--ink); margin: 0 0 16px; letter-spacing: 0; }
.footer-col ul { list-style: none; padding: 0; margin: 0; }
.footer-col li { margin: 0 0 12px; }
.footer-col a, .footer-col button { color: var(--muted); font-size: 1rem; text-decoration: underline; text-decoration-color: transparent; text-decoration-thickness: 2px; text-underline-offset: 5px; transition: color 160ms ease, text-decoration-color 160ms ease; }
@media (hover: hover) and (pointer: fine) { .footer-col a:hover, .footer-col button:hover { color: var(--ink); text-decoration-color: var(--ember); } }
.site-footer .cookie-settings, .footer-col button { background: none; border: 0; padding: 0; cursor: pointer; font-family: inherit; font-size: 1rem; line-height: inherit; text-align: left; }
.footer-legal { margin-top: 56px; padding-top: 24px; border-top: 1px solid var(--line); display: grid; gap: 10px 32px; color: var(--muted); font-size: .875rem; line-height: 1.6; }
@media (min-width: 900px) { .footer-legal { grid-template-columns: minmax(0, 1fr) auto; align-items: end; } }
.footer-legal p { margin: 0; max-width: 80ch; }
.footer-legal a { color: var(--ink); }
.site-footer--focused { padding-top: 40px; }
.footer-focused { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 18px 32px; align-items: center; }
.footer-focused img { width: 184px; height: auto; transform: translateY(20%); }
.footer-focused nav { display: flex; flex-wrap: wrap; gap: 10px 24px; font-size: .9375rem; }
.footer-focused nav a, .footer-focused nav button { background: none; border: 0; color: var(--muted); padding: 0; cursor: pointer; font: inherit; text-decoration: underline; text-decoration-color: transparent; text-decoration-thickness: 2px; text-underline-offset: 5px; transition: color 160ms ease, text-decoration-color 160ms ease; }
@media (hover: hover) and (pointer: fine) { .footer-focused nav a:hover, .footer-focused nav button:hover { color: var(--ink); text-decoration-color: var(--ember); } }
.site-footer--focused .footer-legal { margin-top: 28px; }
/* Phones: footer links get a taller tap area (8 px above and below) instead of a bigger font. */
.footer-col li { margin: 0 0 4px; }
.footer-col a, .footer-col button, .footer-focused nav a, .footer-focused nav button { display: inline-block; padding-block: 10px; }
.footer-focused nav { gap: 2px 24px; }

/* ---------- Icons (icons.php): atrament line, one detail in żar ---------- */
.km-icon { display: block; width: 24px; height: 24px; flex: none; color: var(--ink); overflow: visible; }
.km-icon .a { stroke: var(--ember); }
.km-icon .f { fill: var(--ember); stroke: none; }
.lp-voices .km-icon, .home-start .km-icon { color: var(--on-night); }
/* A list where every item has its own icon. Variants: --points and --facts (O mnie), lp-facts, lp-notes, lp-offer__list. */
.km-iconlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.km-iconlist li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 14px; align-items: start; }
/* Icons next to text sit on the centre of the first line: (line height of that text − icon) / 2. 1lh is the line height the
   icon inherits; where the first line uses another size (headings in a list, smaller text), the icon gets that font. */
.km-iconlist .km-icon { width: 30px; height: 30px; margin-top: 0; margin-top: calc((1lh - 30px) / 2); }
.km-iconlist strong { font-weight: 700; }
.km-iconlist--points { gap: 26px; margin-top: 8px; }
.km-iconlist--points li, .km-iconlist--facts li { grid-template-columns: 40px minmax(0, 1fr); gap: 18px; }
.km-iconlist--points .km-icon, .km-iconlist--facts .km-icon { width: 40px; height: 40px; margin-top: 0; margin-top: calc((1lh - 40px) / 2); }
.km-iconlist--points .km-icon { font-size: 1.125rem; }
.km-iconlist--facts .km-icon { font: 500 clamp(1.5rem, 1.3rem + .8vw, 2rem)/1.04 var(--font-display); }
.km-iconlist--points strong { display: block; margin-bottom: 4px; font-size: 1.125rem; }
.km-iconlist--points li > span { color: var(--muted); }
.km-iconlist--points strong { color: var(--ink); }
.km-iconlist--facts { gap: 30px; }
.km-iconlist--facts strong { display: block; margin-bottom: 6px; font: 500 clamp(1.5rem, 1.3rem + .8vw, 2rem)/1.04 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.01em; }
.km-iconlist--facts li > span { color: var(--muted); }
.km-iconlist--facts strong { color: var(--ink); }
.lp-offer__list { gap: 14px; margin: 0 0 4px; }
.lp-offer__list .km-icon { width: 28px; height: 28px; margin-top: calc((1lh - 28px) / 2); }

/* ---------- Shared blocks ---------- */
.km-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: clamp(22px, 3vw, 34px); }
/* Photos: always the whole frame in its own proportions (Bogumił 12.10). No rounding, no crop, no object-fit, no mask. */
.km-figure, .km-photo { margin: 0; }
.km-figure img, .km-photo img { display: block; width: 100%; height: auto; }
.km-caption { margin-top: 12px; font-size: .875rem; line-height: 1.5; color: var(--muted); max-width: 60ch; }
.km-caption strong { color: var(--ink); font-weight: 600; }
.km-list { list-style: none; padding: 0; margin: 0 0 1.2em; }
.km-list li { position: relative; padding-left: 28px; margin: 0 0 12px; }
.km-list li::before { content: ""; position: absolute; left: 2px; top: .7em; width: 14px; height: 2px; background: currentColor; border-radius: 2px; }
.km-checks { list-style: none; padding: 0; margin: 0 0 1.2em; }
.km-checks li { position: relative; padding-left: 34px; margin: 0 0 14px; }
.km-checks li::before { content: ""; position: absolute; left: 0; top: .12em; width: 24px; height: 24px; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='9' stroke='%2317151B'/><path d='M8 12.4l2.7 2.7L16.2 9.6' stroke='%23FF6A3D'/></svg>") center / 24px no-repeat; }
.km-faq { border-top: 1px solid var(--line); }
.km-faq details { border-bottom: 1px solid var(--line); }
.km-faq summary { list-style: none; display: flex; justify-content: space-between; gap: 18px; align-items: center; padding: 22px 0; cursor: pointer; font: 600 var(--step-1)/1.3 var(--font-text); }
.km-faq summary::-webkit-details-marker { display: none; }
.km-faq summary::after { content: ""; flex: 0 0 30px; height: 30px; border-radius: 50%; border: 1.5px solid var(--ink); background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path d='M10 15h10M15 10v10' stroke='%2317151B' stroke-width='1.8' stroke-linecap='round'/></svg>") center/28px no-repeat; transition: transform 200ms var(--ease-out), background-color 150ms ease; }
@media (hover: hover) and (pointer: fine) { .km-faq summary:hover::after { background-color: var(--sand); } .on-sand .km-faq summary:hover::after { background-color: var(--card); } }
.km-faq details[open]:not(.is-closing) summary::after { transform: rotate(45deg); background-color: var(--ink); background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path d='M10 15h10M15 10v10' stroke='%23FFFFFF' stroke-width='1.8' stroke-linecap='round'/></svg>"); }
.km-faq__a { display: grid; grid-template-rows: 1fr; transition: grid-template-rows 200ms var(--ease-out); }
.km-faq__a.is-collapsed { grid-template-rows: 0fr; }
.km-faq__in { min-height: 0; overflow: hidden; transition: opacity 200ms var(--ease-out); }
.km-faq__a.is-collapsed .km-faq__in { opacity: 0; }
.km-faq__body { padding: 0 0 24px; max-width: 64ch; }
.km-faq__body p:last-child { margin-bottom: 0; }

/* ---------- Product covers and cards ---------- */
/* Product covers are designed graphics in their own 4:5 format; shown whole, like the photos. */
.km-cover { display: block; border-radius: 6px; overflow: hidden; background: var(--sand); }
.km-cover img { display: block; width: 100%; height: auto; }
/* Course list: one course per row, covers without shadows, air between rows (Bogumił 6.10: the three-column grid was hard to read). */
.km-products { display: grid; border-top: 1px solid var(--line); }
.km-product { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 44px; align-items: center; padding: 36px 0; border-bottom: 1px solid var(--line); }
.km-product .km-cover { box-shadow: none; border-radius: 6px; outline: 1px solid var(--line-soft); outline-offset: -1px; }
.km-product__body { max-width: 640px; }
.km-product__title { margin: 0 0 6px; font: 500 clamp(1.5rem, 1.25rem + .9vw, 2rem)/1.15 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.01em; }
.km-product__title a { text-decoration: underline; text-decoration-color: transparent; text-decoration-thickness: 3px; text-underline-offset: 6px; }
@media (hover: hover) and (pointer: fine) {
  .km-product:hover .km-product__title a { text-decoration-color: var(--ember); }
}
.km-product__meta { margin: 0; color: var(--muted); font-size: .9375rem; font-weight: 600; }
.km-product__text { margin: 16px 0 22px; }
.km-product__bottom { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; }
@media (max-width: 699px) {
  .km-product { grid-template-columns: 96px minmax(0, 1fr); grid-template-areas: "cover head" "text text" "bottom bottom"; gap: 0 18px; padding: 28px 0; }
  .km-product .km-cover { grid-area: cover; border-radius: 4px; }
  .km-product__body { display: contents; }
  .km-product__head { grid-area: head; }
  .km-product__text { grid-area: text; margin: 18px 0; }
  .km-product__bottom { grid-area: bottom; }
}
.km-price { margin: 0; font: 700 1.75rem/1 var(--font-text); letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.km-price small { font: 400 .8125rem/1.3 var(--font-text); color: var(--muted); display: block; margin-top: 6px; letter-spacing: 0; }

/* ---------- Landing pages: „Rozmowa w gabinecie” (12.10) ----------
   One sentence and Kasia first; the three things men say on a dark band (an evening talk, the one dark section per page);
   the practice shown with whole frames; Kasia; what happens after buying; questions; an offer that is not a book cover. */
.lp-hero { padding: clamp(28px, 5vw, 72px) 0 clamp(56px, 8vw, 112px); }
.lp-hero__grid { display: grid; gap: 36px; align-items: center; }
@media (min-width: 760px) { .lp-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(280px, 440px); gap: clamp(40px, 6vw, 104px); } }
.lp-hero__product { display: flex; flex-wrap: wrap; gap: 2px 10px; margin: 0 0 clamp(20px, 3vw, 32px); font-size: .9375rem; line-height: 1.45; color: var(--muted); }
.lp-hero__product strong { color: var(--ink); font-weight: 600; }
.lp-hero h1 { margin: 0 0 clamp(20px, 2.4vw, 28px); font-size: clamp(2.75rem, 1.45rem + 4.4vw, 5.25rem); line-height: 1; }
.lp-hero .lead { max-width: 34em; margin: 0; font-size: clamp(1.125rem, 1rem + .45vw, 1.3125rem); line-height: 1.55; }
.lp-buy { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; margin-top: clamp(28px, 3.4vw, 36px); }
/* Terms of purchase as two short lines in ink: the strongest reassurance, not grey small print. */
.lp-terms { display: grid; gap: 6px; margin: 20px 0 0; font-size: .9375rem; line-height: 1.45; color: var(--ink); max-width: none; }
.lp-terms > span { display: flex; align-items: flex-start; gap: 10px; }
.lp-terms .km-icon { flex: none; width: 22px; height: 22px; margin-top: calc((1lh - 22px) / 2); }
.lp-terms--row { display: flex; flex-wrap: wrap; gap: 8px 28px; }
.lp-terms strong { font-weight: 700; }
.lp-hero__photo { width: 100%; justify-self: end; }
@media (max-width: 759px) {
  /* Phone: the sentence, the offer and the terms first; Kasia's whole photo edge to edge right after,
     her face already in the first screen of a 390 × 844 phone. */
  .lp-hero { padding-top: 22px; }
  .lp-hero__photo { margin-inline: calc(-1 * var(--gutter)); width: auto; }
  .lp-hero__photo .km-caption { padding-inline: var(--gutter); }
}
@media (max-width: 599px) {
  .lp-hero__product { font-size: .875rem; margin-bottom: 16px; }
  .lp-buy { margin-top: 24px; }
  .lp-buy > .km-btn { width: 100%; }
  .lp-buy__more { display: none; }
  .lp-terms { margin-top: 14px; }
}

/* A 4:3 photo (Kasia and Adam) takes the wider column; a 2:3 portrait the narrower one. Always the whole frame. */
@media (min-width: 760px) { .lp-hero--wide .lp-hero__grid { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); } }
.lp-hero--wide .lp-hero__photo { max-width: 600px; }
@media (min-width: 900px) { .lp-kasia--tall .lp-kasia__grid { grid-template-columns: minmax(0, 400px) minmax(0, 1fr); } }

/* The three sentences from the practice: Kasia's dark room, large serif, nothing else competing. */
.lp-voices { background: var(--night); color: var(--on-night); }
.lp-voices__head { max-width: 640px; margin-bottom: clamp(24px, 4vw, 44px); }
.lp-label { margin: 0 0 12px; font: 600 .9375rem/1.4 var(--font-text); letter-spacing: .01em; color: var(--on-night-2); }
.lp-voices__head p { margin: 0; font-size: var(--step-1); line-height: 1.5; color: var(--on-night-2); }
.lp-voices__list { list-style: none; margin: 0; padding: 0; }
.lp-voices__list li { display: grid; gap: 10px 64px; padding: clamp(22px, 3.4vw, 40px) 0; border-top: 1px solid var(--line-night); }
@media (min-width: 900px) { .lp-voices__list li { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); align-items: center; } }
.lp-voices__said { margin: 0; max-width: none; font: 500 clamp(2.25rem, 1.3rem + 3.4vw, 4rem)/1 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.015em; color: var(--on-night); text-wrap: balance; }
.lp-voices__list li > p:last-child { margin: 0; color: var(--on-night-2); max-width: 46ch; }
.lp-voices__turn { display: flex; gap: 16px; align-items: flex-start; margin: clamp(8px, 2vw, 16px) 0 0; padding-top: clamp(22px, 3.4vw, 36px); border-top: 1px solid var(--line-night); font-size: var(--step-1); line-height: 1.5; max-width: none; }
.lp-voices__turn .km-icon { flex: none; width: 34px; height: 34px; margin-top: 0; margin-top: calc((1lh - 34px) / 2); color: var(--on-night); }
.lp-voices a:not(.km-btn) { color: var(--on-night); }
/* The primary button keeps atrament on żar on the dark band too (6,4:1); only text links turn light. */
.lp-voices .km-btn { color: var(--ink); }
.lp-voices :focus-visible { outline-color: var(--on-night); }

/* One practice in three recordings: whole frames next to the list of recordings. */
#co-robisz, #co-w-srodku, #zamow { scroll-margin-top: 24px; }
.lp-program__head { display: grid; gap: 18px 64px; margin-bottom: clamp(32px, 5vw, 56px); }
.lp-program__head h2, .lp-program__head .lead { margin: 0; }
@media (min-width: 900px) { .lp-program__head { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); align-items: end; } }
.lp-program__grid { display: grid; gap: 36px; align-items: start; }
@media (min-width: 900px) { .lp-program__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 6vw, 88px); } }
.km-frames { margin: 0; }
.km-frames__row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.km-frames img { display: block; width: 100%; height: auto; }
.lp-program__start { margin: 0 0 14px; color: var(--muted); }
.lp-program__start strong { color: var(--ink); font-weight: 700; }
.lp-tracks { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.lp-tracks li { padding: 18px 0 20px; border-bottom: 1px solid var(--line); }
.lp-tracks h3 { display: flex; align-items: baseline; gap: 14px; margin: 0 0 6px; font: 700 1.1875rem/1.3 var(--font-text); }
.lp-tracks__no { flex: 0 0 1.3em; color: var(--muted); font-weight: 600; font-variant-numeric: tabular-nums; }
.lp-tracks__time { margin-left: auto; font: 600 .9375rem/1.3 var(--font-text); color: var(--muted); font-variant-numeric: tabular-nums; }
.lp-tracks p { margin: 0 0 0 calc(1.3em * 1.1875 + 14px); color: var(--muted); }
@media (max-width: 599px) { .lp-tracks p { margin-left: 0; } }
.lp-program__foot { display: grid; gap: 28px 64px; margin-top: clamp(40px, 6vw, 72px); padding-top: clamp(28px, 4vw, 40px); border-top: 1px solid var(--line); }
@media (min-width: 900px) { .lp-program__foot { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.lp-said { margin: 0; padding: 0; border: 0; }
.lp-said p { margin: 0 0 8px; font: 500 clamp(2.25rem, 1.4rem + 3vw, 3.5rem)/1 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.015em; }
.lp-said footer { color: var(--muted); font-size: .9375rem; }

/* Tempo: three recordings as a cascade of bars, each starting where the previous one ends, in proportion to their length.
   Each bar carries its own name and time, so there is no separate legend (12.10: the wave added nothing). The label
   starts with its bar but never runs past the right edge. Żar only on the practice with Kasia. */
.km-tempo { max-width: 520px; margin: 28px 0 0; }
.km-tempo__rows { list-style: none; display: grid; gap: 12px; margin: 0; padding: 0; }
.km-tempo__rows li { display: grid; gap: 6px; }
.km-tempo__label { margin-left: min(var(--start), 100% - 11.5rem); color: var(--muted); font-size: .875rem; line-height: 1.3; white-space: nowrap; }
.km-tempo__time { margin-left: 2px; color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.km-tempo__track { position: relative; height: 6px; border-radius: 3px; background: rgba(23, 21, 27, .07); }
.km-tempo__bar { position: absolute; inset: 0 auto 0 var(--start); width: var(--size); border-radius: 3px; }
.km-tempo .is-1 .km-tempo__bar { background: rgba(23, 21, 27, .28); }
.km-tempo .is-2 .km-tempo__bar { background: rgba(23, 21, 27, .52); }
.km-tempo .is-3 .km-tempo__bar { background: var(--ember); }
.km-tempo__note { margin: 12px 0 0; color: var(--muted); font-size: .875rem; }
.lp-program__buy { margin: 26px 0 0; }
@keyframes km-draw { from { stroke-dashoffset: 1; } }

/* Kasia: a whole photo with someone close, then her own words and three plain facts. */
.lp-kasia__grid { display: grid; gap: 32px; align-items: center; }
@media (min-width: 900px) { .lp-kasia__grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(40px, 6vw, 88px); } }
.lp-kasia__photo { max-width: 600px; }
.lp-kasia h2 { margin-bottom: 22px; }
.lp-kasia .lead { margin-bottom: 14px; }
.lp-facts { margin: 26px 0 0; }


.home-kasia__more { margin: 26px 0 0; }

/* After buying: three short steps and an honest note about the recordings. */
.lp-after__steps { list-style: none; margin: 0; padding: 0; counter-reset: after; display: grid; gap: 26px; }
.lp-after__steps li { counter-increment: after; display: grid; align-content: start; grid-template-columns: 58px minmax(0, 1fr); column-gap: 18px; align-items: start; }
.lp-after__steps li::before { content: counter(after); grid-row: 1 / span 2; font: 500 clamp(3.5rem, 2.6rem + 3.4vw, 6rem)/.82 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.03em; color: var(--ink); font-variant-numeric: lining-nums; }
.lp-after__steps h3 { margin: 4px 0 6px; font: 700 1.1875rem/1.3 var(--font-text); }
.lp-after__steps p { margin: 0; color: var(--muted); }
@media (min-width: 760px) {
  .lp-after__steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(28px, 4vw, 56px); }
  .lp-after__steps li { grid-template-columns: minmax(0, 1fr); }
  .lp-after__steps li::before { grid-row: auto; margin-bottom: 18px; }
}
.lp-honest { display: flex; gap: 16px; align-items: flex-start; margin: clamp(32px, 5vw, 52px) 0 0; max-width: 72ch; }
.lp-honest .km-icon { flex: none; width: 32px; height: 32px; margin-top: 0; margin-top: calc((1lh - 32px) / 2); }
.lp-honest strong { font-weight: 700; }

.lp-faq__grid { display: grid; gap: 28px; }
@media (min-width: 960px) { .lp-faq__grid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 80px; } .lp-faq__grid > div:first-child { align-self: start; } }

/* Offer: what you get, the price and the terms in one calm card; no book-like cover for a video course. */
.lp-offer__card { max-width: 720px; margin-inline: auto; padding: clamp(26px, 5vw, 56px); border-radius: var(--radius-lg); background: var(--card); color: var(--ink); }
.lp-offer__kicker { margin: 0 0 10px; color: var(--muted); font-size: .9375rem; font-weight: 600; }
.lp-offer__card h2 { margin: 0 0 26px; font-size: clamp(2.25rem, 1.6rem + 2.2vw, 3.375rem); }
.lp-offer__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; margin: 26px 0 20px; padding-top: 22px; border-top: 1px solid var(--line); }
.lp-offer__price strong { font: 700 clamp(2.75rem, 2.2rem + 2vw, 3.75rem)/1 var(--font-text); letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.lp-offer__price span { color: var(--muted); }
.lp-offer__safe { margin: 16px 0 0; font-size: .9375rem; line-height: 1.5; text-align: center; max-width: none; }
.lp-ps { max-width: 720px; margin: clamp(36px, 5vw, 64px) auto 0; text-align: center; }
.lp-ps p { margin: 0 auto; max-width: 30ch; font: 500 clamp(1.375rem, 1.1rem + 1vw, 1.875rem)/1.3 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.01em; }
.lp-ps .lp-ps__sign { margin-top: 14px; font-size: 1.375rem; }
.lp-ps__sign::after { content: ""; display: block; width: 76px; height: 14px; margin: 6px auto 0; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 76 14'><path d='M2 11.6C5.3 10.4 12.2 5.6 16.4 5.3C20.6 5 22.7 10.6 27.8 9.9C33 9.2 40.9 2.5 46.7 2C52.5 1.4 57.7 6.2 62.5 7.3C67.3 8.4 72.4 8.6 74 8.9' fill='none' stroke='%23FF6A3D' stroke-width='2.6' stroke-linecap='round'/></svg>") center / contain no-repeat; }

/* Sticky purchase bar on phones: a flat bar along the bottom edge, not a floating card. */
.lp-sticky { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom)); background: var(--card); color: var(--ink); border-top: 1px solid var(--line); box-shadow: 0 -10px 28px -20px rgba(23, 21, 27, .35); transform: translateY(110%); opacity: 0; visibility: hidden; transition: transform 250ms var(--ease-out), opacity 200ms var(--ease-out), visibility 250ms; }
.lp-sticky.is-visible { transform: none; opacity: 1; visibility: visible; }
.lp-sticky p { margin: 0; font-size: .9375rem; line-height: 1.3; }
.lp-sticky strong { font-size: 1.0625rem; font-variant-numeric: tabular-nums; }
.lp-sticky .km-btn { min-height: 46px; padding: 0 20px; font-size: .9375rem; }
@media (min-width: 960px) { .lp-sticky { display: none; } }
@media (max-width: 959px) { .km-product-landing, .lp-offer, body.is-focused { scroll-padding-bottom: 96px; } html:has(.lp-sticky) { scroll-padding-bottom: 96px; } }

/* ---------- Starter LP, rebuild 13.10 (research + Hormozi): desire, proof and objections on one page ----------
   Scoped to .km-lp so the shared .lp-* blocks keep working on the home page and the two product pages. */
/* Call-out above the headline: the one man the page talks to, a żar dot as the only colour. */
.km-lp__callout { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 14px; padding: 8px 14px 8px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--sand); font: 600 .9375rem/1.3 var(--font-text); color: var(--ink); max-width: none; }
.km-lp__callout::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--ember); }
@media (max-width: 599px) { .km-lp__callout { font-size: .875rem; padding: 7px 12px 7px 10px; margin-bottom: 12px; } }
/* Proof right under the terms: one sentence with the public numbers, in ink. */
.km-lp__proofline { display: flex; gap: 10px; align-items: flex-start; margin: 20px 0 0; padding-top: 18px; border-top: 1px solid var(--line); font-size: .9375rem; line-height: 1.5; color: var(--muted); max-width: none; }
.km-lp__proofline .km-icon { flex: none; width: 24px; height: 24px; margin-top: calc((1lh - 24px) / 2); }
.km-lp__proofline strong { color: var(--ink); font-weight: 700; }
/* Numbers band: four public figures in Newsreader, grey labels, one honest note. */
.km-lp__numbers { padding-block: clamp(26px, 4vw, 44px); }
.km-lp__stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 24px; margin: 0; }
@media (min-width: 760px) { .km-lp__stats { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; } }
.km-lp__stats > div { display: grid; gap: 4px; align-content: start; }
.km-lp__stats dt { font: 500 clamp(1.875rem, 1.3rem + 2vw, 3rem)/1 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.02em; color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.km-lp__stats dd { margin: 0; color: var(--muted); font-size: .9375rem; line-height: 1.4; max-width: 22ch; }
.km-lp__stats-note { margin: 16px 0 0; font-size: .8125rem; line-height: 1.5; color: var(--muted); max-width: none; }
/* The belief shift: text on the left, Kasia's two words on the right. */
.km-lp__why-grid { display: grid; gap: 28px 64px; }
@media (min-width: 900px) { .km-lp__why-grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); align-items: start; } .km-lp__aside { padding-top: 10px; } }
.km-lp__why h2 { margin-bottom: 22px; }
.km-lp__why .lead { margin: 0 0 14px; }
.km-lp__not { margin: 0; gap: 20px; }
.km-lp__said { margin-top: 30px; padding-top: 26px; border-top: 1px solid var(--line); }
.km-lp__said p { font-size: clamp(2rem, 1.3rem + 2.4vw, 3rem); }
.km-lp__not strong { display: block; margin-bottom: 2px; }
.km-lp__not li > span { color: var(--muted); }
.km-lp__not li > span strong { color: var(--ink); }
@media (max-width: 899px) { .km-lp__aside { border-top: 1px solid var(--line); padding-top: 26px; } }
/* Two short note lists side by side under the programme. */
@media (min-width: 900px) { .lp-program__foot { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.km-lp .lp-program__buy .km-btn { min-width: 0; }
/* The first evening: one moment in Newsreader next to a whole frame of the recording. */
.km-lp__label { color: var(--muted); }
.km-lp__evening-grid { display: grid; gap: 28px; align-items: center; }
@media (min-width: 900px) { .km-lp__evening-grid { grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); gap: clamp(40px, 6vw, 96px); } }
.km-lp__evening h2 { margin-bottom: 26px; }
.km-lp__evening-steps { list-style: none; margin: 0 0 28px; padding: 0; display: grid; gap: 0; max-width: 34em; border-top: 1px solid var(--line-soft); }
.km-lp__evening-steps li { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--line-soft); align-items: baseline; }
.km-lp__time { font: 600 .9375rem/1.4 var(--font-text); color: var(--muted); font-variant-numeric: tabular-nums; }
.km-lp__evening-steps p { margin: 0; max-width: none; font: 500 clamp(1.1875rem, 1rem + .8vw, 1.5rem)/1.3 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.005em; }
.km-lp__evening-steps strong { font-weight: 700; }
@media (max-width: 599px) { .km-lp__evening-steps li { grid-template-columns: 3.6rem minmax(0, 1fr); gap: 10px; } }
.km-lp .lp-hero h1 { font-size: clamp(2.5rem, 1.3rem + 4vw, 4.75rem); line-height: 1; }
.km-lp__evening .lp-buy { margin-top: 0; }
.km-lp__evening-photo { max-width: 300px; }
@media (max-width: 899px) { .km-lp__evening-photo { max-width: 240px; } }
/* Kasia on white after the sand band. */
.km-lp__kasia .lead { margin-bottom: 14px; }
/* Three admissions: big ink digits, the claim after the flaw. */
.km-lp__three { list-style: none; margin: 0; padding: 0; counter-reset: three; display: grid; gap: 26px; }
.km-lp__three li { counter-increment: three; display: grid; grid-template-columns: 58px minmax(0, 1fr); column-gap: 18px; align-items: start; }
.km-lp__three li::before { content: counter(three); grid-row: 1 / span 2; font: 500 clamp(3.5rem, 2.6rem + 3.4vw, 6rem)/.82 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.03em; color: var(--ink); font-variant-numeric: lining-nums; }
.km-lp__three h3 { margin: 4px 0 6px; font: 700 1.1875rem/1.3 var(--font-text); }
.km-lp__three p { margin: 0; color: var(--muted); }
@media (min-width: 760px) {
  .km-lp__three { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(28px, 4vw, 56px); }
  .km-lp__three li { grid-template-columns: minmax(0, 1fr); }
  .km-lp__three li::before { grid-row: auto; margin-bottom: 18px; }
}
/* For whom and not: two lists, every line in ink. */
.km-lp__fit-grid { display: grid; gap: 32px; }
@media (min-width: 760px) { .km-lp__fit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(32px, 5vw, 80px); } }
.km-lp__fit h3 { margin: 0 0 18px; font: 500 clamp(1.5rem, 1.2rem + 1vw, 2rem)/1.1 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.01em; }
.km-lp__fit .km-iconlist { gap: 14px; }
.km-lp__fit .km-iconlist li > span { color: var(--ink); }
/* Offer next to the return promise: the card keeps its width, the promise stands on its own. */
.km-lp__offer-grid { display: grid; gap: 24px; align-items: start; }
@media (min-width: 960px) { .km-lp__offer-grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 32px; } }
.km-lp .lp-offer__card { max-width: none; margin-inline: 0; }
.km-lp__why-price { margin: 22px 0 0; padding: 18px 20px; border-radius: var(--radius); background: var(--sand); font-size: .9375rem; line-height: 1.55; color: var(--ink); max-width: none; }
.km-lp__why-price strong { font-weight: 700; }
.km-lp__guarantee { padding: clamp(24px, 4vw, 40px); border-radius: var(--radius-lg); background: var(--card); border: 2px solid var(--ink); }
.km-lp__guarantee > .km-icon { width: 40px; height: 40px; margin: 0 0 14px; }
.km-lp__guarantee h3 { margin: 0 0 12px; font: 500 clamp(1.625rem, 1.3rem + 1.2vw, 2.25rem)/1.08 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.01em; }
.km-lp__guarantee p { margin: 0; max-width: none; }
.km-lp__guarantee p + p { margin-top: 10px; }
/* Final call: centred, then the PS and PPS. */
.km-lp__final { text-align: center; }
.km-lp__final h2 { margin: 0 auto 18px; max-width: 16ch; }
.km-lp__final .lead { margin: 0 auto 26px; max-width: 34em; }
.km-lp__final .lp-buy { justify-content: center; margin-top: 0; }
.km-lp__final .lp-ps p { max-width: 40ch; font-size: clamp(1.125rem, 1rem + .5vw, 1.375rem); line-height: 1.4; }
.km-lp__final .lp-ps p + p { margin-top: 14px; }
.km-lp__final .lp-ps p strong { font-family: var(--font-text); font-weight: 700; font-size: .8em; letter-spacing: .04em; margin-right: 6px; }
.km-lp__final .lp-ps .lp-ps__sign { margin-top: 18px; }
@media (max-width: 599px) { .km-lp__final .lp-buy > .km-btn { width: 100%; } }

/* ---------- Home ---------- */
/* The hero reuses the landing page grid (.lp-hero); the starter gets the dark band with whole frames from the recording. */
.home-hero h1 { max-width: 13ch; }
.lp-hero .km-actions { margin-top: clamp(28px, 3.4vw, 36px); }
.home-start__grid { display: grid; gap: 32px; align-items: center; }
@media (min-width: 900px) { .home-start__grid { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(40px, 6vw, 96px); } }
.home-start .km-caption { color: var(--on-night-2); }
.home-start__title { margin: 0 0 18px; color: var(--on-night); font-size: clamp(2.125rem, 1.4rem + 2.6vw, 3.5rem); }
.home-start__lead { margin: 0 0 28px; font-size: var(--step-1); line-height: 1.5; color: var(--on-night-2); }
.home-start__price { color: var(--on-night-2); font-variant-numeric: tabular-nums; }
.home-start .km-btn:hover, .home-start .km-btn:focus-visible { border-color: var(--on-night); }
.home-start .km-btn::before { background: var(--on-night); }
@media (hover: hover) and (pointer: fine) { .home-start .km-btn:hover { color: var(--ink); } }
.home-returning { display: grid; gap: 24px; align-items: center; }
@media (min-width: 900px) { .home-returning { grid-template-columns: minmax(0, 1.3fr) auto; gap: 48px; } }
.home-returning h2 { font-size: clamp(1.75rem, 1.3rem + 1.8vw, 2.75rem); margin-bottom: 12px; }
.home-returning p { margin: 0; }
.home-returning-band { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }

/* ---------- Generic pages ---------- */
.page-head { padding: clamp(44px, 7vw, 96px) 0 clamp(24px, 4vw, 44px); }
.page-head h1 { max-width: 20ch; font-size: clamp(2.625rem, 1.6rem + 3vw, 4.25rem); margin-bottom: .3em; }
.page-head .lead { max-width: 58ch; margin: 0; }
.page-head--catalog { padding-bottom: clamp(16px, 3vw, 28px); }
.page-head--catalog .lp-terms { margin-top: 22px; }
.page-kicker { margin: 0 0 14px; font-weight: 600; color: var(--muted); }
/* O mnie: the landing page hero grid with Kasia's whole photo; the longer heading keeps 2–3 lines. */
.page-head--about h1 { max-width: 17ch; font-size: clamp(2.5rem, 1.5rem + 2.8vw, 3.875rem); }
.km-alert:focus { outline: none; }
.page-body { padding-bottom: clamp(64px, 9vw, 120px); }
.prose { max-width: 72ch; }
.prose h2 { font-size: var(--step-2); margin-top: 1.6em; }
.prose h3 { font-size: var(--step-1); margin-top: 1.4em; }
.prose ul, .prose ol { padding-left: 1.3em; }
.prose li { margin-bottom: .5em; }
.prose table { width: 100%; border-collapse: collapse; margin: 0 0 1.4em; font-size: .9375rem; }
.prose th, .prose td { border-bottom: 1px solid var(--line); padding: 10px 8px; text-align: left; vertical-align: top; }
.prose a { font-weight: 600; }
.legal-page .page-head h1 { font-size: clamp(2.25rem, 1.6rem + 2.6vw, 3.75rem); max-width: 22ch; }
.legal-layout { display: grid; gap: 32px; }
@media (min-width: 1000px) { .legal-layout { grid-template-columns: 240px minmax(0, 1fr); gap: 72px; } .legal-layout nav { position: sticky; top: 112px; align-self: start; } }
.legal-layout nav ul { list-style: none; padding: 0; margin: 0; border-left: 2px solid var(--line); }
.legal-layout nav a { display: block; padding: 8px 0 8px 16px; margin-left: -2px; border-left: 2px solid transparent; text-decoration: none; color: var(--muted); font-weight: 500; transition: color 160ms ease, border-color 160ms ease; }
.legal-layout nav a[aria-current="page"] { border-left-color: var(--ember); color: var(--ink); font-weight: 600; }
@media (hover: hover) and (pointer: fine) { .legal-layout nav a:hover { color: var(--ink); } }
.legal-page .prose { font-size: 1rem; }
.legal-page .prose h2 { font: 600 1.375rem/1.3 var(--font-text); letter-spacing: 0; }
.km-contact { display: grid; gap: 40px; }
@media (min-width: 960px) { .km-contact { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 80px; } }
.km-contact-form .km-btn, .km-contact-form button { margin-top: 6px; }
.km-contact-form label { display: block; margin: 0 0 7px; font-size: .9375rem; }
.km-contact-form p { max-width: none; }
.km-route { list-style: none; padding: 0; margin: 0 0 26px; display: grid; gap: 12px; }
.km-route li { padding: 18px 20px; border-radius: var(--radius-sm); background: var(--card); border: 1px solid var(--line); }
.km-route strong { display: block; margin-bottom: 4px; color: var(--ink); }
.km-seller { display: flex; gap: 10px; align-items: flex-start; margin: 28px 0 0; padding-top: 22px; border-top: 1px solid var(--line); color: var(--muted); max-width: none; }
.km-seller .km-icon { flex: 0 0 24px; width: 24px; height: 24px; margin-top: calc((1lh - 24px) / 2); }
.help-grid { display: grid; gap: 32px; align-items: start; }
@media (max-width: 959px) { .help-grid .km-help-card { order: 2; } }
@media (min-width: 960px) { .help-grid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 80px; } }
.about-facts { display: grid; gap: 40px; }
.about-statement { display: grid; gap: 40px; align-items: center; }
@media (min-width: 960px) { .about-statement { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 72px; } }
.about-statement h2 { margin-bottom: 28px; }
@media (min-width: 960px) { .about-facts { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 80px; } }

/* ---------- Library, courses, lessons, login ---------- */
.km-auth-card { max-width: 540px; margin: 0; padding: clamp(24px, 4vw, 44px); background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); }
.km-auth-card h2 { font-size: clamp(1.875rem, 1.4rem + 1.6vw, 2.5rem); }
.km-auth-card form p { max-width: none; }
.km-auth-card label { display: block; margin-bottom: 7px; }
.km-auth-card label:has(input[type="checkbox"]) { display: flex; gap: 10px; align-items: center; font-weight: 400; }
.km-auth-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.km-auth-hint { color: var(--muted); font-size: .9375rem; margin-top: 16px; }
.km-button-secondary, button.km-button-secondary { background: transparent !important; color: var(--ink) !important; }
@media (hover: hover) and (pointer: fine) { .km-button-secondary:hover { color: var(--paper) !important; } }
input#km-code { font: 600 1.75rem/1 var(--font-text); letter-spacing: .4em; text-align: center; font-variant-numeric: tabular-nums; }
/* Library: courses as wide rows (cover, progress, where to continue), extra materials as a grid, account and help on the side. */
.km-library-layout { display: grid; gap: clamp(36px, 5vw, 56px); }
@media (min-width: 1000px) { .km-library-layout { grid-template-columns: minmax(0, 1fr) 300px; gap: 48px; align-items: start; } .km-library-aside { position: sticky; top: 104px; } }
.km-library { display: grid; gap: clamp(40px, 5vw, 56px); }
.km-library-group > .page-kicker { font-size: 1rem; }
.km-library-list { display: grid; gap: 18px; }
.km-library-grid { display: grid; gap: 18px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); }
.km-library-card { display: flex; flex-direction: column; gap: 10px; padding: 22px; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); }
.km-library-card--course { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 18px; align-items: start; padding: 18px; }
@media (min-width: 700px) { .km-library-card--course { grid-template-columns: 176px minmax(0, 1fr); gap: 30px; padding: 24px 28px 24px 24px; } }
.km-library-card--text { grid-template-columns: minmax(0, 1fr); }
.km-library-card__cover { display: block; border-radius: 12px; overflow: hidden; }
.km-library-card__cover img { display: block; width: 100%; height: auto; }
.km-library-card__body { display: grid; gap: 10px; justify-items: start; min-width: 0; }
.km-library-card__type { margin: 0; color: var(--muted); font-size: .875rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.km-library-card h2, .km-library-card h3 { font: 500 1.5rem/1.18 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.01em; margin: 0; text-wrap: balance; }
@media (min-width: 700px) { .km-library-card--course h2, .km-library-card--course h3 { font-size: 1.875rem; } }
.km-library-card p { margin: 0; color: var(--muted); font-size: .9375rem; }
.km-library-card .km-progress { margin-top: 6px; }
.km-library-card__next { color: var(--ink) !important; }
.km-library-card__from { font-size: .875rem !important; }
.km-library-card .km-btn, .km-library-card .button { margin-top: 8px; align-self: flex-start; }
.km-library-card:not(.km-library-card--course) .km-btn { margin-top: auto; }
@media (max-width: 599px) { .km-library-card--course .km-btn { grid-column: 1 / -1; } .km-library-card--course > .km-library-card__body > p:not(.km-library-card__type):not(.km-library-card__next) { display: none; } }
/* Progress: a thin żar line with the count in words; the words carry the information. */
.km-progress { display: grid; gap: 8px; width: 100%; max-width: 380px; }
.km-progress__track { display: block; height: 6px; border-radius: 3px; background: var(--line); overflow: hidden; }
.km-progress__track > span { display: block; height: 100%; border-radius: inherit; background: var(--ember); transform-origin: left; animation: km-progress 700ms var(--ease-out) 150ms backwards; }
@keyframes km-progress { from { transform: scaleX(0); } }
.km-progress__label { color: var(--muted); font-size: .875rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.km-library-aside { display: grid; gap: 14px; }
.km-account { padding: 22px 24px; background: var(--sand); border-radius: var(--radius); }
.km-account h2 { font: 500 1.25rem/1.2 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.01em; margin: 0 0 10px; }
.km-account p { margin: 0 0 12px; font-size: .9375rem; line-height: 1.5; }
.km-account .km-email { white-space: normal; overflow-wrap: anywhere; }
.km-account__hint { color: var(--muted); }
.km-account form { margin: 4px 0 0; }
.km-logout { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border: 1.5px solid var(--ink); border-radius: var(--radius-btn); background: transparent; color: var(--ink); font: 700 .9375rem/1 var(--font-text); cursor: pointer; -webkit-tap-highlight-color: transparent; transition: transform 160ms var(--ease-out), background-color 160ms ease, color 160ms ease; }
.km-logout:active { transform: var(--press); }
@media (hover: hover) and (pointer: fine) { .km-logout:hover { background: var(--ink); color: var(--paper); } }
.km-account--help { background: transparent; border: 1px solid var(--line); }
.km-account__links { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; font-size: .9375rem; }
.km-account__links li { display: flex; gap: 10px; align-items: center; }
.km-account__links .km-icon { flex: none; width: 22px; height: 22px; }
.km-account__links a { overflow-wrap: anywhere; }
.km-empty { max-width: 640px; padding: clamp(24px, 4vw, 44px); background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); }
.km-empty h2 { font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.5rem); }
.km-back { display: inline-flex; gap: 8px; align-items: center; padding-block: 8px; font-weight: 600; text-decoration: none; }
.km-back span { transition: transform 200ms var(--ease-out); }
@media (hover: hover) and (pointer: fine) { .km-back:hover { text-decoration: underline; text-underline-offset: 5px; } .km-back:hover span { transform: translateX(-3px); } }
.km-course-page { padding-top: clamp(20px, 3vw, 36px); }
.km-course-back { margin: 0 0 clamp(14px, 2.4vw, 26px); }
.km-course-head { display: grid; gap: 12px; justify-items: start; margin-bottom: clamp(28px, 4vw, 44px); }
.km-course-kicker, .km-lesson-kicker { margin: 0; color: var(--muted); font-size: .9375rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.km-course-title { font-size: clamp(2.25rem, 1.5rem + 2.8vw, 3.75rem); line-height: 1.04; max-width: 24ch; margin: 0; }
.km-course-head .km-progress { margin-top: 4px; }
.km-course-note { max-width: 60ch; margin-top: 18px; }
.km-course-layout { display: grid; gap: 26px; }
/* Desktop: the video stays on screen while another lesson is picked (Bogumił 13.10). The lesson list is pinned and, when longer than the screen, scrolls inside its own box; short lists (the starter) behave as before and the lesson column never gets a second scrollbar. */
@media (min-width: 1000px) { .km-course-layout { grid-template-columns: 320px minmax(0, 1fr); gap: 44px; align-items: start; } .km-course-layout > nav { position: sticky; top: 96px; max-height: calc(100vh - 96px - 20px); overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; } .km-course-nav__title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } }
/* Phones: the lesson comes first and the full list follows it, so long legacy courses do not push the video down. */
@media (max-width: 999px) { .km-course-layout > nav { order: 2; } .km-course-nav__title { margin: 4px 10px 8px; font-size: .9375rem; } }
.km-course-layout > nav { padding: 14px; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); }
.km-course-layout > nav { counter-reset: lesson; }
.km-course-layout > nav ol { list-style: none; margin: 0; padding: 0; }
.km-course-nav__module { margin: 18px 10px 6px; font: 600 .75rem/1.3 var(--font-text); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.km-course-nav__title + .km-course-nav__module, .km-course-layout > nav > .km-course-nav__module:first-child { margin-top: 2px; }
@media (max-width: 999px) { .km-course-nav__title + .km-course-nav__module { margin-top: 10px; } }
.km-course-layout > nav li { counter-increment: lesson; }
.km-course-layout > nav a { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 10px; align-items: baseline; padding: 12px 10px; border-radius: 12px; text-decoration: none; line-height: 1.35; font-size: .9375rem; }
.km-course-layout > nav a::before { content: counter(lesson); font: 700 .9375rem/1 var(--font-text); color: var(--muted); font-variant-numeric: tabular-nums; }
@media (hover: hover) and (pointer: fine) { .km-course-layout > nav a:hover { background: var(--sand); } }
.km-course-layout > nav a[aria-current="page"] { background: var(--sand); color: var(--ink); font-weight: 600; box-shadow: inset 3px 0 0 var(--ember); border-radius: 0 12px 12px 0; }
.km-course-layout > nav a[aria-current="page"]::before { color: var(--ink); }
.km-lesson-meta { color: var(--muted); font-size: .8125rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
a[aria-current="page"] .km-lesson-meta { color: var(--muted); }
.km-done { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--ink); color: var(--paper); font-size: .75rem; font-weight: 700; }
a[aria-current="page"] .km-done { background: var(--ember); color: var(--ink); }
.km-lesson-title { font: 500 clamp(1.625rem, 1.2rem + 1.6vw, 2.25rem)/1.18 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.01em; margin: 6px 0 20px; }
.km-player { position: relative; aspect-ratio: var(--km-ratio, 16 / 9); border-radius: var(--radius); overflow: hidden; background: var(--ink); margin-bottom: 24px; }
/* A 9:16 recording stands in the middle, no taller than the screen; the page sets --km-ratio per recording. */
.km-player--portrait { width: min(100%, calc(78vh * var(--km-ratio, 9 / 16))); margin-inline: auto; }
.km-player-label { margin: 0 0 8px; color: var(--muted); font-size: .9375rem; font-weight: 600; }
.km-player + .km-player-label { margin-top: 4px; }
.km-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.km-player-pending { display: grid; place-items: center; text-align: center; aspect-ratio: 16 / 9; padding: 24px; border-radius: var(--radius); background: var(--ink); color: var(--paper); margin-bottom: 24px; }
.km-player-pending p { margin: 0 auto; max-width: 42ch; }
.km-lesson-body { max-width: 70ch; }
.km-lesson-attachments { margin: 26px 0; padding: 18px 20px; border-radius: var(--radius-sm); background: var(--sand); }
.km-lesson-attachments h3 { font-size: 1rem; margin: 0 0 8px; }
.km-lesson-attachments ul { margin: 0; padding-left: 1.2em; }
.km-progress-form { margin: 0; }
/* The next step after a lesson: one main action, where it leads, and a quiet way back to "not finished". */
.km-lesson-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin-top: 30px; padding-top: 26px; border-top: 1px solid var(--line); }
.km-lesson-next { margin: 0; color: var(--muted); font-size: .9375rem; }
.km-lesson-next a { color: var(--ink); font-weight: 700; text-decoration-thickness: 1.5px; text-underline-offset: 4px; }
@media (hover: hover) and (pointer: fine) { .km-lesson-next a:hover { text-decoration-thickness: 3px; text-decoration-color: var(--ember); } }
.km-lesson-next span { margin-left: 4px; font-variant-numeric: tabular-nums; }
.km-lesson-finished { display: flex; gap: 10px; align-items: center; margin: 0; font-weight: 600; }
.km-lesson-finished::before { content: "✓"; display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--ember); color: var(--ink); font-size: .8125rem; font-weight: 700; }
.km-textbtn { padding: 8px 0; border: 0; background: none; color: var(--muted); font: 500 .875rem/1.3 var(--font-text); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
@media (hover: hover) and (pointer: fine) { .km-textbtn:hover { color: var(--ink); } }
.km-lesson-actions .km-progress-form:has(.km-textbtn) { margin-left: auto; }
@media (max-width: 599px) { .km-lesson-actions > .km-btn, .km-lesson-actions > .km-progress-form:not(:has(.km-textbtn)), .km-lesson-actions > .km-progress-form:not(:has(.km-textbtn)) button { width: 100%; } .km-lesson-actions .km-progress-form:has(.km-textbtn) { margin-left: 0; } }
.km-material-view { max-width: 760px; }
.km-material-format { color: var(--muted); font-size: .875rem; font-weight: 600; }
.km-audio { padding: 22px; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); }
.km-audio-buttons { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.km-audio-buttons button { min-height: 46px; padding: 0 18px; border-radius: var(--radius-btn); border: 1.5px solid var(--ink); background: transparent; font-weight: 600; cursor: pointer; transition: transform 160ms var(--ease-out), background-color 160ms ease, color 160ms ease; }
.km-audio-buttons button:active { transform: var(--press); }
@media (hover: hover) and (pointer: fine) { .km-audio-buttons button:hover { background: var(--sand); } .km-audio-buttons .km-audio-play:hover { background: var(--ink-2); } }
.km-audio-buttons .km-audio-play { background: var(--ink); color: var(--paper); }
.km-audio-seek { width: 100%; accent-color: var(--ink); }
.km-audio-meta { display: flex; justify-content: space-between; gap: 12px; font-size: .875rem; color: var(--muted); margin-top: 8px; font-variant-numeric: tabular-nums; }

/* ---------- Checkout ---------- */
.km-checkout-page { padding: clamp(24px, 4vw, 56px) 0 clamp(56px, 8vw, 96px); }
.km-checkout-head { margin-bottom: clamp(22px, 3vw, 34px); }
.km-checkout-head h1 { font-size: clamp(2.25rem, 1.6rem + 2.4vw, 3.5rem); margin-bottom: 8px; }
.km-checkout-head p { color: var(--muted); margin: 0; }
.km-proof { display: flex; gap: 14px; align-items: flex-start; margin: 0; }
.km-proof .km-icon { flex: none; width: 30px; height: 30px; font-size: .9375rem; line-height: 1.45; margin-top: 0; margin-top: calc((1lh - 30px) / 2); }
.km-proof p { margin: 0; color: var(--ink); font-size: .9375rem; line-height: 1.45; max-width: none; }
.km-proof strong { font-weight: 700; }
.km-proof small { display: block; color: var(--muted); font-size: .8125rem; margin-top: 2px; }
.km-checkout-native form.checkout { display: grid; grid-template-areas: "summary" "notice" "main"; row-gap: 0; align-items: start; }
.km-checkout-native .km-form-col { grid-area: main; }
.km-checkout-native .km-side { grid-area: summary; display: grid; gap: 14px; margin-bottom: 22px; min-width: 0; }
.km-checkout-native form.checkout > .woocommerce-NoticeGroup { grid-area: notice; margin-bottom: 22px; }
.km-checkout-native form.checkout > .woocommerce-NoticeGroup .woocommerce-error { margin: 0; }
@media (min-width: 980px) {
  .km-checkout-native form.checkout { grid-template-columns: minmax(0, 1.3fr) minmax(0, .9fr); grid-template-rows: auto 1fr; grid-template-areas: "notice summary" "main summary"; column-gap: 44px; }
  .km-checkout-native .km-side { margin-bottom: 0; align-self: start; position: sticky; top: 100px; }
}
.km-form-col { display: grid; gap: 22px; min-width: 0; }
.km-panel, .km-pay { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: clamp(20px, 3vw, 32px); }
@media (max-width: 560px) { .km-panel, .km-pay { padding: 16px; } }
.km-step { display: flex; align-items: center; gap: 14px; margin: 0 0 20px; font: 600 1.3125rem/1.3 var(--font-text); letter-spacing: -.01em; }
.km-step::before { display: grid; place-items: center; width: 32px; height: 32px; flex: 0 0 32px; border-radius: 50%; background: var(--ink); color: var(--paper); font: 700 .9375rem/1 var(--font-text); }
.km-details .km-step::before { content: "1"; }
.km-pay .km-step::before { content: "2"; }
.km-checkout-native .woocommerce-billing-fields__field-wrapper { display: grid; grid-template-columns: 1fr 1fr; column-gap: 14px; }
.km-checkout-native .woocommerce-billing-fields__field-wrapper > * { grid-column: 1 / -1; }
/* Surname: an empty hidden input for Stripe only (no field to fill in since 16.10.2026). */
.km-checkout-native #billing_last_name_field { display: none !important; }
.km-checkout-native .form-row { margin: 0 0 16px; padding: 0; width: 100% !important; float: none !important; }
.km-checkout-native .form-row:last-child { margin-bottom: 0; }
.km-checkout-native .form-row .required { color: var(--muted); text-decoration: none; border: 0; }
.km-checkout-native .form-row .optional { display: none; }
.km-country-summary { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; color: var(--muted); font-size: .9375rem; }
.km-country-summary strong { color: var(--ink); font-weight: 600; }
.km-country-summary[hidden], .km-country-options[hidden] { display: none !important; }
.km-country-change { background: none; border: 0; padding: 10px 0; color: var(--ink); font: 600 .9375rem/1.5 var(--font-text); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 4px; cursor: pointer; }
@media (hover: hover) and (pointer: fine) { .km-country-change:hover { text-decoration-thickness: 3px; } }
.km-checkout-native .select2-container { width: 100% !important; }
.km-checkout-native .select2-container .select2-selection--single { height: 54px; display: flex; align-items: center; }
.km-checkout-native .select2-container .select2-selection__arrow { top: 14px; right: 10px; }
#billing_country_field .km-country-options label { margin-top: 10px; }

/* Add-on card: a real offer, not a checkbox in small print. */
.km-bump { position: relative; margin-top: 12px; display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 22px; padding: clamp(20px, 3vw, 28px); border-radius: var(--radius); background: var(--card); border: 2px dashed var(--line-strong); transition: border-color 200ms ease, background-color 200ms ease; }
.km-bump.is-added { border-style: solid; border-color: var(--ink); background: var(--sand); }
.km-bump.is-added .km-bump__toggle { background: var(--card); }
.km-bump[aria-busy="true"] { opacity: .7; }
.km-bump__flag { position: absolute; top: -14px; left: 22px; padding: 4px 12px; border-radius: 6px; background: var(--ink); color: var(--paper); font: 600 .8125rem/1.3 var(--font-text); }
.km-bump__media img { width: 112px; height: auto; border-radius: 10px; box-shadow: 0 12px 24px -14px rgba(23, 21, 27, .6); }
.km-bump__title { font: 500 clamp(1.5rem, 1.3rem + .8vw, 1.875rem)/1.15 var(--font-display); font-variation-settings: "opsz" 36; margin: 0 0 10px; letter-spacing: -.01em; }
.km-bump__text { margin: 0 0 14px; font-size: .9375rem; line-height: 1.55; }
.km-bump__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; margin: 0 0 16px; }
.km-bump__was { color: var(--muted); font-size: .9375rem; }
.km-bump__was del { text-decoration-thickness: 2px; text-decoration-color: var(--ink); color: var(--ink); }
.km-bump__now { font: 700 2.125rem/1 var(--font-text); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.km-bump__save { display: inline-block; padding: 3px 9px; border-radius: 4px; background: var(--ember); color: var(--ink); font: 600 .875rem/1.3 var(--font-text); }
.km-bump__toggle { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 0 22px 0 16px; border: 2px solid var(--ink); border-radius: var(--radius-btn); background: var(--card); color: var(--ink); cursor: pointer; font-weight: 600; user-select: none; max-width: 100%; width: fit-content; transition: transform 160ms var(--ease-out), background-color 160ms ease, color 160ms ease; }
@media (hover: hover) and (pointer: fine) { .km-bump__toggle:hover { background: var(--sand); } }
.km-bump__toggle:active { transform: var(--press); }
.km-bump__toggle input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.km-bump__box { display: grid; place-items: center; width: 26px; height: 26px; flex: 0 0 26px; border-radius: 7px; border: 2px solid currentColor; background: transparent; transition: background-color 150ms ease, border-color 150ms ease; }
.km-bump__box svg { width: 18px; height: 18px; opacity: 0; transform: scale(.6); transition: opacity 150ms var(--ease-out), transform 200ms var(--ease-out); }
.km-bump__toggle input:checked + .km-bump__box { background: var(--ember); border-color: var(--ember); color: var(--ink); }
.km-bump__toggle input:checked + .km-bump__box svg { opacity: 1; transform: none; }
@media (hover: hover) and (pointer: fine) { .km-bump__toggle:hover input:checked + .km-bump__box { background: var(--ink); border-color: var(--ink); color: var(--ember); } }
.km-bump__toggle:has(input:focus-visible) { outline: 2px solid var(--ink); outline-offset: 3px; }
.km-bump__on { display: none; }
.km-bump.is-added .km-bump__on { display: inline; }
.km-bump.is-added .km-bump__off { display: none; }
.km-bump__legal { margin: 14px 0 0; font-size: .8125rem; line-height: 1.5; color: var(--muted); }
@media (max-width: 560px) {
  .km-bump { grid-template-columns: 72px minmax(0, 1fr); gap: 16px; align-items: center; }
  .km-bump__media img { width: 72px; }
  .km-bump__body { display: contents; }
  .km-bump__title { font: 500 clamp(1.3125rem, 5.4vw, 1.625rem)/1.12 var(--font-display); font-variation-settings: "opsz" 36; margin: 0; }
  .km-bump__text, .km-bump__price, .km-bump__toggle, .km-bump__legal { grid-column: 1 / -1; margin: 0; }
  .km-bump__toggle { width: 100%; justify-content: center; }
}

/* Payment */
.km-checkout-native #payment { background: transparent; border-radius: 0; }
.km-checkout-native #payment ul.payment_methods { display: grid; gap: 10px; padding: 0; margin: 0 0 20px; border: 0; }
.km-checkout-native #payment ul.payment_methods::before, .km-checkout-native #payment ul.payment_methods::after { display: none; }
.km-checkout-native #payment ul.payment_methods > li { position: relative; list-style: none; padding: 14px 16px; margin: 0; border: 1.5px solid var(--line); border-radius: var(--radius); background: var(--card); transition: border-color 160ms ease; }
.km-checkout-native #payment ul.payment_methods > li:has(> input:checked) { border-color: var(--ink); }
.km-checkout-native #payment ul.payment_methods > li:has(> input:focus-visible) { outline: 2px solid var(--ink); outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) { .km-checkout-native #payment ul.payment_methods > li.wc_payment_method:not(:has(> input:checked)):hover { border-color: var(--line-strong); } }
/* Each method is one row: own radio, name, logo on the right. The native radio stays for keyboard and screen readers. */
.km-checkout-native #payment ul.payment_methods > li.wc_payment_method { padding: 0; }
.km-checkout-native #payment li.wc_payment_method > input.input-radio { position: absolute; top: 0; left: 0; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.km-checkout-native #payment li.wc_payment_method > label { display: flex; align-items: center; gap: 12px; min-height: 58px; margin: 0; padding: 12px 16px; font-weight: 600; font-size: 1.0625rem; line-height: 1.3; cursor: pointer; }
.km-checkout-native #payment li.wc_payment_method > label::before { content: ""; flex: 0 0 22px; width: 22px; height: 22px; box-sizing: border-box; border: 1.5px solid var(--line-strong); border-radius: 50%; background: var(--card); transition: border-color 160ms ease, box-shadow 160ms ease; }
.km-checkout-native #payment li.wc_payment_method > input:checked + label::before { border-color: var(--ink); box-shadow: inset 0 0 0 4.5px var(--card), inset 0 0 0 11px var(--ink); }
.km-checkout-native #payment li.wc_payment_method > label > img, .km-checkout-native #payment li.wc_payment_method > label > .km-pay-brands { margin: 0 0 0 auto; }
.km-checkout-native #payment li.wc_payment_method > label img { display: block; flex: 0 0 auto; width: auto; height: 24px; max-width: 72px; padding: 0; box-shadow: none; border-radius: 4px; }
.km-pay-brands { display: inline-flex; gap: 6px; flex: 0 0 auto; }
.km-checkout-native #payment div.payment_box { margin: 0; padding: 2px 16px 16px; background: transparent; border-radius: 0; color: var(--ink); font-size: .9375rem; }
.km-checkout-native #payment div.payment_box::before { display: none; }
.km-checkout-native #payment div.payment_box fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.km-checkout-native #payment div.payment_box .wc-stripe-upe-element { margin: 0; }
.km-checkout-native #payment div.payment_box ul.wc-saved-payment-methods[data-count="0"] { display: none; }
.km-checkout-native #payment div.payment_box .required { display: none; }
.km-checkout-native #payment .testmode-info { margin: 0 0 14px; padding: 10px 12px; border-radius: 10px; background: var(--sand); color: var(--muted); font-size: .8125rem; line-height: 1.5; max-width: none; }
.km-checkout-native #payment .testmode-info strong { color: var(--ink); }
.km-checkout-native #payment .testmode-info .wc-stripe-copy-test-number { padding: 0; border: 0; background: none; color: var(--ink); font: inherit; font-weight: 600; cursor: pointer; }
.km-checkout-native #payment #wc-stripe-blik-code_field { margin: 0 0 10px; }
.km-checkout-native #payment #wc-stripe-blik-code_field label { display: block; margin: 0 0 6px; font-weight: 600; }
.km-checkout-native #payment input.km-blik-code { width: 100%; max-width: 220px; padding: 12px 16px; font-size: 1.5rem; font-weight: 600; letter-spacing: .3em; font-variant-numeric: tabular-nums; }
.km-checkout-native #payment input.km-blik-code::placeholder { font-size: 1.0625rem; font-weight: 400; letter-spacing: normal; }
.km-checkout-native #payment .payment_method_stripe_blik fieldset > p { margin: 0; color: var(--muted); font-size: .875rem; line-height: 1.5; max-width: none; }
/* Apple Pay / Google Pay: shown only when Stripe draws a button for this device. */
.km-wallets { margin: 0 0 20px; }
.km-wallets[hidden] { display: none !important; }
.km-wallets #wc-stripe-express-checkout-element { margin: 0 !important; }
.km-wallets #wc-stripe-express-checkout-button-separator { display: none !important; }
.km-wallets.is-updating #wc-stripe-express-checkout-element { opacity: .55; transition: opacity 160ms ease; }
.km-wallets__note { margin: 10px 0 0; color: var(--muted); font-size: .875rem; line-height: 1.55; max-width: none; }
.km-wallets__note a { color: var(--ink); font-weight: 600; }
.km-wallets__or { display: flex; align-items: center; gap: 12px; margin: 18px 0 0; color: var(--muted); font-size: .8125rem; max-width: none; }
.km-wallets__or::before, .km-wallets__or::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.km-checkout-native #payment ul.payment_methods > li.woocommerce-notice { border: 0; border-left: 3px solid var(--ink); border-radius: 0 var(--radius) var(--radius) 0; background: var(--sand) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><circle cx='10' cy='10' r='8.5' fill='none' stroke='%2317151B' stroke-width='1.6'/><path d='M10 9v5.2' stroke='%2317151B' stroke-width='1.8' stroke-linecap='round'/><circle cx='10' cy='5.9' r='1.1' fill='%2317151B'/></svg>") 15px 15px / 20px no-repeat; padding-left: 46px; font-size: .9375rem; }
.km-checkout-native #payment .place-order { padding: 0; margin: 0; }
.km-checkout-native #place_order { width: 100%; min-height: 64px; font-size: 1.1875rem; margin-top: 4px; }
.km-checkout-native #place_order.is-busy { opacity: .85; cursor: progress; }
.km-checkout-native #place_order.is-busy::after { content: ""; width: 18px; height: 18px; margin-left: 10px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; animation: km-spin 700ms linear infinite; }
@keyframes km-spin { to { transform: rotate(360deg); } }
.km-terms-notice { margin: 0 0 14px; font-size: .875rem; line-height: 1.55; color: var(--muted); max-width: none; }
.km-terms-notice a { color: var(--ink); font-weight: 600; }
.km-pay-safe { display: flex; gap: 10px; align-items: flex-start; justify-content: center; margin: 14px 0 0; color: var(--muted); font-size: .8125rem; max-width: none; }
.km-pay-safe svg { width: 16px; height: 18px; flex: 0 0 16px; stroke: var(--ink); stroke-width: 1.7; }

/* Summary */
.km-summary { background: var(--sand); color: var(--ink); border-radius: var(--radius); padding: clamp(20px, 3vw, 30px); min-width: 0; }
.km-summary h2 { font: 500 1.625rem/1.2 var(--font-display); font-variation-settings: "opsz" 36; color: var(--ink); margin: 0 0 14px; }
.km-summary__product { display: flex; gap: 14px; align-items: center; margin: 0 0 8px; padding-bottom: 16px; border-bottom: 1px solid var(--line-soft); }
.km-summary__product img { width: 56px; height: 70px; border-radius: 6px; flex: 0 0 56px; outline: 1px solid var(--line-soft); }
.km-summary__product p { margin: 0; font-size: .9375rem; color: var(--muted); line-height: 1.45; }
.km-summary__product strong { display: block; color: var(--ink); font-weight: 600; font-size: 1rem; }
.km-summary .shop_table { width: 100%; border-collapse: collapse; font-size: .9375rem; color: var(--ink); border: 0; margin: 0; }
.km-summary .shop_table th, .km-summary .shop_table td { padding: 12px 0; border: 0; border-bottom: 1px solid var(--line-soft); text-align: left; vertical-align: top; background: transparent; font-weight: 400; }
.km-summary .shop_table td:last-child, .km-summary .shop_table th:last-child { text-align: right; white-space: nowrap; padding-left: 12px; }
.km-summary .shop_table thead { display: none; }
.km-summary .shop_table .product-quantity { display: none; }
.km-summary .shop_table .cart-subtotal { display: none; }
.km-summary .shop_table del { color: var(--muted); }
.km-summary .shop_table ins { text-decoration: none; color: var(--ink); font-weight: 700; }
.km-summary .order-total th, .km-summary .order-total td { border-bottom: 0; padding-top: 18px; font-size: 1.0625rem; font-weight: 600; }
.km-summary .order-total .amount { font: 700 2.125rem/1 var(--font-text); letter-spacing: -.02em; color: var(--ink); font-variant-numeric: tabular-nums; }
.km-summary .includes_tax, .km-summary small { display: block; font-size: .75rem; color: var(--muted); font-weight: 400; }
/* VAT inside the total row is a quiet note, not a second price (Bogumił 16.10). */
.km-summary .order-total .includes_tax { margin-top: 6px; line-height: 1.4; }
.km-summary .order-total .includes_tax .amount { font: inherit; letter-spacing: 0; color: inherit; }
.km-summary__notes { list-style: none; margin: 18px 0 0; padding: 18px 0 0; border-top: 1px solid var(--line-soft); display: grid; gap: 12px; }
.km-summary__notes li { display: flex; gap: 12px; font-size: .875rem; line-height: 1.5; color: var(--muted); }
.km-summary__notes .km-icon { flex: 0 0 22px; width: 22px; height: 22px; margin-top: 0; }
.km-summary__notes strong { display: block; color: var(--ink); font-weight: 600; }
.km-summary .blockUI.blockOverlay { background: var(--sand) !important; opacity: .6 !important; }
.km-mobile-summary { display: none; }
@media (max-width: 979px) {
  .km-checkout-native .km-summary { padding: 0; overflow: hidden; }
  .km-mobile-summary small { display: block; margin-top: 2px; color: var(--muted); font-size: .8125rem; font-weight: 500; }
  .km-mobile-summary { display: flex; width: 100%; justify-content: space-between; align-items: center; gap: 12px; min-height: 60px; padding: 14px 18px; background: transparent; border: 0; color: var(--ink); font: 600 1rem/1.3 var(--font-text); cursor: pointer; text-align: left; }
  .km-mobile-summary::after { content: ""; width: 10px; height: 10px; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); transform: rotate(45deg) translateY(-3px); margin-left: 6px; transition: transform 200ms var(--ease-out); }
  .km-mobile-summary[aria-expanded="true"]::after { transform: rotate(-135deg); }
  .km-mobile-summary [data-km-summary-total] { margin-left: auto; font: 700 1.375rem/1 var(--font-text); font-variant-numeric: tabular-nums; }
  .km-summary__panel { display: none; padding: 0 18px 20px; }
  .km-summary__panel.is-open { display: block; }
  .km-summary__panel > h2 { display: none; }
}
.km-checkout-native .woocommerce-form-coupon-toggle, .km-checkout-native .checkout_coupon, .km-checkout-native .woocommerce-form-login-toggle { display: none !important; }

/* Order states (thank-you, pay again, empty cart) */
.km-order { display: grid; gap: 22px; max-width: 780px; margin-inline: auto; }
.km-state { padding: clamp(24px, 4vw, 44px); border-radius: var(--radius-lg); background: var(--card); border: 1px solid var(--line); }
.km-state h1 { font-size: clamp(2.25rem, 1.5rem + 3vw, 3.75rem); }
.km-state h2 { font-size: var(--step-2); }
.km-state--ok { background: var(--sand); border-color: var(--sand); }
.km-state--warn { background: #FDF4F1; border-color: #E4C3BB; }
.km-state--warn h1 { color: #6E2418; }
.km-state__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin-top: 8px; }
.km-state__steps { margin: 26px 0 0; padding: 0; list-style: none; counter-reset: s; display: grid; gap: 12px; }
.km-state__steps li { counter-increment: s; display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 12px; align-items: baseline; }
.km-state__steps li::before { content: counter(s); font: 700 1.125rem/1 var(--font-text); color: var(--ink); font-variant-numeric: tabular-nums; }
.km-state--compact { margin-top: 22px; }
.km-order__details { padding: 20px 0 0; border-top: 1px solid var(--line); border-radius: 0; background: none; }
.km-order__meta { display: grid; gap: 12px 24px; margin: 0; }
@media (min-width: 600px) { .km-order__meta { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.km-order__meta dt { font-size: .8125rem; font-weight: 600; color: var(--muted); }
.km-order__meta dd { margin: 0; font-weight: 600; }
.km-order__details .woocommerce-order-details, .km-order__details .woocommerce-customer-details { margin-top: 18px; }
.km-order__details table { width: 100%; border-collapse: collapse; font-size: .9375rem; }
.km-order__details th, .km-order__details td { text-align: left; padding: 10px 0; border-bottom: 1px solid var(--line); }
.km-order__details h2 { font: 600 1.125rem/1.3 var(--font-text); }

/* Thank-you (paid): centred celebration on piasek, then what was bought and how to begin. Motion: rare moment, so
   the check and the wave draw once and the covers rise with a 70 ms stagger; nothing moves with reduced motion. */
.km-order--thanks { max-width: 1000px; margin-inline: auto; }
.km-thanks { position: relative; overflow: hidden; display: grid; gap: 40px; align-items: center; padding: clamp(28px, 5vw, 64px) clamp(20px, 4vw, 56px); border-radius: var(--radius-lg); background: var(--sand); }
@media (min-width: 900px) { .km-thanks { grid-template-columns: minmax(0, 1fr) 300px; gap: 56px; } }
@media (max-width: 899px) { .km-thanks__visual { display: none; } }
.km-thanks__frame { max-width: 220px; margin-inline: auto; animation: km-rise 400ms var(--ease-out) 450ms backwards; }
.km-thanks__visual .km-cover { max-width: 260px; margin-inline: auto; animation: km-rise 400ms var(--ease-out) 450ms backwards; }
.km-thanks__meta { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 12px; color: var(--ok); font-size: .9375rem; font-weight: 700; }
.km-thanks__check { width: 20px; height: 20px; overflow: visible; }
.km-thanks__check circle, .km-thanks__check path { fill: none; stroke: var(--ok); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; }
.km-thanks__check circle { animation: km-draw 500ms var(--ease-out) 100ms backwards; }
.km-thanks__check path { animation: km-draw 350ms var(--ease-out) 450ms backwards; }
.km-thanks h1 { margin: 0 0 4px; font-size: clamp(2.5rem, 1.6rem + 3vw, 4rem); }
.km-thanks__wave { display: block; width: min(260px, 60%); height: auto; margin: 0 0 24px; overflow: visible; }
.km-thanks__wave path { fill: none; stroke: var(--ember); stroke-width: 6; stroke-linecap: round; stroke-dasharray: 1; animation: km-draw 900ms var(--ease-in-out) 350ms backwards; }
.km-thanks .lead { margin: 0 0 26px; max-width: 52ch; }
.km-thanks__cta { margin: 0 0 16px; max-width: none; }
.km-thanks__note { margin: 0; max-width: 56ch; color: var(--muted); font-size: .9375rem; }
.km-email { white-space: nowrap; }
@media (max-width: 599px) { .km-email { white-space: normal; overflow-wrap: anywhere; } }
.km-thanks__grid { display: grid; gap: 22px; }
@media (min-width: 900px) { .km-thanks__grid { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: stretch; } }
.km-thanks__card { padding: clamp(22px, 3vw, 32px); border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); }
.km-thanks__card h2 { margin: 0 0 18px; font-size: clamp(1.5rem, 1.25rem + 1vw, 2rem); }
.km-thanks__card .km-tempo { margin: 0 0 22px; }
.km-thanks__card .km-state__steps { margin-top: 0; }
.km-bought { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.km-bought li { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 16px; align-items: center; animation: km-rise 400ms var(--ease-out) calc(300ms + var(--i, 0) * 70ms) backwards; }
@keyframes km-rise { from { opacity: 0; transform: translateY(10px); } }
.km-bought .km-cover { border-radius: 4px; box-shadow: none; outline: 1px solid var(--line-soft); outline-offset: -1px; }
.km-bought h3 { margin: 0 0 4px; font: 500 1.25rem/1.2 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.01em; }
.km-bought p { margin: 0; color: var(--muted); font-size: .9375rem; }
.km-state .km-bought { margin: 22px 0; }
.km-thanks__sign { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 6px 0 0; }
.km-thanks__sign p { margin: 0; color: var(--muted); text-align: center; }
.km-thanks__sign strong { display: block; color: var(--ink); font: 500 1.25rem/1.25 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.01em; }
.km-order__more { margin-top: 18px; border-top: 1px solid var(--line-soft); padding-top: 14px; }
.km-order__more summary { list-style: none; display: inline-flex; align-items: center; gap: 10px; cursor: pointer; font-weight: 600; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 4px; }
.km-order__more summary::-webkit-details-marker { display: none; }
.km-order__more summary::after { content: ""; width: 8px; height: 8px; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); transform: rotate(45deg) translateY(-2px); transition: transform 200ms var(--ease-out); }
.km-order__more[open] summary::after { transform: rotate(-135deg) translate(-2px, 0); }
@media (hover: hover) and (pointer: fine) { .km-order__more summary:hover { text-decoration-thickness: 3px; } }
/* Pending: the brand wave as the loader (constant motion, so linear), and the promise that the page checks itself. */
.km-state__live { color: var(--muted); font-size: .9375rem; }
.km-loader { display: block; width: 120px; height: auto; margin: 0 0 18px; overflow: visible; }
/* BLIK: waiting for the bank in a dialog on the order page (payments.js, 16.10.2026). */
.km-wait { width: min(92vw, 460px); max-width: none; margin: auto; padding: clamp(24px, 5vw, 36px); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--card); color: var(--ink); box-shadow: 0 24px 60px -24px rgba(23, 21, 27, .35); }
.km-wait::backdrop { background: rgba(23, 21, 27, .48); }
.km-wait[open] { animation: km-wait-in 220ms ease-out; }
.km-wait h2 { margin: 0 0 10px; font-size: var(--step-2); line-height: 1.16; }
.km-wait p { margin: 0 0 12px; color: var(--muted); }
.km-wait .km-wait__live { font-size: .9375rem; }
.km-wait .km-wait__live:empty { display: none; }
.km-wait p:last-of-type:not([hidden]) { margin-bottom: 0; }
.km-wait .km-wait__actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0 0; }
@keyframes km-wait-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .km-wait[open] { animation: none; } }
.km-loader path { fill: none; stroke: var(--ember); stroke-width: 7; stroke-linecap: round; stroke-dasharray: .22 .78; animation: km-flow 1600ms linear infinite; }
@keyframes km-flow { to { stroke-dashoffset: -1; } }

/* Social cards (home, O mnie): the whole card is the link; the arrow nudges on hover (fine pointers). */
.km-social-cards { list-style: none; display: grid; gap: 16px; margin: 0; padding: 0; }
@media (min-width: 800px) { .km-social-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; } }
.km-social-card a { display: grid; gap: 12px; align-content: start; height: 100%; padding: 24px; border: 1px solid var(--line-soft); border-radius: var(--radius); background: var(--card); text-decoration: none; transition: border-color 200ms ease, transform 200ms var(--ease-out), box-shadow 200ms var(--ease-out); }
.km-social-card a:active { transform: var(--press); }
.km-social-card__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--sand); }
.km-social-card__icon svg { width: 22px; height: 22px; }
.km-social-card__name { display: block; color: var(--muted); font-size: .9375rem; }
.km-social-card__name strong { display: block; color: var(--ink); font: 500 1.375rem/1.2 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.01em; }
.km-social-card__text { color: var(--muted); font-size: .9375rem; line-height: 1.5; }
.km-social-card__cta { align-self: end; font-weight: 700; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 5px; }
.km-social-card__cta::after { content: "→"; display: inline-block; margin-left: .4em; transition: transform 200ms var(--ease-out); }
@media (hover: hover) and (pointer: fine) {
  .km-social-card a:hover { border-color: var(--line); transform: translateY(-2px); box-shadow: 0 18px 36px -28px rgba(23, 21, 27, .4); }
  .km-social-card a:hover .km-social-card__cta { text-decoration-color: var(--ember); }
  .km-social-card a:hover .km-social-card__cta::after { transform: translateX(3px); }
}
.on-sand .km-social-card__icon { background: var(--sand); }

/* Proof as big numbers (km_stats): Cabinet numerals, grey labels. */
/* Chips: audience and the place to start (small radius, not pills). */
.km-chip { display: inline-flex; align-items: center; margin-right: 8px; padding: 1px 8px; border: 1px solid var(--line-strong); border-radius: 6px; color: var(--ink); font: 600 .8125rem/1.5 var(--font-text); vertical-align: 1px; }
.km-chip--ink { margin: 0 0 0 8px; background: var(--ink); border-color: var(--ink); color: var(--paper); }
.km-product__title, .km-bought h3, .km-bump__title, .km-faq summary, .km-social-card__name strong { text-wrap: balance; }
/* Contact: the routes are cards with an icon; the whole card is the link. */
.km-route li { position: relative; display: flex; gap: 14px; transition: border-color 160ms ease; }
.km-route .km-icon { flex: 0 0 28px; width: 28px; height: 28px; margin-top: 0; margin-top: calc((1lh - 28px) / 2); }
.km-route a { color: inherit; text-decoration: none; }
.km-route a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
@media (hover: hover) and (pointer: fine) { .km-route li:hover { border-color: var(--ink); } }
@media (max-width: 699px) { .km-route li { padding: 14px 16px; font-size: .9375rem; } }
/* Help: a card that stays in view next to the grouped questions. */
.km-help-card { align-self: start; display: grid; gap: 12px; justify-items: start; padding: 26px; border-radius: var(--radius); background: var(--sand); }
@media (min-width: 960px) { .km-help-card { position: sticky; top: 112px; } }
.km-help-card .km-icon { width: 36px; height: 36px; }
.km-help-card h2 { margin: 0; font-size: clamp(1.5rem, 1.25rem + 1vw, 2rem); }
.km-help-card p { margin: 0; color: var(--muted); }
.km-help-card__mail { font-size: .9375rem; }
.km-faq-groups section + section { margin-top: 44px; }
.km-faq-groups h2 { margin: 0 0 6px; font: 700 1.25rem/1.3 var(--font-text); letter-spacing: 0; }
/* Login: how it works, next to the card. */
.km-login-grid { display: grid; gap: 40px; }
@media (min-width: 960px) { .km-login-grid { grid-template-columns: minmax(0, 540px) minmax(0, 1fr); gap: 80px; align-items: start; } }
.km-login-how h2 { margin: 0 0 6px; font-size: clamp(1.5rem, 1.25rem + 1vw, 2rem); }
.km-login-how__help { margin: 22px 0 0; color: var(--muted); font-size: .9375rem; }
/* Kursy: three facts that remove doubts after the list. */
.km-assure { list-style: none; display: grid; gap: 18px 28px; margin: 48px 0 0; padding: 28px 0 0; border-top: 1px solid var(--line); }
@media (min-width: 800px) { .km-assure { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.km-assure li { display: flex; gap: 12px; color: var(--muted); font-size: .9375rem; line-height: 1.5; }
.km-assure .km-icon { flex: 0 0 26px; width: 26px; height: 26px; margin-top: 0; }
.km-assure strong { display: block; color: var(--ink); font-size: 1rem; }
/* 404 and other dead ends: three ways out as cards. */
.km-nav-cards { list-style: none; display: grid; gap: 16px; max-width: 980px; margin: 36px 0 0; padding: 0; }
@media (min-width: 760px) { .km-nav-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.km-nav-cards a { display: grid; gap: 8px; align-content: start; height: 100%; padding: 22px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); text-decoration: none; transition: border-color 160ms ease, transform 200ms var(--ease-out); }
.km-nav-cards a:active { transform: var(--press); }
.km-nav-cards .km-icon { width: 34px; height: 34px; }
.km-nav-cards strong { font: 500 1.375rem/1.2 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.01em; }
.km-nav-cards strong::after { content: "→"; display: inline-block; margin-left: 8px; transition: transform 200ms var(--ease-out); }
.km-nav-cards span { color: var(--muted); font-size: .9375rem; line-height: 1.45; }
@media (hover: hover) and (pointer: fine) { .km-nav-cards a:hover { border-color: var(--ink); } .km-nav-cards a:hover strong::after { transform: translateX(3px); } }
.km-verify__icon { display: grid; place-items: center; width: 48px; height: 48px; margin: 0 0 16px; border-radius: 50%; background: var(--sand); }
.km-verify__icon .km-icon { width: 24px; height: 24px; }

/* Phones: main actions take the full width, like the inputs above them. */
@media (max-width: 599px) { .lp-buy .km-btn, .km-verify .km-btn, .km-auth-card button[type="submit"]:not(.km-button-secondary), .km-contact-form .km-btn, .km-help-card .km-btn, .km-state__actions .km-btn, .km-thanks__cta .km-btn { width: 100%; } }

/* Order link opened later: the e-mail check as a calm card. */
.km-verify { max-width: 560px; margin: clamp(8px, 3vw, 32px) auto 0; padding: clamp(24px, 4vw, 44px); border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); }
.km-verify h1 { margin: 0 0 12px; font-size: clamp(2rem, 1.5rem + 2vw, 2.75rem); }
.km-verify__lead { margin: 0 0 24px; color: var(--muted); }
.km-verify .form-row { margin: 0 0 16px; }
.km-verify label { display: block; margin: 0 0 7px; font-weight: 600; }

/* WooCommerce single product and misc. */
.woocommerce .woocommerce-breadcrumb, .woocommerce .product_meta, .woocommerce .related, .woocommerce .upsells, .woocommerce .woocommerce-tabs, .woocommerce-result-count, .woocommerce-ordering { display: none !important; }
.km-product-page { padding: clamp(32px, 5vw, 72px) 0 clamp(56px, 8vw, 104px); }
.km-product-page__grid { display: grid; gap: 40px; align-items: start; }
@media (min-width: 960px) { .km-product-page__grid { grid-template-columns: 400px minmax(0, 1fr); gap: 80px; } .km-product-page__grid > .km-cover { position: sticky; top: 104px; } }
.km-product-page__grid .km-cover { max-width: 400px; }
.km-product-page h1 { font-size: clamp(2.25rem, 1.6rem + 2.6vw, 3.75rem); }
.km-product-page .lp-offer__price { margin-top: 0; }

/* 404 */
.km-404 { padding: clamp(56px, 10vw, 136px) 0; }
.km-404 h1 { max-width: 14ch; }
.km-404__curve { width: min(360px, 70%); height: auto; margin: 0 0 30px; overflow: visible; }
.km-404__curve path { fill: none; stroke: var(--ember); stroke-width: 8; stroke-linecap: round; stroke-dasharray: .47 .06 1; } /* a broken wave: the link broke */

/* Programme switch: a separate card after the add-on, read before it is clicked. */
.km-upgrade { margin-top: 12px; padding: clamp(20px, 3vw, 28px); border-radius: var(--radius); background: var(--card); border: 1px solid var(--line); }
.km-upgrade__kicker { margin: 0 0 6px; color: var(--muted); font: 600 .8125rem/1.3 var(--font-text); }
.km-upgrade__title { margin: 0 0 10px; font: 500 clamp(1.375rem, 1.2rem + .7vw, 1.75rem)/1.15 var(--font-display); font-variation-settings: "opsz" 36; letter-spacing: -.01em; }
.km-upgrade__text { margin: 0 0 14px; font-size: .9375rem; line-height: 1.55; max-width: 56ch; }
.km-upgrade__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; margin: 0 0 16px; }
.km-upgrade__price strong { font: 700 1.75rem/1 var(--font-text); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.km-upgrade__price span { color: var(--muted); font-size: .9375rem; }
.km-upgrade__note { margin: 14px 0 0; color: var(--muted); font-size: .8125rem; line-height: 1.5; }
.km-upgrade--back .km-upgrade__text { margin-bottom: 14px; }
/* Account: upgrade offer for starter owners (full path minus the starter). Sits under the library, courses and lessons. */
.km-more { margin-top: clamp(40px, 6vw, 72px); }
.km-more__grid { display: grid; gap: 32px; }
@media (min-width: 900px) { .km-more__grid { grid-template-columns: minmax(0, 1fr) 360px; gap: clamp(40px, 6vw, 80px); align-items: start; } }
.km-more__copy h2 { margin: 10px 0 18px; }
.km-more__copy .lead { max-width: 62ch; }
.km-more__copy p { max-width: 62ch; }
.km-more__list { margin: 22px 0 0; }
.km-more__ps { margin: 26px 0 0; padding-top: 18px; border-top: 1px solid var(--line); font-family: var(--font-display); font-variation-settings: "opsz" 36; font-size: 1.125rem; line-height: 1.45; }
.km-more__ps strong { font: 700 .8125rem/1 var(--font-text); letter-spacing: .08em; margin-right: 8px; vertical-align: 2px; }
.km-more__sign { display: block; margin-top: 8px; font-style: italic; color: var(--muted); }
.km-more__offer { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); padding: clamp(22px, 3vw, 30px); }
.km-more__kicker { margin: 0 0 10px; color: var(--muted); font: 600 .8125rem/1.3 var(--font-text); }
.km-more__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; margin: 0 0 10px; }
.km-more__price strong { font: 700 2.5rem/1 var(--font-text); letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.km-more__price span { color: var(--muted); font-size: .9375rem; }
.km-more__why { margin: 0 0 18px; font-size: .9375rem; line-height: 1.55; }
.km-more__terms { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 10px; font-size: .9375rem; line-height: 1.45; }
.km-more__terms li { display: flex; gap: 10px; align-items: flex-start; }
.km-more__terms .km-icon { flex: none; width: 22px; height: 22px; margin-top: 1px; }
.km-more__proof, .km-lp__join { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 12px; color: var(--muted); font-size: .9375rem; line-height: 1.45; }
.km-more__proof strong, .km-lp__join strong { color: var(--ink); }
.km-more__proof .km-icon, .km-lp__join .km-icon { flex: none; width: 20px; height: 20px; margin-top: 1px; }
.km-lp__join { justify-content: center; margin: 10px 0 0; }

/* Cookie dialog (Real Cookie Banner, light DOM): the headline speaks in the same serif as the page. The RCB option still
   names Cabinet Grotesk, which the site no longer loads; overriding it here leaves the consent settings and revision untouched. */
dialog [role="heading"][aria-level="2"] { font-family: var(--font-display) !important; font-weight: 500 !important; font-variation-settings: "opsz" 36; letter-spacing: -.012em !important; }

/* Reduced motion: fewer and gentler, not zero. Movement goes, colour and opacity changes stay.
   Kept at the very end of the file so it wins over the component rules it overrides (same specificity, later wins). */
@media (prefers-reduced-motion: reduce) {
  :root { --press: none; }
  html { scroll-behavior: auto; }
  .lp-sticky { transform: none !important; }
  .main-nav.is-open { transform: none; }
  .km-faq__a, .km-faq__in { transition: none; }
  .km-field-error, .km-notice, .woocommerce-message, .woocommerce-info, .woocommerce-error, .km-alert, .km-success { transform: none !important; }
  .km-success__icon circle, .km-success__icon path { animation: none; }
  .km-thanks__wave path, .km-bought li, .km-thanks__frame, .km-thanks__visual .km-cover, .km-thanks__check circle, .km-thanks__check path { animation: none; }
  .km-loader path { animation: none; stroke-dasharray: none; }
  .km-btn::before, .button::before, .woocommerce .button::before, button[type="submit"]:not(.km-plain):not(.km-bump__input)::before { transition: none; }
  .km-progress__track > span { animation: none; }
  .km-back span { transition: none; }
}