/*
Theme Name: zazen
Theme URI: https://zazen.pl
Author: 3PG
Description: Motyw strony Sanghi Dogen Zenji (zazen.pl). Klasyczny motyw PHP, bez builderów.
Version: 0.1.0
Requires at least: 6.5
Requires PHP: 8.0
Text Domain: zazen
*/

/* System z obecnej strony: biel, zdjęcia, granat i czerwień logo, Montserrat + Rubik. Jeden promień (4 px), bez cieni. */
:root{
	--granat:#00445E;--czerwien:#CB3522;--czerwien-c:#A82A1B;--tekst:#231F20;--szary:#5F6368;--jasny:#F4F5F6;--linia:#E3E5E8;
	--naglowki:"Montserrat",system-ui,sans-serif;--tekstowy:"Rubik",system-ui,sans-serif;
	--bok:32px;--sek:88px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:#fff;color:var(--tekst);font:400 17px/1.65 var(--tekstowy);overflow-wrap:break-word}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--naglowki);color:var(--granat);letter-spacing:-.01em;margin:0}
p{margin:0 0 1em}
:focus-visible{outline:3px solid var(--granat);outline-offset:3px;border-radius:2px}

.wrap{max-width:1200px;margin:0 auto;padding:0 var(--bok)}
.pomin{position:absolute;left:-9999px;top:0;z-index:10;background:#fff;color:var(--granat);padding:12px 18px;font:600 15px var(--naglowki)}
.pomin:focus{left:8px;top:8px}

/* Nagłówek: logo na środku, pod nim pasek menu. Szary ślad pędzla to jedyny ornament strony (wraca w stopce).
   Logo przewija się ze stroną, a sam pasek menu przykleja się do góry okna, jak na dotychczasowej stronie.
   position:sticky zamiast fixed: pasek nie wyskakuje z układu, więc treść pod nim nie podskakuje. */
:root{--logo-h:116px;--pasek-h:48px}
html{scroll-padding-top:calc(var(--pasek-h) + 20px)}
.hd{height:var(--logo-h);background:#fff url(assets/img/pedzel.png) center top/1516px 150px no-repeat;padding:20px 0 0;text-align:center}
.hd .logo{display:inline-flex;flex-direction:column;align-items:center;gap:8px}
.hd .logo img{height:64px;width:auto}
.hd .logo span{font:600 14px/1 var(--naglowki);color:var(--granat)}
/* Tło paska to dalszy ciąg tego samego śladu pędzla (przesunięty o wysokość części z logo), więc po przyklejeniu zostaje widoczny. */
.pasek{position:sticky;top:var(--wp-admin--admin-bar--height,0px);z-index:99;background:#fff url(assets/img/pedzel.png) center calc(-1 * var(--logo-h))/1516px 150px no-repeat;border-bottom:1px solid var(--linia)}
.pasek-w{max-width:1200px;margin:0 auto;padding:0 var(--bok);min-height:var(--pasek-h);display:flex;align-items:center;justify-content:center}
.pasek-logo,.menu-kn{display:none}
.nav{display:flex;justify-content:center;flex-wrap:wrap;gap:0 28px;list-style:none;margin:0;padding:0}
.nav a{display:block;padding:16px 0;font:600 13px/1.25 var(--naglowki);text-transform:uppercase;letter-spacing:.04em;color:var(--tekst)}
.nav a:hover,.nav .current-menu-item>a,.nav .current-page-ancestor>a,.nav .current-menu-parent>a{color:var(--czerwien)}

/* Przyciski: jeden kształt. Czerwony dla głównej akcji, obrys dla drugiej. */
.kn{display:inline-block;font:600 15px/1.2 var(--naglowki);padding:14px 24px;border-radius:4px;background:var(--czerwien);color:#fff;border:2px solid var(--czerwien);cursor:pointer}
.kn:hover{background:var(--czerwien-c);border-color:var(--czerwien-c)}
.kn.obr{background:transparent;border-color:var(--granat);color:var(--granat)}
.kn.obr:hover{background:var(--granat);color:#fff}
.przyciski{display:flex;flex-wrap:wrap;gap:12px;margin:26px 0 0}

/* Otwarcie strony głównej */
.hero{position:relative;height:min(640px,78vh);min-height:460px;background:var(--granat);overflow:hidden}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 60%}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,30,42,0) 40%,rgba(0,30,42,.78))}
.hero .t{position:absolute;z-index:1;left:0;right:0;bottom:56px;color:#fff}
.hero h1{color:#fff;font:700 46px/1.12 var(--naglowki);margin:0 0 14px;max-width:16em}
.hero p{margin:0 0 26px;max-width:38em;font-size:18px;color:rgba(255,255,255,.92)}

/* Sekcje */
.sek{padding:var(--sek) 0}
.sek.bez-gory{padding-top:0}
.sek.tlo{background:var(--jasny)}
.sek.tlo+.sek.bez-gory{padding-top:var(--sek)}
.sek h2{font:700 32px/1.2 var(--naglowki);margin:0 0 12px}
.sek .pod{color:var(--szary);margin:0 0 40px;max-width:40em}
.dalej{margin:28px 0 0;display:flex;flex-wrap:wrap;gap:8px 28px}
.dalej a,.tresc a,.fakty a,.wstep a:not(.kn),.konto a,.pod1 a,.okr a,.komunikat a,.ft a:hover{color:var(--czerwien)}
.dalej a{font:600 15px var(--naglowki);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.dalej a:hover,.tresc a:hover,.fakty a:hover,.wstep a:not(.kn):hover,.konto a:hover{color:var(--czerwien-c)}
.f{overflow:hidden;border-radius:4px;background:var(--jasny)}
.f img{width:100%;height:100%;object-fit:cover}
.pusto{color:var(--szary)}

/* Gdzie medytujemy: ośrodki ze zdjęciem jako karty, bez zdjęcia jako wiersze pod kreską */
.miasta{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 28px}
.miasto .f{aspect-ratio:3/2}
.miasto h3{font:700 22px/1.2 var(--naglowki);margin:16px 0 4px}
.miasto .k,.reszta .k{color:var(--czerwien);font-weight:500}
.miasto .a{color:var(--szary);font-size:15px}
.miasto:hover h3,.reszta a:hover h3,.karta:hover h3,.os:hover h2,.inne a:hover b{color:var(--czerwien)}
.reszta{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:44px;padding-top:32px;border-top:1px solid var(--linia)}
.reszta h3{font:700 19px/1.2 var(--naglowki);margin:0 0 4px}
.reszta div{font-size:15px;color:var(--szary)}

/* Pierwszy raz, Turza, Mistrz Kaisen */
.pr{display:grid;grid-template-columns:1fr 1.15fr;gap:56px;align-items:center}
.pr .f{aspect-ratio:4/3}
.pr p,.split p{color:var(--szary);max-width:34em}
.pr p b{color:var(--tekst);font-weight:500}
.split{display:grid;grid-template-columns:1.2fr 1fr;gap:56px;align-items:center}
.split .f{aspect-ratio:4/3}
.split p{margin:0 0 26px}
.dwie{display:grid;grid-template-columns:1fr 1fr;gap:56px}
.dwie .f{aspect-ratio:16/10;margin-bottom:26px}
.dwie p{color:var(--szary)}
.lista{list-style:none;margin:0;padding:0}
.lista li{border-bottom:1px solid var(--linia)}
.lista li:first-child{border-top:1px solid var(--linia)}
.lista a{display:block;padding:15px 0;font:600 18px/1.35 var(--naglowki);color:var(--granat)}
.lista a:hover{color:var(--czerwien)}

/* Wydarzenia */
.evr{display:grid;grid-template-columns:96px 1fr auto;gap:28px;align-items:center;padding:22px 0;border-bottom:1px solid var(--linia)}
.evl .evr:first-child{border-top:1px solid var(--linia)}
.sek.tlo .evr,.sek.tlo .evl .evr:first-child{border-color:#D9DCE0}
.evr .dn{display:block;font:700 38px/1 var(--naglowki);color:var(--czerwien)}
.evr .dm{display:block;font:600 14px/1.4 var(--naglowki);color:var(--czerwien);margin-top:4px}
.evr h3{font:700 20px/1.3 var(--naglowki);margin:0 0 4px}
.evr h3 a:hover{color:var(--czerwien)}
.evr p{margin:0;color:var(--szary);font-size:15px}
.evr .stan{font:600 13px/1 var(--naglowki);color:#fff;background:var(--czerwien);padding:8px 10px;border-radius:4px}
.evr .kn{padding:10px 18px;font-size:14px}
.evr.po .dn,.evr.po .dm{color:var(--szary)}
.mies{margin-bottom:56px}
.mies h2{font-size:24px;margin-bottom:16px}
.strony{display:flex;justify-content:space-between;gap:20px;margin-top:40px;font:600 15px var(--naglowki)}
.strony a{color:var(--granat);border:2px solid var(--granat);border-radius:4px;padding:10px 18px}
.strony a:hover{background:var(--granat);color:#fff}

/* Karty wpisów */
.karty,.trzy{display:grid;grid-template-columns:repeat(3,1fr);gap:44px 28px}
.karta .f{aspect-ratio:3/2}
.karta time{display:block;color:var(--szary);font-size:14px;margin:14px 0 2px}
.karta h3{font:600 18px/1.35 var(--naglowki);margin:14px 0 0}
.karta time+h3{margin-top:0}
.karta p{color:var(--szary);font-size:15px;margin:6px 0 0}
.karta.album h3{margin-top:14px}
.karta.album time{display:inline;margin:0;font-size:inherit}
.tresc+.dalej{margin-top:36px}
.karta .f.wideo{position:relative;aspect-ratio:16/9}
.karta .f.wideo::after,.nagranie .graj::before{content:"";position:absolute;left:50%;top:50%;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;background:rgba(0,30,42,.72) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M9 6.5v11l9-5.5z'/%3E%3C/svg%3E") center/26px no-repeat}

/* Stopka: newsletter na jasnym pasie, pod nim dane sanghi i ten sam ślad pędzla co w nagłówku */
.news{background:var(--jasny);padding:56px 0}
.news .wrap{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:start}
.news h2{font:700 28px/1.2 var(--naglowki);margin:0 0 6px}
.news p{margin:0;color:var(--szary)}
.ft{padding:56px 0 100px;background:#fff url(assets/img/pedzel.png) center bottom/1516px 150px no-repeat;font-size:15px}
.ft .r{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}
.ft img{height:52px;width:auto;margin-bottom:14px}
.ft p{color:var(--szary);max-width:30em}
.ft ul{list-style:none;margin:0;padding:0}
.ft li{margin-bottom:8px;color:var(--szary)}
.ft li a{color:var(--tekst)}
.ft .prawa{margin:28px 0 0;font-size:14px}

/* Podstrony: tytuł, duże zdjęcie, pas faktów */
.okr{font:600 14px var(--naglowki);margin:0;padding:28px 0 0}
.okr a::before{content:"‹ ";}
.okr+.tyt{padding-top:10px}
.tyt{padding:36px 0 34px}
.tyt h1{font:700 46px/1.1 var(--naglowki);max-width:20em}
.tyt .pod1{font-size:19px;color:var(--szary);margin:10px 0 0;max-width:40em}
.naglowek+.sek{padding-top:12px}
.tresc .evr a{color:inherit;text-decoration:none}
.tresc .evr h3{margin:0 0 4px}
.tresc .evr h3 a:hover{color:var(--czerwien)}
.duze{max-width:1200px;margin:0 auto;padding:0 var(--bok)}
.duze img{width:100%;height:480px;object-fit:cover;border-radius:4px;background:var(--jasny)}
.fakty{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));border-bottom:1px solid var(--linia)}
.fakty>div{padding:24px 28px 24px 0}
.fakty>div+div{padding-left:28px;border-left:1px solid var(--linia)}
.fakty h2{font:600 13px/1.3 var(--naglowki);color:var(--szary);letter-spacing:0;margin:0 0 6px}
.fakty p{margin:0;font:600 18px/1.4 var(--naglowki);color:var(--granat)}
.fakty p.m{font:400 15px/1.5 var(--tekstowy);color:var(--szary);margin-top:4px}
.fakty p a+a{margin-left:16px}
.komunikat{margin:24px 0 0;padding:16px 20px;background:#FCEFEC;border-radius:4px;color:var(--tekst)}
.komunikat p:last-child{margin:0}

/* Ośrodek */
.dwiek{display:grid;grid-template-columns:1.1fr 1fr;gap:64px;align-items:start}
.wstep p{margin:0 0 14px;max-width:36em}
.wstep .kn{margin-top:10px}
.plan{list-style:none;margin:0;padding:0}
.plan li{display:grid;grid-template-columns:128px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--linia)}
.plan li:first-child{border-top:1px solid var(--linia)}
.plan b{font:700 16px/1.6 var(--naglowki);color:var(--granat);white-space:nowrap}
.prow{display:grid;grid-template-columns:220px 1fr;gap:40px;align-items:start;background:var(--jasny);padding:40px;border-radius:4px}
.prow.bez-foto{grid-template-columns:1fr}
.prow .f{aspect-ratio:3/4;background:#e6e8ea}
.prow h2{font-size:24px;margin:0 0 4px}
.prow .rola{color:var(--czerwien);font-weight:500;margin:0 0 16px}
.prow p{margin:0 0 12px;color:var(--szary);max-width:44em}
.skl{list-style:none;margin:0 0 18px;padding:0}
.skl li{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--linia)}
.skl li:first-child{border-top:1px solid var(--linia)}
.skl b{font:600 17px var(--naglowki);color:var(--granat);white-space:nowrap}
.konto{font-size:15px;color:var(--szary)}
.konto p{margin:0 0 8px}
.inne{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}
.inne a{padding:14px 0;border-bottom:1px solid var(--linia)}
.inne b{display:block;font:700 17px var(--naglowki);color:var(--granat)}
.inne span{font-size:14.5px;color:var(--szary)}

/* Lista ośrodków */
.osl{border-top:1px solid var(--linia)}
.os{display:grid;grid-template-columns:200px 1fr 1.4fr;gap:32px;align-items:center;padding:24px 0;border-bottom:1px solid var(--linia)}
.os .f{aspect-ratio:3/2}
.os h2{font-size:26px;margin:0}
.os .j{margin:4px 0 0;color:var(--szary);font-size:15px}
.os dl{display:grid;grid-template-columns:84px 1fr;gap:4px 16px;margin:0;font-size:15.5px}
.os dt{color:var(--szary)}
.os dd{margin:0}

/* Wydarzenie: formularz zgłoszenia obok opisu */
.form{background:var(--jasny);padding:36px 36px 28px;border-radius:4px}
.form h2{font-size:26px;margin:0 0 6px}
.form .sesja{font:600 16px/1.4 var(--naglowki);color:var(--granat);margin:0 0 4px}
.form .termin{color:var(--szary);font-size:15px;margin:0 0 22px}
.form .zamkniete{margin:10px 0 12px}
.form a{color:var(--czerwien);text-decoration:underline;text-underline-offset:3px}
.obok h2{font-size:24px;margin:56px 0 16px}
.obok .evr{grid-template-columns:72px 1fr;gap:8px 20px}
.obok .evr .dn{font-size:30px}
.obok .evr .stan,.obok .evr .kn{grid-column:2;justify-self:start}

/* Treść z edytora */
.tresc{max-width:720px}
.tresc.szeroka{max-width:none}
.tresc.szeroka>p,.tresc.szeroka>h2,.tresc.szeroka>h3,.tresc.szeroka>ul{max-width:720px}
.tresc>*:first-child{margin-top:0}
.tresc h2{font:700 26px/1.25 var(--naglowki);margin:1.8em 0 .6em}
.tresc h3,.tresc h4{font:700 20px/1.3 var(--naglowki);color:var(--granat);margin:1.6em 0 .5em}
.tresc h2 strong,.tresc h3 strong,.tresc h4 strong{font-weight:inherit}
.tresc a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;overflow-wrap:anywhere}
.tresc ul,.tresc ol{padding-left:1.3em;margin:0 0 1em}
.tresc li{margin-bottom:.35em}
.tresc img{border-radius:4px}
.tresc figure{margin:1.6em 0}
.tresc figcaption,.tresc .wp-caption-text{font-size:14px;color:var(--szary);margin-top:8px;text-align:left}
.tresc .wp-caption{max-width:100%}
.tresc blockquote{margin:1.6em 0;padding:0;font:500 21px/1.5 var(--naglowki);color:var(--granat)}
.tresc iframe{max-width:100%}
.tresc .wp-block-gallery{margin:1.6em 0}
.tresc .wp-block-embed{margin:1.6em 0}
.fakty a,.wstep a,.konto a,.komunikat a{overflow-wrap:anywhere}
.postepy h3{margin-top:1.4em}
.postepy ul{list-style:none;padding:0}
.postepy li{padding:10px 0;border-bottom:1px solid var(--linia);margin:0}

/* Galerie w treści: siatka WordPressa, małe pliki w siatce (atrybut sizes ustawia functions.php), powiększenie w oknie */
.tresc .wp-block-gallery.has-nested-images{gap:8px}
.tresc .wp-block-gallery img{border-radius:2px}
/* Ostatni, niepełny rząd siatki: zdjęcia zostają w swojej szerokości, zamiast rozciągać się na cały rząd. */
.tresc .wp-block-gallery.has-nested-images figure.wp-block-image{flex-grow:0}
/* Zakładki galerii: nazwy grup w rzędzie, wybrana podkreślona czerwienią. Bez JavaScriptu zostają zwykłe nagłówki i trzy galerie pod sobą. */
.zak-lista{display:flex;flex-wrap:wrap;gap:0 28px;margin:0 0 28px;border-bottom:1px solid var(--linia)}
.zak-lista [role=tab]{appearance:none;background:none;border:0;border-bottom:3px solid transparent;margin-bottom:-1px;padding:12px 0;min-height:44px;font:600 17px/1.3 var(--naglowki);color:var(--szary);cursor:pointer}
.zak-lista [role=tab]:hover{color:var(--granat)}
.zak-lista [role=tab][aria-selected=true]{color:var(--granat);border-bottom-color:var(--czerwien)}
.zak-gotowe .zak-h{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.zak-gotowe [role=tabpanel]:focus-visible{outline-offset:6px}
.zak-gotowe [role=tabpanel] .wp-block-gallery{margin-top:0}
.zak-wszystkie [role=tabpanel]+[role=tabpanel]{margin-top:8px}
.zakladki>h2{margin-top:1.8em}
.lb-mini{cursor:zoom-in}
.lb-otwarte{overflow:hidden}
.lb{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:rgba(0,20,28,.94);color:#fff;touch-action:pan-y}
.lb::backdrop{background:rgba(0,20,28,.94)}
.lb[open]{display:grid;place-items:center}
.lb figure{margin:0;max-width:calc(100vw - 150px);pointer-events:none}
.lb figure img{display:block;max-width:100%;max-height:calc(100dvh - 96px);width:auto;height:auto;margin:0 auto;border-radius:2px}
.lb figcaption{margin-top:10px;text-align:center;font-size:15px;color:rgba(255,255,255,.85)}
.lb button{position:absolute;display:grid;place-items:center;width:48px;height:48px;padding:0;border:0;border-radius:4px;background:rgba(255,255,255,.12);color:#fff;font:400 30px/1 var(--naglowki);cursor:pointer}
.lb button:hover{background:rgba(255,255,255,.26)}
.lb button:focus-visible{outline:3px solid #fff;outline-offset:2px}
.lb-x{top:14px;right:14px}
.lb-p{left:14px;top:calc(50% - 24px)}
.lb-n{right:14px;top:calc(50% - 24px)}
.lb-l{position:absolute;left:0;right:0;bottom:12px;margin:0;text-align:center;font:600 14px var(--naglowki);color:rgba(255,255,255,.8)}
.lb-jedno .lb-p,.lb-jedno .lb-n{display:none}
@media (max-width:760px){
	.lb figure{max-width:100vw}
	.lb figure img{max-height:calc(100dvh - 150px);border-radius:0}
	.lb-p,.lb-n{top:auto;bottom:44px}
	.lb-l{bottom:58px}
	.tresc .wp-block-gallery.has-nested-images{gap:4px}
}

/* Nagranie */
.nagranie{position:relative;aspect-ratio:16/9;background:#001e2a;border-radius:4px;overflow:hidden;max-width:960px}
.nagranie img{width:100%;height:100%;object-fit:cover}
.nagranie iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.nagranie .graj{position:absolute;inset:0}
.nagranie .graj::before{width:76px;height:76px;margin:-38px 0 0 -38px;background-size:36px}
.nagranie .graj:hover::before{background-color:var(--czerwien)}
.nagranie .graj span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}

/* Formularze FormBuilder3PG osadzone w stronie. Wtyczka przyjmuje kolory przez zmienne --fb3g-* (functions.php),
   ale promień pól, etykiety i przyciski ma na sztywno, więc te kilka reguł dopasowuje je do motywu. */
.fb3g-app.fb3g-osadzony{font-family:var(--tekstowy);max-width:none;margin:0}
.fb3g-osadzony .fb3g-naglowek{display:none}
.fb3g-osadzony .fb3g-blok,.fb3g-osadzony .fb3g-blok+.fb3g-blok{border:0;padding:0;margin:0 0 18px}
.fb3g-osadzony h2.fb3g-pytanie{font:600 14px/1.4 var(--naglowki);color:var(--tekst);letter-spacing:0;margin:0 0 6px}
.fb3g-osadzony .fb3g-opis{font-size:14px;margin:0 0 8px}
.fb3g-osadzony .fb3g-input{min-height:48px;margin:0;border:1px solid #C3C8CD;border-radius:4px;font:16px/1.4 var(--tekstowy)}
.fb3g-osadzony .fb3g-opcje{gap:6px;margin:4px 0 0}
.fb3g-osadzony .fb3g-opcja{border-width:1px;border-color:#C3C8CD;border-radius:4px;padding:11px 14px;font:16px/1.4 var(--tekstowy);min-height:0}
.fb3g-osadzony .fb3g-opcja:active,.fb3g-osadzony .fb3g-btn:active{transform:none}
.fb3g-osadzony .fb3g-klawisz{display:none}
/* Bez skrótów klawiszowych opcja wyglądała jak pole tekstowe, więc dostaje zwykły znacznik wyboru: kwadrat (wiele) albo koło (jedna). */
.fb3g-osadzony .fb3g-opcja::before{content:"";flex:none;width:18px;height:18px;border:1.5px solid #8A9096;border-radius:3px;background:#fff}
.fb3g-osadzony .fb3g-typ-radio .fb3g-opcja::before{border-radius:50%}
.fb3g-osadzony .fb3g-opcja.fb3g-wybrana::before{border-color:var(--czerwien);background:var(--czerwien);box-shadow:inset 0 0 0 3px #fff}
.fb3g-osadzony .fb3g-zgoda{border:0;border-radius:0;padding:0;margin:0;align-items:center}
.fb3g-osadzony .fb3g-zgoda input{width:20px;height:20px;margin:0}
.fb3g-osadzony .fb3g-zgoda-tresc a{color:var(--czerwien);text-decoration:underline;text-underline-offset:3px}
.fb3g-osadzony .fb3g-akcje{justify-content:flex-start;margin-top:22px}
.fb3g-osadzony .fb3g-btn{font:600 15px/1.2 var(--naglowki);padding:15px 24px;border-radius:4px;min-height:0;box-shadow:none}
.fb3g-osadzony .fb3g-btn:hover{filter:none;background:var(--czerwien-c)}
.fb3g-osadzony .fb3g-blad{border-radius:4px}
/* Newsletter: imię i adres obok siebie, zgoda i przycisk pod nimi. Etykieta „Prywatność” zostaje dla czytników ekranu. */
.news .fb3g-strona{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.news .fb3g-typ-zgoda,.news .fb3g-akcje,.news .fb3g-strona>.fb3g-blad{grid-column:1/-1}
.news .fb3g-typ-zgoda h2.fb3g-pytanie{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.news .fb3g-akcje{margin-top:4px}
.brak-form{color:var(--szary)}

@media (max-width:900px){
	.os{grid-template-columns:150px 1fr;gap:16px 20px}
	.os dl{grid-column:1/-1}
	.nav{gap:0 20px}
}
@media (max-width:760px){
	:root{--bok:18px;--sek:56px}
	body{font-size:16px}
	/* Telefon: od początku jeden stały pasek z logo, nazwą i przyciskiem menu. Menu rozwija się pod paskiem. */
	:root{--pasek-h:52px}
	.hd{display:none}
	.pasek{background-size:900px 89px;background-position:right top;border-bottom:0;box-shadow:0 0 10px rgba(0,0,0,.28)}
	.pasek-w{justify-content:space-between;padding:0 6px 0 var(--bok)}
	.pasek-logo{display:flex;align-items:center;gap:10px;min-height:44px}
	.pasek-logo img{height:34px;width:auto}
	.pasek-logo span{font:600 15px/1 var(--naglowki);color:var(--granat)}
	.menu-kn{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:4px;background:rgba(0,0,0,.05);cursor:pointer}
	.menu-kn span,.menu-kn span::before,.menu-kn span::after{display:block;width:20px;height:2px;background:var(--tekst);border-radius:1px}
	.menu-kn span{position:relative}
	.menu-kn span::before,.menu-kn span::after{content:"";position:absolute;left:0}
	.menu-kn span::before{top:-6px}
	.menu-kn span::after{top:6px}
	.pasek.otwarte .menu-kn span{background:transparent}
	.pasek.otwarte .menu-kn span::before{top:0;transform:rotate(45deg)}
	.pasek.otwarte .menu-kn span::after{top:0;transform:rotate(-45deg)}
	.pasek nav{position:absolute;left:0;right:0;top:100%;background:#fff;box-shadow:0 8px 10px -6px rgba(0,0,0,.28);max-height:calc(100dvh - var(--pasek-h));overflow-y:auto}
	.js .pasek:not(.otwarte) nav{display:none}
	/* Bez JavaScriptu przycisk nic by nie robił, więc znika, a menu stoi otwarte pod paskiem w zwykłym układzie strony. */
	.bez-js .menu-kn{display:none}
	.bez-js .pasek{position:static}
	.bez-js .pasek nav{position:static;box-shadow:none}
	.bez-js .pasek-w{flex-wrap:wrap}
	.bez-js .pasek nav{flex-basis:100%}
	.nav{display:block;padding:6px 0 10px}
	.nav a{padding:14px var(--bok);font-size:14px;min-height:44px}
	.nav li+li{border-top:1px solid var(--linia)}
	.hero{height:520px;min-height:0}
	.hero .t{bottom:32px}
	.hero::after{background:linear-gradient(180deg,rgba(0,30,42,.1) 15%,rgba(0,30,42,.82) 70%)}
	.hero h1{font-size:30px}
	.hero p{font-size:16px}
	.sek h2{font-size:25px}
	.sek .pod{margin-bottom:28px}
	.miasta{grid-template-columns:1fr;gap:0}
	.miasto{display:grid;grid-template-columns:120px 1fr;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--linia)}
	.miasto:first-child{border-top:1px solid var(--linia)}
	.miasto .f{aspect-ratio:4/3}
	.miasto h3{font-size:19px;margin:0 0 2px}
	.miasto .k,.miasto .a{font-size:14.5px}
	.reszta{grid-template-columns:1fr;gap:0;margin-top:0;padding-top:0;border-top:0}
	.reszta a{padding:14px 0;border-bottom:1px solid var(--linia)}
	.pr,.split,.dwie,.dwiek,.news .wrap{grid-template-columns:1fr;gap:28px}
	.news .fb3g-strona{grid-template-columns:1fr}
	.dwie{gap:48px}
	.pr .f{aspect-ratio:3/2}
	.evr{grid-template-columns:64px 1fr;gap:6px 16px;padding:18px 0}
	.evr .dn{font-size:30px}
	.evr .dm{font-size:12.5px}
	.evr h3{font-size:17px}
	.evr .stan,.evr .kn{grid-column:2;justify-self:start;margin-top:6px}
	.karty,.trzy{grid-template-columns:1fr;gap:30px}
	.ft{background-size:900px 89px;padding-bottom:72px}
	.ft .r{grid-template-columns:1fr 1fr;gap:28px}
	.ft .r>div:first-child{grid-column:1/-1}
	.tyt{padding:26px 0 24px}
	.tyt h1{font-size:32px}
	.tyt .pod1{font-size:17px}
	.okr{padding-top:20px}
	.duze{padding:0}
	.duze img{height:240px;border-radius:0}
	.fakty{grid-template-columns:1fr}
	.fakty>div,.fakty>div+div{padding:16px 0;border-left:0}
	.fakty>div+div{border-top:1px solid var(--linia)}
	.plan li{grid-template-columns:112px 1fr}
	.prow{grid-template-columns:1fr;gap:24px;padding:24px 18px;margin:0 -18px;border-radius:0}
	.prow .f{max-width:180px}
	.form{padding:26px 18px 20px;margin:0 -18px;border-radius:0;order:2}
	/* Na telefonie formularz zgłoszenia stoi zaraz pod opisem, inne terminy po nim. */
	.obok{display:contents}
	.obok>.tresc{order:1}
	.obok>h2,.obok>.evl{order:3}
	.obok>h2{margin:20px 0 -12px}
	.os{grid-template-columns:104px 1fr}
	.os h2{font-size:21px}
	.os dl{grid-template-columns:72px 1fr}
	.mies{margin-bottom:40px}
}
