/*
Theme Name: Diadush
Theme URI: https://diadush.com
Description: Motyw gabinetu psychoterapii Diadush. Potomny wobec Twenty Twenty-Five.
             Odtwarza wyglad poprzedniej strony (ThemeForest "Simple") na wspolczesnym
             stacku blokowym, bez ani jednej linijki kodu ze starego serwera.
Author: przebudowa 2026-08
Template: twentytwentyfive
Version: 1.2.0
Requires PHP: 8.1
License: GPLv2 or later
Text Domain: diadush
*/

/* ==========================================================================
   Odwzorowanie wygladu poprzedniej strony.
   Wszystkie wartosci ZMIERZONE na zywym https://diadush.com 2026-08-03/04
   (getComputedStyle + reguly zrodlowe main.css / bootstrap.css / js_composer).
   Zadna linijka nie pochodzi ze starego serwera - to zapis pomiaru, nie kopia.
   ========================================================================== */

:root {
	--d-kontener:   1140px;   /* 1140 tresci + 2x15 rynny = 1170 kontenera (Bootstrap 3) */
	--d-tekst:      #333;     /* body (bootstrap.css)          */
	--d-akapit:     #757575;  /* p    (main.css l.107)         */
	--d-naglowek:   #454545;  /* h1-h6 (main.css l.?)          */
	/* Blekit akcentu. Oryginal mial #3498db = 3.16:1 na bieli (WCAG AA wymaga
	   4.5:1 dla tekstu 18px/w400 - logo, przelacznik jezykow, linki w tresci,
	   bialy tekst na przyciskach). #1f7ab8 to najjasniejszy odcien tej samej
	   rodziny, ktory przechodzi: ZMIERZONE 4.66:1. Swiadome odstepstwo od
	   oryginalu - powrot = podmiana tych dwoch wartosci tu i w theme.json. */
	--d-akcent:     #1f7ab8;  /* logo, linki, hover menu  4.66:1 na bieli */
	--d-akcent-2:   #17608f;  /* hover                    6.81:1 na bieli */
	/* Na ciemnym tle (stopka #2f3539) zaleznosc jest odwrotna - blekit trzeba
	   ROZJASNIC. #3498db dawal tam 3.94:1; #5cb3ec daje 5.40:1. */
	--d-akcent-jasny: #5cb3ec;
	--d-grafit:     #2f3539;  /* body + stopka (main.css 177)  */
	--d-jasny:      #eeeeee;  /* sekcja Psychoterapia          */
	--d-stal:       #38545f;  /* sekcja Metody Pracy           */
	--d-stal-2:     #3f6b82;  /* sekcja Umow Wizyte            */
	--d-ozdoba:     #34b1c4;  /* ozdobnik pod naglowkiem       */
	--d-turkus:     #00c1cf;  /* przycisk turkusowy - jak oryginal */
	/* Oryginal przyciemnial turkus w hoverze (#00a4b0). Odkad tekst przycisku
	   jest grafitowy (patrz sekcja 4), przyciemnienie TLA obniza kontrast
	   (3.94:1); rozjasnienie go podnosi - stad #26cfdc = 6.28:1. */
	--d-turkus-2:   #26cfdc;
	--d-hero-1:     #3694d2;  /* mesh_ambient oryginalu        */
	--d-hero-2:     #2980b9;  /* mesh_diffuse oryginalu        */
	--d-naglowek-h: 90px;     /* zmierzona wysokosc #wt_header */
}

/* ==========================================================================
   1. TYPOGRAFIA BAZOWA
   Twenty Twenty-Five narzuca body{font-weight:300; letter-spacing:-0.1px}
   i line-height 1.43 - oryginal mial wage 400 i zero letter-spacingu.
   line-height MUSI byc bezwymiarowy: 20px dziedziczylo sie doslownie
   na logo (26px w 20px boksie) i na menu.
   ========================================================================== */

html { background: var(--d-grafit); }   /* main.css l.177 - "same color as footer" */

body {
	font-size: 14px;
	line-height: 1.4285714;
	font-weight: 400;
	letter-spacing: normal;
	color: var(--d-tekst);
}

h1, h2, h3, h4, h5, h6 {
	font-family: Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: var(--d-naglowek);
	line-height: 1.1;
	letter-spacing: normal;
	text-transform: none;
	margin-block: 0 20px;
}
h1 { font-size: 32px; font-weight: 300; }
h2 { font-size: 28px; font-weight: 300; }
h3 { font-size: 24px; font-weight: 700; }
h4 { font-size: 18px; font-weight: 700; }
h5 { font-size: 14px; font-weight: 700; line-height: 30px; }
h6 { font-size: 12px; font-weight: 300; }

/* akapity - main.css l.107: p{16px/24px, waga 300, #757575} */
.wp-block-post-content p,
.entry-content p {
	font-size: 16px;
	line-height: 24px;
	font-weight: 300;
	color: var(--d-akapit);
}

/* LISTY to NIE akapity. main.css l.107 dotyczy wylacznie `p` - `li` w oryginale
   dziedziczy po body, czyli 14px/20px/#333/waga 400, plus bootstrapowe
   `li{margin-bottom:4px}`. ZMIERZONE na diadush.com `#terapia-indywidualna li`:
   fontSize 14px, lineHeight 20px, color rgb(51,51,51), marginBottom 4px.
   Wczesniej `li` bralo regule akapitu (16/24/#757575/waga 300) i wyliczenie
   objawow przestawalo sie odcinac od tekstu wokol.
   Selektor zawezony do tresci - nawigacja i przelacznik jezykow siedza
   w <header>, poza .wp-block-post-content, wiec ich nie dotyka. */
.wp-block-post-content li,
.entry-content li {
	font-size: 14px;
	line-height: 20px;
	font-weight: 400;
	color: var(--d-tekst);
	margin-bottom: 4px;
}
.wp-block-post-content p,
.wp-block-post-content ul,
.wp-block-post-content ol,
.wp-block-post-content blockquote,
.wp-block-post-content table { margin-block: 0 20px; }

.wp-block-post-content a:where(:not(.wp-element-button)) { color: var(--d-akcent); }
.wp-block-post-content a:where(:not(.wp-element-button)):hover { color: var(--d-akcent-2); }

/* --- szerokosc lamu jak w Bootstrapie 3 oryginalu --- */
.wp-block-group.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.wp-site-blocks > .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: var(--d-kontener);
}

/* kotwice nie moga wjezdzac pod przyklejony naglowek */
html { scroll-behavior: smooth; scroll-padding-top: var(--d-naglowek-h); }

/* ==========================================================================
   2. NAGLOWEK
   #wt_header: 90px, padding 10px 0, tlo #fff, cien 0 0 4px rgba(0,0,0,.2)
   pozycja menu: 16px/#444, padding 0 15px, line-height 70px, hover #3498db
   ========================================================================== */

.wp-site-blocks > header {
	position: sticky; top: 0; z-index: 1030;
	background: #fff;
	box-shadow: 0 0 4px rgba(0, 0, 0, .2);
	border-bottom: none;
	padding-block: 0;                     /* padding niesie grupa wewnetrzna */
}
.wp-site-blocks > header > .wp-block-group { padding-block: 10px; }

/* Jeden rzad. Rdzen WP daje kontenerowi nawigacji display:block;width:100%,
   przez co prawa grupa rozpychala rzad do 1121px i flex sie zawijal -
   naglowek mial 154px zamiast 90px. Stad width:auto + nowrap. */
.d-naglowek__rzad  { flex-wrap: nowrap; align-items: center; min-height: 70px; column-gap: 20px; }
.d-naglowek__prawa { flex-wrap: nowrap; align-items: center; column-gap: 10px; }
.wp-site-blocks > header .wp-block-navigation__responsive-container:not(.is-menu-open) { width: auto; }

/* --- logo tekstowe + podtytul (bootstrap .navbar-brand 18px/20px) --- */
.d-marka { line-height: 1; }
.d-logo  { margin: 0; }
.d-logo__link {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 18px; line-height: 20px; font-weight: 400;
	color: var(--d-akcent); text-decoration: none;
	letter-spacing: normal;
}
.d-logo__link:hover { color: var(--d-akcent-2); }
.d-tagline {
	font-size: 12px; line-height: 17px; font-weight: 400;
	color: #333; margin: 5px 0 0;
}

/* --- menu, poziom 1 ---
   Rdzen ma `.wp-block-navigation .wp-block-navigation-item__content
   .wp-block-navigation-item__content{color:inherit}` (0,3,0), co bije
   `.wp-block-navigation a` (0,1,1). Stad zdublowana klasa ponizej. */
.wp-site-blocks > header .wp-block-navigation { font-size: 16px; font-weight: 400; color: #444; }
.wp-site-blocks > header .wp-block-navigation__container { gap: 0; }
.wp-site-blocks > header .wp-block-navigation__container > li > .wp-block-navigation-item__content.wp-block-navigation-item__content {
	display: block; padding: 0 15px; line-height: 70px;
	font-size: 16px; font-weight: 400; color: #444; text-decoration: none;
}
.wp-site-blocks > header .wp-block-navigation__container > li:hover > .wp-block-navigation-item__content.wp-block-navigation-item__content,
.wp-site-blocks > header .wp-block-navigation .current-menu-item > .wp-block-navigation-item__content.wp-block-navigation-item__content,
.wp-site-blocks > header .wp-block-navigation .current-menu-ancestor > .wp-block-navigation-item__content.wp-block-navigation-item__content {
	color: var(--d-akcent);
}
/* strzalka podmenu ma isc za tekstem, nie rozpychac pozycji */
.wp-site-blocks > header .wp-block-navigation__submenu-icon { padding: 0; margin-left: -8px; }

/* --- menu, poziom 2 (podmenu Oferty) ---
   main.css: ul.sub-menu{width:180px; border-bottom:1px solid #3498db}
             li{background:#fff; border-color:#ddd}
             li a{padding:8px 28px 8px 15px; color:#777; 12px/20px}
             li:hover > a{background:#f6f6f6}  */
/* UWAGA: szerokosci NIE wolno podawac w stanie zamknietym. Rdzen WP trzyma
   zamkniete podmenu jako `width:0;height:0;overflow:hidden`, wiec `width:180px`
   w regule bazowej rozpychalo obszar przewijania dokumentu mimo
   visibility:hidden - ZMIERZONE 15px poziomego przewijania w pasmie 768-789px
   (prawa krawedz podmenu 783px przy viewporcie 768px). Stad 180px wylacznie
   w stanach otwarcia, ktore odwzorowuja selektory rdzenia. */
.wp-site-blocks > header .wp-block-navigation__submenu-container {
	box-sizing: border-box;
	left: 0; top: 100%;
	padding: 0; border: none; border-bottom: 1px solid var(--d-akcent);
	background: transparent; border-radius: 0; box-shadow: none;
}
.wp-site-blocks > header .has-child:hover > .wp-block-navigation__submenu-container,
.wp-site-blocks > header .has-child:focus-within > .wp-block-navigation__submenu-container,
.wp-site-blocks > header .has-child .wp-block-navigation-submenu__toggle[aria-expanded="true"] ~ .wp-block-navigation__submenu-container {
	width: 180px; min-width: 180px;
}
.wp-site-blocks > header .wp-block-navigation__submenu-container > li {
	background: #fff; border: 1px solid #ddd; border-bottom: none;
}
.wp-site-blocks > header .wp-block-navigation__submenu-container > li > .wp-block-navigation-item__content.wp-block-navigation-item__content {
	display: block; padding: 8px 28px 8px 15px;
	font-size: 12px; line-height: 20px; font-weight: 400; color: #777;
}
.wp-site-blocks > header .wp-block-navigation__submenu-container > li:hover > .wp-block-navigation-item__content.wp-block-navigation-item__content {
	background: #f6f6f6; color: #777;
}

/* --- przelacznik jezykow: 16px, padding 5px 10px, flaga 18x12 --- */
.wp-block-group .d-jezyki { margin: 0; }
.d-jezyki-lista { list-style: none; display: flex; gap: 0; margin: 0; padding: 0; align-items: center; }
.d-jezyki-lista li { margin: 0; }
.d-jezyki-lista a {
	display: flex; align-items: center; gap: 6px;
	padding: 5px 10px; font-size: 16px; line-height: 20px;
	color: var(--d-akcent); text-decoration: none;
}
.d-jezyki-lista a:hover { color: var(--d-akcent-2); }
/* Polylang wypisuje flage z inline style="width:16px;height:11px" - inline bije
   arkusz, wiec bez !important flaga ma 16x11 zamiast zmierzonych na oryginale
   18x12 (`.wpml-ls-flag` -> W=18.0 H=12.0). */
.d-jezyki-lista img { width: 18px !important; height: 12px !important; vertical-align: middle; }

/* ==========================================================================
   3. HERO - odwzorowanie #wt_section_home
   main.css: #wt_home_content{padding:160px 0 140px; color:#fff; text-align:center}
   Tlo: wlasny mesh assets/tlo-hero.svg (wygenerowany lokalnie, 64 trojkaty).
   Paleta z probkowania pikseli oryginalu: brzeg #155092, srodek #185daa,
   rozblysk #2490ff; atrybuty generatora: mesh_ambient #3694d2, diffuse #2980b9.
   ========================================================================== */

.d-hero {
	padding-block: 160px 140px;
	text-align: center;
	background-color: #1a63b4;
	background-image:
		radial-gradient(40% 56% at 50% 46%, rgba(46,150,255,.34), rgba(46,150,255,0) 70%),
		radial-gradient(125% 105% at 50% 50%, rgba(12,45,88,0) 46%, rgba(12,45,88,.30) 100%),
		url("assets/tlo-hero.svg");
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
}

/* Rdzen WP daje kazdemu dziecku ukladu constrained `margin-block-start:1.2rem`
   (19.2px). W hero doklejalo sie to do wysokosci spacera 25px i odstep od
   podpisu do przyciskow wynosil ZMIERZONE 45px zamiast 25px jak w oryginale
   (a cale hero 542px zamiast 526px). Rytm hero niesie wylacznie margin-bottom
   poszczegolnych elementow + spacer - tak jak w oryginale. */
.d-hero > * { margin-block-start: 0; }

/* Selektory prefiksowane `.d-hero` (0,2,0) CELOWO: cytat i podpis sa dzis
   akapitem i <cite>, a nie naglowkami, wiec bez tego wygralaby z nimi regula
   akapitu tresci `.wp-block-post-content p` (0,1,1) i cytat spadlby na 16px. */
.d-hero .d-hero__nadtytul { font-size:14px; line-height:15.4px; font-weight:700; color:#fff; margin:0 0 20px; }
.d-hero .d-hero__cytat    { font-size:28px; line-height:30.8px; font-weight:300; color:#fff; margin:0 0 20px; }
/* margin-bottom 0: w oryginale podpis jest ostatnim elementem kolumny tekstu,
   a js_composer zeruje tam dolny margines (`.wpb_wrapper > :last-child`).
   Odstep do przyciskow robi wylacznie spacer 25px. */
.d-hero .d-hero__podpis { font-size:16px; line-height:24px; font-weight:300; color:#fff; margin:0; display:block; }
.d-hero :is(h1,h2,h3,h4,h5,h6,p,cite,blockquote) { color: #fff; }

/* cytat w <blockquote> - element niesie tylko semantyke, zero wlasnego wygladu */
.d-hero__cytat-blok {
	margin: 0 0 20px; padding: 0; border: 0; background: none;
	font-style: normal;
}
.d-hero__cytat-blok > .d-hero__cytat { margin: 0 0 20px; }
.d-hero__cytat-blok cite { font-style: normal; }

.d-hero__przyciski.wp-block-buttons {
	justify-content: center;
	gap: 30px;                    /* rynna Bootstrapa miedzy vc_col-sm-6 */
	margin-top: 0; margin-bottom: 20px;
}

/* ==========================================================================
   4. PRZYCISKI
   js_composer: .vc_btn3-size-sm{font-size:12px; padding:11px 16px}
                .vc_btn3-shape-rounded{border-radius:5px}
                turkus #00C1CF / bialy #FFF z tekstem #666
   ========================================================================== */

/* line-height 1.4 (=16.8px przy 12px), nie 14px: js_composer ma `.vc_btn3{
   line-height:1.4}`, wiec przycisk oryginalu mierzy 11+16.8+11 = 38.8 ~ 39px.
   Przy 14px wychodzilo 36px - ZMIERZONE 3px za nisko. */
.wp-block-button__link {
	font-family: Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 12px; line-height: 1.4; font-weight: 400;
	padding: 11px 16px; border-radius: 5px; border: 0;
	text-decoration: none;
	transition: background-color .2s ease-in-out, color .2s ease-in-out;
}

.d-btn--biala  > .wp-block-button__link { background-color:#fff; color:#666; }
.d-btn--biala  > .wp-block-button__link:hover,
.d-btn--biala  > .wp-block-button__link:focus { background-color:#f0f0f0; color:#5e5e5e; }

/* Tekst grafitowy, nie bialy. Oryginal mial #fff na #00c1cf = ZMIERZONE 2.20:1,
   przy wymaganych 4.5:1 - najgorszy kontrast na calej stronie, i to na glownym
   wezwaniu do dzialania. Grafit na tym samym turkusie daje 5.42:1, wiec KOLOR
   TLA zostaje dokladnie jak w oryginale. Powrot do bieli = jedna wartosc. */
.d-btn--turkus > .wp-block-button__link { background-color:var(--d-turkus); color:var(--d-grafit); }
.d-btn--turkus > .wp-block-button__link:hover,
.d-btn--turkus > .wp-block-button__link:focus { background-color:var(--d-turkus-2); color:var(--d-grafit); }

/* ikony jak fa-arrow-down / fa-calendar-check-o - maska SVG dziedziczy kolor tekstu.
   Celowo TYLKO w hero: w oryginale ikony mialy wylacznie przyciski sekcji glownej. */
.d-hero .d-btn--biala  > .wp-block-button__link::before,
.d-hero .d-btn--turkus > .wp-block-button__link::before {
	content: ""; display: inline-block;
	width: 13px; height: 13px; margin-right: 8px; vertical-align: -2px;
	background-color: currentColor;
	-webkit-mask: var(--d-ikona) no-repeat center / contain;
	        mask: var(--d-ikona) no-repeat center / contain;
}
.d-btn--biala  { --d-ikona: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 3h2v12.2l5.1-5.1 1.4 1.4L12 19l-7.5-7.5 1.4-1.4L11 15.2z'/%3E%3C/svg%3E"); }
.d-btn--turkus { --d-ikona: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 1h2v2h6V1h2v2h4v20H3V3h4zm12 6H5v14h14zm-8.6 11L7 14.6 8.4 13l2 2 4.2-4.2 1.4 1.4z'/%3E%3C/svg%3E"); }

/* ==========================================================================
   5. SEKCJE - rytm i tla
   Zmierzone inline style sekcji oryginalu:
     #psychoterapia      rgba(238,238,238,1) -> #eeeeee
     #metody-pracy       rgba(56,84,95,1)    -> #38545f
     #umow-sie-na-wizyte rgba(63,107,130,1)  -> #3f6b82
     kazda sekcja: padding-top:60px; padding-bottom:50px
   #2f3539 to w oryginale body i STOPKA, nie tlo sekcji.
   ========================================================================== */

.d-sekcja          { padding-top: 60px; padding-bottom: 50px; padding-inline: 15px; }
.d-sekcja--jasna   { background: var(--d-jasny); }

/* Pasy sekcji musza stykac sie ze soba i ze stopka - w oryginale kolejne
   <section> sasiaduja bez odstepu, rytm robi wylacznie padding 60/50.
   Rdzen WP daje kazdemu dziecku ukladu constrained
   `:where(.is-layout-constrained) > * { margin-block-start: 1.2rem }` (0,0,0),
   co dawalo ZMIERZONE 19.2px bialej przerwy przed kazda sekcja i przed stopka -
   na pasach ciemnych (#38545f, #3f6b82) widoczne jako biale paski. */
.wp-block-post-content > .d-hero,
.wp-block-post-content > .d-sekcja,
.entry-content > .d-hero,
.entry-content > .d-sekcja { margin-block: 0; }
.wp-site-blocks > footer   { margin-block-start: 0; }
.d-sekcja--stal    { background: var(--d-stal);   color: #fff; }
.d-sekcja--stal-2  { background: var(--d-stal-2); color: #fff; }
.d-sekcja--ciemna  { background: var(--d-stal);   color: #fff; }   /* alias wsteczny */

/* na ciemnym: tresc #fff, tytul sekcji #ddd, lead #bbb - jak .wt_section_white */
.d-sekcja--stal   :is(h1,h2,h3,h4,h5,h6,p,li,b,strong,span),
.d-sekcja--stal-2 :is(h1,h2,h3,h4,h5,h6,p,li,b,strong,span),
.d-sekcja--ciemna :is(h1,h2,h3,h4,h5,h6,p,li,b,strong,span) { color: #fff; }
.d-sekcja--stal   .d-tytul,
.d-sekcja--stal-2 .d-tytul,
.d-sekcja--ciemna .d-tytul { color: #ddd; }
/* zdublowana klasa, bo `.d-lead.d-lead` nizej ma (0,2,0) i stoi pozniej */
.d-sekcja--stal   .d-lead.d-lead,
.d-sekcja--stal-2 .d-lead.d-lead,
.d-sekcja--ciemna .d-lead.d-lead  { color: #bbb; }
.d-sekcja--stal   a:not(.wp-element-button),
.d-sekcja--stal-2 a:not(.wp-element-button),
.d-sekcja--ciemna a:not(.wp-element-button) { color: #fff; text-decoration: underline; }

/* --- naglowek sekcji i lead: odpowiednik .intro_text (max-width 720px) ---
   POMIAR 2026-08-04 na diadush.com: `#o-nas .intro_text` ma W=720.0 maxWidth=720px,
   podczas gdy `#o-nas .container` ma 1170px. Czyli 720px dotyczy WYLACZNIE tytulu
   i leadu - akapity tresci ida pelna szerokoscia lamu (1140px).
   Selektor musi byc mocniejszy (0,3,0) od reguly szerokosci lamu z sekcji 1
   `.wp-block-group.is-layout-constrained > :where(...)` (0,2,0) - inaczej lead
   sekcji Psychoterapia rozlewa sie na 1140px zamiast 720px (zmierzone). */
.d-tytul, .d-lead,
.wp-block-group.d-sekcja > .d-tytul,
.wp-block-group.d-sekcja > .d-lead {
	max-width: 720px; margin-left: auto; margin-right: auto; text-align: center;
}
.d-tytul {
	font-family: Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 36px; line-height: 1.1; font-weight: 300;
	color: var(--d-naglowek);
	margin-top: 0; margin-bottom: 0;
	position: relative;
	padding-bottom: 46px;          /* 5 (margin h2) + 12 + 14 (ozdobnik) + 15 */
}
/* Zdublowana klasa (0,2,0) - lead na wiekszosci stron jest dzis akapitem
   (dlugi tekst wprowadzajacy nie jest naglowkiem), a `.wp-block-post-content p`
   (0,1,1) bilaby pojedyncza klase i zbilaby 18px do 16px. */
.d-lead.d-lead {
	font-size: 18px; line-height: 1.428571429; font-weight: 300; font-style: italic;
	color: #656565; margin-top: 0; margin-bottom: 30px;
}

/* --- ozdobnik: 70px kreska | pierscien 14px z kropka 4px | 70px kreska = 160px
       main.css l.216-246, kolor #34b1c4, margines 12px nad / 15px pod --- */
.d-tytul::before, .d-ozdobnik::before,
.d-tytul::after,  .d-ozdobnik::after {
	content: ""; position: absolute; bottom: 15px; left: 50%; transform: translateX(-50%);
}
.d-tytul::before, .d-ozdobnik::before {
	width: 160px; height: 14px;
	background:
		linear-gradient(var(--d-ozdoba), var(--d-ozdoba)) left  center / 70px 1px no-repeat,
		linear-gradient(var(--d-ozdoba), var(--d-ozdoba)) right center / 70px 1px no-repeat;
}
.d-tytul::after, .d-ozdobnik::after {
	width: 14px; height: 14px; box-sizing: border-box; border-radius: 50%;
	border: 3px solid var(--d-ozdoba);
	background: radial-gradient(circle at center, var(--d-ozdoba) 0 2px, transparent 2px);
}
.d-ozdobnik { position: relative; display: block; padding-bottom: 46px; }

/* kafelki-odnosniki (pusta w oryginale sekcja Oferta -> nawigacja do podstron) */
.d-oferta-linki { margin-bottom: 0; }
.d-oferta-linki .wp-block-column {
	border: 1px solid #e2e2e2; background: #fff; padding: 26px 18px;
	transition: box-shadow .2s ease-in-out, border-color .2s ease-in-out;
}
.d-oferta-linki .wp-block-column:hover { border-color: var(--d-akcent); box-shadow: 0 2px 10px rgba(0,0,0,.07); }
/* Wyglad kafelka niesie KLASA, nie poziom naglowka - dzieki temu poziom moze
   isc za struktura dokumentu (h3 pod h2), a rozmiar zostaje 18px/700 jak byl. */
.d-kafelek__tytul { font-size: 18px; font-weight: 700; line-height: 1.1; margin-bottom: 0; }
.d-kafelek__tytul a { color: var(--d-akcent); text-decoration: none; }
.d-kafelek__tytul a:hover { color: var(--d-akcent-2); text-decoration: underline; }

/* --- podpis pod portretem ---
   ZMIERZONE na oryginale (`#o-nas .wpb_column:first h5`): text-align left,
   color rgb(0,0,0), margin-bottom 20px, 14px, line-height 30px.
   Bylo: wysrodkowany, #454545, margin-bottom 0 - czytalo sie jak podpis pod
   obrazkiem zamiast jak etykieta osoby wyrownana z krawedzia zdjecia.
   Waga zostaje 700 (oryginal ma Lato Black 900 - swiadomie nie dogrywamy
   czwartego kroju, roznica w 14px podpisie jest ledwie widoczna). */
/* Zdublowana klasa (0,2,0): na stronie glownej podpis jest AKAPITEM (zajawka,
   nie sekcja tresci), a `.wp-block-post-content p` (0,1,1) bilaby pojedyncza
   klase. Na /o-nas/ ten sam podpis jest naglowkiem - jedna regula obsluguje
   oba przypadki, bo wyglad niesie klasa, nie znacznik. */
.d-osoba.d-osoba {
	font-size: 14px; font-weight: 700; line-height: 30px;
	color: #000; text-align: left; margin-bottom: 20px;
	font-family: Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* --- obrazy w kolumnach: bez zaokraglen, jak w oryginale --- */
.wp-block-image img { border-radius: 0; }
.wp-block-image { margin-bottom: 20px; }

/* ==========================================================================
   6. FORMULARZ KONTAKTOWY (CF7)
   ========================================================================== */

.wpcf7 label { display: block; margin-bottom: 14px; font-size: 14px; }
/* box-sizing: border-box jest tu OBOWIAZKOWE. Przy content-box `width:100%`
   liczy sie do SAMEJ tresci, a 2x12px paddingu i 2x1px obramowania doklejaja
   sie na zewnatrz - pole wychodzilo 26px poza swoja kolumne i cala strona
   /umow-sie-na-wizyte/ przewijala sie w poziomie na telefonie
   (ZMIERZONE: scrollWidth 386 przy clientWidth 375). */
.wpcf7 input[type=text], .wpcf7 input[type=email], .wpcf7 input[type=tel], .wpcf7 textarea {
	box-sizing: border-box;
	width: 100%; padding: 9px 12px; border: 1px solid #ddd; border-radius: 3px;
	font-family: inherit; font-size: 14px; margin-top: 4px;
}
.wpcf7 textarea { min-height: 150px; }
.wpcf7 input[type=submit] {
	background: var(--d-akcent); color: #fff; border: 0; border-radius: 5px;
	padding: 11px 26px; font-family: Lato, sans-serif; font-size: 12px; cursor: pointer;
}
.wpcf7 input[type=submit]:hover { background: var(--d-akcent-2); }
.wpcf7-acceptance .wpcf7-list-item { margin: 0; }
.wpcf7-acceptance label { font-size: 12.5px; color: #666; }
/* domyslny checkbox mial 13x13px - ponizej progu 24x24 z WCAG 2.5.8 */
.wpcf7-acceptance input[type=checkbox] {
	width: 20px; height: 20px; vertical-align: -4px; margin-right: 6px;
	accent-color: var(--d-akcent);
}

/* Pola na ciemnym pasie: GRAFITOWE, jak w oryginale.
   ZMIERZONE na diadush.com `#umow-sie-na-wizyte input`: background rgb(57,63,67)
   = #393f43, brak obramowania, border-radius 0, color rgb(170,170,170).
   Wczesniej byly biale (rgba(255,255,255,.94)) i piec jasnych prostokatow na
   pasie #3f6b82 bylo najciezszym wizualnie elementem calej witryny - ciagnelo
   wzrok mocniej niz naglowek sekcji. #ddd zamiast #aaa dla samej wpisanej
   tresci: #aaa na #393f43 to 3.5:1, czyli za malo na tekst, ktory user czyta
   w trakcie pisania; placeholder moze zostac na #aaa (tekst pomocniczy). */
.d-sekcja--stal-2 .wpcf7 :is(input[type=text],input[type=email],input[type=tel],textarea),
.d-sekcja--stal   .wpcf7 :is(input[type=text],input[type=email],input[type=tel],textarea) {
	background: #393f43; border: 0; border-radius: 0; color: #ddd;
	padding: 8px 12px;
}
.d-sekcja--stal-2 .wpcf7 ::placeholder,
.d-sekcja--stal   .wpcf7 ::placeholder { color: #aaa; opacity: 1; }
/* Oryginal nie mial widocznego fokusu - jego brak byl BLEDEM dostepnosci,
   nie cecha wygladu. Obwodka na zewnatrz, wiec nie rusza ukladu. */
.wpcf7 :is(input,textarea,button):focus-visible {
	outline: 2px solid var(--d-ozdoba); outline-offset: 2px;
}
.d-sekcja--stal-2 .wpcf7 input[type=submit]       { background: #fff; color: var(--d-grafit); }
.d-sekcja--stal-2 .wpcf7 input[type=submit]:hover { background: var(--d-jasny); color: #222; }
.d-sekcja--stal-2 .wpcf7-acceptance label         { color: #e6eef3; }
.d-sekcja--stal-2 .wpcf7 label                    { color: #fff; }

/* ==========================================================================
   7. STOPKA
   #wt_footerBottom: bg #2f3539, border-top 1px #2a2f37, padding 42px
   .copyright: 16px/34px #aaa center; linki #3498db bez podkreslenia
   ========================================================================== */

.wp-site-blocks > footer {
	background: var(--d-grafit);
	border-top: 1px solid #2a2f37;
	color: #aaa;
	padding-block: 0;                     /* padding niesie grupa wewnetrzna */
}
.wp-site-blocks > footer > .wp-block-group { padding-block: 42px; }
.d-copyright {
	margin: 0; font-size: 16px; line-height: 34px;
	font-weight: 400; text-align: center; color: #aaa;
}
/* Stopka ma WLASNY odcien linku. Blekit z jasnych tel (--d-akcent) na graficie
   #2f3539 dawal 3.94:1, a jego hover (--d-akcent-2) 2.89:1 - czyli po najechaniu
   kontrast SPADAL. Jasny wariant daje 5.40:1, hover jeszcze wiecej. */
.wp-site-blocks > footer a { color: var(--d-akcent-jasny); text-decoration: none; }
.wp-site-blocks > footer a:hover { color: #8ccbf2; text-decoration: underline; }

/* ==========================================================================
   8. SZABLON NADRZEDNY
   twentytwentyfive/page.html wstrzykuje 36px bialych pasow nad i pod trescia.
   Motyw ma wlasne templates/, ale zostawiamy zabezpieczenie na wypadek
   szablonow dziedziczonych (search, 404, archiwa).
   ========================================================================== */

body:has(.d-sekcja) .wp-site-blocks > main { margin-top: 0 !important; }
body:has(.d-sekcja) .wp-site-blocks > main > .wp-block-group {
	padding-top: 0 !important; padding-bottom: 0 !important;
}

/* ==========================================================================
   9. RESPONSYWNOSC - progi oryginalu 991 / 767 / 680 / 480
   ========================================================================== */

/* --- prog zwijania menu: 991px ---
   Do 2026-08-04 menu zwijalo sie dopiero ponizej 767px. W pasmie 768-911px (PL)
   i 768-980px (UK) pozycje nie miescily sie w jednym rzedzie i naglowek rosl
   ZMIERZONE z 90px do 160px, spychajac „Umow sie na Wizyte" do drugiej linii -
   a naglowek jest przyklejony, wiec te 160px zabieralo ekran na stale.
   Pasmo to wszystkie tablety w pionie (768/820/834/912). Oryginal zawijal tam
   tak samo, ale to nadal defekt - odwzorowujemy wyglad, nie usterki ukladu.
   991px to zreszta prog zapisany w komentarzu tego arkusza od poczatku. */
@media (max-width: 991px) {
	.wp-site-blocks > header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.wp-site-blocks > header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }

	.wp-site-blocks > header .wp-block-navigation__container > li > .wp-block-navigation-item__content.wp-block-navigation-item__content {
		padding: 8px 0; line-height: 1.5; font-size: 18px;
	}
	/* Podmenu w nakladce mialo 12px (regula rozwijanej listy z desktopu) przy
	   18px pozycji pierwszego poziomu, do tego #777 = 4.48:1, tuz pod progiem.
	   16px/#444 daje 9.7:1 i cel dotykowy ~40px. */
	.wp-site-blocks > header .wp-block-navigation__submenu-container {
		width: 100%; min-width: 0; border-bottom: none; position: static;
	}
	.wp-site-blocks > header .wp-block-navigation__submenu-container > li { border: none; background: transparent; }
	.wp-site-blocks > header .wp-block-navigation__submenu-container > li > .wp-block-navigation-item__content.wp-block-navigation-item__content {
		font-size: 16px; line-height: 1.5; padding: 8px 0 8px 16px; color: #444;
	}
	.wp-site-blocks > header .wp-block-navigation__submenu-container > li:hover > .wp-block-navigation-item__content.wp-block-navigation-item__content {
		background: transparent; color: var(--d-akcent);
	}

	/* Cele dotykowe. Rdzen daje obu przyciskom padding:0, czyli dokladnie 24x24 -
	   na styku progu z WCAG 2.5.8. Padding 10px + ujemny margines podnosi je do
	   44x44 (wytyczna Apple), nie ruszajac ukladu wizualnie. */
	.wp-site-blocks > header .wp-block-navigation__responsive-container-open {
		padding: 10px; margin: -10px -10px -10px 0;
	}
	.wp-site-blocks > header .wp-block-navigation__responsive-container-close {
		padding: 10px; margin: -10px;
	}
}

@media (max-width: 781px) {
	.wp-block-columns { gap: 20px; }
	.d-hero__przyciski.wp-block-buttons { flex-direction: column; align-items: center; gap: 12px; }
	.d-hero .wp-block-button, .d-hero .wp-block-button__link { width: 100%; max-width: 260px; text-align: center; }
	/* ponizej 16px iOS Safari zoomuje strone przy fokusie w polu */
	.wpcf7 input[type=text], .wpcf7 input[type=email],
	.wpcf7 input[type=tel],  .wpcf7 textarea { font-size: 16px; }
	/* przyciski do 44px wysokosci - tylko na telefonie, zeby nie ruszac
	   zmierzonych na oryginale 11px/16px na desktopie */
	.d-hero .wp-block-button__link,
	.wpcf7 input[type=submit] { padding-block: 14px; }
}

/* ukrycie podtytulu - main-media.css oryginalu: #siteDescription{display:none}.
   Zwijanie menu przeniesione wyzej, do 991px. */
@media (max-width: 767px) {
	:root { --d-naglowek-h: 66px; }
	.d-tagline { display: none; }
	.wp-site-blocks > header > .wp-block-group { padding-block: 8px; }
	.d-naglowek__rzad { min-height: 50px; column-gap: 12px; }
	.d-jezyki-lista a { padding: 5px 6px; font-size: 14px; }
	.d-lead.d-lead { font-size: 18px; margin-bottom: 22px; }
	.d-hero { padding-block: 90px 76px; }
	.wp-site-blocks > footer > .wp-block-group { padding-block: 28px; }
	.d-copyright { font-size: 14px; line-height: 24px; }
}

@media (max-width: 680px) {
	.d-tytul, .d-lead.d-lead { padding-inline: 30px; }
	.d-tytul { padding-bottom: 46px; }
}

@media (max-width: 480px) {
	.d-tytul { font-size: 28px; }
	.d-lead.d-lead { font-size: 17px; }
	.d-hero  { padding-block: 70px 60px; }
	.d-hero__cytat { font-size: 24px; line-height: 30px; }
}