/* Vinarija 4 praseta - strana vina. Flaša, kartice i brzi pregled dolaze iz shop.css. */

/* ===== 1. VINO ===== */
.pr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}
.pr-vizual{position:sticky;top:0;height:100vh;min-height:620px;overflow:hidden;background:var(--wash);display:flex;align-items:flex-end;justify-content:center;padding:calc(var(--hdr) + 40px) 30px 9vh}
.pr-rec{position:absolute;left:50%;top:calc(var(--hdr) + 4vh);translate:-50% 0;font:400 clamp(5rem,11vw,11rem)/1 var(--fd);letter-spacing:.06em;color:rgba(255,250,240,.55);white-space:nowrap;pointer-events:none}
.pr-mrlja{position:absolute;left:50%;top:58%;width:min(92%,640px);aspect-ratio:1;translate:-50% -50%;background:#FBF6EC;opacity:.6;-webkit-mask:url(media/b-mrlja-1.png) center/100% no-repeat;mask:url(media/b-mrlja-1.png) center/100% no-repeat}
.pr-flasa{position:relative;z-index:2;height:min(72vh,720px);display:flex;align-items:flex-end;justify-content:center;cursor:pointer}
.pr-flasa .fl--mala{height:66%}
.pr-flasa .fl::after{bottom:-16px;height:34px}

.pr-t{padding:calc(var(--hdr) + 40px) clamp(24px,6vw,110px) 90px clamp(28px,5vw,90px);max-width:720px}
.pr-t .mrv{margin-bottom:30px}
.pr-t .nad{margin-bottom:12px}
.pr-t h1{font:400 clamp(2.8rem,4.6vw,4.4rem)/1.02 var(--fd);margin-bottom:10px}
.pr-sorta{font-size:1.08rem;color:var(--ink2);margin-bottom:26px}
.pr-opis{font-size:1.06rem;line-height:1.7;color:var(--ink);max-width:48ch;padding-left:22px;border-left:2px solid var(--acc)}
.pr-kupi{margin:34px 0 0;padding:28px 0;border-block:1px solid var(--line)}
.pr-akc{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.pr-akc .b-pri{min-width:250px;justify-content:space-between}
.pr-uslovi{list-style:none;display:flex;flex-direction:column;gap:6px;margin-top:22px;font-size:.88rem;color:var(--ink2)}
.pr-uslovi li{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pr-uslovi li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--leaf);flex:none}
.pr-cin{display:grid;grid-template-columns:1fr 1fr;gap:18px 30px;margin:30px 0}
.pr-cin dt{font-size:.66rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink2)}
.pr-cin dd{font-family:var(--fd);font-size:1.25rem;line-height:1.3}
.pr-temp{background:var(--card);border-radius:6px;padding:24px 26px 22px}
.pr-temp-nas{font-size:.66rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink2);margin-bottom:46px}
.term{position:relative;height:10px;border-radius:999px;background:linear-gradient(90deg,#BFD0D6,#E9DCC4 55%,#E2B9A6);margin-bottom:34px}
.term-skala{position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(34,23,20,.35) 0 1px,transparent 1px 10%);border-radius:inherit;opacity:.6}
.term-opseg{position:absolute;top:-6px;height:22px;border-radius:999px;background:var(--acc);transform-origin:left center;box-shadow:0 4px 12px -4px rgba(109,29,42,.6);min-width:22px}
.term-opseg b{position:absolute;bottom:calc(100% + 8px);left:50%;translate:-50% 0;font:400 1.15rem/1 var(--fd);color:var(--acc);white-space:nowrap}
.term-kraj{position:absolute;top:18px;left:0;font-size:.7rem;color:var(--ink2);font-variant-numeric:tabular-nums}
.term-kraj--d{left:auto;right:0}
.pr-temp-txt{font-size:.95rem;color:var(--ink)}

/* ===== 2. UZ JELO ===== */
.pr-jelo{max-width:1240px;margin:0 auto;padding:clamp(100px,11vw,170px) var(--ram);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(40px,6vw,100px);align-items:center}
.jelo-tanjiri{position:relative;aspect-ratio:5/4}
.jelo{position:absolute;margin:0}
/* prave akvarel ilustracije na papiru (bez providnih delova), kao listovi iz skicenbloka */
.jelo img{display:block;width:100%;height:auto;border-radius:3px;background:#F7F0E3;box-shadow:0 0 0 8px #F7F0E3,0 26px 40px -16px rgba(34,23,20,.35)}
.jelo figcaption{font-size:.7rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink2);margin-top:16px;text-align:center}
.jelo-2{z-index:1}
.jelo-1{left:0;top:0;width:60%;rotate:-6deg}
.jelo-2{right:0;bottom:0;width:52%;rotate:7deg}
.jelo-t p:not(.nad){color:var(--ink2);max-width:42ch;margin-bottom:14px}
.jelo-t #prJelo{font-family:var(--fd);font-size:1.4rem;line-height:1.35;color:var(--acc)}
.jelo-t .b-txt{margin-top:10px}
.jelo-t .ph-napomena{display:block;width:fit-content}

/* ===== 3. AKCIJA - paket od šest flaša ===== */
.pr-akcija{position:relative;overflow:hidden;background:var(--acc);color:var(--on);margin:0 0 clamp(70px,8vw,110px);padding:clamp(80px,9vw,130px) var(--ram);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(40px,6vw,100px);align-items:center}
.pa-broj{position:absolute;right:-3vw;bottom:-12vw;font:400 clamp(20rem,40vw,38rem)/1 var(--fd);color:rgba(246,239,226,.06);pointer-events:none}
.pa-foto{position:relative;margin:0;min-width:0;padding:5% 7% 0 0;max-width:720px;justify-self:end;width:100%}
.pa-foto::before{content:"";position:absolute;left:50%;top:55%;width:118%;aspect-ratio:1;translate:-50% -50%;background:#F6EFE2;opacity:.92;-webkit-mask:url(media/b-mrlja-2-hd.png?v=2) center/100% no-repeat;mask:url(media/b-mrlja-2-hd.png?v=2) center/100% no-repeat}
/* gajba: šest flaša (crteži) upada u drvenu gajbu - vraćeno iz r3 (Ivan r4) */
.paket-gajba{position:relative;aspect-ratio:600/330}
.gajba-flase{position:absolute;left:5%;right:5%;bottom:8%;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:end}
/* -fl crteži imaju providan rub (flaša je ~50% širine platna) - šest kolona, slika šira od kolone */
.gajba-flase img{width:175%;max-width:none;height:auto;margin-inline:-37.5%;filter:drop-shadow(0 8px 8px rgba(34,23,20,.18))}
.gajba-crtez{position:absolute;left:0;bottom:0;width:100%;height:46%;z-index:2}
.gajba-crtez .daska{fill:#C9A77C;opacity:.78}
.gajba-crtez path{fill:none;stroke:#3A2A24;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.pr-akcija .p6{background:var(--on);color:var(--acc);box-shadow:0 0 0 5px var(--acc),0 0 0 6.5px var(--on),0 14px 30px -10px rgba(0,0,0,.45)}
.pa-t{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:14px;max-width:520px}
.pa-traka{font-size:.72rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;background:var(--on);color:var(--acc);padding:7px 14px;border-radius:999px}
.pa-t h2{font:400 clamp(2.2rem,3.6vw,3.4rem)/1.05 var(--fd)}
.pa-t>p:not(.pa-traka):not(.ph-napomena){color:rgba(246,239,226,.84);max-width:42ch}
.pa-cena{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px;padding:16px 0;margin:4px 0;border-block:1px solid rgba(246,239,226,.22);width:100%}
.pa-stara{font:400 1.5rem/1 var(--fd);color:rgba(246,239,226,.6);text-decoration-thickness:1.5px}
.pa-stara small{font-size:.75rem}
.pa-pojed{font-size:.78rem;color:rgba(246,239,226,.6)}
.pa-t .b{margin-top:8px}

/* ===== 4. POKLON ===== */
.pr-poklon{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:0 var(--ram) clamp(90px,10vw,140px);max-width:1440px;margin:0 auto}
.pp{position:relative;overflow:hidden;border-radius:6px;padding:clamp(34px,4vw,60px);color:var(--on);display:flex;flex-direction:column;align-items:flex-start;gap:14px;min-height:400px;justify-content:flex-end}
.pp h2{font:400 clamp(1.9rem,2.8vw,2.6rem)/1.08 var(--fd)}
.pp p:not(.nad):not(.ph-napomena){color:rgba(246,239,226,.82);max-width:42ch}
.pp .nad{margin-bottom:0}
.pp .b{margin-top:10px}
.pp-poklon{background:var(--leaf)}
.pp-prasici{position:absolute!important;right:-40px;top:30px;width:min(420px,70%);color:var(--on);opacity:.1}
.pp-poklon .b-inv{color:var(--leaf)}
.pp-poklon .b-inv .bc{background:var(--leaf)}
/* team building: ista kartica, tamnija bež, silueta vinove loze umesto prasića */
.pp>:not([aria-hidden]){position:relative}
.pp-team{background:#D9C6A5;color:var(--ink)}
.pp-team p:not(.nad):not(.ph-napomena){color:var(--ink2)}
.pp-loza{position:absolute;right:-2%;top:0;height:100%;aspect-ratio:356/1559;background:var(--leaf);opacity:.2;pointer-events:none;-webkit-mask:url(media/bg-loza-v.webp) right top/contain no-repeat;mask:url(media/bg-loza-v.webp) right top/contain no-repeat}

/* ===== 4. OSTALA VINA ===== */
.pr-ostala{padding:0 0 clamp(80px,9vw,130px);--scena:clamp(380px,50vh,520px)}
.pr-ostala-glava{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;padding:0 var(--ram);max-width:1440px;margin:0 auto 10px}
.pr-ostala-glava .h2{margin:0}
.police--ostala{grid-template-columns:repeat(3,minmax(0,1fr));max-width:1440px;margin:0 auto}

/* ===== lepljiva traka (mobilni) ===== */
.pr-traka{position:fixed;left:10px;right:10px;bottom:10px;z-index:70;display:none;align-items:center;gap:12px;background:var(--card);border-radius:999px;padding:6px 6px 6px 16px;box-shadow:0 18px 40px -12px rgba(34,23,20,.45);transform:translateY(140%);transition:transform .6s var(--ease)}
.pr-traka.vidi{transform:none}
.pr-traka img{height:46px;width:auto}
.pr-traka div{flex:1;min-width:0;line-height:1.2}
.pr-traka b{display:block;font:400 1.05rem var(--fd);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pr-traka span{font-size:.8rem;color:var(--ink2)}
.pr-traka .b{min-height:50px;padding-left:18px;gap:10px}
.pr-traka .b .bc{width:38px;height:38px}

@media (max-width:980px){
  .pr-jelo,.pr-poklon,.pr-akcija{grid-template-columns:1fr}
  .pa-foto{justify-self:center}
}
@media (max-width:760px){
  .pr{grid-template-columns:1fr}
  .pr-vizual{position:relative;height:70svh;min-height:480px;padding:calc(var(--hdr) + 20px) 20px 54px}
  .pr-flasa{height:calc(70svh - var(--hdr) - 90px);min-height:340px}
  .pr-rec{font-size:28vw;top:calc(var(--hdr) + 10px)}
  .pr-t{padding:34px var(--ram) 60px}
  .pr-t .mrv{display:none}
  .pr-t h1{font-size:2.8rem}
  .pr-opis{font-size:1rem}
  .pr-akc{gap:14px}
  .pr-akc .b-pri{min-width:0;flex:1}
  .pr-cin{gap:14px 18px}
  .pr-traka{display:flex}
  .jelo-tanjiri{aspect-ratio:1/1}
  .pp{min-height:340px}
  .gajba-flase{left:2%;right:2%}
  .pa-foto{padding-top:64px}
  .pr-akcija .p6{top:-6px;right:4px;width:74px}
  .pr-ostala-glava{flex-direction:column;align-items:flex-start}
  .police--ostala{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:78%;overflow-x:auto;scroll-snap-type:x mandatory;height:auto;padding:0 var(--ram);scrollbar-width:none;gap:0}
  .police--ostala::-webkit-scrollbar{display:none}
  .police--ostala .vk{height:auto;scroll-snap-align:start;flex:none;overflow:hidden}
  .pr-ostala .vk-scena{flex:none;height:380px;padding-top:0}
  .pr-ostala .vk-flasa{max-height:330px;min-height:0;transform:none}
  .pr-ostala .vk-rec,.pr-ostala .vk-mrlja{transform:none}
  .pr-ostala .vk-mrlja{background:var(--wash);width:110%;opacity:.5}
  .pr-ostala .vk-temp{top:auto;bottom:16px;left:12px;right:auto}
  .pr-ostala .vk-rec{display:none}
  .pr-ostala .vk-t{padding:18px 12px 0;transform:none;opacity:1}
  .pr-ostala .vk-ime{font-size:1.7rem}
  .pr-ostala .vk-kratko,.pr-ostala .vk-mob-btn{display:none}
  .pr-ostala .vk--tamno{color:var(--ink)}
  .pr-ostala .vk--tamno .price,.pr-ostala .vk--tamno .price small{color:var(--ink)}
}