/* KLUB ESSENTIALS — sekcja newslettera motywu (section.h-newsletter-ml) na calej stronie.
   e3, 17.09.2026, polecenie wlasciciela 01:58: „podstaw wszedzie, gdzie jest formularz newslettera, jego nowa wersje
   z kart zestawow”. Reguly przeniesione 1:1 z mu-plugins/e3-zestaw/css/pdp.css (dawny zakres klasy karty zestawu,
   24.08–16.09.2026), w tej samej kolejnosci. Zakres :not(.e3-nl) ma specyficznosc klasy (0,1,0) — tak jak dawny —
   wiec kaskada miedzy regulami i wobec arkusza motywu (parts/part-newsletter-mailerlite.css) zostaje bez zmian.
   Jedno zrodlo: w pdp.css tych regul juz nie ma. Powody i historia: paczka repo
   „2026-09-17 (newsletter - wersja z kart zestawow na calej stronie)”. */

/* ============================================================================
   KLUB — NA ISTNIEJĄCEJ SEKCJI NEWSLETTERA (24.08.2026)

   Paczka pokazuje „Klub Essentials" jako nową sekcję. Na karcie TAKA SEKCJA JUŻ JEST
   (`section.h-newsletter-ml` motywu) — z tym samym nagłówkiem i tym samym zdaniem
   o prywatności, ale w przeciwieństwie do projektowej makiety MA DZIAŁAJĄCY zapis
   do MailerLite. Dlatego nie dokładamy drugiej sekcji (to był duplikat, wykryty bramą),
   tylko nakładamy wygląd z paczki na tę, która działa.

   Etykieta „— Klub Essentials —" jest tu dekoracją nagłówka (`::before`), bo motyw
   nie ma dla niej własnego elementu, a dokładanie go kodem znaczyłoby drugi renderer
   dla jednej linijki tekstu.
   ============================================================================ */
:not(.e3-nl) .h-newsletter-ml {
  --ink: #1F1E1C;
  --amber: #B08A45;
  --container-max: 1280px;
  --container-pad-x: 32px;
  --serif: ivyjournal, "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
  --sans: Montserrat, "Helvetica Neue", Arial, sans-serif;
}
:not(.e3-nl) .h-newsletter-ml { background:var(--ink) !important; color:#FFF !important; padding:58px 0 !important; }
:not(.e3-nl) .h-newsletter-ml .container { max-width:var(--container-max) !important; margin:0 auto !important; padding:0 var(--container-pad-x) !important; display:grid !important; grid-template-columns:1fr 420px !important; gap:88px !important; align-items:center !important; }
:not(.e3-nl) .h-newsletter-ml .newsletter-title { font-family:var(--serif) !important; font-size:40px !important; font-weight:400 !important; line-height:1.12 !important; letter-spacing:-.02em !important; margin-top:14px !important; }
:not(.e3-nl) .h-newsletter-ml .newsletter-subtitle { font-size:14px !important; line-height:1.7 !important; color:rgba(255,255,255,.7) !important; margin-top:20px !important; max-width:44ch !important; }
:not(.e3-nl) .h-newsletter-ml .newsletter-form-wrapper { background:rgba(255,255,255,.05) !important; border:1px solid rgba(255,255,255,.12) !important; padding:28px !important; }
:not(.e3-nl) .h-newsletter-ml .mailerlite-form-field label { font-family:var(--sans) !important; font-size:9.5px !important; font-weight:700 !important; letter-spacing:.2em !important; text-transform:uppercase !important; color:rgba(255,255,255,.55) !important; }
:not(.e3-nl) .h-newsletter-ml input[type="email"] { width:100% !important; margin-top:10px !important; padding:15px 16px !important; background:#FFF !important; border:none !important; font-family:var(--sans) !important; font-size:14px !important; color:var(--ink) !important; }
:not(.e3-nl) .h-newsletter-ml .mailerlite-subscribe-submit { width:100% !important; margin-top:12px !important; padding:16px !important; background:var(--amber) !important; color:#FFF !important; border:none !important; cursor:pointer !important; font-family:var(--sans) !important; font-size:11px !important; font-weight:700 !important; letter-spacing:.16em !important; text-transform:uppercase !important; transition:background .2s ease !important; }
:not(.e3-nl) .h-newsletter-ml .newsletter-subtitle-small { font-size:10.5px !important; line-height:1.6 !important; color:rgba(255,255,255,.45) !important; margin-top:14px !important; text-align:center !important; }
:not(.e3-nl) .h-newsletter-ml .newsletter-title::before {
  content: "— Klub Essentials —"; display: block; margin-bottom: 14px;
  font-family: var(--sans); font-size: 10px; font-weight: 700;
  letter-spacing: .22em; text-transform: uppercase; color: var(--amber);
}
@media (min-width: 768px) {
  :not(.e3-nl) .h-newsletter-ml .container { display: block !important; }
  :not(.e3-nl) .h-newsletter-ml .newsletter-content {
      display: grid !important;
      grid-template-columns: 1fr 420px !important;
      grid-template-rows: auto auto auto !important;
      column-gap: 88px !important; row-gap: 0 !important;
      align-items: center !important; text-align: left !important;
    }
  :not(.e3-nl) .h-newsletter-ml .newsletter-title { grid-column: 1 !important; grid-row: 1 !important; align-self: end !important; }
  :not(.e3-nl) .h-newsletter-ml .newsletter-subtitle { grid-column: 1 !important; grid-row: 2 !important; align-self: start !important; }
  :not(.e3-nl) .h-newsletter-ml .newsletter-form-wrapper { grid-column: 2 !important; grid-row: 1 / span 2 !important; }
  :not(.e3-nl) .h-newsletter-ml .newsletter-subtitle-small { grid-column: 2 !important; grid-row: 3 !important; margin-top: 12px !important; }
  :not(.e3-nl) .h-newsletter-ml .newsletter-form-wrapper {
      width: 420px !important; max-width: 420px !important; margin: 0 !important;
    }
  :not(.e3-nl) .h-newsletter-ml .mailerlite-form,
    :not(.e3-nl) .h-newsletter-ml .mailerlite-form form,
    :not(.e3-nl) .h-newsletter-ml .mailerlite-form-inputs,
    :not(.e3-nl) .h-newsletter-ml .mailerlite-form-field { width: 100% !important; max-width: none !important; }
  :not(.e3-nl) .h-newsletter-ml .newsletter-title { max-width: none !important; white-space: nowrap !important; }
  /* ⚠️ NOTKA POD PRZYCISKIEM, NIE NA POLU. Ujemny margines wpychał ją na pole e-mail
       (zrzut: tekst „prywatności." przecięty krawędzią inputa). W motywie notka leży POZA
       ramką formularza, a w projekcie jest jej częścią — nie da się jej przenieść w DOM
       samym CSS-em, więc zamiast tego ROZCIĄGAMY TŁO ramki na cały obszar kolumny.
       Efekt dla oka ten sam, bez przesuwania czegokolwiek na siłę. */
  :not(.e3-nl) .h-newsletter-ml .newsletter-content::after {
      content: "" !important; grid-column: 2 !important; grid-row: 1 / span 3 !important;
      background: rgba(255,255,255,.05) !important; border: 1px solid rgba(255,255,255,.12) !important;
      z-index: 0 !important;
      /* ⚠️ `align-self: stretch` KONIECZNE: siatka ma `align-items: center`, więc pseudo-element
         bez własnej treści zwijał się do zera i zamiast ramki widać było poziomą kreskę. */
      align-self: stretch !important; justify-self: stretch !important;
    }
  :not(.e3-nl) .h-newsletter-ml .newsletter-form-wrapper {
      background: none !important; border: 0 !important; position: relative !important; z-index: 1 !important;
    }
  :not(.e3-nl) .h-newsletter-ml .newsletter-subtitle-small {
      grid-column: 2 !important; grid-row: 3 !important; align-self: start !important;
      position: relative !important; z-index: 1 !important;
      margin: 0 !important; padding: 0 28px 28px !important; text-align: left !important;
    }
}
/* ⚠️ ETYKIETA POLA JEST PUSTA W KODZIE MOTYWU: `<label for="…"></label>`.
   To nie tylko brak wobec projektu — to wada dostępności, bo pole e-mail nie ma
   nazwy dla czytnika ekranu (zostaje sam placeholder, który znika po wpisaniu znaku).
   Tutaj uzupełniamy WARSTWĘ WIDOCZNĄ. Naprawa semantyczna należy do szablonu motywu
   (tekst w `<label>` albo `aria-label` na polu) — zgłoszone właścicielowi. */
:not(.e3-nl) .h-newsletter-ml .mailerlite-form-field label::after { content: "Adres e-mail"; }
:not(.e3-nl) .h-newsletter-ml .mailerlite-form-field label {
  display: block !important; visibility: visible !important;
  height: auto !important; width: auto !important;
  position: static !important; clip: auto !important; overflow: visible !important;
  margin-bottom: 10px !important;
}
@media (max-width: 767px) {
  :not(.e3-nl) .h-newsletter-ml .container,
    :not(.e3-nl) .h-newsletter-ml .newsletter-content { display: block !important; text-align: left !important; }
  :not(.e3-nl) .h-newsletter-ml .newsletter-content::after { display: none !important; }
  :not(.e3-nl) .h-newsletter-ml .newsletter-form-wrapper {
      width: auto !important; max-width: none !important;
      background: rgba(255,255,255,.05) !important; border: 1px solid rgba(255,255,255,.12) !important;
    }
  :not(.e3-nl) .h-newsletter-ml .newsletter-title { white-space: normal !important; }
  :not(.e3-nl) .h-newsletter-ml { background:var(--ink) !important; color:#FFF !important; padding:36px var(--section-pad-x) !important; }
  :not(.e3-nl) .h-newsletter-ml .newsletter-title { font-family:var(--serif) !important; font-size:27px !important; font-weight:400 !important; line-height:1.14 !important; letter-spacing:-.02em !important; margin-top:10px !important; }
  :not(.e3-nl) .h-newsletter-ml .newsletter-subtitle { font-family:var(--serif) !important; font-size:14.5px !important; line-height:1.6 !important; color:rgba(255,255,255,.75) !important; margin-top:12px !important; }
  :not(.e3-nl) .h-newsletter-ml .newsletter-form-wrapper { background:rgba(255,255,255,.05) !important; border:1px solid rgba(255,255,255,.12) !important; padding:20px !important; margin-top:26px !important; }
  :not(.e3-nl) .h-newsletter-ml .mailerlite-form-field label { font-family:var(--sans) !important; font-size:9px !important; font-weight:700 !important; letter-spacing:.2em !important; text-transform:uppercase !important; color:rgba(255,255,255,.55) !important; }
  :not(.e3-nl) .h-newsletter-ml input[type="email"] { width:100% !important; margin-top:9px !important; padding:15px 14px !important; background:#FFF !important; border:none !important; font-family:var(--sans) !important; font-size:15px !important; color:var(--ink) !important; min-height:48px !important; }
  :not(.e3-nl) .h-newsletter-ml .mailerlite-subscribe-submit { width:100% !important; margin-top:10px !important; padding:16px !important; background:var(--amber) !important; color:#FFF !important; border:none !important; min-height:52px !important; font-family:var(--sans) !important; font-size:11px !important; font-weight:700 !important; letter-spacing:.14em !important; text-transform:uppercase !important; }
  :not(.e3-nl) .h-newsletter-ml .newsletter-subtitle-small { font-size:10.5px !important; line-height:1.6 !important; color:rgba(255,255,255,.45) !important; margin-top:12px !important; text-align:center !important; }
}
@media (min-width: 768px) {
  :not(.e3-nl) .h-newsletter-ml .newsletter-form-wrapper { line-height: 1.75 !important; }
  :not(.e3-nl) .h-newsletter-ml .newsletter-subtitle-small {
      padding: 0 28px !important; margin-bottom: 0 !important;
    }
  /* Dolne domknięcie ramki robi jej tło, nie padding tekstu — inaczej notka „nosi"
       wysokość, której nie widać, i sekcja rośnie o 28 px. */
  :not(.e3-nl) .h-newsletter-ml .newsletter-content::after { margin-bottom: -28px !important; padding-bottom: 28px !important; }
  :not(.e3-nl) .h-newsletter-ml .mailerlite-form-field label { line-height: 1.15 !important; margin-bottom: 9px !important; }
  :not(.e3-nl) .h-newsletter-ml .mailerlite-subscribe-submit { min-height: 46px !important; padding-top: 0 !important; padding-bottom: 0 !important; }
  :not(.e3-nl) .h-newsletter-ml .mailerlite-subscribe-button-container { margin-top: 10px !important; }
  :not(.e3-nl) .h-newsletter-ml input[type="email"] { min-height: 48px !important; }
  /* ⚠️ NOTKA ŁAMAŁA SIĘ PRZEZ ROZSTRZELENIE LITER, nie przez rozmiar pisma.
       Motyw narzuca `letter-spacing: 0.5px`, którego projekt nie ma: przy 61 znakach
       to 30 px nadmiaru — dokładnie tyle, żeby zdanie nie zmieściło się w 364 px
       i zeszło do drugiego wiersza (33,6 zamiast 16,8 px). Rozmiar i interlinia były
       od początku zgodne, więc szukanie po nich prowadziło donikąd. */
  :not(.e3-nl) .h-newsletter-ml .newsletter-subtitle-small {
      font-size: 10.5px !important; line-height: 1.6 !important; letter-spacing: normal !important;
    }
}
:not(.e3-nl) .h-newsletter-ml .newsletter-subtitle { font-weight: 500 !important; letter-spacing: normal !important; }
:not(.e3-nl) .h-newsletter-ml .newsletter-subtitle-small a { font-weight: 500 !important; color: rgba(255,255,255,0.72) !important; }
:not(.e3-nl) .h-newsletter-ml .newsletter-content {
  display:flex !important; flex-direction:column !important; align-items:center !important;
  width:100% !important; max-width:840px !important; margin:0 auto !important; text-align:center !important;
}
:not(.e3-nl) .h-newsletter-ml .newsletter-content::after { display:none !important; }
:not(.e3-nl) .h-newsletter-ml .newsletter-title {
  order:1; align-self:stretch !important; white-space:normal !important; margin:0 !important; text-align:center !important;
}
:not(.e3-nl) .h-newsletter-ml .newsletter-subtitle {
  order:2; align-self:stretch !important; max-width:none !important; margin:16px 0 0 !important; text-align:center !important;
}
:not(.e3-nl) .h-newsletter-ml .newsletter-subtitle-small {
  order:5; align-self:stretch !important; margin:12px 0 0 !important; padding:0 !important; text-align:center !important;
}
:not(.e3-nl) .h-newsletter-ml .newsletter-form-wrapper {
  order:4; width:840px !important; max-width:100% !important; box-sizing:border-box !important;
  margin:24px 0 0 !important; background:rgba(255,255,255,.05) !important;
  border:1px solid rgba(255,255,255,.12) !important; text-align:left !important;
}
@media (max-width:767px) {
  :not(.e3-nl) .h-newsletter-ml { padding:36px 0 !important; }
  :not(.e3-nl) .h-newsletter-ml .container { width:100% !important; margin:0 !important; padding-left:20px !important; padding-right:20px !important; }
}
/* Komunikaty istniejącego formularza MailerLite — wyłącznie karty zestawów. */
:not(.e3-nl) .h-newsletter-ml .mailerlite-form-error,
:not(.e3-nl) .h-newsletter-ml .mailerlite-form-loader,
:not(.e3-nl) .h-newsletter-ml .mailerlite-form-response,
:not(.e3-nl) .h-newsletter-ml .mailerlite-form-response h4,
:not(.e3-nl) .h-newsletter-ml .mailerlite-form-response p {
  color: #fff !important;
  font-family: var(--sans) !important;
  font-size: 9.5px !important;
  font-weight: 700 !important;
  letter-spacing: .2em !important;
  line-height: 1.75 !important;
  text-transform: none !important;
  text-align: center !important;
}
:not(.e3-nl) .h-newsletter-ml .mailerlite-form-error {
  display: block;
  width: 100%;
  margin-top: 8px;
}
:not(.e3-nl):not(#\_) .h-newsletter-ml .newsletter-title {font-family:ivyjournal,"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif!important;font-size:38px!important;font-weight:400!important;line-height:1.1!important;letter-spacing:-.02em!important;font-style:normal!important;}
:not(.e3-nl):not(#\_) .h-newsletter-ml .newsletter-title::before {font-family:Montserrat,"Helvetica Neue",Arial,sans-serif!important;font-size:10px!important;font-weight:700!important;line-height:1.75!important;letter-spacing:.22em!important;font-style:normal!important;}
:not(.e3-nl):not(#\_) .h-newsletter-ml .newsletter-subtitle {font-family:ivyjournal,"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif!important;font-size:17px!important;font-weight:400!important;line-height:1.55!important;letter-spacing:normal!important;font-style:italic!important;}
@media(max-width:767px) {
  :not(.e3-nl):not(#\_) .h-newsletter-ml .newsletter-title {font-size:27px!important;line-height:1.14!important;}
  :not(.e3-nl):not(#\_) .h-newsletter-ml .newsletter-title::before {font-size:9px!important;font-weight:600!important;}
  :not(.e3-nl):not(#\_) .h-newsletter-ml .newsletter-subtitle {font-size:14.5px!important;line-height:1.6!important;font-style:normal!important;}
}