/* ==========================================================================
   Baśniowy Dom — arkusz główny v3
   Hasło: ciepło, kolor, zabawa — nie urząd.
   Paleta: słońce · niebo · koral · trawa · lawenda
   Kontrast WCAG 2.1 AA sprawdzony dla każdej kombinacji tekstu.
   ========================================================================== */

:root {
  /* ── Tekst ─────────────────────────────────────────────────────────────── */
  --bd-ink:      #1a1535;   /* kontrast ~17:1 na białym */
  --bd-ink-soft: #4a4568;

  /* ── Tło ──────────────────────────────────────────────────────────────── */
  --bd-paper:    #fffbf0;
  --bd-paper-2:  #fff5f9;   /* różawe */
  --bd-paper-3:  #f0f8ff;   /* błękitne */

  /* ── Akcenty (kontrast tekstu na białym w nawiasie) ──────────────────── */
  --bd-coral:    #d62828;   /* 5.8:1 */
  --bd-coral-dk: #9e1c1c;
  --bd-sky:      #0077b6;   /* 5.5:1 */
  --bd-sky-dk:   #005885;
  --bd-sky-lt:   #caf0f8;
  --bd-grass:    #1b7a4c;   /* 5.3:1 */
  --bd-grass-lt: #d8f3dc;
  --bd-sun:      #ffd60a;
  --bd-sun-dk:   #c9a800;
  --bd-lavender: #8e3bd1;   /* 5.5:1 — zarezerwowany dla ręcznie wybranego koloru grupy w WP, nie używany domyślnie */
  --bd-lav-lt:   #ede7f6;
  --bd-orange:   #c84b11;   /* 4.7:1 */

  /* Jaśniejsze warianty niebieskiego/zielonego — scena "krajobrazu" w hero i akcenty dekoracyjne */
  --bd-sky-bright:   #2fb2e8;
  --bd-grass-bright: #2fae66;

  /* Tło górnego paska i stopki — celowo osobny token od --bd-ink (kolor tekstu),
     żeby dało się je rozjaśnić/przekolorować bez wpływu na czytelność tekstu
     w reszcie strony. Biały tekst na tym tle: 7.7:1, żółty (--bd-sun) 5.4:1. */
  --bd-bar:      #005885;

  --bd-line:      rgba(26, 21, 53, .12);
  --bd-shadow:    0 2px 0 var(--bd-line), 0 8px 24px -12px rgba(26,21,53,.20);
  --bd-shadow-lg: 0 4px 0 var(--bd-line), 0 20px 40px -16px rgba(26,21,53,.28);
  --bd-shadow-xl: 0 8px 0 rgba(0,0,0,.06), 0 32px 64px -20px rgba(26,21,53,.32);

  --bd-r:    16px;
  --bd-r-lg: 28px;
  --bd-r-xl: 48px;

  --bd-font-display: "Baloo 2", "Trebuchet MS", "Segoe UI", sans-serif;
  --bd-font-body:    "Lato", "Segoe UI", system-ui, -apple-system, sans-serif;

  --t--1: clamp(.86rem,  .83rem + .15vw, .95rem);
  --t-0:  clamp(1rem,    .96rem + .22vw, 1.13rem);
  --t-1:  clamp(1.2rem,  1.12rem + .4vw, 1.45rem);
  --t-2:  clamp(1.45rem, 1.3rem + .75vw, 1.95rem);
  --t-3:  clamp(1.9rem,  1.5rem + 1.8vw, 3.2rem);

  --bd-wrap: 1140px;
}

/* ── Reset ──────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
body, h1, h2, h3, h4, p, figure, blockquote, ul, ol, dl, dd { margin: 0; }
img, svg, video { max-width: 100%; height: auto; display: block; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

body {
  font-family: var(--bd-font-body);
  font-size: var(--t-0);
  line-height: 1.65;
  color: var(--bd-ink);
  background: var(--bd-paper);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 { font-family: var(--bd-font-display); font-weight: 800; line-height: 1.15; }
h1 { font-size: var(--t-3); }
h2 { font-size: var(--t-2); }
h3 { font-size: var(--t-1); }
p + p, p + ul, h2 + p, h3 + p { margin-top: .85em; }
a { color: var(--bd-sky); text-underline-offset: .18em; }
a:visited { color: var(--bd-sky); }
a:hover { color: var(--bd-sky-dk); }
:focus-visible { outline: 3px solid var(--bd-sky); outline-offset: 3px; border-radius: 4px; }

.bd-wrap   { width: min(100% - 2.5rem, var(--bd-wrap)); margin-inline: auto; }
.bd-narrow { width: min(100% - 2.5rem, 760px); margin-inline: auto; }

.screen-reader-text {
  position: absolute !important; width: 1px; height: 1px; overflow: hidden;
  clip: rect(1px,1px,1px,1px); clip-path: inset(50%); white-space: nowrap;
}
.bd-skip-link {
  position: absolute; left: .75rem; top: -100px; z-index: 999;
  background: var(--bd-sky-dk); color: #fff; padding: .75rem 1.25rem;
  border-radius: 0 0 var(--bd-r) var(--bd-r); font-weight: 700;
}
.bd-skip-link:focus { top: 0; color: #fff; }

/* ── Pasek dostępności ───────────────────────────────────────────────────── */
.bd-utilitybar { background: var(--bd-bar); color: #fff; font-size: var(--t--1); }
.bd-utilitybar .bd-wrap {
  display: flex; flex-wrap: wrap; gap: .35rem 1.25rem;
  align-items: center; justify-content: flex-end; padding-block: .45rem;
}
.bd-utilitybar a { color: #fff; }
.bd-utilitybar a:visited { color: #fff; }
.bd-utilitybar__contact { margin-right: auto; display: flex; gap: 1.25rem; flex-wrap: wrap; }
.bd-a11y { display: flex; gap: .3rem; align-items: center; }
.bd-a11y button {
  font: inherit; font-weight: 700; cursor: pointer;
  background: rgba(255,255,255,.14); color: #fff;
  border: 1px solid rgba(255,255,255,.35); border-radius: 8px;
  padding: .15rem .55rem; min-height: 30px; min-width: 32px;
}
.bd-a11y button:hover { background: rgba(255,255,255,.28); }
.bd-a11y button[aria-pressed="true"] { background: var(--bd-sun); color: var(--bd-ink); border-color: var(--bd-sun); }

/* ── Nagłówek ───────────────────────────────────────────────────────────── */
.bd-header {
  background: #fff;
  box-shadow: 0 2px 0 var(--bd-line), 0 4px 20px -8px rgba(26,21,53,.10);
  position: sticky; top: 0; z-index: 100;
}
.bd-header__inner {
  display: flex; align-items: center; gap: 1rem;
  padding-block: .75rem; flex-wrap: wrap;
}
.bd-brand {
  display: flex; align-items: center; gap: .85rem;
  text-decoration: none; color: inherit; margin-right: auto;
  flex-shrink: 1; min-width: 0;
}
.bd-brand > span:last-child { min-width: 0; }
.bd-brand:visited { color: inherit; }
.bd-brand__mark {
  flex: none; width: 120px; height: 120px; border-radius: 50%; overflow: hidden;
  /* Białe tło zamiast kolorowego — logo samo ma białe/kremowe tło owalu,
     więc naroża pliku wtapiają się w plakietkę zamiast prześwitywać innym
     kolorem. Dzięki temu obrazek może być w 100%, bez obcinania napisu. */
  background: #fff;
  display: flex; align-items: center; justify-content: center;
}
.bd-brand__mark svg { width: 100%; height: 100%; object-fit: cover; }
.bd-brand__mark img { width: 100%; height: 100%; object-fit: cover; }
.bd-brand__name { font-family: var(--bd-font-display); font-weight: 800; font-size: clamp(2rem, 1.9rem + .65vw, 2.5rem); line-height: 1.05; color: var(--bd-sky-dk); }
.bd-brand__meta { font-size: var(--t--1); color: var(--bd-ink-soft); }

.bd-nav-toggle {
  display: none; font: inherit; font-weight: 700; cursor: pointer;
  align-items: center; gap: .5rem; min-height: 46px; padding: 0 1rem;
  background: var(--bd-sky); color: #fff; border: 0; border-radius: 999px;
  font-family: var(--bd-font-display);
}

/* ── Menu ───────────────────────────────────────────────────────────────── */
.bd-nav {
  width: 100%;
  border-top: 2px solid var(--bd-line);
  /* Odstęp nad pillsami i pod nimi */
  padding-block: .4rem .5rem;
}
.bd-menu, .bd-menu ul { list-style: none; margin: 0; padding: 0; }
.bd-menu { display: flex; flex-wrap: wrap; gap: .1rem; }
.bd-menu > li > a {
  display: block; padding: .6rem .95rem;
  font-family: var(--bd-font-display); font-weight: 700; font-size: var(--t-0);
  text-decoration: none; color: var(--bd-ink);
  border-radius: 999px; transition: background .15s, color .15s;
}
.bd-menu > li > a:visited { color: var(--bd-ink); }
.bd-menu > li > a:hover { background: var(--bd-sky-lt); color: var(--bd-sky-dk); }
.bd-menu .current-menu-item > a,
.bd-menu .current-menu-ancestor > a,
.bd-menu .current_page_item > a { background: var(--bd-sky-lt); color: var(--bd-sky-dk); }

.bd-menu li { position: relative; }

/* Submenu — 2 kolumny żeby nie zajmowało pół ekranu w pionie */
.bd-menu .sub-menu {
  position: absolute; left: 0; top: calc(100% + 6px); z-index: 40;
  background: var(--bd-sky-dk); border-radius: var(--bd-r);
  padding: .5rem; box-shadow: var(--bd-shadow-xl); display: none;

  /* 2 kolumny dla długich list — nie wychodź poza ekran */
  columns: 2; column-gap: 0;
  min-width: max(240px, 42vw); max-width: 90vw;
}
/* Niewidoczny mostek nad podmenu — wypełnia przerwę między pillsem a listą
   żeby mysz nie "wychodziła" z li:hover przy zjeżdżaniu w dół */
.bd-menu .sub-menu::before {
  content: ''; position: absolute;
  top: -10px; left: 0; right: 0; height: 10px;
}

/* Krótkie podmenu (maks. 4 elementy) — 1 kolumna */
.bd-menu .sub-menu:has(> li:nth-child(-n+4):last-child) {
  columns: 1; min-width: 220px;
}
.bd-menu li:hover > .sub-menu, .bd-menu li:focus-within > .sub-menu,
.bd-menu li.is-open > .sub-menu { display: block; }

.bd-menu .sub-menu > li { break-inside: avoid; }
.bd-menu .sub-menu a {
  display: block; color: #fff; border-radius: 10px;
  padding: .5rem .85rem; font-weight: 600; white-space: nowrap;
}
.bd-menu .sub-menu a:hover { background: rgba(255,255,255,.16); color: #fff; }
.bd-menu .sub-menu .current-menu-item > a,
.bd-menu .sub-menu .current_page_item > a {
  background: var(--bd-sky-lt); color: var(--bd-sky-dk);
}
.bd-menu .sub-menu .current-menu-item > a:hover,
.bd-menu .sub-menu .current_page_item > a:hover { background: var(--bd-sky-lt); color: var(--bd-sky-dk); }

/* Zagnieżdżone submenu — zwykła lista */
.bd-menu .sub-menu .sub-menu {
  position: static; display: block; box-shadow: none;
  padding-left: .75rem; columns: 1; min-width: 0;
}
.bd-submenu-toggle {
  position: absolute; right: .25rem; top: .45rem;
  background: transparent; border: 1px solid var(--bd-line);
  border-radius: 8px; width: 34px; height: 34px;
  cursor: pointer; color: inherit; display: none;
}

/* ── Karty "info" na górze strony (bez hero nad nimi) ───────────────────── */
.bd-infobar {
  position: relative; z-index: 10;
  padding-block: 2.5rem;
}
.bd-infobar .bd-wrap {
  display: grid; gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}
.bd-infocard {
  background: #fff; border-radius: var(--bd-r-lg);
  padding: 1.25rem 1.5rem; box-shadow: var(--bd-shadow-xl);
  border-top: 5px solid var(--c, var(--bd-sky));
  display: flex; flex-direction: column; align-items: center; gap: .2rem;
  text-align: center;
}
.bd-infocard__icon  { font-size: 1.6rem; line-height: 1; margin-bottom: .3rem; }
.bd-infocard__label {
  font-family: var(--bd-font-display); font-weight: 800;
  font-size: var(--t--1); letter-spacing: .05em; text-transform: uppercase;
  color: var(--c, var(--bd-sky));
}
.bd-infocard__value { font-size: var(--t-0); color: var(--bd-ink); }
.bd-nowrap { white-space: nowrap; }
.bd-infocard a { color: inherit; font-weight: 700; }
.bd-infocard a:hover { color: var(--c, var(--bd-sky-dk)); }

/* ── Przyciski ──────────────────────────────────────────────────────────── */

/* Baza — przyciski w sekcjach treści */
.bd-btn, .bd-btn:visited {
  display: inline-flex; align-items: center; gap: .5rem;
  font-family: var(--bd-font-display); font-weight: 800; font-size: var(--t-0);
  text-decoration: none; padding: .8rem 1.75rem;
  border-radius: 999px; min-height: 52px;
  background: var(--bd-sky); color: #fff;
  border: 2.5px solid var(--bd-sky); box-shadow: 0 4px 0 var(--bd-sky-dk);
  transition: transform .1s, box-shadow .1s, background .15s;
}
.bd-btn:hover, .bd-btn:focus-visible, .bd-btn:visited:hover {
  background: var(--bd-sky-dk); border-color: var(--bd-sky-dk); color: #fff;
  transform: translateY(-2px); box-shadow: 0 6px 0 var(--bd-sky-dk);
}
.bd-btn:active { transform: translateY(1px); box-shadow: 0 2px 0 var(--bd-sky-dk); }
/* Ten sam jasnoniebieski, którego menu używa dla aktywnej pozycji (--bd-sky-lt
   tło + --bd-sky-dk tekst) — spójne z paskiem menu, dobry kontrast. */
.bd-btn--sky, .bd-btn--sky:visited { background: var(--bd-sky-lt); border-color: var(--bd-sky-lt); box-shadow: 0 4px 0 rgba(0,119,182,.25); color: var(--bd-ink); }
.bd-btn--sky:hover, .bd-btn--sky:visited:hover { background: var(--bd-sky); border-color: var(--bd-sky); color: #fff; box-shadow: 0 6px 0 var(--bd-sky-dk); }
.bd-btn--ghost, .bd-btn--ghost:visited { background: transparent; color: var(--bd-ink); border-color: var(--bd-ink); box-shadow: 0 4px 0 rgba(0,0,0,.15); }
.bd-btn--ghost:hover, .bd-btn--ghost:visited:hover { background: var(--bd-ink); color: #fff; box-shadow: 0 6px 0 rgba(0,0,0,.15); }

/* ── Sekcje ─────────────────────────────────────────────────────────────── */
.bd-section { padding-block: 4rem; position: relative; isolation: isolate; overflow: hidden; }
.bd-section--sky  { background: var(--bd-paper-3); }
.bd-section--soft { background: var(--bd-paper-2); }
.bd-section--sun  { background: #fffbe6; }
.bd-section--dark { background: var(--bd-ink); color: #fff; }
.bd-section--dark h2, .bd-section--dark h3 { color: var(--bd-sun); }
.bd-section--dark a { color: var(--bd-sun); }

/* Pastelowe plamy w tle — subtelna tekstura zamiast płaskiego koloru.
   `isolation:isolate` powyżej + z-index:-1 tutaj gwarantuje, że dekoracja
   zawsze zostaje POD zwykłą treścią sekcji, bez dotykania z-index treści. */
.bd-section::before {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(circle 260px at 94% -8%,  var(--bd-sun)   0%, transparent 100%),
    radial-gradient(circle 240px at -4% 106%, var(--bd-orange) 0%, transparent 100%),
    radial-gradient(circle 220px at 4% 20%,   var(--bd-sky)   0%, transparent 100%),
    radial-gradient(circle 200px at 100% 62%, var(--bd-grass) 0%, transparent 100%);
  opacity: .12;
}
.bd-section--dark::before { display: none; }
.bd-section--plain::before { display: none; }

.bd-section__head {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap; margin-bottom: 2.25rem;
}
/* Podkreślenie nagłówka sekcji */
.bd-section__head h2 { position: relative; display: inline-block; padding-bottom: .5rem; }
.bd-section__head h2::after {
  content: ''; position: absolute; left: 0; bottom: 0;
  width: 3.5rem; height: 5px; border-radius: 4px;
  background: var(--bd-sky);
}
.bd-section--sky  .bd-section__head h2::after { background: var(--bd-grass); }
.bd-section--soft .bd-section__head h2::after { background: var(--bd-orange); }
.bd-section--dark .bd-section__head h2::after { background: var(--bd-sun); }

/* ── Grupy: kolorowe kafelki ────────────────────────────────────────────── */
.bd-groups {
  display: grid; gap: 1.25rem;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.bd-group, .bd-group:visited {
  display: flex; flex-direction: column; align-items: center; gap: .5rem;
  text-decoration: none; color: var(--bd-ink); text-align: center;
  background: #fff; border: 2px solid var(--bd-line);
  border-radius: var(--bd-r-xl);
  padding: 2rem 1.75rem 2.25rem;
  box-shadow: var(--bd-shadow);
  position: relative; overflow: hidden; min-height: 280px;
  transition: transform .2s, box-shadow .2s;
}
.bd-group:hover {
  transform: translateY(-6px) rotate(-1.5deg);
  box-shadow: var(--bd-shadow-lg);
  color: var(--bd-ink);
}
.bd-group__icon { font-size: 4.5rem; line-height: 1; position: relative; z-index: 1; }
.bd-group__photo {
  width: 9rem; height: 9rem; object-fit: contain;
  display: block; margin: 0 0 .15rem; border-radius: 0;
  filter: drop-shadow(0 4px 6px rgba(0,0,0,.18));
}
.bd-group__photo--lg { width: 12rem; height: 12rem; } /* tylko kafelki na stronie głównej */
.bd-group h3 { font-size: var(--t-2); color: var(--bd-ink); position: relative; z-index: 1; line-height: 1.1; text-transform: uppercase; }
.bd-group span { font-size: var(--t--1); color: var(--bd-ink-soft); position: relative; z-index: 1; }

/* ── Sekcja wpisów grupy na stronie głównej ─────────────────────────────── */
.bd-group-feed { margin-bottom: 2.5rem; }
.bd-group-feed__head {
  display: flex; align-items: center; gap: .75rem;
  margin-bottom: 1.25rem;
  padding-left: .75rem;
  border-left: 6px solid var(--bd-group, var(--bd-sky));
}
.bd-group-feed__head span { font-size: 1.8rem; line-height: 1; }
.bd-group-feed__photo { width: 2.2rem; height: 2.2rem; object-fit: contain; display: block; }
.bd-group-feed__head h3 { margin: 0; font-size: var(--t-2); }
.bd-group-feed__head h3 a { color: var(--bd-ink); text-decoration: none; }
.bd-group-feed__head h3 a:hover { color: var(--bd-group, var(--bd-sky-dk)); }
.bd-group-feed__empty { color: var(--bd-muted); font-style: italic; }

/* ── Karty aktualności ──────────────────────────────────────────────────── */
.bd-cards {
  display: grid; gap: 1.5rem;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}
.bd-card {
  background: #fff; border: 2px solid var(--bd-line);
  border-radius: var(--bd-r-lg); overflow: hidden;
  box-shadow: var(--bd-shadow); display: flex; flex-direction: column;
  transition: transform .2s, box-shadow .2s;
}
.bd-card:hover { transform: translateY(-5px); box-shadow: var(--bd-shadow-lg); }
.bd-card__thumb {
  aspect-ratio: 16/10; overflow: hidden;
  background: linear-gradient(135deg, var(--bd-sky-lt), var(--bd-grass-lt));
}
.bd-card__thumb img { width: 100%; height: 100%; object-fit: cover; }
.bd-card__body { padding: 1.35rem; display: flex; flex-direction: column; gap: .5rem; flex: 1; }
.bd-card__date {
  display: inline-flex; align-items: center;
  font-size: var(--t--1); font-weight: 700; color: #fff;
  background: var(--bd-grass); border-radius: 999px;
  padding: .15rem .75rem; width: fit-content;
}
.bd-card h3 a { color: var(--bd-ink); text-decoration: none; }
.bd-card h3 a:hover { color: var(--bd-sky-dk); text-decoration: underline; }
.bd-card__more { margin-top: auto; font-weight: 700; color: var(--bd-sky); }

/* ── Kontakt ────────────────────────────────────────────────────────────── */
.bd-contact {
  display: grid; gap: 1.5rem;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.bd-contact__item {
  background: #fff; border: 2px solid var(--bd-line);
  border-radius: var(--bd-r-lg); padding: 1.5rem;
  box-shadow: var(--bd-shadow);
  border-top: 5px solid var(--bd-sky);
}
.bd-contact__item:nth-child(2) { border-top-color: var(--bd-grass); }
.bd-contact__item:nth-child(3) { border-top-color: var(--bd-orange); }
.bd-contact__item:nth-child(4) { border-top-color: var(--bd-sky-dk); }
.bd-contact__item h3,
.bd-contact__item h2 {
  font-family: var(--bd-font-display); font-weight: 800;
  font-size: var(--t-0); color: var(--bd-ink); margin-bottom: .5rem;
}
.bd-contact--page { margin-top: 2rem; }
.bd-contact--page .bd-contact__item { padding: 2rem; }

/* ── Treść strony/wpisu ─────────────────────────────────────────────────── */
.bd-page { padding-block: 2.5rem 4rem; position: relative; isolation: isolate; overflow: hidden; }

/* ── Łuk tęczy (template-parts/decor-rainbow.php) ───────────────────────── */
.bd-decor-rainbow { position: absolute; z-index: -1; pointer-events: none; }
.bd-decor-rainbow svg { display: block; width: 100%; height: 100%; }
.bd-decor-rainbow--wide { left: 0; top: 0; width: 55%; height: 100%; opacity: .5; }

/* Słoneczko po przeciwnej (prawej) stronie sekcji — równoważy tęczę z lewej */
.bd-decor-sun {
  position: absolute; z-index: -1; pointer-events: none; border-radius: 50%;
  background: #ffee00; filter: blur(14px); opacity: .9;
  top: 10px; right: 6%; width: 216px; height: 216px;
}

/* Klaster drzewek — jeden pod słoneczkiem (prawa strona), drugi przy tęczy
   (lewa strona). Wysokości i odstępy celowo nierówne — nie rosną miarowo
   od lewej do prawej, tylko stoją jak w prawdziwym, nieregularnym zagajniku. */
.bd-decor-tree {
  position: absolute; z-index: -1; pointer-events: none;
}
.bd-decor-tree svg { display: block; width: 100%; height: 100%; }
/* Pnie celowo kończą się NIŻEJ niż najniższy punkt trawy (patrz .bd-decor-ground
   poniżej — powierzchnia faluje między ok. 33px a 53px), żeby podstawa drzewa
   zawsze chowała się pod trawą, niezależnie od tego gdzie akurat wypada fala. */
.bd-decor-tree--a { right: 3%;  bottom: 18px; width: 120px; height: 169px; opacity: .85; }
.bd-decor-tree--b { right: 16%; bottom: 26px; width: 150px; height: 212px; opacity: .9;  }
.bd-decor-tree--c { right: 28%; bottom: 14px; width: 78px;  height: 110px; opacity: .7;  }
.bd-decor-tree--d { left: 3%;   bottom: 20px; width: 100px; height: 141px; opacity: .8;  }
.bd-decor-tree--e { left: 13%;  bottom: 12px; width: 135px; height: 190px; opacity: .9;  }
.bd-decor-tree--f { left: 25%;  bottom: 28px; width: 68px;  height: 96px;  opacity: .65; }

/* Trawa na dole sekcji — "grunt pod nogami" dla drzew/kwiatków */
.bd-decor-ground {
  position: absolute; z-index: -1; pointer-events: none;
  left: 0; right: 0; bottom: 0; height: 60px;
}
.bd-decor-ground svg { display: block; width: 100%; height: 100%; }

/* Kwiatki rozsiane na trawie */
.bd-decor-flower { position: absolute; z-index: -1; pointer-events: none; bottom: 6px; width: 46px; height: 69px; }
.bd-decor-flower svg { display: block; width: 100%; height: 100%; }
.bd-decor-flower--a { left: 3%;  bottom: 10px; }
.bd-decor-flower--b { left: 12%; bottom: 3px;  width: 38px; height: 57px; }
.bd-decor-flower--c { left: 21%; bottom: 12px; width: 52px; height: 78px; }
.bd-decor-flower--d { left: 30%; bottom: 5px; }
.bd-decor-flower--e { left: 39%; bottom: 9px;  width: 40px; height: 60px; }
.bd-decor-flower--f { left: 48%; bottom: 2px;  width: 50px; height: 75px; }
.bd-decor-flower--g { left: 57%; bottom: 11px; }
.bd-decor-flower--h { left: 66%; bottom: 4px;  width: 42px; height: 63px; }
.bd-decor-flower--i { left: 75%; bottom: 8px;  width: 48px; height: 72px; }
.bd-decor-flower--j { left: 84%; bottom: 3px; }
.bd-decor-flower--k { left: 93%; bottom: 10px; width: 36px; height: 54px; }

/* Chmurki na górze sekcji — biały kontur/cień dla kontrastu na jasnym tle */
.bd-decor-cloud {
  position: absolute; z-index: -1; pointer-events: none;
  filter: drop-shadow(0 3px 5px rgba(26,21,53,.18));
}
.bd-decor-cloud svg { display: block; width: 100%; height: 100%; }
/* Uwaga: prawy górny róg (mniej więcej od 70% w prawo) jest zajęty przez
   .bd-decor-sun — chmurki celowo trzymane po lewej stronie od tej granicy. */
.bd-decor-cloud--a { top: 4%;   left: 2%;  width: 120px; height: 68px; opacity: .95; }
.bd-decor-cloud--b { top: -6px; left: 16%; width: 150px; height: 84px; opacity: .85; }
.bd-decor-cloud--c { top: 9%;   left: 33%; width: 90px;  height: 51px; opacity: .95; }
.bd-decor-cloud--d { top: 14%;  left: 48%; width: 130px; height: 74px; opacity: .85; }
.bd-decor-cloud--e { top: -2%;  left: 60%; width: 100px; height: 57px; opacity: .9;  }
.bd-decor-cloud--f { top: 18%;  left: 24%; width: 80px;  height: 45px; opacity: .8;  }
/* Kwiatek w rogu strony treści (.bd-page) — tylko desktop, patrz media query niżej */
.bd-decor-flower-corner {
  position: absolute; z-index: -1; pointer-events: none;
  top: 24px; right: 6%; width: 140px; height: 190px;
  object-fit: contain; opacity: .95;
}
/* Zdjęcie grupy (Krasnale/Żabki/Smerfy) przy wpisach — większe niż zwykły kwiatek */
.bd-decor-flower-corner--group { top: 4px; width: 280px; height: 280px; }

.bd-breadcrumbs { font-size: var(--t--1); color: var(--bd-ink-soft); margin-bottom: 1.25rem; }
.bd-breadcrumbs a { color: var(--bd-ink-soft); }
.bd-entry { max-width: 72ch; }
.bd-entry h2 { margin-top: 2.25rem; margin-bottom: .5rem; color: var(--bd-sky-dk); }
.bd-entry h3 { margin-top: 1.75rem; margin-bottom: .5rem; color: var(--bd-sky-dk); }
.bd-entry ul, .bd-entry ol { padding-left: 1.4rem; }
.bd-entry li + li { margin-top: .35rem; }
.bd-entry img { border-radius: var(--bd-r); margin-block: 1.5rem; }
.bd-entry img.aligncenter { margin-left: auto; margin-right: auto; }
.bd-entry img.alignleft { float: left; margin: .25rem 1.5rem 1rem 0; }
.bd-entry img.alignright { float: right; margin: .25rem 0 1rem 1.5rem; }
.bd-entry blockquote {
  border-left: 5px solid var(--bd-sun); padding: .75rem 0 .75rem 1.25rem;
  font-family: var(--bd-font-display); font-size: var(--t-1);
  background: #fffbe6; border-radius: 0 var(--bd-r) var(--bd-r) 0;
}
.bd-entry table { width: 100%; border-collapse: collapse; margin-block: 1.5rem; }
.bd-entry th, .bd-entry td { border: 2px solid var(--bd-line); padding: .65rem .85rem; text-align: left; }
.bd-entry th { background: var(--bd-sky-lt); font-weight: 700; }
.bd-entry tr:nth-child(even) td { background: var(--bd-paper-3); }

.bd-pagination { margin-top: 2.5rem; display: flex; gap: .5rem; flex-wrap: wrap; }
.bd-pagination .page-numbers {
  display: inline-flex; min-width: 46px; min-height: 46px;
  align-items: center; justify-content: center;
  border: 2px solid var(--bd-line); border-radius: var(--bd-r);
  text-decoration: none; padding: 0 .75rem; font-weight: 700;
}
.bd-pagination .current { background: var(--bd-sky-dk); color: #fff; border-color: var(--bd-sky-dk); }
.bd-pagination .page-numbers:hover:not(.current) { background: var(--bd-sky-lt); border-color: var(--bd-sky); }

/* ── Fala dekoracyjna (wielokrotnego użytku) ────────────────────────────── */
.bd-wave { display: block; width: 100%; line-height: 0; }
.bd-wave path { fill: currentColor; }

/* ── Stopka ─────────────────────────────────────────────────────────────── */
.bd-footer { background: var(--bd-bar); color: #fff; padding-block: 3rem 1.5rem; }
.bd-footer::before {
  content: ''; display: block; height: 6px;
  background: linear-gradient(90deg,
    #e63946 0%, #f4a261 20%, #f9c74f 40%,
    #43aa8b 60%, #0077b6 80%, #9b5de5 100%);
}
.bd-footer a { color: #fff; text-decoration: underline; text-underline-offset: .18em; }
.bd-footer a:visited { color: #fff; }
.bd-footer a:hover { text-decoration: none; }
.bd-footer__grid {
  display: grid; gap: 2rem;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  padding-top: 2rem;
}
.bd-footer h2 { font-size: var(--t-1); margin-bottom: .75rem; color: #fff; }
.bd-footer ul { list-style: none; margin: 0; padding: 0; }
.bd-footer li + li { margin-top: .4rem; }
.bd-footer__bottom {
  margin-top: 2.5rem; padding-top: 1.25rem;
  border-top: 1px solid rgba(255,255,255,.15);
  font-size: var(--t--1);
  display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
  color: rgba(255,255,255,.7);
}

/* ── Tryby dostępności ──────────────────────────────────────────────────── */
html.bd-font-1 { font-size: 112.5%; }
html.bd-font-2 { font-size: 125%; }
body.bd-underline a { text-decoration: underline !important; }

body.bd-contrast {
  --bd-ink: #fff; --bd-ink-soft: #f2f2f2;
  --bd-paper: #000; --bd-paper-2: #000; --bd-paper-3: #000;
  --bd-sun: #ffe600; --bd-coral: #ffe600; --bd-sky: #ffe600;
  --bd-grass: #ffe600; --bd-lavender: #ffe600;
  --bd-sky-lt: #000; --bd-lav-lt: #000; --bd-grass-lt: #000;
  --bd-line: #ffe600; --bd-shadow: none; --bd-shadow-lg: none; --bd-shadow-xl: none;
  background: #000; color: #fff;
}
body.bd-contrast .bd-header,
body.bd-contrast .bd-section, body.bd-contrast .bd-section--soft,
body.bd-contrast .bd-section--sky, body.bd-contrast .bd-section--sun,
body.bd-contrast .bd-card, body.bd-contrast .bd-group,
body.bd-contrast .bd-contact__item, body.bd-contrast .bd-infocard,
body.bd-contrast .bd-footer, body.bd-contrast .bd-utilitybar,
body.bd-contrast .bd-menu .sub-menu { background: #000 !important; color: #fff !important; }
body.bd-contrast a, body.bd-contrast .bd-menu a { color: #ffe600; }
body.bd-contrast .bd-btn {
  background: #000; color: #ffe600; border-color: #ffe600; box-shadow: none;
}
body.bd-contrast .bd-group { border: 2px solid #ffe600; }
body.bd-contrast .bd-decor-rainbow, body.bd-contrast .bd-decor-sun,
body.bd-contrast .bd-decor-tree, body.bd-contrast .bd-decor-cloud,
body.bd-contrast .bd-decor-ground, body.bd-contrast .bd-decor-flower,
body.bd-contrast .bd-decor-flower-corner { display: none; }
body.bd-contrast .bd-section::before { display: none; }

/* ── Mobile ─────────────────────────────────────────────────────────────── */
@media (max-width: 900px) {
  .bd-nav-toggle { display: inline-flex; }
  .bd-nav { display: none; padding: 0; }
  .bd-nav.is-open { display: block; padding-bottom: .5rem; }
  .bd-menu { flex-direction: column; gap: 0; }
  .bd-menu > li { border-bottom: 1px solid var(--bd-line); }
  .bd-menu > li > a { border-radius: 0; padding: .75rem 1rem; }
  .bd-menu .sub-menu {
    position: static; display: none; border-radius: var(--bd-r);
    margin: .25rem 0 .5rem; columns: 1; min-width: 0;
  }
  .bd-menu li.is-open > .sub-menu { display: block; }
  .bd-menu li:hover > .sub-menu, .bd-menu li:focus-within > .sub-menu { display: none; }
  .bd-menu li.is-open:hover > .sub-menu { display: block; }
  .bd-submenu-toggle { display: block; }
  .bd-utilitybar__contact { width: 100%; margin-right: 0; }
  .bd-brand__mark { width: 64px; height: 64px; }
  .bd-brand__name { font-size: 1.35rem; }

  /* Na wąskim ekranie zbyt wiele elementów dekoracyjnych naraz (słońce +
     6 drzew + 6 chmurek + trawa + 11 kwiatków) robi się ciasne i bałaganiarskie
     — zostaje tylko łuk tęczy, reszta znika. */
  .bd-decor-rainbow, .bd-decor-sun, .bd-decor-tree, .bd-decor-cloud,
  .bd-decor-ground, .bd-decor-flower, .bd-decor-flower-corner { display: none; }
}

@media print {
  .bd-utilitybar, .bd-nav, .bd-nav-toggle, .bd-footer,
  .bd-decor-rainbow, .bd-decor-sun, .bd-decor-tree, .bd-decor-cloud,
  .bd-decor-ground, .bd-decor-flower, .bd-decor-flower-corner, .bd-infobar { display: none !important; }
  body { background: #fff; color: #000; font-size: 11pt; }
}