/* ══════════════════════════════════════════════════════════
   HUROM.PL — Custom CSS
   Wersja: 4.4 (Font conflict resolution)
   Fonty: System stack (SF Pro / Segoe UI / Roboto)
   Polskie znaki: natywne w fontach systemowych
   Apple-parity: typography 1:1 z apple.com (caps 80/56/64/28px)

   ZMIANY vs 4.3:
   - Override zmiennej --font-family z szablonu idoSell w :root
     Wszystkie miejsca używające var(--font-family) automatycznie
     dostają system stack (rozwiązuje konflikt .btn).
   - Explicit override .btn + warianty (wyższa specyficzność niż
     button element + !important dla pewności)
   - Poprawione @font-face redirect: zamiast local('-apple-system')
     (CSS keyword nie nazwa fontu) używamy prawdziwych nazw
     fontów systemowych: SF Pro Text, SF Pro Display, Segoe UI, Roboto.

   ZMIANY vs 4.2:
   - .cm p: dyskretny 15-16px (było 17-21px Apple-parity)
     - Mobile/Tablet: 15px (stałe)
     - Desktop+: 16px (cap)
   - .cm: text-align left (naprawa justify z idoSell template)
   - .cm letter-spacing: 0 (usunięte Apple-precyzja, dla 15-16px niepotrzebne)
   - line-height: 1.5 (luźniejsze, czytelniejsze niż Apple 1.23-1.42)
   - Powód: .cm jest aplikowane do opisów kategorii idoSell
     (krótkie 1-3 zdaniowe intro), nie do landing pages
     Apple-parity 21px było za duże dla krótkich opisów kategorii
   - Nagłówki .cm h1/h2/h3 zostają Apple-parity (32-56px) bez zmian
     bo są używane na CMS stronach (Quiz, Manifest, AI Chef)

   ZMIANY vs 4.1:
   - .product_name__name: skala uproszczona do Apple-like
     Mobile (idoSell): 2rem / 20px
     Desktop+ (≥757px): 2.4rem / 24px
     Bez schodków na 1024px i 1440px - jeden krok mobile→desktop
   - Powód: karta produktu w sklepie != hero strony marketingowej

   ZMIANY vs 4.0:
   - Pełna paleta --hurom-* w globalnym :root
   - Naprawiona literówka aside .nav-link: #11111 -> #111111
   - Cena na karcie produktu: #78C500 -> czarna (--hurom-ink)
   - Refactor hardcoded hexów pod tokens (8+ miejsc)
   - #34d399 Tailwind green -> --hurom-mint
   - Cleanup .srp_label::before, .label.--promo
   - Uproszczone selektory #main_hotspot_zone1-4 -> [id^="main_hotspot_zone"]
   - 0rem -> 0 (drobiazg)
   - Sekcja 16 BLOG zachowana nietknięta (osobny projekt)
   ══════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════
   0. GLOBALNE CSS VARIABLES — palety, tokens, fonty
   ══════════════════════════════════════════════════════════
   Wszystkie zmienne dostępne globalnie dla każdej sekcji:
   - banery .ch__* (hero)
   - .bannergw (gwarancja)
   - .h70 (CMS landing tworzony przez Marcin)
   - dowolne kolejne sekcje na stronie

   .h70 ma WŁASNE lokalne nadpisania niektórych zmiennych
   dla scoped fine-tuning - ale jako fallback dziedziczy z :root

   NOWE v4.4: --font-family override przebija zmienną z szablonu
   idoSell. Wszystkie .btn i inne miejsca używające
   var(--font-family) dostają system stack automatycznie.
   ══════════════════════════════════════════════════════════ */
:root {
  /* === FONTS === */
  --hurom-font-system: -apple-system, BlinkMacSystemFont, "Segoe UI",
                       Roboto, "Helvetica Neue", Arial, sans-serif;

  /* Override zmiennej --font-family z szablonu idoSell.
     idoSell w wielu miejscach (.btn, body, headers) używa
     var(--font-family). Nadpisanie tej zmiennej globalnie
     daje system stack wszędzie naraz - elegancko, jedno miejsce. */
  --font-family: var(--hurom-font-system);

  /* === BRAND GREENS (zgodne z hurom.com) === */
  --hurom-lime: #78C500;
  --hurom-lime-hover: #5E9E00;
  --hurom-mint: #44BE70;
  --hurom-mint-hover: #2EA757;
  --hurom-forest: #1A7A45;
  --hurom-forest-dark: #0F3D25;
  --hurom-mint-pale: #B8E8CB;

  /* === NEUTRALS === */
  --hurom-ink: #111111;
  --hurom-ink-soft: #040404;
  --hurom-gray-1: #333333;
  --hurom-gray-2: #8C8C8C;
  --hurom-gray-3: #C8C8C8;
  --hurom-gray-4: #E5E5E5;

  /* === BACKGROUNDS === */
  --hurom-white: #FFFFFF;
  --hurom-cream: #F8F8F8;
  --hurom-cream-mint: #F9FEFB;
  --hurom-charcoal: #202020;

  /* === PARTNER-SPECIFIC (świadome wyjątki) === */
  --hurom-credit-agricole: rgb(1, 138, 145);  /* Credit Agricole brand teal */
}


/* ══════════════════════════════════════════════════════════
   1B. DEFENSIVE FONT OVERRIDE — siatka bezpieczeństwa
   ══════════════════════════════════════════════════════════
   Każdy element który gdzieś (idoSell, custom, inline) ma
   ustawione: Poppins, DM Sans, main_custom, headline_custom
   - automatycznie dostaje nasz system stack.

   Plus @font-face redirect - jeśli idoSell ma swoje @font-face
   z nazwami Poppins/DM Sans/main_custom/headline_custom - my
   przepisujemy je na system fonts (browser użyje local fontu).

   ZMIANY v4.4: @font-face redirect używa prawdziwych nazw
   fontów systemowych zamiast local('-apple-system').
   '-apple-system' to CSS keyword, nie nazwa fontu - przeglądarki
   różnie to interpretowały. Teraz używamy SF Pro Text (macOS
   native), Segoe UI (Windows), Roboto (Android) - prawdziwe
   nazwy fontów które browser znajdzie przez local().

   To jest BACKSTOP - normalne reguły niżej i tak ustawiają
   var(--hurom-font-system), to tylko do edge cases.
   ══════════════════════════════════════════════════════════ */

[style*="Poppins"],
[style*="HarminiaSans"],
[style*="DM Sans"],
[style*="DM+Sans"],
[style*="main_custom"],
[style*="headline_custom"],
[style*="poppins"] {
  font-family: var(--hurom-font-system) !important;
}

.font-poppins,
.font-dm-sans,
.font-headline,
.font-main,
[class*="--poppins"],
[class*="--dmsans"] {
  font-family: var(--hurom-font-system) !important;
}

@font-face {
  font-family: 'Poppins';
  src: local('SF Pro Text'),
       local('Segoe UI'),
       local('Roboto'),
       local('Helvetica Neue'),
       local('Arial');
  font-display: swap;
}
@font-face {
  font-family: 'DM Sans';
  src: local('SF Pro Text'),
       local('Segoe UI'),
       local('Roboto'),
       local('Helvetica Neue'),
       local('Arial');
  font-display: swap;
}
@font-face {
  font-family: 'main_custom';
  src: local('SF Pro Text'),
       local('Segoe UI'),
       local('Roboto'),
       local('Helvetica Neue'),
       local('Arial');
  font-display: swap;
}
@font-face {
  font-family: 'headline_custom';
  src: local('SF Pro Display'),
       local('SF Pro Text'),
       local('Segoe UI'),
       local('Roboto'),
       local('Helvetica Neue'),
       local('Arial');
  font-display: swap;
}

/* ══════════════════════════════════════════════════════════
   2. iOS — focus / tap highlight
   ══════════════════════════════════════════════════════════ */
@supports (-webkit-touch-callout: none) {
  * {
    -webkit-tap-highlight-color: transparent;
  }
  *:focus {
    outline: none;
    box-shadow: none;
  }
  a, button, input, textarea, select {
    -webkit-tap-highlight-color: transparent;
    outline: none;
    box-shadow: none;
  }
}

/* ══════════════════════════════════════════════════════════
   3. GLOBALNE PRZYPISANIE FONTÓW
   ══════════════════════════════════════════════════════════
   Wszędzie ten sam stack - Apple-parity.
   Apple używa SF Pro Display dla nagłówków i SF Pro Text dla body
   ALE rozróżnienie robi przeglądarka automatycznie (-apple-system).
   ══════════════════════════════════════════════════════════ */

body, p, li, td, input, textarea, select {
  font-family: var(--hurom-font-system);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

button {
  font-family: var(--hurom-font-system);
  font-weight: 600;
  -webkit-font-smoothing: antialiased;
}

/* Override .btn z szablonu idoSell - wyższa specyficzność
   niż element button, plus !important żeby przebić main_custom
   z szablonu. Naprawia konflikt:
   .btn { font-family: main_custom, "Open Sans" } z szablonu
   wygrywa nad button { var(--hurom-font-system) } bez explicit. */
.btn,
button.btn,
a.btn,
input.btn,
.btn.--large,
.btn.--solid,
.btn.--ghost,
.btn.--outline,
.btn.--small {
  font-family: var(--hurom-font-system) !important;
}

/* Apple-parity: nagłówki 600 weight (nie 800 jak wcześniej)
   To Apple-pattern - lżejsza, bardziej elegancka typografia. */
h1, h2 {
  font-family: var(--hurom-font-system);
  font-weight: 600;
  letter-spacing: -0.005em;
  line-height: 1.0714285714;
}

h3 {
  font-family: var(--hurom-font-system);
  font-weight: 600;
  letter-spacing: -0.005em;
  line-height: 1.1428571429;
}

h4, h5, h6 {
  font-family: var(--hurom-font-system);
  font-weight: 600;
}

strong, b {
  font-weight: 700;
}

.big_label,
.headline {
  font-family: var(--hurom-font-system);
  font-weight: 600;
  letter-spacing: -0.005em;
}

/* ══════════════════════════════════════════════════════════
   4. SEKCJA HX — IZOLACJA
   Sekcja główna (.hx) ma własne style — blokujemy globalne
   nadpisania iDoSell wewnątrz niej
   ══════════════════════════════════════════════════════════ */
.hx h1, .hx h2, .hx h3, .hx h4, .hx h5, .hx h6,
.hx p, .hx li, .hx button, .hx span {
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
  line-height: inherit;
  letter-spacing: inherit;
}

/* ══════════════════════════════════════════════════════════
   5. NAWIGACJA / HEADER
   ══════════════════════════════════════════════════════════ */

header .navbar-nav {
  font-size: 1.6rem;
}

header .nav-link {
  font-family: var(--hurom-font-system);
  font-weight: 600;
  padding: 5px 7px 1.4rem;
  text-transform: unset;
}

header .navbar-subnav .nav-link {
  text-transform: uppercase;
  font-size: 1.6rem;
}

header .navbar-subnav .navbar-subsubnav .nav-link {
  font-family: var(--hurom-font-system);
  font-weight: 400;
  text-transform: none;
  font-size: 1.5rem;
}

aside .nav-link {
  color: var(--hurom-ink);
}

@media (max-width: 978px) {
  [data-item="#menu_navbar3"] {
    display: none;
  }
}

#logo img {
  width: 200px;
}

/* ══════════════════════════════════════════════════════════
   6. FOOTER
   ══════════════════════════════════════════════════════════ */

footer .nav-link {
  font-family: var(--hurom-font-system);
  font-weight: 400;
  text-decoration: none;
}

footer span.nav-link {
  font-family: var(--hurom-font-system) !important;
  font-weight: 600;
}

/* ══════════════════════════════════════════════════════════
   7. MAX-WIDTH WRAPPER
   ══════════════════════════════════════════════════════════ */

body .max-width-1200 { max-width: 1366px; }

@media screen and (min-width: 1400px) {
  body .max-width-1200 { max-width: 1400px; }
}
@media screen and (min-width: 1680px) {
  body .max-width-1200 { max-width: 1580px; }
}
@media screen and (min-width: 1920px) {
  body .max-width-1200 { max-width: 1680px; }
}

/* Koszyk */
body .basketedit_page.max-width-1200 { max-width: 1366px; }

@media screen and (min-width: 1400px) {
  body .basketedit_page.max-width-1200 { max-width: 1400px; }
}
@media screen and (min-width: 1680px) {
  body .basketedit_page.max-width-1200 { max-width: 1580px; }
}
@media screen and (min-width: 1920px) {
  body .basketedit_page.max-width-1200 { max-width: 1680px; }
}

/* Fix pasek */
@media (min-width: 1170px) {
  .bars__item.--fixed .bars__wrapper {
    max-width: 1580px !important;
  }
}

/* Fix koszyk tunel */
.payment_tunnel .container + footer,
.order_process .container + footer,
.container.basketedit_page + footer,
.container.prepaid_page + footer {
  max-width: 1580px;
}

/* ══════════════════════════════════════════════════════════
   8. PRODUKT — KARTA
   ══════════════════════════════════════════════════════════
   Apple-parity: nazwa produktu skala 17→24→28px (jak Apple
   typography-media-card-gallery-headline). Karty w listach
   produktów stają się czytelniejsze, mniej "krzyczące".

   ZMIANY v4.2: product_name__name - Apple-like skala
   - Mobile (idoSell default): 2rem / 20px
   - Desktop+ (≥757px): 2.4rem / 24px
   - BEZ schodków na 1024px i 1440px - karta produktu nie hero
   - Długie tytuły SEO mieszczą się w 2-3 liniach

   ZMIANY v4.1: cena promocyjna #78C500 -> czarna (premium)
   ══════════════════════════════════════════════════════════ */

#projector_form .projector_prices__maxprice_wrapper.--active {
  display: none;
}

#projector_form .projector_prices__price {
  color: var(--hurom-ink);
}

.product__name {
  font-family: var(--hurom-font-system) !important;
  font-weight: 600;
  font-size: 1.6rem;        /* 16px - listing produktów */
  letter-spacing: -0.005em;
  line-height: 1.2;
}

/* Tytuł produktu (H1) - Apple-like, jeden krok mobile→desktop.
   Mobile: 20px (idoSell), Desktop+: 24px (Twoje override).
   Bez 1024px i 1440px - karta produktu w sklepie != hero. */
@media (min-width: 757px) {
  .product_name__name {
    font-size: 2.4rem;      /* 24px - Apple Store / hurom.com USA */
    font-weight: 600;
    letter-spacing: -0.005em;
    line-height: 1.2;
  }
}

/* Cena - czarna premium (było #78C500 limonka).
   Apple/Dyson/hurom.com USA - cena zawsze w neutralnym
   kolorze ink, nie w brand color. */
#projector_form .projector_prices__price_wrapper {
  color: var(--hurom-ink) !important;
}

#projector_form .projector_prices__info {
  display: none;
}

#projector_form .projector_prices__maxprice_wrapper {
  font-family: var(--hurom-font-system) !important;
}

#projector_form .projector_prices__srp_wrapper.--active {
  display: none !important;
}

.projector_details {
  font-family: var(--hurom-font-system) !important;
  font-size: 1.7rem;        /* 17px Apple body mobile */
}

.projector_details #projector_additional_section {
  font-size: 1.7rem;
}

@media (min-width: 1068px) {
  .projector_details {
    font-size: 1.9rem;      /* 19px Apple body tablet+ */
  }
}

.label_icons > * {
  font-family: var(--hurom-font-system) !important;
  text-transform: uppercase;
}

.btn.--large.--solid {
  font-size: 1.6rem;
}

.product_name__notes {
  display: none;
}

.product__icon {
  background: var(--hurom-cream) !important;
}

/* ══════════════════════════════════════════════════════════
   9. CENY / OMNIBUS / SRP
   ══════════════════════════════════════════════════════════ */

.price.--max,
.price.--omnibus,
.price.--before-rebate,
.price.--new-price,
.price.--deposit,
.price_sellby {
  display: none;
}

.label.--bargain.--omnibus {
  display: none;
}

.hotspot.--list .product .price.--omnibus,
.hotspot.--list .product .price.--max,
.hotspot.--list .product .price.--before-rebate,
.hotspot.--list .product .price.--new-price {
  display: none !important;
}

span.omnibus_price__text {
  color: var(--hurom-ink);
  font-family: var(--hurom-font-system) !important;
}

span.omnibus_label {
  color: var(--hurom-ink);
  font-family: var(--hurom-font-system) !important;
}

.omnibus_price {
  line-height: 20px;
  font-family: var(--hurom-font-system);
}

.srp_label {
  background: rgba(120, 197, 0, 0.5);  /* --hurom-lime z 50% alpha */
  z-index: 55;
  border-radius: 5px;
}

/* Omnibus na hotspot - uproszczone z 4 selektorów do 1 */
[id^="main_hotspot_zone"] span.omnibus_label,
[id^="main_hotspot_zone"] .omnibus_price {
  display: none;
}

/* ══════════════════════════════════════════════════════════
   10. STOCK / DOSTĘPNOŚĆ — UKRYCIA
   ══════════════════════════════════════════════════════════ */

.projector_stocks { display: none; }

span.projector_stocks__icon.projector_info__icon { display: none; }
span.projector_stocks__info.projector_info__link { display: none; }
a.projector_stocks__info.projector_info__link.--link { display: none; }

.product_stocks .stock__availabilty_count { display: none; }
span.stock__availabilty_count { display: none; }

span#projector_amount.projector_status__info_amount,
.projector_amount,
#projector_amount,
.projector_buy__number_amounts,
.projector_status__info_amount {
  display: none !important;
}

/* ══════════════════════════════════════════════════════════
   11. ONE CLICK / DOSTAWA / PŁATNOŚCI
   ══════════════════════════════════════════════════════════ */

.projector_details .projector_oneclick__items { display: none !important; }
#projector_form .projector_oneclick__label { display: none !important; }
.cop_summary .cop_oneclick__label { display: none !important; }
.cop_summary .cop_oneclick_pay__item > div { display: none !important; }

.projector_shipping__text_from,
.projector_shipping__price {
  display: none;
}

div#projector_paypo {
  display: none;
}

.projector_details .projector_safe__icon:before {
  content: '\f095';
  font-size: 1.6rem;
  color: var(--hurom-ink-soft);
}

span.projector_safe__info.projector_info__link {
  color: var(--hurom-ink-soft);
}

/* ── Raty — Credit Agricole brand teal zachowany świadomie ── */
.projector_instalments__icon:before {
  color: var(--hurom-credit-agricole);
}

a.projector_instalments__link {
  color: var(--hurom-ink);
  font-weight: 600;
}

/* ══════════════════════════════════════════════════════════
   12. RÓŻNE UKRYCIA
   ══════════════════════════════════════════════════════════ */

#main_news,
.banner_smile,
.cop_documents,
.cop_pickup_points .cop_pickup_item__name {
  display: none;
}

.projector_smile,
.order2_info_sub4,
#order2_info_sub4,
.projector_points_recive.--active {
  display: none !important;
}

.article__image_wrapper,
.article__image_wrapper img {
  display: none;
}

.projector_page .article__item:nth-child(1n+5) {
  display: none;
}

/* ══════════════════════════════════════════════════════════
   13. BANER GŁÓWNY
   ══════════════════════════════════════════════════════════
   Apple-parity: hero label 32→48→64→80px (cap 80px).
   mix-blend-mode: multiply zachowany świadomie (mieszanie
   białego tła zdjęcia z tłem sekcji).
   ══════════════════════════════════════════════════════════ */

#main_banner1 img {
  mix-blend-mode: multiply;
  border-radius: 5px;
}

#main_banner1 .main_slider__label {
  font-size: 3.2rem;             /* 32px mobile */
  margin-bottom: 3.5rem;
  font-family: var(--hurom-font-system);
  font-weight: 600;
  letter-spacing: -0.005em;
  line-height: 1.0714285714;
}

#main_banner1 .main_slider__content {
  position: absolute;
  left: 0; right: 0;
  margin: auto;
  top: 50%;
  transform: translateY(-50%);
  padding: 0 2rem;
  display: none;
}

#main_banner1 .main_slider__description {
  font-size: 1.7rem;             /* 17px Apple body mobile */
  margin-bottom: 3rem;
  line-height: 1.2353641176;
  letter-spacing: -0.022em;
  font-weight: 600;
}

#main_banner1 .main_slider__button {
  margin-top: 2rem;
  margin-bottom: auto;
}

@media only screen and (min-width: 750px) {
  #main_banner1 .main_slider__label {
    font-size: 4rem;             /* 40px tablet */
  }
  #main_banner1 .main_slider__content { padding: 0 5rem; }
  #main_banner1 .main_slider__description {
    font-size: 1.9rem;           /* 19px tablet */
    line-height: 1.4211026316;
    letter-spacing: 0.012em;
    margin-bottom: 3rem;
  }
}

@media only screen and (min-width: 1068px) {
  #main_banner1 .main_slider__label {
    font-size: 4.8rem;           /* 48px desktop */
  }
  #main_banner1 .main_slider__description {
    font-size: 2.1rem;           /* 21px Apple body desktop CAP */
    line-height: 1.381002381;
    letter-spacing: 0.011em;
  }
}

@media only screen and (min-width: 1440px) {
  #main_banner1 .main_slider__label {
    font-size: 6.4rem;           /* 64px XL */
  }
}

@media only screen and (min-width: 1920px) {
  #main_banner1 .main_slider__label {
    font-size: 8rem;             /* 80px - Apple cap, NIE skalujemy wyżej */
  }
}

/* ══════════════════════════════════════════════════════════
   14. SLIDER
   ══════════════════════════════════════════════════════════ */

.block-slider > .swiper {
  height: 500px;
}

@media (max-width: 1100px) {
  .swiper-wrapper.desc-hurom.down {
    overflow-x: auto !important;
  }
}

/* ══════════════════════════════════════════════════════════
   15. CM (STRONY TREŚCI I OPISY KATEGORII)
   ══════════════════════════════════════════════════════════
   .cm jest aplikowane przez idoSell do:
   - Opisów kategorii (top + bottom strony kategorii)
   - CMS stron które NIE używają .h70 (Quiz, Manifest, AI Chef)
   - Treści Hurom AI Chef
   - Niektórych opisów produktu w starych szablonach

   ZMIANY v4.3:
   - .cm p: 15-16px (było 17-21px Apple-parity)
     Powód: opisy kategorii to krótkie 1-3 zdaniowe intro,
     Apple-parity 21px było za duże. Wraca dyskretne 15-16px
     które działało wcześniej.
   - .cm text-align: left (naprawa justify z idoSell template)
   - .cm letter-spacing: 0 (Apple-precyzja niepotrzebna dla 15-16px)
   - .cm line-height: 1.5 (luźniejsze niż Apple 1.23-1.42)

   NAGŁÓWKI .cm h1/h2/h3 zostają Apple-parity (32-56px)
   bo są używane na CMS landing pages (Quiz, Manifest)
   gdzie duża skala pasuje.

   .h70 (Twoje custom CMS landings) ma WŁASNĄ typografię,
   nie dziedziczy z .cm - pełne Apple-parity zachowane tam.

   NIE nadpisuje sekcji .hx (ma własną izolację z punktu 4)
   ══════════════════════════════════════════════════════════ */

.cm h1, .cm h2, .cm h3 {
  font-family: var(--hurom-font-system);
  font-weight: 600;
  line-height: 1.0714285714;
  letter-spacing: -0.005em;
}

/* === MOBILE (default ≤749px) === */
.cm h1 { font-size: 3.2rem; }    /* 32px */
.cm h2 { font-size: 3.2rem; }    /* 32px */
.cm h3 { font-size: 2.4rem; line-height: 1.1428571429; }    /* 24px */

/* Body .cm p - dyskretny, dla opisów kategorii */
.cm p,
.cm {
  font-size: 1.5rem;             /* 15px - dyskretny opis */
  line-height: 1.5;
  letter-spacing: 0;
  font-weight: 400;
  text-align: left;              /* naprawa justify z idoSell template */
}

/* === TABLET (≥750px) - nagłówki rosną, p zostaje === */
@media only screen and (min-width: 750px) {
  .cm h1 { font-size: 4rem; }    /* 40px */
  .cm h2 { font-size: 4rem; }    /* 40px */
  .cm h3 { font-size: 2.8rem; }  /* 28px - Apple H3 cap */
  .cm p, .cm {
    font-size: 1.5rem;           /* 15px wciąż - bez schodków */
    line-height: 1.5;
  }
}

/* === DESKTOP (≥1068px) - p rośnie do cap 16px === */
@media only screen and (min-width: 1068px) {
  .cm h1 { font-size: 4.8rem; }  /* 48px */
  .cm h2 { font-size: 4.8rem; }  /* 48px */
  .cm h3 { font-size: 2.8rem; }  /* 28px - Apple cap */
  .cm p, .cm {
    font-size: 1.6rem;           /* 16px - cap dla .cm body */
    line-height: 1.5;
  }
}

/* === XL+ (≥1440px) - tylko nagłówki rosną, p nie === */
@media only screen and (min-width: 1440px) {
  .cm h1 { font-size: 5.6rem; }  /* 56px - Apple section-header CAP */
  .cm h2 { font-size: 5.6rem; }  /* 56px - Apple cap */
  /* .cm p NIE skalujemy wyżej - 16px jest cap */
}

/* ══════════════════════════════════════════════════════════
   16. BLOG — ZACHOWANE NIETKNIĘTE
   ══════════════════════════════════════════════════════════
   UWAGA: Cała sekcja zostaje w obecnej formie.
   Refactor przy projekcie blogowym (osobny CSS .hb-wrap).
   ══════════════════════════════════════════════════════════ */

h3.article__name_wrapper {
  font-size: 2rem !important;
  text-decoration: none !important;
  font-weight: 600;
  letter-spacing: -0.005em;
}

.article__name {
  font-family: var(--hurom-font-system);
  font-weight: 600;
  letter-spacing: -0.005em;
}

#blog-item img.blog_image {
  max-width: 100%;
  display: none;
}

/* Blog post - Apple-parity nagłówki + body */
#blog-item .cm h1,
#blog-item .cm h2,
#blog-item .cm h3 {
  font-family: var(--hurom-font-system);
  font-weight: 600;
  color: #0f3d25;
  margin: 56px 0 16px;
  padding-bottom: 10px;
  border-bottom: 2px solid #d1f0e0;
  letter-spacing: -0.005em;
  line-height: 1.0714285714;
}

#blog-item .cm h1 { font-size: 3.2rem; }
#blog-item .cm h2 { font-size: 3.2rem; }
#blog-item .cm h3 {
  font-size: 2.4rem;
  line-height: 1.1428571429;
}

@media (min-width: 750px) {
  #blog-item .cm h1 { font-size: 4rem; }
  #blog-item .cm h2 { font-size: 4rem; }
  #blog-item .cm h3 { font-size: 2.8rem; }
}

@media (min-width: 1068px) {
  #blog-item .cm h1 { font-size: 4.8rem; }
  #blog-item .cm h2 { font-size: 4.8rem; }
}

@media (min-width: 1440px) {
  #blog-item .cm h1 { font-size: 5.6rem; }
  #blog-item .cm h2 { font-size: 5.6rem; }
}

#blog-item .cm p {
  color: #333;
  font-size: 1.7rem;
  line-height: 1.2353641176;
  letter-spacing: -0.022em;
  margin-bottom: 20px;
  font-weight: 400;
}

@media (min-width: 750px) {
  #blog-item .cm p {
    font-size: 1.9rem;
    line-height: 1.4211026316;
    letter-spacing: 0.012em;
  }
}

@media (min-width: 1068px) {
  #blog-item .cm p {
    font-size: 2.1rem;
    line-height: 1.381002381;
    letter-spacing: 0.011em;
  }
}

#blog-item .cm a { text-decoration: none; }
#blog-item .cm a:hover { text-decoration: underline; }

/* Blog — lista składników */
#blog-item .cm .hb-recipe-ingredients ul {
  list-style: none;
  padding: 0;
  margin: 0;
  gap: 6px;
  display: flex;
  flex-direction: column;
}
#blog-item .cm .hb-recipe-ingredients ul li {
  font-size: 1.4rem;
  color: #333;
  padding: 0 0 0 18px;
  position: relative;
  line-height: 1.55;
}
#blog-item .cm .hb-recipe-ingredients ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 8px;
  width: 7px;
  height: 7px;
  background: #1a7a45;
  border-radius: 50%;
}

/* Blog — seria kart */
#blog-item .cm .hb-series-card .hb-series-list {
  list-style: none;
  padding: 0;
  margin: 0 0 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
#blog-item .cm .hb-series-card .hb-series-list li {
  font-size: 1.4rem;
  color: #333;
  padding-left: 20px;
  position: relative;
  line-height: 1.55;
}
#blog-item .cm .hb-series-card--easy .hb-series-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 8px;
  width: 8px;
  height: 8px;
  background: #1a7a45;
  border-radius: 50%;
}
#blog-item .cm .hb-series-card--pure .hb-series-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 8px;
  width: 8px;
  height: 8px;
  background: #5a3fb5;
  border-radius: 50%;
}
#blog-item .cm .hb-series-card--citrus .hb-series-list li::before {
  background: #c07820;
  top: 8px;
}

/* Blog — pros/cons */
#blog-item .cm .hb-pros ul,
#blog-item .cm .hb-cons ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
#blog-item .cm .hb-pros ul li,
#blog-item .cm .hb-cons ul li {
  font-size: 1.3rem;
  color: #333;
  padding: 0 0 0 16px;
  position: relative;
  line-height: 1.5;
}
#blog-item .cm .hb-pros ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 7px;
  width: 7px;
  height: 7px;
  background: #1a7a45;
  border-radius: 50%;
}
#blog-item .cm .hb-cons ul li::before {
  content: '';
  position: absolute;
  left: 1px;
  top: 6px;
  width: 6px;
  height: 6px;
  border: 1.5px solid #c0392b;
  border-radius: 50%;
}

/* ══════════════════════════════════════════════════════════
   17. FILTRY
   ══════════════════════════════════════════════════════════ */

.filters__toggler .btn,
aside .filters__toggler .btn {
  color: var(--hurom-ink-soft);
}

/* ══════════════════════════════════════════════════════════
   18. MISC / EDGE CASES
   ══════════════════════════════════════════════════════════ */

.datasquare > * {
  font-family: var(--hurom-font-system);
}

div.tm-multihornet__wrapper {
  justify-content: left;
}

.tm-hydra {
  font-family: var(--hurom-font-system);
}

.tm-ferret2 .tm-lazy-background {
  background-color: var(--hurom-white) !important;
}

/* Label promo - całkowicie ukryta, bez bezsensownego stylingu */
.label.--promo {
  display: none;
}

.fullwidth_banner_buttons .btn {
  color: var(--hurom-ink) !important;
}

a[href="/Promocja-spromo-pol.html"] {
  color: var(--hurom-ink-soft) !important;
}

a[href="https://hurom.pl/data/include/cms/Quiz/strona.html"] {
  color: var(--hurom-lime) !important;
}

/* AI Chef - gradient brand lime -> mint, spójne z paletą */
a.nav-link.--l1[href="https://hurom.pl/Hurom-AI-Chef-ccms-pol-197.html"] {
  background: linear-gradient(to right, var(--hurom-lime), var(--hurom-mint));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.securityPolicy .big_label {
  display: inline-block;
}

#db8d534b-64b2-47af-85be-3af9c60cd9de {
  margin-top: 0 !important;
}

/* ══════════════════════════════════════════════════════════
   19. KOSZYK
   ══════════════════════════════════════════════════════════ */

.basketedit_page .basketedit_rebatecodes_outline {
  display: block !important;
}
.basketedit_page .basketedit_rebatecodes_outline input.basketedit_rebatecode_input {
  margin-top: 5px !important;
  margin-bottom: 15px !important;
}

@media screen and (min-width: 757px) {
  .basketedit_page .basketedit_rebatecodes_outline {
    display: block !important;
  }
  .basketedit_page .basketedit_rebatecodes_outline input.basketedit_rebatecode_input {
    margin-right: 10px !important;
  }
}

.cop_summary .cop_oneclick_pay__item {
  padding: 1px;
}

/* ══════════════════════════════════════════════════════════
   20. POPUP / MOBILE
   ══════════════════════════════════════════════════════════ */

@media screen and (max-width: 978px) {
  #tws_c_0 {
    position: fixed !important;
  }
}

@media (max-width: 360px) {
  #projector_form .projector_variants__item {
    gap: 0.1rem !important;
    min-width: 60px;
    width: 60px;
  }
  #projector_form .projector_variants__sub {
    gap: 0.1rem !important;
  }
}