/* WordPress additions on top of the original design (main.css): header actions and mobile menu,
   subpages, workshop and repertoire lists, single events. Same tokens, same rhythm. */

/* ---------- WordPress chrome ---------- */
.menu a[aria-current="page"]::after { transform: scaleX(1); }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.admin-bar .naglowek { top: 32px; }
@media (max-width: 782px) { .admin-bar .naglowek { top: 46px; } }
.pole-ukryte { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---------- footer ---------- */
.stopka-menu { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px 26px; margin-bottom: 14px; }
.stopka-menu a { color: var(--jasny); }
.stopka-menu a:hover { color: var(--roz); }

/* ---------- homepage additions ---------- */
.sekcja-link { margin-top: 32px; font-size: 16px; font-weight: 500; }
.wydarzenia b a { transition: color 0.3s; }
.wydarzenia b a:hover { color: var(--roz); }
main > section.warsztaty-sekcja { background: var(--papier-ciemny); }
.warsztaty-sekcja .karty-wydarzen { margin-top: clamp(36px, 4vw, 56px); }

/* ---------- subpages ---------- */
main.podstrona > section.strona-glowa { margin-top: 0; padding: calc(var(--hdr) + clamp(56px, 8vw, 110px)) 0 calc(var(--fala-h) + clamp(56px, 6vw, 90px)); -webkit-mask: none; mask: none; }
.strona-glowa .tytul-sekcji { max-width: 18ch; }
.strona-glowa .opis-sekcji { max-width: 56ch; }
main.podstrona > section.strona-tresc { min-height: 40vh; }
.podtytul { font-family: var(--serif); font-weight: 400; font-size: clamp(30px, 2.8vw, 42px); line-height: 1.1; margin-bottom: 26px; }
.podtytul:not(:first-child) { margin-top: clamp(56px, 6vw, 90px); }
.pusto { font-size: 17px; line-height: 1.6; color: var(--tusz-miekki); max-width: 56ch; }

/* text written in the block editor */
.tresc { max-width: 760px; font-size: clamp(16.5px, 1.2vw, 18px); line-height: 1.7; color: var(--tusz); }
.tresc > * + * { margin-top: 1.1em; }
.tresc h2, .tresc h3, .tresc h4 { font-family: var(--serif); font-weight: 400; line-height: 1.12; }
.tresc h2 { font-size: clamp(30px, 2.8vw, 42px); margin-top: 1.6em; }
.tresc h3 { font-size: clamp(24px, 2vw, 30px); margin-top: 1.4em; }
.tresc h4 { font-size: 21px; margin-top: 1.2em; }
.tresc > :first-child { margin-top: 0; }
.tresc ul, .tresc ol { padding-left: 1.3em; }
.tresc ul { list-style: none; padding-left: 0; }
.tresc ul li { position: relative; padding-left: 22px; }
.tresc ul li::before { content: ""; position: absolute; left: 0; top: 0.68em; width: 7px; height: 7px; background: var(--roz); }
.tresc ol { list-style: decimal; }
.tresc li + li { margin-top: 0.4em; }
.tresc a:not(.przycisk):not(.wp-block-button__link) { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.tresc a:not(.przycisk):not(.wp-block-button__link):hover { color: var(--roz-ciemny); }
.tresc blockquote { padding: 26px 28px; background: #fff; font-family: var(--serif); font-size: clamp(21px, 1.7vw, 25px); line-height: 1.45; }
.tresc blockquote cite { display: block; margin-top: 14px; font-family: var(--sans); font-size: 14px; font-style: normal; color: var(--tusz-miekki); }
.tresc figure img, .tresc .wp-block-image img { width: 100%; }
.tresc figcaption { margin-top: 10px; font-size: 14px; color: var(--tusz-miekki); }
.tresc hr { border: 0; border-top: 1px solid rgba(22, 22, 22, 0.14); margin: 2em 0; }
.tresc .wp-block-button__link { display: inline-flex; align-items: center; height: 52px; padding: 0 28px; border-radius: 0; background: var(--tusz); color: var(--jasny); font-weight: 600; font-size: 15.5px; text-decoration: none; }
.tresc .wp-block-button__link:hover { background: #000; }
.tresc .is-style-outline .wp-block-button__link { background: transparent; color: var(--tusz); border: 1px solid var(--tusz); }
.tresc .alignwide { max-width: none; width: min(1240px, 100vw - 2 * var(--krawedz)); }
.tresc .wp-block-embed iframe { width: 100%; }
.tresc table { width: 100%; border-collapse: collapse; font-size: 16px; }
.tresc th, .tresc td { text-align: left; padding: 12px 10px; border-bottom: 1px solid rgba(22, 22, 22, 0.14); }

/* ---------- workshop and performance cards ---------- */
.karty-wydarzen { display: grid; gap: 1px; background: rgba(22, 22, 22, 0.14); border: 1px solid rgba(22, 22, 22, 0.14); }
.karta-wydarzenia { display: grid; grid-template-columns: 92px minmax(0, 1fr) auto; gap: clamp(18px, 3vw, 40px); align-items: center; padding: 26px clamp(20px, 2.6vw, 34px); background: var(--papier); transition: background-color 0.3s; }
.warsztaty-sekcja .karta-wydarzenia { background: #fff; }
.karta-wydarzenia:hover { background: #fff; }
.kw-data { font-size: 13px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tusz-miekki); text-align: center; }
.kw-data span { display: block; font-family: var(--serif); font-size: 52px; line-height: 1; letter-spacing: 0; color: var(--tusz); }
.kw-tresc h3 { font-family: var(--serif); font-weight: 400; font-size: clamp(26px, 2.2vw, 34px); line-height: 1.1; }
.kw-tresc h3 a:hover { color: var(--roz-ciemny); }
.kw-szczegoly { margin-top: 8px; font-size: 15.5px; color: var(--tusz-miekki); }
.kw-opis { margin-top: 10px; font-size: 16px; line-height: 1.6; color: var(--tusz-miekki); max-width: 60ch; }
.kw-akcje { display: flex; align-items: center; gap: 22px; font-size: 15.5px; font-weight: 500; }
.karta-wydarzenia.minione, .karta-wydarzenia.minione:hover { background: var(--papier); }
.karta-wydarzenia.minione .kw-data, .karta-wydarzenia.minione .kw-tresc { opacity: 0.6; }
.znaczek-szary { display: inline-block; background: var(--papier-ciemny); color: var(--tusz-miekki); }

/* ---------- single workshop or performance ---------- */
.wydarzenie { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 360px); gap: clamp(36px, 6vw, 96px); align-items: start; }
.wydarzenie .tresc { max-width: none; }
.wydarzenie-zdjecie { margin-bottom: 1.6em; }
.wydarzenie-panel { position: sticky; top: calc(var(--hdr) + 26px); display: grid; gap: 20px; justify-items: start; padding: 30px 28px; background: #fff; }
.wydarzenie-panel dl { display: grid; gap: 16px; width: 100%; }
.wydarzenie-panel dl div { padding-bottom: 14px; border-bottom: 1px solid rgba(22, 22, 22, 0.1); }
.wydarzenie-panel dt { font-size: 12.5px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--tusz-miekki); }
.wydarzenie-panel dd { margin-top: 6px; font-family: var(--serif); font-size: 24px; line-height: 1.2; }
.panel-dopisek { font-size: 14px; line-height: 1.5; color: var(--tusz-miekki); }
.wydarzenie-panel .link { font-size: 15.5px; font-weight: 500; }

/* ---------- tablet and phone ---------- */
@media (max-width: 900px) {
  .wydarzenie { grid-template-columns: 1fr; }
  .wydarzenie-panel { position: static; order: -1; }
}
@media (max-width: 760px) {
  .karta-wydarzenia { grid-template-columns: 64px minmax(0, 1fr); align-items: start; }
  .kw-data span { font-size: 40px; }
  .kw-akcje { grid-column: 1 / -1; flex-wrap: wrap; }
}

/* Anchor jumps from the menu: section content lands under the fixed header, not behind it
   (the top --fala-h of each section is the wave mask, so it may sit under the header). */
main > section[id] { scroll-margin-top: calc(var(--hdr) - var(--fala-h)); }
.admin-bar main > section[id] { scroll-margin-top: calc(var(--hdr) + 32px - var(--fala-h)); }
