/* cmplz-general */
.cmplz-video.cmplz-iframe-styles{background-color:transparent}.cmplz-video.cmplz-hidden{visibility:hidden !important}.cmplz-blocked-content-notice{display:none}.cmplz-placeholder-parent{height:inherit}.cmplz-optin .cmplz-blocked-content-container .cmplz-blocked-content-notice,.cmplz-optin .cmplz-wp-video .cmplz-blocked-content-notice,.cmplz-optout .cmplz-blocked-content-container .cmplz-blocked-content-notice,.cmplz-optout .cmplz-wp-video .cmplz-blocked-content-notice{display:block}.cmplz-blocked-content-container,.cmplz-wp-video{animation-name:cmplz-fadein;animation-duration:600ms;background:#FFF;border:0;border-radius:3px;box-shadow:0 0 1px 0 rgba(0,0,0,0.5),0 1px 10px 0 rgba(0,0,0,0.15);display:flex;justify-content:center;align-items:center;background-repeat:no-repeat !important;background-size:cover !important;height:inherit;position:relative}.cmplz-blocked-content-container.gmw-map-cover,.cmplz-wp-video.gmw-map-cover{max-height:100%;position:absolute}.cmplz-blocked-content-container.cmplz-video-placeholder,.cmplz-wp-video.cmplz-video-placeholder{padding-bottom:initial}.cmplz-blocked-content-container iframe,.cmplz-wp-video iframe{visibility:hidden;max-height:100%;border:0 !important}.cmplz-blocked-content-container .cmplz-custom-accept-btn:focus,.cmplz-wp-video .cmplz-custom-accept-btn:focus{border:1px dotted #cecece}.cmplz-blocked-content-container .cmplz-custom-accept-btn,.cmplz-wp-video .cmplz-custom-accept-btn{white-space:normal;text-transform:initial;cursor:pointer;position:absolute !important;width:100%;top:50%;left:50%;transform:translate(-50%,-50%);max-width:200px;font-size:14px;padding:10px;background-color:rgba(0,0,0,0.5);color:#fff;text-align:center;z-index:98;line-height:23px}.cmplz-blocked-content-container .cmplz-blocked-content-notice,.cmplz-wp-video .cmplz-blocked-content-notice{white-space:normal;text-transform:initial;position:absolute !important;width:100%;top:50%;left:50%;transform:translate(-50%,-50%);max-width:300px;font-size:14px;padding:10px;background-color:rgba(0,0,0,0.5);color:#fff;text-align:center;z-index:98;line-height:23px}.cmplz-blocked-content-container .cmplz-blocked-content-notice .cmplz-links,.cmplz-wp-video .cmplz-blocked-content-notice .cmplz-links{display:block;margin-bottom:10px}.cmplz-blocked-content-container .cmplz-blocked-content-notice .cmplz-links a,.cmplz-wp-video .cmplz-blocked-content-notice .cmplz-links a{color:#fff}.cmplz-blocked-content-container .cmplz-blocked-content-notice .cmplz-blocked-content-notice-body,.cmplz-wp-video .cmplz-blocked-content-notice .cmplz-blocked-content-notice-body{display:block}.cmplz-blocked-content-container div div{display:none}.cmplz-wp-video .cmplz-placeholder-element{width:100%;height:inherit}@keyframes cmplz-fadein{from{opacity:0}to{opacity:1}}
/* mdm-fonts */
/* Lokalne pliki Google Fonts: Instrument Serif i Montserrat (OFL).
   Polskie litery (ĄąĆćĘꣳŃńŚśŹźŻż) mają własne małe pliki *-polskie-znaki.woff2, wycięte z latin-ext
   (OSTATECZNY-AUDYT S2, 25.10.2026: Montserrat 70 → 7 KB). Pełny latin-ext zostaje tylko dla innych
   znaków rozszerzonej łaciny i pobiera się wyłącznie na stronie, która ich użyje. Zakresy unicode-range
   się nie nakładają — przy zmianie zestawu znaków poprawić oba. */
@font-face {
  font-family: "Instrument Serif";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/wp-content/themes/mdm-mentoring/assets/fonts/instrument-serif-regular-polskie-znaki.woff2") format("woff2");
  unicode-range: U+0104-0107, U+0118-0119, U+0141-0144, U+015A-015B, U+0179-017C;
}
@font-face {
  font-family: "Instrument Serif";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/wp-content/themes/mdm-mentoring/assets/fonts/instrument-serif-regular-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-0103, U+0108-0117, U+011A-0140, U+0145-0159, U+015C-0178, U+017D-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Instrument Serif";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/wp-content/themes/mdm-mentoring/assets/fonts/instrument-serif-regular-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Instrument Serif";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/wp-content/themes/mdm-mentoring/assets/fonts/instrument-serif-italic-polskie-znaki.woff2") format("woff2");
  unicode-range: U+0104-0107, U+0118-0119, U+0141-0144, U+015A-015B, U+0179-017C;
}
@font-face {
  font-family: "Instrument Serif";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/wp-content/themes/mdm-mentoring/assets/fonts/instrument-serif-italic-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-0103, U+0108-0117, U+011A-0140, U+0145-0159, U+015C-0178, U+017D-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Instrument Serif";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/wp-content/themes/mdm-mentoring/assets/fonts/instrument-serif-italic-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/wp-content/themes/mdm-mentoring/assets/fonts/montserrat-polskie-znaki.woff2") format("woff2");
  unicode-range: U+0104-0107, U+0118-0119, U+0141-0144, U+015A-015B, U+0179-017C;
}
@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/wp-content/themes/mdm-mentoring/assets/fonts/montserrat-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-0103, U+0108-0117, U+011A-0140, U+0145-0159, U+015C-0178, U+017D-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/wp-content/themes/mdm-mentoring/assets/fonts/montserrat-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* mdm-tokens */
/* MDM Mentoring Wizerunkowy — shared design tokens (see /DESIGN.md).
   Google Fonts (Instrument Serif + Montserrat) are loaded via
   <link rel="preconnect"> + <link rel="stylesheet"> in each page's
   <head> — not via @import here — so the request starts immediately
   in parallel with the rest of the page instead of waiting for this
   file to be fetched and parsed first. */

/* Fonty zastępcze dopasowane do szerokości właściwych krojów. Google Fonts
   ładuje się z display=swap, więc przez chwilę strona rysuje się fontem
   systemowym — Georgia jest ~30% szersza od wąskiego Instrument Serif, a
   Arial ~11% węższy od Montserrata, przez co nagłówki „skakały” z dużych na
   właściwe. size-adjust skaluje font zastępczy do tej samej szerokości
   (zmierzone w przeglądarce na „Zacznij zmianę na swoich zasadach”). */
@font-face{ font-family:'Instrument Serif Fallback'; font-style:normal; src:local('Georgia'); size-adjust:77%; }
@font-face{ font-family:'Instrument Serif Fallback'; font-style:italic; src:local('Georgia Italic'), local('Georgia-Italic'); size-adjust:89.7%; }
@font-face{ font-family:'Montserrat Fallback'; src:local('Arial'), local('ArialMT'); size-adjust:112.7%; }

:root{
  /* color */
  --canvas:#F7F5F0;
  --surface:#FFFFFF;
  --ink:#17120F;
  --muted:#726B63;
  --muted-on-blush:#655C53; /* darker than --muted, keeps ≥4.5:1 on --blush specifically */
  --border:#DEDACF;
  --field-border:#8A8278; /* form-field outlines: ≥3:1 on --surface and --canvas (WCAG 1.4.11, audit c2) */
  --burgundy:#5C0017;
  --burgundy-dark:#5C0017;
  --blush:#F5E9E6; /* light burgundy-tinted ground for the illustration-led hero */
  --olive:#36482E; /* minor/decorative accent only — small tags, illustration tint washes */
  --olive-tint:#EDEFE7;
  --navy:#000E21; /* minor/decorative accent only — never a full section background */
  --maroon:#430808;
  --cream-on-dark:#F4F1EA;

  /* type */
  --font-display:'Instrument Serif', 'Instrument Serif Fallback', Georgia, 'Times New Roman', serif;
  --font-sans:Montserrat, 'Montserrat Fallback', -apple-system, 'Helvetica Neue', Arial, sans-serif;

  --size-hero: clamp(3.25rem, 7vw, 7.5rem);
  --size-section-heading:clamp(2.7rem, 5.2vw, 5.6rem);
  --size-h2: clamp(2.25rem, 4vw, 4rem);
  --size-h3: clamp(1.5rem, 2.5vw, 2.5rem);
  --size-h4: 1.625rem;
  --size-lead: 1.25rem;
  --size-body: 1rem;
  --size-small: 0.8125rem;
  --size-label: 0.75rem;
  --size-kicker:.75rem;
  --weight-kicker:600;
  --tracking-kicker:.14em;
  --gap-kicker:clamp(18px, 2vw, 26px);

  /* spacing */
  --space-xs:8px;
  --space-s:16px;
  --space-m:24px;
  --space-l:40px;
  --space-xl:64px;
  --space-2xl:96px;
  --space-3xl:128px;
  --space-4xl:160px;
  --section-pad: clamp(96px, 10vw, 180px);
  --page-pad: clamp(20px, 5vw, 64px);
  --frame-padding: 10px; /* biała rama wokół zdjęć w bordowych blokach — ujednolicona z hero (v1-hero-blaed) */
  --container-max: 1280px;
  --canvas-max: 1440px;
  /* Przyklejone menu: wysokość paska (kotwice lądują pod nim, patrz html). */
  --nav-height: 68px;
  /* Wyjście bloku spod krawędzi ekranu: bordowe prostokąty za zdjęciami
     zaczynają się przy samej krawędzi, nie przy marginesie strony —
     left/right: var(--bleed-x), a szerokość powiększona o var(--page-pad),
     żeby druga krawędź została na miejscu (DESIGN.md → Bleed). */
  --bleed-x: calc(-1 * var(--page-pad));

  /* motion */
  --ease-editorial: cubic-bezier(.22,1,.36,1);
  --dur-reveal: 700ms;
}

/* Polskie łamanie wierszy: dociążamy silnik przeglądarki, nie tylko JS
   (patrz shared.js) — text-wrap jest opt-in i cofa się bez efektu w
   przeglądarkach, które go nie znają. */
h1, h2, h3, h4, h5, h6{ text-wrap: balance; }
p{ text-wrap: pretty; }

*, *::before, *::after{ box-sizing:border-box; }
html{
  width:100%;
  max-width:100%;
  overscroll-behavior-x:none;
  scroll-behavior:smooth;
  /* Kotwice (#formularz, #porownanie…) lądują pod przyklejonym menu
     (68px) z 16px zapasu — wcześniej początek sekcji chował się pod
     menu (krok 1.11, E1). Jedna reguła dla wszystkich stron. */
  scroll-padding-top:calc(var(--nav-height) + 16px);
}
/* Tekst tylko dla czytników ekranu (np. „otwiera się w nowej karcie”,
   krok 1.11, D3) — niewidoczny, ale czytany. .screen-reader-text to ta sama klasa w konwencji
   WordPressa — używają jej wtyczki (np. Complianz w polityce cookies, 9.7c: bez niej tekst
   „Zgoda na usługę…” był widoczny i ściśnięty do kolumny szerokiej na literę). */
.sr-only,
.screen-reader-text{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
  border:0;
}
body{
  margin:0;
  width:100%;
  max-width:100%;
  /* clip zamiast hidden, i tylko na body (nie html) — dwa "overflow inne
     niż visible" na obu robiły z body kontener przewijania, więc
     position:sticky (np. przyklejone menu) nie miał się do czego
     przykleić (audyt responsywności, sh-1). */
  overflow-x:clip;
  overscroll-behavior-x:none;
  position:relative;
  touch-action:pan-y pinch-zoom;
  background:var(--canvas);
  color:var(--ink);
  font-family:var(--font-sans);
  font-size:var(--size-body);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  /* viewport-fit=cover (meta viewport, wszystkie strony) każe stronie
     rysować się pod wycięciem/zaokrągleniem ekranu, ale bez tego nikt nie
     odsuwał treści od bezpiecznej strefy (audyt responsywności, sh-6).
     Padding na body — nie na --page-pad — żeby nie dotykać kalkulacji
     opartych na tym tokenie w dziesiątkach sekcji. env() to 0 na
     urządzeniach bez wycięcia, więc bez zmiany wyglądu gdzie indziej. */
  padding-left:env(safe-area-inset-left);
  padding-right:env(safe-area-inset-right);
}
body > *{ max-width:100%; }
img{ max-width:100%; display:block; }
a{ color:inherit; }

::selection{ background:var(--burgundy); color:var(--cream-on-dark); }

/* focus ring, themed not browser-default. Dwukolorowy: bordowy obrys widać na
   jasnych sekcjach, kremowa poświata (box-shadow) dodaje kontrast na bordowych/
   granatowych/oliwkowych tłach, gdzie samo bordo ma ~1:1 (WCAG c1). */
:focus-visible{
  outline:2px solid var(--burgundy);
  outline-offset:3px;
  box-shadow:0 0 0 5px var(--cream-on-dark);
}

/* scrollbar, themed (webkit) */
::-webkit-scrollbar{ width:12px; height:12px; }
::-webkit-scrollbar-track{ background:var(--canvas); }
::-webkit-scrollbar-thumb{ background:var(--border); border:3px solid var(--canvas); border-radius:0; }
::-webkit-scrollbar-thumb:hover{ background:var(--muted); }

.container{
  max-width:var(--container-max);
  margin-inline:auto;
  padding-inline:var(--page-pad);
}

.canvas-bleed{
  max-width:var(--canvas-max);
  margin-inline:auto;
}

.section{ padding-block:var(--section-pad); }
.section--tight{ padding-block: calc(var(--section-pad) * 0.6); }

/* Dark sections stay in the burgundy family — burgundy is the site's main
   color besides the canvas, so navy/olive never carry a full section. */
.section--dark{
  background:var(--burgundy-dark);
  color:var(--cream-on-dark);
}
.section--deepest{
  background:var(--maroon);
  color:var(--cream-on-dark);
}
.section--olive{
  background:var(--olive-tint);
}
.section--blush{
  background:var(--blush);
}

/* Explicitly labeled placeholder for imagery/icons not present in the asset
   folder — dashed frame + a caption naming what real content belongs here. */
.placeholder-asset{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  border:1px dashed var(--burgundy);
  background:var(--olive-tint);
  color:var(--muted);
  padding:var(--space-l);
  min-height:100%;
}
.placeholder-asset__label{
  font-family:var(--font-sans);
  font-size:var(--size-small);
  line-height:1.5;
  max-width:26ch;
}
.placeholder-asset__label strong{
  display:block;
  color:var(--burgundy);
  font-size:var(--size-label);
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:6px;
}

.hr{
  border:none;
  border-top:1px solid var(--border);
  margin:0;
}
.section--dark .hr, .section--deepest .hr{
  border-top-color:rgba(244,241,234,.22);
}

/* type */
.display-hero{
  font-family:var(--font-display);
  font-size:var(--size-hero);
  font-weight:400;
  line-height:.92;
  letter-spacing:-0.02em;
  margin:0;
}
h2, .h2{
  font-family:var(--font-display);
  font-size:var(--size-h2);
  font-weight:400;
  line-height:1.0;
  letter-spacing:-0.015em;
  margin:0;
}
h3, .h3{
  font-family:var(--font-display);
  font-size:var(--size-h3);
  font-weight:400;
  line-height:1.1;
  letter-spacing:-0.01em;
  margin:0;
}
h4, .h4{
  font-family:var(--font-sans);
  font-size:var(--size-h4);
  font-weight:500;
  line-height:1.2;
  margin:0;
}
.lead{
  font-size:var(--size-lead);
  line-height:1.45;
  color:var(--muted);
  max-width:62ch;
  margin:0;
}
.section--dark .lead, .section--deepest .lead{ color:rgba(244,241,234,.78); }

p{ max-width:70ch; margin:0; }
.small{ font-size:var(--size-small); color:var(--muted); }
.label{
  font-family:var(--font-sans);
  font-size:var(--size-label);
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
}
/* --muted at .small/.label size fails contrast on the burgundy-family dark
   sections (~3.1:1) — route both to the same lighter treatment .lead already gets. */
.section--dark .small, .section--deepest .small,
.section--dark .label, .section--deepest .label{ color:rgba(244,241,234,.7); }

/* buttons */
.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  height:50px;
  padding-inline:28px;
  font-family:var(--font-sans);
  font-size:12px;
  font-weight:500;
  letter-spacing:.06em;
  text-transform:uppercase;
  text-decoration:none;
  border-radius:1px;
  border:1px solid transparent;
  cursor:pointer;
  transition:background-color .25s var(--ease-editorial), color .25s var(--ease-editorial), border-color .25s var(--ease-editorial), transform .25s var(--ease-editorial), box-shadow .25s var(--ease-editorial);
}
.btn-primary{
  background:var(--burgundy);
  color:var(--cream-on-dark);
}
.btn-primary:hover{ background:var(--burgundy-dark); transform:translateY(-2px); box-shadow:0 14px 28px rgba(92,0,23,.24); }
@media (prefers-reduced-motion: reduce){
  .btn-primary:hover{ transform:none; }
}
.btn-outline{
  background:transparent;
  border-color:currentColor;
  color:var(--ink);
}
.section--dark .btn-outline, .section--deepest .btn-outline{ color:var(--cream-on-dark); }
.btn-outline:hover{ background:rgba(23,18,15,.06); }
.section--dark .btn-outline:hover, .section--deepest .btn-outline:hover{ background:rgba(244,241,234,.1); }

.btn-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:var(--font-sans);
  font-size:12px;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-decoration:none;
  color:var(--burgundy);
  border-bottom:1px solid currentColor;
  padding-bottom:2px;
  transition:gap .25s var(--ease-editorial);
}
.btn-link:hover{ gap:12px; }
.btn-link svg{ width:14px; height:14px; }

/* small numeral label prefixing an item in a short list (e.g. "01" before
   a situation/step). Distinct from any large display-numeral component:
   this is a quiet inline index, not a headline element. */
.list-index{
  display:block;
  font-size:.75rem;
  margin-bottom:8px;
  opacity:.45;
  letter-spacing:.08em;
}

/* nav */
.site-nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:68px;
  padding-inline:var(--page-pad);
}
.site-nav__logo img{ height:26px; width:auto; }
.site-nav__links{
  display:flex;
  gap:var(--space-l);
  list-style:none;
  margin:0;
  padding:0;
}
.site-nav__links a{
  font-family:Montserrat, 'Montserrat Fallback', -apple-system, 'Helvetica Neue', Arial, sans-serif;
  font-size:var(--size-label);
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-decoration:none;
  color:var(--ink);
  transition:color .2s var(--ease-editorial);
}
.site-nav__links a:hover{ color:var(--burgundy); }
.nav--on-dark .site-nav__links a,
.nav--on-dark .site-nav__logo img{ color:var(--cream-on-dark); }
.nav--on-dark .site-nav__links a:hover{ color:rgba(244,241,234,.7); }
.nav--on-dark .site-nav__logo img{ filter:invert(1); }
.site-nav__cta{ display:flex; align-items:center; gap:var(--space-s); }

/* .site-nav--centered: opt-in modifier that centers the link list in the
   bar instead of splitting logo/links/cta with space-between. Extracted
   from a local override in v1-hero-blaed.html. */
.site-nav--centered{ position:relative; }
.site-nav--centered .site-nav__links{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
}
/* Nad progiem hamburgera (>860px) lista nie może się łamać do 2-3 linii —
   "Warsztaty dla firm i instytucji" jest za długie na sztywny odstęp bez
   nowrap (WCAG/responsywność nav2). */
@media (min-width:861px){
  .site-nav--centered .site-nav__links{ width:max-content; max-width:none; }
  .site-nav--centered .site-nav__links a{ white-space:nowrap; }
}

/* mobile nav toggle — hidden on desktop, replaces the links list below 860px */
.site-nav__toggle{
  display:none;
  width:44px;
  height:44px;
  align-items:center;
  justify-content:center;
  background:transparent;
  border:1px solid var(--border);
  cursor:pointer;
  color:var(--ink);
}
.nav--on-dark .site-nav__toggle{ color:var(--cream-on-dark); border-color:rgba(244,241,234,.35); }

@media (max-width: 860px){
  .site-nav__toggle{ display:inline-flex; }
  /* Selektor zdublowany z ".site-nav--centered .site-nav__links" (ta sama
     specyficzność 0,2,0, ale niżej w pliku) — inaczej position:absolute i
     left:50% wariantu "centered" wygrywały nad position:fixed/inset tutaj,
     więc panel na telefonie/tablecie wychodził wyśrodkowany i wąski zamiast
     pełnej szerokości (nav3). Style ujednolicone dla wszystkich 5 stron —
     wcześniej tylko o-mnie.html miał tę wersję lokalnie. */
  .site-nav--centered .site-nav__links,
  .site-nav__links{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:var(--space-m);
    position:fixed;
    left:var(--page-pad);
    right:var(--page-pad);
    top:88px;
    bottom:auto;
    transform:translateY(-12px);
    background:var(--surface);
    border:1px solid var(--border);
    box-shadow:0 20px 40px rgba(23,18,15,.14);
    padding:var(--space-l);
    z-index:60;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .2s var(--ease-editorial), transform .2s var(--ease-editorial), visibility 0s linear .2s;
  }
  .site-nav--centered .site-nav__links a,
  .site-nav__links a{ display:block; width:100%; padding:12px 2px; border-top:1px solid var(--border); }
  .site-nav--centered .site-nav__links li:first-child a,
  .site-nav__links li:first-child a{ border-top:0; }
  .site-nav--centered .site-nav__links.is-open,
  .site-nav__links.is-open{
    opacity:1;
    visibility:visible;
    transform:none;
    pointer-events:auto;
    transition:opacity .2s var(--ease-editorial), transform .2s var(--ease-editorial), visibility 0s linear 0s;
  }
  .site-nav__toggle[aria-expanded="true"]{ background:var(--burgundy); color:var(--cream-on-dark); border-color:var(--burgundy); }
}

/* CTA „Umów bezpłatną konsultację” w przyklejonym menu — jedno źródło
   stylu dla wszystkich 5 stron (ten sam znacznik w każdym <nav>, bez
   lokalnych nadpisań). Dwa elementy, bo na desktopie to przycisk po
   prawej stronie paska, a przy hamburgerze (≤860px) pozycja na końcu
   rozwijanej listy — pokazywany jest zawsze najwyżej jeden z nich.
   Selektory z prefiksem .site-nav (swoistość 0,2,0), bo lokalne .btn
   stron (np. oferta.html: inna czcionka, min-height, display) stoją w
   kaskadzie po tokens.css i przy 0,1,0 nadpisałyby wygląd i ukrywanie.
   margin-left:auto dosuwa przycisk do prawej także na stronie głównej,
   gdzie pasek nie ma logo (space-between z jednym elementem zostawiłby
   go po lewej). */
.site-nav .site-nav__cta-btn{
  margin-left:auto;
  height:40px;
  min-height:0;
  padding:0 20px;
  gap:10px;
  font-family:var(--font-sans);
  font-size:12px;
  font-weight:500;
  letter-spacing:.06em;
  white-space:nowrap;
  border:1px solid var(--burgundy);
  border-radius:1px;
  background:var(--burgundy);
  color:var(--cream-on-dark);
  box-shadow:none;
  transform:none;
}
/* hover jak .btn-primary z tokens.css (lokalne .btn:hover stron ma inny) */
.site-nav .site-nav__cta-btn:hover{
  background:var(--burgundy-dark);
  border-color:var(--burgundy-dark);
  transform:translateY(-2px);
  box-shadow:0 14px 28px rgba(92,0,23,.24);
}
@media (prefers-reduced-motion: reduce){
  .site-nav .site-nav__cta-btn:hover{ transform:none; }
}
.site-nav .site-nav__links-cta{ display:none; }
/* Miejsce w pasku (zmierzone 22.09.2026): linki 708px, przycisk 275px,
   logo 166px. Wyśrodkowane linki + przycisk mieszczą się od ~1440px
   (zapas → próg 1480). Niżej linki wracają do przepływu (logo → linki →
   przycisk) z ciaśniejszym odstępem — mieści się od ~1260px (zapas → 1300).
   Poniżej 1300px pasek nie ma miejsca na logo, 5 linków i przycisk naraz,
   więc do progu hamburgera przycisk jest schowany (CTA zostają w treści
   stron); od 860px w dół wraca jako pozycja w rozwijanym menu. */
@media (min-width:1300px) and (max-width:1479px){
  .site-nav--centered .site-nav__links{
    position:static;
    transform:none;
    margin-inline:auto;
    gap:24px;
  }
  /* bez trzeciego auto-marginesu linki stoją na środku między logo
     (lub lewą krawędzią na stronie głównej) a przyciskiem */
  .site-nav .site-nav__cta-btn{ margin-left:0; }
}
@media (max-width:1299px){
  .site-nav .site-nav__cta-btn{ display:none; }
}
@media (max-width:860px){
  /* separatory wszystkich pozycji na szerokość najdłuższej („Warsztaty dla
     firm i instytucji”): jedna kolumna max-content wyrównuje szerokość
     <li>; CTA rozpina się też na kolumnę 1fr, więc nie wlicza się do
     max-content i zostaje swojej szerokości (justify-self:start) */
  .site-nav--centered .site-nav__links,
  .site-nav__links{ display:grid; grid-template-columns:max-content 1fr; justify-items:stretch; align-content:start; }
  .site-nav__links > li{ grid-column:1; }
  .site-nav .site-nav__links .site-nav__links-cta{ grid-column:1 / -1; justify-self:start; }
  .site-nav .site-nav__links .site-nav__links-cta{ display:block; margin-top:var(--space-s); }
  .site-nav .site-nav__links .site-nav__links-cta a{
    justify-content:center;
    padding:14px 20px;
    border:0;
    background:var(--burgundy);
    color:var(--cream-on-dark);
    text-align:center;
  }
  .site-nav .site-nav__links .site-nav__links-cta a:hover{ color:var(--cream-on-dark); background:var(--burgundy-dark); }
}

/* Przyklejone menu główne (na życzenie, po audycie responsywności — nav5:
   strony są długie, 8-14 tys. px na telefonie, powrót do menu wymagał
   przewinięcia na sam początek). Rozmyte, półprzezroczyste tło działa nad
   dowolną treścią scrollującą pod spodem, bez dobierania koloru osobno dla
   każdej strony. Dotyczy 4 stron z gołym <header> (kontakt, oferta,
   warsztaty, o-mnie) — v1-hero-blaed.html ma nawigację wbudowaną w hero,
   więc przykleja ją lokalnie: position:fixed na desktopie, sticky na
   telefonie/tablecie (≤900px), gdzie <header> wraca do normalnego
   przepływu — patrz lokalne style w tym pliku. */
header{
  position:sticky;
  top:0;
  z-index:80;
  background:rgba(247,245,240,.86);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
@media (prefers-reduced-motion: no-preference){
  header{ transition:box-shadow .25s ease; }
}

/* skip-to-content link, visible only on keyboard focus */
.skip-link{
  position:absolute;
  left:-9999px;
  top:0;
  z-index:100;
  background:var(--burgundy);
  color:var(--cream-on-dark);
  padding:14px 22px;
  font-size:var(--size-small);
  text-decoration:none;
}
.skip-link:focus{
  left:var(--page-pad);
  top:var(--space-s);
}

/* fashion card */
.fashion-card{ display:flex; flex-direction:column; }
.fashion-card__media{
  aspect-ratio: 4 / 5;
  overflow:hidden;
  background:var(--olive-tint);
}
.fashion-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease-editorial); }
.fashion-card:hover .fashion-card__media img{ transform:scale(1.025); }
.fashion-card__label{
  margin-top:20px;
  font-size:var(--size-label);
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--burgundy);
}
.fashion-card__title{
  margin-top:8px;
  font-family:var(--font-display);
  font-size:1.5rem;
}
.fashion-card__desc{
  margin-top:10px;
  color:var(--muted);
  font-size:.9375rem;
  line-height:1.55;
}

/* decorative illustration watermark — for dekoracja-*.png used behind a
   section, never as literal card/content imagery */
.deco-watermark{
  position:absolute;
  pointer-events:none;
  z-index:0;
  opacity:.14;
  filter:grayscale(1);
}
.section--dark .deco-watermark, .section--deepest .deco-watermark{
  opacity:.16;
  filter:grayscale(1) brightness(3);
}

/* Wspólny system ruchu podstron. Elementy pozostają widoczne bez JS;
   stan początkowy jest włączany dopiero po przypisaniu całej sekwencji. */
html.mdm-motion-ready [data-mdm-motion]{
  --mdm-delay:0ms;
  opacity:0;
  transition:
    opacity .62s var(--ease-editorial) var(--mdm-delay),
    transform .74s var(--ease-editorial) var(--mdm-delay),
    clip-path .78s var(--ease-editorial) var(--mdm-delay),
    filter .62s var(--ease-editorial) var(--mdm-delay);
  will-change:opacity,transform,clip-path;
}
html.mdm-motion-ready [data-mdm-motion="rise"]{transform:translate3d(0,30px,0);filter:blur(2px)}
html.mdm-motion-ready [data-mdm-motion="left"]{transform:translate3d(-34px,0,0)}
html.mdm-motion-ready [data-mdm-motion="right"]{transform:translate3d(34px,0,0)}
html.mdm-motion-ready [data-mdm-motion="wipe"]{clip-path:inset(0 100% 0 0);transform:translate3d(-10px,0,0)}
/* to samo odsłonięcie, ale od prawej do lewej — dla bloków wychodzących
   spod prawej krawędzi ekranu (np. rozdziały „O mnie” bez --flip) */
html.mdm-motion-ready [data-mdm-motion="wipe-rtl"]{clip-path:inset(0 0 0 100%);transform:translate3d(10px,0,0)}
/* Maska nagłówka ma zapas na boki i w pionie: kursywa Instrument Serif
   wystaje ostatnią literą poza ramkę elementu (np. „zasadach” w ofercie)
   i przy inset(0) była ucinana, dopóki skrypt nie zdjął animacji (~1,45 s). */
html.mdm-motion-ready [data-mdm-motion="headline"]{clip-path:inset(0 -1em 100% -1em);transform:translate3d(0,22px,0)}
/* Proste pojawienie się bez przesunięcia, skali, maski ani filtra. */
html.mdm-motion-ready [data-mdm-motion="fade"]{opacity:0}
html.mdm-motion-ready [data-mdm-motion="frame"]{clip-path:inset(7%);transform:scale(.95);filter:saturate(.78)}
html.mdm-motion-ready [data-mdm-motion="grow"]{transform:translate3d(0,20px,0) scaleY(.86);transform-origin:top center}
html.mdm-motion-ready .is-mdm-visible [data-mdm-motion]{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
  /* bez przycinania: rise/left/right/grow nie używają clip-path, a inset(0)
     ucinało wszystko, co wystaje poza element — np. bordowy blok wychodzący
     spod krawędzi ekranu (kontakt „Ważne informacje”) miał 20px marginesu,
     dopóki skrypt nie zdjął animacji (~1,45 s) */
  clip-path:none;
  filter:none;
}
/* przycinanie zostaje tylko tam, gdzie animacja go używa */
html.mdm-motion-ready .is-mdm-visible [data-mdm-motion="wipe"],
html.mdm-motion-ready .is-mdm-visible [data-mdm-motion="wipe-rtl"],
html.mdm-motion-ready .is-mdm-visible [data-mdm-motion="frame"]{ clip-path:inset(0); }
html.mdm-motion-ready .is-mdm-visible [data-mdm-motion="headline"]{clip-path:inset(-.25em -1em -.25em -1em)}
/* sekcja odsłonięta fokusem z klawiatury — od razu, bez przejścia (8.2) */
html.mdm-motion-ready .is-mdm-instant [data-mdm-motion]{transition:none}
@media(prefers-reduced-motion:reduce){
  html.mdm-motion-ready [data-mdm-motion]{opacity:1;transform:none;clip-path:none;filter:none;transition:none}
}

/* ============================================================
   FOOTER — jedno zrodlo dla wszystkich 5 podstron (wczesniej ten sam
   blok byl kopiowany do <style> kazdej strony).
   Kolejnosc regul jest istotna: `.site-footer a` (0,1,1) stoi przed
   `__contact a` / `__nav a` / `__bottom a` o tej samej specyficznosci,
   zeby te ostatnie nadpisywaly przejscia.
   ============================================================ */
.site-footer{
  position:relative;
  overflow:hidden;
  background:var(--burgundy-dark);
  color:var(--cream-on-dark);
  padding:clamp(96px, 8vw, 140px) var(--page-pad) 28px;
}
.site-footer::before{
  content:"";
  position:absolute;
  top:0;
  right:clamp(28px, 6vw, 96px);
  width:clamp(120px, 16vw, 240px);
  height:1px;
  background:rgba(244,241,234,.7);
}
.site-footer a{ text-decoration:none; transition:opacity .2s var(--ease-editorial); }
.site-footer a:hover{ opacity:.7; }
.site-footer__grid{
  position:relative;
  display:grid;
  /* Kolumny boczne rowne (1fr), menu w srodku (auto) — menu stoi na osi
     strony, a nie przesuniete w prawo. Szerokosc jak tresc sekcji: cala
     szerokosc minus --page-pad (bez dawnego limitu 1440px). */
  grid-template-columns:minmax(0, 1fr) auto minmax(0, 1fr);
  gap:clamp(48px, 7vw, 112px);
  /* Kolumny rozciagniete do wspolnej wysokosci, a tresc kazdej rozlozona
     od gory do dolu — gorne i dolne krawedzie trzech kolumn sa w linii. */
  align-items:stretch;
}
.site-footer__brand,
.site-footer__close{ display:flex; flex-direction:column; justify-content:space-between; align-items:flex-start; }
.site-footer__brand{ max-width:540px; }
.site-footer__logo{ display:block; width:min(100%, 360px); height:auto; filter:invert(1); }
.site-footer__contact{
  display:grid;
  gap:9px;
  margin:28px 0 0;
  color:rgba(244,241,234,.74);
  font-family:var(--font-sans);
  font-size:.94rem;
  line-height:1.5;
}
.site-footer__contact a{
  width:max-content;
  color:var(--cream-on-dark);
  text-decoration:none;
  border-bottom:1px solid rgba(244,241,234,.38);
  transition:border-color .25s ease, color .25s ease;
}
.site-footer__contact a:hover{ border-color:var(--cream-on-dark); }
.site-footer__contact a:focus-visible,
.site-footer__cta:focus-visible,
.site-footer__bottom a:focus-visible{
  outline:2px solid var(--cream-on-dark);
  outline-offset:6px;
}
.site-footer__socials{ display:flex; flex-direction:column; align-items:flex-start; gap:10px; margin-top:28px; }
.site-footer__social{
  display:inline-flex;
  align-items:center;
  gap:14px;
  color:var(--cream-on-dark);
  font-family:var(--font-sans);
  font-size:.94rem;
  line-height:1.5;
  text-decoration:none;
}
.site-footer__social-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:none;
  width:46px;
  height:46px;
  border:1px solid rgba(244,241,234,.34);
  transition:background .25s ease, color .25s ease, border-color .25s ease;
}
.site-footer__social:hover{ opacity:1; }
.site-footer__social:hover .site-footer__social-icon,
.site-footer__social:focus-visible .site-footer__social-icon{
  background:var(--cream-on-dark);
  color:var(--burgundy-dark);
  border-color:var(--cream-on-dark);
}
.site-footer__social:focus-visible{ outline:2px solid var(--cream-on-dark); outline-offset:6px; }
.site-footer__social svg{ width:20px; height:20px; }
.site-footer__nav{ display:flex; flex-direction:column; justify-content:space-between; align-items:flex-start; gap:0; margin-block:-11px; /* padding linkow nie odsuwa tekstu od krawedzi kolumny */ }
.site-footer__nav a{
  position:relative;
  padding-block:11px; /* linki miały tylko 15px wysokości (WCAG 2.5.8);
    gap na .site-footer__nav skasowany, żeby padding nie podwoił odstępu
    (audyt responsywności, ty-1). */
  color:var(--cream-on-dark);
  font-family:var(--font-sans);
  font-size:.77rem;
  font-weight:600;
  letter-spacing:.1em;
  line-height:1.25;
  text-decoration:none;
  text-transform:uppercase;
}
.site-footer__nav a::after{
  content:"";
  position:absolute;
  left:0;
  right:100%;
  bottom:-6px;
  height:1px;
  background:currentColor;
  transition:right .3s cubic-bezier(.22,1,.36,1);
}
.site-footer__nav a:hover::after,
.site-footer__nav a:focus-visible::after{ right:0; }
.site-footer__close{ justify-self:end; }
.site-footer__close-title{
  margin:0 0 20px;
  white-space:nowrap;
  font-family:var(--font-display);
  font-size:clamp(2rem, 3vw, 3.5rem);
  font-weight:400;
  line-height:.98;
  letter-spacing:-.03em;
}
.site-footer__close-copy{
  max-width:36ch;
  margin:0 0 28px;
  color:rgba(244,241,234,.72);
  font-family:var(--font-sans);
  font-size:.95rem;
  line-height:1.6;
}
.site-footer__cta{
  display:inline-flex;
  align-items:center;
  gap:22px;
  padding:15px 0 11px;
  color:var(--cream-on-dark);
  border-bottom:1px solid rgba(244,241,234,.65);
  font-family:var(--font-sans);
  font-size:.76rem;
  font-weight:650;
  letter-spacing:.09em;
  text-decoration:none;
  text-transform:uppercase;
  transition:gap .3s cubic-bezier(.22,1,.36,1), border-color .25s ease;
}
.site-footer__cta:hover{ gap:32px; border-color:var(--cream-on-dark); }
.site-footer__cta svg{ width:18px; height:18px; }
.site-footer__bottom{
  display:grid;
  grid-template-columns:1fr auto;
  gap:28px;
  align-items:center;
  margin:clamp(64px, 8vw, 112px) 0 0;
  padding-top:22px;
  border-top:1px solid rgba(244,241,234,.2);
  color:rgba(244,241,234,.72);
  font-family:var(--font-sans);
  font-size:.75rem; /* było .72rem (11,52px) — poniżej minimum 12px (audyt
    responsywności, ty-5); dotyczy stopki wszystkich 5 stron. */
  letter-spacing:.04em;
}
.site-footer__legal{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
}
/* Polityka prywatności, Cookies i Ustawienia cookies jako jedna grupa przy prawej krawędzi
   (25.10.2026: przycisk ustawień spadał do nowego wiersza na środek). */
.site-footer__links{
  grid-column:-2 / -1;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
  gap:12px 28px;
}
.site-footer__bottom a{ color:inherit; text-underline-offset:4px; transition:color .25s ease; }
.site-footer__bottom a:hover{ color:var(--cream-on-dark); }
/* Do 1199px trzy kolumny nie mieszcza tytulu „Zacznijmy od rozmowy.”
   w jednej linii — przechodzimy na dwie (marka nad menu + zamkniecie). */
@media (max-width:1199px){
  .site-footer__grid{ grid-template-columns:1fr 1fr; gap:56px 32px; }
  .site-footer__close{ justify-self:start; }
  .site-footer__brand{ grid-column:1 / -1; }
  .site-footer__logo{ width:min(100%, 310px); }
  .site-footer__bottom{ grid-template-columns:1fr auto; }
  .site-footer__legal{ grid-column:1 / -1; }
}
@media (max-width:600px){
  .site-footer{ padding-top:56px; }
  .site-footer__grid{ grid-template-columns:1fr; gap:52px; }
  .site-footer__brand{ grid-column:auto; }
  .site-footer__close-title{ white-space:normal; }
  .site-footer__bottom{ grid-template-columns:1fr; gap:12px; margin-top:64px; }
  .site-footer__legal{ grid-column:auto; }
}
@media (max-width:767px){
  .site-footer__links{ justify-content:flex-start; }
}
.cookie-note{
  position:fixed;
  left:var(--page-pad);
  right:var(--page-pad);
  bottom:var(--space-m);
  max-width:640px;
  background:var(--ink);
  color:var(--cream-on-dark);
  padding:18px 22px;
  display:flex;
  align-items:center;
  gap:16px;
  z-index:40;
  font-size:.875rem;
}
.cookie-note button{
  flex-shrink:0;
}

@media (max-width: 640px){
  .container{ padding-inline:var(--page-pad); }
}

/* mdm-components */
/* Wspólne komponenty wydzielone ze statycznego projektu. */

/* ============================================================
   OPINIE — jeden komponent dla wszystkich stron (v1, o-mnie, warsztaty).
   Wygląd: sekcja „Głos klientki” z o-mnie (wyśrodkowany cytat, znak
   cudzysłowu, podpis kapitalikami). Jedna opinia naraz; przy kilku —
   automatyczna zmiana z fade, pauza na hover / fokus z klawiatury / po
   rozwinięciu, plus przycisk pauzy i kropki (WCAG 2.2.2). „Czytaj więcej”
   pojawia się tylko, gdy cytat nie mieści się w limicie linii.
   Zachowanie: opinions.js. Markup: [data-opinions] > [data-opinion]…
   ============================================================ */
.opinions{ padding-block:clamp(80px, 8vw, 128px); background:var(--canvas); }
.opinions [hidden]{ display:none !important; }

.opinions__title{
  margin:0 0 20px;
  font-family:var(--font-display);
  font-size:var(--size-h3);
  font-weight:400;
  color:var(--ink);
}

.opinions__inner{ position:relative; max-width:820px; margin-inline:auto; padding-inline:var(--page-pad); text-align:center; }
.opinions__mark{ display:block; width:32px; height:24px; margin-inline:auto; color:var(--burgundy); opacity:.5; }

/* Wszystkie opinie leżą w jednej komórce siatki: wysokość sekcji = wysokość
   najwyższej, więc zmiana opinii nie przesuwa reszty strony. */
.opinions__stage{ display:grid; margin-top:20px; }
.opinion{
  grid-area:1 / 1;
  margin:0;
  opacity:0;
  visibility:hidden;
  /* wychodząca gaśnie, dopiero potem wchodzi nowa */
  transition:opacity .45s ease, visibility 0s linear .45s;
}
.opinion.is-active{
  opacity:1;
  visibility:visible;
  transition:opacity .6s ease .45s, visibility 0s linear 0s;
}

.opinion__text{
  margin:0;
  font-family:var(--font-display);
  font-weight:400;
  font-size:clamp(1.5rem, 2.2vw, 2rem);
  line-height:1.35;
  color:var(--ink);
  text-wrap:pretty;
}
/* limit linii tylko po uruchomieniu skryptu (bez JS tekst jest pełny) */
.opinions.is-enhanced .opinion__text{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:5;
  line-clamp:5;
  overflow:hidden;
}
.opinions.is-enhanced .opinion.is-expanded .opinion__text{
  display:block;
  -webkit-line-clamp:unset;
  line-clamp:unset;
  overflow:visible;
}

.opinion__more{
  display:block;
  width:max-content;
  margin-top:16px;
  margin-inline-start:auto;
  margin-inline-end:0;
  padding:6px 2px;
  border:0;
  border-bottom:1px solid currentColor;
  background:none;
  font-family:var(--font-sans);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--burgundy);
  cursor:pointer;
  transition:color .25s ease;
}
.opinion__more:hover{ color:var(--ink); }

.opinion__cite{
  display:block;
  margin-top:20px;
  font-family:var(--font-sans);
  font-style:normal;
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--muted);
}
.opinion__more:not([hidden]) + .opinion__cite{ margin-top:14px; }

/* Sterowanie: tylko przy 2+ opiniach */
.opinions__controls{ display:flex; align-items:center; justify-content:center; gap:14px; margin-top:36px; }
.opinions__toggle{
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px; padding:0;
  border:1px solid var(--border); border-radius:0; background:none;
  color:var(--muted); cursor:pointer;
  transition:color .25s ease, border-color .25s ease;
}
.opinions__toggle:hover{ color:var(--burgundy); border-color:var(--burgundy); }
.opinions__icon{ width:14px; height:14px; }
.opinions__toggle .opinions__icon--play{ display:none; }
.opinions__toggle.is-paused .opinions__icon--pause{ display:none; }
.opinions__toggle.is-paused .opinions__icon--play{ display:block; }

.opinions__dots{ display:flex; align-items:center; }
.opinions__dot{
  position:relative; width:32px; height:32px; padding:0;
  border:0; background:none; cursor:pointer;
}
.opinions__dot::before{
  content:""; position:absolute; left:5px; right:5px; top:50%; height:2px; margin-top:-1px;
  background:var(--border); transition:background-color .3s ease;
}
.opinions__dot:hover::before{ background:var(--muted); }
.opinions__dot[aria-current="true"]::before{ background:var(--burgundy); }

@media (max-width:767px){
  /* Na telefonie opinie zmienia się przesunięciem palca lub kropkami. */
  .opinions__stage{ touch-action:pan-y; }
  .opinions__toggle{ display:none; }
}

@media (prefers-reduced-motion: reduce){
  .opinion, .opinion.is-active{ transition:none; }
}

/* Makieta banera cookies. Docelowe zgody i blokowanie skryptów: Complianz. */


/* mdm-page-about */
/* Source: variants/o-mnie.html */

/* Ten sam lokalny dobór krojów co pozostałe podstrony (Instrument
     Serif + Montserrat). Ta strona nie ma wariantów do wyboru — treść
     i copy pochodzą wprost z sekcji "Poznajmy się" na stronie głównej
     (about-a) i z PRODUCT.md (pozycjonowanie, opinie klientek), więc
     jest tu tylko jedna, dopracowana wersja każdej sekcji. Fonty
     ładowane raz, centralnie w tokens.css. */

  :root{
    --font-display: 'Instrument Serif', 'Instrument Serif Fallback', Georgia, 'Times New Roman', serif;
    --font-sans: Montserrat, 'Montserrat Fallback', -apple-system, 'Helvetica Neue', Arial, sans-serif;
    --ease: cubic-bezier(.22,1,.36,1);
  }

  .site-nav__links a[aria-current="page"]{ color:var(--burgundy); }

  /* tokens.css chowa .site-nav__links pod position:fixed poniżej 860px,
     ale wymaga przycisku .site-nav__toggle do jej otwarcia — bez tego
     menu byłoby niewidoczne i niedostępne na telefonie/tablecie. Ten sam
     wzorzec (przycisk + zamiana ikon otwórz/zamknij), co już działa w
     v1-hero-blaed.html. */
  .site-nav__toggle-icon{ width:22px; height:22px; }
  .site-nav__toggle-icon--close{ display:none; }
  .site-nav__toggle[aria-expanded="true"] .site-nav__toggle-icon--open{ display:none; }
  .site-nav__toggle[aria-expanded="true"] .site-nav__toggle-icon--close{ display:block; }

  .om-kicker{
    display:block;
    margin-top:0;
    margin-bottom:var(--gap-kicker);
    line-height:1.08;
    font-family:var(--font-sans);
    font-size:var(--size-kicker);
    font-weight:var(--weight-kicker);
    letter-spacing:var(--tracking-kicker);
    text-transform:uppercase;
    color:var(--burgundy);
  }
  .om-kicker--on-dark{ color:var(--cream-on-dark); }

  .om-h2{ margin:0; font-family:var(--font-display); font-weight:500; line-height:1.08; letter-spacing:-.015em; color:var(--ink); }
  .om-desc{ font-family:var(--font-sans); font-weight:500; line-height:1.6; color:var(--muted); }
  .om-btn-arrow{ width:16px; height:16px; transition:transform .3s var(--ease-editorial); }
  a.btn:hover .om-btn-arrow, .btn-link:hover .om-btn-arrow{ transform:translateX(5px); }

  /* HERO — układ strony głównej bez wordmarku i ruchomego paska tekstu. */
  .om-hero{position:relative;height:auto;min-height:0;display:grid;grid-template-columns:55% 45%;background:var(--canvas);overflow:hidden}
  /* Podłoga 660px w wysokości hero (poniżej) przy niskim oknie (np. laptop
     1366×657) wypychała przycisk "Umów bezpłatną konsultację" pod pierwszy
     ekran — sztywna wysokość włącza się tylko, gdy okno jest też dość
     wysokie (audyt responsywności, hero3). */
  @media (min-height:640px){
    .om-hero{ height:clamp(660px,calc(100svh - 88px),900px); }
  }
  .om-hero__left{display:flex;align-items:flex-end;min-width:0;padding:clamp(52px,7vh,82px) var(--page-pad)}
  .om-hero__content{width:min(100%,900px);padding-right:clamp(24px,3vw,56px)}
  .om-hero__headline{max-width:none;font-size:clamp(3.75rem,5vw,6.1rem);line-height:1.02;letter-spacing:-.03em}
  .om-hero__headline-layout{display:block}
  .om-hero__headline-layout--mobile{display:none}
  .om-hero__headline-line{display:block}
  @media (min-width:901px){.om-hero .om-hero__headline-line{white-space:nowrap!important}}
  .om-hero__headline .accent{color:var(--burgundy)}
  .om-hero__desc{margin:clamp(20px,2.8vh,30px) 0 0;max-width:48ch;font-size:1rem}
  /* ostatnie pytanie leadu w jednej linii, od nowego wiersza */
  .om-hero__desc-line{white-space:nowrap}
  @media (max-width:359px){.om-hero__desc-line{white-space:normal}}
  .om-hero__actions{margin-top:clamp(20px,3vh,30px);display:flex;align-items:center;gap:var(--space-m)}
  .om-hero__cta{height:54px;padding-inline:30px;border-radius:0;font-family:var(--font-sans)}
  .om-hero__right{position:relative;overflow:hidden;background:var(--maroon)}
  .om-hero__right img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.2s ease}
  .om-hero__right img.is-active{opacity:1}
  @media (max-width:900px){
    .om-hero{height:auto;grid-template-columns:1fr}
    .om-hero__right{order:-1;height:52vh;height:52svh;min-height:420px}
    .om-hero__left{padding:clamp(52px,9vw,78px) var(--page-pad)}
    .om-hero__content{padding-right:0}
    .om-hero__headline{max-width:none;font-size:clamp(2.2rem,9.8vw,4.8rem);line-height:1.03}
    .om-hero__headline-layout--desktop{display:none}
    .om-hero__headline-layout--mobile{display:block}
    .om-hero .om-hero__headline-line{white-space:nowrap!important}
  }

  /* ============================================================
     MOJA HISTORIA — trzy rozdziały opowieści, wzorowane na pomyśle
     z materiału klienckiego "Sekcja o mnie" (nie kopiowane 1:1): tekst
     po jednej stronie, dwie fotografie po drugiej, kierunek odwraca się
     rozdział po rozdziale — ten sam zabieg zygzaka, co już istniał w tym
     pliku dla hero/moja-historia (blok koloru wystający poza krawędź
     strony + zdjęcie w białej ramie), tylko teraz z DRUGIM, mniejszym
     zdjęciem zachodzącym na róg pierwszego — echo scrapbookowego,
     "porozrzucanego" układu z materiału źródłowego, złożone w naszym
     języku (płaskie białe ramki, bez obrotu/tilt, miękki cień tylko na
     zdjęciu wierzchnim, żeby czytać się jako fizyczna warstwa, nie
     dekoracja). Kolor bloku naprzemiennie burgundy / burgundy-dark,
     tak jak już naprzemiennie robią to hero i poprzednia wersja tej
     sekcji.
     ============================================================ */
  /* Nić: cienka pionowa linia biegnąca przez wszystkie trzy rozdziały,
     spinająca trzy osobne dotąd sekcje w jedną, ciągłą nić opowieści. */
  .om-story{ position:relative; }
  .om-story__spine{ position:absolute; left:calc(var(--page-pad) - 14px); top:0; bottom:0; width:2px; background:var(--border); z-index:2; pointer-events:none; }
  /* Bordowy pasek postępu na nici: rośnie w dół razem z przewijaniem
     historii (--om-progress 0–1 ustawia skrypt na dole strony). */
  .om-story__spine::after{ content:""; position:absolute; inset:0; background:var(--burgundy); transform-origin:top; transform:scaleY(var(--om-progress, 0)); }
  @media (max-width:980px){ .om-story__spine{ display:none; } }

  .om-chapter{ padding-block:clamp(80px, 8vw, 128px); background:var(--canvas); }
  .om-chapter__grid{
    padding-inline:var(--page-pad);
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,440px);
    gap:clamp(48px, 5vw, 96px);
    align-items:center;
  }
  .om-chapter--flip .om-chapter__grid{ grid-template-columns:minmax(0,440px) minmax(0,1fr); }
  .om-chapter--flip .om-chapter__text{ order:2; }
  .om-chapter--flip .om-chapter__visual{ order:1; }
  .om-chapter__text{ position:relative; z-index:2; }

  .om-chapter__headline{ max-width:16ch; font-size:var(--size-section-heading); }
  .om-chapter__body p{ margin:0 0 20px; max-width:58ch; font-family:var(--font-sans); font-size:1.0625rem; line-height:1.65; color:var(--muted); }
  .om-chapter__body p:last-child{ margin-bottom:0; }

  .om-chapter__visual{ position:relative; height:clamp(440px, 42vw, 560px); }
  .om-chapter__visual-block{ position:absolute; top:48px; bottom:40px; width:76%; z-index:0; }
  .om-chapter--flip .om-chapter__visual-block{ left:var(--bleed-x); }
  .om-chapter:not(.om-chapter--flip) .om-chapter__visual-block{ right:var(--bleed-x); }

  .om-chapter__photo{ position:absolute; background:var(--surface); padding:var(--frame-padding); }
  .om-chapter__photo img{ width:100%; height:100%; object-fit:cover; display:block; }
  .om-chapter__photo--main{ left:4%; bottom:0; width:60%; height:80%; z-index:1; }
  .om-chapter--flip .om-chapter__photo--main{ left:auto; right:4%; }
  .om-chapter__photo--second{
    right:0;
    top:0;
    width:40%;
    height:44%;
    z-index:2;
    padding:var(--frame-padding);
    box-shadow:0 22px 44px rgba(23,18,15,.2);
  }
  .om-chapter--flip .om-chapter__photo--second{ right:auto; left:0; }
  .om-chapter__photo--third{
    right:0;
    bottom:0;
    width:38%;
    height:38%;
    z-index:3;
    padding:var(--frame-padding);
    box-shadow:0 22px 44px rgba(23,18,15,.2);
  }
  .om-chapter--flip .om-chapter__photo--third{ right:auto; left:0; }

  .om-chapter--a .om-chapter__visual-block{ background:var(--burgundy); width:164%; }
  .om-chapter--a .om-chapter__photo--main{ top:auto; bottom:-16%; left:-30%; width:59%; height:79%; }
  .om-chapter--a .om-chapter__photo--second{ top:5%; bottom:auto; right:6%; width:56%; height:62%; }
  .om-chapter--motiv .om-chapter__visual-block{ background:var(--burgundy-dark); width:164%; }
  .om-chapter--motiv .om-chapter__photo--second{ top:auto; bottom:calc(-20% + 30px); left:auto; right:-54%; width:90%; height:46%; }
  .om-chapter--motiv .om-chapter__photo--main{ top:-9%; bottom:auto; left:-6%; right:auto; width:61%; height:67%; }
  .om-chapter--motiv .om-chapter__text{ margin-left:180px; }
  .om-chapter--b .om-chapter__visual-block{ background:var(--burgundy); width:164%; }
  .om-chapter--b .om-chapter__photo--main{ top:0; bottom:auto; left:-14%; width:66%; height:88%; }
  .om-chapter--b .om-chapter__photo--second{ top:auto; bottom:0; width:48%; height:53%; }
  .om-chapter--work .om-chapter__visual-block{ background:var(--burgundy); width:164%; }
  .om-chapter--work .om-chapter__text{ margin-left:180px; }
  .om-chapter--c .om-chapter__visual-block{ background:var(--burgundy); width:164%; }

  /* Desktop — korekty kadrów na życzenie (03.10.2026); tablet i telefon
     mają własne układy niżej, więc te przesunięcia ich nie dotyczą. */
  @media (min-width:981px){
    /* „Jak to wszystko się zaczęło?”: zdjęcie po prawej 10% wyżej */
    .om-chapter--a .om-chapter__photo--second{ top:-5%; }
    /* „Praca kreatywna”: dolne zdjęcie 10% wyżej i nad zdjęciem głównym */
    .om-chapter--motiv .om-chapter__photo--second{ bottom:calc(-10% + 30px); z-index:3; }
    /* „Magdalena po godzinach”: dolne zdjęcie 10% w lewo */
    .om-chapter--c .om-chapter__photo--main{ left:-6%; }
  }

  @media (max-width:980px){
    .om-chapter__grid,
    .om-chapter--flip .om-chapter__grid{ grid-template-columns:1fr; }
    .om-chapter__text,
    .om-chapter--flip .om-chapter__text{ order:2; }
    .om-chapter__visual,
    .om-chapter--flip .om-chapter__visual{ order:1; }

    /* The per-chapter overrides above (164% blocks, negative photo
       offsets, ±180px text margins) assume the wide two-column grid,
       where the bleed runs off into empty page margin. On the collapsed
       single column the same values would push the block and photos
       past both viewport edges. Pull every chapter back to the same
       contained geometry the base (non-overridden) rules already use
       safely elsewhere in this component. */
    .om-chapter__visual{ height:clamp(340px, 90vw, 460px); }
    .om-chapter--a .om-chapter__visual-block,
    .om-chapter--motiv .om-chapter__visual-block,
    .om-chapter--b .om-chapter__visual-block,
    .om-chapter--work .om-chapter__visual-block,
    .om-chapter--c .om-chapter__visual-block{ width:76%; }

    .om-chapter--a .om-chapter__photo--main{ top:auto; bottom:0; left:4%; width:60%; height:80%; }

    .om-chapter--motiv .om-chapter__photo--second{ top:auto; bottom:0; left:0; right:auto; width:40%; height:44%; }
    .om-chapter--motiv .om-chapter__text{ margin-left:0; }

    .om-chapter--b .om-chapter__photo--main{ top:0; bottom:auto; left:4%; width:60%; height:80%; }

    .om-chapter--work .om-chapter__text{ margin-left:0; }
  }

  /* ============================================================
     MOJE PODEJŚCIE — pozycjonowanie z PRODUCT.md (praktyczne wsparcie
     w przystępnych cenach, druga szansa dla garderoby, sezonowa
     relacja) jako indeks z cienkimi liniami, bez ikon.
     ============================================================ */
  .om-approach{ padding-block:clamp(96px, 10vw, 160px); background:var(--burgundy-dark); color:var(--cream-on-dark); }
  /* max-width podniesiony z 640px do 1000px, a nagłówek z 14ch do 20ch:
     przy ujednoliconej skali (sufit 5.6rem) wąska kolumna łamała długi
     tytuł na 6 linii i mocno rozciągała sekcję (zmierzone: 384px
     wysokości). Szersza kolumna daje 4 linie przy niższej wysokości
     (211px) niż oryginał (238px) — mniej, węższych złamań tekstu. */
  .om-approach__intro{ padding-inline:var(--page-pad); max-width:none; }
  .om-approach__headline{ font-size:var(--size-section-heading); color:var(--cream-on-dark); max-width:none; }
  .om-approach__headline-line{ display:block; }
  @media (min-width:901px){ .om-approach__headline-line{ white-space:nowrap; } }
  .om-approach__intro > p.om-desc{ margin-top:16px; font-size:1rem; max-width:52ch; color:rgba(244,241,234,.78); }

  /* Ramka-siatka zamieniona na cienkie linie, zgodnie z konwencją reszty
     strony (om-principle, om-chapter): rytm przerw między pozycjami, nie
     "arkusz kalkulacyjny" z liniami z każdej strony. */
  .om-approach__grid{ margin-top:clamp(48px, 5vw, 72px); padding-inline:var(--page-pad); display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); column-gap:clamp(28px, 3.5vw, 56px); }
  .om-approach__item{ padding-block:clamp(28px, 3vw, 40px); border-top:1px solid rgba(244,241,234,.2); border-bottom:1px solid rgba(244,241,234,.2); }
  .om-approach__item h3{ margin:0 0 10px; font-family:var(--font-sans); font-weight:600; font-size:1rem; color:var(--cream-on-dark); }
  .om-approach__item p{ margin:0; max-width:42ch; font-family:var(--font-sans); font-size:.9375rem; line-height:1.55; color:rgba(244,241,234,.72); }

  @media (max-width:900px){ .om-approach__grid{ grid-template-columns:1fr; } }

  /* ============================================================
     ZAMKNIĘCIE — ta sama sekcja CTA co na stronie głównej
     (cta-final-b w v1-hero-blaed.html), przeniesiona 1:1 z
     przemapowaniem lokalnych aliasów czcionek (font-montreal →
     font-editorial, font-body → font-copy) i var(--hero-light) na
     var(--canvas) (niemal identyczny odcień, już zdefiniowany tu).
     ============================================================ */
  .cta-final-b{ background:var(--canvas); padding-block:clamp(56px, 6vw, 96px); }
  .cta-final__whatsapp-icon{ width:20px; height:20px; flex-shrink:0; }

  .cta-final__kicker{
    display:block;
    margin-top:0;
    margin-bottom:var(--gap-kicker);
    line-height:1;
    font-family:var(--font-sans);
    font-size:12px;
    font-weight:var(--weight-kicker);
    letter-spacing:var(--tracking-kicker);
    text-transform:uppercase;
    color:var(--burgundy);
  }

  .cta-final-b__grid{
    display:grid;
    grid-template-columns:minmax(0,45fr) minmax(0,55fr); /* procenty nie
      uwzględniały gap — siatka była szersza niż kontener (audyt
      responsywności, of-1). */
    gap:clamp(40px, 5vw, 72px);
    padding-inline:var(--page-pad);
    align-items:center;
  }

  .cta-final-b__photo-wrap{ position:relative; height:700px; }
  .cta-final-b__block{
    position:absolute;
    /* wychodzi spod lewej krawędzi ekranu (bez marginesu strony); prawa
       krawędź tam, gdzie wcześniej (87% − 40px) */
    left:var(--bleed-x);
    bottom:-30px;
    width:calc(87% - 40px + var(--page-pad));
    height:80%;
    background:var(--burgundy-dark);
    z-index:0;
  }
  .cta-final-b__photo{
    position:relative;
    top:3%;
    z-index:1;
    width:min(430px, 88%);
    height:94%;
    margin-left:0;
    background:var(--surface);
    padding:var(--frame-padding);
    box-shadow:0 34px 68px rgba(0,0,0,.3);
  }
  .cta-final-b__photo img{ width:100%; height:100%; object-fit:cover; display:block; }

  .cta-final-b__headline{
    margin:0 0 var(--space-m);
    max-width:800px;
    font-family:var(--font-display);
    font-weight:500;
    font-size:var(--size-section-heading);
    line-height:.98;
    letter-spacing:-.02em;
    color:var(--ink);
  }
  .cta-final-b__headline .accent{ color:var(--burgundy); }

  .cta-final-b__desc{
    margin:0 0 clamp(32px, 4vw, 48px);
    max-width:52ch;
    font-family:var(--font-sans);
    font-weight:500;
    font-size:1rem;
    line-height:1.55;
    color:var(--muted);
  }

  .cta-final-b__rows{ display:flex; flex-direction:column; }

  .cta-final-b__row{
    position:relative;
    display:flex;
    align-items:center;
    gap:24px;
    padding-block:clamp(24px, 3vw, 34px);
    border-top:1px solid var(--border);
    text-decoration:none;
    color:var(--ink);
    overflow:hidden;
    isolation:isolate;
  }
  .cta-final-b__rows > .cta-final-b__row:last-child{ border-bottom:1px solid var(--border); }

  .cta-final-b__row::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background:var(--burgundy-dark);
    transform:scaleX(0);
    transform-origin:left center;
    transition:transform .45s cubic-bezier(.19,1,.22,1);
  }
  .cta-final-b__row:hover::before{ transform:scaleX(1); }
  .cta-final-b__row:hover{ color:var(--cream-on-dark); }
  .cta-final-b__row:hover .cta-final-b__row-desc{ color:rgba(244,241,234,.75); }
  .cta-final-b__row:hover .cta-final-b__row-num{ color:var(--cream-on-dark); }
  .cta-final-b__row:hover .cta-final-b__row-arrow{ transform:translateX(6px); color:var(--cream-on-dark); }

  .cta-final-b__row--primary{ border-top-color:var(--burgundy); border-top-width:2px; }

  .cta-final-b__row-num{
    flex:0 0 40px;
    font-family:var(--font-sans);
    font-size:.85rem;
    color:var(--burgundy);
    transition:color .3s ease;
  }

  .cta-final-b__row-body{ flex:1; min-width:0; }

  .cta-final-b__row-title{
    display:flex;
    align-items:center;
    gap:10px;
    margin:0;
    font-family:var(--font-display);
    font-weight:500;
    font-size:clamp(2rem, 2.7vw, 2.55rem);
    letter-spacing:-.01em;
  }

  .cta-final-b__row-desc{
    margin:6px 0 0;
    max-width:48ch;
    font-family:var(--font-sans);
    font-weight:500;
    font-size:.9rem;
    line-height:1.5;
    color:var(--muted);
    transition:color .3s ease;
  }

  .cta-final-b__row-arrow{
    flex-shrink:0;
    width:20px;
    height:20px;
    color:var(--ink);
    transition:transform .3s ease, color .3s ease;
  }

  @media (max-width:900px){
    .type-break{display:none}
    .cta-final-b__grid{ grid-template-columns:1fr; }
    .cta-final-b__photo-wrap{ height:min(70vh, 480px); height:min(70svh, 480px); order:-1; }
    .cta-final-b__block{ left:var(--bleed-x); width:calc(87% - 20px + var(--page-pad)); }
    .cta-final-b__photo{ width:min(360px, 84%); }
    .cta-final-b__row{ flex-wrap:wrap; }
    .cta-final-b__row-title{ font-size:clamp(1.75rem, 8vw, 2.2rem); }
  }
  /* ≤767: siatka sekcji ma wymuszone 20px (responsive.css), także przy
     --page-pad:16px poniżej 350px — blok zawsze od samej krawędzi */
  @media (max-width:767px){ .cta-final-b__block{ left:-20px; width:calc(87% + 0px); } }

/* mdm-responsive */
/* Wspólne reguły responsywne. */

/* Final responsive layer for every page in /variants.
   Phone: 0-767px, tablet: 768-1023px, desktop: 1024px+. */

html{width:100%;max-width:100%;overscroll-behavior-x:none;-webkit-text-size-adjust:100%;text-size-adjust:100%}
/* clip (nie hidden/!important) i tylko na body — patrz tokens.css: oba na
   html+body robiły z body kontener przewijania, więc position:sticky nie
   miał się do czego przykleić (audyt responsywności, sh-1). */
body{width:100%;max-width:100%;overflow-x:clip;overscroll-behavior-x:none;position:relative;touch-action:pan-y pinch-zoom}
body>*{max-width:100%}
img,svg,video,canvas,iframe{max-width:100%}
img,video{height:auto}
input,select,textarea,button{max-width:100%;font:inherit}
textarea{resize:vertical}
[hidden]{display:none!important}

@media (max-width:1023px){
  :root{--page-pad:clamp(24px,4.5vw,44px);--pad:clamp(24px,4.5vw,44px);--section-pad:clamp(72px,9vw,104px)}
  section>*,header>*,footer>*,main>*,nav>*,form>*,[class*="grid"]>*,[class*="row"]>*{min-width:0}
  section,header,footer,main,nav,form,figure{max-width:100%}
  figure{margin-inline:0}
  h1,h2,h3,h4,h5,h6,p,li,a,button,label,span{overflow-wrap:break-word}
  [class*="headline"],[class*="title-line"],.wz-steps-a__headline,.wz-topics-a__headline{white-space:normal!important}
  .btn,button,input,select,textarea{min-height:44px}
  input[type="checkbox"],input[type="radio"]{min-height:0}
  .btn{max-width:100%;height:auto;min-height:48px;padding:13px 20px;white-space:normal!important;text-align:center;justify-content:center}
  .site-nav{width:100%;max-width:100%}
  .site-nav__links{max-width:calc(100vw - (2 * var(--page-pad,24px)))}
  .site-footer__grid,.site-footer__bottom{min-width:0}

  .hero-blaed,.hero-blaed__left,.hero-blaed__right,.problem,.transform,.services,.offer-a,.wsp-a,.ebook-preview,.cta-final-b,
  .hero,.chooser,.compare,.ebook,.mentoring,.consultation,.preview,.faq,.final-cta,
  .om-hero,.om-story,.om-chapter,.om-approach,.opinions,.cta-final,
  .wz-hero-a,.wz-audience-b,.wz-topics-a,.wz-give-a,.wz-steps-a,.wz-price-b,.wz-partner-a,.wz-lead-a,
  .kt-hero-a,.kt-steps-a,.kt-paths-b,.kt-lead-b,.kt-faq-a{max-width:100%;overflow-x:hidden}
  .services__visual,.services__visual-main,.services__visual-small,.transform__visual,.problem__visual,
  .cta-final-b__photo,.ebook-preview__sheet,.hero__visual,.ebook__visual,.mentoring__visual,
  .consultation__visual,.preview__visual,.om-chapter__visual,.om-chapter__photo,.cta-final-b__photo-wrap{max-width:100%}
  .hero__title-line,.om-hero__headline-line,.wz-hero-a__headline-line,.kt-hero-a__headline-line{white-space:normal!important}
  .ebook h2,.process h2,.process__fit h3,.consult__copy h2,.wz-topics-b__banner .btn{white-space:normal!important}
  .compare__grid>*{min-width:0}
  .wz-give-a__title{width:auto!important;max-width:100%}
  .wz-topics-a__banner{min-width:0}
  .wz-topics-a__banner .btn{white-space:normal!important}

}

@media (min-width:768px) and (max-width:1023px){
  .hero-blaed,.wz-hero-a,.kt-hero-a,.om-hero,.hero{min-height:0}
  .compare__grid,.wz-audience-b__grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .compare__grid>*:last-child,.wz-audience-b__grid>*:last-child{grid-column:1/-1}
  .wz-steps-a__list,.kt-steps-a__row{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .site-footer__grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .site-footer__bottom{grid-template-columns:1fr auto!important}
}

@media (max-width:767px){
  :root{--page-pad:20px;--pad:20px;--section-pad:72px;--space-2xl:72px;--space-3xl:88px}
  body{font-size:16px}.page{width:100%;max-width:100%}
  .site-nav{padding-inline:20px}
  .site-nav__logo img{max-width:170px;height:auto;max-height:30px}
  .site-nav__links{inset:68px 16px auto 16px!important;width:auto!important;max-width:none;padding:24px!important;gap:0!important}
  .site-nav__links a{display:flex;align-items:center;min-height:48px;width:100%}
  h1,[class*="hero"] h1{font-size:clamp(2.6rem,13vw,4rem)!important;line-height:.96!important}
  h2,[class*="headline"],p{max-width:100%}
  .btn{width:100%}.btn-link{min-height:44px;align-items:center}
  input,select,textarea{width:100%;font-size:16px!important}

  .hero-blaed{height:auto!important;min-height:0!important;grid-template-columns:1fr!important}
  .hero-blaed__content{padding:48px 20px!important}.hero-blaed__visual{min-height:62svh;overflow:hidden}
  .hero-blaed__ticker-viewport{width:100%;max-width:100%;overflow:hidden!important;contain:inline-size}
  .hero-blaed__ticker{max-width:none;overflow:visible}
  .problem__inner,.transform__inner,.services__inner,.offer-a__cols,.wsp-a__header,.ebook-preview__inner,.cta-final-b__grid{grid-template-columns:1fr!important}
  .services__visual{width:100%!important;min-height:430px!important}.services__visual-main{width:min(78%,340px)!important}.services__visual-small{width:min(46%,190px)!important}
  .offer-a__cols,.wsp-a__row{gap:0!important}.offer-row{padding-inline:0!important}.wsp-a__row{grid-template-columns:1fr!important}
  .ebook-preview__viewer{min-height:520px!important}.cta-final-b__photo-wrap{height:min(72svh,520px)!important}.cta-final-b__photo{width:min(92%,380px)!important}

  .hero,.chooser,.ebook,.mentoring,.consultation,.preview,.faq,.final-cta{padding-left:20px!important;padding-right:20px!important;grid-template-columns:1fr!important}
  .hero{height:auto!important;min-height:0!important;gap:40px!important}.hero__copy{max-width:100%!important}.hero__visual{min-height:520px!important}
  .chooser{gap:40px!important}.compare{padding-left:20px!important;padding-right:20px!important}.compare__head,.compare__grid{grid-template-columns:1fr!important}.compare__grid>*:last-child{grid-column:auto}
  .ebook,.consultation{gap:48px!important}.ebook__visual,.consultation__visual{min-height:500px!important}
  .mentoring__top,.mentoring__grid,.preview__inner,.faq__inner,.final-cta__inner{grid-template-columns:1fr!important}.preview__viewer{min-height:540px!important}

  .om-hero{height:auto!important;grid-template-columns:1fr!important}.om-hero__right{height:58svh!important;min-height:420px!important}.om-hero__left{padding:48px 20px!important}
  .om-chapter{padding-block:72px!important}.om-chapter__grid,.om-chapter--flip .om-chapter__grid{grid-template-columns:1fr!important;padding-inline:20px!important;gap:44px!important}
  .om-chapter__visual{height:520px!important;overflow:hidden}.om-chapter__photo{max-width:92%!important}
  .om-approach__intro,.om-approach__grid,.opinions__inner,.cta-final-b__grid{padding-inline:20px!important}.om-approach__grid{grid-template-columns:1fr!important}

  .wz-hero-a{height:auto!important;grid-template-columns:1fr!important}.wz-hero-a__inner{padding:48px 20px!important}.wz-hero-a__visual{height:58svh!important;min-height:420px}
  .wz-audience-b__intro,.wz-audience-b__grid,.wz-topics-a__grid,.wz-steps-a__header,.wz-steps-a__list,.wz-price-b__grid,.wz-partner-a__grid{padding-left:20px!important;padding-right:20px!important}
  .wz-audience-b__grid,.wz-topics-a__grid,.wz-topics-list,.wz-give-a,.wz-steps-a__list,.wz-price-b__grid,.wz-price-b__list,.wz-partner-a__grid,.wz-lead-a{grid-template-columns:1fr!important}
  .wz-audience-b__grid>*:last-child{grid-column:auto}.wz-topics-a__headline br{display:none}
  .wz-topics-a__visual{height:500px!important;max-width:100%!important;margin-bottom:56px!important}.wz-topics-a__banner{flex-direction:column!important;align-items:stretch!important}
  .wz-give-a__head,.wz-give-a__item{padding-left:20px!important;padding-right:20px!important}.wz-steps-a__list{display:grid!important;transform:none!important}.wz-steps-a__step{min-width:0} /* karta węższa niż jej treść przy 320 px (8.2) */
  .wz-steps-a__step{width:100%!important;min-height:0!important;transform:none!important}.wz-price-b__panel{padding:32px 20px!important}.wz-lead-a__intro,.wz-lead-a__form-wrap{padding:48px 20px!important}

  .kt-hero-a{height:auto!important;min-height:0!important;grid-template-columns:1fr!important}.kt-hero-a__inner{padding:48px 20px!important}.kt-hero-a__visual{height:58svh!important;min-height:420px;overflow:hidden!important}
  .kt-hero-a__visual-photo{left:50%!important;top:50%!important;width:min(72vw,280px)!important}
  .kt-steps-a__intro,.kt-steps-a__row,.kt-paths-b__intro,.kt-paths-b__grid,.kt-faq-a__grid{padding-left:20px!important;padding-right:20px!important}
  .kt-steps-a__row,.kt-paths-b__grid,.kt-lead-b,.kt-faq-a__grid{grid-template-columns:1fr!important}.kt-steps-a__col{padding:72px 20px 28px!important}.kt-paths-b__col{padding:36px 24px!important}
  .kt-lead-b__intro,.kt-lead-b__form-wrap{padding:48px 20px!important}.kt-faq-a__visual{height:460px!important;max-width:100%!important}

  .site-footer{padding:72px 20px 24px!important;overflow:hidden}.site-footer__grid,.site-footer__bottom{grid-template-columns:1fr!important;gap:40px!important}.site-footer__bottom{margin-top:56px!important}
  .wrap{width:100%!important;max-width:100%!important;padding-left:20px!important;padding-right:20px!important}.swap{grid-template-columns:1fr!important}.swap__arrow{transform:rotate(90deg)}
}

@media (max-width:349px){
  :root{--page-pad:16px;--pad:16px}
  .site-nav{padding-inline:16px}h1,[class*="hero"] h1{font-size:clamp(2.35rem,12.5vw,3.15rem)!important}
  .btn{padding-inline:16px;font-size:11px;letter-spacing:.045em}
  .site-footer,.om-hero__left,.wz-hero-a__inner,.kt-hero-a__inner{padding-left:16px!important;padding-right:16px!important}
  /* kroki warsztatów: numer nad tekstem jak na tablecie — przy 104 px wcięcia kolumna tekstu
     miała 135 px i wyrazy łamały się w środku (8.2, powiększenie 400%) */
  .wz-steps-a__step,.wz-steps-a__step--top,.wz-steps-a__step--bottom{padding:76px 20px 20px!important}.wz-steps-a__num{top:14px;left:20px}
}

@media (hover:none),(pointer:coarse){
  a,button,input,select,textarea,label{touch-action:manipulation}
  .btn:hover,.btn-primary:hover,[class*="row"]:hover{transform:none!important}
  /* Pole 16px zapobiega przybliżeniu strony przy fokusie w Safari — warunek
     dotyku, nie szerokości ekranu, bo iPad i telefon w poziomie (> 767px)
     miały tylko 15px (audyt responsywności, ty-7). */
  input,select,textarea{font-size:16px!important}
}

@media (orientation:landscape) and (max-height:560px) and (max-width:1023px){
  .hero-blaed__right,.wz-hero-a__visual,.kt-hero-a__visual,.om-hero__right{min-height:200px!important;height:45svh!important}
}

/* W mobilnych i tabletowych hero treść z działaniem poprzedza obraz. */
@media (max-width:900px){
  .hero-blaed__left,.om-hero__left,.wz-hero-a__inner,.kt-hero-a__inner{order:1}
  .hero-blaed__right,.om-hero__right,.wz-hero-a__visual,.kt-hero-a__visual{order:2}
}
@media (max-width:767px){
  .hero-blaed__headline{order:3}
  .hero-blaed__actions{order:4}
  .hero-blaed__right{order:5}
}

/* Wspólna oś CTA na telefonach i tabletach, z wyjątkiem przycisku menu. */
@media (max-width:1023px){
  .btn:not(.site-nav__cta-btn),.btn-link,.text-link{
    display:flex;
    justify-content:center;
    text-align:center;
    margin-inline:auto;
  }
  .btn-link,.text-link{width:max-content;max-width:100%}
}

/* mdm-theme */
/*
Theme Name: MDM Mentoring Wizerunkowy
Theme URI: https://mentorkawizerunku.pl/
Author: MDM Mentoring Wizerunkowy
Description: Autorski motyw dla strony MDM Mentoring Wizerunkowy.
Version: 0.1.0
Requires at least: 6.9
Requires PHP: 8.3
Text Domain: mdm-mentoring
*/


/* mdm-page-about-late */
/* Source: variants/o-mnie.html, drugi blok <style> — w projekcie ładowany PO responsive.css, a PRZED tablet.css (8.3). */

/* Mobilny hero: portret, gradient i zaproszenie tworzą jeden kadr. */
  @media (max-width:767px){
    .om-hero{
      display:grid;
      grid-template-columns:minmax(0,1fr) !important;
      grid-template-rows:minmax(clamp(620px,calc(100svh - 68px),860px),auto);
      height:auto !important;
      min-height:0;
    }
    .om-hero__right{
      grid-column:1;
      grid-row:1;
      order:1;
      z-index:0;
      height:auto !important;
      min-height:clamp(620px,calc(100svh - 68px),860px) !important;
    }
    .om-hero__right img{ object-position:center top; }
    .om-hero__right::after{
      content:"";
      position:absolute;
      inset:0;
      z-index:1;
      pointer-events:none;
      background:linear-gradient(to bottom,
        rgba(24,0,10,0) 18%,
        rgba(24,0,10,.25) 33%,
        rgba(24,0,10,.75) 48%,
        rgba(19,0,8,.96) 68%,
        rgba(19,0,8,.98) 100%);
    }
    .om-hero__left{
      grid-column:1;
      grid-row:1;
      order:2;
      z-index:2;
      align-items:flex-end;
      padding:40px 20px 24px !important;
    }
    .om-hero__content{ width:100%; padding:0; }
    .om-hero .om-hero__headline{
      color:var(--cream-on-dark);
      font-size:clamp(2.2rem,9.8vw,3.3rem) !important; /* było 8.8vw — lekko większy (03.10.2026) */
      line-height:1.03 !important;
      letter-spacing:-.03em;
      text-shadow:0 2px 12px rgba(0,0,0,.3);
    }
    .om-hero .om-hero__headline-line{ white-space:normal !important; }
    .om-hero__headline .accent{ color:inherit; }
    .om-hero .om-hero__desc{
      max-width:42ch;
      margin-top:20px;
      font-size:.9375rem; /* lead lekko mniejszy (03.10.2026) */
      color:var(--cream-on-dark);
    }
    .om-hero__actions{ margin-top:24px; }
    .om-hero__actions .om-hero__cta{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      width:100%;
      min-height:50px;
      height:auto;
      padding:12px 16px;
      background:var(--cream-on-dark);
      border-color:var(--cream-on-dark);
      color:var(--burgundy-dark);
      text-align:center;
    }
  }

  /* Rozdziały na telefonie: najpierw historia, potem zwarty zestaw zdjęć.
     Kadry nie wychodzą poza sekcję i nie zasłaniają sobie twarzy. */
  @media (max-width:767px){
    /* Kicker każdego rozdziału stoi ok. 50px pod najniższym zdjęciem
       poprzedniego (wzorzec: „Codzienna praca”). W --a i --motiv dolne
       zdjęcie wystaje ~30px poza .om-chapter__visual, więc 40px dołu
       wystarcza; w --b i --work nie wystaje, stąd tylko 12px (--work 8px — jego
       najniższe zdjęcie kończy się ~4px nad dołem kontenera). */
    .om-chapter--a,
    .om-chapter--motiv{ padding-bottom:40px !important; }
    .om-chapter--b{ padding-bottom:12px !important; }
    .om-chapter--work{ padding-bottom:8px !important; }
    .om-chapter--motiv,
    .om-chapter--b,
    .om-chapter--work,
    .om-chapter--c{ padding-top:40px !important; }
    .om-chapter__grid,
    .om-chapter--flip .om-chapter__grid{ gap:32px !important; }
    .om-chapter__text,
    .om-chapter--flip .om-chapter__text{ order:1; }
    .om-chapter__visual,
    .om-chapter--flip .om-chapter__visual{
      order:2;
      height:clamp(280px, 84vw, 360px) !important;
      overflow:visible;
    }
    .om-chapter__headline{ font-size:clamp(2.5rem, 10vw, 3.25rem); }
    .om-chapter .om-chapter__visual-block{
      top:24px;
      right:0;
      bottom:22px;
      left:28%;
      width:auto;
    }
    .om-chapter .om-chapter__photo{
      padding:7px;
      box-shadow:none;
    }
    .om-chapter .om-chapter__photo--main{
      top:0;
      right:auto;
      bottom:auto;
      left:0;
      width:62%;
      height:90%;
    }
    .om-chapter .om-chapter__photo--second{
      top:auto;
      right:0;
      bottom:0;
      left:auto;
      width:42%;
      height:68%;
      box-shadow:0 12px 28px rgba(23,18,15,.14);
    }

    /* W dwóch rozdziałach zdjęcie główne jest poziome, więc dostaje
       szeroki kadr zamiast ciasnego pionowego wycinka. */
    .om-chapter--motiv .om-chapter__photo--main{
      width:100%;
      max-width:100% !important;
      height:64%;
    }
    .om-chapter--motiv .om-chapter__photo--second{
      width:70%;
      height:45%;
    }
    .om-chapter--work .om-chapter__visual{
      height:clamp(310px, 92vw, 390px) !important;
    }
    .om-chapter--work .om-chapter__photo--main{
      width:100%;
      max-width:100% !important;
      height:62%;
    }
    .om-chapter--work .om-chapter__photo--second,
    .om-chapter--work .om-chapter__photo--third{
      top:auto;
      bottom:0;
      width:47%;
      height:38%;
    }
    .om-chapter--work .om-chapter__photo--second{ left:0; right:auto; }
    .om-chapter--work .om-chapter__photo--third{
      left:auto;
      right:0;
      box-shadow:0 12px 28px rgba(23,18,15,.14);
    }

    /* Każdy rozdział ma własny, niewielki ruch warstw. */
    .om-chapter--a .om-chapter__photo--main{
      top:-12px;
      width:56%;
      height:84%;
    }
    .om-chapter--a .om-chapter__photo--second{ bottom:calc(-12px - 10%); }

    .om-chapter--motiv .om-chapter__visual-block{
      top:8px;
      bottom:8px;
      left:var(--bleed-x);
      right:0;
      background:var(--burgundy-dark);
    }
    .om-chapter--motiv .om-chapter__photo--main{
      width:90%;
      height:58%;
    }
    .om-chapter--motiv .om-chapter__photo--second{ bottom:calc(-14px - 10%); }

    .om-chapter--b .om-chapter__photo--main{ top:-16px; }
    .om-chapter--b .om-chapter__photo--second{ bottom:-16px; }

    .om-chapter--work .om-chapter__visual-block{
      top:20px;
      bottom:16px;
      left:var(--bleed-x);
      right:0;
    }
    .om-chapter--work .om-chapter__photo--main{
      top:-12px;
      width:84%;
      height:55%;
      z-index:3;
    }
    .om-chapter--work .om-chapter__photo--second{
      top:37%;
      bottom:auto;
      left:7%;
      width:45%;
      z-index:4;
    }
    .om-chapter--work .om-chapter__photo--third{ bottom:-12px; z-index:1; }

    .om-chapter--c .om-chapter__photo--main{ top:-16px; }
    .om-chapter--c .om-chapter__photo--second{ bottom:-10%; }
  }
  @media (min-width:768px) and (max-width:1023px){
    .om-hero__left{order:1}
    .om-hero__right{order:2}
    .om-chapter--motiv .om-chapter__visual-block{background:var(--burgundy-dark)}
    .om-chapter--work .om-chapter__photo--main{top:-3%}
    .om-chapter--work .om-chapter__photo--second{bottom:12%;left:7%;z-index:2}
    .om-chapter--work .om-chapter__photo--third{bottom:-3%;z-index:1}
    .om-chapter--c .om-chapter__photo--second{bottom:-10%}
  }

/* mdm-tablet */
/* Source: variants/tablet.css — w projekcie ładowany NA KOŃCU, po wszystkich stylach strony (8.3). */

/* Tablet 768–1179 px: jeden kadr hero jak na telefonie, więcej oddechu w treści.
   Plik ładowany po lokalnych stylach stron i po responsive.css. */
@media (min-width:768px) and (max-width:1179px){
  :root{ --page-pad:clamp(32px,5vw,64px); }
  h1,h2,h3,h4,h5,h6{ overflow-wrap:normal; }

  /* Ścieżki wsparcia: na tablecie każda oferta zajmuje osobny rząd. */
  .offer-a__cols{ grid-template-columns:minmax(0,1fr); gap:20px; }
  .offer-a__cols .offer-col{ min-width:0; }
  .offer-a__cols .offer-col--highlight{ transform:none; }

  /* Jeden próg nawigacji dla wszystkich siedmiu stron. */
  .site-nav{ height:68px; padding-inline:var(--page-pad); justify-content:space-between; }
  .site-nav__logo img{ max-width:210px; height:auto; max-height:34px; }
  .site-nav__toggle{ display:inline-flex; margin-left:auto; }
  .site-nav .site-nav__cta-btn{ display:none; }
  .site-nav--centered .site-nav__links,
  .site-nav__links{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:0;
    position:fixed;
    inset:76px var(--page-pad) auto;
    width:auto;
    max-width:none;
    margin:0;
    padding:24px 28px;
    transform:translateY(-12px);
    background:var(--surface);
    border:1px solid var(--border);
    box-shadow:0 20px 40px rgba(23,18,15,.14);
    z-index:90;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .2s var(--ease-editorial),transform .2s var(--ease-editorial),visibility 0s linear .2s;
  }
  .site-nav--centered .site-nav__links.is-open,
  .site-nav__links.is-open{
    opacity:1; visibility:visible; pointer-events:auto; transform:none;
    transition:opacity .2s var(--ease-editorial),transform .2s var(--ease-editorial),visibility 0s linear 0s;
  }
  .site-nav__links>li{ grid-column:1; min-width:0; }
  .site-nav--centered .site-nav__links a,
  .site-nav__links a{ display:flex; align-items:center; min-height:48px; width:100%; padding:12px 2px; border-top:1px solid var(--border); white-space:normal; }
  .site-nav__links li:first-child a{ border-top:0; }
  .site-nav .site-nav__links .site-nav__links-cta{ display:block; margin-top:16px; justify-self:start; }
  .site-nav .site-nav__links .site-nav__links-cta a{ justify-content:center; padding:14px 20px; border:0; background:var(--burgundy); color:var(--cream-on-dark); }

  /* Strona główna: znak wraca do paska, a hasło i CTA na ilustrację. */
  .hero-blaed{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:auto minmax(clamp(650px,calc(100svh - 68px),880px),auto);
    height:auto !important;
    min-height:0 !important;
    padding-top:68px;
  }
  .hero-blaed__topbar,.hero-blaed__topbar .site-nav{ height:68px; }
  .hero-blaed__nav-logo{ display:block; flex:0 1 auto; min-width:0; }
  .hero-blaed__nav-logo img{ display:block; width:min(30vw,210px); height:auto; }
  .hero-blaed__left{ display:contents; }
  .hero-blaed__wordmark{ display:none; }
  .hero-blaed__ticker-row{ grid-column:1; grid-row:1; order:1; margin-inline:var(--page-pad); padding-block:16px; }
  .hero-blaed__right{ grid-column:1; grid-row:2; order:2; z-index:0; height:auto !important; min-height:clamp(650px,calc(100svh - 68px),880px); margin:0; }
  .hero-blaed__right img{ object-position:center top; }
  .hero-blaed__right::after{
    content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
    background:linear-gradient(to bottom,rgba(24,0,10,0) 16%,rgba(24,0,10,.25) 35%,rgba(24,0,10,.8) 58%,rgba(19,0,8,.98) 100%);
  }
  .hero-blaed__headline{
    grid-column:1; grid-row:2; order:3; align-self:end; position:relative; z-index:2;
    max-width:none !important; margin:0 var(--page-pad) 124px; padding:0;
    color:var(--cream-on-dark); text-shadow:0 2px 12px rgba(0,0,0,.35);
  }
  .hero-blaed .hero-blaed__headline{ font-size:clamp(3.5rem,6.4vw,5.15rem) !important; line-height:1.03 !important; letter-spacing:-.035em; }
  .hero-blaed__headline .accent{ color:inherit; }
  .hero-blaed__headline .hero-blaed__line{ display:block; white-space:nowrap; overflow-wrap:normal; }
  .hero-blaed__actions{
    grid-column:1; grid-row:2; order:4; align-self:end; position:relative; z-index:2;
    display:flex; align-items:center; justify-content:flex-start; gap:20px;
    margin:0; padding:0 var(--page-pad) 28px;
  }
  .hero-blaed__actions>.btn{ margin:0 !important; }
  .hero-blaed__actions .btn-primary{ background:var(--cream-on-dark); border-color:var(--cream-on-dark); color:var(--burgundy-dark); }
  .hero-blaed__actions .hero-blaed__secondary-button{ color:var(--cream-on-dark); border-color:rgba(244,241,234,.8); }

  /* Cztery pozostałe hero korzystają z mobilnego układu warstwowego. */
  .om-hero,.wz-hero-a,.kt-hero-a,.hero{
    display:grid !important; grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:minmax(clamp(680px,calc(100svh - 68px),920px),auto);
    height:auto !important; min-height:0 !important; max-height:none !important;
    gap:0 !important; overflow:hidden;
  }
  .om-hero__right,.wz-hero-a__visual,.kt-hero-a__visual,.hero__media{
    grid-column:1; grid-row:1; order:1; z-index:0;
    height:auto !important; min-height:clamp(680px,calc(100svh - 68px),920px) !important;
    margin:0; overflow:hidden;
  }
  .om-hero__right::after,.wz-hero-a__visual::after,.kt-hero-a__visual::after,.hero__media::after{
    content:""; position:absolute; inset:0; z-index:3; pointer-events:none;
    background:linear-gradient(to bottom,rgba(24,0,10,0) 18%,rgba(24,0,10,.24) 35%,rgba(24,0,10,.78) 59%,rgba(19,0,8,.98) 100%);
  }
  .om-hero__left,.wz-hero-a__inner,.kt-hero-a__inner,.hero__copy{
    grid-column:1; grid-row:1; order:2; z-index:4; align-self:end;
    width:100%; max-width:none; min-height:0;
    padding:44px var(--page-pad) 30px !important;
  }
  .om-hero__left,.wz-hero-a__inner,.kt-hero-a__inner{ justify-content:flex-end; }
  .om-hero__content{ width:100%; padding:0; }
  .om-hero .om-hero__headline,
  .wz-hero-a .wz-hero-a__headline,
  .kt-hero-a .kt-hero-a__headline,
  .hero h1{
    max-width:16ch; color:var(--cream-on-dark); line-height:1.03 !important;
    letter-spacing:-.03em; text-shadow:0 2px 12px rgba(0,0,0,.3);
  }
  .om-hero .om-hero__headline{ font-size:clamp(3.25rem,6.2vw,5rem) !important; }
  .wz-hero-a .wz-hero-a__headline,
  .kt-hero-a .kt-hero-a__headline{ font-size:clamp(3.25rem,6.1vw,5rem) !important; }
  .hero h1{ font-size:clamp(3.5rem,6.6vw,5.3rem) !important; }
  .om-hero__headline .accent,.wz-hero-a__headline .accent,.kt-hero-a__headline .accent,.hero h1 .accent{ color:inherit; }
  .om-hero .om-hero__headline-line,.wz-hero-a__headline-line,.kt-hero-a__headline-line,.hero__title-line{ white-space:normal !important; }
  .om-hero__desc,.wz-hero-a .wz-hero-a__desc,.kt-hero-a .kt-hero-a__desc,.hero .hero__lead{
    max-width:60ch; color:var(--cream-on-dark); font-size:clamp(1rem,1.6vw,1.15rem);
  }
  .om-hero .om-hero__desc{ margin-top:20px; }
  .wz-hero-a .wz-kicker,.kt-hero-a .kt-kicker{ color:var(--cream-on-dark); }
  .om-hero__actions,.wz-hero-a__cta-col,.kt-hero-a__row,.hero__actions{ margin-top:22px; }
  .om-hero__cta,.wz-hero-a__cta,.kt-hero-a__cta,.hero__actions .btn{
    min-height:50px; height:auto; background:var(--cream-on-dark); border-color:var(--cream-on-dark);
    color:var(--burgundy-dark); text-align:center;
  }
  .hero__actions{ justify-content:flex-start; }
  .hero__actions .text-link{ color:var(--cream-on-dark); }
  .hero{ padding:0 !important; }
  .hero__portrait{ inset:0 !important; width:100%; height:100%; padding:0; background:transparent; box-shadow:none; }
  .hero__portrait-stage img{ object-position:center 42%; }
  .wz-hero-a__visual img{ height:78%; transform:none; object-position:center top; }
  .wz-hero-a__tags{ max-width:100%; flex-wrap:wrap; border-color:rgba(244,241,234,.35); }
  .wz-hero-a__tags span{ color:var(--cream-on-dark); }
  .kt-hero-a__visual-photo{
    inset:0 !important; left:0 !important; top:0 !important; width:100% !important;
    height:100%; aspect-ratio:auto; padding:0; background:transparent; box-shadow:none; transform:none;
  }
  .kt-hero-a__visual-photo img{ object-position:center 25%; }

  /* Pozostałe sekcje: tablet nie dziedziczy wąskich desktopowych kolumn. */
  .problem__headline{ max-width:none; text-align:left; }
  .wsp-a__header{ grid-template-columns:1fr; gap:24px; }
  .wsp-a__row{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .wsp-a__col{ min-height:300px; padding:120px 28px 28px; }
  .wsp-a__col:nth-child(4){ border-left:0; border-top:1px solid var(--border); }
  .wsp-a__col:nth-child(5){ border-top:1px solid var(--border); }
  .wsp-a__line,.wsp-a__dot{ display:none; }
  .cta-final-b__grid{ grid-template-columns:1fr !important; }
  .cta-final-b__photo-wrap{ order:-1; height:min(65svh,540px); }
  .cta-final-b__photo{ width:min(430px,70%); margin-inline:0; }

  .om-story__spine{ display:none; }
  .om-chapter__grid,.om-chapter--flip .om-chapter__grid{ grid-template-columns:1fr !important; gap:40px; }
  .om-chapter__visual,.om-chapter--flip .om-chapter__visual{ order:1; height:clamp(400px,48vw,560px); }
  .om-chapter__text,.om-chapter--flip .om-chapter__text{ order:2; margin-left:0; }
  .om-chapter--a .om-chapter__visual-block,.om-chapter--motiv .om-chapter__visual-block,
  .om-chapter--b .om-chapter__visual-block,.om-chapter--work .om-chapter__visual-block,
  .om-chapter--c .om-chapter__visual-block{ width:76%; }
  /* Ramki zachowują oryginalne proporcje fotografii: cover wypełnia je bez cięcia. */
  .om-chapter .om-chapter__photo{ height:auto; }
  .om-chapter .om-chapter__photo img{ height:auto; object-fit:cover; }
  .om-chapter--a .om-chapter__visual{ height:clamp(620px,70vw,740px); }
  .om-chapter--a .om-chapter__photo--main{ top:12%; bottom:auto; left:4%; width:48%; }
  .om-chapter--a .om-chapter__photo--second{ top:-3%; bottom:auto; right:7%; width:40%; }
  .om-chapter--motiv .om-chapter__visual{ height:clamp(540px,62vw,650px); }
  .om-chapter--motiv .om-chapter__photo--main{ top:0; bottom:auto; left:0; right:auto; width:55%; }
  .om-chapter--motiv .om-chapter__photo--second{ top:54%; bottom:auto; left:auto; right:5%; width:52%; z-index:4; }
  .om-chapter--b .om-chapter__visual{ height:clamp(660px,76vw,820px); }
  .om-chapter--b .om-chapter__photo--main{ top:0; bottom:auto; left:12%; width:42%; }
  .om-chapter--b .om-chapter__photo--second{ top:25%; bottom:auto; right:3%; width:38%; }
  .om-chapter--work .om-chapter__visual{ height:clamp(620px,70vw,740px); }
  .om-chapter--work .om-chapter__photo--main{ top:16%; bottom:auto; right:4%; width:58%; }
  .om-chapter--work .om-chapter__photo--second{ top:0; bottom:auto; left:0; right:auto; width:31%; z-index:3; }
  .om-chapter--work .om-chapter__photo--third{ top:auto; bottom:0; left:19%; right:auto; width:30%; }
  .om-chapter--c .om-chapter__visual{ height:clamp(600px,70vw,740px); }
  .om-chapter--c .om-chapter__photo--main{ top:20%; bottom:auto; left:4%; width:45%; }
  .om-chapter--c .om-chapter__photo--second{ top:0; bottom:auto; right:10%; width:40%; }
  .om-approach__grid{ grid-template-columns:1fr; }

  .wz-topics-a__grid,.wz-partner-a__grid,.wz-price-b__grid{ grid-template-columns:1fr !important; }
  .wz-topics-a__headline{ max-width:22ch !important; white-space:normal !important; overflow-wrap:normal; }
  .wz-topics-a__visual{ height:clamp(340px,42vw,500px); max-width:650px; margin-bottom:48px; }
  .wz-topics-a__visual-block{ top:14%; height:72%; }
  .wz-topics-list{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .wz-steps-a__list{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; grid-template-rows:none; gap:16px; }
  .wz-steps-a__step,.wz-steps-a__step--top,.wz-steps-a__step--bottom{
    grid-column:auto !important; grid-row:auto !important; min-height:190px; margin-top:0;
    padding:64px 24px 24px; box-shadow:none; transform:none;
  }
  .wz-steps-a__num{ top:18px; left:24px; font-size:3rem; }
  .wz-partner-a__headline{ max-width:24ch; font-size:clamp(2.75rem,5vw,4rem); }
  .wz-steps-a__cta .btn{ width:auto; }

  .compare__grid{ grid-template-columns:minmax(0,1fr) !important; gap:16px; }
  .compare__grid>*:last-child{ grid-column:auto; }
  .offer-card,.offer-card--main{ margin:0; border:1px solid var(--border); }
  .preview__stage{ height:auto; min-height:0; display:flex; flex-direction:column; align-items:center; gap:16px; padding:20px; }
  .preview__rail{ display:none; }
  .preview__main{ width:min(100%,430px); height:auto; max-height:none; aspect-ratio:210/297; touch-action:pan-y; user-select:none; }
  .preview__main img{ -webkit-user-drag:none; user-select:none; }
  .preview__mobile-nav{ position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between; width:min(100%,430px); }
  .preview__arrow{ display:grid; place-items:center; width:48px; height:48px; padding:0; border:1px solid rgba(244,241,234,.5); background:transparent; color:var(--cream-on-dark); cursor:pointer; }
  .preview__arrow svg{ width:24px; height:24px; }
  .preview__count{ font-size:.75rem; letter-spacing:.12em; color:var(--cream-on-dark); }
  .preview__swipe-hint{ position:relative; z-index:2; display:block; margin:0; text-align:center; font-size:.72rem; line-height:1.45; color:rgba(244,241,234,.78); }
  .offer-card li{ font-size:max(13px,.82rem); line-height:1.5; }
  .offer-card .btn,.hero .btn,.compare .text-link{ font-size:12px; }
  .process__scope-item,.process__fit li{ font-size:max(13px,.81rem); }

  .kt-steps-a__row{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .kt-steps-a__title{ font-size:clamp(1.5rem,2.5vw,1.85rem); }
  .kt-faq-a__grid,.kt-lead-b{ grid-template-columns:1fr !important; }
  .kt-faq-a__visual-photo{ left:12% !important; right:auto !important; width:68%; max-width:520px; }
  .kt-lead-b__form-wrap{ padding:56px var(--page-pad); }

  #ktB-blocker::placeholder,#wzA-date::placeholder{ font-size:13px; }

  .btn:not(.site-nav__cta-btn),.btn-link,.text-link{ margin-inline:0; }
  .site-footer__bottom a,.site-footer__bottom button,.site-footer__nav a,
  .site-footer__contact a,.text-link,.btn-link{ display:inline-flex; align-items:center; min-height:44px; }
  .site-footer__bottom a,.site-footer__bottom button{ padding-block:10px; }
  .opinions button,.opinions a{ min-width:44px; min-height:44px; }
  .lead-magnet button{ font-size:12px; }
}

@media (min-width:768px) and (max-width:900px){
  /* Węższy tablet: jeden czytelny słupek zamiast ciasnych siatek. */
  .wsp-a__row,.wz-steps-a__list,.wz-topics-list{ grid-template-columns:1fr !important; }
  .wsp-a__col{ min-height:0; padding:24px 24px 24px 90px; border-left:0; border-top:1px solid var(--border); }
  .wsp-a__num{ top:18px; left:10px; font-size:3rem; }
  .wz-steps-a__step,.wz-steps-a__step--top,.wz-steps-a__step--bottom{ min-height:110px; padding:28px 24px 24px 100px; }
  .wz-steps-a__num{ top:24px; }
  .hero-blaed .hero-blaed__headline{ font-size:clamp(3.2rem,7.2vw,4rem) !important; }
}

@media (min-width:901px) and (max-width:1179px){
  /* Piąty krok zamyka dwukolumnową sekwencję na jej osi. */
  .wz-steps-a__step:nth-child(5){
    grid-column:1 / -1 !important;
    justify-self:center;
    width:calc((100% - 16px) / 2);
  }
}

@media (min-width:768px) and (max-width:1179px) and (max-height:680px){
  /* Tablet w poziomie: treść może wydłużyć kadr, niczego nie ucina 100svh. */
  .hero-blaed,.om-hero,.wz-hero-a,.kt-hero-a,.hero{ grid-template-rows:minmax(720px,auto); }
  .hero-blaed__right,.om-hero__right,.wz-hero-a__visual,.kt-hero-a__visual,.hero__media{ min-height:720px !important; }
}

@media (min-width:1180px) and (max-width:1439px){
  /* Na wąskim laptopie asymetryczne rozdziały nadal nachodziły na tekst.
     Utrzymujemy tu bezpieczną, editorialową kolumnę aż do 1440 px. */
  .om-chapter__grid,.om-chapter--flip .om-chapter__grid{ grid-template-columns:1fr; gap:48px; }
  .om-chapter__visual,.om-chapter--flip .om-chapter__visual{ order:1; height:560px; }
  .om-chapter__text,.om-chapter--flip .om-chapter__text{ order:2; margin-left:0; }
  .om-chapter--a .om-chapter__visual-block,.om-chapter--motiv .om-chapter__visual-block,
  .om-chapter--b .om-chapter__visual-block,.om-chapter--work .om-chapter__visual-block,
  .om-chapter--c .om-chapter__visual-block{ width:76%; }
  .om-chapter--a .om-chapter__photo--main{ top:auto; bottom:0; left:4%; width:60%; height:80%; }
  .om-chapter--motiv .om-chapter__photo--second{ top:auto; bottom:0; left:0; right:auto; width:40%; height:44%; }
  .om-chapter--b .om-chapter__photo--main{ top:0; bottom:auto; left:4%; width:60%; height:80%; }
}

/* 8.3 (24.10.2026): w jednej kolumnie zdjęcie nie może wchodzić na opis sekcji.
   Kontakt „Ważne informacje”: to samo przesunięcie co na telefonie (03.10.2026) —
   przy -45px ramka zachodziła na ostatnią linię opisu o 3–13 px w całym paśmie 768–1180. */
@media (min-width:768px) and (max-width:1180px){
  .kt-faq-a__visual-photo{ top:-25px; }
}
/* Warsztaty „Wiedza…”: ramka 390×483 px jest wyśrodkowana w pionie w bloku 340–416 px,
   więc wystawała 33–71 px nad blok i zasłaniała opis; przy 450 px wystaje ≤16 px. */
@media (min-width:768px) and (max-width:1023px){
  .wz-topics-a__visual{ height:450px; }
}

/* 8.3 (24.10.2026, decyzja: skrócić): telefon poziomo łapał regułę dla niskich tabletów
   (wiersze siatki ≥720 px) — na stronie głównej pusty wiersz taśmy 720 px, potem ilustracja
   720 px, a nagłówek dopiero ok. 1200 px w dół. Teraz taśma ma swoją wysokość, a ilustracja
   z nagłówkiem i przyciskami zajmuje mniej więcej jeden ekran, jak na telefonie w pionie. */
@media (min-width:768px) and (max-width:1179px) and (max-height:500px){
  .hero-blaed{ grid-template-rows:auto auto; }
  .hero-blaed__right{ min-height:max(360px, calc(100svh - 112px)) !important; }
}

/* mdm-complianz */
/* ============================================================
   Baner zgody Complianz (krok 6.7) w wyglądzie projektu 1.13
   (variants/cookies.css, wersja zwarta 23.10.2026): karta 400 px
   wyśrodkowana przy dolnej krawędzi, kwadratowe rogi, bordowa linia u góry,
   nagłówek Instrument Serif, odmowa i zgoda o tej samej wadze.
   Selektory z #cmplz-cookiebanner-container, żeby wygrać z arkuszem
   generowanym przez Complianz bez !important.
   ============================================================ */
#cmplz-cookiebanner-container .cmplz-cookiebanner{
  left:50%;
  right:auto;
  top:auto;
  bottom:24px;
  translate:-50% 0;
  transform:none;
  width:min(400px, calc(100vw - 2 * var(--page-pad)));
  max-height:calc(100dvh - 48px);
  margin:0;
  padding:26px 26px 22px;
  display:grid;
  grid-template-columns:minmax(0, 1fr);
  gap:16px;
  background:var(--canvas);
  border:0;
  border-top:3px solid var(--burgundy);
  border-radius:0;
  box-shadow:0 18px 48px rgba(23,18,15,.18), 0 2px 6px rgba(23,18,15,.06);
  color:var(--ink);
  font-family:var(--font-sans);
}
/* Nie nadpisuj stanu zamknięcia ustawianego przez Complianz po zapisaniu decyzji. */
#cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-dismissed{ display:none; }
#cmplz-cookiebanner-container .cmplz-cookiebanner > *{ grid-column:1 / -1; }
#cmplz-cookiebanner-container .cmplz-divider,
#cmplz-cookiebanner-container .cmplz-logo,
#cmplz-cookiebanner-container .cmplz-close{ display:none; }

/* nagłówek i treść */
#cmplz-cookiebanner-container .cmplz-header{ display:block; text-align:left; }
#cmplz-cookiebanner-container .cmplz-title{
  display:block;
  justify-self:start;
  margin:0;
  text-align:left;
  color:var(--burgundy);
  font-family:var(--font-display);
  font-size:1.9rem;
  font-weight:400;
  line-height:1.05;
  letter-spacing:-.01em;
}
#cmplz-cookiebanner-container .cmplz-body{ display:grid; gap:4px; width:100%; min-width:0; max-height:none; overflow:visible; }
#cmplz-cookiebanner-container .cmplz-message{
  width:auto;
  max-width:100%;
  margin:0;
  color:var(--ink);
  font-size:.8125rem;
  line-height:1.6;
}

/* kategorie (po „Wybierz ustawienia”) */
#cmplz-cookiebanner-container .cmplz-categories{ margin-top:10px; border-top:1px solid var(--border); }
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category{
  margin:0;
  padding:0;
  background:none;
  border-radius:0;
  border-bottom:1px solid var(--border);
}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-category-header{
  grid-template-columns:1fr auto;
  gap:16px;
  padding:14px 0 4px;
}
#cmplz-cookiebanner-container .cmplz-category-title{
  color:var(--ink);
  font-size:.8125rem;
  font-weight:600;
}
#cmplz-cookiebanner-container .cmplz-always-active{
  color:var(--burgundy);
  font-size:.6875rem;
  font-weight:600;
}
#cmplz-cookiebanner-container .cmplz-always-active .cmplz-banner-checkbox{ display:none; }
/* Opisy kategorii widoczne od razu (jak w projekcie), bez rozwijania strzałką. */
#cmplz-cookiebanner-container .cmplz-category-toggle{ display:none; }
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-description{
  display:block;
  padding:0 0 14px;
  color:var(--muted);
  font-size:.75rem;
  line-height:1.5;
}
#cmplz-cookiebanner-container .cmplz-description-statistics-anonymous{ display:none; }
/* Zwykły kwadratowy checkbox zamiast suwaka Complianz. */
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox{
  position:static;
  width:20px;
  height:20px;
  margin:0;
  opacity:1;
  appearance:auto;
  accent-color:var(--burgundy);
  filter:none;
  cursor:pointer;
}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  overflow:hidden;
  clip:rect(0 0 0 0);
}
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label::before,
#cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label::after{ display:none; }

/* przyciski: Odrzuć | Akceptuj, pod spodem „Wybierz ustawienia” jako link */
#cmplz-cookiebanner-container .cmplz-buttons{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:8px;
}
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn{
  min-height:46px;
  width:100%;
  margin:0;
  padding:10px 12px;
  border:1px solid var(--burgundy);
  border-radius:0;
  background:var(--burgundy);
  color:var(--cream-on-dark);
  font-family:var(--font-sans);
  font-size:.6875rem;
  font-weight:600;
  line-height:1.3;
  letter-spacing:.06em;
  text-transform:uppercase;
  white-space:normal;
  transition:background-color .2s var(--ease-editorial), color .2s var(--ease-editorial);
}
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn:hover{ background:var(--canvas); color:var(--burgundy); }
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-deny{ order:1; }
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-accept{ order:2; }
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-save-preferences{ order:3; grid-column:1 / -1; }
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-view-preferences{
  order:4;
  grid-column:1 / -1;
  justify-self:start;
  width:auto;
  min-height:24px;
  padding:0;
  border:0;
  background:none;
  color:var(--burgundy);
  text-decoration:underline;
  text-underline-offset:4px;
}
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-view-preferences::after{ content:" +"; display:inline-block; margin-left:6px; text-decoration:none; }
#cmplz-cookiebanner-container .cmplz-buttons .cmplz-view-preferences:hover{ background:none; color:var(--ink); }

/* linki do dokumentów */
#cmplz-cookiebanner-container .cmplz-documents{ display:flex; justify-content:flex-start; }
#cmplz-cookiebanner-container .cmplz-documents ul{ display:flex; flex-wrap:wrap; gap:6px 18px; justify-content:flex-start; margin:0; padding:0; }
#cmplz-cookiebanner-container .cmplz-links .cmplz-link{
  color:var(--burgundy);
  font-size:.6875rem;
  font-weight:600;
  letter-spacing:.04em;
  text-decoration:underline;
  text-underline-offset:4px;
}
#cmplz-cookiebanner-container .cmplz-links .cmplz-link:hover{ color:var(--ink); }

#cmplz-cookiebanner-container .cmplz-cookiebanner :focus-visible{ outline:2px solid var(--burgundy); outline-offset:3px; }

/* Domyślny pływający przycisk Complianz zastępuje link „Ustawienia cookies” w stopce. */
#cmplz-manage-consent .cmplz-manage-consent{ display:none; }

@media (max-width:767px){
  #cmplz-cookiebanner-container .cmplz-cookiebanner{
    left:50%;
    right:auto;
    bottom:max(12px, env(safe-area-inset-bottom));
    width:calc(100% - 24px);
    max-height:calc(100dvh - 24px);
    gap:14px;
    padding:20px 18px 16px;
  }
  #cmplz-cookiebanner-container .cmplz-title{ font-size:1.6rem; }
  /* Complianz ustawia tu 1 kolumnę z !important (<= 425 px); etykieta i stan zostają w jednym wierszu. */
  #cmplz-cookiebanner-container .cmplz-categories .cmplz-category .cmplz-category-header{ grid-template-columns:1fr auto !important; }
  #cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn{ min-height:44px; }
}
/* Telefon poziomo (wysokość ≤ 400 px): Complianz pomniejsza tu baner przez zoom 0.6, a przyciski
   i linki przez zoom 0.5 (tekst ok. 6 px, linki 4 px wysokości). Przywracamy naturalną skalę;
   jeśli baner się nie mieści, przewija się w sobie (8.3). */
@media (max-height:400px){
  #cmplz-cookiebanner-container .cmplz-cookiebanner{
    zoom:1;
    height:auto;
    width:min(560px, calc(100% - 24px));
    max-height:calc(100dvh - 16px);
    bottom:8px;
    overflow-y:auto;
    padding:16px 20px 14px !important;
    gap:10px;
    display:grid;
  }
  #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-header{ max-height:none; margin-bottom:0 !important; }
  #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-body{ margin-top:0 !important; }
  #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons{ gap:10px !important; }
  #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons .cmplz-btn{ zoom:1 !important; height:auto !important; min-height:44px !important; padding:10px 14px !important; font-size:.6875rem !important; line-height:1.3 !important; white-space:normal !important; }
  #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons .cmplz-view-preferences{ padding-inline:0 !important; justify-self:start; }
  #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-documents,
  #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-information{ zoom:1 !important; }
  #cmplz-cookiebanner-container .cmplz-title{ font-size:1.4rem; }
}
@media (prefers-reduced-motion:reduce){
  #cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn{ transition:none; }
}

/* ---------- link w stopce ---------- */
.site-footer__cookie-settings{
  padding:0;
  border:0;
  background:none;
  color:inherit;
  font:inherit;
  letter-spacing:inherit;
  text-decoration:underline;
  text-underline-offset:4px;
  cursor:pointer;
  transition:color .25s ease;
}
.site-footer__cookie-settings:hover{ color:var(--cream-on-dark); }
.site-footer__cookie-settings:focus-visible{ outline:2px solid var(--cream-on-dark); outline-offset:3px; }

/* ---------- polityka cookies z generatora Complianz (page.php) ---------- */
.privacy__layout--single{ grid-template-columns:minmax(0, 760px); }
.privacy--cookies .privacy__content h2{ font-size:clamp(2rem, 3.4vw, 3.2rem); }
.privacy--cookies .privacy__content h3,
.privacy--cookies .privacy__content h4{ margin:32px 0 14px; font:400 1.6rem/1.2 var(--font-display); color:var(--ink); }
.privacy--cookies .privacy__content table{ width:100%; margin:0 0 24px; border-collapse:collapse; font-size:.875rem; }
.privacy--cookies .privacy__content th,
.privacy--cookies .privacy__content td{ padding:10px 12px 10px 0; border-bottom:1px solid var(--border); text-align:left; vertical-align:top; }
.privacy--cookies .privacy__content details{ margin:0 0 12px; border-bottom:1px solid var(--border); }
.privacy--cookies .privacy__content summary{ padding:12px 0; cursor:pointer; font-weight:600; }
/* Sekcja 6 (usługi): nazwa i kategoria w jednej linii, strzałka pokazuje, że wpis się rozwija (9.7c). */
.privacy--cookies #cmplz-cookies-overview details > summary.cmplz-service-header{ list-style:none; display:flex; align-items:baseline; gap:16px; }
.privacy--cookies #cmplz-cookies-overview details > summary.cmplz-service-header::-webkit-details-marker{ display:none; }
.privacy--cookies #cmplz-cookies-overview details > summary.cmplz-service-header::after{
  content:""; flex:none; align-self:center; width:8px; height:8px; margin:0 4px 4px 0;
  border:solid var(--ink); border-width:0 1.5px 1.5px 0; transform:rotate(45deg);
  transition:transform .2s ease;
}
.privacy--cookies #cmplz-cookies-overview details[open] > summary.cmplz-service-header::after{ transform:rotate(-135deg); margin-bottom:-4px; }
.privacy--cookies .privacy__content details.cmplz-service-desc[open]{ padding-bottom:24px; }
.privacy--cookies #cmplz-cookies-overview details > summary.cmplz-service-header h3{ margin:0; flex:1; }
.privacy--cookies #cmplz-cookies-overview .cmplz-service-category{ margin:0; font-size:.875rem; font-weight:600; }
.privacy--cookies #cmplz-cookies-overview .cookies-per-purpose h5{ margin:0; }
@media (prefers-reduced-motion:reduce){ .privacy--cookies #cmplz-cookies-overview details > summary.cmplz-service-header::after{ transition:none; } }
.privacy--cookies .cmplz-manage-consent-container{ margin:0 0 24px; }

/* cmplz-banner-1-optin */
input[type="checkbox"].cmplz-category { width: initial; -webkit-appearance: checkbox;}input[type="checkbox"].cmplz-category:checked::before { content: '';}.cmplz-cookiebanner { box-sizing: border-box;}:root { --cmplz_banner_width: 400px; --cmplz_banner_background_color: #F7F5F0; --cmplz_banner_border_color: #5C0017; --cmplz_banner_border_width: 0px 0px 0px 0px ; --cmplz_banner_border_radius: 0px 0px 0px 0px; --cmplz_banner_margin: 10px; --cmplz_categories-height: 110px; --cmplz_title_font_size: 15px; --cmplz_text_line_height: calc(var(--cmplz_text_font_size) * 1.5); --cmplz_text_color: #17120F; --cmplz_hyperlink_color: #5C0017; --cmplz_text_font_size: 12px; --cmplz_link_font_size: 12px; --cmplz_category_body_font_size: 12px; --cmplz_button_accept_background_color: #5C0017; --cmplz_button_accept_border_color: #5C0017; --cmplz_button_accept_text_color: #F4F1EA; --cmplz_button_deny_background_color: #5C0017; --cmplz_button_deny_border_color: #5C0017; --cmplz_button_deny_text_color: #F4F1EA; --cmplz_button_settings_background_color: #F7F5F0; --cmplz_button_settings_border_color: #F7F5F0; --cmplz_button_settings_text_color: #5C0017; --cmplz_button_border_radius: 0px 0px 0px 0px; --cmplz_button_font_size: 15px; --cmplz_category_header_always_active_color: green; --cmplz_category_header_title_font_size: 14px; --cmplz_category_header_active_font_size: 12px; --cmplz-manage-consent-height: 50px; --cmplz-manage-consent-offset: -35px; --cmplz_slider_active_color: #5C0017; --cmplz_slider_inactive_color: #726B63; --cmplz_slider_bullet_color: #ffffff;}body.cmplz-banner-active *:not(.cmplz-cookiebanner):not(.cmplz-cookiebanner *) { pointer-events: none !important; user-select: none !important;}.cmplz-cookiebanner * { pointer-events: auto !important; user-select: auto !important;}#cmplz-manage-consent .cmplz-manage-consent { margin: unset; z-index: 9998; color: var(--cmplz_text_color); background-color: var(--cmplz_banner_background_color); border-style: solid; border-color: var(--cmplz_banner_border_color); border-width: var(--cmplz_banner_border_width); border-radius: var(--cmplz_banner_border_radius); border-bottom-left-radius: 0; border-bottom-right-radius: 0; line-height: initial; position: fixed; bottom: var(--cmplz-manage-consent-offset); min-width: 100px; height: var(--cmplz-manage-consent-height); right: 40px; padding: 15px; cursor: pointer; animation: mc_slideOut 0.5s forwards;}#cmplz-manage-consent .cmplz-manage-consent:active { outline: none; border: none;}#cmplz-manage-consent .cmplz-manage-consent.cmplz-dismissed { display: none;}#cmplz-manage-consent .cmplz-manage-consent:hover,#cmplz-manage-consent .cmplz-manage-consent:focus { animation: mc_slideIn 0.5s forwards; animation-delay: 0;}@-webkit-keyframes mc_slideIn { 100% { bottom: 0; }}@keyframes mc_slideIn { 100% { bottom: 0; }}@-webkit-keyframes mc_slideOut { 100% { bottom: var(--cmplz-manage-consent-offset); }}@keyframes mc_slideOut { 100% { bottom: var(--cmplz-manage-consent-offset); }}@media (max-width: 425px) { .cmplz-cookiebanner .cmplz-header .cmplz-title { display: none; }}.cmplz-cookiebanner { max-height: calc(100vh - 20px); overflow-y: auto; position: fixed; height: auto; left: 50%; top: 50%; -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); grid-template-rows: minmax(0, 1fr); z-index: 99999; background: var(--cmplz_banner_background_color);}.cmplz-cookiebanner a { transition: initial;}.cmplz-cookiebanner .cmplz-buttons a.cmplz-btn.tcf { display: none;}.cmplz-cookiebanner.cmplz-dismissed { display: none;}.cmplz-cookiebanner .cmplz-body { width: 100%; grid-column: span 3; overflow-y: auto; overflow-x: hidden; max-height: 55vh;}.cmplz-cookiebanner .cmplz-body::-webkit-scrollbar-track { border-radius: 10px; -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0); background-color: transparent;}.cmplz-cookiebanner .cmplz-body::-webkit-scrollbar { width: 5px; background-color: transparent;}.cmplz-cookiebanner .cmplz-body::-webkit-scrollbar-thumb { background-color: var(--cmplz_button_accept_background_color); border-radius: 10px;}@media (min-width: 350px) { .cmplz-cookiebanner .cmplz-body { min-width: 300px; }}@media (max-height: 400px) { .cmplz-cookiebanner { height: calc(100vh - 20px); display: flex; flex-direction: column; overflow: hidden; gap: 1px; grid-row-gap: 1px; padding: 7px 12px !important; zoom: 0.6; } .cmplz-cookiebanner .cmplz-body { flex: 1; min-height: 0; overflow-y: auto; max-height: none; margin-top: 15px !important; } .cmplz-cookiebanner .cmplz-header, .cmplz-cookiebanner .cmplz-divider, .cmplz-cookiebanner .cmplz-links, .cmplz-cookiebanner .cmplz-buttons, .cmplz-cookiebanner .cmplz-documents { flex-shrink: 0; } .cmplz-cookiebanner .cmplz-header { margin-bottom: 15px !important; max-height: 10px; } .cmplz-close { zoom: 0.6 !important; } .cmplz-cookiebanner .cmplz-buttons { gap: 1px !important; } .cmplz-cookiebanner .cmplz-buttons .cmplz-btn { height: 15vh !important; min-height: unset !important; padding: 0 !important; white-space: nowrap !important; font-size: 1.1rem !important; line-height: 14px !important; zoom: 0.5 !important; } .cmplz-cookiebanner .cmplz-documents, .cmplz-cookiebanner .cmplz-information { zoom: 0.5 !important; }}@media (max-height: 400px) and (max-width: 768px) { .cmplz-cookiebanner { gap: 1px; }}.cmplz-cookiebanner { border-style: solid; border-color: var(--cmplz_banner_border_color); border-width: var(--cmplz_banner_border_width); border-radius: var(--cmplz_banner_border_radius); padding: 15px 20px; display: grid; grid-gap: 10px;}.cmplz-cookiebanner .cmplz-divider { margin-left: -20px; margin-right: -20px;}.cmplz-cookiebanner .cmplz-header { grid-template-columns: 100px 1fr 100px; align-items: center; display: grid; grid-column: span 3;}@media (max-width: 399px) { .cmplz-cookiebanner .cmplz-header { grid-template-columns: auto 1fr auto; }}.cmplz-cookiebanner .cmplz-logo svg { max-height: 35px; width: inherit;}.cmplz-cookiebanner .cmplz-logo img { max-height: 40px; width: inherit;}.cmplz-cookiebanner .cmplz-title { justify-self: center; grid-column-start: 2; font-size: var(--cmplz_title_font_size); color: var(--cmplz_text_color); font-weight: 500;}.cmplz-cookiebanner .cmplz-close { line-height: 20px; justify-self: end; grid-column-start: 3; font-size: 20px; cursor: pointer; width: 20px; height: 20px; color: var(--cmplz_text_color);}.cmplz-cookiebanner .cmplz-close svg { width: 20px; height: 20px;}.cmplz-cookiebanner .cmplz-close:hover { text-decoration: none; line-height: initial; font-size: 18px;}.cmplz-cookiebanner .cmplz-message { word-wrap: break-word; font-size: var(--cmplz_text_font_size); line-height: var(--cmplz_text_line_height); color: var(--cmplz_text_color); margin-bottom: 5px;}.cmplz-cookiebanner .cmplz-message a { color: var(--cmplz_hyperlink_color);}.cmplz-cookiebanner .cmplz-message,.cmplz-cookiebanner .cmplz-categories,.cmplz-cookiebanner .cmplz-links,.cmplz-cookiebanner .cmplz-buttons,.cmplz-cookiebanner .cmplz-divider { grid-column: span 3;}.cmplz-cookiebanner .cmplz-categories.cmplz-tcf .cmplz-category .cmplz-category-header { grid-template-columns: 1fr auto;}.cmplz-cookiebanner .cmplz-categories .cmplz-category { background-color: rgba(239, 239, 239, 0.5);}.cmplz-cookiebanner .cmplz-categories .cmplz-category:not(:last-child) { margin-bottom: 10px;}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-category-header { display: grid; grid-template-columns: 1fr auto 15px; grid-template-rows: minmax(0, 1fr); align-items: center; grid-gap: 10px; padding: 10px;}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-category-title { font-weight: 500; grid-column-start: 1; justify-self: start; font-size: var(--cmplz_category_header_title_font_size); color: var(--cmplz_text_color); margin: 0;}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-always-active { font-size: var(--cmplz_category_header_active_font_size); font-weight: 500; color: var(--cmplz_category_header_always_active_color);}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-always-active label { display: none;}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-banner-checkbox { display: flex; align-items: center; margin: 0;}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-banner-checkbox input[data-category=cmplz_functional] { display: none;}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-category-toggle { background: none; border: none; padding: 0; margin: 0; cursor: pointer; grid-column-start: 3; display: flex; align-items: center; justify-content: center; color: inherit;}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-icon.cmplz-open { cursor: pointer; content: ''; transform: rotate(0deg); -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; background-size: cover; height: 18px; width: 18px;}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-description { font-size: var(--cmplz_category_body_font_size); color: var(--cmplz_text_color); margin: 0; max-width: 100%; padding: 10px;}@media (max-width: 425px) { .cmplz-cookiebanner .cmplz-category .cmplz-category-header { grid-template-columns: 1fr!important; }}@media (max-width: 425px) { .cmplz-cookiebanner .cmplz-message { margin-right: 5px; }}.cmplz-cookiebanner .cmplz-buttons { display: flex; gap: var(--cmplz_banner_margin);}.cmplz-cookiebanner .cmplz-buttons .cmplz-btn { min-height: 45px; padding: 10px; margin: initial; width: 100%; white-space: nowrap; border-radius: var(--cmplz_button_border_radius); cursor: pointer; font-size: var(--cmplz_button_font_size); font-weight: 500; text-decoration: none; line-height: 20px; text-align: center; flex: initial;}.cmplz-cookiebanner .cmplz-buttons .cmplz-btn:hover { text-decoration: none;}.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-accept { background-color: var(--cmplz_button_accept_background_color); border: 1px solid var(--cmplz_button_accept_border_color); color: var(--cmplz_button_accept_text_color);}.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-deny { background-color: var(--cmplz_button_deny_background_color); border: 1px solid var(--cmplz_button_deny_border_color); color: var(--cmplz_button_deny_text_color);}.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-view-preferences { background-color: var(--cmplz_button_settings_background_color); border: 1px solid var(--cmplz_button_settings_border_color); color: var(--cmplz_button_settings_text_color);}.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-save-preferences { background-color: var(--cmplz_button_settings_background_color); border: 1px solid var(--cmplz_button_settings_border_color); color: var(--cmplz_button_settings_text_color);}.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-manage-options { background-color: var(--cmplz_button_settings_background_color); border: 1px solid var(--cmplz_button_settings_border_color); color: var(--cmplz_button_settings_text_color);}.cmplz-cookiebanner .cmplz-buttons a.cmplz-btn { display: flex; align-items: center; justify-content: center; padding: initial;}@media (max-width: 425px) { .cmplz-cookiebanner .cmplz-links.cmplz-information { display: initial; text-align: center; }}.cmplz-cookiebanner .cmplz-links { display: flex; gap: var(--cmplz_banner_margin);}.cmplz-cookiebanner .cmplz-links.cmplz-information { justify-content: space-between;}.cmplz-cookiebanner .cmplz-links.cmplz-documents { justify-content: center;}.cmplz-cookiebanner .cmplz-links .cmplz-link { color: var(--cmplz_hyperlink_color); font-size: var(--cmplz_link_font_size); text-decoration: underline; margin: 0;}.cmplz-cookiebanner .cmplz-links .cmplz-link.cmplz-read-more-purposes { display: none;}.cmplz-cookiebanner .cmplz-links ul { margin: 0; padding: 0; list-style: none; display: flex; gap: var(--cmplz_banner_margin); justify-content: center;}.cmplz-categories .cmplz-category .cmplz-description-statistics-anonymous { display: none;}.cmplz-categories .cmplz-category .cmplz-description-statistics { display: block;}.cmplz-categories .cmplz-category .cmplz-category-header .cmplz-category-toggle { background: none; border: none; padding: 0; margin: 0; cursor: pointer; grid-column-start: 3; display: flex; align-items: center; justify-content: center; color: inherit;}.cmplz-categories .cmplz-category .cmplz-category-toggle[aria-expanded="true"] .cmplz-icon.cmplz-open { transform: rotate(180deg);}.cmplz-cookiebanner { top: initial; left: 10px; bottom: 10px; transform: initial;}@media (min-width: 768px) { .cmplz-cookiebanner { min-width: var(--cmplz_banner_width); max-width: 100%; display: grid; grid-row-gap: 10px; }}@media (max-width: 768px) { .cmplz-cookiebanner { left: initial; right: initial; bottom: 0; width: 100%; } .cmplz-cookiebanner .cmplz-buttons { flex-direction: column; }}@media (min-width: 768px) { .cmplz-message, .cmplz-categories { width: calc(var(--cmplz_banner_width) - 42px); }}#cmplz-manage-consent .cmplz-manage-consent { left: 40px; right: initial;}.cmplz-cookiebanner .cmplz-categories,.cmplz-cookiebanner .cmplz-save-preferences,.cmplz-cookiebanner .cmplz-link.cmplz-manage-options,.cmplz-cookiebanner .cmplz-manage-vendors,.cmplz-cookiebanner .cmplz-read-more,.cmplz-cookiebanner .cmplz-btn.cmplz-manage-options { display: none;}.cmplz-cookiebanner .cmplz-categories.cmplz-fade-in { animation: fadeIn 1s; -webkit-animation: fadeIn 1s; -moz-animation: fadeIn 1s; -o-animation: fadeIn 1s; -ms-animation: fadeIn 1s; display: block;}@keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; }}@-moz-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; }}@-webkit-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; }}@-o-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; }}@-ms-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; }}.cmplz-cookiebanner .cmplz-links.cmplz-information { display: none;}.cmplz-cookiebanner .cmplz-preferences,.cmplz-manage-consent-container .cmplz-preferences { display: none;}.cmplz-cookiebanner .cmplz-marketing:not(.cmplz-tcf),.cmplz-manage-consent-container .cmplz-marketing:not(.cmplz-tcf) { display: none;}@media (max-width: 768px) { #cmplz-manage-consent .cmplz-manage-consent { display: none; }}.cmplz-logo { display: none !important;}.cmplz-cookiebanner .cmplz-close { display: none;}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-banner-checkbox { position: relative;}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox { opacity: 0; margin: 0; margin-top: -10px; cursor: pointer; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; position: absolute; z-index: 1; top: 0px; left: 0px; width: 40px; height: 20px;}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox:focus + .cmplz-label:before { box-shadow: 0 0 0 2px #245fcc;}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox:checked + .cmplz-label::before { display: block; background-color: var(--cmplz_slider_active_color); content: ""; padding-left: 6px;}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox:checked + .cmplz-label:after { left: 14px;}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label { position: relative; padding-left: 30px; margin: 0;}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label:before,.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label:after { box-sizing: border-box; position: absolute; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; transition: background-color 0.3s, left 0.3s;}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label:before { display: block; content: ""; color: #fff; box-sizing: border-box; font-family: 'FontAwesome', sans-serif; padding-left: 23px; font-size: 12px; line-height: 20px; background-color: var(--cmplz_slider_inactive_color); left: 0px; top: -7px; height: 15px; width: 28px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label:after { display: block; content: ""; letter-spacing: 20px; background: var(--cmplz_slider_bullet_color); left: 4px; top: -5px; height: 11px; width: 11px;}