/* STYKI 0.7 – trzy kierunki wizualne na bazie wersji 0.6 (wariant B).
   Kierunek wybiera atrybut data-look na <html>: f (futurystyczny) | r (relacyjny) | p (superprofesjonalny).
   Bez atrybutu strona wygląda jak 0.6. Logotypy pozostają oryginalne (na ciemnym tle w negatywie). */

/* ── F · Sygnał: grafit, siatka osi znaku, świecący punkt styku ─────────── */
html[data-look="f"]{
  --bg:#0e1114; --surface:#151a1f; --surface-2:#1b2128; --fg:#eef1f4; --muted:#9aa3ad; --line:#ffffff14; --line-strong:#ffffff2e;
  --accent:#e1b45c; --accent-fg:#0e1114; --accent-soft:#1d1a12; --band-bg:#0a0c0f; --band-line:#ffffff1a;
  --logo-filter:invert(1); color-scheme:dark}
html[data-look="f"] body{background:
  linear-gradient(var(--bg),var(--bg)) padding-box,
  var(--bg)}
html[data-look="f"] main{background-image:
  linear-gradient(to right,#ffffff08 1px,transparent 1px),
  linear-gradient(to bottom,#ffffff08 1px,transparent 1px);
  background-size:72px 72px;background-position:center top}
html[data-look="f"] .topbar{background:color-mix(in srgb,#0a0c0f 80%,transparent);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
html[data-look="f"] .logo{mix-blend-mode:screen}
html[data-look="f"] .hero h1{font-weight:600;letter-spacing:-.045em}
html[data-look="f"] .hero h1 em,html[data-look="f"] h2 em{color:var(--accent);text-shadow:0 0 32px color-mix(in srgb,var(--accent) 45%,transparent)}
html[data-look="f"] .eyebrow{color:var(--accent)}
html[data-look="f"] .contact{background:radial-gradient(closest-side,color-mix(in srgb,var(--accent) 16%,transparent),transparent 72%)}
html[data-look="f"] .contact .cap{color:var(--muted)}
html[data-look="f"] .contact .cap b{color:var(--accent)}
html[data-look="f"] .btn{border-radius:4px}
html[data-look="f"] .btn-primary{background:var(--accent);color:var(--accent-fg);box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 60%,transparent),0 8px 32px -8px color-mix(in srgb,var(--accent) 60%,transparent)}
html[data-look="f"] .btn-ghost{border-color:var(--line-strong);color:var(--fg)}
html[data-look="f"] .audience{border-top-color:var(--line)}
html[data-look="f"] .section{border-top:1px solid var(--line)}
html[data-look="f"] .step,html[data-look="f"] .step + .step{background:color-mix(in srgb,var(--surface) 70%,transparent)!important;border:1px solid var(--line)!important;backdrop-filter:blur(6px)}
html[data-look="f"] .step .k span:first-child::before{content:"● ";color:var(--accent)}
html[data-look="f"] .step:nth-child(2) .k span:first-child::before{color:#7c9987}
html[data-look="f"] .step:nth-child(3) .k span:first-child::before{color:#a898cc}
html[data-look="f"] .step .k span:last-child{opacity:.5!important;color:var(--accent)}
html[data-look="f"] a.step:hover{outline:1px solid var(--accent)!important;box-shadow:0 0 40px -10px color-mix(in srgb,var(--accent) 50%,transparent)}
html[data-look="f"] .band{background:linear-gradient(135deg,#1a0b11,#0a0c0f 60%)}
html[data-look="f"] .band .btn-primary{background:var(--accent);color:var(--accent-fg)}
html[data-look="f"] .tools li{border-bottom-color:var(--band-line)}
html[data-look="f"] .tools .dot{box-shadow:0 0 12px currentColor}
html[data-look="f"] .spec-cta{background:var(--surface);color:var(--fg);border:1px solid color-mix(in srgb,var(--accent) 40%,transparent)}
html[data-look="f"] .spec-cta p,html[data-look="f"] .spec-cta .nums span{color:var(--muted)}
html[data-look="f"] .spec-cta .btn-primary{background:var(--accent);color:var(--accent-fg)}
html[data-look="f"] .principle{background:var(--surface)!important;border:1px solid var(--line)!important}
html[data-look="f"] .principle svg{background:#ffffff0d!important;stroke:var(--accent)!important}
html[data-look="f"] #projekty{background:#0a0c0f!important;box-shadow:0 0 0 100vmax #0a0c0f!important}
html[data-look="f"] #projekty .project{background:var(--surface)!important;border:1px solid var(--line)}
html[data-look="f"] .project .mark,html[data-look="f"] #projekty .project .mark.paper{background:#fff!important}
html[data-look="f"] .project .mark .logo,html[data-look="f"] .project .mark img{filter:none;mix-blend-mode:normal}
html[data-look="f"] .foot-help,html[data-look="f"] .footer{color:var(--muted)}

/* ── R · Spotkanie: dwa koła, które się stykają; miękkie kształty, ciepło bez beżu ─────── */
html[data-look="r"]{--bg:#ffffff;--surface:#ffffff;--surface-2:#f2f4f7;--accent:#84263e;--accent-soft:#f8ecef;--r:24px}
html[data-look="r"] h1,html[data-look="r"] h2,html[data-look="r"] h3{font-family:var(--f-display)!important;font-weight:500!important;letter-spacing:-.02em!important}
html[data-look="r"] h1 em,html[data-look="r"] h2 em{font-style:italic!important;color:var(--accent)}
html[data-look="r"] .hero h1{font-size:clamp(44px,5.4vw,80px)!important;line-height:1.02}
html[data-look="r"] .btn{border-radius:999px}
html[data-look="r"] .topbar{background:#ffffffe6!important;border-bottom:1px solid var(--line)!important}
html[data-look="r"] body::before{background:#fff!important}
html[data-look="r"] .topbar .logo{filter:none!important}
html[data-look="r"] .links a{color:var(--muted)!important}
html[data-look="r"] .links a:hover,html[data-look="r"] .links a[aria-current="page"]{color:var(--fg)!important;background:var(--surface-2)!important}
html[data-look="r"] .nav .btn-primary{background:var(--accent)}
html[data-look="r"] .hero::after{display:none}
html[data-look="r"] .contact::before{content:"";position:absolute;z-index:-1;inset:4% -6% 10%;
  background:radial-gradient(circle at 35% 50%,color-mix(in srgb,#7c9987 10%,transparent) 0 28%,transparent 28.3%),
             radial-gradient(circle at 63% 50%,color-mix(in srgb,#8575a3 9%,transparent) 0 28%,transparent 28.3%)}
html[data-look="r"] .contact{background:transparent!important;border:0!important;overflow:visible!important}
html[data-look="r"] .contact .cap{left:6%;right:6%}
html[data-look="r"] .audience{border-top:0;gap:10px}
html[data-look="r"] .audience span{padding:8px 14px;border-radius:999px;background:var(--surface-2)}
html[data-look="r"] .step,html[data-look="r"] .step + .step{border-radius:28px!important;padding:32px!important}
html[data-look="r"] .step .k span:last-child{display:none}
html[data-look="r"] .step .k span:first-child{font-family:var(--f-body);text-transform:none;letter-spacing:0;font-size:15px;font-weight:600}
html[data-look="r"] .step h3{font-size:32px!important}
html[data-look="r"] .band{background:#24292e!important;border-radius:40px;margin-inline:max(12px,calc((100vw - 1280px)/2))}
html[data-look="r"] .band h2 em{color:#f1c6d1!important}
html[data-look="r"] .band .eyebrow{color:#a7c4b0!important}
html[data-look="r"] .band .btn-primary{background:#fff!important;color:#24292e!important}
html[data-look="r"] .tools li{border-bottom-color:#ffffff1f}
html[data-look="r"] .spec-cta{border-radius:32px!important;background:var(--accent-soft)!important;color:var(--fg)!important}
html[data-look="r"] .spec-cta p,html[data-look="r"] .spec-cta .nums span{color:var(--muted)!important}
html[data-look="r"] .spec-cta .eyebrow,html[data-look="r"] .spec-cta .nums b{color:var(--accent)!important}
html[data-look="r"] .spec-cta .btn-primary{background:var(--accent)!important;color:#fff!important}
html[data-look="r"] .spec-cta .nums b{font-family:var(--f-display)!important;font-weight:500!important}
html[data-look="r"] .principle{border-radius:28px!important;border:0!important;background:var(--surface-2)!important}
html[data-look="r"] .principle svg{border-radius:50%!important}
html[data-look="r"] #projekty .project{border-radius:28px!important}
html[data-look="r"] .project .mark{border-radius:20px!important}

/* ── P · Instytut+: siatka szwajcarska, linie, liczby, zero ozdobników ─────── */
html[data-look="p"]{--r:0px;--surface-2:#f4f5f7;--line:#dfe2e6}
html[data-look="p"] h1,html[data-look="p"] h2,html[data-look="p"] h3{font-weight:600!important;letter-spacing:-.04em!important}
html[data-look="p"] .hero{padding-bottom:40px!important}
html[data-look="p"] .hero h1{font-size:clamp(44px,5.6vw,86px)!important;line-height:.96}
html[data-look="p"] .hero::after{display:none}
html[data-look="p"] .btn{border-radius:0!important}
html[data-look="p"] .eyebrow{color:var(--fg)}
html[data-look="p"] .eyebrow::before{width:8px;height:8px;background:var(--accent)}
html[data-look="p"] .contact{background:transparent!important;border:0!important}
html[data-look="p"] .audience{border-top:1px solid var(--fg)}
html[data-look="p"] .section{border-top:0!important}
html[data-look="p"] .section-head{border-top:1px solid var(--fg);padding-top:20px}
html[data-look="p"] .path{gap:0!important;border-top:1px solid var(--fg)!important;border-bottom:1px solid var(--fg)}
html[data-look="p"] .step,html[data-look="p"] .step + .step{background:transparent!important;border-radius:0!important;padding:24px 24px 28px!important}
html[data-look="p"] .step + .step{border-left:1px solid var(--line)!important}
html[data-look="p"] .step .k span:last-child{font:600 72px/0.8 var(--f-body)!important;opacity:1!important;color:var(--fg);letter-spacing:-.05em}
html[data-look="p"] .step:hover .k span:last-child{color:var(--accent)}
html[data-look="p"] a.step:hover{outline:0!important;background:var(--surface-2)!important}
html[data-look="p"] .band{background:var(--fg)!important}
html[data-look="p"] .band h2 em,html[data-look="p"] .band .eyebrow{color:#fff!important}
html[data-look="p"] .band .eyebrow::before{background:var(--gold)}
html[data-look="p"] .band .btn-primary{background:#fff!important;color:var(--fg)!important}
html[data-look="p"] .tools li{border-bottom-color:#ffffff26}
html[data-look="p"] .spec-cta{border-radius:0!important;background:var(--accent)!important;color:#fff!important}
html[data-look="p"] .spec-cta p,html[data-look="p"] .spec-cta .nums span{color:#f1dfe3!important}
html[data-look="p"] .spec-cta .eyebrow,html[data-look="p"] .spec-cta .nums b{color:#fff!important}
html[data-look="p"] .spec-cta .eyebrow::before{background:#fff}
html[data-look="p"] .spec-cta .btn-primary{background:#fff!important;color:var(--accent)!important}
html[data-look="p"] .spec-cta .nums b{font-size:64px!important}
html[data-look="p"] .principles{gap:0!important;border-top:1px solid var(--fg)}
html[data-look="p"] .principle{background:transparent!important;border:0!important;border-right:1px solid var(--line)!important;border-radius:0!important;padding:24px 24px 24px 0!important}
html[data-look="p"] .principle + .principle{padding-left:24px!important}
html[data-look="p"] .principle svg{display:none}
html[data-look="p"] .principle h3::before{content:attr(data-n);display:block;font:500 12px/1 var(--f-mono);color:var(--accent);margin-bottom:12px}
html[data-look="p"] #projekty{background:transparent!important;box-shadow:none!important}
html[data-look="p"] #projekty .project{border:1px solid var(--line)!important;border-radius:0!important}
html[data-look="p"] .project .mark{border-radius:0!important}

/* R · podstrony */
html[data-look="r"] .nav .btn-ghost{color:var(--fg)!important;border-color:var(--line-strong)!important}
html[data-look="r"] .tool,html[data-look="r"] .notice,html[data-look="r"] .art-item,html[data-look="r"] .card-side,
html[data-look="r"] .db-panel,html[data-look="r"] .filters,html[data-look="r"] .finder,html[data-look="r"] .draft-note,html[data-look="r"] .warn{border-radius:24px!important}
html[data-look="r"] .notice{border-left:0!important;background:var(--accent-soft)!important}
html[data-look="r"] .art-item{border:0!important;background:var(--surface-2)!important}
html[data-look="r"] .art-item:hover{background:color-mix(in srgb,var(--violet) 12%,var(--bg))!important}
html[data-look="r"] .chip,html[data-look="r"] .search,html[data-look="r"] .select select,html[data-look="r"] .lic{border-radius:999px!important}
html[data-look="r"] .card-cite,html[data-look="r"] .art-note{border-left:0!important;border-radius:20px;background:var(--accent-soft)!important}
html[data-look="r"] .card-facts{border:0!important;background:var(--surface-2);border-radius:24px;padding:4px 20px}
html[data-look="r"] .card-facts div+div{border-left-color:#ffffff!important}
html[data-look="r"] .eyebrow::before{width:10px;height:10px;border-radius:50%;background:var(--green)}
html[data-look="r"] .crumbs a{color:var(--accent)}
html[data-look="r"] .step:nth-child(4){background:#e8eef5!important}
html[data-look="r"] .db-panel{border-radius:24px!important}

/* ── Zdjęcia (wspólne) ─────────────────────────────────────────────
   Zasada: zdjęcie zawsze w kształcie z systemu (łuk, koło, zaokrąglony prostokąt),
   lekko wyciszone kolory i przenikające się koło w barwie marki – „punkt styku”. */
.ph{position:relative;margin:0;overflow:hidden;isolation:isolate;background:var(--surface-2)}
.ph img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.82) contrast(1.03)}
.ph::after{content:"";position:absolute;z-index:2;width:62%;aspect-ratio:1;right:-22%;bottom:-24%;border-radius:50%;mix-blend-mode:multiply;opacity:.55;pointer-events:none}
.ph-g::after{background:#7c9987}.ph-v::after{background:#8575a3}.ph-b::after{background:#84263e;opacity:.35}
.ph-arch{border-radius:999px 999px 28px 28px}
.ph-circle{border-radius:50%}
.ph-round{border-radius:50%;width:64px;height:64px;flex:none}
.ph-round::after{display:none}
.ph-card{border-radius:18px;aspect-ratio:16/10;margin:-4px -4px 4px}
/* zaślepka do czasu wstawienia zdjęć */
.ph-empty{background:linear-gradient(160deg,color-mix(in srgb,#7c9987 22%,#fff),color-mix(in srgb,#8575a3 20%,#fff))}
.ph-v.ph-empty{background:linear-gradient(160deg,color-mix(in srgb,#8575a3 24%,#fff),color-mix(in srgb,#dfe2e6 60%,#fff))}
.ph-b.ph-empty{background:linear-gradient(160deg,color-mix(in srgb,#84263e 14%,#fff),color-mix(in srgb,#7c9987 16%,#fff))}
.ph-empty figcaption{position:absolute;z-index:3;left:14px;right:14px;bottom:12px;font:500 11px/1.35 var(--f-mono);letter-spacing:.04em;color:#24292ecc}
.ph-empty figcaption::before{content:"ZDJĘCIE · ";color:var(--accent)}
.ph-round.ph-empty figcaption{display:none}
/* sekcja Ludzie na stronie głównej */
.people{border-top:0}
.people-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
.people-media{position:relative;padding:0 12% 12% 0}
.people-media .ph-main{aspect-ratio:4/5}
.people-media .ph-side{position:absolute;width:44%;aspect-ratio:1;right:0;bottom:0;border:8px solid var(--bg)}
.people-media .ph-side figcaption{left:18%;right:18%;bottom:22%;text-align:center}
.people-list{list-style:none;margin:32px 0 0;padding:0;display:grid;gap:16px}
.people-list li{display:flex;gap:16px;align-items:center}
.people-list b{display:block;font-size:17px}
.people-list span{color:var(--muted);font-size:15px}
@media (max-width:1000px){.people-grid{grid-template-columns:minmax(0,1fr);gap:40px}.people-media{max-width:520px}}
.people-media{max-width:500px}
.ph-empty{background:linear-gradient(160deg,color-mix(in srgb,#7c9987 38%,#fff),color-mix(in srgb,#8575a3 26%,#fff))}
.ph-v.ph-empty{background:linear-gradient(160deg,color-mix(in srgb,#8575a3 36%,#fff),color-mix(in srgb,#7c9987 18%,#fff))}
.ph-b.ph-empty{background:linear-gradient(160deg,color-mix(in srgb,#84263e 22%,#fff),color-mix(in srgb,#8575a3 20%,#fff))}
/* Ilustracje „Linia styku” (assets/il) w miejscach na zdjęcia */
.ph-il::after{display:none}
.ph-il img{filter:none}
/* Ilustracje-plamy (assets/il/p-*.svg): bez prostokąta, motyw w gładkiej plamie */
.ph-spot{background:transparent!important;overflow:visible}
.ph-spot img{object-fit:contain}
.head-spot{position:relative;margin:0;width:clamp(150px,22vw,250px);isolation:isolate}
.head-spot img{display:block;width:100%;height:auto;position:relative}
.head-spot canvas,.styk-line canvas{position:absolute;pointer-events:none}
.head-spot canvas{inset:-28%;width:156%;height:156%;z-index:-1}
.card-head:has(.head-spot){grid-template-columns:minmax(0,1fr) auto;max-width:1120px;column-gap:56px;overflow-x:clip}
.card-head:has(.head-spot)>*{grid-column:1}
.card-head>.head-spot{grid-column:2;grid-row:1/span 5;align-self:center}
@media (max-width:760px){.card-head:has(.head-spot){grid-template-columns:minmax(0,1fr)}.card-head>.head-spot{grid-column:1;grid-row:auto;order:-1;width:150px}}
.head-spot-404{margin:0 auto 8px;width:220px}
/* separator z animacji STYKI: dwie kreski spotykają się w punkcie */
.styk-line{position:relative;height:48px;margin:8px auto;max-width:560px}
.styk-line canvas{inset:0;width:100%;height:100%}
.styk-line+.section{border-top:0}
/* łuk na stronie głównej: ruch z animacji logo zamiast ilustracji */
.ph-anim{background:linear-gradient(170deg,color-mix(in srgb,#7c9987 14%,var(--bg)),color-mix(in srgb,#8575a3 12%,var(--bg)))}
.ph-anim::after{display:none}
.ph-anim canvas{position:absolute;inset:0;width:100%;height:100%}
.ph-anim .fg{position:absolute;left:12%;bottom:20%;width:76%;height:auto;z-index:1;object-fit:contain}
/* Okładki materiałów do pobrania (A4, skalują się z szerokością: jednostki cqw) */
.cv{container-type:inline-size;position:relative;aspect-ratio:210/297;width:100%;overflow:hidden;background:#fff;color:#24292e;box-shadow:0 1px 2px rgb(36 41 46/.08),0 10px 28px -10px rgb(36 41 46/.28);border-radius:2px;--c:var(--green);text-align:left}
.cv-in{position:absolute;inset:0;display:flex;flex-direction:column;padding:8cqw}
.cv-k{margin:0;font:500 3.4cqw/1.3 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--c)}
.cv-t{margin:3cqw 0 0;font:500 9.6cqw/1.04 var(--f-display);letter-spacing:-.01em;text-wrap:balance;color:#24292e}
.cv-w{margin:3cqw 0 0;font:400 3.8cqw/1.35 var(--f-body);color:#5b616b}
.cv-logo{width:26cqw;height:auto;margin-top:auto;opacity:.9}
/* A · ilustracja */
.cv-A .cv-art{height:52%;background:color-mix(in srgb,var(--c) 12%,#fff);display:flex;align-items:center;justify-content:center}
.cv-A .cv-art img{width:86%;height:86%;object-fit:contain}
.cv-A .cv-in{top:52%;padding-top:6cqw}
/* B · typografia i osie logo */
.cv-B{background:color-mix(in srgb,var(--c) 16%,#fff)}
.cv-B .cv-t{font-size:12.5cqw;margin-top:5cqw}
.cv-B .cv-ax{position:absolute;inset:0;width:100%;height:100%}
.cv-B .cv-ax line{stroke:var(--c);stroke-width:.35;opacity:.45}
.cv-B .cv-ax circle{fill:var(--burgundy)}
/* C · dwa koła i pasek */
.cv-C .cv-c{position:absolute;width:52cqw;aspect-ratio:1;border-radius:50%;top:-10cqw;mix-blend-mode:multiply}
.cv-C .cv-c1{right:20cqw;background:color-mix(in srgb,var(--c) 30%,#fff)}
.cv-C .cv-c2{right:-6cqw;background:color-mix(in srgb,var(--violet) 22%,#fff)}
.cv-C .cv-in{padding-top:52cqw;padding-bottom:20cqw}
.cv-C .cv-bar{position:absolute;left:0;right:0;bottom:0;height:13cqw;background:var(--c);display:flex;align-items:center;padding:0 8cqw;font:500 3.3cqw/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:#fff}
.cv-C .cv-logo{position:absolute;left:8cqw;bottom:18cqw}
/* okładka w kafelku listy */
.fd-thumb.fd-cv{align-items:flex-end;padding-top:10%}
.fd-thumb.fd-cv .cv{width:38%;margin-bottom:-14%;rotate:-2deg;transition:rotate .25s,translate .25s}
.fd:hover .fd-thumb.fd-cv .cv{rotate:0deg;translate:0 -4%}
/* Czytelność 0.9.8: nic poniżej 12px, opisy i tabele o 1–2px większe */
.nav-search kbd,.sd-foot kbd,.sd-close,.sd-gh,.sd-abbr{font-size:12px}
.fd-meta,.fd-tag,.fd-dur,.fd-count,.fd-new{font-size:12px}
.chip .n,.db-form .chip .n{font-size:12px}
.db-head,.db-abbr,.db-detail dt,.test-facts dt{font-size:12px}
.ph-empty figcaption{font-size:12px}
.db-form .chip,.sd-sugg .chip,.opts .chip{font-size:14px}
.db-topic,.db-meta,.count,.status,.course-state,.mp-note,.sd-opt small,.media-ag .mono,.sd-foot{font-size:14px}
.db-cell,.db-detail dd,.crumbs,.foot-help,.fd-foot,.fd-next small,.course-rel,.mat-item .mat-for,.art-refs li,.privacy,.footer,.test-more summary,.test-more p,.fd-search input,.legend,.chip{font-size:15px}
.art-refs li{font-size:15px!important}
.fd-desc,.sources p,.tools small,.people-list span,.card-cite,.warn,.draft-note,.card-dl-list,.db-name b,.sd-opt b{font-size:16px}
.principle p,.project p,.tool p,.category .side p,.notice{font-size:17px}
.card-facts dd,.course-meta dd,.fd-facts dd{font-size:16px}
/* Miniatury materiałów jako okładki: ilustracja + forma + tytuł (0.9.8) */
.fd-thumb.fd-cvl{container-type:inline-size;display:grid;grid-template-columns:44% 1fr;align-items:stretch;justify-content:stretch;padding:0;background:color-mix(in srgb,var(--c) 10%,var(--bg))}
.fd-thumb.fd-cvl::before,.fd-thumb.fd-cvl::after{display:none}
.cvl-art{position:relative;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 16%,var(--bg))}
.cvl-art img{width:96%;height:auto;max-height:100%}
.cvl-play{position:absolute;width:11cqw;aspect-ratio:1;border-radius:50%;background:color-mix(in srgb,var(--bg) 92%,transparent);box-shadow:0 2px 10px rgb(36 41 46/.18);right:4cqw;bottom:4cqw}
.cvl-play::after{content:"";position:absolute;left:40%;top:30%;border-left:3.6cqw solid var(--fg);border-top:2.3cqw solid transparent;border-bottom:2.3cqw solid transparent}
.cvl-txt{display:flex;flex-direction:column;gap:3cqw;padding:7cqw 6cqw 6cqw;min-width:0;text-align:left}
.cvl-form{font:600 3.6cqw/1.3 var(--f-body);color:color-mix(in srgb,var(--c) 70%,var(--fg));letter-spacing:.01em}
.cvl-title{font:500 6.2cqw/1.08 var(--f-display);letter-spacing:-.01em;color:var(--fg);text-wrap:balance;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.cvl-logo{width:17cqw;height:auto;margin-top:auto;opacity:.85}
.fd-compact .fd-thumb.fd-cvl{min-height:0;aspect-ratio:16/10}
html[data-theme="dark"] .cvl-logo{filter:invert(1)}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) .cvl-logo{filter:invert(1)}}
/* Próba: pionowe okładki w kafelkach */
.fd-thumb.fd-cvp{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;padding:5% 0;background:color-mix(in srgb,var(--c) 12%,var(--bg))}
.fd-thumb.fd-cvp::before,.fd-thumb.fd-cvp::after{display:none}
.fd-cvp .cv{height:100%;width:auto;--c:inherit}
.fd-cvp .cv-A .cv-art{position:relative;background:color-mix(in srgb,var(--c) 18%,#fff)}
.fd-cvp .cv-k{font:600 6cqw/1.25 var(--f-body);letter-spacing:0;text-transform:none;color:color-mix(in srgb,var(--c) 75%,#24292e)}
.fd-cvp .cv-t{font-size:10.5cqw;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.fd-cvp .cvl-play{width:16cqw;right:5cqw;bottom:5cqw}
.fd-cvp .cvl-play::after{border-left-width:5.4cqw;border-top-width:3.4cqw;border-bottom-width:3.4cqw}
.fd-cvp .cv-in{padding:6% 8% 7%}
.fd-cvp .cv-logo{width:30cqw}
.fd:hover .fd-cvp .cv{translate:0 -3px;transition:translate .2s}
.fd-compact .fd-thumb.fd-cvp{min-height:0;aspect-ratio:4/3}
/* Okładki poziome v2: jedno tło na całą szerokość, tekst z lewej, ilustracja z prawej */
.fd-thumb.fd-cvl{display:block;background:color-mix(in srgb,var(--c) 16%,var(--bg))}
.fd-cvl .cvl-art{position:absolute;right:-4%;top:50%;translate:0 -50%;width:52%;background:none;display:block}
.fd-cvl .cvl-art img{width:100%;height:auto;max-height:none;display:block}
.fd-cvl .cvl-txt{position:absolute;left:0;top:0;bottom:0;width:56%;z-index:1;padding:8% 0 8% 7%;justify-content:center;gap:3cqw}
.fd-cvl .cvl-form{font-size:4cqw}
.fd-cvl .cvl-title{font-size:6.8cqw;-webkit-line-clamp:4}
.fd-cvl .cvl-play{right:16%;bottom:16%}
/* Okładki poziome v3: bez tytułu (jest pod spodem), ilustracja na środku, forma w rogu, na całą szerokość kafelka */
.fd .fd-thumb.fd-cvl{margin:-12px -12px 0;border-radius:22px 22px 0 0;aspect-ratio:16/9}
.fd-cvl .cvl-art{left:50%;right:auto;translate:-50% -50%;width:54%}
.fd-cvl>.cvl-form{position:absolute;z-index:1;left:16px;top:14px;font:600 13px/1 var(--f-body);padding:7px 11px;border-radius:999px;background:var(--bg);color:var(--fg);letter-spacing:0}
.fd-cvl .cvl-play{right:6%;bottom:12%;width:12cqw}
.fd-compact .fd .fd-thumb.fd-cvl,.fd-compact .fd-thumb.fd-cvl{aspect-ratio:16/9}
/* Kafelki poziome (Rozwój): okładka jako lewa kolumna na całą wysokość */
.fd-compact .fd-thumb.fd-cvl,.fd.fd-compact .fd-thumb.fd-cvl{margin:-12px 0 -18px -12px;border-radius:22px 0 0 22px;aspect-ratio:auto;min-height:190px;height:auto;align-self:stretch}
.fd-compact{column-gap:20px}
.fd-compact .fd-cvl .cvl-art{width:78%}
.fd-compact .fd-cvl>.cvl-form{left:12px;top:12px;font-size:12px}
@media (max-width:1100px){
  .fd-compact{grid-template-columns:minmax(0,1fr)}.fd-compact .fd-thumb{grid-row:auto}.fd-compact .fd-foot{grid-column:auto}
  .fd-compact .fd-thumb.fd-cvl,.fd.fd-compact .fd-thumb.fd-cvl{margin:-12px -12px 0;border-radius:22px 22px 0 0;aspect-ratio:16/9;min-height:0}
  .fd-compact .fd-cvl .cvl-art{width:54%}
}
/* Wyróżniony materiał: okładka w dużym kafelku */
.fd-feature .fd-thumb.fd-cvl{margin:0;border-radius:20px;aspect-ratio:4/3}
.fd-feature .fd-cvl .cvl-art{width:50%}
@media (max-width:900px){.fd-feature .fd-thumb.fd-cvl{aspect-ratio:16/9}.fd-feature .fd-cvl .cvl-art{width:52%}}
/* Strony filmów i webinarów: ilustracja w odtwarzaczu */
.mp.fd-cvl{aspect-ratio:16/9;border-radius:20px}
.mp.fd-cvl .cvl-art{width:58%}
.mp.fd-cvl .mp-play{position:absolute;z-index:2;right:24px;bottom:24px}.mp.fd-cvl .mp-play svg{width:84px;height:84px}
.mp.fd-cvl .mp-play svg{filter:drop-shadow(0 4px 14px rgb(36 41 46/.25))}
.mp.fd-cvl>.cvl-form{left:20px;top:18px;font-size:14px}
@media (max-width:760px){.mp.fd-cvl .cvl-art{width:66%}.mp.fd-cvl .mp-play{right:12px;bottom:12px}.mp.fd-cvl .mp-play svg{width:56px;height:56px}.mp.fd-cvl>.cvl-form{left:12px;top:12px;font-size:12px}}

/* 0.9.9 pola do uzupełnienia w polityce */
mark.fill{background:#e4dfec;color:inherit;padding:1px 6px;border-radius:6px;font-weight:600}

/* 0.9.9 dostępność: kontrast AAA (7:1) dla tekstu pomocniczego w jasnym motywie */
@media not (prefers-color-scheme:dark){html[data-v="b"]:not([data-theme="dark"]){--muted:#454b52}}
html[data-theme="light"][data-v="b"]{--muted:#454b52}
.chip .n{opacity:1}
html[data-v="b"] #ucz .eyebrow{color:#3b5544}
.motion-toggle{font:inherit;font-size:14px;color:inherit;background:none;border:1px solid var(--line-strong);border-radius:999px;padding:6px 14px;min-height:32px;cursor:pointer}.motion-toggle:hover{border-color:var(--fg)}
/* 2.4.11/2.4.12: element z fokusem i cel kotwicy nie chowają się pod przyklejonym nagłówkiem */
html{scroll-padding-top:104px;scroll-padding-bottom:24px}
/* widoczny fokus pól wyszukiwania (kontrast co najmniej 3:1) */
.search:focus-within{border-color:var(--accent)!important;box-shadow:0 0 0 2px var(--accent)!important}
/* tekst tylko dla czytników nie poszerza strony na wąskich ekranach */
.sr-only,.sr{top:0;left:0;margin:-1px;padding:0;border:0;clip-path:inset(50%)}
/* etykieta „Przykład” dla materiałów, których jeszcze nie ma */
.fd-demo{display:inline-block;padding:3px 9px;border-radius:999px;border:1px dashed var(--line-strong);color:var(--fg);font-size:12px;letter-spacing:.08em;font-family:var(--f-mono);text-transform:uppercase;vertical-align:middle}
h2 .fd-demo{margin-left:8px;font-weight:500}

/* 0.9.9 Zacznij tutaj */
.zp-jump ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0 0 40px;padding:0}
.zp-jump a{display:inline-block;padding:10px 16px;border-radius:999px;border:1px solid var(--line-strong);text-decoration:none;color:var(--fg);font-size:15px}
.zp-jump a:hover{border-color:var(--fg)}
.zp{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:40px;align-items:start;padding:40px 0;border-top:1px solid var(--line)}
.zp .zp-art{position:relative;aspect-ratio:1;border-radius:22px;overflow:hidden}
.zp .zp-art .cvl-art{width:78%}
.zp h2{font-size:clamp(26px,2.4vw,32px);line-height:1.15;margin:0}
.zp-who{color:var(--muted);margin:8px 0 0;font-size:17px}
.zp-first{margin:16px 0 20px;padding:14px 18px;border-radius:16px;background:var(--surface-2);font-size:17px;max-width:60ch}
.zs-list{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:4px}
.zs{display:grid;grid-template-columns:36px minmax(0,1fr);gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.zs-n{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:#fff;font-weight:600}
.zs h3{font-size:19px;line-height:1.3;margin:4px 0 4px}.zs h3 a{text-decoration:none}.zs h3 a:hover{text-decoration:underline}
.zp-rwg{margin:24px 0 32px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px}
.zp-rwg-cta{display:flex;flex-wrap:wrap;gap:10px}
.zp-grid .fd-thumb.fd-cvl{aspect-ratio:16/10}
@media (max-width:820px){.zp{grid-template-columns:minmax(0,1fr);gap:20px}.zp .zp-art{aspect-ratio:16/9;max-width:none}.zp .zp-art .cvl-art{width:46%}}

/* 0.9.9 Kompas wartości */
.km-try{margin:40px 0;padding:28px;border-radius:24px;background:var(--surface-2)}
.km-try h2{margin-top:0}
.km-priv{font-size:15px!important;color:var(--muted)}
.km-area{background:var(--bg);border-radius:16px;margin:0 0 8px;border:1px solid var(--line)}
.km-area summary{cursor:pointer;display:flex;justify-content:space-between;gap:12px;align-items:center;padding:14px 18px;font-weight:600;font-size:17px;min-height:48px}
.km-area[open] summary{border-bottom:1px solid var(--line)}
.km-val{font:500 13px/1 var(--f-mono);color:var(--muted)}
.km-fields{display:grid;gap:8px;padding:16px 18px 20px}
.km-fields label{font-size:16px;font-weight:500;margin-top:8px}
.km-fields output{font-family:var(--f-mono);font-size:14px;color:var(--muted);margin-left:6px}
.km-fields textarea{font:inherit;font-size:16px;padding:10px 12px;border-radius:12px;border:1px solid var(--line-strong);background:var(--bg);color:var(--fg);resize:vertical;width:100%}
.km-fields textarea:focus-visible,.km-fields input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.km-fields input[type=range]{width:100%;accent-color:var(--accent);min-height:32px}
.km-sum{margin-top:20px;padding:20px;border-radius:16px;background:var(--bg);border:1px solid var(--line)}
.km-sum h3{margin:0 0 8px;font-size:19px}
.km-list{list-style:none;padding:0!important;margin:0 0 14px;display:grid;gap:12px}
.km-list p{margin:2px 0 0;font-size:16px!important}
.table-wrap{overflow-x:auto;margin:12px 0}
.km-ex{border-collapse:collapse;width:100%;font-size:15px;min-width:560px}
.km-ex th,.km-ex td{text-align:left;vertical-align:top;padding:10px 12px 10px 0;border-bottom:1px solid var(--line)}
.km-ex thead th{font-size:13px;color:var(--muted);font-weight:600;border-bottom:1px solid var(--fg)}
@media print{
  .topbar,.footer,.foot-help,.crumbs,.card-side,.card-facts,.head-spot,.km .eyebrow,.km .lead,.km-area,.km-priv,.km-print,.km .art-body>*:not(.km-try),.skip,.motion-toggle{display:none!important}
  .km-try{background:none;padding:0}.km-sum{border:0;padding:0}body{background:#fff}
}
.zp-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
@media (max-width:1000px){.zp-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media (max-width:560px){.zp-grid{grid-template-columns:minmax(0,1fr)!important}}
.art-body a.btn-primary{color:var(--accent-fg)}.art-body a.btn{text-decoration:none}

/* 0.9.9 metryczka treści i stany */
.meta-box{margin-bottom:28px;padding:18px 20px;border-radius:18px;background:var(--surface-2)}
.meta-box h2{margin-top:0!important}
.meta-dl{display:grid;gap:10px;margin:0}
.meta-dl div{display:grid;gap:2px}
.meta-dl dt{font:500 12px/1.3 var(--f-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.meta-dl dd{margin:0;font-size:15px;line-height:1.45}
.st{display:inline-block;padding:2px 10px;border-radius:999px;font-size:13px;font-weight:600;border:1px solid currentColor}
.st-dostepne{color:#1f5a34}.st-zapowiedz{color:#6a4a00}.st-demo{color:#4b3a78}.st-badanie{color:#1c4a73}

/* 0.9.9 Granie w rodzinie */
.sy{padding:36px 0;border-top:1px solid var(--line)}
.sy-head{display:flex;align-items:center;gap:20px;margin-bottom:20px}
.sy-art{width:96px;height:96px;flex:none;border-radius:20px;overflow:hidden;position:relative}
.sy-art .cvl-art{width:80%}
.sy h2{margin:0!important}
.sy-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.sy-grid .sy-col:nth-child(3){grid-column:1/-1}
.sy-col{padding:16px 18px;border-radius:16px;border:1px solid var(--line)}
.sy-col h3{font-size:17px;margin:0 0 8px}
.sy-col ul{margin:0;padding-left:18px}.sy-col li{font-size:16px;margin:0 0 8px}
.sy-step{margin:18px 0 12px;padding:16px 20px;border-radius:16px;background:var(--surface-2)}
.sy-step .eyebrow{margin:0 0 4px}.sy-step p:last-child{margin:0}
.sy-note{color:var(--muted);font-size:16px!important}
.sy-rwg{margin:36px 0;padding:24px;border-radius:22px;background:var(--surface-2)}
.sy-rwg h2{margin-top:0!important}
.zp-sits{margin:6px 0 0;padding-left:20px}.zp-sits li{margin:4px 0}
@media (max-width:820px){.sy-grid{grid-template-columns:minmax(0,1fr)}}
@media print{
  html.print-one .sy:not(.is-print),html.print-one .sy-rwg,html.print-one .art-refs,html.print-one .zp-jump,html.print-one .card-head,html.print-one .art-body>.privacy,
  .sy-act,.topbar,.footer,.foot-help,.crumbs,.card-side,.skip,.motion-toggle{display:none!important}
  .sy{border:0;padding:0}.sy-col{break-inside:avoid}body{background:#fff}
}

/* 0.9.9 Przesiew w praktyce */
.gd-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;margin:12px 0 16px}
.gd-it{display:grid;gap:4px;font-size:15px;font-weight:500}
.gd-it select{font:inherit;font-size:16px;padding:10px 12px;border-radius:12px;border:1px solid var(--line-strong);background:var(--bg);color:var(--fg);min-height:44px}
.gd-it select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.gd-out{padding:14px 18px;border-radius:14px;background:var(--bg);border:1px solid var(--line);margin-bottom:12px}
.gd-sum{margin:0!important;font-weight:500}

/* 0.9.9 Baza: widok do praktyki / do badań */
.db-view{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 20px}
.db-view .mono{font-size:13px;color:var(--muted);margin-right:4px}
.db-view-desc{margin:-8px 0 20px;color:var(--muted);font-size:15px}
.kind{display:inline-block;margin-right:8px;font:500 12px/1 var(--f-mono);padding:5px 9px;border-radius:999px;border:1px solid var(--line-strong)}
.zp-more{margin:20px 0 0;font-size:17px}

/* 0.9.9e Kto tworzy STYKI */
.author{border-top:0}
.au-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px;align-items:center}
.au-photo{margin:0;aspect-ratio:4/5;border-radius:999px 999px 28px 28px;background:var(--surface-2);overflow:hidden;position:relative;max-width:440px}
.au-photo::after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:var(--accent);right:14%;top:12%}
.au-photo img{position:absolute;inset:auto 0 0 0;width:100%;height:92%;object-fit:cover;object-position:50% 0}
.au-list{list-style:none;margin:24px 0 0;padding:0!important;display:grid;gap:12px}
.au-list li{display:grid;gap:2px;padding-left:16px;border-left:2px solid var(--accent)}
.au-list b{font-size:17px}.au-list span{color:var(--muted);font-size:15px}
.au-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.au-card{display:grid;grid-template-columns:180px minmax(0,1fr);gap:28px;align-items:start;margin-bottom:24px}
.au-card h2{margin-top:0!important}
.au-sm::after{width:12px;height:12px}
@media (max-width:820px){.au-grid{grid-template-columns:minmax(0,1fr);gap:28px}.au-photo{max-width:300px}.au-card{grid-template-columns:minmax(0,1fr)}.au-sm{max-width:180px}}
.au-card .au-list{margin-bottom:16px}
/* 0.9.9f Kto tworzy STYKI: panel z portretem w kole i czterema obszarami pracy */
.au-panel{padding:48px;border-radius:28px;background:var(--surface-2)}
.au-head{display:grid;grid-template-columns:132px minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:center}
.au-head h2{margin:4px 0 0}
.au-roles{margin:10px 0 0;color:var(--muted);font-size:16px;max-width:46ch}
.au-face{margin:0;width:132px;aspect-ratio:1;border-radius:50%;overflow:hidden;background:#e4e8ed;position:relative}
.au-face img{position:absolute;left:-6%;width:112%;height:auto;top:-2%}
.au-quote{margin:0;padding:0 0 0 24px;border-left:2px solid var(--accent);font-family:var(--f-display);font-size:21px;line-height:1.45;color:var(--fg)}
.au-quote p{margin:0}
.au-works{list-style:none;margin:36px 0 0;padding:0!important;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.au-w{background:var(--bg);border-radius:20px;padding:20px 22px;margin:0!important}
.au-w h3{font-size:19px;line-height:1.25;margin:4px 0 8px}
.au-w p{margin:0;font-size:15px!important;line-height:1.5;color:var(--muted)}
.au-w .au-role{font:500 12px/1.3 var(--f-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--accent)}
.au-works-2{grid-template-columns:repeat(2,minmax(0,1fr));margin:8px 0 20px}
.au-works-2 .au-w{background:var(--surface-2)}
.au-card{grid-template-columns:132px minmax(0,1fr)!important}
@media (max-width:1000px){.au-head{grid-template-columns:110px minmax(0,1fr)}.au-quote{grid-column:1/-1}.au-face{width:110px}.au-works{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.au-panel{padding:24px}.au-head{grid-template-columns:minmax(0,1fr)}.au-works,.au-works-2{grid-template-columns:minmax(0,1fr)}.au-card{grid-template-columns:minmax(0,1fr)!important}}
.au-face{background:#e4dfec}.au-face img{max-width:none;left:-24%;width:148%;top:-10%}

.tools b a{color:inherit;text-decoration-thickness:1px;text-underline-offset:5px}.tools b a:hover{text-decoration-thickness:2px}
.tool[id]{scroll-margin-top:96px}