/* /dziekujemy-za-wpisowe-web/ — jedyna strona zbudowana na produkcji w ELEMENTORZE
   (`elementor-458`), a nie w motywie `ramus`. Jej treść niesie klasy `e-con`, `elementor-element`,
   `elementor-heading-title`, dla których motyw nie miał żadnych reguł: tekst leciał od lewej
   krawędzi bez kontenera, nic nie było wyśrodkowane, ikona szara i przycięta.
   Pozostałe strony „dziękujemy" mają własne pliki CSS; tej brakowało.

   ⚠️ Wszystkie nagłówki mają tę samą klasę `.elementor-heading-title` i `elementor-size-default`
   — różnicuje je wyłącznie TAG (h1/h3/h4/p) i waga. Reguła oparta na samej klasie pomalowała
   całą stronę na zielono i 60 px. Wartości poniżej są zmierzone element po elemencie
   na produkcji (1440 px). */

.e-con,
.elementor-element > .e-con-inner {
    max-width: 1140px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 24px;
    padding-right: 24px;
    box-sizing: border-box;
}

.elementor-widget,
.elementor-widget-heading,
.elementor-heading-title {
    text-align: center;
}

.elementor.elementor-458 {
    padding: 48px 0 64px;
}

/* Nagłówek potwierdzenia */
/* Produkcja trzyma nagłówki BEZ marginesów i z line-height ~1,0 — odstępy robią kontenery
   Elementora. Nasze marginesy 8–24 px i line-height 1,6 dawały na mobile +334 px. */
.elementor-heading-title { margin: 0; line-height: 1.2; }
.elementor-element { margin-bottom: 24px; }   /* desktop; mobile niżej w media query */

h1.elementor-heading-title {
    font-size: clamp(32px, 4.2vw, 60px);
    font-weight: 600;
    color: #8BC34A;
}

/* Trzy linie objaśnienia; trzecia („Masz pytania…") jest na produkcji zielona */
h3.elementor-heading-title {
    font-size: 18px;
    font-weight: 400;
    color: #15161C;
}
h3.elementor-heading-title strong,
/* Kolejność zmierzona na produkcji: 4. element („Powiadomienie e-mail") jest CIEMNY i pogrubiony,
   dopiero 5. („Masz pytania…") zielony. Wcześniejsza reguła celowała w 4. i zamieniała je miejscami. */
.elementor-element:nth-of-type(4) h3.elementor-heading-title { font-weight: 600; }
.elementor-element:nth-of-type(5) h3.elementor-heading-title { color: #8BC34A; margin-top: 24px; }

/* Telefon i e-mail */
h4.elementor-heading-title { font-size: 16px; font-weight: 600; color: #8BC34A; }

/* Godziny pracy sekretariatu */
p.elementor-heading-title { font-size: 16px; font-weight: 400; color: #7A7A7A; }

/* Ikona potwierdzenia — na produkcji 102 px, wyśrodkowana */
.elementor-widget-image,
.elementor-widget-image figure,
.elementor-widget-image img,
.elementor-widget-image [class*="lc-ico-"] {
    margin-left: auto;
    margin-right: auto;
}
.elementor-widget-image img {
    display: block;
    max-width: 102px;
    height: auto;
}

@media (max-width: 768px) {
    .elementor.elementor-458 { padding: 32px 0 48px; }
    /* Produkcja na 390 px daje nagłówkom 330 px szerokości i line-height 1,0. Nasz padding
       24 px kumulował się na zagnieżdżonych kontenerach (e-con + e-con-inner) i ścinał tekst
       do 246 px, przez co łamał się na więcej linii. */
    .e-con,
    .elementor-element > .e-con-inner { padding-left: 12px; padding-right: 12px; }
    .elementor-element > .e-con-inner { padding-left: 0; padding-right: 0; }
    .elementor-heading-title { line-height: 1.15; }
    .elementor-element { margin-bottom: 12px; }
}

/* Ikona potwierdzenia zeszła do CSS jako maska ([O6]) i bierze kolor z `currentColor`,
   czyli po rodzicu — a ten jest szary. Na produkcji koło jest zielone. Kontener ikony
   trzeba też wyśrodkować: sam `text-align` nie działa na element blokowy z ::before. */
.elementor-widget-image,
.elementor-widget-image .elementor-widget-container,
.elementor-widget-image > [class*="lc-ico-"] {
    display: flex;
    justify-content: center;
    color: #8BC34A;
}
