/* ============================================================
   HOMEPAGE PERFORMANCE — Podno Grijanje
   Lakši paint/composite za slabije računare, bez promjene rasporeda.
   ============================================================ */

body.home-page{
  /* Veliki gradijenti preko cijelog dokumenta su skupi pri skrolanju. */
  background:#f3f5f8;
}

/* Svaka velika sekcija se iscrtava u svom području, pa promjena jedne
   kartice ne tjera browser da ponovo boji ostatak duge naslovne. */
body.home-page .hero,
body.home-page .category-cards,
body.home-page .info-section,
body.home-page .montaza-cards,
body.home-page .showcase-columns,
body.home-page .banners-section,
body.home-page .heating-overlap,
body.home-page .reward-card,
body.home-page .pg-cta-hub,
body.home-page .site-footer{
  contain:layout paint;
}

/* Browser preskače layout i paint sekcija koje su daleko ispod ekrana. */
@supports (content-visibility:auto){
  body.home-page .info-section,
  body.home-page .montaza-cards,
  body.home-page .showcase-columns,
  body.home-page .banners-section,
  body.home-page .heating-overlap,
  body.home-page .reward-card,
  body.home-page .pg-cta-hub,
  body.home-page .site-footer{
    content-visibility:auto;
    contain-intrinsic-size:auto 820px;
  }

  body.home-page .showcase-columns{
    contain-intrinsic-size:auto 1800px;
  }
}

/* Backdrop blur je najveći uzrok GPU repainta tokom skrolanja. */
body.home-page .hero-content,
body.home-page .showcase-col,
body.home-page .text-card,
body.home-page .gallery-caption,
body.home-page .banner-overlay{
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}

body.home-page .hero-content{
  background:rgba(15,23,42,.82);
  box-shadow:0 14px 34px rgba(0,0,0,.20);
}

body.home-page .showcase-col,
body.home-page .pg-cta-actions{
  background:#fff;
}

body.home-page .text-card{
  background:#303030;
}

/* Jednostavnije podloge zadržavaju profesionalan izgled bez velikih
   višeslojnih radial-gradient površina. */
body.home-page .category-cards{
  background:linear-gradient(180deg,#fff 0%,#f8fafc 100%);
}
body.home-page .info-section{
  background:#f1f4f8;
  background-size:auto;
}
body.home-page .montaza-cards{
  background:#fff;
}
body.home-page .showcase-columns{
  background:#eef2f6;
}
body.home-page .banners-section{
  background:#fff;
}
body.home-page .pg-cta-hub{
  background:#f2f5f8;
}

/* Smanjen blur radius sjenki. Brojne velike sjenke su bile skupe dok
   se istovremeno pomjeralo mnogo kartica. */
body.home-page .category-cards .card,
body.home-page .info-card,
body.home-page .mc-card,
body.home-page .showcase-col,
body.home-page .product-card.sm,
body.home-page .banner-item,
body.home-page .pg-cta-card,
body.home-page .pg-cta-actions{
  box-shadow:0 6px 18px rgba(15,23,42,.075);
}

body.home-page .site-footer{
  box-shadow:none;
}

body.home-page .image-collage img,
body.home-page .reward-image img{
  box-shadow:0 6px 18px rgba(0,0,0,.20);
}

/* Uklonjeno stalno skaliranje slika i pomjeranje velikih kartica.
   Hover ostaje kroz boju/border, ali bez novih kompozitnih slojeva. */
body.home-page .card,
body.home-page .card img,
body.home-page .info-card,
body.home-page .info-card .read-more,
body.home-page .mc-card,
body.home-page .product-card.sm,
body.home-page .product-card.sm img,
body.home-page .banner-item,
body.home-page .banner-item img,
body.home-page .image-collage img,
body.home-page .pg-cat-btn,
body.home-page .pg-cta-line{
  transition:color .12s ease,border-color .12s ease,background-color .12s ease,opacity .12s ease !important;
}

body.home-page .card:hover,
body.home-page .info-card:hover,
body.home-page .mc-card:hover,
body.home-page .product-card.sm:hover,
body.home-page .banner-item:hover,
body.home-page .pg-cat-btn:hover,
body.home-page .pg-cta-line:hover{
  transform:none !important;
}

body.home-page .card:hover img,
body.home-page .product-card.sm:hover img,
body.home-page .banner-item:hover img,
body.home-page .image-collage img:hover{
  transform:none !important;
}

body.home-page .category-cards .card:hover,
body.home-page .info-card:hover,
body.home-page .mc-card:hover,
body.home-page .product-card.sm:hover,
body.home-page .banner-item:hover{
  box-shadow:0 8px 22px rgba(15,23,42,.10);
}

body.home-page .hero-content{
  animation:none !important;
}

/* Picture elementi moraju zadržati isti grid raspored kao stare img klase. */
body.home-page .banner-item picture,
body.home-page .reward-image picture{
  display:block;
  width:100%;
  height:100%;
}
body.home-page .banner-item picture img,
body.home-page .reward-image picture img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

body.home-page .image-collage picture{
  display:block;
  min-width:0;
  overflow:hidden;
  border-radius:14px;
}
body.home-page .image-collage picture.img-large{
  grid-column:span 2;
  height:320px;
}
body.home-page .image-collage picture.img-medium{height:220px;}
body.home-page .image-collage picture.img-small{height:180px;}
body.home-page .image-collage picture img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:0;
}

/* Kad korisnik traži manje pokreta, potpuno ukloni animacije. */
@media (prefers-reduced-motion:reduce){
  body.home-page *,
  body.home-page *::before,
  body.home-page *::after{
    scroll-behavior:auto !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
}

@media (max-width:992px){
  body.home-page .image-collage picture.img-large{height:300px;}
  body.home-page .image-collage picture.img-medium{height:205px;}
  body.home-page .image-collage picture.img-small{height:175px;}
}

@media (max-width:640px){
  /* Na mobilnim i integrisanim GPU-ovima dodatno pojednostavi sjenke. */
  body.home-page .category-cards .card,
  body.home-page .info-card,
  body.home-page .mc-card,
  body.home-page .showcase-col,
  body.home-page .product-card.sm,
  body.home-page .banner-item,
  body.home-page .pg-cta-card,
  body.home-page .pg-cta-actions{
    box-shadow:0 3px 12px rgba(15,23,42,.07);
  }

  body.home-page .image-collage picture.img-large{height:240px;}
  body.home-page .image-collage picture.img-medium,
  body.home-page .image-collage picture.img-small{height:170px;}
}