/* =========================================================
   Gabinet Relacji — warstwa wyglądu dla układu w Divi
   Wklej do: Divi → Opcje Motywu → Dodatkowy CSS
   (albo Ustawienia → Style dodatkowe, jeśli wgrasz iw-style)

   UWAGA: stary assets/style.css jest zakresowany do wrappera .ar,
   którego układ Divi nie wytwarza. Ten plik go zastępuje.
   ========================================================= */

:root{
  /* Zmienne starego arkusza są zadeklarowane na wrapperze .ar, którego
     układ w Divi nie wytwarza — bez tego var(--green), var(--card),
     var(--line) i var(--shadow) były niezdefiniowane, a oparte na nich
     style formularza po prostu znikały (przezroczysty przycisk wysyłki,
     brak tła i ramek pól). Powtarzamy je globalnie. */
  --green:#39594F;
  --green-dk:#2C4A3F;
  --green-ink:#2B453B;
  --rose:#B77475;
  --rose-lt:#C98F8E;
  --rose-pale:#E8CFCE;
  --cream:#F4EFEB;
  --cream-2:#EDE5DF;
  --card:#FBF8F6;
  --ink:#2E2A29;
  --muted:#6E635E;
  --line:#DFD4CC;
  --shadow:0 18px 40px -24px rgba(57,89,79,.35);
  --serif:'Playfair Display',Georgia,'Times New Roman',serif;
  --sans:'Jost','Segoe UI',system-ui,-apple-system,sans-serif;
  --script:'Dancing Script','Segoe Script',cursive;

  --ar-green:#39594F;
  --ar-green-2:#2B453B;
  --ar-rose:#B77475;
  --ar-cream:#F4EFEB;
  --ar-card:#FBF8F6;
  --ar-ink:#2E2A29;
  --ar-line:#E6DAD3;
}

/* --- zdejmujemy domyślne odstępy Divi, żeby wrócić do gęstości z makiety --- */
.ard-sec .et_pb_row,
.ard-hero .et_pb_row{ padding-top:0; padding-bottom:0; }
.ard-sec .et_pb_module,
.ard-hero .et_pb_module{ margin-bottom:0; }

/* --- typografia --- */
.ard-hero, .ard-sec, .ard-cta{
  font-family:"Jost",system-ui,sans-serif;
  color:var(--ar-ink);
  line-height:1.6;
}
.ard-h2, .ard-h3, .ard-steps__h{
  font-family:"Playfair Display",Georgia,serif;
  font-weight:600;
  color:var(--ar-green-2);
  line-height:1.25;
}
/* Nagłówek sekcji: wyśrodkowany, z różanymi kreskami po bokach — tak jak
   w projekcie. Wcześniej był zwykłym, lewym nagłówkiem bez ozdobników. */
.ard-h2{
  font-size:clamp(25px,3vw,34px);
  text-align:center;
  margin:0 auto 30px;
  display:flex; align-items:center; justify-content:center; gap:20px;
  max-width:820px;
}
.ard-h2::before,
.ard-h2::after{
  content:""; height:1px; width:56px; flex:0 0 auto;
  background:#E3C9CA;
}
.ard-h3{ font-size:22px; margin:0 0 14px; }
.ard-eyebrow{
  font-size:11.5px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--ar-rose); margin:0 0 12px; text-align:center;
}

/* --- HERO --- */
.ard-hero{ position:relative; overflow:hidden; }
.ard-hero::before,
.ard-hero::after{
  content:""; position:absolute; pointer-events:none; z-index:0;
  background-repeat:no-repeat; background-size:contain;
}
.ard-hero::before{                       /* kwiat przy lewej krawędzi */
  left:-120px; bottom:-30px; width:270px; height:330px; z-index:2;
  background-image:url(/wp-content/uploads/2026/09/ar-kwiat-narozny.webp);
  background-position:left bottom;
  opacity:.85;
}
.ard-hero::after{                        /* narożnik prawy górny — jak w projekcie */
  right:-40px; top:-50px; width:300px; height:300px;
  background-image:url(/wp-content/uploads/2026/09/ar-kwiat-zamkniety.webp);
  opacity:.75;
}
.ard-hero .et_pb_row,
.ard-hero .et_pb_row .et_pb_column{ position:static; }
.ard-hero__txt,
.ard-hero .et_pb_button_module_wrapper,
.ard-hero__values{ position:relative; z-index:3; }
.ard-hero{ min-height:520px; }

.ard-hero__txt h1{
  font-family:"Playfair Display",Georgia,serif;
  font-weight:600; color:var(--ar-green-2);
  font-size:clamp(30px,3.6vw,46px); line-height:1.18;
  margin:0 0 16px; padding:0;
}
.ard-hero__txt h1 em{ font-style:italic; }
.ard-hero__script{
  font-family:"Dancing Script",cursive;
  color:var(--ar-rose); font-size:clamp(20px,2vw,27px);
  line-height:1.4; margin:0 0 14px;
}
.ard-hero__lead{ max-width:44ch; margin:0 0 26px; }
/* Zdjęcie jak w projekcie: dochodzi do prawej krawędzi strony, na całą
   wysokość hero, a lewa krawędź rozmywa się maską gradientową zamiast
   kończyć ostrym prostokątem. Blok jest pozycjonowany absolutnie, więc
   o wysokości hero decyduje kolumna z tekstem. */
.ard-hero__photo{
  position:absolute;
  top:0; bottom:0; right:0;
  width:42vw !important;
  max-width:760px;
  z-index:1;
  margin:0 !important;
  -webkit-mask-image:linear-gradient(to right, transparent 0, #000 24%, #000 100%);
          mask-image:linear-gradient(to right, transparent 0, #000 24%, #000 100%);
}
.ard-hero__photo .et_pb_image_wrap{ display:block; width:100%; height:100%; }
.ard-hero__photo .et_pb_image_wrap,
.ard-hero__photo img{
  width:100%; height:100%;
  border-radius:0 !important;
  object-fit:cover;
  object-position:center 18%;
}
/* kwiat w prawym górnym rogu ma leżeć NA zdjęciu, nie pod nim */
.ard-hero::after{ z-index:4; }

/* Na komputerze oba kwiaty wychodza poza prostokat zdjecia - czytaja sie
   jako osobny element dekoracyjny, a nie fragment fotografii (przyciecie
   sugerowaloby, ze sa czescia zdjecia). Roza z prawej: box dopasowany do
   proporcji obrazka (546x800), przyklejony do prawej krawedzi, zeby lodyga
   nie wchodzila na twarz. Wysuniecie ograniczone szerokoscia okna
   (calc ze 100vw), zeby nie powstal poziomy pasek przewijania. */
@media (min-width:981px){
  .ard-hero{ overflow:visible; }
  .ard-hero::before{
    left:max(-200px, calc((100% - 100vw) / 2 + 24px));
    bottom:-20px;
  }
  .ard-hero::after{
    right:max(-120px, calc((100% - 100vw) / 2 + 24px));
    top:14px; width:210px; height:308px;
    background-position:right top;
    opacity:.85;
  }
}

/* chipy pod hero — ciasno obok siebie, w linii tekstu, jak w projekcie */
.ard-hero__values.et_pb_row{ display:flex; justify-content:flex-start; gap:30px; }
.ard-hero__values .et_pb_column{ width:auto !important; margin:0 !important; float:none !important; }
.ard-chip .et_pb_blurb_content{ display:flex; align-items:center; gap:9px; max-width:none; }
.ard-chip .et_pb_main_blurb_image{ margin:0; width:34px; flex:0 0 34px; }
.ard-chip .et_pb_blurb_container{ padding:0; text-align:left; }
.ard-chip h3{ padding:0; font-size:15px; font-weight:400; }

/* --- O MNIE --- */
.ard-omnie__txt p{
  margin:0 0 14px;
  font-size:17.5px;            /* było za drobne przy domyślnym rozmiarze Divi */
  line-height:1.72;
  color:#4A423E;
}
.ard-omnie__txt p:first-of-type{ font-size:19.5px; color:var(--ar-green-2); }

/* Karta z cytatem — odtworzona z projektu, zamiast długiej róży,
   która wystawała poniżej tekstu w lewej kolumnie. */
.ard-cardnote{
  background:var(--ar-card);
  border:1px solid rgba(223,212,204,.85);
  border-radius:18px 18px 90px 18px;
  box-shadow:0 18px 40px -28px rgba(46,42,41,.45);
  padding:38px 34px 30px;
  text-align:center;
}
.ard-cardnote img{ width:190px; max-width:70%; margin:0 auto 16px; display:block; }
.ard-cardnote__q{
  font-family:"Dancing Script",cursive;
  font-size:27px; color:var(--ar-rose);
  line-height:1.35; margin:0 0 16px;
}
.ard-cardnote__vals{
  display:flex; justify-content:center; gap:12px; flex-wrap:wrap;
  font-size:11.5px; letter-spacing:.2em; text-transform:uppercase;
  color:#8A817C; margin:0;
}
.ard-cardnote__vals span::after{ content:"·"; margin-left:12px; color:#D9B9BA; }
.ard-cardnote__vals span:last-child::after{ content:""; }

/* Tekst wyśrodkowany w pionie względem karty z różą — tak jak w projekcie.
   Sam align-items nie działał, bo kolumny Divi są pływające, nie flexowe. */
.ard-omnie__row.et_pb_row{ display:flex; align-items:center; }
.ard-omnie__row .et_pb_column{ float:none; }

/* --- KARTY OFERTY --- */
/* Cztery pionowe karty w jednym rzedzie, rozlozone rownomiernie na pelnej
   szerokosci sekcji. Kolumny Divi wyrownujemy do najwyzszej karty. */
.ard-karty.et_pb_row{ display:flex; align-items:stretch; }
.ard-karty .et_pb_column{ display:flex; float:none; }
.ard-karta{
  width:100%;
  box-shadow:0 2px 14px rgba(46,42,41,.06);
  border:1px solid var(--ar-line);
  text-align:center;
}
.ard-karta .et_pb_blurb_content{ display:block; max-width:none; }
.ard-karta .et_pb_main_blurb_image{ margin:0 auto 12px; width:72px; }
.ard-karta .et_pb_main_blurb_image img{ width:72px; height:auto; margin:0 auto; display:block; }
.ard-karta .et_pb_blurb_container{ padding:0; text-align:center; }
.ard-karta h3{
  font-family:"Playfair Display",Georgia,serif;
  font-size:17px; font-weight:600; color:var(--ar-green-2);
  line-height:1.3; padding-bottom:8px;
}
.ard-karta__meta{
  font-size:12.5px; color:var(--ar-rose); line-height:1.5;
  margin:0 0 14px; padding-bottom:0 !important;
}
.ard-karta__lista{
  list-style:none; margin:0; padding:0; text-align:left;
  border-top:1px solid var(--ar-line); padding-top:12px;
}
.ard-karta__lista li{
  position:relative; padding:0 0 6px 15px;
  font-size:13.5px; line-height:1.45; color:#4A423E;
}
.ard-karta__lista li::before{
  content:""; position:absolute; left:0; top:8px;
  width:5px; height:5px; border-radius:50%; background:#D9B9BA;
}

/* --- MOJE PODEJŚCIE --- */
/* Zwarta lista: ikona na początku wiersza, pozycje jedna pod drugą bez
   rozstrzelania. Blok ograniczony szerokością, żeby czytał się jak lista,
   a nie jak cztery osobne sekcje. */
.ard-podejscie .et_pb_column{ max-width:820px; }
.ard-podejscie__poz{ margin:0 !important; }
.ard-podejscie__poz .et_pb_blurb_content{
  display:flex; align-items:center; gap:12px; max-width:none;
  padding:5px 0;
}
.ard-podejscie__poz .et_pb_main_blurb_image{ margin:0; width:26px; flex:0 0 26px; }
.ard-podejscie__poz .et_pb_main_blurb_image img{ width:26px; height:auto; }
.ard-podejscie__poz .et_pb_blurb_container{ padding:0; text-align:left; }
.ard-podejscie__poz h3{
  padding:0; font-size:15.5px; font-weight:500; line-height:1.35;
  color:var(--ar-ink);
}
.ard-podejscie__nota p{ font-size:14.5px; color:#6A6360; margin:16px 0 0; max-width:70ch; }

/* --- ZIELONY PANEL „Jak wygląda współpraca?" --- */
.ard-steps{ color:#fff; }
.ard-steps .ard-steps__h{ color:#fff; font-size:23px; margin:0 0 22px; }
.ard-steps__row{ display:grid; grid-template-columns:repeat(4,1fr); gap:0 22px; }
.ard-step{ text-align:center; }
.ard-step__n{
  display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px; border-radius:50%;
  background:var(--ar-rose); color:#fff;
  font-size:15px; font-weight:600; margin-bottom:7px;
}
.ard-step h3{ font-size:15px; font-weight:600; color:#fff; margin:0 0 3px; padding:0; }
.ard-step p{ font-size:13px; line-height:1.4; color:rgba(255,255,255,.82); margin:0; }
.ard-steps__note{
  margin:24px auto 0; max-width:640px; padding:10px 12px; border-radius:9px;
  background:rgba(255,255,255,.1); font-size:12.5px;
  text-align:center; color:rgba(255,255,255,.92);
}

/* --- DLACZEGO WARTO --- */
.ard-warto__poz .et_pb_blurb_content{ max-width:none; }
.ard-warto__poz h3{ font-size:15px; font-weight:600; color:var(--ar-green-2); padding-bottom:2px; }
.ard-warto__poz p{ font-size:14.5px; margin:0; }

/* --- KONTAKT --- */
/* UWAGA: formularza NIE stylujemy tutaj. Pełne style .ar-form (kremowe tło,
   ramka, cień, pola, etykiety kapitalikami) są w assets/style.css i działają
   tak samo jak na starej stronie. Wcześniejsze nadpisanie tła na białe
   spłaszczało go wizualnie — zostało usunięte. */

.ard-kontakt__lead{
  font-size:21px; font-weight:500; line-height:1.5;
  color:var(--ar-green-2); margin:0 0 14px;
}
.ard-kontakt__intro p{
  margin:0 0 15px;
  font-size:17px;          /* było domyślne ~15px i lewa kolumna wyglądała pusto */
  line-height:1.75;
  color:#4A423E;
}

/* adres e-mail — wygląd z projektu: podkreślenie różaną kreską */
.ard-kontakt__mail p{ margin:8px 0 0; }
.ard-kontakt__mail a{
  display:inline-block;
  font-size:17.5px; font-weight:600;
  color:var(--ar-green-2);
  border-bottom:1px solid #E3C9CA;
  padding-bottom:4px;
  text-decoration:none;
}
.ard-kontakt__mail a:hover{ color:var(--ar-green); border-bottom-color:var(--ar-rose); }

/* obie kolumny startują od góry, ale tekst dociąga do wysokości formularza */
.ard-kontakt.et_pb_row{ align-items:stretch; }

/* --- PASEK ZAMYKAJĄCY --- */
.ard-cta{ position:relative; overflow:hidden; }
.ard-cta::before{
  content:""; position:absolute; left:-50px; bottom:-60px;
  width:230px; height:230px; pointer-events:none;
  background:url(/wp-content/uploads/2026/09/ar-bukiet.webp) no-repeat center/contain;
  opacity:.85;
}
.ard-cta__row{ position:relative; z-index:1; align-items:center; }
.ard-cta__txt p{ margin:0; font-size:17px; }
.ard-cta__script{ font-family:"Dancing Script",cursive; color:var(--ar-rose); font-size:24px; }
.ard-cta .et_pb_button_module_wrapper{ text-align:right; }

/* --- przyciski --- */
.ard-btn.et_pb_button:hover{ opacity:.9; padding:14px 34px !important; }
.ard-btn.et_pb_button:after{ font-size:1em; }

/* =========================== MOBILE =========================== */
/* ---------- TABLET (progi Divi: 980 i 767 px) ----------
   Poniżej 980 px kolumny Divi układają się jedna pod drugą, więc zdjęcie
   ustawione absolutnie nachodziło na nagłówek, a kwiat z prawego górnego
   rogu lądował na twarzy. Od tego progu zdjęcie wraca do zwykłego
   przepływu na pełną szerokość, a kwiat narożny znika. */
@media (max-width:980px){
  /* Odsunięcie od krawędzi — na wąskich ekranach wiersze Divi szły
     na pełną szerokość bez marginesu bocznego i tekst dotykał brzegu. */
  .ard-hero .et_pb_row,
  .ard-sec .et_pb_row,
  .ard-cta .et_pb_row{
    padding-left:24px !important;
    padding-right:24px !important;
    width:100% !important;
  }

  /* Hero wyśrodkowane: nagłówek, motto, wprowadzenie, przycisk i chipy */
  .ard-hero__txt{ text-align:center; }
  .ard-hero__lead{ max-width:46ch; margin-left:auto; margin-right:auto; }
  .ard-hero .et_pb_button_module_wrapper{ text-align:center; }
  .ard-hero__values.et_pb_row{ justify-content:center; }

  .ard-hero{ min-height:0; }
  .ard-hero__photo{
    position:static !important;
    width:100% !important;
    max-width:none !important;
    height:380px;
    right:auto; top:auto; bottom:auto;
    -webkit-mask-image:linear-gradient(to bottom, #000 62%, transparent 100%);
            mask-image:linear-gradient(to bottom, #000 62%, transparent 100%);
  }
  .ard-hero__photo img{ object-position:center 15%; }
  .ard-hero::after{ display:none; }
  .ard-hero::before{ width:210px; height:260px; left:-80px; opacity:.7; }

  .ard-omnie__row.et_pb_row{ display:block; }
  .ard-steps__row{ grid-template-columns:repeat(2,1fr); gap:22px; }
  .ard-karty.et_pb_row{ display:block; }
  .ard-karta h3{ font-size:15px; }
}

/* ---------- TELEFON ---------- */
@media (max-width:767px){
  .ard-h2{ gap:12px; }
  .ard-h2::before, .ard-h2::after{ width:24px; }
  .ard-hero__photo{ height:300px; }
  .ard-hero::before{ width:170px; height:210px; left:-70px; opacity:.55; }
  .ard-hero__values.et_pb_row{
    max-width:100% !important;
    flex-wrap:wrap; gap:14px 22px;
  }
  .ard-chip .et_pb_blurb_content{ justify-content:center; }
  .ard-steps__row{ grid-template-columns:1fr 1fr; gap:14px 10px; }
  .ard-cta .et_pb_button_module_wrapper{ text-align:left; }
  .ard-cta__row{ gap:14px; }
}


/* =========================================================
   Doraźna poprawka kontrastu na starej stronie głównej
   (własny HTML, klasy ar-*). Divi 5.12 przebija kolor tekstu
   w .ar-btn--green / --rose i przyciski robią się nieczytelne.
   Do usunięcia, gdy stronę główną zastąpi wersja w Divi.
   ========================================================= */
.ar-btn.ar-btn--green,
.ar-btn.ar-btn--green:visited,
.ar-btn.ar-btn--rose,
.ar-btn.ar-btn--rose:visited{ color:#fff !important; }
.ar-btn.ar-btn--green svg,
.ar-btn.ar-btn--rose svg{ color:#fff !important; stroke:#fff; }
.ar-btn.ar-btn--green:hover,
.ar-btn.ar-btn--rose:hover{ color:#fff !important; }


/* =========================================================
   NAGŁÓWEK — standardowy nagłówek Divi doprowadzony do makiety.
   Logo (kwiat + „Anna R / Gabinet terapeutyczny") ustawia się
   w Divi → Opcje Motywu → Ogólne → Logo. Pozycje menu:
   Wygląd → Menu → „Menu główne".
   ========================================================= */
#main-header{
  background-color:var(--ar-cream);
  box-shadow:0 1px 0 rgba(46,42,41,.07);
}
#logo{ max-height:54px; }

#top-menu li a{
  font-family:"Jost",system-ui,sans-serif;
  font-size:15px; font-weight:400; color:var(--ar-ink);
}
#top-menu li a:hover{ color:var(--ar-green); opacity:1; }
#top-menu li.current-menu-item > a{ color:var(--ar-green); }

/* „Umów konsultację" — pozycja menu z klasą ard-menu-cta udaje przycisk */
#top-menu li.ard-menu-cta{ margin-left:16px; padding-right:0; }
#top-menu li.ard-menu-cta > a,
#top-menu li.ard-menu-cta.current-menu-item > a{
  background:var(--ar-green);
  color:#fff;
  border-radius:40px;
  padding:11px 22px !important;
  line-height:1;
  font-weight:500;
  transition:background .2s ease;
}
#top-menu li.ard-menu-cta > a:hover{ background:#2B453B; color:#fff; opacity:1; }

/* menu mobilne */
.et_mobile_menu li.ard-menu-cta a{
  background:var(--ar-green); color:#fff !important;
  border-radius:10px; margin:8px 6px; text-align:center; font-weight:500;
}

/* =========================================================
   STOPKA
   ========================================================= */
/* Z ikon społecznościowych Divi zostaje tylko Facebook — profil istnieje.
   X, Instagram i RSS pozostają ukryte, bo prowadziłyby donikąd.
   Adres profilu ustawia się w Divi → Opcje Motywu → Ogólne. */
#main-footer .et-social-icons li{ display:none; }
#main-footer .et-social-icons li.et-social-facebook{ display:inline-block; }

/* Ikona Facebooka w barwach marki: niebieskie kółko, białe „f”. */
#main-footer .et-social-facebook a.icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px; border-radius:50%;
  background:#1877F2;
  transition:background .2s ease;
}
#main-footer .et-social-facebook a.icon::before{
  color:#fff !important;
  font-size:17px;
  line-height:1;
}
#main-footer .et-social-facebook a.icon:hover{ background:#0F5FCC; }

/* --- Stopka: cieplejsza, jaśniejsza od domyślnej czerni --- */
#main-footer{
  background-color:#6E635E;           /* --muted z palety projektu */
  color:#F2EBE5;
}
#main-footer a{ color:#F2EBE5; }
#main-footer a:hover{ color:#fff; }

/* dolny pasek — ten sam odcień, odrobinę ciemniejszy, i niższy */
#footer-bottom{
  background-color:rgba(0,0,0,.16) !important;
  padding:12px 0 !important;
}
#footer-bottom #footer-info,
#footer-bottom .et-social-icons{ margin:0; padding:4px 0; }
#footer-info, #footer-info a{ color:#E6DCD4; font-size:13px; }

/* obszary widgetów stopki: bez Archiwów i Kategorii są puste — zdejmujemy
   po nich pusty odstęp, żeby pas stopki nie był niepotrzebnie wysoki */
#main-footer .footer-widget:empty{ display:none; }
#footer-widgets{ padding:22px 0 0 !important; }
#footer-widgets .footer-widget{ margin-bottom:10px !important; }


/* =========================================================
   POPRAWKI ZACHOWAŃ DIVI (znalezione pomiarami na żywo)
   ========================================================= */

/* 1. Divi animuje obrazki w modułach Blurb: startują z opacity:0 i mają
      się pojawić po wjechaniu w ekran. Ten mechanizm tu nie odpala, więc
      ikony zostawały niewidzialne mimo poprawnego rozmiaru i wczytania. */
.ard-karta .et-waypoint,
.ard-chip .et-waypoint,
.ard-podejscie__poz .et-waypoint,
.ard-karta .et_pb_image_wrap,
.ard-chip .et_pb_image_wrap,
.ard-podejscie__poz .et_pb_image_wrap,
.ard-karta img,
.ard-chip img,
.ard-podejscie__poz img{
  opacity:1 !important;
  animation:none !important;
}

/* 2. Divi wymusza kropki na listach w modułach tekstowych, przez co
      punktory dublowały się z naszymi. Zostają tylko nasze, różane. */
.ard-karta__lista,
.ard-karta__lista li{
  list-style:none !important;
  list-style-type:none !important;
}

/* 3. Zaokrąglenie z ustawień modułu nie było honorowane (obliczone 0px),
      więc ustawiamy je tutaj — razem z obwódką i cieniem w prawo i w dół. */
.ard-karta{
  border-radius:16px !important;
  border:1px solid #DFCFC4 !important;
  box-shadow:9px 11px 22px -14px rgba(120,86,70,.42) !important;
}


/* dane teleadresowe pod adresem e-mail w sekcji kontaktu */
.ard-kontakt__tel{ margin:14px 0 0 !important; }
.ard-kontakt__tel a{
  font-size:19px; font-weight:600; color:var(--ar-green-2); text-decoration:none;
}
.ard-kontakt__tel a:hover{ color:var(--ar-green); }
.ard-kontakt__adres{
  margin:10px 0 0 !important;
  font-size:15px; line-height:1.6; color:#6A6360;
}


/* Zielony panel „Jak wygląda współpraca" — zaokrąglenie z ustawień kolumny
   nie było honorowane (obliczony promień 0px), jak wcześniej przy kartach. */
.ard-steps.et_pb_column{
  border-radius:18px !important;
  box-shadow:9px 11px 26px -16px rgba(57,89,79,.5);
}

/* Przycisk wysyłki formularza — na wypadek gdyby cokolwiek jeszcze
   zjadło tło; kolor tekstu i tak wymuszamy wyżej. */
.ar-form button[type=submit]{
  background:var(--green) !important;
  border:0;
}
.ar-form button[type=submit]:hover{ background:var(--green-dk) !important; }


/* =========================================================
   STRONY TEKSTOWE (polityka prywatności, RODO)

   Divi renderuje je w układzie z prawym paskiem bocznym. Serwis
   nie ma bloga ani komentarzy, więc pasek pokazywał wyłącznie puste
   widżety. Widżety przeniesione do nieużywanych, a sam pasek
   chowamy i oddajemy szerokość treści.

   Reguła celuje w `body.page`, więc ewentualny przyszły blog
   (wpisy, archiwa) zachowa swój pasek boczny nietknięty.
   ========================================================= */
body.page #sidebar{ display:none !important; }
body.page #left-area{
  width:100% !important;
  padding-right:0 !important;
  float:none;
}
body.page.et_right_sidebar #main-content .container::before{ display:none; }

/* czytelna szerokość i typografia dokumentów */
body.page .entry-content{ max-width:820px; margin:0 auto; }
body.page .entry-content h2{
  font-family:"Playfair Display",Georgia,serif;
  color:var(--green-ink); font-size:26px; margin:34px 0 12px;
}
body.page .entry-content h3{
  font-family:"Playfair Display",Georgia,serif;
  color:var(--green-ink); font-size:19px; margin:24px 0 8px;
}
body.page .entry-content p,
body.page .entry-content li{ font-size:16px; line-height:1.75; }
body.page .entry-content .ar-lead{ font-size:17.5px; color:var(--muted); }

@media (max-width:980px){
  body.page #main-content .container{
    padding-left:24px !important;
    padding-right:24px !important;
    width:100% !important;
  }
}
