/* Vinarija 4 praseta - naslovna (veb dizajn). Tokeni 1:1 iz brand book-a (/brand/). */
:root{
  --bg:#EFE5D3;--bg2:#E2D4BC;--card:#F7F0E3;--ink:#221714;--ink2:#56443B;
  --acc:#6D1D2A;--acc-h:#8A2B3C;--acc2:#53141F;--leaf:#4F5B3C;--leaf-h:#627050;--on:#F6EFE2;--line:rgba(34,23,20,.14);
  --fd:"Marcellus",Georgia,serif;--ft:"Figtree",system-ui,sans-serif;
  --ease:cubic-bezier(.2,.8,.2,1);
  --hdr:88px;--ram:28px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:clip;font-synthesis:none;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--ft);font-size:17px;line-height:1.66;overflow-x:clip;font-variant-numeric:lining-nums}
img,svg,video{max-width:100%;display:block}
a{color:var(--acc)}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--acc);color:var(--on)}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
h1,h2,h3{font-weight:400}
.nad{font-size:.74rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--acc);margin-bottom:18px}
.nad--svetlo{color:#E9C9B4}
.h2{font-family:var(--fd);font-size:clamp(2.1rem,3.5vw,3.15rem);line-height:1.1;letter-spacing:-.005em;color:var(--ink);margin-bottom:26px}
.deli .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.deli .w>span{display:inline-block}
.ph-napomena{display:inline-block;font-size:.74rem;font-weight:600;letter-spacing:.02em;background:#F4D58D;color:#4A3200;border-radius:3px;padding:3px 8px;line-height:1.45}
.privremeno{position:absolute;z-index:4;right:12px;top:12px;font:600 .58rem/1 var(--ft);letter-spacing:.12em;text-transform:uppercase;color:#fff;background:rgba(34,23,20,.5);padding:6px 9px;border-radius:999px;pointer-events:none}
.dugmad{display:flex;flex-wrap:wrap;align-items:center;gap:12px}

/* logo kao maska -> boja iz currentColor */
.lg{display:block;background:currentColor;-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.lg-n{--m:url(img/logo-4etiri.svg);aspect-ratio:164.26/80.03;position:relative}
.lg-n::after{content:"";position:absolute;inset:0;background:#ed1c24;-webkit-mask:url(img/logo-4etiri-4.svg) center/contain no-repeat;mask:url(img/logo-4etiri-4.svg) center/contain no-repeat}
.lg-p{--m:url(img/prasici.svg);aspect-ratio:704/276}

/* diskretne pozadinske siluete (PA Studio SVG, ociscene u jednobojnu masku) */
.sil{position:absolute;pointer-events:none;z-index:0;background:var(--c,var(--leaf));opacity:var(--o,.13);-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.sil-loza{--m:url(media/bg-loza.webp);aspect-ratio:1559/356;width:min(900px,70vw);right:-6vw;top:clamp(40px,5vw,80px)}
/* sekcija 2: loza raste vertikalno iz gornjeg desnog ugla, oslonjena na ivicu (ne lebdi) */
/* loza ulazi odozgo: počinje iznad sekcije (preko papira hero-a) i vrh se rastapa u papir - otvoren presek stabla se nikad ne vidi */
.sil-loza--ugao{width:auto;height:min(calc(100% + 30vh),1450px);aspect-ratio:356/1559;top:-30vh;right:-1.5%;--o:.16;--m:url(media/bg-loza-v.webp);
  -webkit-mask:var(--m) right top/contain no-repeat,linear-gradient(transparent 0,transparent 8%,#000 30%);-webkit-mask-composite:source-in;
  mask:var(--m) right top/contain no-repeat,linear-gradient(transparent 0,transparent 8%,#000 30%);mask-composite:intersect}
.sil-loza--dole{top:auto;bottom:24px;right:auto;left:-8vw;transform:scaleX(-1);--o:.07}
.sil-grozd{--m:url(media/bg-grozd.webp);aspect-ratio:698/906;width:min(380px,32vw);right:2vw;bottom:-40px;--c:var(--acc);--o:.06}
.sil-flase{--m:url(media/bg-flase.webp);aspect-ratio:1287/666;width:min(900px,80vw);right:-8vw;top:20px;--c:var(--on);--o:.07}
.sil-vinarija{--m:url(media/bg-vinarija.webp);aspect-ratio:1594/810;width:min(1100px,90vw);left:50%;bottom:0;transform:translateX(-50%);--o:.05;--c:var(--ink2)}

/* ===== DUGMAD - Pecat (1:1 brand book 05) ===== */
.b{position:relative;isolation:isolate;overflow:hidden;flex:none;display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:56px;padding:8px 8px 8px 26px;border-radius:999px;border:0;cursor:pointer;font-family:var(--ft);font-weight:500;font-size:.95rem;letter-spacing:.01em;text-decoration:none;line-height:1.3;white-space:nowrap;transition:transform .35s var(--ease),background-color .35s,color .35s,border-color .35s}
.b .bc{flex:none;width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;transition:transform .5s var(--ease),background-color .35s,color .35s}
.b .bc svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.b-pri{background:var(--acc);color:var(--on)}
.b-pri .bc{background:var(--on);color:var(--acc)}
.b-pri::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--acc-h);border-radius:999px;transform:scale(0);transform-origin:calc(100% - 28px) center;transition:transform .55s cubic-bezier(.7,0,.2,1)}
.b-pri:hover::before{transform:scale(1.02)}
.b:hover .bc{transform:rotate(-45deg)}
.b-sec{background:transparent;color:var(--acc);border:1.5px solid var(--acc)}
.b-sec .bc{background:var(--acc);color:var(--on)}
.b-sec:hover{background:var(--acc);color:var(--on)}
.b-sec:hover .bc{background:var(--on);color:var(--acc)}
.b-txt{background:none;padding:6px 0;min-height:0;color:var(--acc);border-radius:0;overflow:visible;gap:10px}
.b-txt .bc{width:30px;height:30px;border:1px solid currentColor}
.b-txt::after{content:"";position:absolute;left:0;right:40px;bottom:4px;height:1px;background:currentColor;transform:scaleX(.3);transform-origin:left;transition:transform .5s cubic-bezier(.7,0,.2,1)}
.b-txt:hover::after{transform:scaleX(1)}
.b-txt:hover .bc{background:var(--acc);color:var(--on);border-color:var(--acc)}
.b-ico{width:56px;height:56px;min-height:0;padding:0;border-radius:50%;color:var(--acc);border:1.5px solid var(--acc);background:transparent}
.b-ico svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .45s var(--ease)}
.b-ico:hover{background:var(--acc);color:var(--on)}
.b-ico:hover svg{transform:scale(1.1) rotate(-8deg)}
.b-ico .cnt{position:absolute;top:8px;right:8px;width:18px;height:18px;border-radius:50%;background:var(--leaf);color:var(--on);font-size:.66rem;font-weight:600;font-style:normal;line-height:1;display:grid;place-content:center;font-variant-numeric:tabular-nums;transition:transform .35s var(--ease)}
.b-ico .cnt[data-count="0"],.b-ico .cnt:empty{display:none}
.b-ico .cnt.dvo{font-size:.58rem}
.b-ico .cnt.bump{transform:scale(1.35)}
.b:active{transform:scale(.965)}
.b-inv{background:var(--on);color:var(--acc)}
.b-inv::before{background:#fff}
.b-inv .bc{background:var(--acc);color:var(--on)}
.na-tamnom .b-txt,.vina .b-txt,.mmeni .b-txt{color:var(--on)}
.na-tamnom .b-txt:hover .bc,.vina .b-txt:hover .bc,.mmeni .b-txt:hover .bc{background:var(--on);color:var(--acc);border-color:var(--on)}

/* ===== bocni meni prezentacije (sablon) ===== */
.sw{position:fixed;top:50%;right:0;transform:translateY(-50%);z-index:120;overflow:hidden}
.sw-inner{display:flex;align-items:stretch;transform:translateX(calc(100% - 30px));transition:transform .35s cubic-bezier(.4,0,.2,1)}
.sw:hover .sw-inner,.sw:focus-within .sw-inner{transform:translateX(0)}
.sw-tab{width:30px;flex:none;background:#2A1A18;color:#EFE5D3;display:flex;align-items:center;justify-content:center;border-radius:10px 0 0 10px;writing-mode:vertical-rl;font-size:.6rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;padding:14px 0;gap:8px}
.sw-tab svg{width:13px;height:13px;stroke:#D9B9A0;fill:none;stroke-width:2.4;transform:rotate(180deg);transition:transform .3s}
.sw:hover .sw-tab svg{transform:rotate(0)}
.sw-panel{background:#2A1A18;display:flex;flex-direction:column;gap:6px;padding:8px;box-shadow:-10px 0 28px rgba(0,0,0,.3)}
.sw-panel a{display:block;width:84px;text-align:center;font-size:.6rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#D8CCBC;padding:10px 6px;border-radius:8px;line-height:1.35;text-decoration:none;transition:.2s}
.sw-panel a small{display:block;font-size:.8rem;letter-spacing:0;margin-top:2px;text-transform:none;font-weight:400}
.sw-panel a.on{background:#EFE5D3;color:#6D1D2A}
.sw-panel a:not(.on):hover{background:rgba(255,255,255,.1);color:#fff}
.sw a[hidden]{display:none!important}
.menu-otv .sw{display:none}
.sw-panel a.fb{color:#E9C9B4;border-top:1px solid rgba(255,255,255,.16);padding-top:12px;margin-top:2px}
.sw-panel a.fb svg{display:block;width:16px;height:16px;margin:0 auto 5px;fill:none;stroke:#E9C9B4;stroke-width:2;stroke-linejoin:round}
@media(max-width:680px){
  .sw{top:auto;bottom:150px;right:12px;transform:none;overflow:visible}
  .sw .sw-inner,.sw:hover .sw-inner{transform:none}
  .sw-tab,.sw-panel a:not(.fb){display:none}
  .sw-panel{background:none;box-shadow:none;padding:0}
  .sw-panel a.fb{width:auto;display:flex;align-items:center;gap:7px;margin:0;padding:9px 14px;border:1px solid #E9C9B4;border-radius:30px;background:#2A1A18;color:#fff;box-shadow:0 6px 18px rgba(0,0,0,.28)}
  .sw-panel a.fb svg{margin:0;width:14px;height:14px}
  .sw-panel a.fb small{display:none}
}

/* ===== HEADER ===== */
.hdr{position:fixed;inset:0 0 auto;z-index:60;height:var(--hdr);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;padding:0 var(--ram);color:var(--ink);transition:height .5s var(--ease),color .5s}
.hdr::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(239,229,211,.86);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);opacity:0;transition:opacity .5s,background-color .5s}
.hdr.skrol{height:74px}
.hdr.skrol::before{opacity:1}
.hdr.nebo::before{background:rgba(249,248,244,.9);border-bottom-color:transparent} /* preko ilustracije u hero-u: boja neba crteža */
.hdr.tamno{color:var(--on)}
.hdr.tamno::before{background:rgba(109,29,42,.92);border-color:rgba(246,239,226,.12)}
.hdr-logo{justify-self:start;display:block;color:var(--ink);transition:transform 1.25s cubic-bezier(.7,0,.2,1),color .6s,filter .6s}
.hdr-logo .lg-n{width:132px;transition:width .5s var(--ease)}
.hdr.skrol .hdr-logo .lg-n{width:108px}
.hdr--uvod .hdr-logo{transform:translate(calc(50vw - var(--ram) - 50%),22px) scale(1.6)}
.hdr[data-ton="svetlo"] .hdr-logo{color:var(--on);filter:drop-shadow(0 2px 16px rgba(20,10,8,.45))}
.hdr.tamno .hdr-logo{color:var(--on)}
.hdr-nav{display:flex;gap:clamp(18px,2.4vw,40px)}
.hdr-nav a{position:relative;font:600 .74rem/1 var(--ft);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;color:inherit;padding:12px 0}
.hdr-nav a::after{content:"";position:absolute;left:0;right:0;bottom:4px;height:1.5px;background:var(--acc);transform:scaleX(0);transform-origin:right;transition:transform .45s cubic-bezier(.7,0,.2,1)}
.hdr.tamno .hdr-nav a::after{background:var(--on)}
.hdr-nav a:hover::after,.hdr-nav a.akt::after{transform:scaleX(1);transform-origin:left}
/* jezik SR / EN: na kraju menija, tanka crta ispred, aktivni bordo + podvučen */
.jez{display:flex;align-items:center;gap:7px;font:600 .74rem/1 var(--ft);letter-spacing:.16em;text-transform:uppercase}
.hdr-nav .jez{padding-left:clamp(14px,1.6vw,24px);border-left:1px solid currentColor;border-left-color:color-mix(in srgb,currentColor 28%,transparent);margin-left:calc(-1 * clamp(4px,.8vw,16px))}
.jez i{font-style:normal;opacity:.35}
.jez a{opacity:.55;transition:opacity .3s,color .3s}
.jez a:hover,.jez a[aria-current]{opacity:1}
.hdr-nav .jez a[aria-current]{color:var(--acc)}
.hdr-nav .jez a[aria-current]::after{transform:scaleX(1)}
.hdr.tamno .hdr-nav .jez a[aria-current],.hdr[data-ton="svetlo"] .hdr-nav .jez a[aria-current]{color:inherit}
.hdr-akc{justify-self:end;display:flex;align-items:center;gap:12px}
.hdr--uvod .hdr-nav,.hdr--uvod .hdr-akc{visibility:hidden}
.hdr.tamno .hdr-tel{background:var(--on);color:var(--acc)}
.hdr.tamno .hdr-tel::before{background:#fff}
.hdr.tamno .hdr-tel .bc{background:var(--acc);color:var(--on)}
.hdr.tamno .kor-dugme{color:var(--on);border-color:rgba(246,239,226,.7)}
.hdr.tamno .kor-dugme:hover{background:var(--on);color:var(--acc)}
.hdr-burger{display:none;position:relative;width:52px;height:52px;border-radius:50%;border:1.5px solid currentColor;color:inherit}
.hdr-burger i{position:absolute;left:15px;right:15px;height:1.5px;background:currentColor;transition:transform .55s cubic-bezier(.7,0,.2,1),top .35s}
.hdr-burger i:first-child{top:21px}.hdr-burger i:last-child{top:29px}
.menu-otv .hdr-burger i:first-child{top:25px;transform:rotate(45deg)}
.menu-otv .hdr-burger i:last-child{top:25px;transform:rotate(-45deg)}
.menu-otv .hdr{color:var(--on)}
.menu-otv .hdr::before{opacity:0}
.menu-otv .hdr-logo{color:var(--on)}
.menu-otv .kor-dugme{color:var(--on);border-color:rgba(246,239,226,.6)}

/* mini korpa (hover, samo desktop) */
.kor{position:relative}
.minik{position:absolute;right:0;top:calc(100% + 14px);width:350px;background:var(--card);color:var(--ink);border-radius:6px;padding:22px;box-shadow:0 24px 48px -12px rgba(34,23,20,.3);
  opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .25s .2s,transform .4s .2s var(--ease),visibility 0s .6s}
.minik::before{content:"";position:absolute;left:0;right:0;top:-18px;height:18px}
.minik::after{content:"";position:absolute;right:21px;top:-6px;width:13px;height:13px;background:var(--card);transform:rotate(45deg)}
@media (hover:hover) and (min-width:1001px){.kor:hover .minik,.kor:focus-within .minik{opacity:1;visibility:visible;transform:none;transition-delay:0s}}
.minik-prazno{font-size:.9rem;color:var(--ink2)}
.minik.puna .minik-prazno{display:none}
.minik-lista{list-style:none;display:flex;flex-direction:column;gap:12px;margin-bottom:14px}
.minik-lista li{display:grid;grid-template-columns:34px 1fr auto;gap:12px;align-items:center;font-size:.9rem}
.minik-lista img{height:58px;width:auto;margin:auto}
.minik-lista b{font-family:var(--fd);font-weight:400;font-size:1.05rem;display:block;line-height:1.2}
.minik-lista span{font-size:.8rem;color:var(--ink2)}
.minik-dno,.minik-btn{display:none}
.minik.puna .minik-dno{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:12px;margin-bottom:14px}
.minik-dno b{font-family:var(--fd);font-weight:400;font-size:1.15rem}
.minik.puna .minik-btn{display:inline-flex;width:100%;justify-content:space-between}

/* ===== MOBILNI MENI ===== */
.mmeni{position:fixed;inset:0;z-index:55;visibility:hidden;color:var(--on);overflow:hidden}
.mmeni::before{content:"";position:absolute;left:var(--mx,90%);top:var(--my,44px);width:var(--mz,0px);height:var(--mz,0px);transform:translate(-50%,-50%);background:var(--acc2);
  -webkit-mask:url(media/b-mrlja-2.png) center/contain no-repeat;mask:url(media/b-mrlja-2.png) center/contain no-repeat}
.mmeni.pun::before{-webkit-mask:none;mask:none;width:400vmax;height:400vmax}
.mmeni-prasici{position:absolute;right:-12%;bottom:12%;width:110%;color:var(--on);opacity:0}
.mmeni-in{position:relative;height:100%;display:flex;flex-direction:column;justify-content:space-between;padding:calc(var(--hdr) + 3vh) var(--ram) 28px;overflow-y:auto}
.mmeni-nav{display:flex;flex-direction:column}
.mmeni-nav a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid rgba(246,239,226,.14);color:var(--on);text-decoration:none;font:400 clamp(2.1rem,8.6vw,3.2rem)/1.15 var(--fd)}
.mmeni-nav a span{display:inline-block;transition:transform .5s var(--ease),color .3s}
.mmeni-nav a img{width:58px;height:58px;border-radius:4px;object-fit:cover;opacity:.0;transform:scale(.6) rotate(-10deg);transition:opacity .4s,transform .5s var(--ease)}
.mmeni-nav a:hover span,.mmeni-nav a:focus-visible span{transform:translateX(12px);color:#F1D2BF}
.mmeni-nav a:hover img,.mmeni-nav a:focus-visible img{opacity:1;transform:none}
.mmeni-dno{display:flex;flex-direction:column;gap:20px;padding-top:28px}
.mmeni-cta{display:flex;flex-wrap:wrap;align-items:center;gap:18px}
.mmeni-kontakt{display:flex;flex-direction:column;gap:4px;font-size:.92rem;color:rgba(246,239,226,.78)}
.mmeni-kontakt a{color:var(--on);text-decoration:none}
.mmeni-jez{font-size:.8rem;gap:10px;color:rgba(246,239,226,.6)}
.mmeni-jez a{color:var(--on);text-decoration:none;padding:10px 2px;position:relative}
.mmeni-jez a[aria-current]::after{content:"";position:absolute;left:2px;right:2px;bottom:5px;height:1.5px;background:#F1D2BF}
.mmeni-jez a[aria-current]{color:#F1D2BF}

/* ===== zajednicko: crtez -> fotografija ===== */
.razvij{position:relative;overflow:hidden;border-radius:4px;aspect-ratio:16/10;background:var(--bg2)}
.razvij img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.razvij-ilu{transform:scale(1.02)}
.razvij-foto{-webkit-mask-image:url(media/b-mrlja-1.png),url(media/b-mrlja-3.png),url(media/b-mrlja-2.png);mask-image:url(media/b-mrlja-1.png),url(media/b-mrlja-3.png),url(media/b-mrlja-2.png);
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:28% 38%,78% 70%,55% 45%;mask-position:28% 38%,78% 70%,55% 45%;
  -webkit-mask-size:var(--r1,0%),var(--r2,0%),var(--r3,0%);mask-size:var(--r1,0%),var(--r2,0%),var(--r3,0%)}
.razvij.pun .razvij-foto{-webkit-mask:none;mask:none}
.razvij-oznaka{position:absolute;z-index:3;left:14px;bottom:14px;display:flex;gap:2px;padding:3px;border-radius:999px;background:rgba(247,240,227,.9);font-size:.66rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.razvij-oznaka span{padding:6px 11px;border-radius:999px;color:var(--ink2);transition:background .4s,color .4s}
.razvij-oznaka span:first-child,.razvij.vise .razvij-oznaka span:last-child{background:var(--acc);color:var(--on)}
.razvij.vise .razvij-oznaka span:first-child{background:none;color:var(--ink2)}
.razvij-oznaka{display:none!important} /* Ivan 14.10: prekidač crtež/fotografija se ne prikazuje (logika ostaje) */

/* ===== 2. NASA PRICA ===== */
.prica{position:relative;z-index:12;margin-top:-35vh;margin-top:-35svh;background:var(--bg);padding:clamp(90px,10vw,150px) var(--ram) clamp(80px,9vw,140px);overflow-x:clip}
.ivica{position:absolute;left:0;right:0;top:-22px;height:24px;width:100%;fill:var(--bg)}
.prica-in{position:relative;z-index:1;max-width:1320px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(40px,6vw,110px);align-items:center}
.prica-vizual{position:relative;padding-bottom:clamp(70px,8vw,120px)}
.prica-velika{width:86%;aspect-ratio:4/3.2;border-radius:4px;overflow:hidden}
.prica-velika img{width:100%;height:100%;object-fit:cover}
/* desna fotografija u providnom staklenom okviru (liquid glass) */
.prica-mala{position:absolute;right:0;bottom:0;width:40%;aspect-ratio:4/5;padding:10px;border-radius:16px;
  background:linear-gradient(140deg,rgba(255,255,255,.4),rgba(255,255,255,.08));-webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4);
  border:1px solid rgba(255,255,255,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 30px 60px -30px rgba(34,23,20,.55)}
.prica-mala>div{width:100%;height:100%;border-radius:9px;overflow:hidden}
.prica-mala img{width:100%;height:118%;object-fit:cover;margin-top:-9%}
.film{position:absolute;z-index:5;left:calc(86% - 86px);top:-58px;width:172px;height:172px;border-radius:50%;display:grid;place-items:center;background:var(--bg);box-shadow:0 18px 40px -24px rgba(34,23,20,.5)}
.film-krug{position:absolute;inset:8px;width:calc(100% - 16px);height:calc(100% - 16px);animation:okret 22s linear infinite}
.film-krug text{font:600 11px var(--ft);letter-spacing:.14em;fill:var(--acc)}
.film-sred{position:relative;width:86px;height:86px;border-radius:50%;background:var(--acc);color:var(--on);display:grid;place-items:center;transition:transform .5s var(--ease),background-color .35s}
.film-sred::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:1px solid rgba(109,29,42,.35);animation:talas 2.8s cubic-bezier(.2,.6,.3,1) infinite}
.film-sred svg{width:26px;height:26px;fill:currentColor;margin-left:4px}
.film:hover .film-sred{transform:scale(1.1);background:var(--acc-h)}
@keyframes okret{to{transform:rotate(360deg)}}
@keyframes talas{0%{transform:scale(1);opacity:1}100%{transform:scale(1.45);opacity:0}}
.prica-tekst>p:not(.nad){color:var(--ink2);margin-bottom:16px;max-width:50ch}
.prica-tekst .prica-moto{font-family:var(--fd);font-size:clamp(1.3rem,1.9vw,1.6rem);line-height:1.3;color:var(--ink);border-left:1.5px solid var(--acc);padding-left:22px;margin:30px 0 34px}

/* ===== 3. STA VAS CEKA ===== */
.ceka{position:relative;overflow:hidden;background:var(--card);padding:clamp(90px,10vw,150px) var(--ram)}
.ceka-in{position:relative;z-index:1;max-width:1240px;margin:0 auto;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);grid-template-areas:"scena glava" "scena telo";grid-template-rows:auto 1fr;column-gap:clamp(40px,7vw,120px)}
.ceka-glava{grid-area:glava;align-self:end}
.ceka-pod{color:var(--ink2);max-width:46ch;margin:-8px 0 26px}
.ceka-tekst{grid-area:telo}
.ceka-scena{grid-area:scena;position:relative;align-self:center}
/* pun video 4:5, bez luka; diskretan beli okvir unutra */
.ceka-luk{position:relative;isolation:isolate;width:100%;aspect-ratio:4/5;border-radius:4px;overflow:hidden;background:var(--bg2);box-shadow:0 40px 70px -40px rgba(34,23,20,.55)}
.ceka-k{position:absolute;inset:0;overflow:hidden;clip-path:circle(0% at 50% 100%)}
.ceka-k.on{z-index:2}
.ceka-k>*{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ceka-k>*+*{opacity:0}
.ceka-luk .privremeno{top:auto;bottom:16px;right:50%;transform:translateX(50%)}
.ceka-luk::after{content:"";position:absolute;inset:12px;z-index:3;border-radius:2px;border:1px solid rgba(246,239,226,.6);pointer-events:none}
/* ilustracija na belom papiru sa oblačastom akvarel ivicom (kao okvir kuće u hero-u) - puna, bez providnosti */
/* Ivan 14.10: jedna nalepnica po kadru, gore levo, mera kao na odobrenom dizajnu (230px) */
.ceka-jelo{position:absolute;z-index:5;left:-56px;top:6%;width:min(230px,44%);opacity:0;transform:scale(.6) rotate(-12deg);pointer-events:none}
.ceka-jelo img,.dan-jelo{filter:drop-shadow(0 14px 18px rgba(34,23,20,.22))}
.ceka-jelo img{width:100%}
/* Ivan 15.10: bajadere (kadar furune) dole desno, preko daske - nikad preko praseta ni furune */
.ceka-jelo[data-za="1"]{left:auto;right:-32px;top:auto;bottom:-13%}
.ceka-str{display:none}
.ceka .h2{white-space:nowrap;font-size:clamp(2.1rem,3vw,3.15rem)}
.ceka-lista{list-style:none;margin-top:8px;border-bottom:1px solid var(--line)}
.ceka-lista li{border-top:1px solid var(--line);position:relative}
.ceka-lista li::before{content:"";position:absolute;left:0;top:-1px;height:1.5px;width:100%;background:var(--acc);transform:scaleX(0);transform-origin:left}
.ceka-lista li.on::before{animation:napred var(--trajanje,6s) linear forwards}
.ceka.pauza .ceka-lista li.on::before{animation-play-state:paused}
@keyframes napred{to{transform:scaleX(1)}}
@keyframes napredM{from{background-size:0% 100%,auto}}
.ceka-lista h3 button{display:block;width:100%;text-align:left;padding:18px 0 16px;font:400 clamp(1.55rem,2.5vw,2.25rem)/1.15 var(--fd);color:rgba(34,23,20,.3);transition:color .5s,transform .6s var(--ease)}
.ceka-lista li:hover h3 button{color:rgba(34,23,20,.6)}
.ceka-lista li.on h3 button{color:var(--ink);transform:translateX(14px)}
.ceka-op{display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s var(--ease)}
.ceka-op>p{overflow:hidden;color:var(--ink2);max-width:46ch;padding-left:14px;transition:opacity .5s;opacity:0}
.ceka-lista li.on .ceka-op{grid-template-rows:1fr}
.ceka-lista li.on .ceka-op>p{opacity:1;padding-bottom:20px}
.ceka-dno{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 28px;margin-top:34px}
.ceka-dno p{font-size:.95rem;color:var(--ink2);max-width:36ch}

/* ===== 4. DAN U VINARIJI ===== */
/* Ivan 14.10: dan -> popodne -> noć; na kraju pozadina = bordo sekcije Vina ispod (hp.js danTok, klasa .noc) */
.dan{position:relative;background:var(--dan-bg,#EFE5D3);color:var(--ink);overflow:hidden;transition:color .6s}
.dan .h2,.dan h3{color:inherit}
.dan.noc{color:var(--on)}
.dan.noc .dan-t p,.dan.noc .dan-kraj>p:not(.dan-cena){color:rgba(246,239,226,.82)}
.dan.noc .dan-cena b,.dan.noc .dan-kadar::before{color:var(--on)}
.dan.noc .dan-kadar::after,.dan.noc .dan-tok i::after{background:var(--on)}
.dan.noc .dan-sunce{background:transparent;box-shadow:inset -9px 2px 0 0 var(--on)}
.dan.noc .b-pri{background:var(--on);color:var(--acc)}
.dan.noc .b-pri::before{background:#fff}
.dan.noc .b-pri .bc{background:var(--acc);color:var(--on)}
.dan.noc .b-sec{color:var(--on);border-color:var(--on)}
.dan.noc .b-sec .bc{background:var(--on);color:var(--acc)}
.dan.noc .b-sec:hover{background:var(--on);color:var(--acc)}
.dan.noc .b-sec:hover .bc{background:var(--acc);color:var(--on)}
.dan-pin{position:relative;height:100vh;height:100svh;overflow:hidden}
.dan-nebo{position:absolute;left:8vw;right:8vw;top:calc(var(--hdr) + 3vh);height:12vh;pointer-events:none}
.dan-luk{width:100%;height:100%;overflow:visible}
.dan-luk path{stroke:currentColor;stroke-opacity:.22;stroke-width:1;stroke-dasharray:2 7;vector-effect:non-scaling-stroke}
.dan-sunce{position:absolute;left:0;top:0;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 7px rgba(109,29,42,.1),0 0 0 16px rgba(109,29,42,.05)}
.dan-horizont{position:absolute;left:0;bottom:0;width:260vw;height:24vh;background:var(--leaf);opacity:.1;-webkit-mask:url(media/bg-vinograd.webp) left bottom/auto 100% repeat-x;mask:url(media/bg-vinograd.webp) left bottom/auto 100% repeat-x;pointer-events:none}
.dan-traka{position:relative;z-index:1;display:flex;align-items:center;gap:clamp(70px,7vw,130px);height:100%;width:max-content;padding:calc(var(--hdr) + 4vh) 10vw 0 max(var(--ram),calc((100vw - 1240px) / 2))}
.dan-niz{display:contents}
.dan-uvod{flex:none;width:min(470px,36vw)}
.dan-uvod .h2{margin-bottom:0}
.dan-skrol{display:inline-flex;align-items:center;gap:12px;margin-top:34px;font-size:.72rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--acc)}
.dan-skrol b{font-weight:inherit}.dan-skrol b+b{display:none}
.dan-skrol i{width:46px;height:1px;background:currentColor;transform-origin:left;animation:vuci 2s ease-in-out infinite}
@keyframes vuci{0%{transform:scaleX(0)}50%{transform:scaleX(1)}100%{transform:scaleX(0);transform-origin:right}}
.dan-kadar{flex:none;position:relative;width:clamp(380px,38vw,600px);transform:translateY(-5vh)}
.dan-kadar--dole{transform:translateY(7vh)}
.dan-kadar::before{content:attr(data-n);position:absolute;left:0;top:-34px;font:400 1.05rem/1 var(--fd);color:var(--acc);display:flex;align-items:center;gap:12px}
.dan-kadar::after{content:"";position:absolute;left:34px;top:-26px;width:44px;height:1px;background:var(--acc);opacity:.45}
.dan-kadar .razvij{box-shadow:0 34px 60px -36px rgba(34,23,20,.55)}
.dan-t{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:6px 24px;align-items:baseline;margin-top:22px}
.dan-t h3{font:400 clamp(1.5rem,2.1vw,2rem)/1.12 var(--fd)}
.dan-t p{color:var(--ink2);font-size:.96rem}
/* ilustracija u uglu trenutka u fokusu (hrana, vino, rakija...) */
/* Ivan r5: neprovidna (papir sa akvarel ivicom), velika i PREKO fotografije - ne u praznom prostoru iznad nje */
/* Ivan 14.10: 40% manja da se fotografija vidi; uvek samo jedna po kadru */
.dan-jelo{position:absolute;z-index:3;right:-56px;top:-64px;width:min(240px,38%);aspect-ratio:900/672;object-fit:contain;mix-blend-mode:normal;pointer-events:none;opacity:0;transform:scale(.5) rotate(-24deg)}
.dan-tok{display:none}
.dan-kraj{flex:none;width:min(470px,36vw);margin-right:4vw}
.dan-cena{font:400 clamp(1.7rem,2.6vw,2.35rem)/1.2 var(--fd);margin-bottom:14px}
.dan-cena b{font-weight:400;color:var(--acc)}
.dan-kraj>p:not(.dan-cena){color:var(--ink2);margin-bottom:28px}
@media (max-width:760px){
  /* telefon: priča kao niz kartica koje se prevlače (scroll-snap), crtež prelazi u fotografiju kad je kartica u sredini */
  .dan-pin{height:auto;overflow:visible}
  .dan-nebo{display:none}
  .dan-horizont{width:100%;height:16vh}
  .dan-traka{display:block;width:auto;height:auto;padding:96px 0 120px}
  .dan-uvod,.dan-kraj{width:auto;margin:0;padding:0 var(--ram)}
  .dan-skrol{margin-top:22px}.dan-skrol b{display:none}.dan-skrol b+b{display:inline}
  .dan-niz{display:flex;gap:14px;margin-top:18px;padding:44px var(--ram) 6px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--ram);scrollbar-width:none;overscroll-behavior-x:contain}
  .dan-niz::-webkit-scrollbar{display:none}
  .dan-kadar,.dan-kadar--dole{flex:0 0 84%;transform:none;scroll-snap-align:start}
  .dan-kadar::before{top:-30px}.dan-kadar::after{top:-22px}
  .dan-kadar .razvij{aspect-ratio:4/4.4}
  .dan-t{grid-template-columns:1fr;margin-top:16px}
  .dan-niz{padding-top:84px}
  /* telefon: jedna ilustracija u gornjem desnom uglu kartice (Ivan 14.10: manja, da se vidi fotografija) */
  .dan-jelo{right:-4px;top:-56px;width:46%}
  .dan-tok{display:flex;gap:6px;padding:20px var(--ram) 0}
  .dan-tok i{position:relative;flex:1;height:2px;background:rgba(34,23,20,.14);overflow:hidden}
  .dan-tok i::after{content:"";position:absolute;inset:0;background:var(--acc);transform:scaleX(var(--p,0));transform-origin:left}
  .dan-kraj{margin-top:56px}
}

/* ===== 5. NASA VINA ===== */
.vina{position:relative;overflow:hidden;background:var(--acc);color:var(--on);padding:clamp(90px,10vw,150px) var(--ram) clamp(80px,9vw,130px)}
.vina-in{position:relative;z-index:1;max-width:1240px;margin:0 auto}
.vina-glava{display:grid;grid-template-columns:1fr minmax(280px,420px);gap:24px clamp(40px,6vw,96px);align-items:end;margin-bottom:clamp(40px,5vw,64px)}
.vina .h2{color:var(--on);font-size:clamp(2.6rem,5vw,4.3rem);line-height:1.04;margin-bottom:0}
.vina-uvod p{color:rgba(246,239,226,.84);margin-bottom:18px}
.wines{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.wine{position:relative;display:flex;flex-direction:column;gap:16px}
.wine__b h3 a{color:inherit;text-decoration:none}
.wine__b h3 a::after{content:"";position:absolute;inset:0;z-index:2}
.wine__st{position:relative;background:var(--bg2);border-radius:6px;aspect-ratio:4/5;overflow:hidden}
.wine__klip{position:absolute;inset:0;z-index:0;-webkit-mask:url(media/b-mrlja-1.png) center/var(--k,0%) no-repeat;mask:url(media/b-mrlja-1.png) center/var(--k,0%) no-repeat;transition:-webkit-mask-size .9s var(--ease),mask-size .9s var(--ease)}
.wine__klip video{width:100%;height:100%;object-fit:cover}
.wine__klip::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(226,212,188,.15),rgba(226,212,188,.45))}
.wine.igra .wine__klip{--k:260%}
.wine__st .privremeno{opacity:0;transition:opacity .4s}
.wine.igra .wine__st .privremeno{opacity:1}
/* pozadina kartice: tanak geometrijski linijski pattern (trouglovi / rombovi) + „pod" na kom flaša stoji */
.wine__st{background:
  linear-gradient(180deg,transparent 78%,rgba(109,29,42,.07) 78%,rgba(109,29,42,.12)),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='56'%3E%3Cpath d='M0 0L32 56L64 0M0 56L32 0L64 56M0 28H64' fill='none' stroke='%236D1D2A' stroke-opacity='.11' stroke-width='.8'/%3E%3C/svg%3E") center/64px 56px,
  var(--bg2)}
/* produktni PNG 1100x2000: ista visina flaše, osnova na 92% slike -> stoji na liniji poda (22% od dna) */
.wine__st img{position:absolute;z-index:1;left:0;right:0;bottom:calc(22% - 82% * .08);margin:0 auto;height:82%;width:auto;max-width:none;transition:transform .7s var(--ease)}
.wine__st .yr{position:absolute;z-index:2;top:14px;left:16px;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink2);font-weight:600}
.wine__cta{position:absolute;z-index:3;left:12px;right:12px;bottom:12px;transform:translateY(calc(100% + 16px));opacity:0;transition:transform .55s var(--ease),opacity .35s}
.wine__cta .b{width:100%;justify-content:space-between}
.wine:hover .wine__cta,.wine:focus-within .wine__cta{transform:none;opacity:1}
.wine:hover .wine__st img{transform:translateY(-14px)}
.wine__b{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.wine__b h3{font:400 1.4rem/1.15 var(--fd);color:var(--on)}
.wine__b .lb{display:block;font-size:.8rem;color:rgba(246,239,226,.72);margin-top:4px;line-height:1.4}
.wine__c{text-align:right;flex:none}
.price{display:block;font-family:var(--fd);font-size:1.2rem;color:var(--on);white-space:nowrap}
.price small{font-family:var(--ft);font-size:.7rem;font-weight:500;color:rgba(246,239,226,.72)}
.ph{display:inline-block;font-size:.6rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;background:#F4D58D;color:#4A3200;border-radius:3px;padding:2px 6px;margin-top:6px}
.vina-info{display:flex;flex-wrap:wrap;gap:10px 34px;margin-top:clamp(36px,4vw,54px);padding-top:22px;border-top:1px solid rgba(246,239,226,.18);font-size:.9rem;color:rgba(246,239,226,.82)}
.vina-info span{display:inline-flex;align-items:center;gap:10px}
.vina-info span::before{content:"";width:6px;height:6px;transform:rotate(45deg);background:#E9C9B4}

/* ===== 6. UTISCI ===== */
/* dve beskonačne trake u suprotnim smerovima, zastaju pod mišem */
.utisci{position:relative;overflow:hidden;background:var(--card);padding:clamp(80px,9vw,130px) 0}
.utisci-glava{position:relative;z-index:1;max-width:1240px;margin:0 auto clamp(36px,4vw,56px);padding:0 var(--ram);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px 40px}
.utisci-glava .h2{margin-bottom:0;font-size:clamp(2.4rem,4.4vw,3.8rem)}
.utisci-nap{padding-bottom:10px}
.utisci-glava:last-child{margin-bottom:0}
.utisci-trake{position:relative;z-index:1;display:flex;flex-direction:column;gap:18px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.u-red{display:flex;width:max-content}
.u-niz{display:flex;gap:18px;padding-right:18px;animation:traka var(--t,70s) linear infinite}
.u-red--nazad .u-niz{animation-direction:reverse;--t:80s}
.utisci-trake:hover .u-niz{animation-play-state:paused}
@keyframes traka{to{transform:translateX(-100%)}}
.utisak{position:relative;flex:none;width:clamp(300px,31vw,460px);background:var(--bg);border-radius:6px;padding:30px 32px 26px;display:flex;flex-direction:column;gap:16px;overflow:hidden}
.utisak::before{content:"★★★★★";font-size:.8rem;letter-spacing:.24em;color:var(--acc)}
.utisak-z{position:absolute;right:18px;top:-6px;font:400 9rem/1 var(--fd);color:var(--acc);opacity:.1;pointer-events:none}
.utisak blockquote{font:400 clamp(1.15rem,1.45vw,1.4rem)/1.4 var(--fd);color:var(--ink)}
.utisak figcaption{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-top:auto;border-top:1px solid var(--line);padding-top:14px;font-size:.88rem;color:var(--ink2)}
.utisak figcaption b{font-weight:600;color:var(--ink)}
.utisak figcaption span::before{content:"· ";color:var(--acc)}
.utisak--bordo{background:var(--acc);color:var(--on)}
.utisak--maslina{background:var(--leaf);color:var(--on)}
.utisak--bordo blockquote,.utisak--maslina blockquote,.utisak--bordo figcaption b,.utisak--maslina figcaption b{color:var(--on)}
.utisak--bordo figcaption,.utisak--maslina figcaption{color:rgba(246,239,226,.75);border-color:rgba(246,239,226,.2)}
.utisak--bordo::before,.utisak--maslina::before,.utisak--bordo .utisak-z,.utisak--maslina .utisak-z,.utisak--bordo figcaption span::before,.utisak--maslina figcaption span::before{color:#F1D2BF}

/* ===== 7. DOLAZAK ===== */
.dolazak{position:relative;overflow:hidden;background:var(--bg);padding:clamp(90px,10vw,150px) var(--ram) clamp(110px,12vw,180px)}
.dolazak-in{position:relative;z-index:1;max-width:1240px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(40px,6vw,100px);align-items:center}
.mapa{position:relative;background:var(--card);border:1px solid var(--line);border-radius:4px;aspect-ratio:640/460;overflow:hidden}
.mapa-svg{position:absolute;inset:0;width:100%;height:100%}
.mapa-svg path{fill:none;stroke-linecap:round}
.mapa-svg path{stroke-linejoin:round}
.mapa-srafura{stroke:rgba(79,91,60,.16);stroke-width:1}
.mapa-njiva{stroke:rgba(79,91,60,.12);stroke-width:1}
.mapa-svg .mapa-bara{fill:rgba(79,91,60,.14);stroke:rgba(79,91,60,.35);stroke-width:1.2}
.mapa-reka{stroke:rgba(79,91,60,.32);stroke-width:9}
.mapa-reka-ime{font:400 15px var(--fd);letter-spacing:.3em;fill:var(--leaf);opacity:.85}
.mapa-reka-ime textPath{dominant-baseline:auto}
.mapa-autoput{stroke:rgba(34,23,20,.16);stroke-width:7}
.mapa-autoput-sred{stroke:var(--card);stroke-width:1.5;stroke-dasharray:6 6}
.mapa-stit rect{fill:var(--leaf)}
.mapa-stit text{font:600 11px var(--ft);letter-spacing:.06em;fill:var(--on)}
.mapa-aero path{fill:var(--ink2)}
.mapa-aero text,.mapa-oznaka{font:600 10px var(--ft);letter-spacing:.12em;text-transform:uppercase;fill:var(--ink2)}
.mapa-put-osnova{stroke:rgba(109,29,42,.25);stroke-width:1.5;stroke-dasharray:2 6}
.mapa-put{stroke:var(--acc);stroke-width:3.2}
.mapa-vodilja{stroke:var(--acc);stroke-width:1;stroke-dasharray:3 4;opacity:.6}
.mapa-mesto circle{fill:var(--ink);stroke:var(--card);stroke-width:3}
.mapa-mesto text{font:600 12px var(--ft);letter-spacing:.14em;text-transform:uppercase;fill:var(--ink)}
.mapa-grad text{font:400 19px var(--fd);letter-spacing:0;text-transform:none}
.mapa-mesto--malo circle{fill:var(--ink2)}
.mapa-cilj circle{fill:var(--acc)}
.mapa-cilj text{font:400 24px var(--fd);letter-spacing:0;text-transform:none;fill:var(--acc)}
.mapa-vreme{font:400 19px var(--fd);fill:var(--acc)}
.mapa-sever path{fill:var(--ink2)}
.mapa-sever .mapa-sever-dole{fill:none;stroke:var(--ink2);stroke-width:1}
.mapa-sever text{font:600 11px var(--ft);fill:var(--ink2)}
.mapa-kuca{position:absolute;right:3%;bottom:5%;width:22%;aspect-ratio:4/5;border-radius:4px;border:6px solid var(--card);box-shadow:0 20px 40px -22px rgba(34,23,20,.6)}
.mapa-nap{position:absolute;left:14px;bottom:10px;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink2);opacity:.7}
.dolazak-tekst>p:not(.nad){color:var(--ink2);margin-bottom:14px;max-width:46ch}
.dolazak-adr{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:22px 0 28px!important;color:var(--ink)!important}
.dolazak-adr b{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--acc)}
.dolazak .dugmad{margin-bottom:22px}

/* ===== FOOTER ===== */
.ftr{position:relative;overflow:hidden;background:var(--acc2);color:var(--on);padding:clamp(70px,8vw,110px) var(--ram) 0}
.ftr-prasici{position:absolute;right:-40px;bottom:0;width:min(660px,80vw);color:var(--on);opacity:.08;pointer-events:none}
.ftr-in{position:relative;max-width:1240px;margin:0 auto;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:48px clamp(40px,6vw,100px)}
.ftr-logo{display:inline-block;color:var(--on)}
.ftr-logo .lg-n{width:230px}
.ftr-vrh p{color:rgba(246,239,226,.76);margin:22px 0 28px;max-width:34ch;font-size:.95rem}
.ftr-kol{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.akk-btn{display:flex;justify-content:space-between;align-items:center;width:100%;text-align:left;font-size:.72rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#E9C9B4;padding:6px 0 14px;pointer-events:none}
.akk-btn i{display:none;width:12px;height:12px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-3px);transition:transform .4s var(--ease)}
.akk-panel ul{list-style:none;display:flex;flex-direction:column;gap:10px}
.akk-panel a,.akk-panel span{color:var(--on);text-decoration:none;font-size:.95rem}
.akk-panel span{color:rgba(246,239,226,.66)}
.akk-panel a{background:linear-gradient(currentColor,currentColor) left bottom/0 1px no-repeat;transition:background-size .4s var(--ease)}
.akk-panel a:hover{background-size:100% 1px}
.ftr-dno{position:relative;max-width:1240px;margin:clamp(56px,7vw,90px) auto 0;border-top:1px solid rgba(246,239,226,.18);padding:22px 0 30px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:.84rem;color:rgba(246,239,226,.7)}
.ftr-dno a{color:inherit;text-decoration:underline}
.ftr-pravne{display:flex;flex-wrap:wrap;gap:6px 22px}
.ftr-pravne a{text-decoration:none;background:linear-gradient(currentColor,currentColor) left bottom/0 1px no-repeat;transition:background-size .4s var(--ease),color .3s}
.ftr-pravne a:hover,.ftr-pravne a:focus-visible{color:var(--on);background-size:100% 1px}

/* ===== BOCNA KORPA ===== */
.korpa-zastor{position:fixed;inset:0;z-index:89;background:rgba(34,23,20,.45);opacity:0;visibility:hidden;transition:opacity .45s,visibility 0s .45s}
.korpa-zastor.otv{opacity:1;visibility:visible;transition-delay:0s}
.korpa{position:fixed;top:0;right:0;bottom:0;z-index:90;width:min(440px,100%);background:var(--bg);display:flex;flex-direction:column;transform:translateX(105%);visibility:hidden;transition:transform .6s var(--ease),visibility 0s .6s;box-shadow:-20px 0 50px -20px rgba(34,23,20,.4)}
.korpa.otv{transform:none;visibility:visible;transition-delay:0s}
.korpa-glava{display:flex;justify-content:space-between;align-items:center;padding:22px 26px;border-bottom:1px solid var(--line)}
.korpa-glava h2{font:400 1.7rem/1.1 var(--fd)}
.korpa-x{width:46px;height:46px;border-radius:50%;border:1.5px solid var(--acc);color:var(--acc);font:300 26px/1 var(--ft);display:grid;place-items:center;transition:background .3s,color .3s,transform .5s var(--ease)}
.korpa-x:hover{background:var(--acc);color:var(--on);transform:rotate(90deg)}
.korpa-lista{list-style:none;flex:1;overflow-y:auto;padding:6px 26px}
.korpa-lista li{display:grid;grid-template-columns:54px 1fr auto;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.korpa-lista img{height:86px;width:auto;margin:auto}
.korpa-lista b{display:block;font:400 1.15rem/1.2 var(--fd)}
.korpa-lista small{font-size:.78rem;color:var(--ink2)}
.kol{display:flex;align-items:center;gap:8px;margin-top:8px}
.kol button{width:30px;height:30px;border-radius:50%;border:1.5px solid var(--acc);color:var(--acc);font-size:1rem;line-height:1;transition:background .25s,color .25s}
.kol button:hover{background:var(--acc);color:var(--on)}
.kol span{min-width:18px;text-align:center;font-variant-numeric:tabular-nums}
.korpa-cena{text-align:right;font-family:var(--fd);font-size:1.05rem;white-space:nowrap}
.korpa-cena button{display:block;margin:6px 0 0 auto;font-size:.74rem;color:var(--ink2);text-decoration:underline;text-underline-offset:3px}
.korpa-prazno{padding:26px;color:var(--ink2);display:none}
.korpa.prazna .korpa-prazno{display:block}
.korpa.prazna .korpa-lista{display:none}
.korpa-dno{padding:20px 26px 26px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:14px;background:var(--card)}
.korpa-zbir{display:flex;justify-content:space-between;align-items:baseline}
.korpa-zbir b{font:400 1.4rem var(--fd)}
.korpa-nap{font-size:.85rem;color:var(--ink2)}
.age{display:flex;gap:12px;align-items:flex-start;font-size:.9rem;color:var(--ink2);cursor:pointer}
.age input{width:20px;height:20px;flex:none;accent-color:var(--acc);margin-top:3px}
.korpa-dno .b-pri{width:100%;justify-content:space-between}
.korpa-dno .b-txt{align-self:flex-start}

/* ===== FORMA (linija, 1:1 brand book 06) - panel upita/rezervacije je u rezervacija.css ===== */
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:26px 22px}
.fgrid .full{grid-column:1/-1}
.fld{display:flex;flex-direction:column;gap:6px}
.fld>label,.fld>.lb{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--ink2)}
.fld>label .rq{color:var(--acc)}
.fld input{width:100%;font:inherit;font-size:1.02rem;color:var(--ink);background:transparent;border:0;border-bottom:1.5px solid rgba(86,68,59,.45);border-radius:0;padding:10px 2px;transition:border-color .3s,box-shadow .3s;-webkit-appearance:none;appearance:none}
.fld input:hover{border-bottom-color:var(--acc)}
.fld input:focus{outline:0;border-bottom-color:var(--acc);box-shadow:0 1.5px 0 0 var(--acc)}
.fld input::placeholder{color:rgba(86,68,59,.5)}
.fld.bad input{border-bottom-color:#A3261E;box-shadow:0 1.5px 0 0 #A3261E}
.fld .err{display:none;font-size:.82rem;color:#A3261E;font-weight:500}
.fld.bad .err{display:block}
.step{display:flex;align-items:center;gap:6px;border-bottom:1.5px solid rgba(86,68,59,.45)}
.step button{flex:none;width:40px;height:40px;border:1.5px solid var(--acc);color:var(--acc);font-size:1.15rem;border-radius:50%;transition:background .25s,color .25s;margin:4px 0}
.step button:hover{background:var(--acc);color:var(--on)}
.step input{border:0!important;box-shadow:none!important;text-align:center;font-variant-numeric:tabular-nums;font-size:1.2rem}
.sent p{color:var(--on);font-size:.95rem}

/* ===== FILM lightbox ===== */
/* film je potpuno van toka strane dok se ne otvori (display:none - na telefonu se ranije video video ispod futera) */
.flb{position:fixed;inset:0;z-index:96;display:none;place-items:center;background:rgba(22,12,10,.92)}
.flb.otv{display:grid;animation:flbUlaz .45s ease both}
@keyframes flbUlaz{from{opacity:0}}
.lb-okvir{position:relative;width:min(1120px,92vw);aspect-ratio:16/9;transform:scale(.92);transition:transform .7s var(--ease)}
.flb.otv .lb-okvir{transform:none}
.lb-okvir video{width:100%;height:100%;object-fit:contain;background:#000;border-radius:4px}
.lb-okvir .privremeno{top:14px;left:14px;right:auto}
.lb-x{position:absolute;right:22px;top:22px;border-color:var(--on);color:var(--on)}

/* ===== RESPONSIVE ===== */
@media (max-width:1100px){
  .hdr{grid-template-columns:1fr auto}
  .hdr-nav{display:none}
  .hdr-burger{display:block}
}
@media (max-width:980px){
  .prica-in,.ceka-in,.utisci-in,.dolazak-in,.ftr-in{grid-template-columns:1fr}
  .vina-glava{grid-template-columns:1fr}
  .wines{grid-template-columns:repeat(2,1fr)}
  .ceka-in{grid-template-areas:"glava" "scena" "telo";grid-template-rows:auto}
  .ceka-scena{width:min(520px,100%);justify-self:center;margin-bottom:28px}
  .ceka-jelo{left:-24px}
}
@media (max-width:760px){
  :root{--hdr:72px;--ram:16px}
  body{font-size:16px}
  .hdr{gap:10px}
  .hdr-logo .lg-n{width:104px}
  .hdr.skrol{height:64px}
  .hdr.skrol .hdr-logo .lg-n{width:92px}
  .hdr--uvod .hdr-logo{transform:translate(calc(50vw - var(--ram) - 50%),16px) scale(1.45)}
  .hdr-tel{display:none}
  .hdr-akc{gap:8px}
  .kor-dugme.b-ico{width:48px;height:48px}
  .kor-dugme .cnt{top:5px;right:5px}
  .hdr-burger{width:48px;height:48px}
  .hdr-burger i{left:14px;right:14px}
  .hdr-burger i:first-child{top:19px}.hdr-burger i:last-child{top:27px}
  .menu-otv .hdr-burger i:first-child,.menu-otv .hdr-burger i:last-child{top:23px}
  .prica-velika{width:100%}
  .prica-mala{width:44%;right:-4px;bottom:0}
  .film{width:132px;height:132px;left:auto;right:6%;top:-48px}
  .film-sred{width:64px;height:64px}
  .film-krug text{font-size:10.5px;letter-spacing:.12em}
  .razvij-oznaka{left:10px;bottom:10px;font-size:.58rem}
  .prica{margin-top:-30svh}
  /* sta Vas ceka: naslov, pa video 4:5 od ivice do ivice, pa stavke - aktivna uvek prva, sa trakom napretka */
  .ceka-scena{width:auto;justify-self:stretch;margin:0 calc(-1 * var(--ram)) 22px}
  .ceka-luk{border-radius:0;box-shadow:none}
  /* telefon: jedna velika ilustracija preko donje četvrtine klipa, bez natpisa */
  .ceka-jelo{left:8px;top:-26px;width:40%}
  .ceka-jelo[data-za="1"]{left:auto;right:8px;top:auto;bottom:-30px;width:32%}
  .ceka-luk .privremeno{display:none}
  .ceka .h2{white-space:normal}
  .ceka-lista{display:flex;flex-direction:column;margin-top:0}
  .ceka-lista li.on{order:-1;border-top-color:transparent}
  .ceka-lista li::before{height:3px;top:-2px;background:rgba(109,29,42,.15);transform:none}
  .ceka-lista li.on::before{background:linear-gradient(var(--acc),var(--acc)) left/100% 100% no-repeat,rgba(109,29,42,.15);animation:napredM var(--trajanje,6s) linear forwards;transform:none}
  .ceka-lista li:not(.on)::before{display:none}
  .ceka-lista h3 button{padding:14px 0 10px;font-size:1.35rem}
  .ceka-lista li.on h3 button{transform:none}
  .ceka-op>p{padding-left:0}
  /* strelice preko kadra (kao na mobilnom shop-u): broj levo, strelice desno */
  .ceka-str{display:flex;position:absolute;z-index:6;left:24px;right:24px;top:24px;align-items:center;gap:10px;color:var(--on)}
  .ceka-br{margin-right:auto;padding:8px 13px;border-radius:999px;background:rgba(34,23,20,.32);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font-size:.7rem;font-weight:600;letter-spacing:.16em;font-variant-numeric:tabular-nums}
  .ceka-br b{font:400 1.2rem var(--fd);letter-spacing:0}
  .ceka-str .mob-s{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;border:1.3px solid rgba(246,239,226,.85);background:rgba(34,23,20,.22);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:background .3s,transform .2s}
  .ceka-str .mob-s:active{transform:scale(.92)}
  .ceka-str .mob-s svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
  #cekaDalje{background:var(--acc);border-color:var(--acc)}
  /* vina: 2 x 2, flase stoje na podu, dugme je samo Pecat krug */
  .wines{gap:12px}
  .wine{gap:10px}
  .wine__cta{left:auto;right:8px;bottom:8px}
  .wine__cta .b{width:auto;padding:5px;min-height:0;gap:0}
  .wine__cta .bt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .wine__cta .b .bc{width:38px;height:38px}
  .wine__b{flex-direction:column;gap:4px}
  .wine__b h3{font-size:1.15rem}
  .wine__c{text-align:left}
  .wine__st .yr{top:10px;left:10px;font-size:.62rem}
  .wine__st .privremeno{top:auto;right:auto;bottom:12px;left:8px;font-size:.5rem;padding:5px 7px}
  .ftr-kol{grid-template-columns:1fr;gap:0}
  .akk{border-top:1px solid rgba(246,239,226,.16)}
  .akk-btn{pointer-events:auto;padding:18px 0;font-size:.76rem}
  .akk-btn i{display:block}
  .akk.is-open .akk-btn i{transform:rotate(-135deg) translateY(-2px)}
  .akk-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ease)}
  .akk-panel>ul{overflow:hidden}
  .akk.is-open .akk-panel{grid-template-rows:1fr}
  .akk.is-open .akk-panel>ul{padding-bottom:20px}
  .ftr-dno{flex-direction:column;gap:14px}
  .ftr-pravne{flex-direction:column;gap:10px}
  .fgrid{grid-template-columns:1fr}
  .mapa-mesto text{font-size:15px}
  .mapa-cilj text{font-size:26px}
}
@media (hover:none),(max-width:760px){.wine__cta{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){
  *,::before,::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}