/* Strona główna w jasnej wersji (podgląd, 30.10.2026).
   Wszystkie kolory, cienie, odstępy i kroje pochodzą z tokens.css systemu
   wizualnego Co Działa. Zasady systemu: zero zaokrągleń, głębia z cieni
   zamiast ramek, limonka tylko jako tło (nigdy jako litera na jasnym),
   tekst pomocniczy w --c-ink-soft. */

*, *::before, *::after { box-sizing: border-box; border-radius: 0; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--c-white); color: var(--c-ink); font: 400 var(--t-body)/var(--t-body-lh) var(--f-body); }
img, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-underline-offset: 0.2em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
h1, h2, h3, h4 { font-family: var(--f-head); color: var(--c-ink); margin: 0; }
h1 { font-size: var(--t-h1); line-height: var(--t-h1-lh); font-weight: var(--w-head-strong); letter-spacing: -0.02em; text-wrap: balance; }
h2 { font-size: var(--t-h2); line-height: var(--t-h2-lh); font-weight: var(--w-head-strong); letter-spacing: -0.02em; }
h3 { font-size: 1.25rem; line-height: 1.3; font-weight: var(--w-head); }
p { margin: 0; }
p + p { margin-top: var(--s-3); }
small { font-size: var(--t-small); }

.skip { position: absolute; left: -9999px; }
.skip:focus { left: var(--s-4); top: var(--s-4); z-index: 100; background: var(--c-white); padding: var(--s-2) var(--s-3); }
.wizualnie-ukryte { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.kontener { width: 100%; max-width: var(--w-content); margin: 0 auto; padding: 0 var(--s-5); }
.kontener--waski { max-width: 820px; }

/* Przyciski jak w systemie: limonka z cieniem, drugorzędny na papierze */
.btn { display: inline-flex; align-items: center; justify-content: center; text-align: center; gap: var(--s-2); min-height: var(--h-control); padding: var(--s-3) var(--s-6); background: var(--c-lime); color: var(--c-ink); font: 700 var(--t-body)/1.2 var(--f-head); letter-spacing: -0.01em; text-decoration: none; border: 0; box-shadow: var(--sh-md); transition: transform var(--m-fast) var(--m-ease), box-shadow var(--m-fast) var(--m-ease), background-color var(--m-fast) var(--m-ease); }
.btn:hover { transform: translateY(-1px); box-shadow: var(--sh-lift); }
.btn:active { transform: translateY(1px); box-shadow: var(--sh-sm); }
.btn--ghost { background: var(--c-paper); }
.blok .btn--ghost { background: var(--c-paper); }
.btn--pelny { width: 100%; }
.btn:focus-visible, .link:focus-visible, .film:focus-visible { outline: 3px solid var(--c-ink); outline-offset: 3px; }
.przyciski { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3) var(--s-5); margin-top: var(--s-6); }
.link { display: inline-block; padding: 10px 0; font: 700 var(--t-body)/1.4 var(--f-head); color: var(--c-ink); text-decoration: underline; }

/* Pasek informacyjny */
.promo { background: var(--c-ink); color: var(--c-paper); font-size: var(--t-small); }
.promo__in { display: flex; align-items: center; justify-content: center; gap: var(--s-4); min-height: 44px; padding-block: var(--s-2); }
.promo__a { color: var(--c-lime); font-weight: 700; white-space: nowrap; padding: 10px 4px; }
.promo__x { background: none; border: 0; color: inherit; cursor: pointer; padding: 6px; }
@media (max-width: 640px) { .promo__in { justify-content: space-between; gap: 10px; } .promo__wiecej { display: none; } }

/* Hero */
.hero { padding: var(--s-9) 0; }
.hero__siatka { display: grid; gap: var(--s-7); align-items: center; }
@media (min-width: 960px) { .hero__siatka { grid-template-columns: 1.3fr .9fr; gap: var(--s-8); } }
.hero__lead { font-size: var(--t-lead); line-height: var(--t-lead-lh); margin-top: var(--s-5); max-width: 54ch; color: var(--c-ink-soft); }
@media (max-width: 959px) { .hero { padding: var(--s-7) 0 var(--s-8); } }

/* Pole z najbliższym spotkaniem: biała płaszczyzna z cieniem, bez ramek */
.wydarzenie { background: var(--c-white); box-shadow: var(--sh-lg); padding: var(--s-6); }
.wydarzenie__nad { font-size: var(--t-small); font-weight: 600; color: var(--c-ink-soft); margin-bottom: var(--s-1); }
.wydarzenie h2 { font-size: var(--t-h3); line-height: var(--t-h3-lh); }
.wydarzenie dl { margin: var(--s-5) 0 var(--s-5); }
.wydarzenie dl div { display: grid; grid-template-columns: 88px 1fr; gap: var(--s-3); padding: var(--s-3) 0; }
.wydarzenie dl div + div { border-top: var(--b-hair) solid var(--c-surface); }
.wydarzenie dt { color: var(--c-ink-soft); font-size: var(--t-small); }
.wydarzenie dd { margin: 0; font-weight: 600; }
.wydarzenie small { display: block; font-weight: 400; color: var(--c-ink-soft); }

/* Sekcje */
.sekcja { padding: var(--s-section) 0; }
.sekcja--jasna { background: var(--c-paper); }
.pod-naglowkiem { max-width: 640px; margin: var(--s-3) 0 var(--s-7); font-size: var(--t-lead); line-height: var(--t-lead-lh); color: var(--c-ink-soft); }

/* Program jako plakat z rozkładem jazdy: limonka jako tło, grafitowy druk */
.dwie-kolumny { display: grid; gap: var(--s-7); }
@media (min-width: 960px) { .dwie-kolumny { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: var(--s-8); } }
.dwie-kolumny--gora { align-items: start; }
.program-wstep h2 { margin-bottom: var(--s-4); }
.program-wstep p { font-size: var(--t-lead); line-height: var(--t-lead-lh); }
.program-wstep .link { margin-top: var(--s-4); }
.rozklad { background: var(--c-lime); color: var(--c-ink); box-shadow: var(--sh-md); padding: var(--s-6) var(--s-6) var(--s-5); }
.rozklad__glowka { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: var(--s-2) var(--s-5); padding-bottom: var(--s-4); border-bottom: 3px solid var(--c-ink); }
.rozklad__tytul { font: 800 clamp(2rem, 1.4rem + 2.4vw, 3rem)/1 var(--f-head); letter-spacing: -0.03em; }
.rozklad__gdzie { font-size: var(--t-small); line-height: var(--t-small-lh); text-align: right; margin: 0; }
.rozklad table { width: 100%; border-collapse: collapse; }
.rozklad th { text-align: left; font: 600 var(--t-label)/var(--t-label-lh) var(--f-body); letter-spacing: var(--t-label-ls); padding: var(--s-2) var(--s-3) var(--s-2) 0; border-bottom: var(--b-hair) solid var(--c-ink); }
.rozklad td { padding: var(--s-3) var(--s-3) var(--s-3) 0; border-bottom: var(--b-hair) solid var(--c-ink); vertical-align: baseline; font-size: 15px; }
.rozklad tr:last-child td { border-bottom: 0; }
.rozklad td:last-child { font-size: var(--t-small); }
.rozklad__godz { width: 1%; white-space: nowrap; font: 800 1.6rem/1 var(--f-head); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; padding-right: var(--s-5) !important; }
@media (max-width: 640px) {
  .rozklad { padding: var(--s-5) var(--s-4) var(--s-4); }
  .rozklad__gdzie { text-align: left; }
  .rozklad thead { display: none; }
  .rozklad tr { display: grid; grid-template-columns: 76px 1fr; border-bottom: var(--b-hair) solid var(--c-ink); padding: var(--s-3) 0; }
  .rozklad tr:last-child { border-bottom: 0; }
  .rozklad td { border: 0; padding: 0; }
  .rozklad td:last-child { grid-column: 2; }
  .rozklad td:last-child:empty { display: none; }
  .rozklad__godz { font-size: 1.3rem; }
}

/* Prowadzący: zdjęcie i tekst pod nim */
.karty { display: grid; gap: var(--s-5); }
@media (min-width: 760px) { .karty--2 { grid-template-columns: repeat(2, 1fr); } .karty--4 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .karty--4 { grid-template-columns: repeat(4, 1fr); } }
.osoba img { width: 100%; aspect-ratio: 4 / 4.4; object-fit: cover; object-position: top; margin-bottom: var(--s-4); box-shadow: var(--sh-sm); }
.osoba__firma { color: var(--c-ink-soft); font-size: var(--t-small); font-weight: 600; margin: 2px 0 var(--s-2); }
.osoba p:last-child { font-size: 15px; }
@media (max-width: 759px) { .karty--4 { grid-template-columns: 1fr 1fr; gap: var(--s-6) var(--s-4); } .osoba h3 { font-size: 1rem; } .osoba p:last-child { font-size: var(--t-small); } }

/* Webinary i warsztaty */
.dwa-bloki { display: grid; gap: var(--s-5); }
@media (min-width: 860px) { .dwa-bloki { grid-template-columns: 1fr 1fr; align-items: start; } }
.blok { background: var(--c-white); box-shadow: var(--sh-md); padding: var(--s-6); }
.blok h3 { font-size: var(--t-h3); line-height: var(--t-h3-lh); margin-bottom: var(--s-3); }
.blok .btn { margin-top: var(--s-5); }
.wideo { background: var(--c-ink); }
.wideo video { width: 100%; aspect-ratio: 16 / 9; }
.blok--z-filmem .wideo { margin: calc(-1 * var(--s-6)) calc(-1 * var(--s-6)) var(--s-5); }

/* Filmy z kanału */
.naglowek-sekcji--wiersz { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: var(--s-4) var(--s-6); margin-bottom: var(--s-7); }
.naglowek-sekcji--wiersz > div { max-width: 640px; }
.naglowek-sekcji--wiersz p { margin-top: var(--s-3); font-size: var(--t-lead); color: var(--c-ink-soft); }
.film { display: block; background: var(--c-white); box-shadow: var(--sh-md); text-decoration: none; transition: transform var(--m-fast) var(--m-ease), box-shadow var(--m-fast) var(--m-ease); }
.film:hover { transform: translateY(-2px); box-shadow: var(--sh-lift); }
.film img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.film__tytul { display: block; padding: var(--s-5) var(--s-5) var(--s-1); font: 700 18px/1.35 var(--f-head); }
.film__kto { display: block; padding: 0 var(--s-5) var(--s-5); font-size: var(--t-small); color: var(--c-ink-soft); }

/* Pytania: lista z liniami podziału, bez kart */
.faq { margin-top: var(--s-6); border-top: var(--b-hair) solid var(--c-border); }
.faq details { border-bottom: var(--b-hair) solid var(--c-border); }
.faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: var(--s-4); padding: var(--s-5) 0; font: 700 17px/1.4 var(--f-head); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; flex-shrink: 0; font: 400 26px/1 var(--f-body); }
.faq details[open] summary::after { content: "−"; }
.faq details p { padding: 0 var(--s-8) var(--s-5) 0; color: var(--c-ink-soft); }

/* Pas zamykający: tło limonkowe, przycisk wraca na grafit (jak .cta w systemie) */
.cta-pas { background: var(--c-lime); color: var(--c-ink); padding: var(--s-8) 0; }
.cta-pas__in { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-5); }
.cta-pas h2 { margin-bottom: var(--s-2); }
.cta-pas .btn { background: var(--c-ink); color: var(--c-lime); }

/* Stopka na graficie */
.stopka { background: var(--c-ink); color: var(--c-paper-dim); font-size: 15px; padding-top: var(--s-8); }
.stopka__siatka { display: grid; gap: var(--s-6); padding-bottom: var(--s-7); }
@media (min-width: 760px) { .stopka__siatka { grid-template-columns: 1.5fr 1fr 1fr 1.2fr; } }
.stopka h4 { color: var(--c-paper); font-size: var(--t-body); margin-bottom: var(--s-4); }
.stopka ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.stopka li a { display: inline-block; padding: var(--s-2) 0; }
.stopka a { text-decoration: none; }
.stopka a:hover { color: var(--c-lime); }
.stopka__logo { display: inline-flex; align-items: center; gap: 10px; color: var(--c-paper); font: 800 22px/1 var(--f-head); margin-bottom: var(--s-4); }
.stopka__logo svg { width: 32px; height: 32px; color: var(--c-lime); }
.stopka__dol a { display: inline-block; padding: var(--s-2) 0; }
.stopka__dol { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s-3); padding-block: var(--s-5); border-top: var(--b-hair) solid var(--c-ink-line); font-size: 13px; }

.stopka__linki { display: inline-flex; flex-wrap: wrap; gap: var(--s-5); }

/* Fakty o spotkaniu w sekcji programu (1.11.2026: spotkanie zeszło z pierwszego ekranu, na górze jest bezpłatna rozmowa) */
.program-wstep .spotkanie__fakty { font-size: var(--t-body); line-height: var(--t-body-lh, 1.6); margin-top: var(--s-5); padding-top: var(--s-4); border-top: var(--b-hair) solid var(--c-border); }
.program-wstep .przyciski { margin-top: var(--s-5); }
.program-wstep .przyciski .link { margin-top: 0; }
