/* =========================================================
   FreshAir — gallery.css  (agent A5)
   1. Sa terena — galerija (mobilni snap-karusel / desktop bento)
   2. Lightbox #lb
   3. Kontakt .cta — broj telefona kao veliki LCD
   4. Futer .ftr — spoljna jedinica klime sa nalepnicom
   ========================================================= */

/* =========================================================
   1. GALERIJA
   ========================================================= */
.gal{
  display:grid;grid-auto-flow:column;grid-auto-columns:74%;align-items:start;gap:12px;
  /* mobilni: karusel do ivica ekrana */
  margin:-8px calc(var(--gutter) * -1) 0;
  padding:8px var(--gutter) 18px;
  overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);
  scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.gal::-webkit-scrollbar{display:none}

.gal-item{
  position:relative;margin:0;aspect-ratio:3/4;
  border-radius:var(--r-m);overflow:hidden;background:#DCE5EE;
  scroll-snap-align:start;cursor:zoom-in;
  box-shadow:0 0 0 1px rgba(10,26,47,.06),0 14px 26px -16px rgba(10,26,47,.45);
  -webkit-tap-highlight-color:transparent;
}
.gal-item img{
  display:block;width:100%;height:100%;object-fit:cover;object-position:50% 42%;
  transition:transform .7s cubic-bezier(.2,.7,.2,1);
  -webkit-user-drag:none;user-select:none;
}
/* tamni gradijent odozdo + staklena lupa gore desno */
.gal-item::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;
  background:linear-gradient(180deg,rgba(7,18,31,0) 52%,rgba(7,18,31,.42) 100%);
  transition:opacity .45s ease;
}
.gal-item::after{
  content:"";position:absolute;top:10px;right:10px;z-index:2;width:38px;height:38px;border-radius:50%;
  pointer-events:none;opacity:0;transform:scale(.8);
  background:rgba(255,255,255,.2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.5 15.5L21 21M10.5 8v5M8 10.5h5'/%3E%3C/svg%3E") center/19px no-repeat;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.42),0 4px 12px -4px rgba(7,18,31,.5);
  transition:opacity .35s ease,transform .45s cubic-bezier(.3,1.5,.5,1);
}
@media (hover:hover){
  .gal-item:hover img{transform:scale(1.05)}
  .gal-item:hover::before{opacity:1}
  .gal-item:hover::after{opacity:1;transform:none}
}
/* na dodir ekranu nema hovera — lupa je stalno tiho prisutna */
@media (hover:none){
  .gal-item::after{opacity:.85;transform:none}
}
.gal-item:has(img:focus-visible)::before{opacity:1}
.gal-item:has(img:focus-visible)::after{opacity:1;transform:none}

/* fokus: prsten na figure (da ga overflow slike ne iseče) */
.gal-item img:focus-visible{outline:none}
.gal-item:has(img:focus-visible){outline:3px solid var(--cyan);outline-offset:3px}
@supports not selector(:has(*)){
  .gal-item img:focus-visible{outline:3px solid var(--cyan);outline-offset:-4px}
}

/* ulazak: JS dodaje .is-armed odmah, .is-in kad galerija uđe u vidno polje */
.gal.is-armed .gal-item{opacity:0;transform:translateY(16px) scale(.95)}
.gal.is-armed.is-in .gal-item{
  opacity:1;transform:none;
  transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .85s cubic-bezier(.2,.7,.2,1);
  transition-delay:calc(min(var(--i,0),6) * 75ms);
}

/* mali indikator napretka karusela */
.gal-dots{display:flex;justify-content:center;gap:6px;margin:2px 0 0}
.gal-dots i{
  display:block;width:6px;height:6px;border-radius:999px;background:var(--line-strong);
  transition:width .35s cubic-bezier(.2,.7,.2,1),background-color .35s;
}
.gal-dots i.is-on{width:22px;background:var(--blue)}

.gal-more{margin-top:22px}

/* ---------- desktop: bento ---------- */
@media (min-width:720px){
  .gal{
    grid-auto-flow:row dense;grid-auto-columns:auto;
    grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(150px,15vw,210px);
    align-items:stretch;gap:14px;
    margin:0;padding:0;overflow:visible;
    scroll-snap-type:none;
  }
  .gal-item{aspect-ratio:auto;border-radius:var(--r-m);box-shadow:0 0 0 1px rgba(10,26,47,.05),var(--shadow-1)}
  .gal-dots{display:none}

  /* 7 slika = 12 ćelija (4×3), bez rupa */
  .gal-item:nth-child(1){grid-column:span 2;grid-row:span 2}
  .gal-item:nth-child(4){grid-row:span 2}
  .gal-item:nth-child(6){grid-column:span 2}
  .gal-item:nth-child(1)::after{top:14px;right:14px;width:44px;height:44px;background-size:22px}

  /* ako server vrati manje slika — i dalje bez rupa */
  .gal[data-n="6"] .gal-item:nth-child(5){grid-column:span 2}
  .gal[data-n="6"] .gal-item:nth-child(6){grid-column:auto;grid-row:span 2}
  .gal[data-n="5"] .gal-item:nth-child(4){grid-row:auto}
  .gal[data-n="5"] .gal-item:nth-child(6){grid-column:auto}
  .gal[data-n="4"] .gal-item:nth-child(4){grid-row:auto;grid-column:span 2}
  .gal[data-n="3"] .gal-item:nth-child(2),
  .gal[data-n="3"] .gal-item:nth-child(3){grid-column:span 2}
  .gal[data-n="2"] .gal-item:nth-child(2){grid-column:span 2;grid-row:span 2}
  .gal[data-n="1"] .gal-item:nth-child(1){grid-column:span 4}
}

/* =========================================================
   2. LIGHTBOX
   ========================================================= */
html.lb-lock body{overflow:hidden}

.lb{
  position:fixed;inset:0;z-index:400;
  display:flex;align-items:center;justify-content:center;
  padding:calc(64px + env(safe-area-inset-top)) 16px calc(96px + env(safe-area-inset-bottom));
  background:rgba(4,10,18,.92);
  -webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);
  opacity:0;transition:opacity .3s ease;
  touch-action:pan-y pinch-zoom;
}
.lb[hidden]{display:none}
.lb.is-open{opacity:1}
.lb [hidden]{display:none}

.lb-fig{
  margin:0;display:flex;flex-direction:column;align-items:center;gap:14px;max-width:100%;
  transform:translateY(10px) scale(.96);
  transition:transform .42s cubic-bezier(.2,.8,.2,1);
}
.lb.is-open .lb-fig{transform:none}
.lb-fig img{
  display:block;width:auto;height:auto;
  max-width:min(92vw,900px);max-height:calc(100vh - 240px);max-height:calc(100dvh - 240px);
  border-radius:14px;background:#0B1B2A;
  box-shadow:0 30px 80px -10px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.08);
  -webkit-user-drag:none;user-select:none;cursor:default;
  transition:opacity .16s ease,transform .16s ease;
}
.lb-fig img.is-out{opacity:0;transform:translateX(calc(var(--dir,1) * -26px))}
.lb-cap{
  display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:4px 12px;
  max-width:min(92vw,640px);min-height:1em;margin:0;text-align:center;
  font:500 12px/1.5 var(--f-mono);letter-spacing:.04em;color:rgba(228,238,247,.7);
}
.lb-cap:empty{display:none}
.lb-n{color:var(--lcd-on);letter-spacing:.14em;font-weight:600}

.lb-x,.lb-prev,.lb-next{
  position:absolute;width:48px;height:48px;padding:0;border:0;border-radius:50%;
  font-size:0;line-height:0;color:transparent;cursor:pointer;
  background-color:rgba(255,255,255,.1);background-repeat:no-repeat;background-position:center;background-size:22px;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.22),0 8px 20px -8px rgba(0,0,0,.6);
  -webkit-tap-highlight-color:transparent;
  transition:background-color .2s ease,transform .2s ease,box-shadow .2s ease;
}
.lb-x:hover,.lb-prev:hover,.lb-next:hover{background-color:rgba(127,230,255,.2);box-shadow:inset 0 0 0 1px rgba(127,230,255,.55),0 8px 20px -8px rgba(0,0,0,.6)}
.lb-x:active,.lb-prev:active,.lb-next:active{transform:scale(.94)}
.lb-x:focus-visible,.lb-prev:focus-visible,.lb-next:focus-visible{outline:3px solid var(--cyan);outline-offset:3px;border-radius:50%}
.lb-x{
  top:max(14px,calc(env(safe-area-inset-top) + 8px));right:14px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
}
.lb-prev{
  left:16px;bottom:calc(22px + env(safe-area-inset-bottom));
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 5l-7 7 7 7'/%3E%3C/svg%3E");
}
.lb-next{
  right:16px;bottom:calc(22px + env(safe-area-inset-bottom));
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E");
}
@media (min-width:720px){
  .lb{padding:72px 104px}
  .lb-fig img{max-height:calc(100vh - 200px);max-height:calc(100dvh - 200px)}
  .lb-x{top:22px;right:24px;width:52px;height:52px}
  .lb-prev,.lb-next{bottom:auto;top:50%;margin-top:-26px;width:52px;height:52px}
  .lb-prev{left:28px}
  .lb-next{right:28px}
}

/* =========================================================
   3. KONTAKT
   ========================================================= */
.cta{
  position:relative;isolation:isolate;overflow:hidden;
  padding:clamp(88px,12vw,168px) 0;
  color:#fff;text-align:center;
  background:
    radial-gradient(90% 70% at 50% 0%,rgba(34,184,240,.25),transparent 62%),
    linear-gradient(180deg,#0A1F3A 0%,#050D16 100%);
}
/* vazduh iz klime — retke tačkaste krivine, polako se pomeraju */
.cta::before{
  content:"";position:absolute;inset:-4% 0;z-index:-1;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 760' fill='none' stroke='rgb(127,230,255)' stroke-linecap='round'%3E%3Cg stroke-width='1.6'%3E%3Cpath opacity='.2' d='M600 -10C540 110 690 190 610 320S520 560 585 770'/%3E%3Cpath opacity='.14' d='M560 -10C470 120 640 230 520 360S430 590 500 770'/%3E%3Cpath opacity='.14' d='M640 -10C730 110 560 240 690 370S790 600 700 770'/%3E%3Cpath opacity='.09' d='M500 -10C380 130 560 260 430 390S330 610 400 770'/%3E%3Cpath opacity='.09' d='M700 -10C820 130 640 260 780 390S880 610 800 770'/%3E%3Cpath opacity='.06' d='M420 -10C280 140 480 280 340 410S250 620 320 770'/%3E%3Cpath opacity='.06' d='M780 -10C920 140 720 280 860 410S950 620 880 770'/%3E%3C/g%3E%3Cg stroke-width='3.4' stroke-dasharray='.1 24'%3E%3Cpath opacity='.5' d='M580 -10C500 120 660 220 560 350S470 580 540 770'/%3E%3Cpath opacity='.4' d='M620 -10C710 120 540 250 660 380S760 600 680 770'/%3E%3Cpath opacity='.3' d='M470 -10C350 140 540 270 400 400S300 610 370 770'/%3E%3Cpath opacity='.3' d='M730 -10C860 140 660 270 800 400S900 610 830 770'/%3E%3C/g%3E%3C/svg%3E") 50% 0/min(1200px,170%) auto no-repeat;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 38%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 0%,#000 38%,transparent 100%);
  animation:cta-drift 18s ease-in-out infinite alternate;
}
/* fina mreža tačaka, kao u tamnoj sekciji */
.cta::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(rgba(127,230,255,.07) 1px,transparent 1.2px) 0 0/22px 22px;
  -webkit-mask-image:radial-gradient(70% 60% at 50% 0%,#000,transparent 100%);
  mask-image:radial-gradient(70% 60% at 50% 0%,#000,transparent 100%);
}
@keyframes cta-drift{from{transform:translate3d(0,-1.6%,0)}to{transform:translate3d(0,1.6%,0)}}

.cta-in{position:relative;display:flex;flex-direction:column;align-items:center}
.cta .eyebrow{color:var(--lcd-on);margin-bottom:20px}
.cta h2{
  max-width:18ch;margin:0 auto;color:#fff;
  font-size:clamp(28px,7vw,62px);text-wrap:balance;
}
.cta h2 span{
  background:linear-gradient(90deg,var(--cyan),var(--ice));
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
}

/* broj telefona = veliki sjajni LCD */
.cta-phone{
  position:relative;display:inline-flex;flex-direction:column;align-items:center;max-width:100%;
  margin:clamp(30px,4.4vw,46px) 0 0;
  padding:clamp(30px,3.6vw,38px) clamp(16px,4vw,34px) clamp(14px,2.2vw,22px);
  border-radius:22px;text-decoration:none;color:var(--lcd-on);
  background:linear-gradient(180deg,#0B1B2A,#050D16);
  box-shadow:
    inset 0 0 0 1px rgba(127,230,255,.18),
    inset 0 2px 16px rgba(0,0,0,.75),
    inset 0 1px 0 rgba(255,255,255,.08),
    0 0 0 1px rgba(2,8,14,.9),
    0 34px 70px -30px rgba(34,184,240,.6),
    0 0 70px -22px rgba(34,184,240,.45);
  transition:box-shadow .4s ease,transform .3s cubic-bezier(.2,.8,.2,1);
  -webkit-tap-highlight-color:transparent;
}
/* oznaka na okviru uređaja */
.cta-phone::before{
  content:"Tel.";position:absolute;top:12px;left:clamp(16px,4vw,34px);
  padding-left:15px;
  font:600 10px/1 var(--f-mono);letter-spacing:.22em;text-transform:uppercase;color:rgba(127,230,255,.55);
  background:radial-gradient(circle,var(--lcd-on) 0 2.2px,transparent 2.8px) 0 50%/7px 7px no-repeat;
}
/* odsjaj stakla */
.cta-phone::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(112deg,rgba(255,255,255,.07) 0 36%,transparent 36.3%);
}
.cta-phone:hover,.cta-phone:focus-visible{
  transform:translateY(-3px);
  box-shadow:
    inset 0 0 0 1px rgba(127,230,255,.42),
    inset 0 2px 16px rgba(0,0,0,.75),
    inset 0 1px 0 rgba(255,255,255,.1),
    0 0 0 1px rgba(2,8,14,.9),
    0 44px 90px -30px rgba(34,184,240,.85),
    0 0 110px -14px rgba(34,184,240,.65);
}
.cta-phone:focus-visible{outline:3px solid var(--cyan);outline-offset:5px;border-radius:22px}
.cta-phone:active{transform:translateY(0) scale(.985)}

.cta-phone-lcd{
  font-size:clamp(30px,10.8vw,104px);color:var(--lcd-on);
  --seg-off:rgba(127,230,255,.07);
  letter-spacing:.01em;text-shadow:var(--lcd-glow);
}
.cta-phone-lcd .seg7-on{transition:opacity .22s ease,filter .35s ease}
.cta-phone-lcd.is-off .seg7-on{opacity:0}
.cta-phone-lcd.is-test .seg7-on{filter:drop-shadow(0 0 .06em currentColor) drop-shadow(0 0 .3em rgba(127,230,255,.8))}
.cta-phone:hover .seg7-on,.cta-phone:focus-visible .seg7-on{
  filter:drop-shadow(0 0 .06em currentColor) drop-shadow(0 0 .28em rgba(127,230,255,.75)) drop-shadow(0 0 .7em rgba(34,184,240,.45));
}
.cta-phone-hint{
  margin-top:14px;font:500 11px/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:rgba(127,230,255,.6);
}

.cta-actions{
  display:flex;flex-direction:column;gap:12px;width:100%;max-width:420px;margin-top:30px;
}
@media (min-width:600px){
  .cta-actions{flex-direction:row;flex-wrap:wrap;justify-content:center;width:auto;max-width:none}
}
.cta-note{
  max-width:36ch;margin:26px 0 0;
  font:500 11px/1.7 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:rgba(228,238,247,.55);
}
@media (min-width:900px){.cta-note{max-width:none}}

/* =========================================================
   4. FUTER = SPOLJNA JEDINICA
   ========================================================= */
.ftr{
  position:relative;
  padding:clamp(56px,8vw,96px) 0 32px;
  background:linear-gradient(180deg,#EEF2F5,#E2E8EE);
}

/* telo spoljne jedinice — beli emajl */
.odu{
  position:relative;isolation:isolate;
  max-width:720px;margin-inline:auto;
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:center;
  gap:clamp(12px,3vw,28px);
  padding:clamp(14px,3vw,24px);border-radius:18px;
  background:
    radial-gradient(circle,#9AA7B4 0 1.5px,#F4F7F9 1.9px 3.2px,rgba(10,26,47,.2) 3.6px,transparent 4.6px) 7px 7px/10px 10px no-repeat,
    radial-gradient(circle,#9AA7B4 0 1.5px,#F4F7F9 1.9px 3.2px,rgba(10,26,47,.2) 3.6px,transparent 4.6px) calc(100% - 7px) 7px/10px 10px no-repeat,
    radial-gradient(circle,#9AA7B4 0 1.5px,#F4F7F9 1.9px 3.2px,rgba(10,26,47,.2) 3.6px,transparent 4.6px) 7px calc(100% - 7px)/10px 10px no-repeat,
    radial-gradient(circle,#9AA7B4 0 1.5px,#F4F7F9 1.9px 3.2px,rgba(10,26,47,.2) 3.6px,transparent 4.6px) calc(100% - 7px) calc(100% - 7px)/10px 10px no-repeat,
    linear-gradient(180deg,#FBFCFD,#E1E7EC);
  box-shadow:
    inset 0 1px 0 #fff,
    inset 0 0 0 1px rgba(255,255,255,.55),
    inset 0 -3px 0 rgba(10,26,47,.07),
    0 0 0 1px #C8D2DB,
    0 36px 46px -28px rgba(10,26,47,.5),
    0 12px 22px -12px rgba(10,26,47,.22);
}
/* dve crne nožice ispod kućišta */
.odu::before,.odu::after{
  content:"";position:absolute;bottom:-10px;z-index:-1;
  width:clamp(44px,13%,96px);height:10px;
  background:linear-gradient(180deg,#3B4756,#1C242E);border-radius:0 0 5px 5px;
}
.odu::before{left:9%}
.odu::after{right:9%}

/* kružni otvor ventilatora sa zaštitnom rešetkom */
.odu-grille{
  position:relative;aspect-ratio:1/1;border-radius:50%;
  background:radial-gradient(circle at 50% 50%,#070C12 0,#0D1620 45%,#192533 100%);
  box-shadow:
    0 0 0 clamp(3px,.9vw,6px) #F6F8FA,
    0 0 0 clamp(4px,1.1vw,7px) rgba(10,26,47,.17),
    0 clamp(5px,1.2vw,8px) clamp(8px,2vw,14px) clamp(5px,1.1vw,7px) rgba(10,26,47,.1),
    inset 0 8px 18px rgba(0,0,0,.7),
    inset 0 0 0 2px rgba(255,255,255,.05);
}
/* tri lopatice, polako se vrte */
.odu-fan{
  position:absolute;inset:7%;z-index:1;border-radius:50%;
  background:
    radial-gradient(circle,rgba(4,8,14,.55) 0,rgba(4,8,14,.25) 28%,transparent 62%),
    conic-gradient(from 0deg,
      #E7EDF2 0deg,#A5B4C3 36deg,rgba(14,22,32,0) 66deg 120deg,
      #E7EDF2 120deg,#A5B4C3 156deg,rgba(14,22,32,0) 186deg 240deg,
      #E7EDF2 240deg,#A5B4C3 276deg,rgba(14,22,32,0) 306deg 360deg);
  -webkit-mask-image:radial-gradient(circle,transparent 0 14%,#000 19%,#000 93%,transparent 97%);
  mask-image:radial-gradient(circle,transparent 0 14%,#000 19%,#000 93%,transparent 97%);
  animation:odu-spin 2.6s linear infinite;
  will-change:transform;
}
.odu-fan.is-wa{animation:none}
@keyframes odu-spin{to{transform:rotate(360deg)}}
/* glavčina ventilatora + tamna senka iz dubine */
.odu-grille::before{
  content:"";position:absolute;inset:0;z-index:2;border-radius:50%;pointer-events:none;
  background:
    radial-gradient(circle at 50% 50%,#F8FAFB 0,#CFD8E0 6%,#8D9BAA 12%,#2A3643 12.6%,transparent 14%),
    radial-gradient(circle at 50% 50%,transparent 58%,rgba(0,0,0,.55) 100%);
}
/* žičana rešetka: koncentrični prstenovi + nosači */
.odu-grille::after{
  content:"";position:absolute;inset:0;z-index:3;border-radius:50%;pointer-events:none;
  background:
    repeating-conic-gradient(from -.55deg,rgba(226,233,240,.8) 0 1.1deg,transparent 1.1deg 30deg),
    repeating-radial-gradient(circle closest-side at 50% 50%,transparent 0 10%,rgba(226,233,240,.82) 10% 11.5%);
  box-shadow:inset 0 0 0 2px rgba(226,233,240,.85),inset 0 0 0 4px rgba(10,20,30,.45);
}

/* bočna maska sa žaluzinama i nalepnicom */
.odu-side{
  position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;
  min-width:0;padding:clamp(8px,2vw,16px);border-radius:12px;
  background:linear-gradient(180deg,#F2F5F8,#E3E9EE);
  box-shadow:inset 0 0 0 1px rgba(10,26,47,.07),inset 0 1px 0 #fff;
}
.odu-side::before{
  content:"";position:absolute;inset:10px 8px;pointer-events:none;
  background:linear-gradient(180deg,transparent 0 6px,rgba(10,26,47,.13) 6px 7.5px,rgba(255,255,255,.95) 7.5px 9.5px,transparent 9.5px) 0 0/100% 14px;
  -webkit-mask-image:linear-gradient(180deg,#000 0,#000 60%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 0,#000 60%,transparent 100%);
}
.odu-side > *{position:relative}

.sticker{
  display:flex;flex-direction:column;align-items:center;gap:6px;max-width:100%;
  padding:12px 14px;border-radius:12px;
  background:linear-gradient(225deg,transparent 0 17px,#FFFFFF 17px,#F1F4F7 100%);
  filter:drop-shadow(0 7px 8px rgba(10,26,47,.22)) drop-shadow(0 1px 1px rgba(10,26,47,.18));
  transform:rotate(-3deg);transform-origin:50% 60%;
  transition:transform .5s cubic-bezier(.2,.8,.2,1);
}
.sticker::after{
  content:"";position:absolute;right:0;top:0;width:24px;height:24px;pointer-events:none;
  background:linear-gradient(45deg,#FFFFFF 0,#D3DBE3 100%);
  clip-path:polygon(0 0,0 100%,100% 100%);
}
.odu:hover .sticker{transform:rotate(-1.5deg) translateY(-2px)}
.sticker img{
  display:block;width:clamp(66px,21vw,88px);height:auto;aspect-ratio:1/1;object-fit:contain;
  margin:-6px -6px -2px;
}
.sticker-phone{
  display:block;text-align:center;text-decoration:none;white-space:nowrap;
  font:700 clamp(11px,3.3vw,13.5px)/1.2 var(--f-mono);letter-spacing:-.02em;color:var(--navy);
}
.sticker-phone:hover{color:var(--blue)}
.sticker-cap{
  max-width:26ch;margin:0;text-align:center;
  font-size:clamp(11.5px,3.2vw,13px);line-height:1.4;color:var(--muted);
  padding:4px 6px;border-radius:7px;background:rgba(242,245,248,.94);
}
@media (min-width:768px){
  .sticker img{width:124px}
  .sticker-phone{font-size:16px;letter-spacing:-.01em}
  .ftr-cols .ftr-hours{padding-top:9px}
  .sticker-cap{font-size:13px}
}

.ftr-cols{margin-top:44px;display:grid;gap:24px}
@media (min-width:768px){.ftr-cols{grid-template-columns:1.3fr 1fr .8fr;gap:40px}}
.ftr-name{margin:0 0 10px;font:700 20px/1.1 var(--f-display);letter-spacing:-.03em;color:var(--navy)}
.ftr-name b{color:var(--blue);font-weight:700}
.ftr-cols p{margin:0;max-width:36ch;font-size:15.5px;line-height:1.55;color:var(--muted)}
.ftr-cols .ftr-name{max-width:none;font-size:20px;color:var(--navy)}
.ftr-links{list-style:none;display:grid;gap:6px}
.ftr-links a{
  display:inline-flex;align-items:center;gap:10px;min-height:40px;
  font-weight:500;color:var(--ink-2);text-decoration:none;overflow-wrap:anywhere;
  transition:color .2s ease;
}
.ftr-links a svg{width:18px;height:18px;flex:none;color:var(--blue-deep)}
.ftr-links a:hover{color:var(--blue)}
.ftr-cols .ftr-hours{margin:0;font:500 12px/1.9 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}

.ftr-meta{
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 20px;
  margin:32px 0 0;padding-top:18px;border-top:1px solid var(--line-strong);
  font:500 10.5px/1.6 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);
}

/* =========================================================
   Smanjeno kretanje
   ========================================================= */
@media (prefers-reduced-motion:reduce){
  .gal.is-armed .gal-item{opacity:1!important;transform:none!important}
  .cta::before{animation:none!important}
  .odu-fan{animation:none!important}
  .lb-fig{transform:none!important}
}

/* opis nalepnice stoji ispod jedinice (index.html: .odu-cap) */
.odu-cap{max-width:46ch;margin:22px auto 0;padding:0;background:none;font-size:13.5px}