/*
Theme Name: Astra DCP Child
Theme URI: https://ados-2.pl
Description: Child theme Astry w stylu DCP (Polskie Centrum Diagnozy Autyzmu / ados-2.pl). Kolory, typografia i komponenty wg design systemu z Figmy (.docs/ZADANIE.md, sekcja 4a).
Author: John Weston Group
Template: astra
Version: 0.6.1
Text Domain: astra-dcp-child
*/

/*
  Konwencje (patrz .docs/guidelines/):
  - Komponenty DCP nazywane wg BEM: block / block__element / block--modifier.
  - Brak magicznych liczb — wartości powtarzalne trzymamy w tokenach (:root).
  - Unikamy selektorów po tagu i kaskadowych. Wyjątek: sekcje oznaczone
    „NADPISANIA …" celowo stylują markup, którego nie kontrolujemy (motyw
    nadrzędny Astra oraz auto-markup bloków Gutenberga). Każdy taki wyjątek
    jest opisany — to świadoma granica, nie niechlujstwo.
*/

/* ===== Tokeny (design tokens DCP) ===== */
:root {
  /* Kolory marki (zmienne z Figmy) */
  --dcp-primary: #8010A7;        /* fiolet marki */
  --dcp-accent: #D91E9D;         /* różowy akcent / border CTA */
  --dcp-gradient: linear-gradient(90deg, #D91E9D 0%, #8010A7 100%);
  --dcp-ink: #222222;            /* tekst podstawowy */
  --dcp-heading-ink: #1a1a1a;    /* nagłówki */
  --dcp-lead-ink: #4a4a4a;       /* lead / akapit wiodący */
  --dcp-light: #FFFFFF;          /* tła, tekst na ciemnym */
  --dcp-gray-3: #828282;         /* tekst pomocniczy */
  --dcp-gray-4: #BDBDBD;         /* obramowania */
  --dcp-gray-6: #F2F2F2;         /* tła sekcji / kart */
  --dcp-tint: #FAF5FC;           /* delikatny fioletowy odcień tła hero */

  /* Skala odstępów */
  --dcp-space-xs: 8px;
  --dcp-space-sm: 16px;
  --dcp-space-md: 24px;
  --dcp-space-lg: 40px;
  --dcp-space-xl: 56px;
  --dcp-space-2xl: 72px;

  /* Promienie */
  --dcp-radius-sm: 12px;
  --dcp-radius-card: 16px;
  --dcp-radius-pill: 30px;

  /* Cienie */
  --dcp-shadow-soft: 0 4px 16px rgba(128, 16, 167, .05);
  --dcp-shadow-card: 0 6px 24px rgba(128, 16, 167, .06);
  --dcp-shadow-pop: 0 12px 30px rgba(128, 16, 167, .12);
  --dcp-shadow-header: 0 2px 14px rgba(0, 0, 0, .06);

  /* Wymiary komponentów */
  --dcp-accent-line-width: 50px;
  --dcp-accent-line-height: 3px;
  --dcp-accent-line-gap: var(--dcp-space-sm);
  --dcp-btn-height: 45px;
  --dcp-brand-strip-height: 6px;
  --dcp-container: 1160px;

  /* Typografia */
  --dcp-font: "Jost", "Blogger Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
}

/* ===== NADPISANIA Astry: typografia bazowa =====
   Wyjątek od „nie styluj po tagu": ustawiamy font/kolory globalnie na markupie
   motywu nadrzędnego (body, h1–h6, p, a), którego nie generujemy sami. */
body {
  font-family: var(--dcp-font);
  color: var(--dcp-ink);
  font-weight: 300;
  letter-spacing: .1px;
}
h1, h2, h3, h4, h5, h6 {
  font-family: var(--dcp-font);
  font-weight: 400;
  color: var(--dcp-heading-ink);
  line-height: 1.2;
}
h1 { font-size: clamp(2rem, 1.4rem + 2vw, 2.8rem); }
h2 { font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2rem); }
h3 { font-size: clamp(1.2rem, 1rem + .8vw, 1.5rem); }
p  { font-size: 1.0625rem; line-height: 1.7; }
a       { color: var(--dcp-primary); }
a:hover { color: var(--dcp-accent); }

/* ===== dcp-heading — nagłówek z kreską-akcentem DCP ===== */
.dcp-heading {
  position: relative;
  padding-bottom: var(--dcp-accent-line-gap);
  margin-bottom: var(--dcp-space-md);
}
.dcp-heading::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: var(--dcp-accent-line-width);
  height: var(--dcp-accent-line-height);
  background: var(--dcp-gradient);
  border-radius: 2px;
}
.dcp-heading--center { text-align: center; }
.dcp-heading--center::after { left: 50%; transform: translateX(-50%); }

/* ===== dcp-button — warianty przycisków (block styles Gutenberga) =====
   Style rejestrowane w functions.php jako is-style-dcp-primary/secondary.
   Selektor .wp-block-button__link to nazwa narzucona przez Gutenberga. */
.wp-block-button.is-style-dcp-primary .wp-block-button__link,
.wp-block-button.is-style-dcp-secondary .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--dcp-space-xs);
  min-height: var(--dcp-btn-height);
  padding: 11px var(--dcp-space-lg);
  border-radius: var(--dcp-radius-pill);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1;
  text-decoration: none;
  transition: opacity .2s ease, background .2s ease, color .2s ease, transform .2s ease;
}
.wp-block-button.is-style-dcp-primary .wp-block-button__link {
  background: var(--dcp-gradient);
  color: var(--dcp-light) !important;
  border: none;
  box-shadow: var(--dcp-shadow-soft);
}
.wp-block-button.is-style-dcp-primary .wp-block-button__link:hover {
  opacity: .92;
  transform: translateY(-1px);
}
.wp-block-button.is-style-dcp-secondary .wp-block-button__link {
  background: var(--dcp-light);
  color: var(--dcp-heading-ink) !important;
  border: 1px solid var(--dcp-accent);
}
.wp-block-button.is-style-dcp-secondary .wp-block-button__link:hover {
  background: var(--dcp-accent);
  color: var(--dcp-light) !important;
}

/* ===== dcp-hero — sekcja otwierająca (tytuł + lead + CTA) ===== */
.dcp-hero {
  position: relative;
  overflow: hidden;
  background: linear-gradient(160deg, var(--dcp-tint) 0%, var(--dcp-light) 72%);
  border: 1px solid var(--dcp-gray-6);
  border-radius: var(--dcp-radius-card);
  padding: var(--dcp-space-2xl) var(--dcp-space-xl);
  margin-bottom: var(--dcp-space-xl);
}
.dcp-hero::before {            /* pasek gradientu marki na górze hero */
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: var(--dcp-brand-strip-height);
  background: var(--dcp-gradient);
}
.dcp-hero__lead {
  font-size: 1.2rem;
  line-height: 1.6;
  color: var(--dcp-lead-ink);
  max-width: 760px;
}
.dcp-hero__actions { margin-top: var(--dcp-space-md); }
/* Pierwszy nagłówek hero bez górnego marginesu — markup generuje Gutenberg. */
.dcp-hero > .dcp-heading:first-child { margin-top: 0; }
@media (max-width: 600px) {
  .dcp-hero { padding: var(--dcp-space-xl) var(--dcp-space-md); }
}

/* ===== dcp-section — blok treści merytorycznej ===== */
.dcp-section { margin: var(--dcp-space-xl) 0; }
/* Pierwszy nagłówek sekcji bez górnego marginesu — markup generuje Gutenberg. */
.dcp-section > .dcp-heading:first-child { margin-top: 0; }

/* Astra daje blokom najwyższego poziomu boczny padding 3em, a layout grupy
   zwęża dzieci do contentSize - sekcje bez tła były węższe niż hero i CTA.
   Zerujemy oba, by wszystkie sekcje trzymały jedną szerokość kontenera. */
.entry-content > .dcp-section {
  padding-left: 0;
  padding-right: 0;
}
.entry-content > .dcp-section > * { max-width: none; }

/* Czytelna kolumna treści — koniec „ściany tekstu" na pełną szerokość 1160 px.
   Dotyczy tekstu/list bezpośrednio w sekcji; kafle (.dcp-cards), kolumny
   (tekst+obraz) i intro strony głównej zostają nietknięte. */
.dcp-section > p:not(.dcp-section__intro),
.dcp-section > ul.wp-block-list:not(.dcp-cards),
.dcp-section > ol.wp-block-list {
  max-width: 100ch;
  /* Gutenberg (layout constrained) centruje zwężone bloki przez margin:auto
     z !important - przypinamy do lewej, równo z nagłówkami. */
  margin-left: 0 !important;
  margin-right: auto !important;
}
/* Sekcja z kafelkami na głównej: klient chce tekst na pełną szerokość kontenera.
   Akapity edytowane w panelu WP nie mają klasy dcp-section__intro. */
.home .dcp-section:has(> .dcp-features) > p {
  max-width: none;
}

/* Listy merytoryczne: znacznik-akcent DCP zamiast szarej kropki + oddech. */
.dcp-section > ul.wp-block-list:not(.dcp-cards) {
  list-style: none;
  padding-left: 0;
}
.dcp-section > ul.wp-block-list:not(.dcp-cards) > li {
  position: relative;
  padding-left: 26px;
  margin-bottom: 10px;
}
.dcp-section > ul.wp-block-list:not(.dcp-cards) > li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: .62em;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--dcp-gradient);
}

/* ===== dcp-card — karta treści ===== */
.dcp-card {
  background: var(--dcp-light);
  border: 1px solid var(--dcp-gray-6);
  border-radius: var(--dcp-radius-card);
  padding: var(--dcp-space-md);
  box-shadow: var(--dcp-shadow-card);
}
.dcp-card > .dcp-heading:first-child { margin-top: 0; }

/* ===== dcp-cards — siatka kart-linków (hub działu) =====
   Lista Gutenberga nie pozwala oklasować pojedynczych <li>/<a>, dlatego
   wnętrze stylujemy kaskadą (dozwolony wyjątek: zagnieżdżona lista). */
.dcp-cards {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: var(--dcp-space-sm);
}
.dcp-cards { counter-reset: dcp-card; }
.dcp-cards li {
  margin: 0;
  counter-increment: dcp-card;
}
.entry-content .dcp-cards a {
  display: flex;
  align-items: center;
  gap: var(--dcp-space-sm);
  height: 100%;
  padding: 16px 18px;
  background: var(--dcp-light);
  border: 1px solid var(--dcp-gray-6);
  border-radius: 14px;
  color: var(--dcp-heading-ink);
  font-size: 1.05rem;
  font-weight: 500;
  line-height: 1.35;
  text-decoration: none;
  box-shadow: var(--dcp-shadow-soft);
  transition: box-shadow .2s ease, border-color .2s ease, color .2s ease;
}
.entry-content .dcp-cards a::before {
  content: counter(dcp-card, decimal-leading-zero);
  flex-shrink: 0;
  min-width: 1.6em;
  color: var(--dcp-gray-4);
  font-size: .85rem;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  transition: color .2s ease;
}
.entry-content .dcp-cards a::after {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin-left: auto;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23BDBDBD' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10h12M11 5l5 5-5 5'/%3E%3C/svg%3E") center / contain no-repeat;
  transition: transform .2s ease, background-image .2s ease;
}
.entry-content .dcp-cards a:hover {
  border-color: rgba(128, 16, 167, .18);
  color: var(--dcp-primary);
  box-shadow: var(--dcp-shadow-card);
}
.entry-content .dcp-cards a:hover::before { color: var(--dcp-primary); }
.entry-content .dcp-cards a:hover::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%238010A7' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10h12M11 5l5 5-5 5'/%3E%3C/svg%3E");
  transform: translateX(3px);
}

/* ===== dcp-eeat — sygnał E-E-A-T (weryfikacja merytoryczna + data) =====
   Doklejany nad treścią medyczną (functions.php). Dyskretny, ale czytelny. */
.dcp-eeat {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px var(--dcp-space-sm);
  margin: var(--dcp-space-md) 0 0;
  padding-top: var(--dcp-space-sm);
  border-top: 1px solid var(--dcp-gray-6);
  font-size: .9rem;
  color: var(--dcp-muted, #5b6470);
}
.dcp-eeat__badge {
  position: relative;
  padding-left: 22px;
}
.dcp-eeat__badge::before {
  content: "✓";
  position: absolute;
  left: 0;
  font-weight: 700;
  color: var(--dcp-accent);
}
.dcp-eeat__date {
  margin-left: auto;
  white-space: nowrap;
  font-style: italic;
}

/* ===== dcp-related — blok „Zobacz też w dziale" (linkowanie silosowe) =====
   Doklejany automatycznie do podstron (functions.php). Kreska u góry oddziela
   go od treści merytorycznej; siatkę kart dziedziczy z .dcp-cards. */
.dcp-related {
  border-top: 1px solid var(--dcp-gray-6);
  padding-top: var(--dcp-space-lg);
}

/* ===== dcp-cta — pasek wezwania do działania (pełna szerokość) ===== */
.dcp-cta {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin: var(--dcp-space-xl) 0;
  padding: 64px var(--dcp-space-xl);
  background:
    radial-gradient(circle at 12% 18%, rgba(255, 255, 255, .2), transparent 42%),
    var(--dcp-gradient);
  border-radius: var(--dcp-radius-card);
  box-shadow: 0 20px 50px rgba(128, 16, 167, .25);
  color: var(--dcp-light);
  text-align: center;
}
.dcp-cta::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 50%;
  right: -70px;
  width: 360px;
  height: 360px;
  background: url("assets/logo/logo.svg") center / contain no-repeat;
  filter: brightness(0) invert(1);
  opacity: .1;
  transform: translateY(-50%) rotate(-12deg);
}
.dcp-cta::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: -90px;
  bottom: -140px;
  width: 300px;
  height: 300px;
  border: 44px solid rgba(255, 255, 255, .07);
  border-radius: 50%;
}
.dcp-cta__title,
.dcp-cta p { color: var(--dcp-light); }
.dcp-cta__title { font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.2rem); }
.dcp-cta__title::after { background: var(--dcp-light); }
.dcp-cta p {
  font-size: 1.1rem;
  opacity: .9;
}
.dcp-cta__actions {
  gap: 12px var(--dcp-space-sm);
  margin-top: var(--dcp-space-md);
}
.dcp-cta .wp-block-button .wp-block-button__link {
  box-sizing: border-box;
  min-height: 52px;
  padding: 14px 36px;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.2;
}
.dcp-cta .is-style-dcp-secondary .wp-block-button__link {
  border: none;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .15);
}
.dcp-cta .dcp-cta__phone .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(255, 255, 255, .6);
  border-radius: var(--dcp-radius-pill);
  background: transparent;
  color: var(--dcp-light);
  text-decoration: none;
  transition: background .2s ease, border-color .2s ease;
}
.dcp-cta .dcp-cta__phone .wp-block-button__link:hover {
  background: rgba(255, 255, 255, .12);
  border-color: var(--dcp-light);
}
@media (max-width: 600px) {
  .dcp-cta { padding: var(--dcp-space-xl) var(--dcp-space-md); }
  .dcp-cta::before { width: 240px; height: 240px; right: -90px; }
}

/* ===== dcp-faq — akordeon (core/details) =====
   Selektory .wp-block-details narzuca Gutenberg (markup <details>/<summary>). */
.dcp-faq .wp-block-details {
  margin-bottom: 12px;
  background: var(--dcp-light);
  border: 1px solid var(--dcp-gray-6);
  border-radius: var(--dcp-radius-sm);
  box-shadow: var(--dcp-shadow-soft);
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.dcp-faq .wp-block-details:hover { box-shadow: var(--dcp-shadow-card); }
.dcp-faq .wp-block-details[open] {
  background: linear-gradient(160deg, var(--dcp-tint) 0%, var(--dcp-light) 70%);
  border-color: rgba(217, 30, 157, .25);
  box-shadow: var(--dcp-shadow-card);
}
.dcp-faq .wp-block-details summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--dcp-space-sm);
  padding: 18px 20px 18px 24px;
  list-style: none;
  cursor: pointer;
  font-size: 1.1rem;
  font-weight: 500;
  line-height: 1.4;
  color: var(--dcp-heading-ink);
}
.dcp-faq .wp-block-details summary::-webkit-details-marker { display: none; }
.dcp-faq .wp-block-details summary::after {
  content: "";
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%238010A7' d='M6.77 7.5 10 10.73 13.24 7.5a.83.83 0 0 1 1.17 1.18L10.59 12.5a.83.83 0 0 1-1.18 0L5.59 8.68a.83.83 0 0 1 1.18-1.18Z'/%3E%3C/svg%3E") center / 20px no-repeat, var(--dcp-tint);
  transition: transform .25s ease;
}
.dcp-faq .wp-block-details summary:hover { color: var(--dcp-primary); }
.dcp-faq .wp-block-details summary:focus-visible {
  outline: 2px solid var(--dcp-accent);
  outline-offset: -2px;
  border-radius: var(--dcp-radius-sm);
}
.dcp-faq .wp-block-details[open] summary { color: var(--dcp-primary); }
.dcp-faq .wp-block-details[open] summary::after {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%23FFFFFF' d='M6.77 7.5 10 10.73 13.24 7.5a.83.83 0 0 1 1.17 1.18L10.59 12.5a.83.83 0 0 1-1.18 0L5.59 8.68a.83.83 0 0 1 1.18-1.18Z'/%3E%3C/svg%3E") center / 20px no-repeat, var(--dcp-gradient);
  transform: rotate(180deg);
}
.dcp-faq .wp-block-details > :not(summary) {
  margin: 0;
  padding: 0 24px 20px;
  color: var(--dcp-lead-ink);
}
.dcp-faq .wp-block-details > :not(summary) + :not(summary) { padding-top: 0; }

/* Płynne rozwijanie tam, gdzie przeglądarka wspiera ::details-content
   (Chrome 131+); w pozostałych akordeon po prostu otwiera się bez animacji. */
@supports selector(::details-content) {
  .dcp-faq { interpolate-size: allow-keywords; }
  .dcp-faq .wp-block-details::details-content {
    block-size: 0;
    overflow: hidden;
    transition: block-size .3s ease, content-visibility .3s allow-discrete;
  }
  .dcp-faq .wp-block-details[open]::details-content { block-size: auto; }
}

/* ===== dcp-hero--media — hero dwukolumnowy z obrazem ===== */
.dcp-hero--media { overflow: visible; }       /* obraz/cień nie mogą być przycięte */
.dcp-hero--media::before {                     /* pasek marki dopasowany do zaokrąglenia */
  border-radius: var(--dcp-radius-card) var(--dcp-radius-card) 0 0;
}
.dcp-hero__eyebrow {
  display: inline-block;
  margin: 0 0 var(--dcp-space-sm);
  font-size: .85rem;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--dcp-accent);
}
.dcp-hero__media { margin: 0; }
.dcp-hero__media img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--dcp-radius-card);
  box-shadow: var(--dcp-shadow-pop);
}

.dcp-hero--aside {
  display: grid;
  grid-template-columns: 56fr 44fr;
  align-items: center;
  gap: var(--dcp-space-xl);
  overflow: visible;
}
.dcp-hero--aside::before {
  border-radius: var(--dcp-radius-card) var(--dcp-radius-card) 0 0;
}
.dcp-hero--aside > .dcp-hero__body,
.dcp-hero--aside > .dcp-hero__media {
  max-width: none;
  margin: 0;
}
.dcp-hero__body > :first-child { margin-top: 0; }
.dcp-hero__body > :last-child { margin-bottom: 0; }
.dcp-hero__media--photo img {
  aspect-ratio: 3 / 2;
  object-fit: cover;
}
.dcp-hero__media--featured {
  justify-self: end;
  width: 100%;
  max-width: 420px;
}
@media (max-width: 781px) {
  .dcp-hero--aside {
    grid-template-columns: 1fr;
    gap: var(--dcp-space-lg);
  }
}

/* ===== dcp-frame — zdjęcie w ramce z miękkim akcentem DCP ===== */
.dcp-frame { position: relative; margin: 0; }
.dcp-frame img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--dcp-radius-card);
}
.dcp-frame::before {            /* gradientowy cień-akcent za zdjęciem */
  content: "";
  position: absolute;
  z-index: 0;
  right: -16px;
  bottom: -16px;
  width: 70%;
  height: 70%;
  background: var(--dcp-gradient);
  opacity: .14;
  border-radius: var(--dcp-radius-card);
}

/* ===== dcp-stats — pasek wyróżników (zaufanie) ===== */
.dcp-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--dcp-space-sm);
}
/* Astra: `.entry-content ul { padding-left: 20px }` przebija pojedynczą klasę -
   bez tego kafle-listy odstają od lewej krawędzi kontenera. */
.entry-content .dcp-stats,
.entry-content .dcp-cards,
.entry-content .dcp-toc__list { padding-left: 0; }
/* Pasek wyróżników tuż pod hero: zostawiamy same marginesy (56px), bez paddingu
   Astry - inaczej odstęp nad paskiem (104px) i pod nim (152px) jest nierówny. */
.entry-content > .dcp-section:has(> .dcp-stats) {
  padding-top: 0;
  padding-bottom: 0;
}
.entry-content > .dcp-section:has(> .dcp-stats) + .dcp-section { padding-top: 0; }
.dcp-stat {
  display: flex;
  align-items: center;
  gap: var(--dcp-space-sm);
  padding: var(--dcp-space-sm) var(--dcp-space-md);
  background: var(--dcp-gray-6);
  border-radius: var(--dcp-radius-sm);
}
.dcp-stat__icon { flex: 0 0 auto; color: var(--dcp-accent); line-height: 0; }
.dcp-stat__icon svg { width: 22px; height: 22px; }
.dcp-stat__label { font-size: .97rem; font-weight: 500; color: var(--dcp-heading-ink); }

/* ===== dcp-features — siatka kart z ikoną ===== */
.dcp-features {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--dcp-space-md);
}
.dcp-feature {
  background: var(--dcp-light);
  border: 1px solid var(--dcp-gray-6);
  border-radius: var(--dcp-radius-card);
  padding: var(--dcp-space-md);
  box-shadow: var(--dcp-shadow-soft);
  transition: transform .2s ease, box-shadow .2s ease;
}
.dcp-feature:hover { transform: translateY(-3px); box-shadow: var(--dcp-shadow-pop); }
.dcp-feature__icon {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--dcp-space-sm);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(217, 30, 157, .12), rgba(128, 16, 167, .12));
  color: var(--dcp-primary);
}
.dcp-feature__icon svg { width: 24px; height: 24px; }
.dcp-feature__title { margin: 0 0 var(--dcp-space-xs); font-size: 1.15rem; font-weight: 500; color: var(--dcp-heading-ink); }
.dcp-feature__text  { margin: 0; font-size: 1rem; color: var(--dcp-ink); }

/* ===== dcp-steps — etapy procesu ===== */
.dcp-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--dcp-space-md);
}
.dcp-step {
  position: relative;
  padding: var(--dcp-space-lg) var(--dcp-space-md) var(--dcp-space-md);
  background: var(--dcp-light);
  border: 1px solid var(--dcp-gray-6);
  border-radius: var(--dcp-radius-card);
  box-shadow: var(--dcp-shadow-soft);
}
.dcp-step__num {
  position: absolute;
  top: -18px;
  left: var(--dcp-space-md);
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--dcp-gradient);
  color: var(--dcp-light);
  font-weight: 600;
  box-shadow: var(--dcp-shadow-soft);
}
.dcp-step__title { margin: 0 0 var(--dcp-space-xs); font-size: 1.1rem; font-weight: 500; color: var(--dcp-heading-ink); }
.dcp-step__text  { margin: 0; font-size: .98rem; }

/* ===== Modyfikatory układu sekcji ===== */
.dcp-section__intro {
  max-width: 720px;
  margin: 0 auto var(--dcp-space-lg);
  text-align: center;
  font-size: 1.1rem;
  color: var(--dcp-lead-ink);
}
/* Wyrównanie kolumn obraz/tekst do środka — markup kolumn generuje Gutenberg. */
.dcp-section .wp-block-columns { align-items: center; }

/* ===== Utility ===== */
.dcp-muted { color: var(--dcp-gray-3); }
.dcp-divider { border: none; border-top: 1px solid var(--dcp-gray-4); margin: var(--dcp-space-lg) 0; }

/* ===== NADPISANIA Astry: nagłówek strony (header DCP) =====
   Stylujemy markup buildera nagłówka Astry — klasy narzuca motyw nadrzędny. */
.site-header {
  border-top: var(--dcp-brand-strip-height) solid var(--dcp-primary);
  border-image: var(--dcp-gradient) 1;
}
.main-header-bar,
.ast-primary-header-bar {
  background: var(--dcp-light);
  box-shadow: var(--dcp-shadow-header);
}
/* Wyrównanie logo i menu w pionie — naprawia „uciekające" do góry menu. */
.ast-builder-grid-row,
.main-header-container,
.site-header-primary-section-left,
.site-header-primary-section-right,
.site-header-primary-section-center {
  align-items: center !important;
}
.ast-site-identity {
  display: flex;
  align-items: center;
  gap: var(--dcp-space-sm);
}
.dcp-logo { display: block; flex-shrink: 0; }
.dcp-logo__img { display: block; width: 44px; height: 44px; }
.site-title { font-size: 1.3rem; line-height: 1.2; margin: 0; }
.site-title a { color: var(--dcp-primary); font-weight: 500; }
.site-title a:hover { color: var(--dcp-accent); }
.main-header-menu .menu-link,
.ast-nav-menu .menu-link,
.main-navigation ul li a {
  color: var(--dcp-heading-ink);
  font-size: .97rem;
  font-weight: 400;
}
.main-navigation ul li a:hover,
.main-header-menu .menu-item:hover > .menu-link,
.ast-nav-menu .current-menu-item > .menu-link {
  color: var(--dcp-primary);
}
.main-header-menu .sub-menu,
.ast-nav-menu .sub-menu {
  background: var(--dcp-light);
  border: 1px solid var(--dcp-gray-6);
  border-radius: var(--dcp-radius-sm);
  box-shadow: var(--dcp-shadow-pop);
  padding: var(--dcp-space-xs) 0;
}
/* „Umów diagnozę" w menu jako kompaktowy przycisk-pill (klasa dcp-menu-cta z build-menu.sh).
   Stała wysokość + inline-flex center, by nie puchł i był wyrównany w pionie. */
.main-navigation .menu-item.dcp-menu-cta,
.ast-nav-menu .menu-item.dcp-menu-cta {
  display: flex !important;
  align-items: center !important;
}
.main-navigation .dcp-menu-cta > a,
.ast-nav-menu .dcp-menu-cta > a,
.main-header-menu .dcp-menu-cta > a {
  display: inline-flex !important;
  align-items: center !important;
  height: 40px !important;
  min-height: 0 !important;
  padding: 0 22px !important;
  margin-left: var(--dcp-space-xs);
  background: var(--dcp-gradient);
  color: var(--dcp-light) !important;
  border-radius: var(--dcp-radius-pill);
  font-size: .95rem;
  font-weight: 500;
  line-height: 1 !important;
  white-space: nowrap;
  transition: opacity .2s ease;
}
.main-navigation .dcp-menu-cta > a:hover,
.ast-nav-menu .dcp-menu-cta > a:hover {
  opacity: .9;
  color: var(--dcp-light) !important;
}

/* Skrócone menu na desktopie: 5 najważniejszych pozycji.
   Pełne menu (wszystkie linki) zostaje w WordPressie — poniżej breakpointu
   Astry pokazuje się hamburger z kompletem pozycji. Na desktopie chowamy
   drugorzędne: Narzędzia, Centrum Wiedzy, Dlaczego my?. Dopasuj listę href
   poniżej, by zmienić, które linki zostają widoczne. */
@media (min-width: 922px) {
  .main-navigation .menu-item:has(> a[href*="/narzedzia-diagnostyczne/"]),
  .main-navigation .menu-item:has(> a[href*="/centrum-wiedzy/"]),
  .main-navigation .menu-item:has(> a[href*="/dlaczego-my/"]) {
    display: none !important;
  }
}

/* ===== Hamburger + wysuwany panel (off-canvas) na DESKTOPIE =====
   Daje dostęp do KOMPLETU linków (także tych ukrytych w skróconym menu).
   Markup wstrzykuje assets/js/dcp-menu.js. Na mobile działa hamburger Astry,
   więc nasz przycisk i panel pokazujemy tylko od breakpointu desktopu. */
.dcp-burger { display: none; }

@media (min-width: 922px) {
  .dcp-burger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 40px;
    margin-left: var(--dcp-space-sm);
    padding: 0;
    color: var(--dcp-heading-ink);
    background-color: transparent;
    border: 1px solid var(--dcp-gray-6);
    border-radius: var(--dcp-radius-sm);
    cursor: pointer;
    box-shadow: none;
    -webkit-tap-highlight-color: transparent;
    transition: border-color .2s ease, background-color .2s ease;
  }
  /* Wszystkie stany trzymamy w palecie DCP — bez niebieskiego tła Astry/
     przeglądarki na :focus/:active. */
  .dcp-burger:hover { border-color: var(--dcp-primary); background-color: rgba(0, 0, 0, .02); }
  .dcp-burger:focus,
  .dcp-burger:active {
    background-color: transparent !important;
    border-color: var(--dcp-primary);
    box-shadow: none !important;
    outline: none;
  }
  .dcp-burger:focus-visible {
    background-color: transparent !important;
    border-color: var(--dcp-primary);
    outline: 2px solid var(--dcp-primary);
    outline-offset: 2px;
  }
}

.dcp-burger__box {
  position: relative;
  display: block;
  width: 22px;
  height: 16px;
}
.dcp-burger__bar {
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  background: var(--dcp-heading-ink);
  transition: transform .3s ease, opacity .2s ease, top .3s ease, background .2s ease;
}
.dcp-burger__bar:nth-child(1) { top: 0; }
.dcp-burger__bar:nth-child(2) { top: 7px; }
.dcp-burger__bar:nth-child(3) { top: 14px; }
.dcp-burger:hover .dcp-burger__bar { background: var(--dcp-primary); }

/* Hamburger → „X" gdy panel otwarty. */
.dcp-drawer-open .dcp-burger__bar:nth-child(1) { top: 7px; transform: rotate(45deg); }
.dcp-drawer-open .dcp-burger__bar:nth-child(2) { opacity: 0; }
.dcp-drawer-open .dcp-burger__bar:nth-child(3) { top: 7px; transform: rotate(-45deg); }

/* Overlay (przyciemnienie tła). */
.dcp-drawer-overlay {
  position: fixed;
  inset: 0;
  z-index: 9998;
  background: rgba(15, 12, 30, .45);
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease, visibility .3s ease;
}
.dcp-drawer-open .dcp-drawer-overlay { opacity: 1; visibility: visible; }

/* Panel wysuwany z prawej. */
.dcp-drawer {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  width: min(360px, 86vw);
  height: 100%;
  background: var(--dcp-light);
  box-shadow: -16px 0 48px rgba(15, 12, 30, .18);
  transform: translateX(100%);
  transition: transform .35s cubic-bezier(.4, 0, .2, 1);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.dcp-drawer-open .dcp-drawer { transform: translateX(0); }

/* Górna belka panelu z gradientem DCP. */
.dcp-drawer__head {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: var(--dcp-space-sm) var(--dcp-space-md);
  border-bottom: 1px solid var(--dcp-gray-6);
}
.dcp-drawer__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  font-size: 1.6rem;
  line-height: 1;
  color: var(--dcp-heading-ink);
  background: transparent;
  border: 0;
  border-radius: var(--dcp-radius-sm);
  cursor: pointer;
  transition: color .2s ease, background .2s ease;
}
.dcp-drawer__close:hover { color: var(--dcp-primary); background: rgba(0, 0, 0, .04); }

/* Lista linków. */
.dcp-drawer__list {
  list-style: none;
  margin: 0;
  padding: var(--dcp-space-xs) 0;
}
.dcp-drawer__item { margin: 0; }
.dcp-drawer__link {
  display: block;
  padding: 14px var(--dcp-space-md);
  color: var(--dcp-heading-ink);
  font-size: 1rem;
  text-decoration: none;
  border-bottom: 1px solid var(--dcp-gray-6);
  transition: color .2s ease, background .2s ease, padding-left .2s ease;
}
.dcp-drawer__link:hover {
  color: var(--dcp-primary);
  background: rgba(0, 0, 0, .02);
  padding-left: calc(var(--dcp-space-md) + 6px);
}

/* „Umów diagnozę" jako wyróżniony przycisk-pill na dole listy. */
.dcp-drawer__link--cta {
  margin: var(--dcp-space-md);
  padding: 14px 22px;
  text-align: center;
  color: var(--dcp-light);
  background: var(--dcp-gradient);
  border: 0;
  border-radius: var(--dcp-radius-pill);
  font-weight: 500;
}
.dcp-drawer__link--cta:hover {
  color: var(--dcp-light);
  opacity: .9;
  padding-left: 22px;
  background: var(--dcp-gradient);
}

/* Wiersz działu z podmenu: link + przycisk rozwijania (chevron). */
.dcp-drawer__row {
  display: flex;
  align-items: stretch;
  border-bottom: 1px solid var(--dcp-gray-6);
}
.dcp-drawer__row .dcp-drawer__link {
  flex: 1 1 auto;
  border-bottom: 0;
}
.dcp-drawer__toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--dcp-heading-ink);
  background-color: transparent;
  border: 0;
  height: 24px;
  margin: auto 0;
  border-left: 1px solid var(--dcp-primary);
  box-shadow: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: color .2s ease, background-color .2s ease;
}
.dcp-drawer__toggle:hover { color: var(--dcp-primary); background-color: rgba(0, 0, 0, .03); }
/* Stany trzymamy w palecie DCP — bez niebieskiego tła Astry/przeglądarki. */
.dcp-drawer__toggle:focus,
.dcp-drawer__toggle:active {
  color: var(--dcp-primary);
  border-left: 1px solid var(--dcp-primary);
  background-color: transparent !important;
  box-shadow: none !important;
  outline: none;
}
.dcp-drawer__toggle:focus-visible {
  background-color: transparent !important;
  outline: 2px solid var(--dcp-primary);
  outline-offset: -2px;
}

/* Strzałka (chevron) = ikona keyboard_arrow_down wstawiona jako background-image
   (data-URI). Czysty CSS → renderuje się niezależnie od tego, czy JS się
   przeładował. Domyślnie w dół; po rozwinięciu działu obraca się o 180° (w górę). */
.dcp-drawer__chevron {
  display: block !important;
  width: 22px;
  height: 22px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath fill='%231a1a1a' d='M6.77082 7.5001L10.0042 10.7334L13.2375 7.5001C13.5625 7.1751 14.0875 7.1751 14.4125 7.5001C14.7375 7.8251 14.7375 8.3501 14.4125 8.6751L10.5875 12.5001C10.2625 12.8251 9.73749 12.8251 9.41249 12.5001L5.58749 8.6751C5.43144 8.5194 5.34375 8.30803 5.34375 8.0876C5.34375 7.86717 5.43144 7.65579 5.58749 7.5001C5.91249 7.18343 6.44582 7.1751 6.77082 7.5001Z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 22px 22px !important;
  transition: transform .3s ease;
}
.dcp-drawer__toggle:hover .dcp-drawer__chevron,
.dcp-drawer__item.is-open .dcp-drawer__chevron {
  /* wariant w kolorze DCP (fiolet) — druga ikona z fill primary */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath fill='%238010A7' d='M6.77082 7.5001L10.0042 10.7334L13.2375 7.5001C13.5625 7.1751 14.0875 7.1751 14.4125 7.5001C14.7375 7.8251 14.7375 8.3501 14.4125 8.6751L10.5875 12.5001C10.2625 12.8251 9.73749 12.8251 9.41249 12.5001L5.58749 8.6751C5.43144 8.5194 5.34375 8.30803 5.34375 8.0876C5.34375 7.86717 5.43144 7.65579 5.58749 7.5001C5.91249 7.18343 6.44582 7.1751 6.77082 7.5001Z'/%3E%3C/svg%3E") !important;
}
.dcp-drawer__item.is-open .dcp-drawer__chevron { transform: rotate(180deg); }

/* Rozwijana lista podstron (akordeon — wysokość sterowana z JS). */
.dcp-drawer__sub {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 0;
  overflow: hidden;
  background: var(--dcp-gray-6);
  transition: max-height .3s ease;
}
.dcp-drawer__sublink {
  display: block;
  padding: 11px var(--dcp-space-md) 11px calc(var(--dcp-space-md) + 14px);
  color: var(--dcp-text, #444);
  font-size: .94rem;
  text-decoration: none;
  border-bottom: 1px solid rgba(0, 0, 0, .05);
  transition: color .2s ease, background .2s ease;
}
.dcp-drawer__sublink:hover { color: var(--dcp-primary); background: rgba(255, 255, 255, .6); }

/* Blokada przewijania tła, gdy panel otwarty. */
.dcp-drawer-open { overflow: hidden; }

@media (prefers-reduced-motion: reduce) {
  .dcp-drawer,
  .dcp-drawer-overlay,
  .dcp-drawer__sub,
  .dcp-drawer__chevron,
  .dcp-burger__bar { transition: none; }
}

/* Strona główna: większy odstęp między kolumnami (tekst ↔ zdjęcie) na desktopie.
   Scope .home → nie wpływa na pozostałe podstrony. Poniżej breakpointu kolumny
   układają się w pionie, więc odstęp zostawiamy domyślny. */
@media (min-width: 922px) {
  .home .wp-block-columns.are-vertically-aligned-center {
    gap: var(--dcp-space-2xl);
    column-gap: var(--dcp-space-2xl);
  }
}

/* Mobile: odstęp między nagłówkiem a treścią (hero nie przyklejony do menu)
   + lekki padding pod paskiem nagłówka. */
@media (max-width: 921px) {
  #content,
  .site-content { padding-top: var(--dcp-space-lg); }
  .main-header-bar,
  .ast-primary-header-bar { padding-bottom: var(--dcp-space-xs); }
}

/* Przycisk „do góry" (Astra) w kolorystyce DCP. */
#ast-scroll-top {
  background: var(--dcp-gradient) !important;
  color: var(--dcp-light) !important;
  border-radius: 50%;
  box-shadow: var(--dcp-shadow-pop);
  transition: opacity .2s ease;
}
#ast-scroll-top:hover { opacity: .9; }

/* ===== Blog — pojedynczy wpis (single post) w stylu DCP ===== */
/* Układ wpisu: treść (lewa kolumna) + pasek „Inne wpisy" w prawej kolumnie.
   Pasek wstrzykiwany jest do treści (the_content) i pozycjonowany absolutnie
   w zarezerwowanej prawej kolumnie — niezależnie od sidebaru Astry. */
.single-post .ast-article-single { max-width: none; }
@media (min-width: 922px) {
  .single-post #content > .ast-container { max-width: 1240px; }
  .single-post #primary {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 0 var(--dcp-space-xl);
    align-items: start;
  }
  .single-post #primary > * { grid-column: 1; min-width: 0; }
  .single-post .dcp-postnav {
    position: absolute;
    top: 0;
    right: 0;
    width: 300px;
    margin: 0;
  }
}

/* Ukryj metadane wpisu (autor + data) — wszędzie: pojedynczy wpis i listy/archiwa. */
.entry-meta,
.ast-single-post-meta,
.ast-blog-meta,
.post-meta { display: none !important; }

/* Tytuł wpisu z kreską-akcentem DCP. */
.single-post .entry-title {
  position: relative;
  padding-bottom: var(--dcp-accent-line-gap);
  margin-bottom: var(--dcp-space-md);
}
.single-post .entry-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: var(--dcp-accent-line-width);
  height: var(--dcp-accent-line-height);
  background: var(--dcp-gradient);
  border-radius: 2px;
}

/* Nawigacja poprzedni/następny wpis — kolory DCP zamiast niebieskiego. */
.single-post .post-navigation a,
.single-post .nav-links a,
.single-post .ast-single-related-posts a {
  color: var(--dcp-primary) !important;
}
.single-post .post-navigation a:hover,
.single-post .nav-links a:hover { color: var(--dcp-accent) !important; }

/* Komentarze wyłączone (functions.php) — ukrycie na wszelki wypadek. */
.single-post .comments-area,
.single-post #comments,
.single-post .comment-respond { display: none !important; }

/* Prawy pasek wpisu: „Inne wpisy" (renderowany w #secondary z functions.php). */
.dcp-postnav {
  position: sticky;
  top: 100px;
  background: var(--dcp-light);
  border: 1px solid var(--dcp-gray-6);
  border-radius: var(--dcp-radius-card);
  padding: var(--dcp-space-md);
  box-shadow: var(--dcp-shadow-card);
}
.dcp-postnav__title {
  position: relative;
  margin: 0 0 var(--dcp-space-sm);
  padding-bottom: 12px;
  font-size: 1.1rem;
  font-weight: 500;
  color: var(--dcp-heading-ink);
}
.dcp-postnav__title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 36px;
  height: 3px;
  border-radius: 2px;
  background: var(--dcp-gradient);
}
.dcp-postnav__list { list-style: none; margin: 0 0 var(--dcp-space-sm); padding: 0; }
.dcp-postnav__item { margin: 0; border-top: 1px solid var(--dcp-gray-6); }
.dcp-postnav__item:first-child { border-top: none; }
.dcp-postnav__link {
  display: block;
  padding: 10px 0;
  color: var(--dcp-heading-ink);
  font-size: .97rem;
  line-height: 1.35;
  text-decoration: none;
  transition: color .2s ease;
}
.dcp-postnav__link:hover { color: var(--dcp-primary); }
.dcp-postnav__all {
  display: inline-block;
  margin-top: 4px;
  color: var(--dcp-primary);
  font-weight: 500;
  font-size: .95rem;
  text-decoration: none;
}
.dcp-postnav__all:hover { color: var(--dcp-accent); }
.dcp-postnav__title--mt { margin-top: var(--dcp-space-lg); }

/* ===== Blog — archiwum / kategorie / lista wpisów ===== */
/* Nagłówek archiwum: mniej pustki + kreska-akcent DCP. */
.ast-archive-description { margin: var(--dcp-space-lg) 0; padding: 0; min-height: 0; }
.ast-archive-description .ast-archive-title,
.ast-archive-description .page-title {
  position: relative;
  margin: 0;
  padding-bottom: var(--dcp-accent-line-gap);
}
.ast-archive-description .ast-archive-title::after,
.ast-archive-description .page-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: var(--dcp-accent-line-width);
  height: var(--dcp-accent-line-height);
  border-radius: 2px;
  background: var(--dcp-gradient);
}

/* Karty wpisów (archiwum/blog): styl DCP + hover-lift. */
.blog .ast-article-post,
.archive .ast-article-post,
.search .ast-article-post {
  border: 1px solid var(--dcp-gray-6);
  border-radius: var(--dcp-radius-card);
  box-shadow: var(--dcp-shadow-soft);
  transition: transform .2s ease, box-shadow .2s ease;
  overflow: hidden;
}
.blog .ast-article-post:hover,
.archive .ast-article-post:hover,
.search .ast-article-post:hover {
  transform: translateY(-3px);
  box-shadow: var(--dcp-shadow-pop);
}
.blog .ast-article-post .entry-title a,
.archive .ast-article-post .entry-title a,
.search .ast-article-post .entry-title a { color: var(--dcp-heading-ink); }
.blog .ast-article-post .entry-title a:hover,
.archive .ast-article-post .entry-title a:hover { color: var(--dcp-primary); }
/* „Kategoria" nad tytułem — kolor marki. */
.ast-terms-link a,
.cat-links a,
.ast-blog-single-element.ast-terms-link a { color: var(--dcp-primary) !important; font-weight: 500; }
/* Link „Czytaj dalej" w kolorze DCP. */
.blog .read-more a,
.archive .read-more a,
.ast-button.button { color: var(--dcp-primary); }

/* ===== NADPISANIA Astry: sprzątanie układu =====
   Hero pełni rolę tytułu strony — chowamy duplikujące się elementy Astry
   (tytuł wpisu, baner tytułu, okruszki/breadcrumbs). */
.page .entry-header,
.page .ast-single-entry-banner,
.page .ast-page-title,
.page .entry-title,
.ast-breadcrumbs-wrapper,
.ast-breadcrumbs,
.rank-math-breadcrumb,
nav.ast-breadcrumbs,
.trail-items { display: none !important; }

.entry-content > nav.dcp-breadcrumbs {
  margin: 0 0 var(--dcp-space-sm);
  font-size: .9rem;
}
.dcp-breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.dcp-breadcrumbs li { color: var(--dcp-gray-3); }
.dcp-breadcrumbs li + li::before {
  content: "›";
  margin: 0 10px;
  color: var(--dcp-gray-4);
}
.entry-content .dcp-breadcrumbs li a { color: var(--dcp-lead-ink); text-decoration: none; }
.entry-content .dcp-breadcrumbs li a:hover { color: var(--dcp-accent); }

body.page:not(.home) .entry-content { counter-reset: dcp-section; }
body.page:not(.home) .entry-content > .dcp-section:not(.wp-block-columns, :has(.dcp-card)) {
  margin: 0 0 var(--dcp-space-md);
  padding: var(--dcp-space-lg) var(--dcp-space-xl);
  background: var(--dcp-light);
  border: 1px solid var(--dcp-gray-6);
  border-radius: var(--dcp-radius-card);
  box-shadow: var(--dcp-shadow-card);
}
body.page:not(.home) .entry-content > .dcp-section:has(.dcp-features, .dcp-steps, .dcp-cards) {
  background: linear-gradient(160deg, var(--dcp-tint) 0%, var(--dcp-light) 80%);
}
body.page:not(.home) .entry-content > .dcp-hero { margin-bottom: var(--dcp-space-md); }
body.page:not(.home) .dcp-section > p:last-child,
body.page:not(.home) .dcp-section > ul:last-child { margin-bottom: 0; }
@media (max-width: 600px) {
  body.page:not(.home) .entry-content > .dcp-section:not(.wp-block-columns, :has(.dcp-card)) { padding: var(--dcp-space-md) var(--dcp-space-sm); }
}

body.page:not(.home) .entry-content:has(> .dcp-toc-rail) > .dcp-section:not(.dcp-related) > h2.dcp-heading:first-child {
  display: flex;
  align-items: center;
  gap: 14px;
  scroll-margin-top: var(--dcp-space-lg);
}
body.page:not(.home) .entry-content:has(> .dcp-toc-rail) > .dcp-section:not(.dcp-related) > h2.dcp-heading:first-child::before {
  counter-increment: dcp-section;
  content: counter(dcp-section, decimal-leading-zero);
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: var(--dcp-radius-sm);
  background: var(--dcp-gradient);
  color: var(--dcp-light);
  font-size: .95rem;
  font-weight: 500;
  letter-spacing: .02em;
}
body.page:not(.home) .entry-content:has(> .dcp-toc-rail) > .dcp-section:not(.dcp-related) > h2.dcp-heading:first-child::after { display: none; }

body.page:not(.home) .dcp-section > ul.wp-block-list:not(.dcp-cards) {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 12px;
  max-width: none;
}
body.page:not(.home) .dcp-section > ul.wp-block-list:not(.dcp-cards) > li {
  margin: 0;
  padding: 14px 16px 14px 52px;
  background: var(--dcp-tint);
  border-radius: var(--dcp-radius-sm);
  line-height: 1.55;
}
body.page:not(.home) .dcp-section > ul.wp-block-list:not(.dcp-cards) > li::before {
  content: "✓";
  left: 16px;
  top: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  color: var(--dcp-light);
  font-size: .75rem;
  font-weight: 600;
}

.dcp-toc {
  padding: var(--dcp-space-md);
  margin-bottom: var(--dcp-space-md);
  background: var(--dcp-light);
  border: 1px solid var(--dcp-gray-6);
  border-radius: var(--dcp-radius-card);
  box-shadow: var(--dcp-shadow-card);
}
.dcp-toc__title {
  margin: 0 0 var(--dcp-space-sm);
  font-size: .8rem;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--dcp-gray-3);
}
.dcp-toc__list {
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: dcp-toc;
}
.dcp-toc__list li {
  counter-increment: dcp-toc;
  border-top: 1px solid var(--dcp-gray-6);
}
.dcp-toc__list li:first-child { border-top: 0; }
.entry-content .dcp-toc .dcp-toc__list a {
  display: flex;
  gap: 10px;
  padding: 9px 0;
  font-size: .95rem;
  line-height: 1.4;
  color: var(--dcp-lead-ink);
  text-decoration: none;
}
.entry-content .dcp-toc .dcp-toc__list a::before {
  content: counter(dcp-toc, decimal-leading-zero);
  color: var(--dcp-primary);
  font-weight: 500;
}
.entry-content .dcp-toc .dcp-toc__list a:hover { color: var(--dcp-primary); }

/* Spis treści w osobnej kolumnie. Szyna (.dcp-toc-rail) zajmuje obszar od
   pierwszej sekcji w dół (span 99 - puste wiersze mają 0 wysokości) i jest
   rodzicem sticky: sticky w elemencie siatki ogranicza się do rodzica, nie do
   obszaru siatki, więc bez szyny spis wjeżdżał na baner CTA. */
@media (min-width: 1024px) {
  .entry-content:has(> .dcp-toc-rail) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    column-gap: var(--dcp-space-lg);
    align-items: start;
  }
  .entry-content:has(> .dcp-toc-rail) > * {
    grid-column: 1;
    width: 100%;
  }
  .entry-content:has(> .dcp-toc-rail) > .dcp-breadcrumbs,
  .entry-content:has(> .dcp-toc-rail) > .dcp-hero,
  .entry-content:has(> .dcp-toc-rail) > .dcp-cta,
  .entry-content:has(> .dcp-toc-rail) > .dcp-related,
  .entry-content:has(> .dcp-toc-rail) > .dcp-eeat { grid-column: 1 / -1; }
  .entry-content:has(> .dcp-toc-rail) > .dcp-toc-rail {
    grid-column: 2;
    grid-row: 3 / span 99;
    align-self: stretch;
  }
  .dcp-toc-rail > .dcp-toc {
    position: sticky;
    top: var(--dcp-space-lg);
  }
}

/* Karta cenowa rozpoznawana po strukturze (karta z akapitem-ceną), bo treść
   Cennika żyje w bazie produkcji - wygląd zmieniamy bez ruszania markupu. */
.dcp-card:has(> .has-x-large-font-size) {
  --dcp-price-gap: var(--dcp-space-xl);
  --dcp-price-pad: var(--dcp-space-xl);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  column-gap: var(--dcp-price-gap);
  align-items: start;
  padding: calc(var(--dcp-price-pad) + var(--dcp-brand-strip-height)) var(--dcp-price-pad) var(--dcp-price-pad);
  border-color: rgba(128, 16, 167, .12);
  box-shadow: var(--dcp-shadow-pop);
}
.dcp-card:has(> .has-x-large-font-size)::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: var(--dcp-brand-strip-height);
  background: var(--dcp-gradient);
}
.dcp-card:has(> .has-x-large-font-size)::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 auto 0 0;
  width: calc(var(--dcp-price-pad) + (100% - 2 * var(--dcp-price-pad) - var(--dcp-price-gap)) * 5 / 12 + var(--dcp-price-gap) / 2);
  background: linear-gradient(160deg, var(--dcp-tint) 0%, #F3E8F8 100%);
}
.dcp-card:has(> .has-x-large-font-size) > * {
  max-width: none;
  margin: 0 !important;
}
.dcp-card:has(> .has-x-large-font-size) > h2 {
  grid-column: 1;
  grid-row: 1;
  font-size: 1.35rem;
  line-height: 1.35;
}
.dcp-card:has(> .has-x-large-font-size) > .has-x-large-font-size {
  grid-column: 1;
  grid-row: 2;
  margin-top: var(--dcp-space-md) !important;
  font-size: clamp(2.1rem, 1.8rem + 1vw, 2.6rem) !important;
  line-height: 1;
}
.dcp-card:has(> .has-x-large-font-size) > .has-x-large-font-size strong {
  color: var(--dcp-heading-ink);
  font-weight: 600;
}
.dcp-card:has(> .has-x-large-font-size) > p:not(.has-x-large-font-size) {
  grid-column: 2;
  font-weight: 500;
  color: var(--dcp-heading-ink);
}
.dcp-card:has(> .has-x-large-font-size) > ul {
  grid-column: 2;
  display: grid;
  gap: 10px;
  margin-top: var(--dcp-space-sm) !important;
  padding: 0;
  list-style: none;
}
.dcp-card:has(> .has-x-large-font-size) > ul > li {
  position: relative;
  padding-left: 34px;
  line-height: 1.5;
}
.dcp-card:has(> .has-x-large-font-size) > ul > li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--dcp-tint);
  color: var(--dcp-primary);
  font-size: .75rem;
  font-weight: 700;
}
.dcp-section:has(.dcp-card > .has-x-large-font-size) > .dcp-muted {
  position: relative;
  max-width: none;
  margin-top: var(--dcp-space-md);
  padding-left: 30px;
  font-size: .95rem;
}
.dcp-section:has(.dcp-card > .has-x-large-font-size) > .dcp-muted::before {
  content: "i";
  position: absolute;
  left: 0;
  top: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border: 1px solid var(--dcp-gray-4);
  border-radius: 50%;
  font-size: .75rem;
  font-style: italic;
  font-weight: 600;
}
@media (max-width: 781px) {
  .dcp-card:has(> .has-x-large-font-size) {
    --dcp-price-pad: var(--dcp-space-md);
    grid-template-columns: 1fr;
  }
  .dcp-card:has(> .has-x-large-font-size)::after { display: none; }
  .dcp-card:has(> .has-x-large-font-size) > * { grid-column: 1 !important; grid-row: auto !important; }
  .dcp-card:has(> .has-x-large-font-size) > p:not(.has-x-large-font-size) {
    margin-top: var(--dcp-space-lg) !important;
    padding-top: var(--dcp-space-md);
    border-top: 1px solid var(--dcp-gray-6);
  }
}

/* Karty informacyjne w kolumnach (Kontakt) - stylowane po strukturze,
   bo treść strony żyje w bazie produkcji. */
.entry-content .wp-block-columns.dcp-section:has(.dcp-card) {
  gap: var(--dcp-space-md);
  margin: 0 0 var(--dcp-space-md);
  padding: 0;
}
.wp-block-columns.dcp-section > .wp-block-column { display: flex; }
.wp-block-columns.dcp-section .dcp-card {
  position: relative;
  overflow: hidden;
  flex: 1;
  padding: calc(var(--dcp-space-lg) + var(--dcp-brand-strip-height)) var(--dcp-space-lg) var(--dcp-space-lg);
  border-color: rgba(128, 16, 167, .1);
}
.wp-block-columns.dcp-section .dcp-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: var(--dcp-brand-strip-height);
  background: var(--dcp-gradient);
}
.wp-block-columns.dcp-section .dcp-card > h2.dcp-heading {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-bottom: 0;
  font-size: 1.4rem;
}
.wp-block-columns.dcp-section .dcp-card > h2.dcp-heading::after { display: none; }
.wp-block-columns.dcp-section .dcp-card > h2.dcp-heading::before {
  content: "";
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: var(--dcp-radius-sm);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .4 1.9.7 2.8a2 2 0 0 1-.5 2.1L8 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2Z'/%3E%3C/svg%3E") center / 22px no-repeat, var(--dcp-gradient);
}
.wp-block-columns.dcp-section > .wp-block-column:nth-child(2) .dcp-card > h2.dcp-heading::before,
.wp-block-columns.dcp-section .dcp-card > h2.dcp-heading ~ h2.dcp-heading::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 6-8 12-8 12S4 16 4 10a8 8 0 0 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E"), var(--dcp-gradient);
}
.wp-block-columns.dcp-section .dcp-card > p {
  margin: 0;
  line-height: 2;
}
.wp-block-columns.dcp-section .dcp-card > p + h2.dcp-heading {
  margin-top: var(--dcp-space-lg);
  padding-top: var(--dcp-space-lg);
  border-top: 1px solid var(--dcp-gray-6);
}
.wp-block-columns.dcp-section .dcp-card > p + p {
  margin-top: var(--dcp-space-md);
  padding-top: var(--dcp-space-md);
  border-top: 1px solid var(--dcp-gray-6);
}
.wp-block-columns.dcp-section .dcp-card strong {
  display: inline-block;
  min-width: 9.5em;
  color: var(--dcp-gray-3);
  font-weight: 500;
}
.entry-content .wp-block-columns.dcp-section .dcp-card a {
  color: var(--dcp-primary);
  font-weight: 500;
  text-decoration: none;
}
.entry-content .wp-block-columns.dcp-section .dcp-card a:hover { color: var(--dcp-accent); }
.entry-content .wp-block-columns.dcp-section .dcp-card a[href^="tel:"] {
  font-size: 1.35rem;
  font-weight: 600;
  vertical-align: -2px;
}

/* Na produkcji Kontakt jest przebudowany w panelu: kolumny owinięte w zwykłą
   grupę (z paddingiem Astry) i obie sekcje w jednej karcie. */
.entry-content > .wp-block-group:has(> .wp-block-columns.dcp-section .dcp-card) {
  margin: 0 0 var(--dcp-space-md);
  padding: 0;
}
.entry-content > .wp-block-group:has(> .wp-block-columns.dcp-section .dcp-card) > * { max-width: none; }
@media (min-width: 782px) {
  .wp-block-columns.dcp-section .dcp-card:has(> h2 ~ h2) {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-flow: dense;
    column-gap: calc(2 * var(--dcp-space-xl));
    align-items: start;
  }
  .wp-block-columns.dcp-section .dcp-card:has(> h2 ~ h2) > * {
    grid-column: 1;
    width: 100%;
    max-width: none;
  }
  .wp-block-columns.dcp-section .dcp-card:has(> h2 ~ h2) > h2 ~ h2,
  .wp-block-columns.dcp-section .dcp-card:has(> h2 ~ h2) > h2 ~ h2 ~ * { grid-column: 2; }
  .wp-block-columns.dcp-section .dcp-card:has(> h2 ~ h2) > p + h2.dcp-heading {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
  }
  .wp-block-columns.dcp-section .dcp-card:has(> h2 ~ h2)::after {
    content: "";
    position: absolute;
    top: calc(var(--dcp-space-lg) + var(--dcp-brand-strip-height));
    bottom: var(--dcp-space-lg);
    left: 50%;
    width: 1px;
    background: var(--dcp-gray-6);
  }
}