/* =================================================
   REFINEMENTS
   (DODACI NA POSTOJEĆI DESIGN – NE DIRAJU LAYOUT)
================================================= */

/* =================================================
   JEDINSTVEN IMAGE HOVER SISTEM (PVC-INTRO MODEL)
   – za SVE slike na sajtu
   – osim GALERIJE i HERO pozadine
================================================= */

/* SVI WRAPPERI KOJI DRŽE SLIKE */
.product-image,
.product-image-grid,
.window-item,
.about-images,
.image-stack,
.image-grid-4,
.pvc-intro-image,
.door-system-wrapper,
.product-row .product-image {
    position: relative;
    overflow: hidden;
    border-radius: 16px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* SVE SLIKE UNUTAR WRAPPERA */
.product-image img,
.product-image-grid img,
.window-item img,
.about-images img,
.image-stack img,
.image-grid-4 img,
.pvc-intro-image img,
.door-system-wrapper img,
.product-row .product-image img {
    display: block;
    width: 100%;
    height: auto;
    transition: transform 0.35s ease;
}

/* HOVER – blagi lift samo na karticama, ne na product uvodu */
.window-item:hover,
.door-system-wrapper:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16);
}

.product-image:hover,
.product-image-grid:hover,
.about-images:hover,
.image-stack:hover,
.image-grid-4:hover,
.pvc-intro-image:hover,
.product-row .product-image:hover {
    transform: none;
    box-shadow: none;
}

/* HOVER – SLIKA SE BLAGO UVEĆA UNUTRA */
.product-image:hover img,
.product-image-grid:hover img,
.window-item:hover img,
.about-images:hover img,
.image-stack:hover img,
.image-grid-4:hover img,
.pvc-intro-image:hover img,
.door-system-wrapper:hover img,
.product-row .product-image:hover img {
    transform: scale(1.05);
}
/* ❌ GALERIJA NE KORISTI OVAJ EFEKAT */
.galerija-grid,
.galerija-grid * {
    transform: none !important;
}

/* =================================================
   CTA SEKCIJA — POZIV NA AKCIJU
================================================= */

.cta-section {
    max-width: 1100px;
    margin: 60px auto;
    padding: 40px 20px;
    text-align: center;
}

.cta-main {
    text-decoration: none;
}

.cta-main h2 {
    display: inline-block;
    background: #FFA500;
    color: #ffffff;
    padding: 26px 36px;
    border-radius: 14px;
    font-size: 28px;
    font-weight: 700;
    transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
}

.cta-main:hover h2 {
    background: #b58b2a;
    transform: translateY(-6px);
    box-shadow: 0 16px 38px rgba(0,0,0,0.28);
}

/* PARTNER LOGOI */
.cta-partners {
    margin-top: 28px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 40px;
}

.cta-partners img {
    height: 46px;
    width: auto;
    opacity: 0.85;
    filter: grayscale(100%);
    transition: transform 0.25s ease, filter 0.25s ease, opacity 0.25s ease;
}

.cta-partners a:hover img {
    transform: scale(1.06);
    filter: grayscale(0%);
    opacity: 1;
}

/* RESPONSIVE */
@media (max-width: 600px) {
    .cta-main h2 {
        font-size: 22px;
        padding: 20px 24px;
    }

    .cta-partners {
        flex-direction: column;
        gap: 20px;
    }
}
/* =================================================
   BENEFIT / PRODUCT CARDS – JEDINSTVEN HOVER EFEKAT
   (kao na početnoj)
================================================= */

.card {
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.card:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.18);
}
/* =================================================
   BENEFIT GRID – JEDINSTVEN POLOŽAJ (KAO PVC PROZORI)
================================================= */

.products .galerija-grid {
    max-width: 1100px;   /* ← REFERENCA: PVC prozori */
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
}
/* =================================================
   BENEFIT BOXOVI – ISTA DIMENZIJA SVI
================================================= */


@media (max-width: 1024px) {
  .galerija-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .galerija-grid {
    grid-template-columns: 1fr;
  }
}


/* =================================================
   BENEFIT BOXOVI – ISTA ŠIRINA (VIZUELNO)
================================================= */



/* CARD – ZAKLJUČANA TAČNA ŠIRINA */
.products .card {
    box-sizing: border-box;
    width: 100%;
}
/* =========================================
   WINDOW TYPES – UJEDNAČENA VISINA SLIKA
========================================= */

.window-item {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.window-item img {
    width: 100%;
    height: 160px;            /* 🔑 KLJUČNA LINIJA */
    object-fit: cover;        /* popuni okvir lijepo */
    border-radius: 16px;
}
/* PANEL VRATA – DIMENZIJA SLIKA */
.galerija-grid .gal-item {
    width: 100%;
    height: 400px;        /* ⬅ OVDJE MIJENJAŠ VISINU */
    object-fit: cover;    /* popuni lijepo okvir */
    border-radius: 16px;
}
.psk-hero {
    background: url('../img/hst-novi.webp') center / cover no-repeat;
    min-height: 320px;
}
/* Product image layout handled in modern.css */