/* patrz app/docs/landing.md: We Are Designed landing. Zrodlem prawdy dla wygladu jest */

/* patrz app/docs/landing-fonts.md: KROJE Z WLASNEGO SERWERA, NIE Z GOOGLE */
@font-face{
  font-family:"Bebas Neue";font-style:normal;font-weight:400;font-display:swap;
  src:url("fonts/bebas-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"Bebas Neue";font-style:normal;font-weight:400;font-display:swap;
  src:url("fonts/bebas-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Inter Tight";font-style:normal;font-weight:300 600;font-display:swap;
  src:url("fonts/inter-tight-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"Inter Tight";font-style:normal;font-weight:300 600;font-display:swap;
  src:url("fonts/inter-tight-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Azeret Mono";font-style:normal;font-weight:400 500;font-display:swap;
  src:url("fonts/azeret-mono-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"Azeret Mono";font-style:normal;font-weight:400 500;font-display:swap;
  src:url("fonts/azeret-mono-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

/* patrz app/docs/landing-fonts.md: CYRYLICA */
@font-face{
  font-family:"Bebas Neue";font-style:normal;font-weight:400;font-display:swap;
  src:url("fonts/oswald-cyrillic-500.woff2") format("woff2");size-adjust:86.4%;
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Inter Tight";font-style:normal;font-weight:300 600;font-display:swap;
  src:url("fonts/inter-tight-cyrillic.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Azeret Mono";font-style:normal;font-weight:400;font-display:swap;
  src:url("fonts/jetbrains-mono-cyrillic-500.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Azeret Mono";font-style:normal;font-weight:500;font-display:swap;
  src:url("fonts/jetbrains-mono-cyrillic-600.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--fb);font-weight:300;line-height:1.5;-webkit-font-smoothing:antialiased;transition:background .5s var(--ease),color .5s var(--ease);overflow-x:clip}
a{color:inherit;text-decoration:none}
.mono{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3)}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
/* Bebas + polskie znaki diakrytyczne: interlinia nie moze byc ciasniejsza niz 1.06, inaczej S i Z wchodza w wiersz wyzej */
h1,h2,h3{font-family:var(--fd);font-weight:400;margin:0;text-transform:uppercase;letter-spacing:.01em;padding-top:.06em}
/* patrz app/docs/landing-fonts.md: WERSALIK PO ROSYJSKU WPROST */
:lang(ru) :is(.logo,.chapter .num,.plan .price,.step b){text-transform:uppercase}
h1{font-size:clamp(58px,8.6vw,132px);line-height:1.02}
/* patrz app/docs/landing.md: LINIJKA POD HASLEM — haslo ma dwa zdania po dwa slowa; przy 132 px lamalo sie na trzy wiersze */
.hero h1{font-size:clamp(58px,6.2vw,96px)}
h2{font-size:clamp(36px,4.6vw,66px);line-height:1.08}
h3{font-size:clamp(22px,2.2vw,30px);line-height:1.16}
em{font-style:normal;color:var(--accent)}
.num{font-family:var(--mono)}
/* patrz app/docs/landing.md: ATRYBUT HIDDEN UKRYWA ZAWSZE */
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.wrap{width:min(1360px,100% - 48px);margin-inline:auto}
@media (max-width:640px){.wrap{width:calc(100% - 32px)}}
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;border-radius:999px;border:1px solid var(--line2);font-weight:500;font-size:14px;transition:transform .25s var(--ease),background .25s,border-color .25s,box-shadow .25s;cursor:pointer;background:transparent;color:var(--ink);font-family:var(--fb);white-space:nowrap}
.btn:hover{transform:translateY(-2px);border-color:var(--ink2)}
.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:transparent;box-shadow:0 10px 30px var(--glow)}
/* patrz app/docs/landing.md: STRZALKA JEST W ARKUSZU, NIE W SZABLONIE */
.btn .arr{display:inline-block;transition:transform .25s}
.btn .arr::before{content:"\2192"}
.btn:hover .arr{transform:translateX(4px)}
.chip{display:inline-flex;gap:8px;align-items:center;padding:6px 10px;border-radius:999px;border:1px solid var(--line2);font-size:12px;color:var(--ink2);white-space:nowrap}
.chip.m::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent)}
.chip.f::before{content:"";width:6px;height:6px;border-radius:50%;border:1px solid var(--ink3)}

/* nav */
.nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0;backdrop-filter:blur(10px);background:color-mix(in srgb,var(--bg) 72%,transparent);border-bottom:1px solid var(--line)}
.logo{font-family:var(--fd);font-size:22px;letter-spacing:.02em;white-space:nowrap}
/* patrz app/docs/landing.md: KROPKA PO NAZWIE JEST W ARKUSZU */
.logo::after{content:"."}
.nav ul{display:flex;gap:26px;list-style:none;margin:0;padding:0;font-size:13px;color:var(--ink2)}
.nav ul a{position:relative}.nav ul a::after{content:"";position:absolute;left:0;right:100%;bottom:-6px;height:1px;background:var(--accent);transition:right .3s var(--ease)}.nav ul a:hover::after{right:0}
.nav .cta{display:flex;gap:10px;align-items:center}
.theme{width:40px;height:40px;border-radius:50%;border:1px solid var(--line2);display:grid;place-items:center;cursor:pointer;background:transparent;color:var(--ink);font-size:16px;font-family:var(--fb);transition:.25s}
.theme:hover{border-color:var(--ink2);transform:rotate(15deg)}
.theme::before{content:"\263E"}
[data-theme="light"] .theme::before{content:"\2600"}
@media (prefers-color-scheme:light){[data-theme="auto"] .theme::before{content:"\2600"}}

/* przelacznik jezyka: app/design/lang-menu.css */
@media (max-width:960px){.nav ul{display:none}.nav .btn{padding:10px 16px;font-size:13px}.logo{font-size:18px}.theme,.lang{width:34px;height:34px;border-color:transparent;color:var(--ink3);font-size:15px}.lang{font-size:10px}.nav .cta{gap:4px}}
/* patrz app/docs/landing.md: ZALOGUJ SIE ZOSTAJE W BELCE. Jedyne wejscie do
   aplikacji z landingu; na telefonie belka sie zweza, ale go nie chowa. */
@media (max-width:420px){.nav{gap:6px;padding-block:12px}.hero h1{font-size:50px}.logo{font-size:16px}.nav .btn{padding:9px 12px;font-size:12px}.nav .cta .btn.login{padding:9px 6px;border-color:transparent}.theme,.lang{width:30px;height:30px}.nav .cta{gap:2px}}

/* hero: siatka z obszarami — na biurku tytul i reszta po lewej, scena po prawej;
   na telefonie tytul → tekst i formularz → scena.
   patrz app/docs/landing.md: OBIETNICA, DATA I PRZYCISK W PIERWSZYM EKRANIE */
.hero{position:relative;width:100vw;margin-left:calc(50% - 50vw);min-height:100svh;display:grid;grid-template-columns:min(1360px,100% - 48px);justify-content:center;align-content:center;overflow:hidden}
.hero .inner{display:grid;grid-template-columns:1.05fr 1fr;grid-template-areas:"top ." "rest .";column-gap:32px}
.hero .top{grid-area:top;padding-top:32px;position:relative;z-index:3}
.hero .rest{grid-area:rest;padding-bottom:40px;position:relative;z-index:3}
.stage{position:absolute;inset:0;z-index:1}
.stage .scene{background-position:50% 50%}
/* obraz jest kwadratowy i przy cover nie ma zapasu w poziomie — postac przesuwamy calym
   pudlem warstwy w prawo, a lewy skraj chowa liniowa maska i rozmyta warstwa pod spodem */
.stage .scene.obj{inset:0 -14% 0 14%;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 40%);mask-image:linear-gradient(90deg,transparent 0%,#000 40%)}
.stage .ring,.stage .ring.r2{left:64%}
.stage .t1{left:72%;top:22%}.stage .t2{right:4%;top:60%}.stage .t3{left:48%;bottom:14%}
/* w dzien tlo jest bogate, wiec pod tekstem po lewej lezy delikatna zaslona w kolorze tla — tylko na biurku */
@media (min-width:961px){[data-theme="light"] .stage::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,color-mix(in srgb,var(--bg) 78%,transparent) 0%,color-mix(in srgb,var(--bg) 45%,transparent) 32%,transparent 52%)}}
@media (min-width:961px) and (prefers-color-scheme:light){[data-theme="auto"] .stage::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,color-mix(in srgb,var(--bg) 78%,transparent) 0%,color-mix(in srgb,var(--bg) 45%,transparent) 32%,transparent 52%)}}
.hero .promise{margin:14px 0 0;max-width:46ch;font-size:clamp(16px,1.35vw,20px);font-weight:500;line-height:1.4;color:var(--ink)}
/* patrz app/docs/landing.md: FORMULARZ W HERO LICZY NAPRAWDE */
.form{display:grid;grid-template-columns:1fr 1.25fr auto;grid-template-areas:"date place place" "hour name go";gap:10px;max-width:640px;padding:10px;border-radius:28px;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(12px)}
.form>.fld-date{grid-area:date}.form>.fld-place{grid-area:place}.form>.fld-hour{grid-area:hour}.form>.fld-name{grid-area:name}.form>.btn{grid-area:go}
.form input{all:unset;padding:12px 16px;border-radius:999px;background:var(--field);color:var(--ink);font-size:14px;min-width:0;font-family:var(--fb)}
.form input::placeholder{color:var(--ink3)}
.form .btn{justify-content:center}
/* patrz app/docs/landing.md: ETYKIETA WEWNATRZ POLA */
.fld{position:relative;display:block;min-width:0}
.fld-k{position:absolute;left:18px;top:8px;z-index:1;font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);pointer-events:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:calc(100% - 30px)}
.form .fld input{display:block;width:100%;box-sizing:border-box;padding:22px 12px 8px 18px;line-height:18px;font-variant-numeric:tabular-nums}
.form input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.fld-hour{display:flex;align-items:center;gap:10px;min-width:0}
.fld-hour .fld-time{flex:0 1 128px}
.fld-time.off{opacity:.4}
.nohour{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:13px;line-height:1.25;color:var(--ink2);cursor:pointer;user-select:none}
.nohour input{all:revert;width:16px;height:16px;margin:0;flex:none;accent-color:var(--accent);cursor:pointer}
.form-err{margin:12px 12px 0;font-size:13px;color:var(--accent);max-width:62ch}
/* zdanie o dniu, ktorego nie ma, stoi pod wpisem daty */
.date-nonexistent{display:block;margin:6px 0 0 18px;font-size:13px;line-height:1.3;color:var(--accent);white-space:normal}
.date-nonexistent[hidden]{display:none}
.start .places-chosen{margin:10px 12px 0;font-size:12px;color:var(--ink3);max-width:62ch}
/* podpowiedzi miejsc (`web/place.js`) — lista pod polem, nad reszta hero */
/* CEL PRZYCISKU „Zobacz siebie”: odstep na lepki pasek nawigacji, zeby formularz stanal pod nim caly */
.start{position:relative;z-index:5;scroll-margin-top:88px}
/* patrz app/docs/landing.md: PODPOWIEDZI NAD KLAWIATURA — pole podnosi sie pod lepki pasek, nie pod niego */
.fld-place{scroll-margin-top:88px}
.fld-place .places{position:absolute;left:0;right:0;top:calc(100% + 10px);z-index:30;min-width:min(320px,86vw);max-height:280px;overflow:auto;list-style:none;margin:0;padding:6px;border-radius:16px;background:var(--bg2);border:1px solid var(--line2);box-shadow:var(--shadow)}
.places-hit{display:flex;flex-wrap:wrap;align-items:baseline;align-content:center;gap:2px 10px;min-height:44px;padding:8px 12px;border-radius:10px;cursor:pointer;font-size:14px;line-height:1.3;color:var(--ink)}
.places-hit.is-on,.places-hit:hover{background:var(--field);box-shadow:inset 0 0 0 1px var(--line2)}
.places-zone{font-family:var(--mono);font-size:10px;letter-spacing:.08em;color:var(--ink3)}
.places-tag{font-size:11px;color:var(--accent)}
.places-state{padding:10px 12px;font-size:13px;color:var(--ink2)}
.places-source{margin-top:4px;padding:8px 12px 4px;border-top:1px solid var(--line);font-size:11px;color:var(--ink3)}
/* karta PRAWDZIWEGO wyniku: stoi obok przykladu, ktory na czas jej widocznosci znika */
/* patrz app/docs/landing.md: PIERWSZA ODPOWIEDZ STOI NAD ISKRAMI */
.reading{scroll-margin-top:88px;margin-top:26px;max-width:720px;padding:22px 24px;border-radius:var(--radius);background:linear-gradient(var(--panel),var(--panel)),var(--bg);border:1px solid var(--line2);box-shadow:var(--shadow);outline:none}
.reading-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}
.reading-head .mono{color:var(--accent)}
.reading-again{all:unset;cursor:pointer;font-size:13px;color:var(--ink2);display:inline-flex;align-items:center;min-height:44px;text-decoration:underline;text-decoration-color:var(--line2);text-underline-offset:5px}
.reading-again:hover,.reading-again:focus-visible{color:var(--ink);text-decoration-color:var(--accent)}
/* patrz app/docs/landing.md: PIERWSZA ODPOWIEDZ TO TRZY POZYCJE, SLOWA SA PODPISEM */
.reading-body{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"mini sent" "mini facts" "mini save";gap:18px 28px;align-items:start}
.reading-mini{grid-area:mini}.reading-sentences{grid-area:sent}.reading-facts{grid-area:facts}.reading-save{grid-area:save}
.reading-sentences{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.reading-sentences li{position:relative;padding-left:16px;font-size:17px;line-height:1.45;color:var(--ink)}
.reading-sentences li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--accent)}
.reading-sentences .dep{display:inline-block;margin-left:8px;font-family:var(--mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);vertical-align:middle}
.reading-sentences .rarity{display:block;margin-top:2px;font-size:12px;line-height:1.4;letter-spacing:.02em;color:var(--ink3)}
/* patrz app/docs/landing.md: OCENA POD ZDANIEM BEZ KONTA */
.reading-sentences .src{display:inline-block;margin-left:8px;padding:1px 7px;border:1px solid var(--line2);border-radius:999px;font-family:var(--mono);font-size:10px;line-height:1.5;letter-spacing:.06em;color:var(--ink3);vertical-align:middle;white-space:nowrap}
.rate{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:6px}
.rate-ask{font-size:12px;color:var(--ink3);margin-right:2px}
.rate button{min-height:44px;min-width:44px;padding:4px 12px;border:1px solid var(--line2);border-radius:999px;background:transparent;color:var(--ink2);font:inherit;font-size:13px;cursor:pointer}
.rate button:hover{border-color:var(--accent);color:var(--ink)}
/* wybrana ocena to stan, nie wezwanie: obrys i tlo z domieszka zlota, pelne zloto ma tylko „Zapisz" */
.rate button[aria-pressed="true"]{background:color-mix(in srgb,var(--accent) 22%,transparent);border-color:var(--accent);color:var(--ink)}
.rate button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.reading-rated{margin:0 0 10px;font-size:13px;color:var(--accent)}
/* telefon: pytanie raz, przy pierwszym zdaniu — trzy przyciski mieszcza sie wtedy w wierszu */
@media (max-width:440px){.reading-sentences li+li .rate-ask{display:none}.rate-ask{flex-basis:100%}.rate button{padding:4px 10px;min-width:44px}}
.reading-mini{display:block;width:150px;height:auto;aspect-ratio:488/743}
.reading-mini .k{fill:none;stroke:var(--line);stroke-width:6;stroke-linecap:round}
.reading-mini .k.on{stroke:var(--accent);stroke-width:9}
.reading-mini .o-pod{fill:var(--bg2);stroke:none}
.reading-mini .o{fill:var(--field);stroke:var(--line2);stroke-width:2}
.reading-mini .o.on{fill:color-mix(in srgb,var(--accent) 62%,transparent);stroke:var(--accent)}
.reading-facts{margin:0;padding-top:14px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:10px 24px}
.reading-facts dt{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);margin-bottom:4px}
/* patrz app/docs/landing.md: CZLOWIECZE SLOWO NAD NAZWA SYSTEMU. Podpis mowi
   „Twoja energia", a „Typ" stoi pod nim drobniej — to nazwa, pod ktora czlowiek spotka te
   rzecz we wnetrzu. */
.reading-facts dt:has(> .sys-name){font-family:var(--fb);font-size:12px;letter-spacing:0;text-transform:none;color:var(--ink2)}
.reading-facts dt .sys-name{display:block;margin-top:2px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3)}
/* patrz app/docs/landing.md: KAFEL FAKTU TO JEDNO PUDELKO */
.reading-body .reading-facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.reading-body .reading-facts>div{padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:var(--field);min-width:0}
.reading-astro .gloss{display:block;margin-top:6px;font-family:var(--fb);font-size:13px;line-height:1.35;color:var(--ink2);overflow-wrap:normal}
.reading-facts dd{margin:0;font-family:var(--mono);font-size:12px;line-height:1.3;letter-spacing:.04em;text-transform:uppercase;color:var(--ink2);overflow-wrap:break-word}
.reading-facts .dep{display:block;margin-top:6px;font-family:var(--mono);font-size:9px;line-height:1.3;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.reading-astro{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.reading-astro-k{margin:0 0 14px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
/* Znaki astrologii zostaja duze: podpisem jest tylko zargon HD nad nimi. */
.reading-astro .reading-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:20px 24px;padding-top:0;border-top:0}
.reading-astro .reading-facts dt{font-size:10px;margin-bottom:6px}
.reading-astro .reading-facts dd{font-family:var(--fd);font-size:clamp(24px,2.2vw,32px);line-height:1.02;letter-spacing:0;color:var(--ink);overflow-wrap:anywhere}
.reading-hour{margin:20px 0 0;padding:10px 14px;font-size:13px;color:var(--ink2);border-left:2px solid var(--accent);background:var(--field);border-radius:0 10px 10px 0}
.reading-foot .btn{white-space:normal;text-align:left}
.reading-foot{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center;justify-content:space-between;margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.reading-kept{margin:0;font-size:12px;color:var(--ink3);max-width:38ch}
.hero .note{margin:14px 0 0;font-size:13px;color:var(--ink3)}
.hero .first{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px;align-items:center}
/* karta przykladu wariantu */
.hero .variant-example{margin-top:16px;padding:14px 16px;border-radius:14px;border:1px solid var(--line);background:var(--field);max-width:52ch}
.hero .variant-example p{margin:8px 0 0;color:var(--ink2)}
.hero .first .mono{margin-right:6px}
.stage .layer{position:absolute;inset:0;will-change:transform}
.stage .scene{background-size:cover}
/* patrz app/docs/landing.md: GLOWA POSTACI ZAWSZE W KADRZE — 30% od gory trzyma glowe pod belka od 1280 do 1920 px */
.stage img.scene{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.stage .scene.big{inset:-10%;filter:blur(30px) saturate(1.05);opacity:.5}
.stage .mist{background:radial-gradient(ellipse 60% 40% at 68% 85%,var(--mist),transparent 70%);mix-blend-mode:screen}
.stage .ring{position:absolute;top:52%;width:min(46vw,640px);aspect-ratio:1;border:1px solid var(--line);border-radius:50%;transform:translate(-50%,-50%);opacity:.6}
.stage .ring.r2{width:min(60vw,820px);opacity:.3}
.stage canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.stage .tag{position:absolute;padding:8px 12px;border-radius:10px;background:var(--panel);backdrop-filter:blur(10px);border:1px solid var(--line);font-size:12px;color:var(--ink2);display:flex;gap:10px;align-items:center;white-space:nowrap}
.stage .tag b{font-weight:500;color:var(--ink)}
.stage .tag .dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px var(--accent)}
.scrollhint{position:absolute;right:24px;bottom:40px;display:flex;flex-direction:column;align-items:center;gap:10px;z-index:3}
.scrollhint .mono{writing-mode:vertical-rl}
.scrollhint .bar{width:1px;height:64px;background:linear-gradient(var(--accent),transparent)}
@media (max-width:960px){
  .hero{min-height:auto;grid-template-columns:100%}
  .hero .inner{grid-template-columns:1fr;grid-template-areas:"top" "rest" "stage";column-gap:0}
  .hero .top,.hero .rest{width:calc(100% - 32px);margin-inline:auto}
  .hero .top{padding-top:16px}.hero .top .eyebrow{margin-bottom:8px}.hero .rest{padding:12px 0 8px}
  .stage{grid-area:stage;position:relative;inset:auto;height:56svh;min-height:380px;margin-top:6px;width:100%}
  .stage .scene{background-position:center}
  .stage .scene.obj{inset:0;-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 14%,#000 86%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 14%,#000 86%,transparent 100%)}
  .stage .ring,.stage .ring.r2{left:50%}.stage .mist{background:radial-gradient(ellipse 60% 40% at 50% 85%,var(--mist),transparent 70%)}
  .form{grid-template-columns:1fr;border-radius:22px}.form input,.form .btn{border-radius:14px}
  .form{grid-template-columns:1fr;grid-template-areas:"date" "place" "hour" "name" "go"}
  .reading{padding:18px}.reading-body{grid-template-columns:88px minmax(0,1fr);grid-template-areas:"sent sent" "save save" "mini facts";gap:16px}.reading-mini{width:88px}
  .reading-facts{gap:10px 16px;padding-top:0;border-top:0;align-self:center}.reading-body .reading-facts{grid-template-columns:minmax(0,1fr);gap:8px}.reading-sentences li{font-size:16px}
  .reading-astro .reading-facts{grid-template-columns:1fr;gap:12px}.reading-astro .reading-facts dd{font-size:22px}
  .stage .tag{font-size:11px;padding:6px 10px}.stage .t1{left:5%;top:8%}.stage .t2{right:5%;top:48%}.stage .t3{left:6%;bottom:8%}.scrollhint{display:none}
}
/* telefon: przycisk nad paskiem zgod takze przy 360x780 */
@media (max-width:640px){
  .hero .top{padding-top:10px}.hero .rest{padding-top:8px}
  .form{gap:6px}.form .fld input{padding:20px 12px 6px 16px}.fld-k{top:7px;left:16px}
  .form .btn{padding-block:12px}.nohour{min-height:40px}
}
/* patrz app/docs/landing.md: PIERWSZY EKRAN TELEFONU */
@media (max-width:640px){
  .hero .inner{padding-top:10px;grid-template-areas:"top" "stage" "rest"}
  .hero .top{padding-top:0}
  .hero .stage{grid-area:stage;position:relative;inset:auto;width:100%;height:clamp(180px,calc(100svh - 508px),222px);min-height:0;margin:0;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 3%,#000 92%,transparent);mask-image:linear-gradient(180deg,transparent 0,#000 3%,#000 92%,transparent)}
  .stage img.scene.obj{inset:0;width:100%;height:100%;object-position:50% 42%;-webkit-mask-image:none;mask-image:none}
  .stage .tag{display:none}
  .hero .rest{padding-top:4px}
}
@media (min-width:641px){.hero .promise{margin-bottom:16px}}
@media (max-width:440px){.hero h1{font-size:38px}.hero .promise{margin-top:6px;font-size:14px;line-height:1.35}}
/* patrz app/docs/landing.md: ZLOTY PRZYCISK NAD BANEREM ZGODY NA 360 x 780 */
@media (max-width:440px) and (max-height:810px){
  .nav{padding-block:6px}
  .hero h1{line-height:.98}
  .hero .promise{line-height:1.3;margin-top:4px}
}
/* krotkie okno telefonu — patrz app/docs/landing.md: PIERWSZY EKRAN TELEFONU */
@media (max-width:440px) and (max-height:760px){
  .nav{padding-block:2px}
  .form .fld input{padding-top:20px}
  .hero .promise{max-width:none;font-size:14px;line-height:1.22;margin-top:2px}
  /* patrz app/docs/landing.md: ZLOTY PRZYCISK NAD BANEREM ZGODY NA 369 x 698 */
  .hero .inner{padding-top:8px}
  .hero .top .eyebrow{line-height:14px;margin-bottom:4px}
  .hero h1{line-height:.96;padding-top:0}
  .form{gap:3px;padding-block:3px 10px}
  .hero .rest{padding-top:0}
}

/* sekcje */
section.block{padding:clamp(64px,9vw,120px) 0;position:relative}
.sec-head{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:end;margin-bottom:44px}
.sec-head p{max-width:46ch;color:var(--ink2);font-size:17px;margin:0}
@media (max-width:900px){.sec-head{grid-template-columns:1fr;gap:14px;margin-bottom:32px}}
.split{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.card{padding:30px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(12px);box-shadow:var(--shadow);position:relative;overflow:hidden}
.card .n{display:block;margin-bottom:14px}
.card h3{margin-bottom:12px}
.card p{color:var(--ink2);margin:0}
.card ul{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:12px;color:var(--ink2);font-size:15px}
.card ul li{display:flex;gap:12px;align-items:baseline}
.card ul li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent);flex:none;transform:translateY(-2px)}
.card.faith ul li::before{background:transparent;border:1px solid var(--ink3)}
/* ROZWIJANIE (patrz app/docs/landing.md): etykieta i znak +/− w jednym wierszu. Na biurku
   (>800 px) tresc stoi otwarta; na telefonie skrypt zamyka karty. Bez skryptu wszystko otwarte. */
.fold>summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:44px}
.fold>summary::-webkit-details-marker{display:none}
.fold>summary::after{content:"+";font-family:var(--fd);font-size:26px;line-height:1;color:var(--accent);flex:none}
.fold[open]>summary::after{content:"\2212"}
.fold>summary h3,.fold .fold-t h3{margin:0}
.fold[open]>summary{margin-bottom:12px}
.fold .fold-t{display:block}
@media (max-width:800px){.split{grid-template-columns:1fr}.card{padding:22px}}

/* jezyki */
.systems{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.sys{padding:24px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--line);display:flex;flex-direction:column;gap:8px;min-height:190px;position:relative;overflow:hidden;transition:transform .35s var(--ease),border-color .35s}
.sys:hover{transform:translateY(-4px);border-color:var(--line2)}
.sys .img{position:absolute;inset:auto -20% -40% auto;width:60%;aspect-ratio:1;background-size:cover;background-position:center;opacity:.18;-webkit-mask-image:radial-gradient(circle at 50% 50%,#000 30%,transparent 70%);mask-image:radial-gradient(circle at 50% 50%,#000 30%,transparent 70%);pointer-events:none}
.sys h3{font-size:26px}
.sys p{margin:0;color:var(--ink2);font-size:14px;max-width:36ch;position:relative}
.sys .st{margin-top:auto;align-self:flex-start}
@media (min-width:901px){.systems{grid-template-columns:repeat(4,1fr)}}@media (max-width:900px){.systems{grid-template-columns:1fr 1fr}}@media (max-width:640px){.systems{grid-template-columns:1fr}.sys{min-height:0}}
/* jezyki w planach: na stronie, ale za rozwijaniem — patrz app/docs/landing.md: PIERWSZY TYDZIEN */
.sys-later{margin-top:18px}
.sys-later summary{cursor:pointer;display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--ink2);font-size:15px;text-decoration:underline;text-underline-offset:3px}
.sys-later summary::after{content:"+";font-family:var(--fd);color:var(--accent);font-size:20px;text-decoration:none}
.sys-later[open] summary::after{content:"−"}
.sys-later .systems{margin-top:12px}

/* pierwszy tydzien: trzy prawdziwe ekrany aplikacji */
.shots{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.shot{margin:0;display:flex;flex-direction:column;gap:12px}
.shot picture{display:block}
.shot img{display:block;width:100%;height:auto;aspect-ratio:6/5;border-radius:var(--radius);border:1px solid var(--line2);background:#081127;box-shadow:var(--shadow)}
.shot figcaption{display:grid;grid-template-columns:auto 1fr;column-gap:10px;row-gap:2px;align-items:baseline}
.shot figcaption b{font-size:18px;font-weight:500;color:var(--ink)}
.shot figcaption span:last-child{grid-column:2;color:var(--ink2);font-size:15px}
.week-more{margin:26px 0 0;max-width:70ch;color:var(--ink2);font-size:17px}
.week-more b{color:var(--ink);font-weight:500}
@media (max-width:900px){.shots{grid-template-columns:1fr;max-width:520px}}

/* rozdzialy */
.chapters{border-top:1px solid var(--line)}
.chapter{display:grid;grid-template-columns:110px 1fr auto;gap:28px;padding:36px 0;border-bottom:1px solid var(--line);align-items:start}
.chapter .num{font-family:var(--fd);font-size:clamp(40px,5vw,68px);line-height:1;color:var(--ink3)}
.chapter .k{display:block;margin-bottom:8px}
.chapter h3{margin-bottom:6px}.chapter p{color:var(--ink2);margin:0;max-width:48ch}
.chapter .meta{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
@media (max-width:900px){.chapter{grid-template-columns:1fr;gap:10px;padding:28px 0}.chapter .meta{justify-content:flex-start}}

/* plany */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
.plan{padding:30px 26px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--line);display:flex;flex-direction:column;gap:14px;position:relative}
.plan.hi{border-color:var(--accent);box-shadow:0 20px 60px var(--glow)}
.plan .price{font-family:var(--fd);font-size:clamp(44px,4.5vw,62px);line-height:1}
.plan .price small{font-family:var(--fb);font-size:14px;color:var(--ink3);text-transform:none;letter-spacing:0}
.plan .price b[data-state="pending"]::before{content:"—";color:var(--ink3)}
.plan ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;color:var(--ink2);font-size:14px}
.plan ul li{display:flex;gap:10px}.plan ul li::before{content:"\2014";color:var(--accent);flex:none}
.plan .btn{margin-top:auto;justify-content:center}
.plan .tagline{font-size:12px;color:var(--ink3)}
.plan .anchor{margin:0;font-size:13px;color:var(--ink2)}
.plan-head{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.badge{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:5px 9px;border-radius:999px;background:var(--accent);color:var(--accent-ink)}
/* cena zalozycielska: WEWNATRZ karty Pelni, zeby nie dalo sie jej przeczytac jako ceny trzech planow */
/* patrz app/docs/landing.md: CO DOSTAJESZ, ZANIM ZOBACZYSZ CENE */
.plan-frame{position:relative;margin:0;border-radius:12px;overflow:hidden;border:1px solid var(--line);aspect-ratio:600/221}
.plan-frame img{display:block;width:100%;height:100%;object-fit:cover}
/* kadr w motywie strony: ciemny obraz w jasnej karcie byl jej najciezsza plama */
.plan-frame .plan-frame-light{display:none}
[data-theme="light"] .plan-frame .plan-frame-dark{display:none}
[data-theme="light"] .plan-frame .plan-frame-light{display:block}
@media (prefers-color-scheme:light){[data-theme="auto"] .plan-frame .plan-frame-dark{display:none}[data-theme="auto"] .plan-frame .plan-frame-light{display:block}}
/* znaczek na wysokosci wiersza „Zapytajcie sie nawzajem", ktory konczy sie przed polowa kadru;
   gorny prawy rog zaslanial koniec pierwszego zdania */
.plan-frame-tag{position:absolute;top:42%;right:8px;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:4px 8px;border-radius:999px;background:color-mix(in srgb,var(--bg) 80%,transparent);color:var(--ink2)}
html[lang="ru"] .plan-frame-tag{top:47%}
.refund-line{margin:0;font-size:12px;line-height:1.4;color:var(--ink2);text-align:center}
/* odnosnik do warunkow zwrotu: cel dotyku 44 px bez zmiany wysokosci wiersza */
.refund-line a{display:inline-flex;align-items:center;min-height:44px;margin:-13px 0;color:inherit;text-decoration:underline;text-decoration-color:var(--line2);text-underline-offset:4px}
.founder{margin-top:4px;padding:14px 14px 12px;border-radius:12px;border:1px dashed var(--line2);background:color-mix(in srgb,var(--accent) 9%,transparent)}
.founder .mono{display:block;margin-bottom:10px;color:var(--accent)}
.steps{display:grid;grid-template-columns:repeat(3,1fr);position:relative}
.steps:not(:empty)::before{content:"";position:absolute;left:16%;right:16%;top:40px;height:1px;background:var(--line2)}
.step{text-align:center;font-size:11px;color:var(--ink3);position:relative;padding-top:2px}
.step::after{content:"";position:absolute;left:50%;top:36px;width:8px;height:8px;border-radius:50%;background:var(--bg);border:1px solid var(--ink3);transform:translateX(-50%)}
.step b{display:block;font-family:var(--fd);font-weight:400;font-size:20px;letter-spacing:.02em;color:var(--ink3);line-height:28px;margin-bottom:20px}
.step span{display:block}
.step.now{color:var(--ink)}.step.now b{color:var(--accent);font-size:26px}.step.now::after{background:var(--accent);border-color:var(--accent);box-shadow:0 0 10px var(--accent)}
.founder .waves-note{margin:10px 0 0;font-size:12px;color:var(--ink2)}
/* koniec fali i zmiana planu: warunek obietnicy, wiec stoi na KAZDEJ szerokosci, takze na telefonie */
.founder .waves-end{margin:8px 0 0;font-size:12px;line-height:1.4;color:var(--ink2)}
@media (max-width:900px){.plans{grid-template-columns:1fr}}
/* karta Przewodnika stoi ukryta, dopoki list nie istnieje — dwie karty zostaja w swojej szerokosci, na srodku */
@media (min-width:901px){.plans:has(> .plan[hidden]){grid-template-columns:repeat(2,minmax(0,440px));justify-content:center}}

/* przelacznik okresu, pas rozliczeniowy i stany cennika — czytane z kontraktu */
.price-controls{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:26px}
.seg{display:inline-flex;gap:4px;padding:4px;border-radius:999px;border:1px solid var(--line2);background:var(--panel)}
.seg button{border:0;background:transparent;color:var(--ink3);font-family:var(--fb);font-size:13px;padding:8px 16px;border-radius:999px;cursor:pointer;transition:.25s}
.seg button[aria-pressed="true"]{background:color-mix(in srgb,var(--accent) 20%,transparent);color:var(--ink);box-shadow:inset 0 0 0 1px var(--accent)}  /* zloto ma jedna glowna akcja na ekranie (D3) */
.save-tag{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.region-note{font-size:12px;color:var(--ink3)}
.pricing-stale{margin:20px 0 0;font-size:13px;color:var(--accent)}
.pricing-down{margin-top:22px;padding:18px 20px;border-radius:var(--radius);border:1px solid var(--line2);background:var(--panel);display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.pricing-down p{margin:0;color:var(--ink2);font-size:14px}

/* strona cennika (docs/pricing.md 16): rozbicie roku, kotwice, podglad regionu, dodatki, pytania */
/* kwota roku krojem i kolorem tekstu glownego, nie mniejsza i nie szara */
.per-split{margin:0;font-size:16px;line-height:1.5;color:var(--ink)}
.anchor-fact{margin:0;font-size:12px;color:var(--ink3);line-height:1.5}
.region-view{display:inline-flex;gap:8px;align-items:center;font-size:12px;color:var(--ink3)}
.region-view select{font:inherit;color:var(--ink);background:var(--panel);border:1px solid var(--line2);border-radius:999px;padding:6px 12px;min-height:44px}  /* cel dotyku 44 px, takze na biurku */
.offers{padding:clamp(40px,5vw,64px) 0 0}
.offers h2,.pricing-proof h2{font-size:clamp(24px,2.6vw,34px);margin-bottom:20px}
.offer-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.offer{padding:22px 20px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--line);display:flex;flex-direction:column;gap:8px}
.offer b{font-family:var(--fd);font-weight:400;font-size:28px;line-height:1.1}
.offer p{margin:0;font-size:14px;color:var(--ink2)}
.trial-line{margin:24px 0 0;font-size:14px;color:var(--ink2)}
.pricing-proof p{margin:0;font-size:16px;color:var(--ink2);max-width:70ch;line-height:1.66}
.pricing-faq{max-width:78ch}
.pricing-page #plans{padding-top:clamp(24px,3vw,40px);padding-bottom:clamp(24px,3vw,40px)}
.pricing-page main > .block:not(#plans){padding-top:clamp(32px,4vw,40px)}
/* strona cennika: tytul strony mowi juz, czym jest sekcja planow — naglowek zostaje dla czytnika ekranu */
.pricing-page #plans .sec-head{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:0}
/* jedno zloto na karcie Pelni: znaczek ceny zalozycielskiej jest obrysem, nie drugim zlotym polem */
/* tytul cennika nizszy niz notatek: pierwszy ekran nalezy do karty Pelni */
.pricing-page .note-title{font-size:clamp(30px,4vw,56px)}
.pricing-page .note-head .eyebrow{display:none}  /* tytul mowi „cena" */
.pricing-page .plan .badge{background:transparent;color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
/* pytania zwiniete: summary sam trzyma 44 px celu, wiec 20 px oddechu nad i pod nim to juz tylko wysokosc strony */
.pricing-page .pricing-faq details{padding:6px 0}

.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:900px){.trio{grid-template-columns:1fr}}
.measure{margin-top:24px}
.measure ul{max-width:78ch}

/* drzwi dla kogos, kogo ktos tu wpisal */
.entered{margin-top:24px;padding:26px 28px;border-radius:var(--radius);border:1px dashed var(--line2);display:flex;gap:24px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.entered-in{max-width:62ch}
.entered-in h3{font-size:clamp(20px,1.9vw,26px);margin-bottom:8px}
.entered-in p{margin:0;color:var(--ink2);font-size:14px}
.entered-door{font-family:var(--mono);font-size:12px;letter-spacing:.06em}

/* pytania */
.faq{max-width:860px}
.faq details{border-top:1px solid var(--line);padding:20px 0}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;font-size:18px;font-weight:400;color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--fd);font-size:26px;color:var(--accent);transition:transform .3s;flex:none}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{margin:12px 0 0;color:var(--ink2);max-width:58ch}

/* misja + stopka */
.mission{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center;padding:clamp(48px,7vw,96px) 0;border-top:1px solid var(--line)}
.mission p{margin:12px 0 0;color:var(--ink2);font-size:17px;max-width:44ch}
.mission .we{display:flex;flex-wrap:wrap;gap:8px}
@media (max-width:900px){.mission{grid-template-columns:1fr}}
.disclose{padding:20px 22px;border-radius:14px;border:1px solid var(--line);color:var(--ink3);font-size:13px;max-width:60ch;margin-top:20px}
footer{padding:44px 0 88px;color:var(--ink3);font-size:13px;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:24px}
footer b{display:block;color:var(--ink2);font-weight:500;margin-bottom:10px}
footer a{display:block;margin:6px 0}
footer a:hover{color:var(--ink)}
footer .tagline{margin:10px 0 0;max-width:36ch}
footer .soon{display:block;margin:6px 0;color:var(--ink3)}  /* bez opacity: tekst ma miec 4,5:1 */
footer .wad-consent-open{display:block;margin:6px 0;color:var(--ink3);text-align:left}
footer .wad-consent-open:hover{color:var(--ink)}
.foot-langs{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.foot-langs a{margin:0}
.foot-langs a[aria-current="true"]{color:var(--accent)}
footer .year{margin:12px 0 0}
/* LINIA SPOLKI. Przy fladze `off` jej nie ma w dokumencie wcale; `draft` niesie znak
   wersji roboczej i pola do uzupelnienia — obie rzeczy maja byc widoczne jako niegotowe. */
footer .attrib{grid-column:1/-1;flex-basis:100%;margin:0;font-size:12px;line-height:1.6;color:var(--ink3);max-width:72ch}
footer .company{margin:12px 0 0;font-size:12px;line-height:1.6;color:var(--ink3);max-width:72ch}
footer .company-draft{display:inline-block;padding:0 8px;margin-right:4px;border:1px dashed var(--line);border-radius:6px;color:var(--ink2);text-transform:uppercase;letter-spacing:.06em;font-size:11px}
footer .company-pending{opacity:.7;text-decoration:underline dotted}
@media (max-width:800px){footer{grid-template-columns:1fr 1fr}}

/* RUCH JEST WARSTWA, NIE NOSNIKIEM TRESCI. Wejscie w hero tylko PRZESUWA tekst, a sekcje
   ponizej stoja w spoczynku w calosci (app/docs/landing.md). */
[data-motion="on"] .hero .rv{transform:translateY(16px)}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv{opacity:1!important;transform:none!important}
  .btn,.sys,.theme{transition:none}
}

/* ── NOTA PUBLICZNA `/twoje-dane` ──────────────────────────────────── */
.note-page .nav{position:static;background:transparent}
.note-page .nav .cta{margin-left:auto}
.note-head{padding:clamp(40px,5vw,70px) 0 0}
.note-title{font-size:clamp(38px,5.4vw,74px);line-height:1.04;margin-bottom:20px;max-width:20ch}
.note-head .lede{color:var(--ink2);font-size:17px;max-width:70ch}
.note-body{display:flex;flex-direction:column;gap:clamp(34px,4.4vw,52px);padding:clamp(40px,5vw,64px) 0}
.note-part{display:flex;flex-direction:column;gap:14px;max-width:78ch}
.note-part h2{font-size:clamp(24px,2.6vw,34px)}
.note-part h3{margin-top:12px;font-size:clamp(20px,2vw,26px)}
.note-part p{font-size:16px;color:var(--ink2);max-width:70ch;line-height:1.66;margin:0}
.note-aside{font-size:15px!important;color:var(--ink3)!important}
.note-act{border-left:1px solid var(--accent);padding-left:clamp(18px,2.4vw,28px)}
.note-address{font-family:var(--mono);font-size:clamp(16px,2.2vw,20px);word-break:break-word;color:var(--ink)}
.note-address-live{border-bottom:1px solid var(--accent)}
.note-address-waiting{color:var(--ink3)}
.note-promise{font-size:16px;color:var(--ink2);max-width:70ch;line-height:1.66}
.hr{border:0;border-top:1px solid var(--line);margin:0}
/* ── REGULAMIN I POLITYKA PRYWATNOSCI `/terms`, `/privacy` ── */
.legal-pending,.legal-doc{gap:16px;max-width:78ch}
.legal-pending .lede{font-size:18px;color:var(--ink);line-height:1.6;margin:0}
.legal-pending h2{margin-top:18px;font-size:clamp(22px,2.4vw,30px)}
.legal-pending ul{margin:0;padding-left:1.2em;display:grid;gap:10px}
.legal-pending a{color:var(--ink);border-bottom:1px solid var(--accent);text-decoration:none}
.legal-doc h2{margin-top:22px;font-size:clamp(22px,2.4vw,30px)}
.legal-doc h3{margin-top:12px;font-size:clamp(18px,1.9vw,22px)}
.legal-doc p,.legal-doc li,.legal-doc td,.legal-doc th{font-size:16px;color:var(--ink2);line-height:1.66}
.legal-doc p{margin:0}
.legal-doc ul,.legal-doc ol{margin:0;padding-left:1.3em;display:grid;gap:6px}
.legal-doc code{font-family:var(--mono);font-size:.92em}
.legal-doc blockquote{margin:0;border-left:1px solid var(--accent);padding-left:18px}
.legal-table{overflow-x:auto;max-width:100%}
.legal-table table{border-collapse:collapse;min-width:100%}
.legal-table th,.legal-table td{border-bottom:1px solid var(--line);padding:8px 12px 8px 0;text-align:left;vertical-align:top}
.legal-draft{border:1px solid var(--accent);padding:12px 16px;color:var(--ink)!important}
.legal-note{color:var(--ink3)!important;font-size:15px!important}
.note-page footer{display:block;padding:32px 0 72px;border-top:1px solid var(--line)}
.note-page .foot{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
.note-page .foot p{margin:0}
.note-page .foot-langs{margin-top:0}

/* ── OTWARTE LABORATORIUM `/lab` ───────────────────────────────── */
.lab-period{margin:6px 0 0}
.lab-consenting{margin:0}
.lab-state{border-left:2px solid var(--accent);padding:10px 14px;background:var(--field);border-radius:0 10px 10px 0}
.lab-rows{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:18px;max-width:78ch}
.lab-row{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"topic share" "bar bar" "meta counts";gap:6px 16px;align-items:baseline;padding-bottom:16px;border-bottom:1px solid var(--line)}
.lab-row-all{padding:16px 18px;border:1px solid var(--line2);border-radius:var(--radius);background:var(--panel)}
.lab-topic{grid-area:topic;font-family:var(--fd);font-size:clamp(18px,1.8vw,22px);text-transform:uppercase;color:var(--ink)}
.lab-share{grid-area:share;justify-self:end;font-size:clamp(22px,2.4vw,30px);color:var(--ink)}
.lab-row-all .lab-share{color:var(--accent)}
.lab-bar{grid-area:bar;display:block;width:100%;height:14px}
.lab-bar-track{fill:var(--field)}
.lab-bar-ci{fill:color-mix(in srgb,var(--accent) 45%,transparent)}
.lab-bar-share{fill:var(--accent)}
.lab-bar-half{fill:var(--ink2)}
.lab-meta{grid-area:meta;font-size:14px;color:var(--ink2)}
.lab-counts{grid-area:counts;font-size:12px;color:var(--ink3);text-align:right}
.lab-legend{font-size:13px!important;color:var(--ink3)!important}
.lab-archive{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.lab-archive a{display:inline-block;padding:6px 12px;border:1px solid var(--line2);border-radius:999px;font-size:13px}
.lab-archive a[aria-current="page"]{border-color:var(--accent);color:var(--accent)}
.lab-join,.lab-csv,.lab-live{border-bottom:1px solid var(--accent)}
@media (max-width:560px){.lab-row{grid-template-areas:"topic share" "bar bar" "meta meta" "counts counts"}.lab-counts{text-align:left}}

/* strona statusu: kropka powtarza slowo stanu */
.status-checked{margin:10px 0 0;font-size:15px;color:var(--ink2);max-width:60ch}
.status-list{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:0;max-width:78ch}
.status-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;padding:14px 0;border-bottom:1px solid var(--line)}
.status-dot{flex:none;width:10px;height:10px;border-radius:50%;border:2px solid var(--ink3);align-self:center}
.status-row[data-state="up"] .status-dot{background:var(--lumen);border-color:var(--lumen)}
.status-row[data-state="down"] .status-dot{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 4px var(--glow)}
.status-name{font-family:var(--fd);font-size:clamp(17px,1.7vw,20px);text-transform:uppercase;color:var(--ink)}
.status-word{margin-left:auto;color:var(--ink)}
.status-row[data-state="down"] .status-word{color:var(--accent)}
.status-row[data-state="unmeasured"] .status-word{color:var(--ink3)}
.status-detail{flex-basis:100%;padding-left:24px;font-size:14px;color:var(--ink2)}
.status-slo{border-left:2px solid var(--lumen);padding:10px 14px;background:var(--field);border-radius:0 10px 10px 0}
.status-slo[data-slo="missed"]{border-left-color:var(--accent)}
.status-slo[data-slo="unmeasured"]{border-left-color:var(--ink3)}
.status-incidents{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px}
.status-verdict{color:var(--ink)}
.status-page[data-status="down"] .status-verdict{color:var(--accent)}
/* telefon: rysunek odpowiedzi na cala szerokosc, pola 16 px (iOS nie przybliza), „Nie znam godziny" 44 px */
@media (max-width:960px){
  .reading-body{grid-template-columns:minmax(0,1fr);grid-template-areas:"sent" "save" "mini" "facts"}
  .reading-mini{width:min(100%,280px);justify-self:center}
}
@media (max-width:640px){
  .form input,.form .fld input{font-size:16px}
  .nohour{min-height:44px}
  .nohour input{width:22px;height:22px}
}
/* telefon: cel dotyku 44x44, pismo 12 px (app/docs/landing.md) */
@media (max-width:640px){
  .fld-k,.mono,.eyebrow,.stage .tag,.badge,.save-tag,.step,.lang,
  .reading-sentences .dep,.reading-facts dt,.reading-facts dt .sys-name,.reading-facts .dep,
  .reading-astro-k,.reading-astro .reading-facts dt,.places-zone,.places-tag,.places-source{font-size:12px}
  /* etykieta stoi W polu, nad wpisana wartoscia: wiekszy podpis potrzebuje 2 px wiecej gory */
  .form .fld input{padding-top:23px}
  .theme,.lang{width:44px;height:44px}
  .logo,.nav .btn{min-height:44px}
  .logo{display:inline-flex;align-items:center}
  .seg button{min-height:44px}
  .faq summary{min-height:44px;align-items:center}
  footer a,footer .wad-consent-open{display:flex;align-items:center;min-height:44px;margin:0}
  .foot-langs a{display:inline-flex;min-width:44px;justify-content:center}
}
/* waska belka: znak w dwoch linijkach */
@media (max-width:420px){
  .logo{white-space:normal;max-width:4.6em;line-height:1.05}
}

/* ── TELEFON: CALA STRONA W SZESCIU EKRANACH ── patrz app/docs/landing.md o tym samym tytule.
   Zadnej tresci nie ubywa: ciasniej, karty rozwijane i mniej powtorzonych lede. */
@media (max-width:440px){
  section.block{padding:12px 0}
  section.block .eyebrow{margin-bottom:3px;line-height:1.2}  /* hero ma wlasny rytm: pole daty i przycisk nie wolno przesunac pod baner */
  section.block h2{font-size:26px;line-height:1.08}
  .sec-head{margin-bottom:10px;gap:8px}
  .sec-head p{font-size:14px}
  .card{padding:18px}
  .card .n{margin-bottom:8px}
  .card h3{margin-bottom:6px;font-size:19px}
  .card ul{margin-top:8px;gap:6px;font-size:14px}
  .card p{font-size:14px}
  .split,.trio{gap:12px}
  .shots{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-16px;padding:0 16px 6px;scrollbar-width:none}
  .shots::-webkit-scrollbar{display:none}
  .shot{flex:0 0 82%;scroll-snap-align:start;gap:8px}
  /* kadr, nie miniatura: szerszy zrzut, ale tylko gorna czesc ekranu (napis w skali ~.5, nie ~.4); budzet trzech ekranow nie rosnie */
  .shot img{aspect-ratio:600/221;object-fit:cover;object-position:top}
  .shot figcaption{grid-template-columns:1fr}
  .shot figcaption span:first-child{display:none}  /* „01" przy trzech zrzutach w pasku nic nie mowi */
  .shot figcaption span:last-child{grid-column:1;font-size:14px}
  .shot figcaption b{font-size:16px}
  .week-more{margin-top:8px;font-size:14px}
  .systems{display:flex;flex-wrap:wrap;gap:6px}
  .systems .sys{padding:2px 12px;min-height:32px;border-radius:999px;flex-direction:row;align-items:center;gap:0}
  .systems .sys .img,.systems .sys .mono,.systems .sys p,.systems .sys .st{display:none}
  .systems .sys h3{font-size:15px;line-height:1.2;margin:0}
  .sys-later{margin-top:6px}
  .shots{scroll-padding-inline:16px}
  #foundations .sec-head p,#languages .sec-head p,#plans .sec-head p{display:none}  /* tytul mowi to samo; karty ponizej niosa tresc */
  /* trzy zdania o ludziach: naglowek w biegu, jedno zdanie pod kazdym nie potrzebuje wlasnego wiersza */
  .trio .card,.measure.card{padding:8px 0 0;border:0;border-top:1px solid var(--line);border-radius:0;background:none;box-shadow:none;backdrop-filter:none}
  .trio .card h3{display:inline;margin:0 6px 0 0;font-size:16px}.trio .card p{display:inline;font-size:14px}
  .measure ul{gap:4px}
  /* karty rozwijane: wiersz z etykieta i znakiem, cel dotyku 44 px (`.fold` w arkuszu wyzej) */
  .fold>summary{gap:8px}
  .fold[open]>summary{margin-bottom:4px}
  #foundations .split{gap:0}
  #foundations .split .card .n{display:none}  /* „01 · Policzone" powtarza naglowek karty */
  #foundations .card ul{line-height:1.4}
  #foundations .split .card{padding:0;border:0;border-top:1px solid var(--line);border-radius:0;background:none;box-shadow:none;backdrop-filter:none}
  .measure.card{padding:0;margin-top:0}
  .entered{margin-top:12px;padding:6px 14px 12px;gap:4px}
  .entered p{font-size:14px}
  .faq details{padding:0}  /* summary sam trzyma 44 px celu dotyku */
  .faq summary{font-size:15px;gap:8px}
  .mission{padding:16px 0;gap:12px}
  .mission h2{font-size:24px}
  .mission p{font-size:14px}
  .mission .we{gap:0 10px}
  .mission .we .chip{border:0;padding:0;min-height:0;background:none;font-size:13px;color:var(--ink3)}
  .mission .we .chip:not(:last-child)::after{content:"·";margin-left:10px}
  .disclose{margin-top:12px;padding:10px 12px;font-size:13px}
  footer{grid-template-columns:1fr;gap:2px;padding:22px 0 72px}
  footer > div{display:flex;flex-wrap:wrap;column-gap:18px;align-items:baseline}
  footer > div > b,footer .tagline,footer .foot-langs,footer .year,footer .company{flex-basis:100%}
  footer a,footer .soon,footer .wad-consent-open{margin:0;padding:6px 0;min-height:24px}
  footer .logo{max-width:none;white-space:nowrap}
  footer .tagline{margin:0}
  .foot-langs{margin-top:0}footer .year{margin-top:4px}
  /* „wkrotce" w stopce to obietnice bez adresu: na telefonie schodza, jak jezyki w planach;
     naglowki kolumn („Produkt", „Zaufanie") tez — odnosniki pod nimi mowia to samo */
  footer .soon,footer > div > b{display:none}
  /* cennik: te same karty i ta sama tresc, ciasniej */
  .price-controls{margin-bottom:6px;gap:8px}
  .plans{gap:8px}
  .plan{padding:22px 14px;gap:12px}
  .plan.hi{padding-top:16px}
  .plan .price{font-size:44px}
  .plan ul{gap:6px}
  .plan.hi ul{gap:4px}
  .plan:not(.hi){flex-direction:row;flex-wrap:wrap;align-items:baseline;column-gap:14px}  /* nazwa i cena w jednym wierszu */
  .plan:not(.hi) > ul,.plan:not(.hi) > .btn,.plan:not(.hi) > .per-split,.plan:not(.hi) > .anchor,.plan:not(.hi) > .tagline,.plan:not(.hi) > .anchor-fact{flex-basis:100%}
  .plan.hi > .anchor{display:none}  /* cztery jezyki stoja juz w karcie Odkrycia tuz nad nia */
  .founder .waves-note{display:none}  /* powtarzaja to, co mowi tytul fal i rozbicie ceny tuz nad nimi */
  .founder{padding:8px 12px}
  .founder .waves-end{margin-top:6px;line-height:1.3}  /* budzet trzech ekranow nie rosnie, wiec zdanie o koncu fali bierze miejsce z ciasnego ukladu karty */
  .founder .mono{margin-bottom:4px;letter-spacing:.04em}
  .steps:not(:empty)::before{top:30px}
  .step b{margin-bottom:12px;line-height:24px}.step.now b{font-size:22px}
  .step::after{top:27px}
  section.block,.mission,footer{line-height:1.4}
}

/* ── TELEFON: SEKCJE DRUGIEGO PLANU ZWINIETE ── patrz app/docs/landing.md: TELEFON: TRZY EKRANY */
.sect-btn{all:unset;box-sizing:border-box;display:flex;text-align:left;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:44px;cursor:pointer;font:inherit;color:inherit;letter-spacing:inherit;text-transform:inherit;line-height:inherit}
.sect-btn::after{content:"";flex:none;width:9px;height:9px;margin-right:6px;border-right:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:translateY(-3px) rotate(45deg);transition:transform .25s var(--ease)}
.sect-btn[aria-expanded="true"]::after{transform:translateY(2px) rotate(-135deg)}
.sect-btn:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:6px}
section.zwiniete > :not(.sec-head),section.zwiniete .sec-head > p,.mission.zwiniete > :not(:first-child),.mission.zwiniete p{display:none}
section.zwiniete .sec-head{margin-bottom:0}
section.block.zwiniete{padding-block:4px;border-top:1px solid var(--line)}
.mission.zwiniete{padding-block:4px}
/* link do formularza w belce: obrys zamiast zlota — zlota jest jedna glowna akcja na ekranie (D3) */
.nav .btn.see{border-color:var(--accent);color:var(--ink)}
.nav .btn.see:hover{background:color-mix(in srgb,var(--accent) 14%,transparent)}
section.zwiniete .eyebrow,.mission.zwiniete .eyebrow{display:none}
/* lista „co zawiera" w karcie planu: ten sam przycisk ze strzalka, mniejszy */
.plan-inc{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:10px;min-height:44px;cursor:pointer;font-size:14px;color:var(--ink2);font-family:var(--fb)}
.plan-inc[hidden]{display:none}
.plan-inc::after{content:"";flex:none;width:7px;height:7px;border-right:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:translateY(-2px) rotate(45deg);transition:transform .25s var(--ease)}
.plan-inc[aria-expanded="true"]::after{transform:translateY(2px) rotate(-135deg)}
.plan-inc:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:6px}
.plan.zwiniete > ul{display:none}
.attrib-fold{grid-column:1/-1}
@media (max-width:440px){
  .plan:not(.hi) > .plan-inc{flex-basis:100%}
  footer .foot-product{display:none}  /* te same cztery odnosniki stoja tuz nad stopka jako zwiniete sekcje */
  .attrib-fold>summary{font-size:13px;color:var(--ink3)}
}
@media (max-width:440px){
  /* zwiniete sekcje: sam wiersz przycisku, bez oddechu sekcji */
  section.block.zwiniete{padding-block:0}
  section.zwiniete h2,.mission.zwiniete h2{margin:0;padding:0;font-size:20px}
  section.zwiniete .sec-head{gap:0}
  .mission.zwiniete{padding-block:0;border-top:1px solid var(--line)}
  #plans .eyebrow{display:none}  /* tytul mowi to samo; „wymyślona osoba" (#how .sec-head > p) zostaje widoczna — warunek WAD */
  /* karta planu: „co zawiera" i przycisk w jednym wierszu */
  .plan:not(.hi) > .plan-inc{flex-basis:auto}
  .plan:not(.hi) > .btn{flex:1 1 auto}
  .plan.hi{display:grid;grid-template-columns:auto 1fr;column-gap:12px;row-gap:8px;align-items:center}
  .plan.hi > *{grid-column:1/-1}
  .plan.hi > .plan-inc{grid-column:1}
  .plan.hi > #standard-cta{grid-column:2}
  .plan > .plan-inc,.plan > .btn{order:2}
  .plan > .refund-line{order:2}
  .plan > ul{order:3}
  footer > div:first-child .logo{display:none}
  footer{padding-top:12px}
}
@media (max-width:440px){
  #how .eyebrow{display:none}  /* tytul „Co dostajesz w pierwszym tygodniu" mowi to samo */
  /* przelacznik okresu i „gratis" w jednym wierszu, region i podatek w drugim */
  .price-controls{column-gap:10px;row-gap:2px}
  .price-controls .region-note{line-height:1.3}
  footer .foot-langs,footer .year{flex-basis:auto}
  footer .year{margin:0 0 0 auto}
}
@media (max-width:440px){
  .form .btn{min-height:44px}
  footer a,footer .wad-consent-open{min-height:44px;padding-block:0}
  footer > div{column-gap:12px}
  footer a,footer .wad-consent-open{font-size:12px}
  /* przykladowa odpowiedz: trzy pigulki ciasniej (nie sa celami, to obraz wyniku) */
  .hero .first{margin-top:max(36px,calc(100svh - 744px));gap:6px}  /* odpowiedz przykladowa nie lezy pod bannerem zgody w zadnym oknie telefonu */
  .hero .first .chip{padding-block:4px}  /* piec odnosnikow zaufania w dwoch wierszach takze po rosyjsku */
  :lang(ru) section.block h2{font-size:23px}  /* rosyjski tytul tygodnia i cennika w jednym wierszu, jak pl i en */
}
/* patrz app/docs/landing.md: ZLOTY PRZYCISK NAD BANEREM ZGODY NA 369 x 698 */
@media (max-width:440px) and (max-height:810px){.hero .first{margin-top:calc(100svh - 722px)}}
@media (max-width:440px) and (max-height:760px){.hero .first{margin-top:52px}}
.zwiniete .sect-t,:not(.zwiniete) > .sec-head .sect-k,.mission:not(.zwiniete) .sect-k{display:none}
@media (max-width:440px){
  footer .tagline{display:none}  /* „Jeden Ty, wiele języków" stoi tuz nad stopka jako etykieta zwinietej sekcji jezykow */
}
@media (max-width:440px){
  #top .note{display:none}  /* „Bez konta" mowi juz obietnica nad tytulem, a o godzine pyta samo pole z „Nie znam godziny" */
  footer{padding-bottom:16px}  /* odstep pod paskiem zgody daje juz `body` (consent.js), drugi bylby pusty */
}


/* cele 44 px takze na biurku */
.logo,.nav .btn{min-height:44px}
.logo{display:inline-flex;align-items:center}
.nav ul{align-items:center}
.nav ul a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px}
.nav ul a::after{bottom:8px}
.theme,.lang{width:44px;height:44px}
.seg button{min-height:44px}
.faq summary{min-height:44px;align-items:center}
footer a,footer .wad-consent-open{display:flex;align-items:center;min-height:44px;margin:0}
.foot-langs a{display:inline-flex;min-width:44px;justify-content:center}
.nav .foot-langs a{align-items:center;min-height:44px}  /* jezyki w pasku strony cennika: 44 px, nie 24 */

/* znaki zwinietych wierszy — patrz app/docs/landing.md: TELEFON: TRZY EKRANY */
.sect-btn::before{content:"";flex:none;width:22px;height:22px;background:var(--accent);-webkit-mask:var(--znak) center/contain no-repeat;mask:var(--znak) center/contain no-repeat}
.sect-btn > span{flex:1 1 auto}
#foundations{--znak:url("img/marks/layers.svg")}
#languages{--znak:url("img/marks/globe.svg")}
#privacy{--znak:url("img/marks/people.svg")}
#questions{--znak:url("img/marks/question.svg")}
#mission{--znak:url("img/marks/spark.svg")}
/* szkic Pola pod zwinietymi wierszami — patrz app/docs/landing.md: TELEFON: TRZY EKRANY */
@media (max-width:800px){
  #foundations.zwiniete{isolation:isolate}
  #foundations.zwiniete::after{content:"";position:absolute;z-index:-1;pointer-events:none;right:46px;top:6px;width:96px;height:168px;background:var(--ink3);-webkit-mask:url("img/marks/field.svg") no-repeat center/contain;mask:url("img/marks/field.svg") no-repeat center/contain;opacity:.3}
}
/* patrz app/docs/landing.md: TELEFON: TRZY EKRANY i BIURKO: TRZY EKRANY */
.mission .disclose{display:none}
.foot-disclose{display:block;grid-column:1/-1;margin:4px 0 0;font-size:12px;line-height:1.35;color:var(--ink3)}
footer .attrib-disclose{display:block;margin-bottom:8px}

/* patrz app/docs/landing.md: BIURKO: TRZY EKRANY */
@media (min-width:901px){
  section.block{padding-block:40px}
  .hero{min-height:0;padding-block:56px 40px}
  #top .note,#how .eyebrow,#plans .eyebrow,#plans .sec-head p{display:none}
  #plans .sec-head{grid-template-columns:1fr}
  .shot img{aspect-ratio:21/9;object-fit:cover;object-position:top}
  section.block.zwiniete,.mission.zwiniete{display:inline-block;box-sizing:border-box;width:calc((100% - 72px) / 3);margin-right:20px;vertical-align:top}
  section.zwiniete h2,.mission.zwiniete h2{font-size:24px;margin:0}
  section.zwiniete .sec-head{grid-template-columns:1fr}
  .shot img{-webkit-mask-image:linear-gradient(180deg,#000 72%,transparent);mask-image:linear-gradient(180deg,#000 72%,transparent)}
  footer .foot-product,footer .tagline,footer .soon,footer > div > b{display:none}
  .stage .tag,.scrollhint,.shot figcaption span:first-child,footer > div:first-child{display:none}
  .plans{align-items:start}
  /* bez planu z przewodnikiem: Odkrycie to pasek nad Pelnia, a Pelnia ma dwie kolumny, wiec warunki
     cennika (kotwice, fale, zdanie o fali) stoja obok siebie zamiast jeden pod drugim */
  .plans:has(> #plan-guide[hidden]) > .plan{grid-column:span 2}
  .plans:has(> #plan-guide[hidden]) > .plan:not(.hi){flex-direction:row;flex-wrap:wrap;align-items:center;column-gap:24px}
  .plans:has(> #plan-guide[hidden]) > .plan:not(.hi) > ul{flex-basis:100%}
  .plans:has(> #plan-guide[hidden]) > .plan:not(.hi) > .btn{margin:0 0 0 auto;min-width:220px}
  .plans:has(> #plan-guide[hidden]) > .plan.hi{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px 28px;align-content:start}
  .plans:has(> #plan-guide[hidden]) > .plan.hi > *{grid-column:1}
  .plans:has(> #plan-guide[hidden]) > .plan.hi > .founder{grid-column:2;grid-row:1 / span 5;align-self:start;margin-top:0}
  .plans:has(> #plan-guide[hidden]) > .plan.hi > .btn{grid-column:2;grid-row:6 / span 2;align-self:end}
  .plans:has(> #plan-guide[hidden]) > .plan.hi > .refund-line{grid-column:2;grid-row:8}
  /* kadr pary na biurku: lewa kolumna, miedzy lista a kwota — przyklad ma przyjsc PRZED cena, jak na
     telefonie. Lista w dwoch kolumnach zwolnila tam miejsce, ktorego brakowalo przy 1905 px */
  /* tytul cennika w jednym, dwoch wierszach zamiast trzech: miejsce na kadr w dwoch ekranach */
  .pricing-page .note-title{max-width:none}
  /* lista w dwoch kolumnach, a przycisk zaraz pod drabina fal, nie pod cala lewa kolumna — inaczej
     otwarta lista spycha zloto z pierwszego ekranu (en 2,06, ru 2,08 ekranu przy progu 2) */
  .pricing-page .plans:has(> #plan-guide[hidden]) > .plan.hi > ul{grid-template-columns:1fr 1fr;column-gap:20px}
  /* drabina fal obok nazwy, listy i kwoty (trzy wiersze), przycisk obok rozbicia roku, zdanie o zwrocie obok
     kotwicy, wszystko na pierwszym ekranie */
  .pricing-page .plans:has(> #plan-guide[hidden]) > .plan.hi > .founder{grid-row:1 / span 3}
  .pricing-page .plans:has(> #plan-guide[hidden]) > .plan.hi > .btn{grid-row:4;align-self:start}
  .pricing-page .plans:has(> #plan-guide[hidden]) > .plan.hi > .refund-line{grid-row:5;align-self:start}
  footer{padding:16px 0 24px;grid-template-columns:1fr 1fr;align-items:baseline;gap:8px 32px}
  footer .attrib-fold{justify-self:start}
  footer > div{display:flex;flex-wrap:wrap;column-gap:18px;align-items:baseline}
  footer a,footer .wad-consent-open{margin:0}
}

/* B3 NA TELEFONIE: zdanie (c) („inny plan po aktualnej cenie") schodzi z karty do pytania o cene zalozycielska
   tej samej strony; od 441 px stoi w B3 jak dotad i akapit w pytaniu jest schowany */
.faq .waves-tail{display:none}
/* strona glowna od 441 px: karta fal stoi w sekcji cen, wiec osobnego pytania tu nie ma (1440 bez zmian) */
body:not(.pricing-page) .faq details[data-waves-faq]{display:none}
@media (max-width:440px){
  body:not(.pricing-page) .faq details[data-waves-faq]{display:block}
  .founder .waves-end-c{display:none}
  .faq .waves-tail{display:block}
  /* STRONA GLOWNA: karta fal i zdanie o kraju stoja w pytaniu o cene (wavesToFaq), wiec tam B3 jest cale */
  .faq .waves-faq .founder .waves-end-c{display:inline}
  .faq .waves-faq .founder .waves-note{display:block}
  .faq .waves-faq .founder{margin-top:10px}
  .faq .waves-faq .region-note{display:block;margin-top:10px;font-size:12px}
  .pricing-faq .region-note{display:block;margin-top:10px;font-size:12px}
  /* CENNIK: tytul blizej gory — zloty przycisk i zdanie o zwrocie na pierwszym ekranie */
  .pricing-page .note-head{padding-top:20px}
  .pricing-page .note-title{margin-bottom:0}
  /* CENNIK: zloty przycisk tuz pod linia korzysci, drabina fal i B3 pod nim */
  /* CENNIK: co dostajesz, kadr i kwota NAD przyciskiem; zdanie o zwrocie tuz pod nim,
     drabina fal i B3 pod spodem */
  .pricing-page .plan.hi > ul{order:0}
  .pricing-page .plan.hi > #standard-cta{order:1;grid-column:1/-1}
  .pricing-page .plan.hi > .refund-line{order:1}
  .pricing-page .plan.hi > .founder{order:2}
  /* CENNIK: pytania wracaja do domyslnych 20 px oddechu — strona jest krotka, a miara CEO to slowa na ekran,
     wiec zwarty uklad liczyl sie tu przeciwko stronie, nie dla niej */
  .pricing-page .pricing-faq details{padding:20px 0}
  /* CENNIK: „Ceny dla: region" i „Zobacz ceny dla" w jednej linii — nazwa regionu stoi w zdaniu, wiec podpis przy liscie schodzi */
  .pricing-page .region-view span{display:none}
  .pricing-page .price-controls .region-note{flex:1 1 140px;min-width:0}
}