{"id":73,"date":"2025-11-07T13:46:24","date_gmt":"2025-11-07T13:46:24","guid":{"rendered":"https:\/\/zaza.hr\/?page_id=73"},"modified":"2026-09-12T20:13:28","modified_gmt":"2026-09-12T18:13:28","slug":"home","status":"publish","type":"page","link":"https:\/\/zaza.hr\/hr\/","title":{"rendered":"Home"},"content":{"rendered":"\n\n\n<div class=\"zaza-clean-video-hero\" id=\"zazaCleanVideoHero\">\n  \n  <!-- VIDEO CONTAINER -->\n  <div class=\"zaza-video-container\" id=\"zazaVideoContainer\">\n    <!-- Video se u\u010ditava dinami\u010dki ovisno o ure\u0111aju -->\n  <\/div>\n\n  <!-- NATPISI U JEDNOM REDU -->\n  <div class=\"zaza-hero-nav-links\">\n    <a href=\"https:\/\/zaza.hr\/shop\" class=\"zaza-hero-btn\">SHOP<\/a>\n    <a href=\"https:\/\/zaza.hr\/zaza\" class=\"zaza-hero-btn\">STORY<\/a>\n    <a href=\"https:\/\/zaza.hr\/showroom\" class=\"zaza-hero-btn\">SHOWROOM<\/a>\n  <\/div>\n\n<\/div>\n\n<!-- Stilovi -->\n<style>\n.zaza-clean-video-hero {\n    position: relative;\n    width: 100vw !important;\n    max-width: 100% !important;\n    left: 50%;\n    right: 50%;\n    margin-left: -50vw !important;\n    margin-right: -50vw !important;\n    height: 100vh !important;\n    overflow: hidden;\n    background-color: #000;\n}\n\n.zaza-video-container {\n    width: 100%;\n    height: 100%;\n}\n\n.zaza-bg-video {\n    width: 100%;\n    height: 100%;\n    object-fit: cover !important;\n    display: block;\n}\n\n\/* CONTAINER ZA NATPISE - SVE U JEDNOM REDU *\/\n.zaza-hero-nav-links {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    z-index: 10;\n    display: flex;\n    flex-direction: row;              \/* Postavlja natpise u jedan red *\/\n    align-items: center;\n    justify-content: center;\n    gap: 40px;                       \/* Razmak izme\u0111u natpisa na Desktopu *\/\n    width: 90%;\n    max-width: 1200px;\n    pointer-events: auto;\n    text-align: center;\n}\n\n\/* LINKOVI \/ NATPISI (BEZ SJENE) *\/\na.zaza-hero-btn,\na.zaza-hero-btn:link,\na.zaza-hero-btn:visited {\n    color: #ea9ea1 !important;        \/* Pantone 4067 U roza *\/\n    font-size: 3.2rem !important;     \/* Smanjena veli\u010dina slova za desktop *\/\n    font-weight: 800 !important;\n    text-transform: uppercase !important;\n    text-decoration: none !important;\n    letter-spacing: 5px !important;\n    display: inline-block;\n    transition: all 0.25s ease;\n    text-shadow: none !important;     \/* Uklonjena sjena teksta *\/\n    white-space: nowrap;              \/* Ne prelama rije\u010di u novi red *\/\n}\n\n\/* NA DODIR \/ KLIK \/ HOVER (BEZ SJENE) *\/\na.zaza-hero-btn:hover,\na.zaza-hero-btn:active,\na.zaza-hero-btn:focus {\n    color: #bf3132 !important;        \/* Pantone 3546 U crvena *\/\n    transform: scale(1.08);\n    text-shadow: none !important;     \/* Uklonjena sjena na hoveru *\/\n}\n\n\/* MOBITEL PRILAGODBA *\/\n@media (max-width: 768px) {\n    .zaza-clean-video-hero {\n        height: 100vh !important;\n        margin-left: 0 !important;\n        margin-right: 0 !important;\n        left: 0;\n        right: 0;\n        width: 100% !important;\n    }\n\n    .zaza-hero-nav-links {\n        gap: 12px;                   \/* Zbijeni razmak na mobitelu *\/\n        width: 98%;\n    }\n\n    a.zaza-hero-btn,\n    a.zaza-hero-btn:link,\n    a.zaza-hero-btn:visited {\n        font-size: 1.35rem !important; \/* Stane sve u 1 red na mobitelu *\/\n        letter-spacing: 2px !important;\n    }\n}\n<\/style>\n\n<!-- Skripta s prisilnim ponavljanjem (forcing loop) za mobitele -->\n<script>\n(function() {\n    var isMob = window.innerWidth <= 768;\n    \n    \/\/ To\u010dni linkovi za pojedina\u010dne videa\n    var mobVideo = \"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/ZAZA3_ZA-MOB.mp4\";\n    var deskVideo = \"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/ZAZA1_za-web.mp4\";\n\n    var selectedVideo = isMob ? mobVideo : deskVideo;\n    var container = document.getElementById('zazaVideoContainer');\n\n    function loadHeroVideo() {\n        if (!container) return;\n        \n        container.innerHTML = '<video class=\"zaza-bg-video\" autoplay muted loop playsinline preload=\"auto\">' +\n                                '<source src=\"' + selectedVideo + '\" type=\"video\/mp4\">' +\n                              '<\/video>';\n                              \n        var vid = container.querySelector('video');\n        if (vid) {\n            \/\/ Pokretanje\n            var playPromise = vid.play();\n            if (playPromise !== undefined) {\n                playPromise.catch(function(e) { console.log(\"Autoplay inicijalizacija:\", e); });\n            }\n\n            \/\/ FORSIRANI RESTART ZA MOBITELE (ako mobilni preglednik ignorira 'loop')\n            vid.addEventListener('ended', function() {\n                vid.currentTime = 0;\n                vid.play();\n            }, false);\n        }\n    }\n\n    if (document.readyState === 'complete') {\n        loadHeroVideo();\n    } else {\n        window.addEventListener('load', loadHeroVideo);\n    }\n})();\n<\/script>\n\n\n\n<div class=\"zaza-tulum-slider\" id=\"zazaTulumSlider\">\n  \n  <!-- Slike koje se vrte -->\n  <div class=\"zaza-tulum-slides-container\">\n    <div class=\"zaza-tulum-slide active\">\n      <img decoding=\"async\" \n        src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/09\/WhatsApp-Image-2026-09-12-at-11.03.18.jpeg\" \n        alt=\"Zaza Tulum 1\"\n        loading=\"eager\"\n        fetchpriority=\"high\"\n      >\n    <\/div>\n\n    <div class=\"zaza-tulum-slide\">\n      <img decoding=\"async\" \n        src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/09\/ll.jpeg\" \n        alt=\"Zaza Tulum 2\"\n      >\n    <\/div>\n  <\/div>\n\n  <!-- Fiksni natpis TULUM u sredini -->\n  <div class=\"zaza-tulum-fiksni-tekst\">\n    <a href=\"https:\/\/zaza.hr\/product-category\/tulum\" class=\"zaza-tulum-link\">\n      TULUM\n    <\/a>\n  <\/div>\n\n  <!-- Strelice -->\n  <button class=\"zaza-tulum-nav-btn prev\" onclick=\"zazaTulumGoToSlide(zazaTulumCurrentIdx - 1)\">&#10094;<\/button>\n  <button class=\"zaza-tulum-nav-btn next\" onclick=\"zazaTulumGoToSlide(zazaTulumCurrentIdx + 1)\">&#10095;<\/button>\n\n  <!-- 2 MALA LOGOTIPA PRI DNU -->\n  <div class=\"zaza-tulum-logos-nav\">\n    <div class=\"zaza-tulum-mini-logo active\" onclick=\"zazaTulumGoToSlide(0)\"><\/div>\n    <div class=\"zaza-tulum-mini-logo\" onclick=\"zazaTulumGoToSlide(1)\"><\/div>\n  <\/div>\n\n<\/div>\n\n<!-- Stilovi -->\n<style>\n.zaza-tulum-slider {\n    position: relative;\n    width: 100vw !important;\n    max-width: 100% !important;\n    left: 50%;\n    right: 50%;\n    margin-left: -50vw !important;\n    margin-right: -50vw !important;\n    height: 100vh !important;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    overflow: hidden;\n    background-color: transparent;\n    touch-action: pan-y;\n}\n\n\/* Fiksni tekst TULUM u sredini *\/\n.zaza-tulum-fiksni-tekst {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    z-index: 10;\n    pointer-events: auto;\n    text-align: center;\n}\n\na.zaza-tulum-link,\na.zaza-tulum-link:link,\na.zaza-tulum-link:visited {\n    color: #ea9ea1 !important;\n    font-size: 6.5rem !important;\n    font-weight: 800 !important;\n    text-transform: uppercase !important;\n    text-decoration: none !important;\n    letter-spacing: 8px !important;\n    display: inline-block;\n    transition: all 0.25s ease;\n    text-shadow: 0px 4px 12px rgba(0,0,0,0.12);\n}\n\n\/* Hover \/ klik *\/\na.zaza-tulum-link:hover,\na.zaza-tulum-link:active,\na.zaza-tulum-link:focus {\n    color: #bf3132 !important;\n    transform: scale(1.08);\n    text-shadow: 0px 4px 16px rgba(191, 49, 50, 0.35);\n}\n\n\/* Slajdovi *\/\n.zaza-tulum-slides-container {\n    position: relative;\n    width: 100%;\n    height: 100%;\n}\n\n.zaza-tulum-slide {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    opacity: 0 !important;\n    transition: opacity 0.8s ease-in-out !important;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    z-index: 1;\n}\n\n.zaza-tulum-slide.active {\n    opacity: 1 !important;\n    z-index: 2;\n}\n\n.zaza-tulum-slide img {\n    max-width: 100%;\n    max-height: 100%;\n    width: auto;\n    height: auto;\n    object-fit: contain !important;\n    user-select: none;\n    -webkit-user-drag: none;\n    display: block;\n}\n\n\/* Strelice *\/\n.zaza-tulum-nav-btn {\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    background: none !important;\n    border: none !important;\n    color: #ea9ea1 !important;\n    font-size: 48px !important;\n    padding: 20px;\n    cursor: pointer;\n    z-index: 12;\n    transition: all 0.25s ease;\n    user-select: none;\n    outline: none;\n}\n\n.zaza-tulum-nav-btn:hover,\n.zaza-tulum-nav-btn:active,\n.zaza-tulum-nav-btn:focus {\n    color: #bf3132 !important;\n    transform: translateY(-50%) scale(1.25);\n    filter: drop-shadow(0px 2px 8px rgba(191, 49, 50, 0.4));\n}\n\n.zaza-tulum-nav-btn.prev { left: 30px; }\n.zaza-tulum-nav-btn.next { right: 30px; }\n\n\/* 2 MALA LOGOTIPA PRI DNU *\/\n.zaza-tulum-logos-nav {\n    position: absolute;\n    bottom: 30px;\n    left: 50%;\n    transform: translateX(-50%);\n    z-index: 12;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.zaza-tulum-mini-logo {\n    width: 55px;\n    height: 32px;\n    background-color: #ea9ea1;\n    -webkit-mask: url('https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/Prirucnik-logotip-varijacija-ZAZA-02.png') no-repeat center \/ contain;\n    mask: url('https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/Prirucnik-logotip-varijacija-ZAZA-02.png') no-repeat center \/ contain;\n    opacity: 0.5 !important;\n    transform: scale(1) !important;\n    margin: 0 -8px;\n    cursor: pointer;\n    transition: all 0.35s ease-in-out !important;\n    position: relative;\n    z-index: 1;\n}\n\n.zaza-tulum-mini-logo:hover {\n    background-color: #bf3132 !important;\n    opacity: 0.85 !important;\n}\n\n\/* AKTIVNI LOGO *\/\n.zaza-tulum-mini-logo.active {\n    background-color: #bf3132 !important;\n    opacity: 1 !important;\n    transform: scale(1.5) !important;\n    filter: drop-shadow(0px 2px 8px rgba(191, 49, 50, 0.45)) !important;\n    margin: 0 6px !important;\n    z-index: 10 !important;\n}\n\n\/* MOBITEL PRILAGODBA *\/\n@media (max-width: 768px) {\n    .zaza-tulum-slider {\n        height: 100vh !important;\n        margin-left: 0 !important;\n        margin-right: 0 !important;\n        left: 0;\n        right: 0;\n        width: 100% !important;\n    }\n    \n    .zaza-tulum-slide img {\n        object-fit: cover !important;\n        width: 100%;\n        height: 100%;\n    }\n\n    a.zaza-tulum-link,\n    a.zaza-tulum-link:link,\n    a.zaza-tulum-link:visited {\n        font-size: 3.8rem !important;\n        letter-spacing: 4px !important;\n    }\n\n    .zaza-tulum-logos-nav {\n        bottom: 25px;\n    }\n\n    .zaza-tulum-mini-logo {\n        width: 40px;\n        height: 24px;\n        margin: 0 -6px;\n    }\n\n    .zaza-tulum-mini-logo.active {\n        transform: scale(1.4) !important;\n        margin: 0 4px !important;\n    }\n\n    .zaza-tulum-nav-btn {\n        font-size: 30px !important;\n        padding: 10px;\n    }\n\n    .zaza-tulum-nav-btn.prev { left: 10px; }\n    .zaza-tulum-nav-btn.next { right: 10px; }\n}\n<\/style>\n\n<!-- Skripta -->\n<script>\nwindow.zazaTulumCurrentIdx = 0;\nwindow.zazaTulumAutoTimer = null;\n\nfunction zazaTulumGoToSlide(targetIdx) {\n    var slides = document.querySelectorAll('#zazaTulumSlider .zaza-tulum-slide');\n    var logos = document.querySelectorAll('#zazaTulumSlider .zaza-tulum-mini-logo');\n    \n    if (!slides || slides.length === 0) return;\n\n    if (targetIdx >= slides.length) {\n        window.zazaTulumCurrentIdx = 0;\n    }\n    else if (targetIdx < 0) {\n        window.zazaTulumCurrentIdx = slides.length - 1;\n    }\n    else {\n        window.zazaTulumCurrentIdx = targetIdx;\n    }\n\n    for (var i = 0; i < slides.length; i++) {\n        slides[i].classList.remove('active');\n    }\n\n    slides[window.zazaTulumCurrentIdx].classList.add('active');\n\n    for (var j = 0; j < logos.length; j++) {\n        logos[j].classList.remove('active');\n    }\n\n    if (logos[window.zazaTulumCurrentIdx]) {\n        logos[window.zazaTulumCurrentIdx].classList.add('active');\n    }\n\n    zazaTulumResetTimer();\n}\n\nfunction zazaTulumResetTimer() {\n    if (window.zazaTulumAutoTimer) {\n        clearInterval(window.zazaTulumAutoTimer);\n    }\n\n    window.zazaTulumAutoTimer = setInterval(function() {\n        zazaTulumGoToSlide(window.zazaTulumCurrentIdx + 1);\n    }, 4000);\n}\n\n(function() {\n\n    zazaTulumGoToSlide(0);\n\n    var sliderEl = document.getElementById('zazaTulumSlider');\n\n    if (sliderEl) {\n        var startX = 0;\n\n        sliderEl.addEventListener('touchstart', function(e) {\n            startX = e.touches[0].clientX;\n        }, {passive: true});\n\n        sliderEl.addEventListener('touchend', function(e) {\n            var diff = startX - e.changedTouches[0].clientX;\n\n            if (Math.abs(diff) > 40) {\n                if (diff > 0) {\n                    zazaTulumGoToSlide(window.zazaTulumCurrentIdx + 1);\n                }\n                else {\n                    zazaTulumGoToSlide(window.zazaTulumCurrentIdx - 1);\n                }\n            }\n        }, {passive: true});\n    }\n\n})();\n<\/script>\n&#8220;`\n\n\n\n<div class=\"zaza-v4-slider\" id=\"zazaV4Slider\">\n  \n  <!-- Slike koje se vrte -->\n  <div class=\"zaza-v4-slides-container\">\n    <div class=\"zaza-v4-slide active\">\n      <img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/1O0A0315-scaled.jpg\" alt=\"Zaza Set 1\">\n    <\/div>\n    <div class=\"zaza-v4-slide\">\n      <img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/1O0A0178-scaled.jpg\" alt=\"Zaza Set 2\">\n    <\/div>\n    <div class=\"zaza-v4-slide\">\n      <img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/1O0A0163-scaled.jpg\" alt=\"Zaza Set 3\">\n    <\/div>\n    <div class=\"zaza-v4-slide\">\n      <img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/1O0A0146-scaled.jpg\" alt=\"Zaza Set 4\">\n    <\/div>\n  <\/div>\n\n  <!-- Fiksni natpis SET u sredini -->\n  <div class=\"zaza-v4-fiksni-tekst\">\n    <a href=\"https:\/\/zaza.hr\/product-category\/set\" class=\"zaza-v4-set-link\">\n      SET\n    <\/a>\n  <\/div>\n\n  <!-- Strelice -->\n  <button class=\"zaza-v4-nav-btn prev\" onclick=\"zazaV4GoToSlide(zazaV4CurrentIdx - 1)\">&#10094;<\/button>\n  <button class=\"zaza-v4-nav-btn next\" onclick=\"zazaV4GoToSlide(zazaV4CurrentIdx + 1)\">&#10095;<\/button>\n\n  <!-- 4 MALA LOGOTIPA PRI DNU -->\n  <div class=\"zaza-v4-logos-nav\">\n    <div class=\"zaza-v4-mini-logo active\" onclick=\"zazaV4GoToSlide(0)\"><\/div>\n    <div class=\"zaza-v4-mini-logo\" onclick=\"zazaV4GoToSlide(1)\"><\/div>\n    <div class=\"zaza-v4-mini-logo\" onclick=\"zazaV4GoToSlide(2)\"><\/div>\n    <div class=\"zaza-v4-mini-logo\" onclick=\"zazaV4GoToSlide(3)\"><\/div>\n  <\/div>\n\n<\/div>\n\n<!-- Stilovi -->\n<style>\n.zaza-v4-slider {\n    position: relative;\n    width: 100vw !important;           \/* Puna \u0161irina ekrana *\/\n    max-width: 100% !important;\n    left: 50%;\n    right: 50%;\n    margin-left: -50vw !important;\n    margin-right: -50vw !important;\n    height: 100vh !important;          \/* Puna visina ekrana (100vh) *\/\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    overflow: hidden;\n    background-color: transparent;\n    touch-action: pan-y;\n}\n\n\/* Fiksni tekst SET u sredini *\/\n.zaza-v4-fiksni-tekst {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    z-index: 10;\n    pointer-events: auto;\n    text-align: center;\n}\n\na.zaza-v4-set-link,\na.zaza-v4-set-link:link,\na.zaza-v4-set-link:visited {\n    color: #ea9ea1 !important;        \/* Pantone 4067 U roza boja *\/\n    font-size: 6.5rem !important;\n    font-weight: 800 !important;\n    text-transform: uppercase !important;\n    text-decoration: none !important;\n    letter-spacing: 8px !important;\n    display: inline-block;\n    transition: all 0.25s ease;\n    text-shadow: 0px 4px 12px rgba(0,0,0,0.12);\n}\n\n\/* NA DODIR\/KLIK\/HOVER: Preboja natpis SET u Pantone 3546 U crvenu (#bf3132) *\/\na.zaza-v4-set-link:hover,\na.zaza-v4-set-link:active,\na.zaza-v4-set-link:focus {\n    color: #bf3132 !important;        \/* Pantone 3546 U crvena *\/\n    transform: scale(1.08);\n    text-shadow: 0px 4px 16px rgba(191, 49, 50, 0.35);\n}\n\n\/* Slajdovi *\/\n.zaza-v4-slides-container {\n    position: relative;\n    width: 100%;\n    height: 100%;\n}\n\n.zaza-v4-slide {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    opacity: 0 !important;\n    transition: opacity 0.8s ease-in-out !important;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    z-index: 1;\n}\n\n.zaza-v4-slide.active {\n    opacity: 1 !important;\n    z-index: 2;\n}\n\n.zaza-v4-slide img {\n    max-width: 100%;\n    max-height: 100%;\n    width: auto;\n    height: auto;\n    object-fit: contain !important;    \/* Slika se prikazuje bez zumiranja i rezanja *\/\n    user-select: none;\n    -webkit-user-drag: none;\n}\n\n\/* Strelice *\/\n.zaza-v4-nav-btn {\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    background: none !important;\n    border: none !important;\n    color: #ea9ea1 !important;        \/* Osnovna Pantone roza boja *\/\n    font-size: 48px !important;\n    padding: 20px;\n    cursor: pointer;\n    z-index: 12;\n    transition: all 0.25s ease;\n    user-select: none;\n    outline: none;\n}\n\n\/* NA DODIR\/KLIK\/HOVER: Preboja strelice u Pantone 3546 U crvenu (#bf3132) *\/\n.zaza-v4-nav-btn:hover,\n.zaza-v4-nav-btn:active,\n.zaza-v4-nav-btn:focus {\n    color: #bf3132 !important;        \/* Pantone 3546 U crvena *\/\n    transform: translateY(-50%) scale(1.25);\n    filter: drop-shadow(0px 2px 8px rgba(191, 49, 50, 0.4));\n}\n\n.zaza-v4-nav-btn.prev { left: 30px; }\n.zaza-v4-nav-btn.next { right: 30px; }\n\n\/* 4 MALA LOGOTIPA PRI DNU *\/\n.zaza-v4-logos-nav {\n    position: absolute;\n    bottom: 30px;\n    left: 50%;\n    transform: translateX(-50%);\n    z-index: 12;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.zaza-v4-mini-logo {\n    width: 55px;\n    height: 32px;\n    background-color: #ea9ea1;        \/* Pantone 4067 U roza za neaktivne *\/\n    -webkit-mask: url('https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/Prirucnik-logotip-varijacija-ZAZA-02.png') no-repeat center \/ contain;\n    mask: url('https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/Prirucnik-logotip-varijacija-ZAZA-02.png') no-repeat center \/ contain;\n    opacity: 0.5 !important;\n    transform: scale(1) !important;\n    margin: 0 -8px;\n    cursor: pointer;\n    transition: all 0.35s ease-in-out !important;\n    position: relative;\n    z-index: 1;\n}\n\n.zaza-v4-mini-logo:hover {\n    background-color: #bf3132 !important;\n    opacity: 0.85 !important;\n}\n\n\/* AKTIVNI LOGO *\/\n.zaza-v4-mini-logo.active {\n    background-color: #bf3132 !important; \/* Pantone 3546 U crvena *\/\n    opacity: 1 !important;\n    transform: scale(1.5) !important;\n    filter: drop-shadow(0px 2px 8px rgba(191, 49, 50, 0.45)) !important;\n    margin: 0 6px !important;\n    z-index: 10 !important;\n}\n\n\/* MOBITEL PRILAGODBA *\/\n@media (max-width: 768px) {\n    .zaza-v4-slider {\n        height: 100vh !important;\n        margin-left: 0 !important;\n        margin-right: 0 !important;\n        left: 0;\n        right: 0;\n        width: 100% !important;\n    }\n    \n    .zaza-v4-slide img {\n        object-fit: cover !important;  \/* Popunjava mobilni ekran bez bijelih rubova sa strana *\/\n        width: 100%;\n        height: 100%;\n    }\n\n    a.zaza-v4-set-link,\n    a.zaza-v4-set-link:link,\n    a.zaza-v4-set-link:visited {\n        font-size: 3.8rem !important;\n        letter-spacing: 4px !important;\n    }\n\n    .zaza-v4-logos-nav {\n        bottom: 25px;\n    }\n\n    .zaza-v4-mini-logo {\n        width: 40px;\n        height: 24px;\n        margin: 0 -6px;\n    }\n\n    .zaza-v4-mini-logo.active {\n        transform: scale(1.4) !important;\n        margin: 0 4px !important;\n    }\n\n    .zaza-v4-nav-btn {\n        font-size: 30px !important;\n        padding: 10px;\n    }\n    .zaza-v4-nav-btn.prev { left: 10px; }\n    .zaza-v4-nav-btn.next { right: 10px; }\n}\n<\/style>\n\n<!-- Skripta -->\n<script>\nwindow.zazaV4CurrentIdx = 0;\nwindow.zazaV4AutoTimer = null;\n\nfunction zazaV4GoToSlide(targetIdx) {\n    var slides = document.querySelectorAll('#zazaV4Slider .zaza-v4-slide');\n    var logos = document.querySelectorAll('#zazaV4Slider .zaza-v4-mini-logo');\n    \n    if (!slides || slides.length === 0) return;\n\n    if (targetIdx >= slides.length) { window.zazaV4CurrentIdx = 0; }\n    else if (targetIdx < 0) { window.zazaV4CurrentIdx = slides.length - 1; }\n    else { window.zazaV4CurrentIdx = targetIdx; }\n\n    for (var i = 0; i < slides.length; i++) {\n        slides[i].classList.remove('active');\n    }\n    slides[window.zazaV4CurrentIdx].classList.add('active');\n\n    for (var j = 0; j < logos.length; j++) {\n        logos[j].classList.remove('active');\n    }\n    if (logos[window.zazaV4CurrentIdx]) {\n        logos[window.zazaV4CurrentIdx].classList.add('active');\n    }\n\n    zazaV4ResetTimer();\n}\n\nfunction zazaV4ResetTimer() {\n    if (window.zazaV4AutoTimer) clearInterval(window.zazaV4AutoTimer);\n    window.zazaV4AutoTimer = setInterval(function() {\n        zazaV4GoToSlide(window.zazaV4CurrentIdx + 1);\n    }, 4000);\n}\n\n(function() {\n    zazaV4GoToSlide(0);\n\n    var sliderEl = document.getElementById('zazaV4Slider');\n    if (sliderEl) {\n        var startX = 0;\n        sliderEl.addEventListener('touchstart', function(e) {\n            startX = e.touches[0].clientX;\n        }, {passive: true});\n\n        sliderEl.addEventListener('touchend', function(e) {\n            var diff = startX - e.changedTouches[0].clientX;\n            if (Math.abs(diff) > 40) {\n                if (diff > 0) zazaV4GoToSlide(window.zazaV4CurrentIdx + 1);\n                else zazaV4GoToSlide(window.zazaV4CurrentIdx - 1);\n            }\n        }, {passive: true});\n    }\n})();\n<\/script>\n\n\n\n<div class=\"zaza-dress-slider\" id=\"zazaDressSlider\">\n  \n  <!-- Slike koje se vrte -->\n  <div class=\"zaza-dress-slides-container\">\n    <div class=\"zaza-dress-slide active\">\n      <img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/1O0A1034-scaled.jpg\" alt=\"Zaza Dress 1\">\n    <\/div>\n    <div class=\"zaza-dress-slide\">\n      <img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/1O0A1054-scaled.jpg\" alt=\"Zaza Dress 2\">\n    <\/div>\n    <div class=\"zaza-dress-slide\">\n      <img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/1O0A1049-scaled.jpg\" alt=\"Zaza Dress 3\">\n    <\/div>\n    <div class=\"zaza-dress-slide\">\n      <img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/1O0A01026-scaled.jpg\" alt=\"Zaza Dress 4\">\n    <\/div>\n  <\/div>\n\n  <!-- Fiksni natpis DRESS u sredini -->\n  <div class=\"zaza-dress-fiksni-tekst\">\n    <a href=\"https:\/\/zaza.hr\/product-category\/dress\" class=\"zaza-dress-link\">\n      DRESS\n    <\/a>\n  <\/div>\n\n  <!-- Strelice -->\n  <button class=\"zaza-dress-nav-btn prev\" onclick=\"zazaDressGoToSlide(zazaDressCurrentIdx - 1)\">&#10094;<\/button>\n  <button class=\"zaza-dress-nav-btn next\" onclick=\"zazaDressGoToSlide(zazaDressCurrentIdx + 1)\">&#10095;<\/button>\n\n  <!-- 4 MALA LOGOTIPA PRI DNU -->\n  <div class=\"zaza-dress-logos-nav\">\n    <div class=\"zaza-dress-mini-logo active\" onclick=\"zazaDressGoToSlide(0)\"><\/div>\n    <div class=\"zaza-dress-mini-logo\" onclick=\"zazaDressGoToSlide(1)\"><\/div>\n    <div class=\"zaza-dress-mini-logo\" onclick=\"zazaDressGoToSlide(2)\"><\/div>\n    <div class=\"zaza-dress-mini-logo\" onclick=\"zazaDressGoToSlide(3)\"><\/div>\n  <\/div>\n\n<\/div>\n\n<!-- Stilovi -->\n<style>\n.zaza-dress-slider {\n    position: relative;\n    width: 100vw !important;           \/* Puna \u0161irina ekrana *\/\n    max-width: 100% !important;\n    left: 50%;\n    right: 50%;\n    margin-left: -50vw !important;\n    margin-right: -50vw !important;\n    height: 100vh !important;          \/* Puna visina ekrana (100vh) *\/\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    overflow: hidden;\n    background-color: transparent;\n    touch-action: pan-y;\n}\n\n\/* Fiksni tekst DRESS u sredini *\/\n.zaza-dress-fiksni-tekst {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    z-index: 10;\n    pointer-events: auto;\n    text-align: center;\n}\n\na.zaza-dress-link,\na.zaza-dress-link:link,\na.zaza-dress-link:visited {\n    color: #ea9ea1 !important;        \/* Pantone 4067 U roza boja *\/\n    font-size: 6.5rem !important;\n    font-weight: 800 !important;\n    text-transform: uppercase !important;\n    text-decoration: none !important;\n    letter-spacing: 8px !important;\n    display: inline-block;\n    transition: all 0.25s ease;\n    text-shadow: 0px 4px 12px rgba(0,0,0,0.12);\n}\n\n\/* NA DODIR\/KLIK\/HOVER: Preboja natpis DRESS u Pantone 3546 U crvenu (#bf3132) *\/\na.zaza-dress-link:hover,\na.zaza-dress-link:active,\na.zaza-dress-link:focus {\n    color: #bf3132 !important;        \/* Pantone 3546 U crvena *\/\n    transform: scale(1.08);\n    text-shadow: 0px 4px 16px rgba(191, 49, 50, 0.35);\n}\n\n\/* Slajdovi *\/\n.zaza-dress-slides-container {\n    position: relative;\n    width: 100%;\n    height: 100%;\n}\n\n.zaza-dress-slide {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    opacity: 0 !important;\n    transition: opacity 0.8s ease-in-out !important;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    z-index: 1;\n}\n\n.zaza-dress-slide.active {\n    opacity: 1 !important;\n    z-index: 2;\n}\n\n.zaza-dress-slide img {\n    max-width: 100%;\n    max-height: 100%;\n    width: auto;\n    height: auto;\n    object-fit: contain !important;    \/* Slika se prikazuje bez zumiranja i rezanja na desktopu *\/\n    user-select: none;\n    -webkit-user-drag: none;\n}\n\n\/* Strelice *\/\n.zaza-dress-nav-btn {\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    background: none !important;\n    border: none !important;\n    color: #ea9ea1 !important;        \/* Osnovna Pantone roza boja *\/\n    font-size: 48px !important;\n    padding: 20px;\n    cursor: pointer;\n    z-index: 12;\n    transition: all 0.25s ease;\n    user-select: none;\n    outline: none;\n}\n\n\/* NA DODIR\/KLIK\/HOVER: Preboja strelice u Pantone 3546 U crvenu (#bf3132) *\/\n.zaza-dress-nav-btn:hover,\n.zaza-dress-nav-btn:active,\n.zaza-dress-nav-btn:focus {\n    color: #bf3132 !important;        \/* Pantone 3546 U crvena *\/\n    transform: translateY(-50%) scale(1.25);\n    filter: drop-shadow(0px 2px 8px rgba(191, 49, 50, 0.4));\n}\n\n.zaza-dress-nav-btn.prev { left: 30px; }\n.zaza-dress-nav-btn.next { right: 30px; }\n\n\/* 4 MALA LOGOTIPA PRI DNU *\/\n.zaza-dress-logos-nav {\n    position: absolute;\n    bottom: 30px;\n    left: 50%;\n    transform: translateX(-50%);\n    z-index: 12;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.zaza-dress-mini-logo {\n    width: 55px;\n    height: 32px;\n    background-color: #ea9ea1;        \/* Pantone 4067 U roza za neaktivne *\/\n    -webkit-mask: url('https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/Prirucnik-logotip-varijacija-ZAZA-02.png') no-repeat center \/ contain;\n    mask: url('https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/Prirucnik-logotip-varijacija-ZAZA-02.png') no-repeat center \/ contain;\n    opacity: 0.5 !important;\n    transform: scale(1) !important;\n    margin: 0 -8px;\n    cursor: pointer;\n    transition: all 0.35s ease-in-out !important;\n    position: relative;\n    z-index: 1;\n}\n\n.zaza-dress-mini-logo:hover {\n    background-color: #bf3132 !important;\n    opacity: 0.85 !important;\n}\n\n\/* AKTIVNI LOGO *\/\n.zaza-dress-mini-logo.active {\n    background-color: #bf3132 !important; \/* Pantone 3546 U crvena *\/\n    opacity: 1 !important;\n    transform: scale(1.5) !important;\n    filter: drop-shadow(0px 2px 8px rgba(191, 49, 50, 0.45)) !important;\n    margin: 0 6px !important;\n    z-index: 10 !important;\n}\n\n\/* MOBITEL PRILAGODBA *\/\n@media (max-width: 768px) {\n    .zaza-dress-slider {\n        height: 100vh !important;\n        margin-left: 0 !important;\n        margin-right: 0 !important;\n        left: 0;\n        right: 0;\n        width: 100% !important;\n    }\n    \n    .zaza-dress-slide img {\n        object-fit: cover !important;  \/* Popunjava mobilni ekran bez bijelih rubova sa strana *\/\n        width: 100%;\n        height: 100%;\n    }\n\n    a.zaza-dress-link,\n    a.zaza-dress-link:link,\n    a.zaza-dress-link:visited {\n        font-size: 3.8rem !important;\n        letter-spacing: 4px !important;\n    }\n\n    .zaza-dress-logos-nav {\n        bottom: 25px;\n    }\n\n    .zaza-dress-mini-logo {\n        width: 40px;\n        height: 24px;\n        margin: 0 -6px;\n    }\n\n    .zaza-dress-mini-logo.active {\n        transform: scale(1.4) !important;\n        margin: 0 4px !important;\n    }\n\n    .zaza-dress-nav-btn {\n        font-size: 30px !important;\n        padding: 10px;\n    }\n    .zaza-dress-nav-btn.prev { left: 10px; }\n    .zaza-dress-nav-btn.next { right: 10px; }\n}\n<\/style>\n\n<!-- Skripta -->\n<script>\nwindow.zazaDressCurrentIdx = 0;\nwindow.zazaDressAutoTimer = null;\n\nfunction zazaDressGoToSlide(targetIdx) {\n    var slides = document.querySelectorAll('#zazaDressSlider .zaza-dress-slide');\n    var logos = document.querySelectorAll('#zazaDressSlider .zaza-dress-mini-logo');\n    \n    if (!slides || slides.length === 0) return;\n\n    if (targetIdx >= slides.length) { window.zazaDressCurrentIdx = 0; }\n    else if (targetIdx < 0) { window.zazaDressCurrentIdx = slides.length - 1; }\n    else { window.zazaDressCurrentIdx = targetIdx; }\n\n    for (var i = 0; i < slides.length; i++) {\n        slides[i].classList.remove('active');\n    }\n    slides[window.zazaDressCurrentIdx].classList.add('active');\n\n    for (var j = 0; j < logos.length; j++) {\n        logos[j].classList.remove('active');\n    }\n    if (logos[window.zazaDressCurrentIdx]) {\n        logos[window.zazaDressCurrentIdx].classList.add('active');\n    }\n\n    zazaDressResetTimer();\n}\n\nfunction zazaDressResetTimer() {\n    if (window.zazaDressAutoTimer) clearInterval(window.zazaDressAutoTimer);\n    window.zazaDressAutoTimer = setInterval(function() {\n        zazaDressGoToSlide(window.zazaDressCurrentIdx + 1);\n    }, 4000);\n}\n\n(function() {\n    zazaDressGoToSlide(0);\n\n    var sliderEl = document.getElementById('zazaDressSlider');\n    if (sliderEl) {\n        var startX = 0;\n        sliderEl.addEventListener('touchstart', function(e) {\n            startX = e.touches[0].clientX;\n        }, {passive: true});\n\n        sliderEl.addEventListener('touchend', function(e) {\n            var diff = startX - e.changedTouches[0].clientX;\n            if (Math.abs(diff) > 40) {\n                if (diff > 0) zazaDressGoToSlide(window.zazaDressCurrentIdx + 1);\n                else zazaDressGoToSlide(window.zazaDressCurrentIdx - 1);\n            }\n        }, {passive: true});\n    }\n})();\n<\/script>\n\n\n\n<div class=\"zaza-swim-slider\" id=\"zazaSwimSlider\">\n  \n  <div class=\"zaza-swim-slides-container\">\n    \n    <!-- SLAJD 1: GALEBOVI -->\n    <div class=\"zaza-swim-slide active\">\n      <div class=\"zaza-swim-collage\">\n        <div class=\"zaza-swim-img-link sg-1\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/galeb1-scaled.png\" alt=\"Zaza Swim Galeb 1\"><\/div>\n        <div class=\"zaza-swim-img-link sg-2\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/galeb2-scaled.png\" alt=\"Zaza Swim Galeb 2\"><\/div>\n        <div class=\"zaza-swim-img-link sg-3\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/galeb1-scaled.png\" alt=\"Zaza Swim Galeb 1\"><\/div>\n        <div class=\"zaza-swim-img-link sg-4\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/galeb2-scaled.png\" alt=\"Zaza Swim Galeb 2\"><\/div>\n        <div class=\"zaza-swim-img-link sg-5\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/galeb1-scaled.png\" alt=\"Zaza Swim Galeb 1\"><\/div>\n        <div class=\"zaza-swim-img-link sg-6\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/galeb2-scaled.png\" alt=\"Zaza Swim Galeb 2\"><\/div>\n      <\/div>\n    <\/div>\n\n    <!-- SLAJD 2: VESPE -->\n    <div class=\"zaza-swim-slide\">\n      <div class=\"zaza-swim-collage\">\n        <div class=\"zaza-swim-img-link vp-1\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/vespa1-scaled.png\" alt=\"Zaza Swim Vespa 1\"><\/div>\n        <div class=\"zaza-swim-img-link vp-2\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/vespa2-scaled.png\" alt=\"Zaza Swim Vespa 2\"><\/div>\n        <div class=\"zaza-swim-img-link vp-3\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/vespa1-scaled.png\" alt=\"Zaza Swim Vespa 1\"><\/div>\n        <div class=\"zaza-swim-img-link vp-4\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/vespa2-scaled.png\" alt=\"Zaza Swim Vespa 2\"><\/div>\n        <div class=\"zaza-swim-img-link vp-5\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/vespa1-scaled.png\" alt=\"Zaza Swim Vespa 1\"><\/div>\n        <div class=\"zaza-swim-img-link vp-6\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/vespa2-scaled.png\" alt=\"Zaza Swim Vespa 2\"><\/div>\n      <\/div>\n    <\/div>\n\n    <!-- SLAJD 3: TOVARI -->\n    <div class=\"zaza-swim-slide\">\n      <div class=\"zaza-swim-collage\">\n        <div class=\"zaza-swim-img-link tk-1\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/tovar1-scaled.png\" alt=\"Zaza Swim Tovar 1\"><\/div>\n        <div class=\"zaza-swim-img-link tk-2\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/tovar2-scaled.png\" alt=\"Zaza Swim Tovar 2\"><\/div>\n        <div class=\"zaza-swim-img-link tk-3\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/tovar1-scaled.png\" alt=\"Zaza Swim Tovar 1\"><\/div>\n        <div class=\"zaza-swim-img-link tk-4\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/tovar2-scaled.png\" alt=\"Zaza Swim Tovar 2\"><\/div>\n        <div class=\"zaza-swim-img-link tk-5\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/tovar1-scaled.png\" alt=\"Zaza Swim Tovar 1\"><\/div>\n        <div class=\"zaza-swim-img-link tk-6\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/tovar2-scaled.png\" alt=\"Zaza Swim Tovar 2\"><\/div>\n      <\/div>\n    <\/div>\n\n    <!-- SLAJD 4: MJE\u0160OVITI KOLA\u017d -->\n    <div class=\"zaza-swim-slide\">\n      <div class=\"zaza-swim-collage\">\n        <div class=\"zaza-swim-img-link tovar-1\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/tovar1-scaled.png\" alt=\"Zaza Swim Tovar 1\"><\/div>\n        <div class=\"zaza-swim-img-link tovar-2\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/tovar2-scaled.png\" alt=\"Zaza Swim Tovar 2\"><\/div>\n        <div class=\"zaza-swim-img-link vespa-1\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/vespa1-scaled.png\" alt=\"Zaza Swim Vespa 1\"><\/div>\n        <div class=\"zaza-swim-img-link vespa-2\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/vespa2-scaled.png\" alt=\"Zaza Swim Vespa 2\"><\/div>\n        <div class=\"zaza-swim-img-link galeb-1\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/galeb1-scaled.png\" alt=\"Zaza Swim Galeb 1\"><\/div>\n        <div class=\"zaza-swim-img-link galeb-2\"><img decoding=\"async\" src=\"https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/galeb2-scaled.png\" alt=\"Zaza Swim Galeb 2\"><\/div>\n      <\/div>\n    <\/div>\n\n  <\/div>\n\n  <!-- Fiksni natpis SWIM u sredini -->\n  <div class=\"zaza-swim-fiksni-tekst\">\n    <a href=\"https:\/\/zaza.hr\/product-category\/swim\" class=\"zaza-swim-link\">SWIM<\/a>\n  <\/div>\n\n  <!-- Strelice -->\n  <button class=\"zaza-swim-nav-btn prev\" onclick=\"zazaSwimGoToSlide(window.zazaSwimCurrentIdx - 1)\">&#10094;<\/button>\n  <button class=\"zaza-swim-nav-btn next\" onclick=\"zazaSwimGoToSlide(window.zazaSwimCurrentIdx + 1)\">&#10095;<\/button>\n\n  <!-- 4 MALA LOGOTIPA PRI DNU -->\n  <div class=\"zaza-swim-logos-nav\">\n    <div class=\"zaza-swim-mini-logo active\" onclick=\"zazaSwimGoToSlide(0)\"><\/div>\n    <div class=\"zaza-swim-mini-logo\" onclick=\"zazaSwimGoToSlide(1)\"><\/div>\n    <div class=\"zaza-swim-mini-logo\" onclick=\"zazaSwimGoToSlide(2)\"><\/div>\n    <div class=\"zaza-swim-mini-logo\" onclick=\"zazaSwimGoToSlide(3)\"><\/div>\n  <\/div>\n\n<\/div>\n\n<!-- Stilovi -->\n<style>\n.zaza-swim-slider {\n    position: relative;\n    width: 100vw !important;\n    max-width: 100% !important;\n    left: 50%;\n    right: 50%;\n    margin-left: -50vw !important;\n    margin-right: -50vw !important;\n    height: 100vh !important;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    overflow: hidden;\n    background-color: transparent;\n    touch-action: pan-y;\n}\n\n\/* Fiksni tekst SWIM u sredini *\/\n.zaza-swim-fiksni-tekst {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    z-index: 10;\n    pointer-events: auto;\n    text-align: center;\n}\n\na.zaza-swim-link,\na.zaza-swim-link:link,\na.zaza-swim-link:visited {\n    color: #ea9ea1 !important;        \/* Pantone 4067 U roza boja *\/\n    font-size: 6.5rem !important;\n    font-weight: 800 !important;\n    text-transform: uppercase !important;\n    text-decoration: none !important;\n    letter-spacing: 8px !important;\n    display: inline-block;\n    transition: all 0.25s ease;\n    text-shadow: 0px 4px 12px rgba(0,0,0,0.12);\n}\n\na.zaza-swim-link:hover,\na.zaza-swim-link:active,\na.zaza-swim-link:focus {\n    color: #bf3132 !important;        \/* Pantone 3546 U crvena *\/\n    transform: scale(1.08);\n    text-shadow: 0px 4px 16px rgba(191, 49, 50, 0.35);\n}\n\n\/* Slajdovi *\/\n.zaza-swim-slides-container {\n    position: relative;\n    width: 100%;\n    height: 100%;\n}\n\n.zaza-swim-slide {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    opacity: 0 !important;\n    transition: opacity 0.8s ease-in-out !important;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    z-index: 1;\n}\n\n.zaza-swim-slide.active {\n    opacity: 1 !important;\n    z-index: 2;\n}\n\n.zaza-swim-collage {\n    position: relative;\n    width: 100%;\n    height: 100vh;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    overflow: hidden;\n    padding: 30px;\n    box-sizing: border-box;\n}\n\n.zaza-swim-collage .zaza-swim-img-link {\n    position: absolute;\n    display: inline-block;\n    cursor: default !important;\n    pointer-events: none !important;\n}\n\n.zaza-swim-collage .zaza-swim-img-link img {\n    width: auto;\n    height: auto;\n    object-fit: contain;\n    filter: none !important;\n    display: block;\n    user-select: none;\n    -webkit-user-drag: none;\n}\n\n\/* --- MONO-SLAJDOVI --- *\/\n.sg-1 img, .sg-2 img, .sg-3 img, .sg-4 img, .sg-5 img, .sg-6 img,\n.vp-1 img, .vp-2 img, .vp-3 img, .vp-4 img, .vp-5 img, .vp-6 img,\n.tk-1 img, .tk-2 img, .tk-3 img, .tk-4 img, .tk-5 img, .tk-6 img {\n    max-width: 48vw !important;\n    max-height: 48vh !important;\n}\n\n.sg-1 { top: 2%; left: 2%; transform: rotate(-18deg); }\n.sg-2 { top: 1%; right: 2%; transform: rotate(22deg); }\n.sg-3 { top: 46%; left: -2%; transform: translateY(-50%) rotate(15deg); }\n.sg-4 { top: 46%; right: -2%; transform: translateY(-50%) rotate(-16deg); }\n.sg-5 { bottom: 2%; left: 3%; transform: rotate(-12deg); }\n.sg-6 { bottom: 2%; right: 3%; transform: rotate(18deg); }\n\n.vp-1 { top: 3%; left: 4%; transform: rotate(20deg); }\n.vp-2 { top: 2%; right: 4%; transform: rotate(-15deg); }\n.vp-3 { top: 50%; left: -1%; transform: translateY(-50%) rotate(-18deg); }\n.vp-4 { top: 50%; right: -1%; transform: translateY(-50%) rotate(14deg); }\n.vp-5 { bottom: 3%; left: 2%; transform: rotate(16deg); }\n.vp-6 { bottom: 3%; right: 2%; transform: rotate(-22deg); }\n\n.tk-1 { top: 1%; left: 1%; transform: rotate(-25deg); }\n.tk-2 { top: 2%; right: 1%; transform: rotate(19deg); }\n.tk-3 { top: 48%; left: 2%; transform: translateY(-50%) rotate(12deg); }\n.tk-4 { top: 48%; right: 2%; transform: translateY(-50%) rotate(-14deg); }\n.tk-5 { bottom: 1%; left: 4%; transform: rotate(-20deg); }\n.tk-6 { bottom: 2%; right: 4%; transform: rotate(15deg); }\n\n\/* MJE\u0160OVITI SLAJD *\/\n.zaza-swim-collage .tovar-1 { top: 2%; left: 2%; transform: rotate(-22deg); z-index: 6; }\n.zaza-swim-collage .tovar-1 img { max-width: 54vw !important; max-height: 56vh !important; }\n\n.zaza-swim-collage .tovar-2 { top: 1%; right: 2%; transform: rotate(18deg); z-index: 7; }\n.zaza-swim-collage .tovar-2 img { max-width: 54vw !important; max-height: 56vh !important; }\n\n.zaza-swim-collage .vespa-1 { top: 48%; left: 1%; transform: translateY(-50%) rotate(15deg); z-index: 8; }\n.zaza-swim-collage .vespa-1 img { max-width: 50vw !important; max-height: 52vh !important; }\n\n.zaza-swim-collage .vespa-2 { top: 48%; right: 1%; transform: translateY(-50%) rotate(-18deg); z-index: 9; }\n.zaza-swim-collage .vespa-2 img { max-width: 50vw !important; max-height: 52vh !important; }\n\n.zaza-swim-collage .galeb-1 { bottom: 2%; left: 4%; transform: rotate(-14deg); z-index: 10; }\n.zaza-swim-collage .galeb-1 img { max-width: 56vw !important; max-height: 58vh !important; }\n\n.zaza-swim-collage .galeb-2 { bottom: 3%; right: 4%; transform: rotate(25deg); z-index: 12 !important; }\n.zaza-swim-collage .galeb-2 img { max-width: 48vw !important; max-height: 52vh !important; }\n\n\/* STRELICE *\/\n.zaza-swim-nav-btn {\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    background: none !important;\n    border: none !important;\n    color: #ea9ea1 !important;\n    font-size: 48px !important;\n    padding: 20px;\n    cursor: pointer;\n    z-index: 12;\n    transition: all 0.25s ease;\n    user-select: none;\n    outline: none;\n}\n\n.zaza-swim-nav-btn:hover,\n.zaza-swim-nav-btn:active,\n.zaza-swim-nav-btn:focus {\n    color: #bf3132 !important;\n    transform: translateY(-50%) scale(1.25);\n    filter: drop-shadow(0px 2px 8px rgba(191, 49, 50, 0.4));\n}\n\n.zaza-swim-nav-btn.prev { left: 30px; }\n.zaza-swim-nav-btn.next { right: 30px; }\n\n\/* 4 MALA LOGOTIPA PRI DNU *\/\n.zaza-swim-logos-nav {\n    position: absolute;\n    bottom: 30px;\n    left: 50%;\n    transform: translateX(-50%);\n    z-index: 12;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.zaza-swim-mini-logo {\n    width: 55px;\n    height: 32px;\n    background-color: #ea9ea1;\n    -webkit-mask: url('https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/Prirucnik-logotip-varijacija-ZAZA-02.png') no-repeat center \/ contain;\n    mask: url('https:\/\/zaza.hr\/wp-content\/uploads\/2026\/08\/Prirucnik-logotip-varijacija-ZAZA-02.png') no-repeat center \/ contain;\n    opacity: 0.5 !important;\n    transform: scale(1) !important;\n    margin: 0 -8px;\n    cursor: pointer;\n    transition: all 0.35s ease-in-out !important;\n    position: relative;\n    z-index: 1;\n}\n\n.zaza-swim-mini-logo:hover {\n    background-color: #bf3132 !important;\n    opacity: 0.85 !important;\n}\n\n.zaza-swim-mini-logo.active {\n    background-color: #bf3132 !important;\n    opacity: 1 !important;\n    transform: scale(1.5) !important;\n    filter: drop-shadow(0px 2px 8px rgba(191, 49, 50, 0.45)) !important;\n    margin: 0 6px !important;\n    z-index: 10 !important;\n}\n\n\/* MOBITEL PRILAGODBA *\/\n@media (max-width: 768px) {\n    .zaza-swim-slider {\n        height: 100vh !important;\n        margin-left: 0 !important;\n        margin-right: 0 !important;\n        left: 0;\n        right: 0;\n        width: 100% !important;\n    }\n\n    .zaza-swim-collage { padding: 5px; }\n\n    .sg-1 img, .sg-2 img, .sg-3 img, .sg-4 img, .sg-5 img, .sg-6 img,\n    .vp-1 img, .vp-2 img, .vp-3 img, .vp-4 img, .vp-5 img, .vp-6 img,\n    .tk-1 img, .tk-2 img, .tk-3 img, .tk-4 img, .tk-5 img, .tk-6 img {\n        max-width: 58vw !important;\n        max-height: 34vh !important;\n    }\n\n    .sg-1, .vp-1, .tk-1 { top: 12%; left: 15%; }\n    .sg-2, .vp-2, .tk-2 { top: 12%; right: 15%; }\n    .sg-3, .vp-3, .tk-3 { top: 48%; left: 18%; transform: translateY(-50%); }\n    .sg-4, .vp-4, .tk-4 { top: 48%; right: 18%; transform: translateY(-50%); }\n    .sg-5, .vp-5, .tk-5 { bottom: 12%; left: 15%; }\n    .sg-6, .vp-6, .tk-6 { bottom: 12%; right: 15%; }\n\n    .zaza-swim-collage .tovar-1 { top: 12%; left: 15%; }\n    .zaza-swim-collage .tovar-2 { top: 12%; right: 15%; }\n    .zaza-swim-collage .vespa-1 { top: 48%; left: 18%; transform: translateY(-50%); }\n    .zaza-swim-collage .vespa-2 { top: 48%; right: 18%; transform: translateY(-50%); }\n    .zaza-swim-collage .galeb-1 { bottom: 12%; left: 15%; }\n    .zaza-swim-collage .galeb-2 { bottom: 12%; right: 15%; }\n\n    a.zaza-swim-link,\n    a.zaza-swim-link:link,\n    a.zaza-swim-link:visited {\n        font-size: 3.8rem !important;\n        letter-spacing: 4px !important;\n    }\n\n    .zaza-swim-logos-nav {\n        bottom: 25px;\n    }\n\n    .zaza-swim-mini-logo {\n        width: 40px;\n        height: 24px;\n        margin: 0 -6px;\n    }\n\n    .zaza-swim-mini-logo.active {\n        transform: scale(1.4) !important;\n        margin: 0 4px !important;\n    }\n\n    .zaza-swim-nav-btn {\n        font-size: 30px !important;\n        padding: 10px;\n    }\n    .zaza-swim-nav-btn.prev { left: 10px; }\n    .zaza-swim-nav-btn.next { right: 10px; }\n}\n<\/style>\n\n<!-- POPRAVLJENA SKRIPTA SA STABILNIM TAJMEROM -->\n<script>\nwindow.zazaSwimCurrentIdx = 0;\nwindow.zazaSwimAutoTimer = null;\n\nfunction zazaSwimGoToSlide(targetIdx) {\n    var slider = document.getElementById('zazaSwimSlider');\n    if (!slider) return;\n\n    var slides = slider.querySelectorAll('.zaza-swim-slide');\n    var logos = slider.querySelectorAll('.zaza-swim-mini-logo');\n    \n    if (!slides || slides.length === 0) return;\n\n    if (targetIdx >= slides.length) { window.zazaSwimCurrentIdx = 0; }\n    else if (targetIdx < 0) { window.zazaSwimCurrentIdx = slides.length - 1; }\n    else { window.zazaSwimCurrentIdx = targetIdx; }\n\n    for (var i = 0; i < slides.length; i++) {\n        slides[i].classList.remove('active');\n    }\n    slides[window.zazaSwimCurrentIdx].classList.add('active');\n\n    for (var j = 0; j < logos.length; j++) {\n        logos[j].classList.remove('active');\n    }\n    if (logos[window.zazaSwimCurrentIdx]) {\n        logos[window.zazaSwimCurrentIdx].classList.add('active');\n    }\n\n    zazaSwimResetTimer();\n}\n\nfunction zazaSwimResetTimer() {\n    if (window.zazaSwimAutoTimer) {\n        clearInterval(window.zazaSwimAutoTimer);\n        window.zazaSwimAutoTimer = null;\n    }\n    window.zazaSwimAutoTimer = setInterval(function() {\n        zazaSwimGoToSlide(window.zazaSwimCurrentIdx + 1);\n    }, 4000); \/\/ Fiksni ritam od to\u010dno 4 sekunde\n}\n\ndocument.addEventListener('DOMContentLoaded', function() {\n    zazaSwimGoToSlide(0);\n\n    var sliderEl = document.getElementById('zazaSwimSlider');\n    if (sliderEl) {\n        var startX = 0;\n        sliderEl.addEventListener('touchstart', function(e) {\n            startX = e.touches[0].clientX;\n        }, {passive: true});\n\n        sliderEl.addEventListener('touchend', function(e) {\n            var diff = startX - e.changedTouches[0].clientX;\n            if (Math.abs(diff) > 40) {\n                if (diff > 0) zazaSwimGoToSlide(window.zazaSwimCurrentIdx + 1);\n                else zazaSwimGoToSlide(window.zazaSwimCurrentIdx - 1);\n            }\n        }, {passive: true});\n    }\n});\n\n\/\/ Sigurnosno pokretanje ako je DOM ve\u0107 u\u010ditan\nif (document.readyState === \"complete\" || document.readyState === \"interactive\") {\n    zazaSwimGoToSlide(0);\n}\n<\/script>\n\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-transparent-header-light.php","meta":{"footnotes":""},"class_list":["post-73","page","type-page","status-publish","hentry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/zaza.hr\/hr\/wp-json\/wp\/v2\/pages\/73","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/zaza.hr\/hr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/zaza.hr\/hr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/zaza.hr\/hr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/zaza.hr\/hr\/wp-json\/wp\/v2\/comments?post=73"}],"version-history":[{"count":105,"href":"https:\/\/zaza.hr\/hr\/wp-json\/wp\/v2\/pages\/73\/revisions"}],"predecessor-version":[{"id":2256,"href":"https:\/\/zaza.hr\/hr\/wp-json\/wp\/v2\/pages\/73\/revisions\/2256"}],"wp:attachment":[{"href":"https:\/\/zaza.hr\/hr\/wp-json\/wp\/v2\/media?parent=73"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}