:root{
  --brand:#d62828;
  --brandSoft: rgba(214,40,40,.14);

  --bg:#f5f3f2;
  --panel:#ffffff;
  --text:#121212;
  --muted:#5f5f5f;

  --top:#1a1a1a;
  --top2:#121212;

  --radius: 18px;
  --radiusSm: 12px;

  --shadow: 0 14px 40px rgba(0,0,0,.10);
  --shadowSm: 0 10px 25px rgba(0,0,0,.06);

  --max: 1100px;
}


*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family: Montserrat, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: var(--bg);
  color: var(--text);
  overflow-x:hidden;
}/* ===== FIX ZA FOOTER ===== */
html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

main.home {
  flex: 1 0 auto;  /* Ovo gura footer dolje */
  display: flex;
  flex-direction: column;
  width: 100%;
}

.footer {
  flex-shrink: 0;  /* Footer se ne smije smanjivati */
  margin-top: 0;   /* Osiguraj da nema dodatnog margina */
  width: 100%;
}

a{ color:inherit; text-decoration:none; }

/* ===== TOP BAR ===== */
header{
  position: sticky;
  top:0;
  z-index: 999;
    background: linear-gradient(180deg, #f93d3d, #d62828);
  border-bottom: 1px solid rgba(255,255,255,.08);
  max-width: 100%;
}

.topbar{

  height: 92px;
  display:flex;
  align-items:center;
  padding: 0 20px;
  max-width: 1400px;
  margin: 0 auto;
  gap:20px;
}

/* LEFT BRAND */
.brand{
  display:flex;
  align-items:center;
  gap: 14px;
  color:#fff;
  flex: 0 0 auto;    /* bitno za mobitel */
  min-width: 0;      /* bitno da text može “skratit” */
}



.brandText{
  line-height: 1.05;
  min-width: 0;
}
.brandText .name{
  font-weight:700;
  letter-spacing:.6px;
  font-size: 16px;
}
.brandText .sub{
  font-weight:600;
  letter-spacing:.8px;
  font-size: 11px;
  opacity:.75;
  text-transform: uppercase;
}

/* DESKTOP NAV */
.nav{
display:flex;
  align-items:center;
  gap:18px;
  margin-left: auto;
}

/* .nav a{
  color:#fff;
  font-weight:700;
  letter-spacing: .6px;
  text-transform: uppercase;
  font-size: 14px;
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid transparent;
  opacity: .92;
  white-space: nowrap;
} */
.nav a:hover{
color: #ff8888;   /* lagana flamma crvena */
  background: transparent;
}
.nav a.active{
    /* lagano crvenkasto */

  color:#f5afaf;

}

.nav a, .mobileNav a{
  color:#fff;
  font-weight:700;
  letter-spacing: .6px;
  text-transform: uppercase;
  font-size: 14px;
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid transparent;
  opacity: .92;
  white-space: nowrap;

  transition: color .25s ease, background .25s ease; 
}
/* RIGHT */
.topRight{
  display:flex;
  align-items:center;
  gap: 14px;
  justify-content:flex-end;
  flex: 0 0 auto;
}

.flag{
  width: 34px;
  height: 22px;
  border-radius: 4px;
  border: 1px solid rgba(255,255,255,.22);
  background: linear-gradient(#c00 0 33%, #fff 33% 66%, #001f7a 66%);
}

.burger{
  display:none;
  width: 44px;
  height: 44px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.06);
  color: #fff;
  cursor:pointer;
}

/* MOBILE NAV (ravnomjerno) */
.mobileNav{
  display:none;
  max-width: 1400px;
  margin: 0 auto;
  padding: 10px 18px 18px;
  border-top: 1px solid rgba(255,255,255,.08);
}
.mobileNav.show{
  display:flex;
  flex-wrap:wrap;
  gap: 10px;
}
.logoImg{
  height:64px;
  width:auto;
  max-width:260px;
  object-fit:contain;
  display:block;
 transition: transform .25s ease;
  border-radius:15px;                 /* 🔥 moderni standard */
 
}
.brand:hover .logoImg{
  transform: translateY(-1px);
}
.mobileNav a{
  flex: 1 1 calc(33.333% - 10px);  /* 3 u redu */
  text-align:center;
  padding: 12px 10px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color:#fff;
  font-weight:700;
  letter-spacing:.6px;
  text-transform: uppercase;
  font-size: 14px;
  opacity:.92;
}
.mobileNav a:hover{
  opacity:1;
  background: rgba(255,255,255,.10);
}
.mobileNav a.active{
 background: rgba(0,0,0,.16);
      border-color: rgba(255,255,255,.24);
      color:#ffd1d1;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 720px){
  .nav{ display:none; }
  .burger{ display:inline-grid; place-items:center; }

  /* da tekst firme ne lomi layout */
  .brandText{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

   .logoImg{
    height: 42px;        /* manji logo na mobu */
    max-width: 180px;    /* da ne radi horizontal scroll */
  }

  .brand{
    gap: 10px;
    flex: 1 1 auto;
    min-width: 0;
  }
}

/* na baš uskim ekranima 2 u redu */
@media (max-width: 420px){
  .mobileNav a{
    flex: 1 1 calc(50% - 10px);
  }
}
/* ===== HOME / SECTIONS ===== */
.home{ background:#efefef; }

.section{
  max-width: 1400px;
  margin: 0 auto;
  padding: 64px 18px;
}

.sectionHead{
  max-width: var(--max);
  margin: 0 auto 18px;
}
.sectionHead h2{
  margin:0 0 6px;
  font-size: 28px;
  letter-spacing: .2px;
}
.sectionHead p{
  margin:0;
  color:#5d5d5d;
  font-weight:600;
}

/* ===== PARALLAX ===== */
.parallax{
  position: relative;
  min-height: 64vh;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  overflow:hidden;
}

.parallax::before{
  content:"";
  position:absolute;
  inset:-15% 0;                 /* malo veće da se ne vide rubovi */
  background-image: var(--bg);
  background-size: cover;
  background-position: center;
  background-repeat:no-repeat;
  transform: translate3d(0, var(--py, 0px), 0);
  will-change: transform;
}
.parallax__overlay{ z-index: 1; }
.parallax__content{ z-index: 2; }
.parallax--small{ min-height: 36vh; }

.parallax__overlay{
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.60));
}

.parallax__content{
  position: relative;
  max-width: 1100px;
  width: calc(100% - 36px);
  padding: 54px 0;
  text-align:left;
}

.parallax__content--small{
  padding: 38px 0;
}

.heroTitle{
  margin:0 0 10px;
  font-size: clamp(34px, 5vw, 64px);
  letter-spacing: 2px;
  text-transform: uppercase;
}
.heroLead{
  margin:0 0 18px;
  max-width: 60ch;
  font-weight:600;
  opacity:.92;
}

.heroActions{ display:flex; gap:12px; flex-wrap:wrap; }

.heroBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 12px 18px;
   border-radius: 18px 6px 18px 6px;
  border: 1px solid rgba(255,255,255,.22);
      background: rgba(214, 40, 40, .92);
  color:#fff;
  font-weight: 800;
  letter-spacing: .4px;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.heroBtn:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 30px rgba(0,0,0,.18);
 
}

.heroBtn:focus-visible{
  outline:none;
  box-shadow: 0 0 0 4px rgba(214,40,40,.18);
}

.heroBtn--primary{
  border-color: rgba(214,40,40,.55);
  background: rgba(214,40,40,.92);
}
.heroBtn--primary:hover{ background: rgba(214,40,40,.98); }
/* Bands */
.bandTitle{
  margin:0 0 6px;
  font-size: clamp(22px, 3vw, 34px);
  text-transform: uppercase;
  letter-spacing: .8px;
}
.bandLead{ margin:0; font-weight:600; opacity:.92; }

/* ===== OFFERS GRID ===== */
.offers{
  max-width: 1100px;
  margin: 16px auto 0;
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 14px;
}

.offer{
  grid-column: span 4;
  background:#fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
  padding: 16px 16px 18px;
  box-shadow: 0 10px 25px rgba(0,0,0,.06);
}

.offer__icon{
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display:grid;
  place-items:center;
  background: rgba(214,40,40,.10);
  border: 1px solid rgba(214,40,40,.18);
  margin-bottom: 10px;
  font-size: 20px;
}

.offer h3{ margin:0 0 6px; font-size: 16px; }
.offer p{ margin:0; color:#5f5f5f; font-weight:600; }

/* WHY */
.why{
  max-width: 1100px;
  margin: 16px auto 0;
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 14px;
}
.why__item{
  grid-column: span 4;
  background:#fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
  padding: 16px 16px 18px;
  box-shadow: 0 10px 25px rgba(0,0,0,.06);
}
.why__item h3{ margin:0 0 6px; font-size: 16px; }
.why__item p{ margin:0; color:#5f5f5f; font-weight:600; }

/* CONTACT */
.contactGrid{
  max-width: 1100px;
  margin: 16px auto 0;
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 14px;
}
.contactCard{
  grid-column: span 6;
  background:#fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 10px 25px rgba(0,0,0,.06);
}
.contactCard h3{ margin:0 0 10px; }
.contactCard p{ margin:0 0 8px; color:#444; font-weight:600; }

.contactForm{ display:grid; gap: 10px; }
.contactForm input, .contactForm textarea{
  padding: 12px 12px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.12);
  font: inherit;
}
.contactForm textarea{ min-height: 120px; resize: vertical; }

/* Responsive */
@media (max-width: 980px){
  .offer, .why__item{ grid-column: span 6; }
  .contactCard{ grid-column: span 12; }
}
@media (max-width: 720px){
  .offer, .why__item{ grid-column: span 12; }
  .parallax{ min-height: 54vh; }
  .parallax--small{ min-height: 32vh; }
}
@media (prefers-reduced-motion: reduce){
  .heroBtn{ transition:none; }
}
/* ===== Animations (pro, subtle) ===== */

/* Page enter */
body.is-loaded .home{
  animation: pageIn .6s ease both;
}
@keyframes pageIn{
  from{ opacity:0; transform: translateY(10px); }
  to{ opacity:1; transform: translateY(0); }
}

/* Hero text pop-in (stagger) */
.heroTitle, .heroLead, .heroActions{
  opacity:0;
  transform: translateY(10px);
}
body.is-loaded .heroTitle{
  animation: rise .7s ease .05s both;
}
body.is-loaded .heroLead{
  animation: rise .7s ease .18s both;
}
body.is-loaded .heroActions{
  animation: rise .7s ease .30s both;
}
@keyframes rise{
  to{ opacity:1; transform: translateY(0); }
}

/* Reveal on scroll */
.reveal{
  opacity:0;
  transform: translateY(16px);
  transition: opacity .7s ease, transform .7s ease;
}
.reveal.in{
 opacity:1;
  transform: translateY(0);
}

/* Slight zoom on parallax background while scrolling (very subtle) */
.parallax{
  transform: translateZ(0);
}
.parallax__overlay{ backdrop-filter: none; }

/* Micro-interactions */
.offer, .why__item, .contactCard{
  transition: transform .18s ease, box-shadow .18s ease;
}
.offer:hover, .why__item:hover, .contactCard:hover{
  transform: translateY(-3px);
  box-shadow: 0 16px 34px rgba(0,0,0,.10);
}

/* Buttons already have hover; add tiny press */
.heroBtn:active{
  transform: translateY(0);
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  body.is-loaded .home,
  body.is-loaded .heroTitle,
  body.is-loaded .heroLead,
  body.is-loaded .heroActions{
    animation: none !important;
    
  }
  .reveal{ transition:none !important; }
}

/* ===== FOOTER (premium) ===== */
.footer{

  background:
    radial-gradient(1200px 420px at 15% 0%, rgba(214,40,40,.10), transparent 55%),
    radial-gradient(900px 360px at 85% 10%, rgba(255,255,255,.06), transparent 60%),
    linear-gradient(180deg, #1b1b1b 0%, #0f0f0f 100%);
  color: rgba(255,255,255,.86);
  border-top: 1px solid rgba(255,255,255,.10);
 margin-top: 0;
}

.footer__inner{
  max-width: 1400px;
  margin: 0 auto;
  padding: 44px 18px 26px;

  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr;
  gap: 26px;
  align-items: start;
}

.footer__brand{ max-width: 560px; }

.footer__logo{
  height: 46px;
  width: auto;
  display: inline-block;
  border-radius: 12px;

  /* premium “glass” border */
  border: 1px solid rgba(255,255,255,.12);
  box-shadow:
    0 10px 30px rgba(0,0,0,.35),
    0 0 0 1px rgba(0,0,0,.25) inset;
}

.footer__tagline{
  margin: 14px 0 0;
  color: rgba(255,255,255,.66);
  font-weight: 600;
  line-height: 1.65;
  letter-spacing: .1px;
}

.footer__col h4{
  margin: 0 0 12px;
  font-size: 12px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: rgba(255,255,255,.92);
  font-weight: 800;
}

/* linkovi “premium” */
.footer__col a{
  display: inline-flex;
  align-items: center;
  gap: 10px;

  padding: 8px 0;
  color: rgba(255,255,255,.72);
  font-weight: 650;
  text-decoration: none;

  transition: color .18s ease, transform .18s ease, opacity .18s ease;
  opacity: .95;
}

.footer__col a:hover{
  color: rgba(214,40,40,.98);
  transform: translateX(2px);
  opacity: 1;
}

/* tekst u footeru */
.footer__col p{
  margin: 0 0 10px;
  color: rgba(255,255,255,.70);
  font-weight: 650;
  line-height: 1.55;
}

/* CTA button — skuplji osjećaj */
.footer__cta{ margin-top: 14px; }

.footerBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 10px;

  padding: 12px 16px;
  border-radius: 14px;

  background:
    linear-gradient(180deg, rgba(214,40,40,1) 0%, rgba(170,20,20,1) 100%);
  border: 1px solid rgba(255,255,255,.12);

  color:#fff;
  font-weight: 850;
  letter-spacing: .35px;

  box-shadow:
    0 14px 28px rgba(0,0,0,.35),
    0 0 0 1px rgba(0,0,0,.22) inset;

  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}

.footerBtn:hover{
  transform: translateY(-2px);
  filter: brightness(1.03);
  box-shadow:
    0 18px 34px rgba(0,0,0,.45),
    0 0 0 1px rgba(0,0,0,.24) inset;
}

.footerBtn:active{
  transform: translateY(0px);
}

/* donji bar — tanji, profinjeniji */
.footer__bottom{
  max-width: 1400px;
  margin: 0 auto;
  padding: 16px 18px 20px;

  border-top: 1px solid rgba(255,255,255,.08);

  display:flex;
  justify-content: space-between;
  align-items:center;
  gap: 12px;
  flex-wrap: wrap;

  color: rgba(255,255,255,.58);
  font-weight: 650;
}

.footer__mini{
  display:flex;
  align-items:center;
  gap: 12px;
}

.footer__mini a{
  color: rgba(255,255,255,.58);
  text-decoration: none;
  transition: color .18s ease, opacity .18s ease;
  opacity: .95;
}

.footer__mini a:hover{
  color: rgba(214,40,40,.92);
  opacity: 1;
}

/* Responsive */
@media (max-width: 980px){
  .footer__inner{
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    padding: 40px 18px 22px;
  }
}

@media (max-width: 640px){
  .footer__inner{
    grid-template-columns: 1fr;
    padding: 36px 18px 18px;
  }
  .footer__logo{ height: 44px; }
}
/* ===== MODERN SLIDER ===== */

.slider{
  position: relative;
  max-width: 1100px;
  margin: 20px auto 0;
  overflow: hidden;
  background:#111;
  box-shadow: 0 20px 40px rgba(0,0,0,.15);
}

.slides{
  position: relative;
  width:100%;
  height:420px;
}

.slide{
  position:absolute;
  inset:0;
  opacity:0;
  transform: scale(1.02);
}

.slide.active{
  opacity:1;
  transform: scale(1);
  z-index:2;
}

.slide img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;

}

.slideCaption{
  position:absolute;
  left:24px;
  bottom:24px;
  background: rgba(0,0,0,.45);
  backdrop-filter: blur(6px);
  padding:14px 18px;
 
  color:#fff;
  max-width:420px;
}

.slideCaption h3{
  margin:0 0 4px;
  font-size:18px;
}

.slideCaption p{
  margin:0;
  font-weight:600;
  font-size:14px;
  opacity:.9;
}

/* arrows */
.sliderBtn{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  width:44px;
  height:44px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.2);
  background: rgba(0,0,0,.35);
  color:#fff;
  font-size:26px;
  cursor:pointer;
  z-index:3;
}

.sliderBtn.prev{ left:14px; }
.sliderBtn.next{ right:14px; }

.sliderBtn:hover{
  background: rgba(214,40,40,.8);
}

/* dots */
.sliderDots{
  position:absolute;
  bottom:14px;
  left:50%;
  transform: translateX(-50%);
  display:flex;
  gap:8px;
  z-index:3;
}

.dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background: rgba(255,255,255,.4);
  cursor:pointer;
  transition: transform .2s ease, background .2s ease;
}

.dot.active{
  background:#d62828;
  transform: scale(1.2);
}

/* responsive */
@media (max-width:720px){
  .slides{ height:280px; }
  .slideCaption{
    left:14px;
    right:14px;
    bottom:14px;
    max-width:none;
  }
}
/* ===== PAGE LOADER ===== */
.pageLoader{
  position: fixed;
  inset: 0;
  background: rgba(244,242,241,.92);
  backdrop-filter: blur(8px);
  display: grid;
  place-items: center;
  z-index: 9999;
  opacity: 1;
   transition: opacity .55s ease, visibility .55s ease;
}

.pageLoader.hide{
  opacity: 0;
  visibility: hidden;
}

.spinner{
  width: 52px;
  height: 52px;
  border-radius: 999px;
  border: 4px solid rgba(0,0,0,.10);
  border-top-color: rgba(214,40,40,.95);
  animation: spin .8s linear infinite;
  box-shadow: var(--shadow-sm);
}

@keyframes spin{ to{ transform: rotate(360deg); } }
.offer, .why__item, .contactCard{
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  background: var(--panel);
}
.slideCaption{
  opacity:0;
  transform: translateY(10px);
  transition: opacity .6s ease, transform .6s ease;
}

.slide.active .slideCaption{
  opacity:1;
  transform: translateY(0);
}


/* ===== Full-bleed slider (puna širina) ===== */
.slider{
  width: 100vw;
  max-width: none;
  margin: 22px calc(50% - 50vw) 0;  /* full width, centrirano */
 
  overflow: hidden;
}

/* malo “frame” look da nije flat */
.slider:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.10);
  z-index:4;
}

/* ===== Slider enter (premium bounce) ===== */
.slider{
  transform: translateY(10px) scale(.985);
  opacity: 0;
}

body.is-loaded .slider{
  animation: sliderIn .85s cubic-bezier(.2, .9, .2, 1.05) .12s both;
}

@keyframes sliderIn{
  0%   { opacity:0; transform: translateY(14px) scale(.98); }
  55%  { opacity:1; transform: translateY(-6px) scale(1.01); }
  100% { opacity:1; transform: translateY(0) scale(1); }
}

/* Caption “pop” na aktivnom slideu */
.slideCaption{
  opacity:0;
  transform: translateY(12px);
  transition: opacity .55s ease, transform .55s ease;
}
.slide.active .slideCaption{
  opacity:1;
  transform: translateY(0);
}
/* ===== Stacked tiles animation ===== */
.reveal{
  opacity:0;
  transform: translateY(18px) scale(.98);
}

.reveal.in{
  animation: stackIn .75s cubic-bezier(.2,.9,.2,1.08) both;
  animation-delay: var(--d, 0ms);
}

@keyframes stackIn{
  0%   { opacity:0; transform: translateY(18px) scale(.98); }
  65%  { opacity:1; transform: translateY(-6px) scale(1.01); }
  100% { opacity:1; transform: translateY(0) scale(1); }
}
.slide.pulse .slideCaption{
  animation: capPop .55s cubic-bezier(.2,.9,.2,1.08) both;
}
@keyframes capPop{
  0%{ opacity:0; transform: translateY(10px); }
  70%{ opacity:1; transform: translateY(-4px); }
  100%{ opacity:1; transform: translateY(0); }
}
.slide img{
  transform: scale(1.03);
}
.slide.active img{
  animation: imgSlowZoom 4.5s ease-out both;
}
@keyframes imgSlowZoom{
  from{ transform: scale(1.06); }
  to{ transform: scale(1.02); }
}
/* ===== SPLIT HERO ===== */

.heroSplit{
  display:grid;
  grid-template-columns: 1fr 1fr;
  min-height: 78vh;
  background:#efefef;
}

.heroLeft{
  padding:80px 60px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}





/* ==== DODANO ZA PRO ANIMACIJE ==== */

/* slide animation */
.slide.active{
  animation: slideIn .75s cubic-bezier(.2,.9,.2,1.02) both;
}

@keyframes slideIn{
  0%{opacity:0; transform:scale(1.04); }
  100%{opacity:1; transform:scale(1);}
}

/* caption pop */
.slide.pulse .slideCaption{
  animation: capPop .65s cubic-bezier(.2,.9,.2,1.08) both;
}

@keyframes capPop{
  0%{opacity:0; transform:translateY(14px);}
  70%{opacity:1; transform:translateY(-6px);}
  100%{opacity:1; transform:translateY(0);}
}
/* ===== POLIS-STYLE SPLIT HERO ===== */
.heroSplit{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  min-height: 72vh;
  background: #e9e7e6;
}

.heroLeft{
  padding: clamp(28px, 5vw, 64px);
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.heroBig{
  margin:0;
  font-size: clamp(44px, 6vw, 92px);
  letter-spacing: -1px;
}

.heroGold{
  margin-top: 10px;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-size: clamp(20px, 3vw, 34px);
  color: red; 
}

.heroLine{
  margin-top: 10px;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-size: clamp(18px, 2.4vw, 30px);
}

.heroBtns{ margin-top: 22px; display:flex; gap:12px; flex-wrap:wrap; }







/* arrows like polis */
.heroArrow{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  width:48px;
  height:48px;
  border-radius:999px;
  border: 1px solid rgba(0,0,0,.18);
  background: rgba(255,255,255,.75);
  font-size: 28px;
  cursor:pointer;
}
.heroArrow.left{ left:14px; }
.heroArrow.right{ right:14px; }
.heroArrow:hover{ background: rgba(214,40,40,.92); color:#fff; border-color: rgba(214,40,40,.25); }

@media (max-width: 980px){
  .heroSplit{ grid-template-columns: 1fr; }
  .heroRight{ min-height: 320px; }
}
.offer, .why__item, .contactCard{
  border-radius: var(--radius);
  box-shadow: var(--shadowSm);
  border: 1px solid rgba(0,0,0,.06);
  background: var(--panel);
}

.offer:hover, .why__item:hover, .contactCard:hover{
  box-shadow: var(--shadow);
  transform: translateY(-4px);
}
.offers, .why, .contactGrid{
  max-width: var(--max);
}
/* flip container */

/* Flip unutar heroGold */
.heroFlip{
  display: inline-block;
  height: 50px;
  overflow: hidden;
  vertical-align: middle;
}

.heroFlipTrack{
  display: inline-block;
  animation: heroShow 5s linear infinite;
  will-change: transform;
}

.heroFlipItem{
  display: inline-block;
  color:#fff;
  padding: 6px 14px;
  height: 45px;
  line-height: 33px; /* fino centriranje teksta */
  margin-bottom: 45px; /* bitno za “stack” kao u originalu */
  border-radius: 12px;
  font-weight: 800;
  letter-spacing: .6px;
  text-transform: uppercase;
}

/* boje kao u tvom primjeru */
.heroFlip--red1 { background: linear-gradient(135deg,#8e0000,#c62828); }
.heroFlip--red2 { background: linear-gradient(135deg,#b71c1c,#e53935); }
.heroFlip--red3 { background: linear-gradient(135deg,#d62828,#ff6b6b); }

@keyframes heroShow{
  0%   { transform: translateY(-270px); }
  5%   { transform: translateY(-180px); }
  33%  { transform: translateY(-180px); }
  38%  { transform: translateY(-90px); }
  66%  { transform: translateY(-90px); }
  71%  { transform: translateY(0px); }
  99.99% { transform: translateY(0px); }
  100% { transform: translateY(-270px); }
}
/* keyboard efekt za FLAMMA */
/* force da radi čak i ako postoje drugi stilovi */
.heroKeyboard > span{
  display: inline-block !important;
  animation-duration: 2.4s !important;
  animation-iteration-count: infinite !important;
  animation-timing-function: ease-in-out !important;
  will-change: transform;
}

/* keyframes */
@keyframes heroKeyPressA {
  0%, 20%, 100% { transform: translateY(0); }
  10% { transform: translateY(10px); }
}
@keyframes heroKeyPressB {
  0%, 50%, 100% { transform: translateY(0); }
  40% { transform: translateY(10px); }
}
@keyframes heroKeyPressC {
  0%, 80%, 100% { transform: translateY(0); }
  70% { transform: translateY(10px); }
}

/* raspodjela po slovima */
.heroKeyboard > span:nth-child(1){ animation-name: heroKeyPressA !important; }
.heroKeyboard > span:nth-child(2){ animation-name: heroKeyPressB !important; }
.heroKeyboard > span:nth-child(3){ animation-name: heroKeyPressC !important; }
.heroKeyboard > span:nth-child(4){ animation-name: heroKeyPressA !important; animation-duration: 2.1s !important; }
.heroKeyboard > span:nth-child(5){ animation-name: heroKeyPressB !important; animation-duration: 2.7s !important; }
.heroKeyboard > span:nth-child(6){ animation-name: heroKeyPressC !important; animation-duration: 2.3s !important; }



.heroBtn.heroBtn--cta{
  display: inline-flex;
  align-items: center;
  gap: 18px;

  padding: 12px 28px;
  text-decoration: none;

  transform: skewX(-15deg);
  box-shadow: 6px 6px 0 rgba(0,0,0,.75);
  transition: box-shadow .35s ease, transform .35s ease;
}

/* da tekst izgleda "ravno" */
.heroBtn.heroBtn--cta .heroBtn__text,
.heroBtn.heroBtn--cta .heroBtn__icon{
  display: inline-flex;
  transform: skewX(15deg);
}

/* ikona */
.heroBtn.heroBtn--cta .heroBtn__icon{
  width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
}

/* hover – ista fora */
.heroBtn.heroBtn--cta:hover{
  box-shadow: 10px 10px 0 rgba(214,40,40,.85); /* crvena sjena da paše */
}

.heroBtn.heroBtn--cta .heroBtn__icon{
  margin-right: 0;
  transition: margin-right .35s ease;
}
.heroBtn.heroBtn--cta:hover .heroBtn__icon{
  margin-right: 18px;
}

/* SVG strelice - inicijalno povučene ulijevo */
.heroBtn.heroBtn--cta path.one{
  transition: .35s;
  transform: translateX(-60%);
}
.heroBtn.heroBtn--cta path.two{
  transition: .45s;
  transform: translateX(-30%);
}
.heroBtn.heroBtn--cta path.three{
  transition: .55s;
}

/* na hover vrati ih i animiraj boju */
.heroBtn.heroBtn--cta:hover path.one{
  transform: translateX(0%);
  animation: heroBtnColor 1s infinite .6s;
}
.heroBtn.heroBtn--cta:hover path.two{
  transform: translateX(0%);
  animation: heroBtnColor 1s infinite .4s;
}
.heroBtn.heroBtn--cta:hover path.three{
  animation: heroBtnColor 1s infinite .2s;
}

@keyframes heroBtnColor{
  0%{ color: #fff; }
  50%{ color: #ffd1d1; }
  100%{ color: #fff; }
}
.heroBtn.heroBtn--cta{
  display:inline-flex;
  align-items:center;
  gap:18px;
  padding:12px 28px;
  transform: skewX(-15deg);
  box-shadow: 6px 6px 0 rgba(0,0,0,.75);
  transition: box-shadow .35s ease;
  text-decoration:none;
}

.heroBtn.heroBtn--cta .heroBtn__text,
.heroBtn.heroBtn--cta .heroBtn__icon{
  transform: skewX(15deg);
  display:inline-flex;
}

.heroBtn.heroBtn--cta .heroBtn__icon{
  transition: margin-right .35s ease;
}

.heroBtn.heroBtn--cta:hover{
  box-shadow: 10px 10px 0 rgba(214,40,40,.85);
}

.heroBtn.heroBtn--cta:hover .heroBtn__icon{
  margin-right:18px;
}

.heroBtn.heroBtn--cta path.one{ transition:.35s; transform: translateX(-60%); }
.heroBtn.heroBtn--cta path.two{ transition:.45s; transform: translateX(-30%); }
.heroBtn.heroBtn--cta:hover path.one{ transform:translateX(0%); animation: heroBtnColor 1s infinite .6s; }
.heroBtn.heroBtn--cta:hover path.two{ transform:translateX(0%); animation: heroBtnColor 1s infinite .4s; }
.heroBtn.heroBtn--cta:hover path.three{ animation: heroBtnColor 1s infinite .2s; }

@keyframes heroBtnColor{
  0%{ color:#fff; }
  50%{ color:#ffd1d1; }
  100%{ color:#fff; }
}
/* svi heroBtn postaju animated CTA */
.heroBtn{
  position: relative;
  display: inline-block;
  padding: 14px 42px 14px 26px;
  transform: skewX(-15deg);
  transition: box-shadow .35s ease, transform .35s ease;
  box-shadow: 6px 6px 0 rgba(0,0,0,.75);
}

/* da tekst ostane ravan */
.heroBtn > *{
  display:inline-block;
  transform: skewX(15deg);
}

/* strelice (3 komada) */


/* hover efekt */
.heroBtn:hover{
  box-shadow: 10px 10px 0 rgba(214,40,40,.85);
}

.heroBtn:hover::after{
  transform: translateY(-50%) translateX(8px) skewX(15deg);
  color: #ffd1d1;
}
.heroBtn{
  display:inline-flex;
  align-items:center;
  gap:12px;
}

.heroBtn__icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.heroBtn svg{
  display:block;
}

/* početno stanje */
.heroBtn path.one {
  transform: translateX(0%);
  transition: .3s ease;
}

.heroBtn path.two {
  transform: translateX(-60%);
  transition: .3s ease;
}

.heroBtn path.three {
  transform: translateX(-120%);
  transition: .3s ease;
}

/* na hover sve dođu */
.heroBtn:hover path.two {
  transform: translateX(0%);
}

.heroBtn:hover path.three {
  transform: translateX(0%);
}

/* ===== HERO RIGHT: container ===== */
/* =========================
   HERO RIGHT — PREMIUM SLIDESHOW
   ========================= */

/* ===============================
   HERO RIGHT — ORIGINAL-LIKE SLIDESHOW (premium)
   Brand color: #d62828
   =============================== */

/* ===========================
   HERO RIGHT PREMIUM SLIDESHOW
   =========================== */

.heroRight{
  position: relative;
  overflow: hidden;
}

.heroSlides{
  position: absolute;
  inset: 0;
  background: var(--accent);
  overflow: hidden;
  border-radius: inherit;
}

.heroSlide{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0;
  visibility: hidden;
  z-index: 0;
  filter: saturate(1.02) contrast(1.02);
  transform: scale(1);
  transition: opacity .6s ease, transform 2.4s ease, visibility .6s ease;
}

.heroSlide.active{
  opacity: 1;
  visibility: visible;
  z-index: 2;
  transform: scale(1);
}
.heroSlide[src*="slide-5"],
.heroSlide[src*="kauri"]{
  object-fit: contain;

}

/* RED OVERLAY */
.heroRight::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  /* background: linear-gradient(
    120deg,
    rgba(214,40,40,0.55),
    rgba(214,40,40,0.2),
    rgba(40,0,0,0.6)
  ); */
  mix-blend-mode: multiply;
}

/* VIGNETTE */
/* .heroRight::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  background:
    radial-gradient(circle at 55% 45%,
      rgba(0,0,0,0) 52%,
      rgba(0,0,0,0.55) 100%);
} */

/* SHUTTERS */
.heroShutters{
  position:absolute;
  height:150vmax;
  width:150vmax;
  left: calc(50% - 75vmax);
  top:  calc(50% - 75vmax);
  z-index:4;
  pointer-events:none;
  animation: rotateFrame calc(var(--t) * 4) linear infinite;
}

@keyframes rotateFrame{
  0%{ transform: rotate(0deg); }
  100%{ transform: rotate(180deg); }
}

.heroShutters::before,
.heroShutters::after{
  content:"";
  position:absolute;
  height:100%;
  width:100%;
  left:50%;
  transform: translateX(-50%);
  background-color: var(--accent);
}

.heroShutters::before{
  bottom:50%;
  animation: openTop calc(var(--t) * 2) infinite;
}
.heroShutters::after{
  top:50%;
  animation: openBottom calc(var(--t) * 2) infinite;
}

@keyframes openTop{
  0%{ transform: translateX(-50%) translateY(0); }
  40%{ transform: translateX(-50%) translateY(-65vmax); }
  70%{ transform: translateX(-50%) translateY(-65vmax); }
  100%{ transform: translateX(-50%) translateY(0); }
}
@keyframes openBottom{
  0%{ transform: translateX(-50%) translateY(0); }
  40%{ transform: translateX(-50%) translateY(65vmax); }
  70%{ transform: translateX(-50%) translateY(65vmax); }
  100%{ transform: translateX(-50%) translateY(0); }
}

/* CAPTION */
.heroCaption{
  position:absolute;
  left:8%;
  top:50%;
  transform: translateY(-50%);
  z-index:9;
  color:#fff;
  mix-blend-mode: lighten;
  line-height:0.9;
  text-shadow:0 0 20px rgba(0,0,0,.4);
}

/* kicker */
.capKicker{
  display:inline-block;
  margin-bottom:12px;
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  padding:8px 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.3);
  background:rgba(0,0,0,.18);
  color:white;

}

/* TYPEWRITER */
.capType{
  display:block;
font-size: clamp(40px, 2.8vw, 34px);
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  border-right:2px solid #fff;
  width:0ch;
  animation:
    typing1 1.4s steps(28,end) forwards,
    blink .8s step-end infinite;
  animation-delay:.6s,.6s;
}

.capSlogan{
  display:block;
  margin-top:10px;
  font-size:clamp(14px,1.6vw,18px);
  white-space:nowrap;
  overflow:hidden;
  width:0ch;
  animation: typing2 1.5s steps(35,end) forwards;
  animation-delay:1.9s;
}

@keyframes typing1{ to{ width:28ch; } }
@keyframes typing2{ to{ width:35ch; } }

@keyframes blink{
  50%{ border-color:transparent; }
}

/* BUTTON */
.capBtn{
  display:inline-block;
  margin-top:22px;
  padding:12px 18px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.5);
  color:#fff;
  text-decoration:none;
  font-size:13px;
  letter-spacing:.12em;
  text-transform:uppercase;
  background:rgba(0,0,0,.25);
  transition:.2s ease;
}
.capBtn:hover{
  transform:translateY(-2px);
  background:rgba(0,0,0,.35);
}

/* NOVI SLIDER*/
/* Reset */

/* Swiper container */
.swiper {
  width: 100%;
  height: 520px; /* full screen */
  position: relative;
}

/* Slide */
.swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Slike */
.swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.swiper-slide::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
}
/* FULLSCREEN WRAPPER (nema heroSlider) */
.primaryShowcase,
.primaryShowcase .swiper {
  width: 100%;
  height: 520px;
}

/* SLIDE */
.primaryShowcase .swiper-slide {
  position: relative;
  overflow: hidden;
}

/* BACKGROUND IMAGE */
.primaryShowcase .slideBg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.06);
  transition: transform 1.2s ease;
}

/* OVERLAY */
.primaryShowcase .slideOverlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
}

/* CONTENT */
.primaryShowcase .slideContent{
  position: relative;
  z-index: 5;                 /* iznad kartica */
  width: min(900px, 92vw);
  
  padding-right: clamp(0px, 26vw, 420px); /* ostavi mjesta desno za kartice */
}

.primaryShowcase .kicker {
  font-size: 14px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  opacity: 0.9;
}

.primaryShowcase .title {
  margin: 0;
  font-size: clamp(34px, 5vw, 64px);
  line-height: 1.05;
}

.primaryShowcase .desc {
  margin: 0;
  font-size: clamp(16px, 1.6vw, 20px);
  max-width: 60ch;
  opacity: 0.9;
}

.primaryShowcase .btn {
  display: inline-block;
  width: fit-content;
  padding: 12px 18px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.28);
  color: #fff;
  text-decoration: none;
  backdrop-filter: blur(8px);
}

/* POP-UP (default hidden) */
.primaryShowcase .kicker,
.primaryShowcase .title,
.primaryShowcase .desc,
.primaryShowcase .btn {
  opacity: 0;
  transform: translateY(18px);
  filter: blur(6px);
  transition: opacity .7s ease, transform .7s ease, filter .7s ease;
}

/* Active slide animations (Swiper dodaje .swiper-slide-active) */
.primaryShowcase .swiper-slide-active .kicker { opacity: 1; transform: translateY(0); filter: blur(0); transition-delay: .12s; }
.primaryShowcase .swiper-slide-active .title  { opacity: 1; transform: translateY(0); filter: blur(0); transition-delay: .20s; }
.primaryShowcase .swiper-slide-active .desc   { opacity: 1; transform: translateY(0); filter: blur(0); transition-delay: .30s; }
.primaryShowcase .swiper-slide-active .btn    { opacity: 1; transform: translateY(0); filter: blur(0); transition-delay: .40s; }

/* Zoom samo na active */
.primaryShowcase .swiper-slide-active .slideBg {
  transform: scale(1);
}

/* Swiper UI */
.primaryShowcase .swiper-button-next,
.primaryShowcase .swiper-button-prev {
  color: #fff;
}
.introBlock {
  padding: 120px 20px;
  background: #fff;
  text-align: center;
}

.introContainer {
  max-width: 900px;
  margin: 0 auto;
}

.introKicker {
  font-size: 14px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #888;
}

.introTitle {
  font-size: clamp(28px, 4vw, 48px);
  margin: 20px 0;
}

.introText {
  font-size: 18px;
  color: #555;
  line-height: 1.6;
}

.bandSection {
  padding: 120px 20px;   /* isto kao introBlock */
  background: #fff;
  text-align: center;
  font-weight: 600;
}

.bandContainer {
  max-width: 900px;      /* isto */
  margin: 0 auto;
}

.bandTitle {
  font-size: clamp(28px, 4vw, 48px);  /* isto kao .introTitle */
  margin: 20px 0;
  font-weight: 600;
   text-transform: none;
}

.bandLead {
  font-size: 18px;       /* isto kao .introText */
  
  
  line-height: 1.6;
  line-height: 1.6;
  max-width: 900px;
  margin: 0 auto;
}
/* ===== REVEAL / POP-UP on scroll ===== */
.reveal{
  opacity: 0;
  transform: translateY(18px) scale(.985);
  transition:
    opacity .7s ease,
    transform .7s cubic-bezier(.2,.9,.2,1);
  will-change: opacity, transform;
}

.reveal.is-visible{
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* fine stagger delay */
.reveal--kicker{ transition-delay: .05s; }
.reveal--title{  transition-delay: .12s; }
.reveal--text{   transition-delay: .20s; }

/* accessibility */
@media (prefers-reduced-motion: reduce){
  .reveal{
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}
/* POP-UP kartice (mini slike) */
.primaryShowcase .popCard{
  position: absolute;
  width: 240px;
  aspect-ratio: 4 / 3;
  border-radius: 16px;
  overflow: hidden;
  z-index: 2;
  box-shadow: 0 22px 70px rgba(0,0,0,.38);

  opacity: 0;
  transform: translateY(26px) scale(.96);
  transition: opacity .7s ease, transform .7s ease;
  pointer-events: none; /* da ne smeta klikanju */
}

.primaryShowcase .popCard img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Pozicije kartica (desktop) */
.primaryShowcase .popCard--1{ right: 6vw;  top: 18vh; transform: translateY(30px) rotate(3deg)  scale(.96); }
.primaryShowcase .popCard--2{ right: 12vw; top: 44vh; transform: translateY(30px) rotate(-4deg) scale(.96); }
.primaryShowcase .popCard--3{ right: 5vw;  top: 64vh; transform: translateY(30px) rotate(2deg)  scale(.96); }

/* Kad je slide aktivan -> pojavi se + “stagger” */
.primaryShowcase .swiper-slide-active .popCard{
  opacity: 1;
  transform: translateY(0) scale(1);
}

.primaryShowcase .swiper-slide-active .popCard--1{ transition-delay: .16s; }
.primaryShowcase .swiper-slide-active .popCard--2{ transition-delay: .30s; }
.primaryShowcase .swiper-slide-active .popCard--3{ transition-delay: .44s; }

/* Responsive: smanji na mobitelu */
@media (max-width: 900px){
  .primaryShowcase .popCard{ width: 170px; }
  .primaryShowcase .popCard--1{ right: 4vw; top: 16vh; }
  .primaryShowcase .popCard--2{ right: 10vw; top: 40vh; }
  .primaryShowcase .popCard--3{ right: 4vw; top: 60vh; }
}
.primaryShowcase .swiper-slide-active .popCard{
  animation: floaty 4.5s ease-in-out infinite;
}
.primaryShowcase .swiper-slide-active .popCard--2{ animation-delay: .4s; }
.primaryShowcase .swiper-slide-active .popCard--3{ animation-delay: .8s; }

@keyframes floaty{
  0%,100% { transform: translateY(0) scale(1); }
  50%     { transform: translateY(-10px) scale(1); }
}
.primaryShowcase .popCard{
  position: absolute;
  width: 240px;
  aspect-ratio: 4 / 3;
  border-radius: 16px;
  overflow: hidden;
  z-index: 3;
  box-shadow: 0 22px 70px rgba(0,0,0,.38);
  pointer-events: none;
  color:white;

  opacity: 0; /* GSAP kontrolira */
  transform: translate3d(0,0,0);
}

.primaryShowcase .popCard img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Pozicije (ostavi kako ti paše) */
.primaryShowcase .popCard--1{ right: 6vw;  top: 18vh; }
.primaryShowcase .popCard--2{ right: 12vw; top: 44vh; }
.primaryShowcase .popCard--3{ right: 5vw;  top: 64vh; }

@media (max-width: 900px){
  .primaryShowcase .popCard{ width: 170px; }
  .primaryShowcase .popCard--1{ right: 4vw; top: 16vh; }
  .primaryShowcase .popCard--2{ right: 10vw; top: 40vh; }
  .primaryShowcase .popCard--3{ right: 4vw; top: 60vh; }
}
/* ===== MAP (spojeno s footerom) ===== */
.mapSection{
  margin: 0;                 /* nema razmaka iznad/ispod */
  padding: 34px 0 0;         /* isto “diše” kao footer__inner */

}

.mapInner{
  max-width: 1400px;         /* isti max kao footer */
  margin: 0 auto;
  padding: 0 18px 22px;      /* match footer__inner padding bottom */
}

.mapHead{
  color: rgba(255,255,255,.88);
  margin: 0 0 12px;
}

.mapTitle{
  margin: 0 0 6px;
  font-size: clamp(20px, 2vw, 28px);
  font-weight: 800;
}

.mapLead{
  margin: 0;
  color: rgba(255,255,255,.68);
  font-weight: 650;
  line-height: 1.55;
}

.mapCard{
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.02);
  box-shadow: 0 18px 40px rgba(0,0,0,.35);
}

.mapIframe{
  width: 100%;
  height: clamp(260px, 40vh, 380px);
  border: 0;
  display: block;
}

/* ključni dio: makni footerov margin-top jer on radi “rupu” */



@media (max-width: 480px){
  .heroFlip{
    max-width: 100%;
  }
  .heroFlipItem{
    max-width: 92vw;
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
@media (max-width: 480px){
  .heroGold { width: 100%; }

  .heroFlip{
    display: block;
    max-width: 100%;
  }

  .heroFlipItem{
    display: block;
    max-width: 92vw;
    margin: 0 auto 45px;     /* centriraj “pill” */
    text-align: center;
    font-size: 16px;         /* po potrebi 13px */
    line-height: 1.15;
    white-space: normal;     /* dopusti prelamanje */
  }
}
.slideContent{
  color:white;
}
/* ===== MOBILE CLEAN VERSION ===== */
@media (max-width: 768px){

  /* Makni floating slike */
  .primaryShowcase .popCard{
    display: none !important;
  }

  /* Makni strelice */
  .primaryShowcase .swiper-button-next,
  .primaryShowcase .swiper-button-prev{
    display: none !important;
  }

  /* Opcionalno: centriraj tekst za mob */
  .primaryShowcase .slideContent{
    padding: 0 24px;
    text-align: center;
    align-items: center;
  }

  .primaryShowcase .desc{
    max-width: 100%;
  }
}