/*
 * Plasti-Shop — brand child theme pre Hummingbird (PrestaShop 9.1)
 * ------------------------------------------------------------------
 * Farby odvodené z loga: amber #F5B400 + antracit #16181D.
 * Princíp: najprv prepíšeme Bootstrap 5 CSS premenné (--bs-*), ktoré
 * Hummingbird používa všade — to samo osebe zmení tlačidlá, odkazy,
 * fokus stavy atď. na celom webe. Potom doladíme pár konkrétnych
 * komponentov (hlavička, menu, produktová karta, pätička, blog),
 * kde chceme vlastný vzhľad nad rámec farby.
 *
 * Súbor sa načíta AŽ PO theme.css (priority 1000 v theme.yml),
 * takže tieto pravidlá vyhrávajú aj pri rovnakej špecifickosti.
 * Needituj priamo /themes/hummingbird/ — pri update PrestaShopu
 * by sa zmeny stratili. Edituj len tento súbor.
 * ------------------------------------------------------------------ */

/* ===== 1) DESIGN TOKENY — globálne premenné ===== */
:root {
  /* Amber = primárna brand farba (CTA, odkazy, aktívne stavy) */
  --bs-primary: #F5B400;
  --bs-primary-rgb: 245, 180, 0;
  --bs-primary-text-emphasis: #7a5a00;
  --bs-primary-bg-subtle: #fdf3d9;
  --bs-primary-border-subtle: #f0cf6b;

  /* Antracit = tmavá brand farba (hlavička, pätička, tmavé plochy) */
  --bs-dark: #16181D;
  --bs-dark-rgb: 22, 24, 29;
  --bs-secondary: #3A414B;
  --bs-secondary-rgb: 58, 65, 75;

  /* Vlastné pomocné premenné pre komponenty nižšie */
  --plasti-ink: #16181D;
  --plasti-ink-2: #2A2F38;
  --plasti-amber: #F5B400;
  --plasti-amber-600: #E0A200;
  --plasti-ok: #1F9D57;
  --plasti-line: #ECEEF1;
  --plasti-radius-card: 16px;

  /* Mierne zaoblenejšie rohy pôsobia modernejšie a zladené s konceptom */
  --bs-border-radius: 10px;
  --bs-border-radius-lg: 16px;
  --bs-border-radius-xl: 20px;
}

/* ===== 2) TLAČIDLÁ =====
 * DÔLEŽITÉ: Hummingbird má farby v .btn-primary „zapečené" v skompilovanom
 * CSS ako literálne hex hodnoty (--bs-btn-bg:#0b69f6), nie ako var(--bs-primary).
 * Samotné prepísanie --bs-primary v :root preto NESTAČÍ — treba explicitne
 * prepísať aj --bs-btn-bg / --bs-btn-border-color priamo na .btn-primary. */
.btn-primary {
  --bs-btn-bg: var(--plasti-amber);
  --bs-btn-border-color: var(--plasti-amber);
  --bs-btn-color: var(--plasti-ink);
  --bs-btn-hover-bg: var(--plasti-amber-600);
  --bs-btn-hover-border-color: var(--plasti-amber-600);
  --bs-btn-hover-color: var(--plasti-ink);
  --bs-btn-active-bg: var(--plasti-amber-600);
  --bs-btn-active-border-color: var(--plasti-amber-600);
  --bs-btn-active-color: var(--plasti-ink);
  --bs-btn-disabled-bg: var(--plasti-amber);
  --bs-btn-disabled-border-color: var(--plasti-amber);
  font-weight: 600;
}

.btn-outline-primary {
  --bs-btn-color: var(--plasti-ink);
  --bs-btn-border-color: var(--plasti-amber);
  --bs-btn-hover-bg: var(--plasti-amber);
  --bs-btn-hover-color: var(--plasti-ink);
}

/* ===== 3) HLAVIČKA ===== */
.header-top,
.header-top-desktop {
  background-color: #fff;
  border-bottom: 1px solid var(--plasti-line);
}

.header-bottom {
  background-color: var(--plasti-ink);
}

.header-bottom__h1,
.header-bottom__h1 a {
  color: #fff;
}

.header-block__icon {
  color: var(--plasti-ink);
}

.header-block__badge {
  background-color: var(--plasti-amber);
  color: var(--plasti-ink);
  font-weight: 700;
}

/* ===== 4) HLAVNÉ MENU (desktop) =====
 * Reálna trieda horných položiek menu je .ps-mainmenu__tree-link (overené
 * priamo v DOM), NIE .main-menu__tree — tá je len pre mobilné offcanvas.
 * Zámerne cielime len na túto triedu, nie na "všetky odkazy v hlavičke"
 * (.header-bottom a), lebo vysúvacie podmenu (.submenu) má svoje vlastné
 * SVETLÉ pozadie — biely text na ňom by bol neviditeľný (presne tento bug
 * sme opravovali). */
.header-bottom .ps-mainmenu__tree-link {
  font-weight: 600;
  color: #fff;
}

.header-bottom .ps-mainmenu__tree-link:hover,
.header-bottom .ps-mainmenu__tree-link:focus {
  color: var(--plasti-amber);
}

/* Poistka: vysúvacie podmenu (.submenu) má biele pozadie -> vždy tmavý text,
 * nech naň v budúcnosti "nepretečie" žiadne iné pravidlo z hlavičky. */
.header-bottom .submenu,
.header-bottom .submenu a {
  color: #212529;
}

.header-bottom .submenu a:hover {
  color: var(--plasti-amber-600);
}

.header-bottom .submenu__left-item.active {
  color: var(--plasti-amber-600);
  font-weight: 700;
}

/* Mobilné offcanvas menu (.main-menu__*) — tmavé pozadie, biely text */
.main-menu__tree > li > a {
  font-weight: 600;
  color: #fff;
}

.main-menu__tree > li > a:hover,
.main-menu__tree > li > a:focus {
  color: var(--plasti-amber);
}

/* ===== 5) PRODUKTOVÉ KARTY (kategória, výpis, súvisiace produkty) =====
 * Predtým mala karta štýl len na :hover -> v pokojovom stave (bez najazdenia
 * myšou) nemala žiadny okraj ani tieň, takže proti bielemu pozadiu stránky
 * bola prakticky neviditeľná. Teraz má viditeľný okraj/tieň VŽDY a hover ho
 * len zvýrazní. */
.product-miniature__inner {
  height: 100%;
  border: 1px solid var(--plasti-line);
  border-radius: var(--plasti-radius-card);
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(22, 24, 29, .05);
  transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}

.product-miniature:hover .product-miniature__inner {
  border-color: var(--plasti-amber);
  box-shadow: 0 14px 32px rgba(22, 24, 29, .12);
  transform: translateY(-3px);
}

.product-miniature__title,
.product-miniature__title a {
  font-weight: 700;
  color: var(--plasti-ink);
}

.product-miniature__price,
.product-miniature__prices {
  font-weight: 800;
  color: var(--plasti-ink);
}

/* Pozn.: reálna trieda má pomlčku (quickview-button), pôvodne sme mali
   podčiarnutie (quickview_button) a pravidlo sa preto nikdy neaplikovalo. */
.product-miniature__quickview-button,
.product-miniature__quickview-touch {
  background-color: #fff;
  border-color: var(--plasti-line);
  color: var(--plasti-ink);
}

.product-miniature__quickview-button:hover,
.product-miniature__quickview-touch:hover {
  background-color: var(--plasti-amber);
  border-color: var(--plasti-amber);
  color: var(--plasti-ink);
}

/* ===== 5b) BOČNÝ PANEL S FILTRAMI (kategória) ===== */
.left-block__title {
  color: var(--plasti-ink);
  font-weight: 800;
}

.accordion-button:not(.collapsed) {
  color: var(--plasti-ink);
  background-color: var(--plasti-primary-bg-subtle, #fdf3d9);
}

.accordion-button:focus {
  border-color: var(--plasti-amber);
  box-shadow: 0 0 0 .2rem rgba(245, 180, 0, .2);
}

/* ===== 5c) MENEJ „BIELEHO" — jemné podfarbenie plochy stránky =====
 * Obsahové karty (produkty, blog) ostávajú čisto biele -> vďaka jemne
 * tónovanému podkladu na nich lepšie vyniknú a stránka pôsobí menej
 * "prázdno". Toto je opatrná, plošne bezpečná zmena (len farba pozadia
 * tela stránky), nie zásah do layoutu. */
body {
  background-color: #F6F5F2;
}

.product-miniature__inner,
#plasti-blog-index,
.plasti-blog-card {
  background-color: #fff;
}

/* Tmavý pás nad kategóriou (nadpis + breadcrumb) — priamy odkaz na
 * koncept: tmavé plochy s amber akcentom namiesto plochej bielej. */
.breadcrumb__wrapper {
  background-color: var(--plasti-ink);
}

.breadcrumb__wrapper,
.breadcrumb__wrapper a,
.breadcrumb__wrapper li {
  color: #c7ccd4;
}

.breadcrumb__wrapper a:hover {
  color: var(--plasti-amber);
}

/* Pozn.: .category__header obsahuje aj celý viacodstavcový popis
 * kategórie (SEO text) — preto sa NEfarbí na tmavo celý (bola by tma
 * na 4 odstavcoch textu, zle čitateľné). Zvýrazňuje sa len nadpis. */
.category__header .page-title-section {
  position: relative;
  padding-bottom: 14px;
  font-weight: 800;
}

.category__header .page-title-section::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 56px;
  height: 4px;
  background: var(--plasti-amber);
  border-radius: 3px;
}

/* ===== 6) VÝBER FARBY / ATRIBÚTOV — dropdown namiesto kvapátka ===== */
/* Toto len štýluje samotný <select>; typ zobrazenia atribútu (dropdown
   vs. farebná paleta) sa nastavuje v administrácii pri danom atribúte
   (Atribúty a vlastnosti → farba → Rozbaľovací zoznam) — pozri úlohu
   CAT-COLOR v 21_ZADANIA_IMPLEMENTACIA.md. */
.form-select:focus {
  border-color: var(--plasti-amber);
  box-shadow: 0 0 0 .2rem rgba(245, 180, 0, .25);
}

/* ===== 7) DOSTUPNOSŤ / SKLADOM ===== */
.product-available,
.in-stock {
  color: var(--plasti-ok);
  font-weight: 600;
}

/* ===== 8) PÄTIČKA ===== */
.footer,
.footer-top,
.footer__main {
  background-color: var(--plasti-ink);
  color: #c7ccd4;
}

.footer__block__title {
  color: #fff;
}

.footer a {
  color: #c7ccd4;
}

.footer a:hover {
  color: var(--plasti-amber);
}

/* ===== 9) CMS BLOG — jednotný vzhľad článkov a indexu =====
 * Zhodné s modulom plastiblogstyle (rovnaké triedy, rovnaké farby);
 * po overení novej témy odporúčame modul plastiblogstyle odinštalovať,
 * aby existoval len jeden zdroj pravdy pre štýl blogu (tento súbor). */
.plasti-blog-article {
  max-width: 880px;
  margin: 0 auto;
  color: #30343a;
}

.plasti-blog-article p {
  margin: 0 0 1.1rem;
  font-size: 1rem;
  line-height: 1.72;
}

.plasti-blog-article h2 {
  margin: 2.2rem 0 .85rem;
  padding-bottom: .45rem;
  border-bottom: 2px solid var(--plasti-amber);
  color: var(--plasti-ink);
  font-size: 1.42rem;
  font-weight: 700;
  line-height: 1.3;
}

.plasti-blog-article ul {
  margin: 0 0 1.15rem;
  padding-left: 1.25rem;
}

.plasti-blog-article li {
  margin: .4rem 0;
  line-height: 1.55;
}

.plasti-blog-hero {
  margin: 0 0 1.75rem;
  overflow: hidden;
  border-radius: var(--plasti-radius-card);
  background: #f3f4f5;
}

.plasti-blog-hero img {
  display: block;
  width: 100%;
  height: auto;
}

.plasti-blog-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 18px;
  margin: 2rem 0 .5rem;
}

.plasti-blog-inline-image {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--plasti-line);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .06);
}

.plasti-blog-inline-image img {
  display: block;
  width: 100%;
  height: 210px;
  object-fit: cover;
}

.plasti-blog-inline-image figcaption {
  padding: .7rem .8rem;
  color: #5b6168;
  font-size: .84rem;
  line-height: 1.35;
}

#plasti-blog-index {
  max-width: 1120px;
  margin: 0 auto;
}

#plasti-blog-index > h1 {
  margin-bottom: .35rem;
  color: var(--plasti-ink);
  font-size: 2rem;
}

#plasti-blog-index > p {
  margin-bottom: 1.75rem;
  color: #687078;
}

.plasti-blog-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(245px, 1fr));
  gap: 22px;
}

.plasti-blog-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--plasti-line);
  border-radius: var(--plasti-radius-card);
  background: #fff;
  box-shadow: 0 3px 12px rgba(0, 0, 0, .06);
  transition: transform .18s ease, box-shadow .18s ease;
}

.plasti-blog-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, .12);
}

.plasti-blog-card > img {
  display: block;
  width: 100%;
  height: 165px;
  object-fit: cover;
  background: #eef0f1;
}

.plasti-blog-card h2 {
  margin: 1rem 1rem .55rem;
  font-size: 1.08rem;
  line-height: 1.35;
}

.plasti-blog-card h2 a {
  color: var(--plasti-ink);
  text-decoration: none;
}

.plasti-blog-card h2 a:hover,
.plasti-blog-card p a:hover {
  color: var(--plasti-amber-600);
}

.plasti-blog-card p {
  margin: auto 1rem 1rem;
}

.plasti-blog-card p a {
  color: var(--plasti-amber-600);
  font-size: .9rem;
  font-weight: 700;
  text-decoration: none;
}

/* ===== 10b) HOMEPAGE — "PREČO NAKUPOVAŤ" + O SPOLOČNOSTI (ps_customtext redesign) =====
 * Nahrádza pôvodný neštýlovaný blok (H1 + voľné <p> so surovými obrázkami).
 * Nová štruktúra sa vkladá cez Moduly → ps_customtext → Konfigurovať → HTML zdroj,
 * pozri sprievodný súbor "customtext-homepage.html". Táto CSS len štýluje tie triedy. */

.ps-customtext .container h1 {
  margin-bottom: 1.75rem;
}

.plasti-trust-section {
  margin: 0 0 2.5rem;
}

.plasti-trust-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 1.5rem;
}

.plasti-trust-card {
  background: #fff;
  border: 1px solid var(--plasti-line);
  border-radius: var(--plasti-radius-card);
  box-shadow: 0 2px 10px rgba(22, 24, 29, .05);
  padding: 1.75rem 1.5rem;
  text-align: left;
}

.plasti-trust-card__icon {
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1rem;
}

.plasti-trust-card__icon img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}

.plasti-trust-card__icon--medal {
  background: var(--bs-primary-bg-subtle);
  border-radius: 50%;
}

.plasti-trust-card__icon--medal svg {
  width: 30px;
  height: 30px;
  color: var(--plasti-amber-600);
}

.plasti-trust-card__title {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--plasti-ink);
  margin: 0 0 .5rem;
}

.plasti-trust-card__text {
  font-size: .92rem;
  line-height: 1.55;
  color: #4b515b;
  margin: 0;
}

.plasti-trust-card__text a {
  color: var(--plasti-amber-600);
  font-weight: 600;
  text-decoration: none;
}

.plasti-trust-card__text a:hover {
  text-decoration: underline;
}

.plasti-trust-ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.plasti-trust-ctas a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: .55rem 1.1rem;
  border-radius: 999px;
  border: 1px solid var(--plasti-line);
  color: var(--plasti-ink);
  font-size: .88rem;
  font-weight: 600;
  text-decoration: none;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.plasti-trust-ctas a:hover {
  background: var(--plasti-amber);
  border-color: var(--plasti-amber);
  color: var(--plasti-ink);
}

.plasti-about {
  background: #F6F5F2;
  border-radius: var(--plasti-radius-card);
  padding: 2rem 2.25rem;
}

.plasti-about__title {
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--plasti-ink);
  margin: 0 0 1rem;
}

.plasti-about p {
  font-size: .95rem;
  line-height: 1.65;
  color: #3f454e;
  margin: 0 0 .9rem;
}

.plasti-about p:last-child {
  margin-bottom: 0;
}

@media (max-width: 767px) {
  .plasti-trust-grid {
    grid-template-columns: 1fr;
  }

  .plasti-about {
    padding: 1.5rem;
  }
}

/* ===== 10) MOBIL ===== */
@media (max-width: 575px) {
  .plasti-blog-article p {
    font-size: .97rem;
    line-height: 1.64;
  }

  .plasti-blog-article h2 {
    margin-top: 1.75rem;
    font-size: 1.25rem;
  }

  .plasti-blog-gallery,
  .plasti-blog-cards {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .plasti-blog-inline-image img {
    height: auto;
  }
}

/* ===== 11) HERO — plnošírková úvodná sekcia s autom ===== */
/* Full-bleed trik: modul beží vnútri Bootstrap .container (max-width),
   toto ho "vylomí" na celú šírku obrazovky bez zásahu do šablóny. */
.plasti-hero {
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  width: 100vw;
  min-height: 480px;
  display: flex;
  align-items: center;
  background-image: url('../img/hero-plasti-dip-car.jpg');
  background-size: cover;
  background-position: center;
  background-color: var(--plasti-ink);
  color: #fff;
  overflow: hidden;
  margin-bottom: 2.5rem;
}

/* Poistka proti vodorovnému scrollbaru zo 100vw triku */
html {
  overflow-x: hidden;
}

.plasti-hero__inner {
  position: relative;
  z-index: 2;
  max-width: 1200px;
  margin: 0 auto;
  padding: 56px 24px;
  width: 100%;
}

.plasti-hero__tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(245, 180, 0, .14);
  color: var(--plasti-amber);
  font-weight: 700;
  font-size: 12.5px;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 8px 14px;
  border-radius: 999px;
  margin-bottom: 22px;
}

.plasti-hero__title {
  font-size: 46px;
  line-height: 1.12;
  letter-spacing: -1.2px;
  font-weight: 800;
  max-width: 640px;
  margin-bottom: 18px;
  color: #fff;
}

.plasti-hero__title span {
  color: var(--plasti-amber);
}

.plasti-hero__text {
  color: #c7ccd4;
  font-size: 17px;
  max-width: 480px;
  margin-bottom: 30px;
}

.plasti-hero__ctas {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 40px;
}

.plasti-hero__btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 700;
  font-size: 15.5px;
  padding: 15px 30px;
  border-radius: 999px;
  cursor: pointer;
  border: 0;
  transition: .18s;
  text-decoration: none;
}

.plasti-hero__btn--primary {
  background: var(--plasti-amber);
  color: var(--plasti-ink);
}

.plasti-hero__btn--primary:hover {
  background: #fff;
  color: var(--plasti-ink);
  transform: translateY(-2px);
}

.plasti-hero__btn--ghost {
  background: rgba(255, 255, 255, .06);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .25);
}

.plasti-hero__btn--ghost:hover {
  background: rgba(255, 255, 255, .14);
  color: #fff;
}

.plasti-hero__meta {
  display: flex;
  gap: 34px;
  flex-wrap: wrap;
}

.plasti-hero__meta div b {
  display: block;
  font-size: 24px;
  font-weight: 800;
  color: #fff;
}

.plasti-hero__meta div small {
  color: #9aa1ab;
  font-size: 13px;
}

@media (max-width: 767px) {
  .plasti-hero {
    min-height: 0;
  }

  .plasti-hero__inner {
    padding: 40px 20px;
  }

  .plasti-hero__title {
    font-size: 28px;
    max-width: 100%;
  }

  .plasti-hero__text {
    max-width: 100%;
  }

  .plasti-hero__meta {
    gap: 22px;
  }
}

/* ===== 12) HOMEPAGE – VÝBER PRODUKTOV PLASTI DIP ===== */
.ps-featuredproducts {
  margin: 3.25rem 0;
}

.ps-featuredproducts .module-products__buttons {
  display: flex;
  justify-content: center;
  margin-top: 1.5rem;
}

/* Homepage cache-safe final hero + native product cards, 2026-07-24 */
.plasti-hero {
  background-image: url('../img/hero-plasti-dip-car-final-20260724.jpg');
  background-size: cover;
  background-position: center;
}
.plasti-hero__sprays { display: none !important; }
.ps-featuredproducts { margin: 2.5rem 0; }
.plasti-home-after-products { margin-top: 3rem; }
.plasti-home-after-products > h2 { margin: 0 0 1.25rem; }

/* Homepage CTA + blog teaser, 2026-07-24 */
.ps-featuredproducts .module-products > .plasti-featured-products__cta {
  display: flex;
  justify-content: center;
  width: 100%;
  margin: 2rem 0 3.25rem;
}

.plasti-featured-products__cta .btn {
  --bs-btn-color: var(--plasti-ink);
  --bs-btn-border-color: var(--plasti-amber);
  --bs-btn-hover-bg: var(--plasti-amber);
  --bs-btn-hover-border-color: var(--plasti-amber);
  --bs-btn-hover-color: var(--plasti-ink);
  align-items: center;
  border-radius: 999px;
  display: inline-flex;
  font-weight: 700;
  gap: .5rem;
  padding: .72rem 1.2rem;
  text-decoration: none;
}

.plasti-home-blog-teaser {
  background: linear-gradient(180deg, #f7f7f5 0%, #fff 100%);
  border-top: 1px solid var(--plasti-line);
  margin-top: 3.5rem;
  padding: 3.5rem 0 4rem;
}

.plasti-home-blog-teaser__heading { align-items: end; display: flex; gap: 1.5rem; justify-content: space-between; margin-bottom: 1.5rem; }
.plasti-home-blog-teaser__eyebrow { color: #9b7000; font-size: .76rem; font-weight: 800; letter-spacing: .09em; margin: 0 0 .35rem; }
.plasti-home-blog-teaser h2 { color: var(--plasti-ink); font-size: clamp(1.55rem, 3vw, 2rem); margin: 0; }
.plasti-home-blog-teaser__heading p:not(.plasti-home-blog-teaser__eyebrow) { color: #5f6670; margin: .45rem 0 0; }
.plasti-home-blog-teaser__all { align-items: center; border: 1px solid var(--plasti-amber); border-radius: 999px; color: var(--plasti-ink); display: inline-flex; font-size: .92rem; font-weight: 700; gap: .35rem; padding: .65rem 1rem; text-decoration: none; white-space: nowrap; }
.plasti-home-blog-teaser__all:hover { background: var(--plasti-amber); color: var(--plasti-ink); }
.plasti-home-blog-teaser__grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.plasti-home-blog-card { background: #fff; border: 1px solid var(--plasti-line); border-radius: var(--plasti-radius-card); box-shadow: 0 4px 16px rgba(22,24,29,.06); display: flex; flex-direction: column; overflow: hidden; transition: box-shadow .18s ease, transform .18s ease; }
.plasti-home-blog-card:hover { box-shadow: 0 14px 28px rgba(22,24,29,.12); transform: translateY(-3px); }
.plasti-home-blog-card__image { background: #e9ebed; display: block; overflow: hidden; }
.plasti-home-blog-card__image img { aspect-ratio: 16 / 9; display: block; object-fit: cover; transition: transform .25s ease; width: 100%; }
.plasti-home-blog-card:hover .plasti-home-blog-card__image img { transform: scale(1.035); }
.plasti-home-blog-card__body { display: flex; flex: 1; flex-direction: column; padding: 1.15rem; }
.plasti-home-blog-card h3 { font-size: 1.08rem; line-height: 1.35; margin: 0 0 .55rem; }
.plasti-home-blog-card h3 a { color: var(--plasti-ink); text-decoration: none; }
.plasti-home-blog-card p { color: #5f6670; font-size: .92rem; line-height: 1.55; margin: 0 0 1rem; }
.plasti-home-blog-card__link { color: #a87900; font-size: .9rem; font-weight: 800; margin-top: auto; text-decoration: none; }
.plasti-home-blog-card__link:hover { color: var(--plasti-ink); text-decoration: underline; }
.plasti-home-blog-teaser__mobile-all { display: none; margin: 1.25rem 0 0; text-align: center; }

@media (max-width: 767px) {
  .plasti-home-blog-teaser { margin-top: 2.5rem; padding: 2.5rem 0 3rem; }
  .plasti-home-blog-teaser__heading { display: block; }
  .plasti-home-blog-teaser__grid { grid-template-columns: 1fr; }
  .plasti-home-blog-teaser__mobile-all { display: block; }
}
/* PLASTI_BLOG_REBUILD_20260726 */
.plasti-blog-article .plasti-blog-figure{margin:1.5rem 0 2rem}.plasti-blog-article .plasti-blog-figure img{display:block;width:100%;height:auto;border-radius:10px;background:#f2f3f4}.plasti-blog-article .plasti-blog-figure figcaption,.plasti-blog-article .plasti-blog-video figcaption{margin-top:.6rem;color:#626a73;font-size:.9rem}.plasti-blog-article .plasti-blog-step{margin-top:1.6rem;font-weight:600}.plasti-blog-gallery-section{margin:2.4rem 0}.plasti-blog-gallery-section h2,.plasti-blog-videos h2{margin-bottom:1rem}.plasti-blog-video{margin:1.35rem 0 2.2rem}.plasti-blog-video__frame{position:relative;padding-top:56.25%;overflow:hidden;border-radius:10px;background:#16181d}.plasti-blog-video__frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.plasti-blog-card__placeholder{display:grid;place-items:center;min-height:165px;background:linear-gradient(135deg,#16181d,#343943);color:#f5b400;font-weight:800;letter-spacing:.06em}.plasti-blog-card__teaser{margin:0 1rem 1rem!important;color:#626a73;font-size:.92rem;line-height:1.45}.plasti-blog-card p:last-child{margin-top:auto}@media(max-width:575px){.plasti-blog-article .plasti-blog-figure{margin:1.2rem 0 1.6rem}.plasti-blog-video{margin:1.1rem 0 1.7rem}}


/* PLASTI_HERO_MOBILE_CSSONLY_20260726
   Mobile-only override. Desktop receives no new declarations. */
@media (max-width: 767px) {
  .plasti-hero {
    min-height: 650px !important;
    align-items: flex-start;
    background-image:
      linear-gradient(180deg, rgba(2,3,5,.72) 0%, rgba(2,3,5,.28) 53%, rgba(2,3,5,.04) 78%),
      url('../img/hero-plasti-dip-mobile.webp') !important;
    background-position: 74% bottom !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
  }
  .plasti-hero__inner { padding: 34px 20px 0; }
  .plasti-hero__tag { font-size: 10px; letter-spacing: .65px; margin-bottom: 14px; padding: 7px 10px; }
  .plasti-hero__title { font-size: 29px; line-height: 1.1; letter-spacing: -.7px; margin-bottom: 13px; max-width: 340px; }
  .plasti-hero__text { font-size: 14px; line-height: 1.45; max-width: 320px; margin-bottom: 20px; }
  .plasti-hero__ctas { gap: 10px; margin-bottom: 0; }
  .plasti-hero__btn { font-size: 14px; padding: 12px 17px; }
  .plasti-hero__meta { display: none; }
}

/* Plasti homepage/blog/FAQ UX, 2026-07-26 */
.ps-featuredproducts .module-products__buttons { display:none; }
.ps-featuredproducts .products { align-items:stretch; }
.ps-featuredproducts .product-miniature, .plasti-product-more-card { min-width:0; }
.plasti-product-more-card { align-items:center; background:linear-gradient(145deg,#171a20,#303946); border:1px solid #3b4654; border-radius:var(--plasti-radius-card,16px); box-shadow:0 3px 12px rgba(22,24,29,.12); color:#fff; display:flex; flex-direction:column; justify-content:center; min-height:100%; padding:1.15rem; text-align:center; text-decoration:none; transition:transform .18s ease,box-shadow .18s ease,background .18s ease; }
.plasti-product-more-card:hover { background:linear-gradient(145deg,#222a34,#3b4654); box-shadow:0 12px 26px rgba(22,24,29,.22); color:#fff; transform:translateY(-3px); }
.plasti-product-more-card:focus-visible, .plasti-home-blog-card__tap:focus-visible, .plasti-blog-card__tap:focus-visible { outline:3px solid var(--plasti-amber); outline-offset:3px; }
.plasti-product-more-card__eyebrow { color:var(--plasti-amber); font-size:.72rem; font-weight:800; letter-spacing:.09em; margin-bottom:.55rem; }
.plasti-product-more-card strong { font-size:1rem; line-height:1.35; }
.plasti-product-more-card__arrow { align-items:center; background:var(--plasti-amber); border-radius:50%; color:var(--plasti-ink); display:flex; font-size:1.15rem; height:2rem; justify-content:center; margin-top:1rem; width:2rem; }

.plasti-home-blog-card__tap, .plasti-blog-card__tap { color:inherit; display:block; height:100%; text-decoration:none; }
.plasti-home-blog-card__tap:hover, .plasti-blog-card__tap:hover { color:inherit; }
.plasti-home-blog-card__tap .plasti-home-blog-card, .plasti-blog-card__tap .plasti-blog-card { height:100%; }
.plasti-home-blog-card__link, .plasti-blog-card__link { color:#a87900; font-size:.9rem; font-weight:800; margin-top:auto; }
.plasti-home-blog-card__tap:hover .plasti-home-blog-card__link, .plasti-blog-card__tap:hover .plasti-blog-card__link { color:var(--plasti-ink); text-decoration:underline; }
.plasti-blog-card__body { display:flex; flex:1; flex-direction:column; }
.plasti-blog-card h2 { color:var(--plasti-ink); }
.plasti-blog-card__teaser { color:#5f6670; line-height:1.55; }
.plasti-blog-card__video { position:relative; }
.plasti-blog-card__video span { align-items:center; background:#f40022; border-radius:10px; color:#fff; display:flex; font-size:1.15rem; height:2.4rem; justify-content:center; left:50%; position:absolute; top:50%; transform:translate(-50%,-50%); width:3.45rem; }
.plasti-blog-card__fallback { align-items:center; background:linear-gradient(135deg,#111820,#4a5564); color:var(--plasti-amber); display:flex; font-size:1rem; font-weight:800; height:190px; justify-content:center; letter-spacing:.08em; }

.plasti-faq { margin:0 auto; max-width:900px; }
.plasti-faq__intro { background:linear-gradient(135deg,#171a20,#303946); border-radius:var(--plasti-radius-card,16px); color:#fff; margin-bottom:1.5rem; padding:2rem; }
.plasti-faq__intro h1 { color:#fff; margin:0 0 .7rem; }
.plasti-faq__intro p:last-child { color:#d9dee5; margin:0; }
.plasti-faq__eyebrow { color:var(--plasti-amber); font-size:.75rem; font-weight:800; letter-spacing:.1em; margin:0 0 .45rem; }
.plasti-faq__item { background:#fff; border:1px solid var(--plasti-line); border-radius:12px; box-shadow:0 2px 10px rgba(22,24,29,.04); margin:.8rem 0; overflow:hidden; }
.plasti-faq__item summary { color:var(--plasti-ink); cursor:pointer; font-weight:750; list-style:none; padding:1.05rem 3.25rem 1.05rem 1.2rem; position:relative; }
.plasti-faq__item summary::-webkit-details-marker { display:none; }
.plasti-faq__item summary::after { color:#9b7000; content:'−'; font-size:1.45rem; font-weight:400; position:absolute; right:1.15rem; top:.75rem; }
.plasti-faq__item:not([open]) summary::after { content:'+'; }
.plasti-faq__answer { border-top:1px solid var(--plasti-line); color:#444c56; line-height:1.65; padding:1rem 1.2rem 1.2rem; }
.plasti-faq__answer p { margin:0; }
@media (max-width:767px) { .plasti-product-more-card { min-height:11rem; } .plasti-faq__intro { padding:1.45rem; } .plasti-faq__item summary { padding-left:1rem; } .plasti-faq__answer { padding:1rem; } }

/* Mobile menu cache fix, 2026-07-26 */
@media (max-width: 1199.98px) {
  .ps-mainmenu.ps-mainmenu--desktop .menu-toggle {
    align-items:center !important;background:#fff !important;background-image:none !important;border:1px solid #d8dde3 !important;border-radius:10px !important;color:#16181d !important;display:inline-flex !important;height:42px !important;justify-content:center !important;min-width:46px !important;padding:0 !important;width:46px !important;
  }
  .ps-mainmenu.ps-mainmenu--desktop .menu-toggle .material-icons { color:#16181d !important;display:block !important;font-size:28px !important;line-height:1 !important; }
  .ps-mainmenu.ps-mainmenu--desktop .menu-toggle:hover { background:#f5b400 !important;border-color:#f5b400 !important;color:#16181d !important; }
  .ps-mainmenu.ps-mainmenu--desktop .menu-toggle:focus-visible { box-shadow:0 0 0 3px rgba(245,180,0,.45) !important;outline:2px solid #fff !important;outline-offset:2px !important; }
}

/* Product content belongs below both media and purchase columns. */
.page-product .product__bottom {
  display: block;
}
.page-product .product__bottom-left {
  max-width: none;
  width: 100%;
}
.page-product .product__accordion .accordion-body {
  max-width: none;
}
.page-product .details__manufacturer-logo {
  background: #fff;
  height: auto;
  max-height: 88px;
  object-fit: contain;
  padding: .35rem;
  width: auto;
}

/* ===== 13) KOMPAKTNÁ DESKTOPOVÁ HLAVIČKA =====
 * Hummingbird dáva odkazom menu 1.25rem vertikálneho paddingu a searchu
 * minimálne 19rem. Na notebooku sa preto navigácia zalomí do troch vysokých
 * riadkov. Mobilné zobrazenie ostáva bez zásahu. */
@media (min-width: 1200px) {
  .header-bottom {
    padding: .125rem 0;
  }

  .header-bottom__row {
    --bs-gutter-x: 1rem;
    align-items: center !important;
    flex-wrap: nowrap;
  }

  .header-bottom__logo {
    flex: 0 0 auto;
  }

  .header-bottom .navbar-brand {
    max-height: 3.25rem;
    max-width: 7rem;
  }

  .header-bottom .navbar-brand .logo {
    max-height: 3.25rem;
    max-width: 7rem;
  }

  .ps-mainmenu.ps-mainmenu--desktop {
    min-width: 0;
    padding-left: .25rem;
    padding-right: .25rem;
  }

  .ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__tree {
    column-gap: .125rem;
    row-gap: 0;
  }

  .ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__tree > li .ps-mainmenu__tree-link {
    font-size: .94rem;
    line-height: 1.2;
    padding: .625rem .3rem;
    white-space: nowrap;
  }

  .ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__tree > li .ps-mainmenu__tree-dropdown-toggle {
    padding: .625rem .05rem;
  }

  #_desktop_ps_searchbar {
    flex: 0 0 14.5rem;
    margin-left: .5rem !important;
    max-width: 14.5rem;
    min-width: 0;
    padding-left: 0;
  }

  #_desktop_ps_searchbar .ps-searchbar {
    margin-block: .25rem;
    min-width: 0;
    width: 100%;
  }

  #_desktop_ps_searchbar .ps-searchbar__input {
    font-size: .94rem;
    padding-block: .45rem;
  }
}

/* ===== 14) KOMPAKTNÝ CHECKOUT ===== */
body#checkout .checkout__navigation {
  padding-block: 1rem;
}

body#checkout .checkout__navigation .checkout-navigation-step__title {
  font-size: 1rem;
  line-height: 1.2;
}

body#checkout .checkout__navigation .checkout-navigation-step__number {
  height: 1.75rem;
  width: 1.75rem;
}

body#checkout .checkout-step__content {
  padding-top: 1rem;
}

body#checkout .checkout-step__content > h1,
body#checkout .checkout-step__content > .h1 {
  font-size: 1.75rem;
  margin-bottom: 1rem;
}

body#checkout .checkout-step .mb-3 {
  margin-bottom: .65rem !important;
}

body#checkout .checkout-step .form-label {
  font-size: .875rem;
  font-weight: 650;
  margin-bottom: .25rem;
}

body#checkout .checkout-step .form-control,
body#checkout .checkout-step .form-select {
  min-height: 2.65rem;
  padding-block: .45rem;
}

body#checkout .checkout-step .form-text {
  font-size: .78rem;
  margin-top: .2rem;
}

body#checkout .checkout-step hr {
  margin-block: 1rem;
}

body#checkout .delivery-option__label {
  padding-block: .85rem;
}

body#checkout .delivery-option__carrier-logo {
  max-height: 2.75rem;
  max-width: 6.5rem;
  object-fit: contain;
}

@media (min-width: 768px) {
  body#checkout .checkout__navigation {
    min-height: 0;
  }

  body#checkout .checkout-step .form-control,
  body#checkout .checkout-step .form-select {
    max-width: 42rem;
  }
}

/* Checkout density corrections for Hummingbird's actual component classes. */
body#checkout #header.js-sticky-header {
  position: static !important;
  top: auto !important;
}

body#checkout .checkout-steps {
  margin-bottom: .625rem !important;
  padding-block: .375rem !important;
}

body#checkout .checkout-steps__list {
  min-height: 0 !important;
}

body#checkout .checkout-steps__number {
  font-size: .7rem !important;
  height: 1.125rem !important;
  line-height: 1.125rem !important;
  margin-bottom: 0 !important;
  width: 1.125rem !important;
}

body#checkout .checkout-steps__btn {
  font-size: .75rem !important;
  line-height: 1.1 !important;
  padding: 0 .25rem !important;
}

body#checkout .checkout-grid__content {
  margin-bottom: 1.5rem !important;
}

body#checkout .step__title .page-title-section {
  font-size: 1.35rem !important;
  line-height: 1.2 !important;
  margin-bottom: .35rem !important;
}

body#checkout .step__title hr {
  margin-block: .35rem !important;
}

body#checkout .step .step__content {
  padding-top: .35rem !important;
}

body#checkout .step .mb-3 {
  margin-bottom: .5rem !important;
}

body#checkout .step .form-label {
  font-size: .82rem !important;
  line-height: 1.2 !important;
  margin-bottom: .2rem !important;
}

body#checkout .step .form-control,
body#checkout .step .form-select {
  font-size: .95rem !important;
  min-height: 2.35rem !important;
  padding-block: .35rem !important;
}

body#checkout .step .form-text,
body#checkout .step .form-control-comment {
  font-size: .74rem !important;
  line-height: 1.25 !important;
  margin-top: .15rem !important;
}

body#checkout .step .nav {
  margin-bottom: .75rem !important;
}

body#checkout .step .nav-link {
  font-size: .9rem !important;
  padding: .35rem .5rem !important;
}

body#checkout #checkout-addresses-step .step__content > p {
  font-size: .9rem !important;
  line-height: 1.4 !important;
  margin-bottom: .65rem !important;
}

@media (max-width: 767.98px) {
  body#checkout .checkout-steps {
    margin-bottom: .5rem !important;
    padding-block: .25rem !important;
  }
}

/* Compact order confirmation and bank-wire payment details. */
body#order-confirmation .page-header,
body#order-confirmation .page-order-confirmation__header {
  margin-bottom: .75rem !important;
  padding-block: .75rem !important;
}

body#order-confirmation .page-title,
body#order-confirmation .page-title-section {
  font-size: 1.45rem !important;
  line-height: 1.2 !important;
  margin-bottom: .5rem !important;
}

body#order-confirmation .card,
body#order-confirmation .order-confirmation__payment {
  margin-bottom: .75rem !important;
}

body#order-confirmation .card-body,
body#order-confirmation .order-confirmation__payment {
  padding: 1rem !important;
}

.plasti-bankwire-return__intro,
.plasti-bankwire-return__note {
  margin: 0 0 .75rem;
}

.plasti-bankwire-details {
  background: #f6f7f8;
  display: grid;
  grid-template-columns: minmax(9rem, 14rem) 1fr;
  margin: 0 0 .75rem;
}

.plasti-bankwire-details dt,
.plasti-bankwire-details dd {
  border-bottom: 1px solid #dfe3e7;
  margin: 0;
  padding: .5rem .75rem;
}

.plasti-bankwire-details dt {
  font-size: .875rem;
  font-weight: 700;
}

.plasti-bankwire-details dd {
  font-size: .9rem;
  overflow-wrap: anywhere;
}

.plasti-bankwire-details dt:nth-last-of-type(1),
.plasti-bankwire-details dd:last-child {
  border-bottom: 0;
}

@media (max-width: 575.98px) {
  .plasti-bankwire-details {
    grid-template-columns: 1fr;
  }

  .plasti-bankwire-details dt {
    border-bottom: 0;
    padding-bottom: .1rem;
  }

  .plasti-bankwire-details dd {
    padding-top: .1rem;
  }
}
