/* Vina Škoro - subpages, built on the v3 design (main.css). Only what the homepage does not already have. */

/* nav dropdown: Vina */
.dd{position:relative;display:inline-flex}
.dd__btn{display:inline-flex;align-items:center;gap:8px}
.dd__btn i{width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .4s var(--ease)}
.dd__menu{position:absolute;left:50%;top:100%;transform:translate(-50%,8px);min-width:230px;padding:10px;margin-top:10px;border-radius:16px;background:rgba(21,17,13,.96);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(217,178,95,.25);box-shadow:0 20px 50px rgba(0,0,0,.45);display:grid;opacity:0;visibility:hidden;transition:.4s var(--ease)}
.dd__menu::before{content:"";position:absolute;left:0;right:0;top:-22px;height:22px}
.dd:hover .dd__menu,.dd:focus-within .dd__menu{opacity:1;visibility:visible;transform:translate(-50%,0)}
.dd:hover .dd__btn i{transform:translateY(1px) rotate(-135deg)}
.top__nav .dd__menu a{display:flex;gap:12px;align-items:baseline;padding:11px 14px;border-radius:10px;letter-spacing:.12em}
.top__nav .dd__menu a::after{display:none}
.top__nav .dd__menu a:hover{background:rgba(217,178,95,.14);color:var(--gold-hi)}
.dd__menu em{font:italic 400 17px var(--serif);color:var(--gold);letter-spacing:0;width:24px}

/* ---------- wine page hero: the v3 wine scene, as a page ---------- */
.sp-wine{position:relative;overflow:hidden;background:var(--bg);display:grid;justify-items:center;padding:calc(84px + env(safe-area-inset-top)) var(--pad) 40px;--mx:50%;--my:50%}
.sp-wine .vina__sketch{--mx:50%;--my:45%}
.sp-wine .vina__sketch .sketch g{stroke:var(--acc)}
.sp-wine__title{position:relative;top:auto;left:auto;right:auto;padding-bottom:.08em;z-index:1}
.sp-wine__title .vina__no{color:var(--acc)}
.sp-wine__b{position:relative;z-index:2;height:min(54svh,460px);aspect-ratio:.55;margin-top:14px}
.sp-wine__bottle{position:absolute;left:50%;top:0;height:100%;width:auto;max-width:none;transform:translateX(-50%);filter:drop-shadow(0 30px 40px rgba(0,0,0,.55));animation:sp-float 6s ease-in-out infinite;transition:opacity .6s}
.sp-wine__3d{position:absolute;inset:-4% -60%;width:220%;height:108%;opacity:0;transition:opacity .8s;touch-action:pan-y;cursor:grab}
.sp-wine__b.is-3d .sp-wine__3d{opacity:1}.sp-wine__b.is-3d .sp-wine__bottle{opacity:0}
.sp-wine__hint{position:absolute;left:50%;bottom:-30px;transform:translateX(-50%);white-space:nowrap;font:700 10px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--mute);opacity:0;transition:opacity .6s}
.sp-wine__b.is-3d .sp-wine__hint{opacity:1}
@keyframes sp-float{50%{transform:translateY(-10px) rotate(.6deg)}}
.sp-wine__info{position:relative;z-index:3;width:100%;display:grid;gap:22px;text-align:center;margin-top:24px}
.sp-wine__info .wine__type{color:var(--acc)}
.sp-wine__desc{color:var(--text);font-size:16px;max-width:30em;margin:0 auto}
.sp-wine .spec{display:grid;grid-template-columns:repeat(3,auto);justify-content:center;gap:22px;margin:18px 0}
.sp-wine .spec dt{font:700 10.5px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--acc)}
.sp-wine .spec dd{font:400 21px/1.2 var(--serif)}
.sp-wine__cta{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.sp-wine__crumb{position:relative;z-index:3;margin-top:30px;font:700 11px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.sp-wine__crumb a:hover{color:var(--cream)}

/* ---------- song ---------- */
.sp-song{padding:clamp(90px,12vw,170px) 0;text-align:center;background:radial-gradient(ellipse at 50% 50%,color-mix(in srgb,var(--acc) 10%,transparent),transparent 60%)}
.sp-song .eyebrow{justify-content:center}.sp-song .eyebrow::before{display:none}
.sp-song__lyric{font:italic 400 clamp(30px,4.6vw,62px)/1.22 var(--serif);max-width:20em;margin:0 auto;padding-bottom:.08em}

/* ---------- about ---------- */
.sp-about{padding:clamp(90px,11vw,160px) 0;background:linear-gradient(var(--noir),var(--noir2))}
.sp-about__grid{display:grid;gap:56px}
.sp-h{font-size:clamp(46px,7vw,96px);padding-bottom:.08em}
.sp-about__txt{margin-top:30px;max-width:36em}
.sp-about__txt p{color:var(--text);margin-bottom:16px}
.sp-k{font:700 12px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin:0 0 14px}
.sp-specs{display:grid;grid-template-columns:repeat(2,1fr);gap:0 20px;border-top:1px solid var(--line);margin-bottom:46px}
.sp-specs div{padding:14px 0;border-bottom:1px solid var(--line)}
.sp-specs dt{font:700 10.5px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.sp-specs dd{font:400 23px/1.25 var(--serif)}
.sp-pair{list-style:none;border-top:1px solid var(--line)}
.sp-pair li{font:400 23px/1.3 var(--serif);padding:13px 0;border-bottom:1px solid var(--line)}
.sp-aw{padding-top:0}

/* ---------- FAQ + form ---------- */
.sp-qa{padding:clamp(90px,11vw,160px) 0;background:var(--noir2);border-top:1px solid rgba(217,178,95,.12)}
.sp-qa__grid{display:grid;gap:56px}
.sp-qa .faq{padding:0;max-width:none}
.sp-form__t{font:400 34px/1.05 var(--serif);padding-bottom:.06em}

/* ---------- other wines ---------- */
.sp-more{padding:clamp(80px,10vw,140px) 0}
.sp-others{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:10px}
.sp-other{position:relative;display:grid;justify-items:center;gap:4px;padding:26px 14px 22px;border-radius:12px;background:radial-gradient(ellipse at 50% 30%,color-mix(in srgb,var(--acc) 22%,transparent),transparent 65%),var(--bg);text-align:center;overflow:hidden;transition:transform .7s var(--ease)}
.sp-other img{height:190px;width:auto;margin-bottom:14px;filter:drop-shadow(0 18px 22px rgba(0,0,0,.55));transition:transform .8s var(--ease)}
.sp-other:hover{transform:translateY(-4px)}
.sp-other:hover img{transform:translateY(-8px) rotate(-3deg)}
.sp-other__no{position:absolute;left:16px;top:12px;font:italic 400 20px var(--serif);color:var(--acc)}
.sp-other b{font:400 28px/1.05 var(--serif);font-weight:400}
.sp-other__t{font:700 10px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--acc)}

@media (min-width:700px){ .sp-others{grid-template-columns:repeat(4,1fr)} }
@media (min-width:1000px){
  .sp-wine{height:100svh;min-height:720px;display:block;padding:0}
  .sp-wine__title{position:absolute;top:96px;left:0;right:0}
  .sp-wine__b{position:absolute;left:50%;bottom:9svh;transform:translateX(-50%);height:min(58svh,560px);margin:0}
  .sp-wine__info{position:absolute;inset:0;margin:0;grid-template-columns:1fr 1fr;align-items:center;text-align:left;padding:140px var(--pad) 90px}
  .sp-wine__l{padding-right:clamp(150px,16vw,280px)}
  .sp-wine__r{padding-left:clamp(150px,16vw,280px);max-width:calc(540px + clamp(150px,16vw,280px));justify-self:end}
  .sp-wine__desc{margin:0 0 6px;font-size:17px}
  .sp-wine .spec{justify-content:start}
  .sp-wine .medals{justify-content:flex-start}
  .sp-wine__cta{justify-content:flex-start;margin-top:4px}
  .sp-wine__crumb{position:absolute;left:var(--pad);bottom:34px;margin:0}
  .sp-about__grid{grid-template-columns:1.2fr 1fr;gap:110px;align-items:start}
  .sp-qa__grid{grid-template-columns:1fr 460px;gap:100px;align-items:start}
}

/* ---------- cart badge + add feedback ---------- */
.cart-n{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;margin:0 -6px 0 8px;border-radius:999px;background:var(--noir);color:var(--gold-hi);font:700 11px var(--sans);letter-spacing:0}
.is-added{animation:added .6s var(--ease)}
@keyframes added{40%{transform:scale(1.08)}}
.toast a{text-decoration:underline;margin-left:6px;white-space:nowrap}
.dd__all{border-bottom:1px solid var(--line);border-radius:10px 10px 0 0!important;margin-bottom:4px}

/* ---------- homepage: wine scene buttons ---------- */
.wine__btns{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:center}
.wine__more{font:700 11.5px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--cream);border-bottom:1px solid rgba(246,239,226,.4);padding:4px 0}
.wine__more:hover{color:var(--acc);border-color:currentColor}
@media (min-width:1000px){.wine__btns{justify-content:flex-start}}
@media (max-width:999px){
  .hero__seal{width:min(58vw,27svh)}
  .vina__nav{top:calc(78px + 15vw + 2px)}
}

/* ---------- homepage: paket teaser ---------- */
.tz__grid{display:grid;gap:50px;align-items:center}
.tz .lead{margin-top:26px}
.tz__sets{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:34px 0 28px;max-width:520px}
.tz__sets a{display:grid;gap:2px;padding:14px 12px;border:1.5px solid var(--line);border-radius:10px;transition:.35s var(--ease)}
.tz__sets a:hover{border-color:var(--gold);background:rgba(217,178,95,.1)}
.tz__sets b{font:400 36px/1 var(--serif);font-weight:400;color:var(--gold-hi)}
.tz__sets span{font:700 10px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--text);line-height:1.3}
.tz__crate{display:block;transition:transform .8s var(--ease)}
.tz__crate:hover{transform:translateY(-6px) rotate(-.5deg)}
.tz__row{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.tz__b{aspect-ratio:1/1.6;border-radius:8px;background:radial-gradient(circle at 50% 40%,#1c120a,#120b06);box-shadow:inset 0 3px 8px rgba(0,0,0,.7);display:grid;place-items:end center;padding-bottom:6%;overflow:hidden}
.tz__b img{height:90%;width:auto;filter:drop-shadow(0 8px 10px rgba(0,0,0,.6))}
@media (min-width:1000px){.tz__grid{grid-template-columns:1fr .9fr;gap:100px}}

/* ---------- quantity + add ---------- */
.bq{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:center;margin-top:6px}
.qty{display:inline-flex;align-items:center;border:1.5px solid rgba(246,239,226,.3);border-radius:999px;height:52px;padding:0 4px}
.qty button{width:40px;height:40px;border-radius:50%;font:500 20px/1 var(--sans);color:var(--cream);transition:.25s}
.qty button:hover:not(:disabled){background:var(--cream);color:var(--noir)}
.qty button:disabled{opacity:.3}
.qty input{width:46px;text-align:center;background:none;border:0;color:var(--cream);font:400 24px var(--serif);-moz-appearance:textfield}
.qty input::-webkit-inner-spin-button,.qty input::-webkit-outer-spin-button{-webkit-appearance:none}
.qty input:focus{outline:0}
.qty--sm{height:42px}.qty--sm button{width:32px;height:32px}.qty--sm input{width:36px;font-size:20px}
@media (min-width:1000px){.bq{justify-content:flex-start}}
.mbar{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:61;display:flex;align-items:center;gap:10px;padding:6px 6px 6px 18px;border-radius:999px;background:rgba(21,17,13,.92);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--line);box-shadow:0 14px 40px rgba(0,0,0,.45);transform:translateY(150%);transition:transform .6s var(--ease)}
.mbar.is-on{transform:none}
.mbar__n{flex:1;font:400 20px/1.1 var(--serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mbar--pk{transform:none}.mbar--pk.is-off{transform:translateY(150%)}
@media (min-width:1000px){.mbar{display:none}}
.sub .pill,.sub .buyfab{display:none}

/* ---------- page heads ---------- */
.sp-head{padding:calc(130px + env(safe-area-inset-top)) 0 clamp(50px,6vw,90px);background:radial-gradient(ellipse at 80% 0%,#241b11,var(--noir) 60%)}
.sp-head--tight{padding-bottom:30px}
.sp-head .lead{margin-top:26px}
.sp-head .h-display{padding-bottom:.08em}
.sp-head .h-display strong{font-weight:400;color:var(--gold-hi)}

/* ---------- all wines ---------- */
.wcs{display:grid;gap:14px;padding-bottom:clamp(80px,10vw,140px)}
.wc{position:relative;display:grid;grid-template-columns:110px 1fr;gap:18px;align-items:center;padding:24px 20px 24px 12px;border-radius:16px;background:radial-gradient(ellipse at 15% 60%,color-mix(in srgb,var(--acc) 22%,transparent),transparent 60%),var(--bg);overflow:hidden}
.wc__img img{height:240px;width:auto;margin:0 auto;filter:drop-shadow(0 20px 26px rgba(0,0,0,.55));transition:transform .9s var(--ease)}
.wc:hover .wc__img img{transform:translateY(-8px) rotate(-2deg)}
.wc__no{position:absolute;right:20px;top:14px;font:italic 400 24px var(--serif);color:var(--acc)}
.wc .wine__type{color:var(--acc)}
.wc__name{font:400 clamp(40px,4.4vw,58px)/1 var(--serif);margin:6px 0 8px;padding-bottom:.06em}
.wc__nose{font:italic 400 20px/1.3 var(--serif);color:var(--text);margin-bottom:12px}
.wc__m{margin-bottom:14px}
.wc__cta{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center}
.wc .bq{justify-content:flex-start;margin:0}
.wc .qty{height:46px}.wc .btn{min-height:46px}
@media (min-width:1000px){
  .wcs{grid-template-columns:repeat(2,1fr);gap:16px}
  .wc{grid-template-columns:200px 1fr;padding:34px 34px 34px 20px}
  .wc__img img{height:330px}
  .wc:first-child{grid-column:1/-1}
}

/* ---------- Složi paket ---------- */
.pk2{display:grid;gap:34px;padding-bottom:40px}
.pk2__sets{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:34px}
.pk2__sets button{display:grid;gap:2px;justify-items:start;padding:14px 12px;border:1.5px solid var(--line);border-radius:10px;text-align:left;transition:.35s var(--ease)}
.pk2__sets button:hover,.pk2__sets button.is-on{border-color:var(--gold);background:rgba(217,178,95,.1)}
.pk2__sets b{font:400 36px/1 var(--serif);font-weight:400;color:var(--gold-hi)}
.pk2__sets span{font:700 10px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--text);line-height:1.3}
.pk2__rows{list-style:none;display:grid;gap:10px}
.pr{display:grid;grid-template-columns:48px 1fr;gap:6px 14px;align-items:center;padding:12px 14px 12px 10px;border:1px solid var(--line);border-radius:14px;background:rgba(246,239,226,.03);transition:border-color .3s,background .3s}
.pr.has{border-color:var(--acc);background:rgba(246,239,226,.06)}
.pr__img img{height:92px;width:auto;margin:0 auto;filter:drop-shadow(0 8px 12px rgba(0,0,0,.5))}
.pr__t b{display:block;font:400 28px/1.05 var(--serif);font-weight:400}
.pr__t span{font-size:13px;color:var(--mute)}
.pr__q{grid-column:2;display:flex;gap:8px;align-items:center}
.pr .qty{height:46px}
.pr__six{height:46px;padding:0 16px;border-radius:999px;border:1.5px solid var(--line);font:700 12px var(--sans);letter-spacing:.1em;color:var(--gold);transition:.25s}
.pr__six:hover{background:var(--gold);color:var(--noir);border-color:var(--gold)}
.pk2__sum{padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--noir2);align-self:start}
.pk2__slots{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;position:relative}
.pk2__slots.is-12{grid-template-columns:repeat(4,1fr)}
.pk2__slots[data-more]:not([data-more=""])::after{content:attr(data-more);position:absolute;right:8px;bottom:8px;padding:6px 10px;border-radius:999px;background:var(--gold);color:var(--noir);font:700 12px var(--sans)}
.pk2__slots .slot{aspect-ratio:1/1.5}
.pk2__total{margin-top:16px;font:400 46px/1 var(--serif)}
.pk2__total b{font-weight:400;color:var(--gold-hi)}
.pk2__total span{font-size:28px}
.pk2__boxes{margin-top:6px;color:var(--text);font-size:15px}
.pk2__list{list-style:none;margin:14px 0 6px;border-top:1px solid var(--line)}
.pk2__list li{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--line);font-size:15px}
.pk2__list li span::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--acc);margin-right:10px}
.pk2__sum .pk__tools{margin:14px 0 18px}
.pk2f{padding:clamp(60px,8vw,110px) 0;background:var(--noir2);border-top:1px solid rgba(217,178,95,.12)}
.pk2__form{display:grid;gap:22px}
.pk2f__head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;align-items:center}
.pk2f__head .pk__step{margin:0}
.pk2f__sum{color:var(--gold-hi);font-size:15px}
.pk2f__grid{display:grid;gap:18px}
.pk2f__end{display:flex;flex-wrap:wrap;gap:16px 26px;align-items:center}
.pk2__form .form__note{text-align:left}
@media (min-width:1000px){
  .pk2{grid-template-columns:1fr 420px;gap:60px;align-items:start}
  .pk2__sum{position:sticky;top:110px}
  .pr{grid-template-columns:60px 1fr auto;padding:12px 16px 12px 12px}
  .pr__q{grid-column:auto}
  .pk2f__grid{grid-template-columns:1fr 1fr}
  .pk2f__wide{grid-column:1/-1}
  .pk2f__end .btn{margin-left:auto}
  .mbar--pk{display:none}
}

/* ---------- awards as cards ---------- */
.msum{list-style:none;display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:34px}
.msum li{display:flex;align-items:center;gap:10px;font:700 12px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--text)}
.msum b{font:400 30px/1 var(--serif);color:var(--cream);letter-spacing:0}
.msum .aw__m{width:24px;height:24px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:24px}
.chip{font:700 11px var(--sans);letter-spacing:.12em;text-transform:uppercase;padding:10px 15px;border-radius:999px;border:1px solid var(--line);color:var(--mute);transition:.3s}
.chip:hover{color:var(--cream)}
.chip.is-on{background:var(--cream);color:var(--noir);border-color:var(--cream)}
.acs{display:grid;gap:10px}
.ac{position:relative;display:grid;grid-template-columns:44px 1fr;grid-template-areas:"m t" "m w" "m e";gap:2px 16px;padding:22px 90px 22px 20px;border-radius:14px;background:radial-gradient(ellipse at 100% 100%,color-mix(in srgb,var(--acc) 22%,transparent),transparent 60%),var(--bg);overflow:hidden;min-height:150px;align-content:center;transition:transform .6s var(--ease)}
a.ac:hover{transform:translateY(-4px)}
.ac__m{grid-area:m;width:44px;height:44px;border-radius:50%;align-self:start}
.ac__t{grid-area:t;font:400 32px/1.05 var(--serif)}
.ac__w{grid-area:w;font:700 11px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--acc)}
.ac__e{grid-area:e;margin-top:8px;font-size:14.5px;color:var(--text);line-height:1.45}
.ac__e small{display:block;color:var(--mute);font-size:12.5px}
.ac__b{position:absolute;right:14px;bottom:-26px;height:160px;width:auto;filter:drop-shadow(0 14px 18px rgba(0,0,0,.5));transition:transform .8s var(--ease)}
a.ac:hover .ac__b{transform:translateY(-8px) rotate(-3deg)}
.ac[hidden]{display:none}
.aw-more{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.sp-awall{padding-bottom:clamp(80px,10vw,140px)}
.sp-awall__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
@media (min-width:700px){.acs{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1000px){.acs--all{grid-template-columns:repeat(3,1fr)}.acs--home{grid-template-columns:repeat(4,1fr);margin-top:56px}.acs--home .ac{padding-right:20px;padding-bottom:120px;grid-template-columns:1fr;grid-template-areas:"m" "t" "w" "e"}.acs--home .ac__m{margin-bottom:14px}.acs--home .ac__b{right:50%;transform:translateX(50%);height:130px;bottom:-40px}.acs--home a.ac:hover .ac__b{transform:translate(50%,-8px)}}
.nagrade .acs--home{margin-top:40px}

/* ---------- homepage on mobile: focus on selling, the crest game lives on desktop ---------- */
@media (max-width:999px){ body:not(.sub) .znak{display:none} }
@media (max-width:699px){
  .top__cta{display:inline-flex;min-height:38px;padding:0 14px;font-size:10.5px}
  .top__lang{display:none}
  .pk2__sets{grid-template-columns:repeat(2,1fr)}
  .sp-wine__info{margin-top:52px}
}

/* ================= round 3 ================= */
/* compact form card (all forms) */
.fx{gap:14px;padding:26px 22px;border-radius:18px;background:linear-gradient(160deg,rgba(246,239,226,.06),rgba(246,239,226,.02));border:1px solid var(--line);max-width:560px;width:100%;justify-self:end}
.fx .f{gap:6px}
.fx .f span{font:700 10.5px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.fx .f input,.fx .f textarea{background:rgba(13,11,9,.55);border:1px solid rgba(246,239,226,.14);border-radius:10px;padding:13px 14px;font-size:16px}
.fx .f input:focus,.fx .f textarea:focus{border-color:var(--gold);background:rgba(13,11,9,.8)}
.fx__2{display:grid;gap:14px}
@media (min-width:560px){.fx__2{grid-template-columns:1fr 1fr}}
.fx__checks{display:flex;flex-wrap:wrap;gap:10px 22px}
.fx .pk__gift{font-size:14px}
.fx .form__type span{padding:10px 6px;font-size:10.5px}
.fx .form__type legend{font-size:10.5px;color:var(--mute);margin-bottom:8px}
.fx .form__note{font-size:12px;text-align:center}
.sp-form__t{font-size:30px}
.sp-qa__grid{align-items:start}

/* paket: order step */
.pk2f__wrap{display:grid;gap:34px;align-items:start}
.pk2f__intro .h-sm{margin:14px 0 18px;padding-bottom:.06em}
.pk2f__intro .h-sm em{color:var(--gold-hi)}
.pk2f__sum{color:var(--gold-hi);font-size:15px;max-width:30em}
.pk2f__how{list-style:none;margin-top:26px;display:grid;gap:12px}
.pk2f__how li{display:flex;gap:14px;align-items:center;color:var(--text);font-size:15.5px}
.pk2f__how b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1px solid var(--line);font:italic 400 16px var(--serif);color:var(--gold);flex:none}
@media (min-width:1000px){.pk2f__wrap{grid-template-columns:1fr 520px;gap:100px}}

/* paket: calmer rows + compact summary */
.pr{padding:10px 14px 10px 10px;border-color:rgba(246,239,226,.1);background:rgba(246,239,226,.025)}
.pr.has{border-color:rgba(217,178,95,.45);background:rgba(217,178,95,.05)}
.pr__img img{height:70px}
.pr__t b{font-size:24px}
.pr__t b::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--acc);margin-right:10px;vertical-align:middle}
.pr .qty,.pr__six{height:42px}
.pr .qty button{width:34px;height:34px}
.pk2__start{display:grid;gap:12px;margin-bottom:30px}
.pk2__sets{grid-template-columns:repeat(3,1fr);margin:0}
.pk2__mult{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pk2__x{font:400 30px var(--serif);color:var(--gold)}
.pk2__mult .qty{height:44px}
.pk2__eq{color:var(--text);font-size:15px}
.pk2__eq b{font:400 24px var(--serif);color:var(--gold-hi)}
.pk2__k{font:700 11px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.pk2__total{margin-top:6px}
.pk2__strip{display:flex;gap:8px;margin:16px 0 4px;min-height:0}
.pk2__s{position:relative;flex:1;max-width:70px;display:grid;justify-items:center;padding:10px 0 6px;border-radius:10px;background:rgba(246,239,226,.04)}
.pk2__s img{height:84px;width:auto;filter:drop-shadow(0 8px 10px rgba(0,0,0,.5))}
.pk2__s b{position:absolute;top:-8px;right:-6px;min-width:26px;height:26px;padding:0 6px;border-radius:999px;background:var(--gold);color:var(--noir);font:700 12px/26px var(--sans);text-align:center}
.pk2__list li{align-items:center}
.ln__q{display:inline-flex;align-items:center;gap:4px}
.ln__q button{width:28px;height:28px;border-radius:50%;border:1px solid var(--line);font:500 15px/1 var(--sans);color:var(--cream)}
.ln__q button:hover{background:var(--cream);color:var(--noir)}
.ln__q b{min-width:30px;text-align:center;font:400 20px var(--serif)}
.ln__q .ln__x{border:0;color:var(--mute);font-size:18px;margin-left:4px}
.ln__q .ln__x:hover{background:none;color:#e2838b}

/* cart drawer */
.drawer{position:fixed;inset:0;z-index:120;visibility:hidden}
.drawer.is-on{visibility:visible}
.drawer__bg{position:absolute;inset:0;background:rgba(0,0,0,.55);opacity:0;transition:opacity .4s}
.drawer.is-on .drawer__bg{opacity:1}
.drawer__p{position:absolute;right:0;top:0;bottom:0;width:min(420px,100vw);background:#15110d;border-left:1px solid var(--line);padding:26px 22px calc(22px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:14px;transform:translateX(100%);transition:transform .55s var(--ease)}
.drawer.is-on .drawer__p{transform:none}
.drawer__h{display:flex;justify-content:space-between;align-items:center}
.drawer__h p{font:400 34px var(--serif)}
.drawer__x{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);font-size:20px}
.drawer__items{list-style:none;flex:1;overflow:auto;border-top:1px solid var(--line)}
.drawer__items li{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.drawer__items img{height:64px;width:auto;margin:0 auto}
.drawer__items .dn{font:400 22px/1.1 var(--serif)}
.drawer__empty{color:var(--mute);padding:20px 0}
.drawer__tot{display:flex;justify-content:space-between;align-items:baseline;font:400 26px var(--serif)}
.drawer__tot small{font:500 14px var(--sans);color:var(--mute)}
.drawer__a{display:grid;gap:8px}

/* wine hero: still bottle, tilt, sheen, cork pop */
.sp-wine__b{border:0;padding:0;background:none;cursor:pointer;perspective:900px;display:block}
.sp-wine__tilt{position:absolute;inset:0;display:block;transform:rotateY(var(--ry,0deg)) rotateZ(var(--rz,0deg));transition:transform .5s var(--ease)}
.sp-wine__bottle{opacity:1!important}
.sp-wine__sheen{position:absolute;left:50%;top:0;height:100%;aspect-ratio:644/2454;transform:translateX(-50%);-webkit-mask:var(--src) center/contain no-repeat;mask:var(--src) center/contain no-repeat;background:linear-gradient(105deg,transparent 35%,rgba(255,250,235,.32) 48%,transparent 60%) 0 0/300% 100%;animation:sheen 6s ease-in-out infinite;pointer-events:none;mix-blend-mode:screen}
@keyframes sheen{0%,55%{background-position:100% 0}100%{background-position:-100% 0}}
.sp-wine__hint{opacity:1;bottom:-28px}
.cork{position:absolute;left:50%;top:-2px;width:5.2%;aspect-ratio:1/1.9;margin-left:-2.6%;border-radius:40% 40% 18% 18%;background:linear-gradient(90deg,#9c7650,#d8b88c 45%,#a17a52);opacity:0;pointer-events:none}
.sp-wine__b.pop .cork{animation:cork 1.3s cubic-bezier(.2,.7,.3,1) forwards}
.sp-wine__b.pop .sp-wine__tilt{animation:shake .45s ease}
@keyframes cork{0%{opacity:1;transform:translate(0,0) rotate(0)}60%{opacity:1}100%{opacity:0;transform:translate(60px,-320px) rotate(540deg)}}
@keyframes shake{20%{transform:rotate(-3deg)}50%{transform:rotate(2.5deg)}80%{transform:rotate(-1deg)}}
.fizz{position:absolute;left:50%;top:0;width:7px;height:7px;border-radius:50%;background:radial-gradient(circle,#fff6d8,var(--acc,#d9b25f));pointer-events:none;animation:fizz 1.4s ease-out forwards;z-index:4}
@keyframes fizz{0%{opacity:1;transform:translate(0,0) scale(.6)}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(1.2)}}

/* simple pages */
.sub--page .h-display[hidden]{display:none}
.sub--page .zemlja,.sub--page .posjet,.sub--page .karta,.sub--page .znak{padding-top:20px}
.sp-cta{padding:clamp(80px,10vw,140px) 0;text-align:center}
.sp-cta__t{font:400 clamp(36px,5vw,64px)/1.05 var(--serif);padding-bottom:.08em}
.sp-cta__b{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:26px}
.sp-cards{display:grid;gap:10px;padding-bottom:40px}
.ccard{display:grid;gap:4px;padding:22px;border:1px solid var(--line);border-radius:14px;transition:border-color .3s}
.ccard:hover{border-color:var(--gold)}
.ccard small{font:700 10.5px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.ccard b{font:400 28px/1.15 var(--serif);font-weight:400;overflow-wrap:anywhere}
@media (min-width:700px){.sp-cards{grid-template-columns:repeat(3,1fr)}}
.tl{padding:clamp(60px,8vw,120px) 0;background:var(--paper);color:var(--paper-text)}
.tl .eyebrow{color:var(--gold-lo)}
.tl__list{list-style:none;display:grid;gap:70px;margin-top:30px}
.tl__i{display:grid;gap:22px;align-items:center}
.tl__i figure{aspect-ratio:3/2;overflow:hidden;border-radius:6px}
.tl__i figure img{width:100%;height:100%;object-fit:cover}
.tl__meta{font:700 12px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#7a6650}
.tl__meta em{font:italic 400 40px/1 var(--serif);color:var(--gold-lo);margin-right:12px;letter-spacing:0}
.tl__i h3{font:400 clamp(38px,5vw,72px)/1.02 var(--serif);margin:6px 0 12px;color:var(--ink);padding-bottom:.06em}
.tl__i p:last-child{color:#4a3d31;max-width:32em}
@media (min-width:1000px){.tl__i{grid-template-columns:1fr 1fr;gap:80px}.tl__i:nth-child(even) figure{order:2}}
.maestro{padding:clamp(80px,10vw,150px) 0}
.maestro__grid{display:grid;gap:40px;align-items:center}
.maestro__img{overflow:hidden;border-radius:6px}
.maestro__p{margin-top:16px;color:var(--text);max-width:34em}
@media (min-width:1000px){.maestro__grid{grid-template-columns:1.1fr 1fr;gap:100px}}
.manifest .sp-sig{margin-top:40px}

/* homepage mobile: focused on wines + buying, secondary sections as cards */
.mcards{display:none}
@media (max-width:999px){
  body:not(.sub) .zemlja,body:not(.sub) .prica,body:not(.sub) .znak,body:not(.sub) .posjet,body:not(.sub) .karta{display:none}
  .mcards{display:block;padding:70px 0 90px}
  .mcards__grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
  .mcard{position:relative;aspect-ratio:3/4;border-radius:12px;overflow:hidden;isolation:isolate}
  .mcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
  .mcard::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(rgba(13,11,9,.05) 30%,rgba(13,11,9,.92))}
  .mcard__t{position:absolute;left:0;right:0;bottom:0;padding:14px;display:grid;gap:4px}
  .mcard b{font:400 28px/1 var(--serif);font-weight:400}
  .mcard span span{font-size:13px;line-height:1.35;color:var(--text)}
  .mcard i{font:700 10px var(--sans);font-style:normal;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-top:4px}
  body:not(.sub) .vina__nav{display:none}
}

@media (min-width:1000px){.sp-wine__info{pointer-events:none}.sp-wine__l,.sp-wine__r{pointer-events:auto}.sp-wine__b{z-index:4}}


/* ================= final polish ================= */
/* wine pages: colour lives in the hero only, everything else is the gold system */
.sub--wine{background:var(--noir)}
.sp-wine::after{content:"";position:absolute;left:0;right:0;bottom:0;height:26%;background:linear-gradient(transparent,var(--noir));pointer-events:none;z-index:1}
.sub--wine .sp-song,.sub--wine .sp-about,.sub--wine .sp-aw,.sub--wine .sp-more{background:var(--noir)}
.sub--wine .sp-aw{padding:0 0 clamp(80px,10vw,140px)}
.sub--wine .sp-qa{background:var(--noir2)}
.sp-sig{color:var(--gold)}
.sp-sig mask path{stroke-dasharray:1;stroke-dashoffset:1}
.sp-sig.is-drawn mask path{stroke-dashoffset:0}
.sp-wine__note{margin-top:14px;font-size:13px;color:var(--mute)}
.sp-wine__note a{color:var(--cream);border-bottom:1px solid currentColor}
@view-transition{navigation:auto}
::view-transition-old(root){animation:.3s ease both vt-out}
::view-transition-new(root){animation:.5s cubic-bezier(.19,1,.22,1) both vt-in}
@keyframes vt-out{to{opacity:0}}
@keyframes vt-in{from{opacity:0;transform:translateY(12px)}}

/* box builder (homepage + Složi paket) */
.bld .pk__right{display:grid;gap:14px;align-content:start}
.bld .crate{position:relative}
.crate__x{margin-left:auto;padding:5px 12px;border-radius:999px;background:var(--gold);color:var(--noir);font:700 13px var(--sans);letter-spacing:.04em}
.bld__fill{font-size:15px;color:var(--text);min-height:1.6em}
.bld__boxes{padding-top:16px;border-top:1px solid var(--line)}
.bld__boxes .pk__step{margin-bottom:12px}
.bld__row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.bld__chips{display:flex;gap:6px}
.bld__chips button{height:44px;padding:0 16px;border-radius:999px;border:1.5px solid var(--line);font:700 12px var(--sans);letter-spacing:.06em;color:var(--text);transition:.25s}
.bld__chips button:hover{border-color:var(--gold);color:var(--cream)}
.bld__chips button.is-on{background:var(--gold);border-color:var(--gold);color:var(--noir)}
.bld__total{padding:16px 18px;border-radius:12px;background:rgba(217,178,95,.08);border:1px solid rgba(217,178,95,.3)}
.bld__total p{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.bld__eq{font:700 11.5px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--text)}
.bld__total b{font:400 40px/1 var(--serif);font-weight:400}
.bld__total b em{font-style:normal;color:var(--gold-hi)}
.bld__total b small{font:500 14px var(--sans);color:var(--text);margin-left:4px}
.bld__go.is-off{opacity:.45}
.bld .form__note{text-align:center}
.paket .wrap>.bld{margin-top:56px}
.sp-builder{padding:10px 0 clamp(70px,9vw,120px)}
.sp-builder .wrap>.bld{margin-top:10px}
.pk2f__call{margin-top:22px;color:var(--text);font-size:15px}
.pk2f__call a{color:var(--gold-hi);border-bottom:1px solid currentColor}
.pk2f__sum b{font-weight:600}

/* FAQ without a second form */
.sp-faq{padding:clamp(80px,10vw,140px) 0;border-top:1px solid rgba(217,178,95,.12)}
.sp-faq__grid{display:grid;gap:26px}
.sp-faq .faq{padding:0;max-width:none}
@media (min-width:1000px){.sp-faq__grid{grid-template-columns:.8fr 1.2fr;gap:100px;align-items:start}}

/* contact: form first */
.kt{padding:calc(120px + env(safe-area-inset-top)) 0 clamp(60px,8vw,110px);background:radial-gradient(ellipse at 80% 0%,#241b11,var(--noir) 60%)}
.kt__grid{display:grid;gap:40px;align-items:start}
.kt__h{font-size:clamp(54px,8vw,110px);padding-bottom:.08em}
.kt .lead{margin-top:20px}
.kt__list{list-style:none;margin-top:30px;border-top:1px solid var(--line)}
.kt__list li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:15px 0;border-bottom:1px solid var(--line)}
.kt__list small{font:700 10.5px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.kt__list a{font:400 24px/1.2 var(--serif);text-align:right;overflow-wrap:anywhere}
.kt__list a:hover{color:var(--gold-hi)}
.kt .fx{justify-self:stretch;max-width:none}
@media (min-width:1000px){.kt__grid{grid-template-columns:1fr 500px;gap:90px}.kt .fx{justify-self:end}}
.kt-map{padding:clamp(60px,8vw,110px) 0 0}
.kt-map .karta{padding:0;background:none}
.kt-map .map svg{max-height:560px}

/* closing CTA with the five bottles */
.sp-cta__row{display:flex;justify-content:center;align-items:flex-end;gap:clamp(6px,2vw,22px);margin-bottom:30px}
.sp-cta__row img{height:clamp(120px,18vw,220px);width:auto;filter:drop-shadow(0 18px 22px rgba(0,0,0,.5));transition:transform .7s var(--ease)}
.sp-cta__row a:hover img{transform:translateY(-10px)}

/* mobile menu */
.top__burger{display:none;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);place-content:center;gap:5px;margin-left:4px}
.top__burger i{display:block;width:16px;height:1.5px;background:var(--cream);transition:transform .45s var(--ease)}
.top__burger[aria-expanded=true] i:first-child{transform:translateY(3.25px) rotate(45deg)}
.top__burger[aria-expanded=true] i:last-child{transform:translateY(-3.25px) rotate(-45deg)}
.mnav{position:fixed;inset:0;z-index:49;background:rgba(13,11,9,.97);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);padding:calc(90px + env(safe-area-inset-top)) var(--pad) calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:22px;overflow:auto;opacity:0;transition:opacity .4s var(--ease)}
.mnav.is-on{opacity:1}
.mnav__list{list-style:none}
.mnav__list>li>a{display:block;padding:8px 0;font:400 38px/1.1 var(--serif);border-bottom:1px solid rgba(246,239,226,.08)}
.mnav__wines{display:flex;flex-wrap:wrap;gap:6px;padding:12px 0 6px}
.mnav__w{padding:8px 13px;border-radius:999px;border:1px solid var(--line);font:700 10.5px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--text)}
.mnav__foot{margin-top:auto;display:grid;gap:10px;font-size:15px;color:var(--text)}
body.mnav-open{overflow:hidden}
body.mnav-open .top{background:rgba(13,11,9,.97)}

/* ---------- mobile ---------- */
@media (max-width:999px){
  .top__burger{display:grid}
  body:not(.sub) .pill,body:not(.sub) .buyfab{display:none}
  /* hero: crest and copy in the flow, never overlapping */
  body:not(.sub) .hero{justify-content:center;padding-top:calc(78px + env(safe-area-inset-top));padding-bottom:40px;gap:22px}
  body:not(.sub) .hero__seal{position:relative;top:auto;width:min(52vw,26svh);flex:none}
  body:not(.sub) .hero__copy .eyebrow{font-size:10.5px;letter-spacing:.18em}
}
@media (max-width:699px){
  .top__cta{display:inline-flex;min-height:38px;padding:0 14px;font-size:10.5px}
  .top__lang{display:none}
  .sp-cta__row img{height:110px}
  .bld__chips button{padding:0 13px}
}

/* ================= last round ================= */
/* paper theme: the light "sedam poglavlja" feeling, reused where it helps reading */
.is-paper{background:var(--paper);color:var(--paper-text)}
.is-paper .h-display,.is-paper .h-sm,.is-paper .sp-h,.is-paper .sp-form__t,.is-paper .pk__step,.is-paper .sp-specs dd,.is-paper .sp-pair li{color:var(--ink)}
.is-paper .h-display em,.is-paper .h-sm em,.is-paper .sp-h em{color:var(--gold-lo)}
.is-paper .h-display strong{color:var(--gold-lo)}
.is-paper .eyebrow,.is-paper .sp-k{color:var(--gold-lo)}
.is-paper .lead,.is-paper .sp-about__txt p,.is-paper .faq p,.is-paper .pk2f__how li,.is-paper .pk2f__call,.is-paper .maestro__p{color:#4a3d31}
.is-paper .sp-specs dt{color:#8a7356}
.is-paper .sp-specs,.is-paper .sp-specs div,.is-paper .sp-pair,.is-paper .sp-pair li,.is-paper .faq details{border-color:rgba(42,33,25,.16)}
.is-paper .faq summary{color:var(--ink)}
.is-paper .faq summary::after{color:var(--gold-lo)}
.is-paper .btn--line{border-color:rgba(42,33,25,.35);color:var(--ink)}
.is-paper .btn--line:hover{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.is-paper .chip{border-color:rgba(42,33,25,.2);color:#6b5a47}
.is-paper .chip.is-on{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.is-paper .chip:hover{color:var(--ink)}
.is-paper .pk2f__how b{border-color:rgba(42,33,25,.2);color:var(--gold-lo)}
.is-paper .pk2f__call a{color:var(--gold-lo)}
.is-paper .fx{background:#fbf6ec;border-color:rgba(42,33,25,.12);box-shadow:0 30px 70px rgba(42,33,25,.12)}
.is-paper .fx .f span,.is-paper .form__type legend{color:#7a6650}
.is-paper .fx .f input,.is-paper .fx .f textarea{background:#fff;border-color:rgba(42,33,25,.16);color:var(--ink);color-scheme:light}
.is-paper .fx .f input::placeholder,.is-paper .fx .f textarea::placeholder{color:rgba(42,33,25,.38)}
.is-paper .fx .f input:focus,.is-paper .fx .f textarea:focus{border-color:var(--gold-lo);background:#fff}
.is-paper .form__type span{border-color:rgba(42,33,25,.2);color:var(--ink)}
.is-paper .form__type input:checked+span{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.is-paper .pk__gift{color:#4a3d31}
.is-paper .pk__gift input{accent-color:var(--gold-lo)}
.is-paper .form__note,.is-paper .form__ok{color:#7a6650}
.ac{color:var(--cream)}
.nagrade.is-paper .aw-more{margin-top:34px}
.sp-aw.is-paper{padding:0 0 clamp(80px,10vw,140px)}
.sub--wine .sp-about.is-paper{padding-top:clamp(80px,10vw,140px)}
.sp-awall.is-paper{padding:clamp(56px,7vw,100px) 0 clamp(80px,10vw,140px)}
.sp-qa.is-paper,.sp-faq.is-paper{border-top:0}
.pk2f.is-paper{border-top:0}
.tl.is-paper .eyebrow{color:var(--gold-lo)}

/* signature: a signature, not a banner */
.sp-sig{width:min(64vw,270px);margin:30px auto 0;color:var(--gold)}
.sp-sig svg{display:block;width:100%;height:auto}

/* Priča: no dead space */
.sp-manifest{padding:10px var(--pad) clamp(70px,9vw,120px)}
.sp-manifest .manifest__text{font-size:clamp(30px,4.4vw,62px)}

/* homepage: smoother colour flow between sections */
.manifest{padding-top:clamp(70px,9vw,130px)}
.manifest .vez{margin-bottom:40px}
body:not(.sub) .manifest{background:linear-gradient(var(--noir) 62%,#1c2614)}
body:not(.sub) .zemlja{background:linear-gradient(#2a1c10,#17120d 30%,#1c160f)}
.mcards{background:linear-gradient(#2a1c10,var(--noir) 40%)}
body.in-hero .pill{opacity:0;transform:translate(-50%,130%);pointer-events:none}

/* desktop hero: copy left, the seal right. Mobile stays exactly as it is. */
@media (min-width:1000px){
  body:not(.sub) .hero{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;justify-content:normal;column-gap:clamp(30px,4vw,80px);padding:calc(96px + env(safe-area-inset-top)) var(--pad) 70px;min-height:max(100svh,700px)}
  body:not(.sub) .hero::before{background:radial-gradient(ellipse 46% 60% at 74% 50%,rgba(13,11,9,0),rgba(13,11,9,.86) 72%),linear-gradient(rgba(13,11,9,.55),rgba(13,11,9,0) 25%,rgba(13,11,9,.35) 60%,var(--noir))}
  body:not(.sub) .hero__seal{position:relative;top:auto;left:auto;right:auto;grid-column:2;grid-row:1;width:min(40vw,64svh,600px);margin:0 auto}
  body:not(.sub) .hero__copy{grid-column:1;grid-row:1;text-align:left;max-width:640px;justify-self:start}
  body:not(.sub) .hero__copy .eyebrow{justify-content:flex-start}
  body:not(.sub) .hero__copy .eyebrow::before{display:block}
  body:not(.sub) .hero__title{font-size:clamp(70px,6.6vw,118px)}
  body:not(.sub) .hero__sub{margin:22px 0 0;max-width:27em}
  body:not(.sub) .hero__cta{justify-content:flex-start;margin-top:34px}
  body:not(.sub) .hero__hint{left:auto;right:var(--pad);top:auto;bottom:32px;writing-mode:horizontal-tb;width:calc(47.5% - var(--pad));text-align:center}
}

/* order summary next to the order form */
.ordr{margin-top:24px;padding:18px 18px 16px;border-radius:14px;background:#fbf6ec;border:1px solid rgba(42,33,25,.12);max-width:440px}
.ordr__head{display:flex;justify-content:space-between;align-items:baseline;font:700 11px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#7a6650;margin-bottom:8px}
.ordr__head a{color:var(--gold-lo);border-bottom:1px solid currentColor}
.ordr__list{list-style:none}
.ordr__list li{display:grid;grid-template-columns:30px 1fr auto;gap:12px;align-items:center;padding:8px 0;border-bottom:1px solid rgba(42,33,25,.1)}
.ordr__list img{height:52px;width:auto;margin:0 auto}
.ordr__list span{font:400 22px/1.1 var(--serif);color:var(--ink)}
.ordr__list b{font:600 15px var(--sans);color:var(--ink)}
.ordr__tot{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding-top:12px;font-size:14px;color:#4a3d31}
.ordr__tot b{font:400 30px/1 var(--serif);color:var(--ink)}
.ordr__empty{display:flex;justify-content:space-between;align-items:center;gap:12px;color:#4a3d31}

/* closing CTA: the bottles sing */
.sp-cta{position:relative;overflow:hidden;--tint:#1c2614;--acc:#b9cf7c;transition:background .9s var(--ease)}
.sp-cta::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 55% 70% at 50% 40%,var(--tint),transparent 72%);opacity:.9;transition:background .9s var(--ease);pointer-events:none}
.sp-cta .wrap{position:relative}
.sp-cta__row a{position:relative;display:grid;justify-items:center;gap:10px;opacity:.55;transition:opacity .5s,transform .7s var(--ease)}
.sp-cta__row a span{font:700 9.5px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mute);opacity:0;transition:opacity .4s}
.sp-cta__row a.is-on{opacity:1;transform:translateY(-8px)}
.sp-cta__row a.is-on span{opacity:1;color:var(--acc)}
.sp-cta__ly{min-height:3.2em;margin:14px auto 0;max-width:34em;font:italic 400 clamp(19px,2vw,25px)/1.4 var(--serif);color:var(--text)}
.sp-cta__ly em{display:block;font:700 10.5px var(--sans);font-style:normal;letter-spacing:.2em;text-transform:uppercase;color:var(--acc);margin-bottom:6px}
.sub--wine .sp-about.is-paper,.sub--wine .sp-aw.is-paper,.sub--wine .sp-qa.is-paper,.sub .sp-qa.is-paper,.sub .sp-faq.is-paper{background:var(--paper)}
.sub--wine .is-paper .h-display em{color:var(--gold-lo)}
/* Priča intro: editorial, aligned with the title */
.sp-head:has(+ .sp-manifest){padding-bottom:26px}
.sp-manifest{text-align:left;max-width:var(--maxw);margin:0 auto;padding:0 var(--pad) clamp(70px,9vw,120px)}
.sp-manifest .manifest__text{margin:0;max-width:21em;font-size:clamp(28px,3.6vw,50px);line-height:1.12}
.sp-manifest .sp-sig{margin:28px 0 0}
.wc .wine__type{padding-right:40px}

/* ================= v5 proposal ================= */
/* hero back to the approved centred layout, no hint text */
@media (min-width:1000px){
  body:not(.sub) .hero{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:0 var(--pad) 9svh;min-height:100svh}
  body:not(.sub) .hero::before{background:radial-gradient(ellipse 60% 50% at 50% 34%,rgba(13,11,9,0),rgba(13,11,9,.88) 75%),linear-gradient(rgba(13,11,9,.55),rgba(13,11,9,0) 25%,rgba(13,11,9,.35) 60%,var(--noir))}
  body:not(.sub) .hero__seal{position:absolute;left:0;right:0;margin:0 auto;top:max(96px,10svh);width:min(33svh,420px)}
  body:not(.sub) .hero__copy{text-align:center;max-width:1100px;justify-self:auto}
  body:not(.sub) .hero__copy .eyebrow{justify-content:center}
  body:not(.sub) .hero__copy .eyebrow::before{display:none}
  body:not(.sub) .hero__title{font-size:min(8.4vw,11.2svh)}
  body:not(.sub) .hero__sub{margin:20px auto 0}
  body:not(.sub) .hero__cta{justify-content:center}
}
.hero__hint{display:none!important}
/* homepage flow: wines -> box -> awards (light) -> land */
body:not(.sub) .paket{background:linear-gradient(#2a1c10,var(--noir) 22%)}
body:not(.sub) .zemlja{background:linear-gradient(var(--noir),#17120d 40%,#1c160f)}
.mcards{background:var(--noir)}
/* awards cards: bottles shown whole */
.acs--home .ac__b,.ac__b{bottom:12px}
@media (min-width:1000px){.acs--home .ac{padding-bottom:170px}.acs--home .ac__b{height:140px;bottom:14px}}
.ac{padding-bottom:28px}
/* closing CTA: name only in the lyric line */
.sp-cta__row a span{display:none}
/* compact footer */
.foot{padding:56px var(--pad) calc(36px + env(safe-area-inset-bottom))}
.foot__branch{max-width:760px;margin:-10px auto 6px}
.foot__crest{width:64px;margin-bottom:14px}
.foot__word{font-size:clamp(40px,7vw,96px)}
.foot__sig{font-size:clamp(24px,3vw,36px);margin:6px 0 34px}
.foot__cols{margin-bottom:30px;gap:22px}
.foot .vez{margin-bottom:16px}

/* comparison page */
.cmp-k{padding:24px var(--pad);font:700 12px var(--sans);letter-spacing:.2em;text-transform:uppercase;text-align:center;background:#000;color:var(--gold)}
.sp-cta--light{background:var(--paper);color:var(--ink)}
.sp-cta--light::before{background:radial-gradient(ellipse 55% 70% at 50% 40%,color-mix(in srgb,var(--acc) 30%,transparent),transparent 72%);opacity:.55}
.sp-cta--light .sp-cta__t{color:var(--ink)}
.sp-cta--light .sp-cta__ly{color:#4a3d31}
.sp-cta--light .sp-cta__ly em{color:var(--gold-lo)}
.sp-cta--light .sp-cta__row img{filter:drop-shadow(0 18px 22px rgba(42,33,25,.3))}
.sp-cta--light .btn--line{border-color:rgba(42,33,25,.35);color:var(--ink)}
/* wine scene: text always starts at the same height, clear of the title */
@media (min-width:1000px){ .vina .wine{align-items:start;padding-top:calc(150px + min(13.5vw,207px))} }

/* ================= v5.1 ================= */
/* dropdown always readable, also over light sections */
.top__nav .dd__menu a,.top.is-light .top__nav .dd__menu a{color:var(--cream)}
.top__nav .dd__menu a:hover{color:var(--gold-hi)}
/* the chapter pill is gone on the homepage: the top navigation does that job */
body:not(.sub) .pill{display:none}
/* one dark tone: no brown/black seams between dark sections */
body:not(.sub) .zemlja,body:not(.sub) .posjet,body:not(.sub) .karta{background:var(--noir)}
body:not(.sub) .paket{background:radial-gradient(ellipse 60% 50% at 80% 30%,rgba(217,178,95,.07),transparent 60%),linear-gradient(#2a1c10,var(--noir) 140px)}
body:not(.sub) .paket.is-paper{background:var(--paper)}
.sub .sp-builder,.sub .pk2f{background:var(--noir)}
.sub .sp-builder.is-paper,.sub .pk2f.is-paper{background:var(--paper)}

/* box builder: one screen, no scrolling up and down */
.paket{padding:clamp(70px,8vw,110px) 0}
.paket .h-display{font-size:clamp(46px,6vw,92px)}
.paket .lead{margin-top:16px}
.paket .wrap>.bld{margin-top:34px}
.bld .pk__sizes{margin-bottom:18px;gap:8px}
.bld .pk__size{padding:10px 12px;grid-template-columns:auto 1fr;column-gap:10px;align-items:baseline}
.bld .pk__size b{font-size:32px;grid-row:span 2}
.bld .pk__size small{margin:0}
.bld .pk__step{margin-bottom:10px}
.bld .pk__wines{gap:6px}
.bld .pkw{padding:6px 10px 6px 6px;grid-template-columns:36px 1fr auto}
.bld .pkw img{height:56px}
.bld .pkw b{font-size:22px}
.bld .pkw span{font-size:12.5px}
.bld .pkw__q button{width:34px;height:34px;font-size:18px}
.bld .pkw__q output{font-size:22px;min-width:24px}
.bld .pk__tools{margin-top:12px}
.bld .crate{padding:12px}
.bld .crate__lid{margin-bottom:8px}
.bld .crate__slots{gap:6px}
.bld .slot{aspect-ratio:1/1.25}
.bld .crate[data-size="12"] .slot{aspect-ratio:1/1.35}
.bld .pk__right{gap:10px}
.bld .bld__boxes{padding-top:12px}
.bld .bld__total{padding:12px 16px}
.bld .bld__total b{font-size:34px}
@media (min-width:1000px){
  .bld{grid-template-columns:1fr minmax(360px,420px)!important;gap:56px!important;align-items:start}
  .bld .pk__right{position:static}
}

/* light builder (theme A) */
.is-paper .pk__step{color:var(--ink)}
.is-paper .pk__size{border-color:rgba(42,33,25,.16);background:#fbf6ec}
.is-paper .pk__size b{color:var(--ink)}
.is-paper .pk__size span,.is-paper .pk__size small{color:#6b5a47}
.is-paper .pk__size.is-on{border-color:var(--gold-lo);background:#f6ead2}
.is-paper .pk__size.is-on b{color:var(--gold-lo)}
.is-paper .pkw{border-color:rgba(42,33,25,.12);background:#fbf6ec}
.is-paper .pkw.has{border-color:var(--gold-lo);background:#f8eedb}
.is-paper .pkw b{color:var(--ink)}
.is-paper .pkw span{color:#7a6650}
.is-paper .pkw__q button,.is-paper .qty button{border-color:rgba(42,33,25,.22);color:var(--ink)}
.is-paper .pkw__q button:hover:not(:disabled),.is-paper .qty button:hover:not(:disabled){background:var(--ink);color:var(--paper);border-color:var(--ink)}
.is-paper .pkw__q output,.is-paper .qty input{color:var(--ink)}
.is-paper .qty{border-color:rgba(42,33,25,.22)}
.is-paper .pk__tools button{color:var(--gold-lo)}
.is-paper .pk__tools .pk__reset{color:#7a6650}
.is-paper .bld__fill{color:#4a3d31}
.is-paper .bld__boxes{border-color:rgba(42,33,25,.14)}
.is-paper .bld__chips button{border-color:rgba(42,33,25,.2);color:var(--ink)}
.is-paper .bld__chips button.is-on{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.is-paper .bld__total{background:#f6ead2;border-color:rgba(154,116,49,.35)}
.is-paper .bld__eq,.is-paper .bld__total b small{color:#6b5a47}
.is-paper .bld__total b{color:var(--ink)}
.is-paper .bld__total b em{color:var(--gold-lo)}
/* light visit + map (homepage) */
.posjet.is-paper .buy li{border-color:rgba(42,33,25,.14)}
.posjet.is-paper .buy strong{color:var(--ink)}
.posjet.is-paper .buy span{color:#4a3d31}
.posjet.is-paper .buy h3{color:var(--gold-lo)}
.posjet.is-paper .form{background:#fbf6ec;border-color:rgba(42,33,25,.12);box-shadow:0 30px 70px rgba(42,33,25,.1)}
.posjet.is-paper .form__type legend{color:var(--gold-lo)}
.posjet.is-paper .form__type span{border-color:rgba(42,33,25,.2);color:var(--ink)}
.posjet.is-paper .form__type input:checked+span{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.posjet.is-paper .f span{color:#7a6650}
.posjet.is-paper .f input,.posjet.is-paper .f textarea{color:var(--ink);border-color:rgba(42,33,25,.25);color-scheme:light}
.posjet.is-paper .form__note{color:#7a6650}
.karta.is-paper .h-display{color:var(--ink)}
.karta.is-paper .map__card{box-shadow:0 30px 60px rgba(42,33,25,.18)}
.karta.is-paper .faq summary{color:var(--ink)}

/* theme switcher (proposal only) */
.varsw{position:fixed;left:14px;bottom:14px;z-index:90;display:flex;gap:4px;padding:5px;border-radius:999px;background:rgba(13,11,9,.85);border:1px solid var(--line);backdrop-filter:blur(10px)}
.varsw a{padding:8px 14px;border-radius:999px;font:700 11px var(--sans);letter-spacing:.12em;color:var(--mute)}
.varsw a.is-on{background:var(--gold);color:var(--noir)}
body:not(.sub) .posjet.is-paper,body:not(.sub) .karta.is-paper,body:not(.sub) .nagrade.is-paper{background:var(--paper)}
.posjet.is-paper .lead{color:#4a3d31}
.karta.is-paper .map svg{box-shadow:0 30px 60px rgba(42,33,25,.18)}

/* ================= final: dark, seamless ================= */
.varsw{display:none}
body:not(.sub) .manifest{background:var(--noir)}
body:not(.sub) .paket{background:radial-gradient(ellipse 60% 50% at 80% 30%,rgba(217,178,95,.06),transparent 60%),var(--noir)}
body:not(.sub) .nagrade{background:var(--noir)}
/* the wine stage melts into the page above and below: no visible edge */
.vina__stage::before,.vina__stage::after{content:"";position:absolute;left:0;right:0;z-index:1;pointer-events:none}
.vina__stage::before{top:0;height:min(22vh,180px);background:linear-gradient(var(--noir),transparent)}
.vina__stage::after{bottom:0;height:min(20vh,160px);background:linear-gradient(transparent,var(--noir))}
.vina__title,.vina__info,.vina__nav,.vina__pour{z-index:3}
.sp-wine::before{content:"";position:absolute;left:0;right:0;top:0;height:160px;background:linear-gradient(var(--noir),transparent);pointer-events:none;z-index:1}
/* light sections fade in and out softly instead of a hard line */
.is-paper{position:relative}
.is-paper::before,.is-paper::after{content:"";position:absolute;left:0;right:0;height:90px;pointer-events:none;z-index:0}
.is-paper::before{top:0;background:linear-gradient(rgba(13,11,9,.16),transparent)}
.is-paper::after{bottom:0;background:linear-gradient(transparent,rgba(13,11,9,.1))}
.is-paper>*{position:relative;z-index:1}
/* award cards: the bottle sits fully inside the card */
.ac{padding-right:110px;min-height:170px}
.ac .ac__b,.acs--home .ac .ac__b{position:absolute;top:16px;bottom:16px;right:22px;left:auto;height:calc(100% - 32px);width:auto;transform:none}
a.ac:hover .ac__b,.acs--home a.ac:hover .ac__b{transform:translateY(-4px)}
@media (min-width:1000px){
  .acs--home .ac{padding:22px 20px 22px 20px;padding-right:96px;min-height:230px;grid-template-columns:1fr;grid-template-areas:"m" "t" "w" "e"}
}
.m-mtn,.m-mtn--2{fill:url(#mtnfade);stroke:none}
.kt-map{padding-bottom:clamp(80px,10vw,130px)}
.kt-map .karta{padding-bottom:0}

/* ================= final rhythm ================= */
:root{--sp:clamp(72px,8vw,124px);--warm:#18130e}
/* warm bands: tone shifts that fade in and out, never a line */
.band{background:linear-gradient(var(--noir),var(--warm) 22%,var(--warm) 78%,var(--noir))!important}
body:not(.sub) .nagrade.band,body:not(.sub) .posjet.band{background:linear-gradient(var(--noir),var(--warm) 22%,var(--warm) 78%,var(--noir))!important}
/* one vertical rhythm on the homepage */
body:not(.sub) .manifest{padding:calc(var(--sp) * .6) var(--pad) var(--sp)}
body:not(.sub) .manifest .vez{margin-bottom:34px}
body:not(.sub) .paket,body:not(.sub) .nagrade{padding:var(--sp) 0}
body:not(.sub) .zemlja{padding:var(--sp) 0;background:var(--noir)}
body:not(.sub) .zemlja .terrain{margin-top:24px}
body:not(.sub) .zemlja__photos{padding-top:48px}
body:not(.sub) .posjet{padding:var(--sp) 0}
body:not(.sub) .posjet__grid{margin-top:56px}
body:not(.sub) .karta{padding:var(--sp) 0 0;background:var(--noir)}
body:not(.sub) .karta .faq{padding-top:var(--sp);padding-bottom:var(--sp)}
@media (min-width:1000px){ body:not(.sub) .hero{padding-bottom:7svh} }
/* subpages: same rhythm */
.sub .sp-song,.sub .sp-about,.sub .sp-qa,.sub .sp-faq,.sub .sp-more,.sub .sp-cta,.sub .maestro,.sub .tl,.sub .pk2f,.sub .sp-awall{padding-top:var(--sp);padding-bottom:var(--sp)}
.sub .sp-aw{padding:0 0 var(--sp)}
.sub .sp-head{padding-bottom:calc(var(--sp) * .5)}
.sub .sp-head--tight{padding-bottom:28px}
.sub .sp-builder{padding:0 0 var(--sp)!important}
.sub .sp-builder .wrap>.bld{margin-top:0}
.sub .zemlja,.sub .posjet,.sub .znak,.sub .karta{padding-top:0;padding-bottom:var(--sp)}
.sub .zemlja__photos{padding-top:48px}
.sub .posjet__grid{margin-top:56px}
/* order summary on dark */
.ordr{background:rgba(246,239,226,.045);border-color:var(--line)}
.ordr__head{color:var(--mute)}
.ordr__head a{color:var(--gold)}
.ordr__list li{border-color:var(--line)}
.ordr__list span,.ordr__list b,.ordr__tot b{color:var(--cream)}
.ordr__tot,.ordr__empty{color:var(--text)}
/* contact: compact, all in the warm dark tone */
.kt{padding-bottom:calc(var(--sp) * .6)}
.kt__grid{max-width:1180px;margin:0 auto}
@media (min-width:1000px){.kt__grid{grid-template-columns:minmax(0,520px) 480px;justify-content:space-between}}
.kt__list a{font-size:22px}
.kt-map{padding:0 0 var(--sp)}
.kt-map .wrap>.eyebrow{margin-bottom:18px}
.kt-map .map{max-width:1180px}
.kt-map .map svg{max-height:440px}
/* the wine glow follows the bottle */
.vina__glow{background:radial-gradient(ellipse 30% 42% at 50% var(--gy,58%),rgba(255,240,200,.13),transparent 70%),radial-gradient(ellipse at 50% 120%,rgba(0,0,0,.55),transparent 60%);opacity:var(--go,1);transition:opacity .2s}

/* ================= clear section rhythm ================= */
:root{--alt:#19140f}
/* sections alternate between two clear tones; each one reads as its own block */
body:not(.sub) .paket{background:var(--noir)!important}
body:not(.sub) .nagrade.band{background:var(--alt)!important}
body:not(.sub) .zemlja{background:var(--noir)!important;padding-bottom:var(--sp)}
body:not(.sub) .zemlja__photos{padding-bottom:0}
body:not(.sub) .posjet.band{background:var(--alt)!important;padding-top:var(--sp)}
body:not(.sub) .karta{background:var(--noir)!important;overflow:hidden}
body:not(.sub) .karta .faq{position:relative;margin-top:var(--sp);padding-top:var(--sp);padding-bottom:var(--sp)}
body:not(.sub) .karta .faq::before{content:"";position:absolute;top:0;bottom:0;left:-100vw;right:-100vw;background:var(--alt);z-index:-1}
body:not(.sub) .karta{isolation:isolate;padding-bottom:0}
.band{background:var(--alt)!important}
.sub .sp-qa.band,.sub .sp-faq.band{background:var(--alt)!important}
.sub .sp-about.band{background:var(--noir)!important}
/* a fine gold rule marks where a section begins */
body:not(.sub) .nagrade,body:not(.sub) .zemlja,body:not(.sub) .posjet,body:not(.sub) .karta,.sub .band,.sub .sp-more,.sub .sp-cta{border-top:1px solid rgba(217,178,95,.14)}
.sp-wine__sheen{display:none}
/* light sweep over the bottle itself (masked to the bottle shape, moves with it) */
.sp-wine__shine{position:absolute;inset:0;pointer-events:none;-webkit-mask:var(--src) center/contain no-repeat;mask:var(--src) center/contain no-repeat;background:linear-gradient(105deg,transparent 38%,rgba(255,248,230,.38) 50%,transparent 62%) 0 0/300% 100% no-repeat;animation:shine 5.5s ease-in-out infinite;mix-blend-mode:screen}
@keyframes shine{0%,50%{background-position:120% 0}100%{background-position:-20% 0}}
.sp-wine__wrap{position:absolute;left:50%;top:0;height:100%;transform:translateX(-50%);display:block}
.sp-wine__wrap .sp-wine__bottle{position:static;transform:none;height:100%;width:auto;display:block}
.sp-wine__wrap .sp-wine__shine{inset:0;-webkit-mask-size:100% 100%;mask-size:100% 100%}
.sub .sp-aw{padding:var(--sp) 0!important}
.sub .znak{padding-top:var(--sp)!important;border-top:1px solid rgba(217,178,95,.14)}
.sub .posjet.band{background:var(--noir)!important;border-top:0;padding-top:0}
.sub .posjet__media{padding-top:0}

/* ================= katalog ================= */
.kat{padding:calc(110px + env(safe-area-inset-top)) 0 var(--sp);background:radial-gradient(ellipse 60% 50% at 50% 55%,rgba(217,178,95,.08),transparent 70%),var(--noir)}
.kat__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:34px}
.kat__h{font-size:clamp(46px,6vw,88px);padding-bottom:.08em}
.kat__actions{display:flex;flex-wrap:wrap;gap:10px}
.kat__sz{font-weight:600;opacity:.6;margin-left:8px;letter-spacing:.08em}
.kat__stage{position:relative;max-width:1240px;margin:0 auto;padding:0 64px}
.kat__book{margin:0 auto;filter:drop-shadow(0 30px 50px rgba(0,0,0,.55))}
.kat__nav{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;border:1px solid var(--line);color:var(--gold);font-size:18px;background:rgba(13,11,9,.6);z-index:5;transition:.3s}
.kat__nav:hover{background:var(--gold);color:var(--noir)}
.kat__nav--p{left:8px}.kat__nav--n{right:8px}
.kat__bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;margin-top:26px;min-height:46px}
.kat__pg{font:400 26px var(--serif);color:var(--mute)}.kat__pg b{font-weight:400;color:var(--cream)}
.kat__wine{display:flex;align-items:center;gap:16px;padding:6px 6px 6px 18px;border:1px solid var(--line);border-radius:999px}
.kat__wn{font:400 22px var(--serif)}
.kat__hint{font:600 10.5px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--mute)}
.kat__thumbs{display:flex;gap:8px;overflow-x:auto;padding:18px 0 6px;scrollbar-width:thin}
.kat__thumbs button{flex:none;display:grid;gap:6px;justify-items:center;opacity:.5;transition:opacity .3s}
.kat__thumbs button:hover,.kat__thumbs button.is-on{opacity:1}
.kat__thumbs img{width:62px;height:auto;border-radius:3px;border:1px solid transparent}
.kat__thumbs button.is-on img{border-color:var(--gold)}
.kat__thumbs span{font:600 10px var(--sans);color:var(--mute)}
.kat.is-fs{padding-top:24px;overflow:auto}
.kat.is-fs .kat__head{margin-bottom:16px}.kat.is-fs .kat__h{font-size:40px}
@media (max-width:699px){.kat__stage{padding:0 8px}.kat__nav{top:auto;bottom:-62px;transform:none}.kat__nav--p{left:var(--pad)}.kat__nav--n{right:var(--pad)}.kat__bar{justify-content:center;margin-top:76px}.kat__hint{display:none}}
.kat__p{background:var(--noir)}
.kat__p img{width:100%;height:100%;object-fit:cover;display:block;user-select:none}
.kat__stage{transition:max-width .3s}
.kat__stage{max-width:none;display:flex;justify-content:center}
.kat__book{margin:0}
.kat__stage{width:fit-content;margin:0 auto;padding:0 72px}
@media (max-width:699px){.kat__stage{padding:0}.kat__wine{width:100%;justify-content:space-between}.kat__wn{font-size:20px}.kat__wl{display:none}}

/* ================= katalog v2 ================= */
.kat{padding:calc(84px + env(safe-area-inset-top) + 18px) 0 var(--sp)}
.kat__head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}
.kat__h{font:400 clamp(26px,3vw,38px)/1.1 var(--serif);padding-bottom:.06em}
.kat__h em{font-style:italic;color:var(--gold-hi)}
.kat__stage{width:auto;padding:0;display:flex;justify-content:center}
.kat__book{cursor:zoom-in}
.kat__ctrl{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 14px;margin:22px auto 0;padding:0 var(--pad)}
.kat__ctrl .kat__nav{position:static;transform:none;width:44px;height:44px}
.kat__pg{min-width:84px;text-align:center}
.kat__wine{padding:4px 4px 4px 16px}
.kat__thumbs{justify-content:center}
@media (max-width:699px){.kat{padding-top:calc(72px + env(safe-area-inset-top) + 12px)}.kat__h{font-size:24px}.kat__thumbs{justify-content:flex-start}.kat__wine{width:auto}.kat__wl{display:none}}
/* reader */
.rd{position:fixed;inset:0;z-index:130;background:rgba(10,8,6,.97);display:flex;flex-direction:column;opacity:0;transition:opacity .3s}
.rd.is-on{opacity:1}
.rd__top{display:flex;align-items:center;gap:12px;padding:12px 16px calc(12px) max(16px,env(safe-area-inset-left));border-bottom:1px solid var(--line)}
.rd__pg{font:400 22px var(--serif);color:var(--mute);margin-right:auto}
.rd__wine{display:flex;align-items:center;gap:14px}
.rd__wn{font:400 20px var(--serif)}
.rd__wl{font:700 11px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.rd__x{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);font-size:22px;color:var(--cream)}
.rd__scroll{flex:1;overflow:auto;-webkit-overflow-scrolling:touch;touch-action:pan-x pan-y pinch-zoom;padding:20px 0 90px}
.rd__img{display:block;width:min(100%,1100px);height:auto;margin:0 auto;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.rd__nav{position:fixed;bottom:calc(18px + env(safe-area-inset-bottom));width:52px;height:52px;border-radius:50%;background:var(--gold);color:var(--noir);font-size:20px;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.rd__nav--p{left:calc(50% - 64px)}.rd__nav--n{left:calc(50% + 12px)}
@media (max-width:699px){.rd__scroll{padding:0 0 90px}.rd__wl{display:none}.rd__wn{font-size:17px}}
.rd{background:#0d0b09}
.rd__z{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);font-size:22px;color:var(--cream)}
.rd.is-z .rd__img{width:min(220%,2200px);max-width:none}
.rd__img{cursor:zoom-in}.rd.is-z .rd__img{cursor:zoom-out}
.rd__pg{white-space:nowrap}@media (max-width:699px){.rd__top{gap:8px;padding:10px 12px}.rd__pg{font-size:18px}}

/* ===== navbar fits 1000-1440 ===== */
.top__nav a,.top__cta{white-space:nowrap}
@media (min-width:1000px) and (max-width:1439px){
  .top__logo img{width:clamp(118px,11vw,160px)}
  .top__nav{gap:clamp(14px,1.6vw,28px);font-size:11px;letter-spacing:.12em}
  .top__right{gap:10px}.top__lang{gap:6px}
  .top__cta{padding:0 16px;font-size:10.5px}
}
@media (min-width:1000px) and (max-width:1180px){.top__lang{display:none}.top__nav{gap:14px;font-size:10.5px;letter-spacing:.1em}}
/* mobile cards: 5 cards, the last spans the row */
.mcard:last-child:nth-child(odd){grid-column:1/-1;aspect-ratio:16/9}
/* closing CTA: mobile controls */
.sp-cta__m{display:none}
@media (hover:none),(max-width:999px){
  .sp-cta__m{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:6px}
  .sp-cta__a{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);color:var(--gold);font-size:18px}
  .sp-cta__go{font:700 11.5px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-hi);border-bottom:1px solid currentColor;padding:4px 0;min-width:170px;text-align:center}
  .sp-cta__row{gap:4px}.sp-cta__row img{height:96px}
}
/* contact + visit */
.kt-visit{padding:var(--sp) 0!important;border-top:1px solid rgba(217,178,95,.14);background:var(--alt)!important}
.kt-visit .posjet__media{padding-top:0}
.kt-visit__cta{display:flex;flex-wrap:wrap;gap:12px;align-items:center;align-content:center;padding:28px;border:1px solid var(--line);border-radius:14px;background:rgba(246,239,226,.03)}
.kt-visit__t{flex-basis:100%;font:400 30px/1.15 var(--serif);margin-bottom:6px}
/* contact: visit block compact */
.kt-visit .h-display{font-size:clamp(46px,5.4vw,84px)}
.kt-visit .posjet__grid{margin-top:48px;align-items:start}
.kt-visit__cta{align-self:start;display:block;padding:30px 30px 28px}
.kt-visit__k{font:700 11.5px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:14px}
.kt-steps{list-style:none;border-top:1px solid var(--line);margin-bottom:24px}
.kt-steps li{display:grid;grid-template-columns:40px 1fr;gap:12px;padding:16px 0;border-bottom:1px solid var(--line)}
.kt-steps b{font:italic 400 22px var(--serif);color:var(--gold)}
.kt-steps strong{display:block;font:400 24px/1.15 var(--serif);font-weight:400;margin-bottom:2px}
.kt-steps span{color:var(--text);font-size:15.5px}
.kt-visit__b{display:flex;flex-wrap:wrap;gap:10px}
@media (min-width:1000px){.kt-visit__cta{position:sticky;top:110px}}
/* map: proper spacing */
.kt-map{padding:var(--sp) 0!important;border-top:1px solid rgba(217,178,95,.14)}
.kt-map .wrap>.eyebrow{margin-bottom:30px}
.top.is-light .top__logo img{filter:brightness(.62) saturate(1.2)}

/* ---------- v5: "Pjesma na boci" - the label rolls onto the bottle (js/wrap.js) ---------- */
.sp-wrap.is-3d{padding:0;height:330svh;text-align:left;background:radial-gradient(ellipse 60% 50% at 50% 50%,color-mix(in srgb,var(--acc) 9%,transparent),transparent 70%),var(--noir)}
.sp-wrap__pin{position:relative}
.sp-wrap.is-3d .sp-wrap__pin{position:sticky;top:0;height:100svh;overflow:hidden}
.sp-wrap__cv,.sp-wrap__k,.sp-wrap__hint{display:none}
.is-3d .sp-wrap__cv{display:block;position:absolute;inset:0;width:100%;height:100%}
.is-3d.is-free .sp-wrap__cv{cursor:grab}.is-3d.is-free .sp-wrap__cv:active{cursor:grabbing}
.is-3d .sp-wrap__k{display:block;position:absolute;left:50%;top:calc(76px + 4svh);transform:translateX(-50%);white-space:nowrap;font:700 11px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--mute);opacity:calc(1 - var(--p,0) * 4);transition:opacity .2s}
.is-3d .sp-wrap__k span{color:var(--gold);margin-right:10px}
.is-3d .sp-wrap__copy{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;pointer-events:none;opacity:0;transform:translateY(24px);transition:opacity 1s,transform 1.2s cubic-bezier(.16,1,.3,1)}
.is-3d.is-wrapped .sp-wrap__copy{opacity:1;transform:none}
.is-3d .sp-wrap__copy .eyebrow{justify-content:flex-start}.is-3d .sp-wrap__copy .eyebrow::before{display:inline-block}
.is-3d .sp-song__lyric{margin:0;max-width:11.5em;font-size:clamp(30px,3.4vw,52px)}
.is-3d .sp-sig{margin:34px 0 0;width:min(46vw,300px)}
.is-3d .sp-wrap__hint{display:flex;align-items:center;gap:10px;position:absolute;left:50%;bottom:calc(22px + env(safe-area-inset-bottom));transform:translateX(-50%);font:700 11px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);opacity:0;transition:opacity .6s;pointer-events:none;white-space:nowrap}
.is-3d .sp-wrap__hint i{width:26px;height:1px;background:currentColor;position:relative;animation:sp-drag 2.4s ease-in-out infinite}
.is-3d.is-free:not(.is-touched) .sp-wrap__hint{opacity:1}
@keyframes sp-drag{0%,100%{transform:translateX(-6px)}50%{transform:translateX(6px)}}
@media (min-width:901px){.is-3d .sp-wrap__copy{padding-right:44%}.is-3d .sp-wrap__hint{left:70%}}
@media (max-width:900px){
  .is-3d .sp-wrap__copy{justify-content:flex-end;padding-bottom:calc(64px + env(safe-area-inset-bottom));text-align:center;background:linear-gradient(transparent 52%,color-mix(in srgb,var(--noir) 88%,transparent) 72%)}
  .is-3d .sp-wrap__copy .eyebrow{justify-content:center}.is-3d .sp-wrap__copy .eyebrow::before{display:none}
  .is-3d .sp-song__lyric{font-size:clamp(22px,6vw,30px);max-width:none}
  .is-3d .sp-sig{margin:16px auto 0;width:min(44vw,180px)}
  .is-3d.is-wrapped .sp-wrap__copy{opacity:calc((var(--p,0) - .72) * 6)}
}
.sp-wine__360{position:relative;z-index:4;display:inline-flex;align-items:center;gap:8px;margin-top:22px;font:700 11px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--mute);transition:color .3s}
.sp-wine__360 b{font:italic 400 18px var(--serif);letter-spacing:0;color:var(--acc)}
.sp-wine__360:hover{color:var(--cream)}
/* v5: footer carries the real vector logo (crest + wordmark) */
.foot__crest{width:84px;margin:0 auto 30px}
.foot__word img{display:block;width:min(80vw,560px);height:auto;margin:0 auto}
.foot__word{line-height:1;margin-bottom:18px}
/* the lyric in the hand it was written on the label; the typeset line stays for reading and search */
.sp-hand{display:none}
.is-3d .sp-hand{display:block;color:var(--gold-hi,#f0d596);width:min(40vw,560px);margin:6px 0 22px;clip-path:inset(-10% 100% -10% 0);transition:clip-path 2.6s cubic-bezier(.45,.05,.3,1) .3s}
.is-3d .sp-hand svg{display:block;width:100%;height:auto}
.is-3d.is-wrapped .sp-hand{clip-path:inset(-10% -2% -10% 0)}
.is-3d .sp-hand + .sp-song__lyric{font-size:clamp(17px,1.3vw,20px);line-height:1.5;color:var(--mute);max-width:30em}
@media (max-width:900px){.is-3d .sp-hand{width:min(84vw,420px);margin:4px auto 12px}.is-3d .sp-hand + .sp-song__lyric{font-size:15px;margin:0 auto}}
@media (max-width:900px){.is-3d .sp-hand + .sp-song__lyric{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .is-3d .sp-wrap__copy{padding-bottom:calc(58px + env(safe-area-inset-bottom))}.is-3d .sp-hand{width:min(80vw,380px)}.is-3d .sp-sig{margin-top:8px;width:min(40vw,170px)}}

/* ---------- v5: homepage "Okrenite bocu" (js/lineup.js) ---------- */
.b3{position:relative;padding:clamp(80px,10vw,140px) 0 clamp(60px,8vw,110px);background:radial-gradient(ellipse 60% 55% at 50% 62%,rgba(217,178,95,.10),transparent 70%),var(--noir);overflow:hidden}
.b3__head{text-align:center}.b3__head .eyebrow{justify-content:center}.b3__head .eyebrow::before{display:none}
.b3__head .lead{max-width:34em;margin:18px auto 0}
.b3__stage{position:relative;height:min(62vw,720px);margin-top:clamp(20px,3vw,40px)}
.b3__poster,.b3__poster img,.b3__cv{position:absolute;inset:0;width:100%;height:100%}
.b3__poster img{object-fit:contain;transition:opacity .9s}
.b3__cv{opacity:0;transition:opacity .9s;cursor:grab}.b3__cv:active{cursor:grabbing}
.b3.is-live .b3__cv{opacity:1}.b3.is-live .b3__poster img{opacity:0}
.b3__info{display:flex;flex-direction:column;align-items:center;gap:22px;margin-top:10px;min-height:150px}
.b3__chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.b3__chip{font:700 11px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--cream);background:none;border:1px solid var(--line);border-radius:99px;padding:11px 18px;cursor:pointer;transition:.25s}
.b3__chip:hover,.b3__chip.is-on{background:var(--gold);color:var(--noir);border-color:var(--gold)}
.b3__pick{display:flex;flex-direction:column;align-items:center;gap:8px;opacity:0;transform:translateY(10px);transition:opacity .5s,transform .6s cubic-bezier(.16,1,.3,1)}
.b3.is-picked .b3__pick{opacity:1;transform:none}
.b3__name{font:italic 400 clamp(26px,2.6vw,34px)/1.1 var(--serif);color:var(--gold-hi,#f0d596);padding-bottom:.08em}
.b3__hand{width:min(80vw,420px);color:var(--cream)}.b3__hand svg{display:block;width:100%;height:auto}
.b3__go{font:700 11px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--gold);border-bottom:1px solid currentColor;padding-bottom:3px}
@media (min-width:900px){.b3__info{position:relative}.b3__pick{min-height:120px}}
@media (max-width:899px){
  .b3__stage{height:min(120vw,560px)}
  .b3__chips{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;width:100%;padding:0 2px;scrollbar-width:none}.b3__chip{flex:none}
  .b3__hand{width:min(78vw,340px)}
}
.b3{padding:clamp(70px,8vw,110px) 0 clamp(50px,6vw,80px)}
.b3__head .h-display{font-size:clamp(46px,6vw,84px)}
.b3__head .lead{margin-top:12px}
@media (min-width:900px){.b3__stage{height:clamp(380px,calc(100svh - 400px),600px);margin-top:10px}.b3__info{min-height:130px;margin-top:0}}
/* v5: the foil on the label catches the light (mask = foil layer of the print file, rendered on the bottle) */
.sp-wine__foil{position:absolute;inset:0;pointer-events:none;-webkit-mask:var(--foil) center/100% 100% no-repeat;mask:var(--foil) center/100% 100% no-repeat;
  background:radial-gradient(circle at var(--gx,50%) 78%,rgba(255,240,200,.75),rgba(255,222,150,.3) 20%,transparent 42%);mix-blend-mode:plus-lighter;opacity:.85;transition:--gx .2s;animation:foil-idle 6s ease-in-out infinite}
.sp-wine__b:hover .sp-wine__foil,.sp-wine.is-pointer .sp-wine__foil{animation:none}
@keyframes foil-idle{0%,100%{--gx:20%}50%{--gx:80%}}
@property --gx{syntax:'<percentage>';inherits:true;initial-value:50%}

/* ---------- v5.3: the real bottle first - 3D in the homepage scene, the wine hero and the closing band ---------- */
.vina__3d{position:absolute;left:0;top:0;width:200px;height:400px;z-index:4;opacity:0;transform-origin:50% 50%;will-change:transform;pointer-events:none}
.vina.is-3d-live .vina__3d{pointer-events:auto;cursor:grab}.vina.is-3d-live .vina__3d:active{cursor:grabbing}
.vina__3d canvas{display:block;width:100%;height:100%;touch-action:pan-y}
.sp-wine__cv{position:absolute;left:50%;top:-3%;height:106%;width:190%;transform:translateX(-50%);opacity:0;transition:opacity .9s;touch-action:pan-y;cursor:grab;animation:sp-float 6s ease-in-out infinite}
.sp-wine__cv:active{cursor:grabbing}
.sp-wine__b.is-live3d .sp-wine__cv{opacity:1}
.sp-wine__b.is-live3d .sp-wine__wrap{opacity:0!important;transition:opacity .9s}
.sp-wine__b.is-live3d{cursor:default}
.sp-cta__row{position:relative}
.sp-cta__cv{position:absolute;left:50%;top:-14%;width:min(100vw,900px);height:128%;transform:translateX(-50%);opacity:0;transition:opacity .9s;cursor:pointer;touch-action:pan-y}
.sp-cta.is-live3d .sp-cta__row{height:clamp(240px,27vw,380px)}
.sp-cta.is-live3d .sp-cta__cv{opacity:1}
.sp-cta.is-live3d .sp-cta__row a{opacity:0;pointer-events:none}
.sp-cta__row a img{transition:opacity .9s}
@media (max-width:899px){.sp-cta__cv{width:100vw}.sp-cta.is-live3d .sp-cta__row{height:min(62vw,300px)}}

/* ---------- v5.4: the vine from the labels, filling the quiet bands; it sways like a branch in the wind ---------- */
.sp-cta,.b3,.sp-more,.sp-head,.sp-faq{position:relative;overflow:hidden}
.sp-cta>.wrap,.b3>*,.sp-more>.wrap,.sp-head>.wrap,.sp-faq>.wrap{position:relative;z-index:1}
.sp-cta::before,.sp-cta::after,.b3::before,.b3::after,.sp-more::before,.sp-head::after,.sp-faq::before{content:"";position:absolute;z-index:0;pointer-events:none;
  background:url(/live/vina-skoro/img/vine-gold.svg) center/contain no-repeat;width:clamp(120px,15vw,230px);aspect-ratio:111.95/294.71;opacity:.16;transform-origin:50% 0;animation:vine-sway 9s ease-in-out infinite}
.sp-cta::before,.b3::before{left:clamp(-30px,2vw,60px);top:6%}
.sp-cta::after,.b3::after{right:clamp(-30px,2vw,60px);top:18%;transform:scaleX(-1);animation-name:vine-sway-r;animation-delay:-4s}
.sp-more::before{right:clamp(-40px,1vw,40px);top:-20px;transform:scaleX(-1);animation-name:vine-sway-r;opacity:.1}
.sp-head::after{right:clamp(-40px,4vw,120px);top:12%;opacity:.12}
.sp-faq::before{left:clamp(-50px,-1vw,10px);bottom:-60px;transform:rotate(180deg);animation:none;opacity:.09}
@keyframes vine-sway{0%,100%{transform:rotate(-1.6deg)}50%{transform:rotate(1.8deg)}}
@keyframes vine-sway-r{0%,100%{transform:scaleX(-1) rotate(-1.6deg)}50%{transform:scaleX(-1) rotate(1.8deg)}}
@media (max-width:899px){.sp-cta::before,.sp-cta::after,.b3::before,.b3::after{width:90px;opacity:.12}.sp-head::after{width:90px}}
@media (prefers-reduced-motion:reduce){.sp-cta::before,.sp-cta::after,.b3::before,.b3::after,.sp-more::before,.sp-head::after{animation:none}}
.sub--wine .sp-head::after{display:none}

/* ---------- v5.5 ---------- */
/* wine hero: the 3D bottle stays put, no CSS tilt or float on top of its own motion */
.sp-wine__b.is-live3d .sp-wine__tilt{transform:none!important;transition:none}
.sp-wine__b.is-live3d .sp-wine__cv{animation:none}
/* "Okrenite bocu": a wine is always chosen, so the band under the chips is never empty */
.b3 .b3__pick{opacity:1;transform:none}
.b3__info{min-height:0!important;gap:18px}
.b3__pick{min-height:0!important}
/* page head followed by its content: one rhythm instead of two paddings stacked */
.sub .sp-head + .sp-awall,.sub .sp-head + .wcs,.sub .sp-head + section:not(.paket){padding-top:clamp(28px,3.5vw,52px)!important}
/* FAQ band: stronger left column */
.sp-faq::before{display:none!important}
.sp-faq__l{position:relative}
.sp-faq .h-sm em{font-style:italic;color:var(--gold-hi,#f0d596)}
.sp-faq__p{margin-top:18px;color:var(--text);max-width:24em;line-height:1.6}
.sp-faq__b{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.sp-faq__vine{display:block;width:clamp(110px,10vw,150px);height:auto;margin-top:42px;opacity:.32;transform-origin:50% 0;animation:vine-sway 9s ease-in-out infinite}
@media (max-width:999px){.sp-faq__vine{display:none}}
/* paket: steps inside the form card */
.pk2f__how--in{margin-top:22px;padding-top:20px;border-top:1px solid var(--line)}
.pk2__form .pk2f__call{margin-top:14px;text-align:center}
.sub .sp-head:has(+ .sp-awall),.sub .sp-head:has(+ .wcs){padding-bottom:12px!important}
/* one-bottle box */
.crate[data-size="1"] .crate__slots{grid-template-columns:1fr;max-width:38%;margin:0 auto}
.crate[data-size="3"] .crate__slots{grid-template-columns:repeat(3,1fr)}
.foot__legal{line-height:1.8}
@media (min-width:700px){.zemlja .stats{grid-template-columns:repeat(3,1fr)!important}}

/* ---------- v5.6: "Natočite" - the bottle pours into a crystal glass (js/pour3d.js) ---------- */
.pr3{--pbg:#14110d;position:relative;background:var(--pbg)}
.pr3.is-3d{height:300svh}
.pr3__pin{position:relative;height:100svh;overflow:hidden}
.pr3.is-3d .pr3__pin{position:sticky;top:0}
.pr3__cv,.pr3__poster,.pr3__poster img{position:absolute;inset:0;width:100%;height:100%}
.pr3__cv{opacity:0;transition:opacity 1s}
.pr3.is-3d .pr3__cv{opacity:1}.pr3.is-3d .pr3__poster{display:none}
.pr3__poster img{object-fit:cover}
.pr3__copy{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;pointer-events:none;z-index:2}
.pr3__copy>*{pointer-events:auto;max-width:440px}
.pr3__copy .h-display{font-size:clamp(52px,6.4vw,104px);padding-bottom:.06em}
.pr3__pick{margin-top:22px;min-height:120px}
.pr3__name{font:italic 400 clamp(26px,2.4vw,34px)/1.1 var(--serif);color:var(--wine,#f0d596);padding-bottom:.08em;transition:color .6s}
.pr3__hand{width:min(80vw,380px);color:var(--cream);margin:8px 0 12px;opacity:.9}.pr3__hand svg{display:block;width:100%;height:auto}
.pr3__go{font:700 11px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--gold);border-bottom:1px solid currentColor;padding-bottom:3px}
.pr3__chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.pr3__chip{font:700 11px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--cream);background:rgba(20,17,13,.6);border:1px solid var(--line);border-radius:99px;padding:11px 16px;cursor:pointer;transition:.25s}
.pr3__chip:hover,.pr3__chip.is-on{background:var(--gold);color:var(--noir);border-color:var(--gold)}
.pr3__hint{position:absolute;left:50%;bottom:calc(22px + env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;align-items:center;gap:10px;font:700 11px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);opacity:calc(1 - var(--p,0) * 6);white-space:nowrap;z-index:2}
.pr3__hint i{width:1px;height:26px;background:currentColor;animation:sp-drag 2.4s ease-in-out infinite}
@media (min-width:900px){.pr3__hint{left:62%}}
@media (max-width:899px){
  .pr3__copy{justify-content:flex-end;padding-bottom:calc(30px + env(safe-area-inset-bottom));background:linear-gradient(transparent 50%,rgba(20,17,13,.85) 68%,var(--pbg) 85%)}
  .pr3__copy>*{max-width:none}
  .pr3__copy .h-display{font-size:clamp(40px,11vw,56px)}
  .pr3__copy .h-display br{display:none}
  .pr3__pick{min-height:0;margin-top:10px}.pr3__hand{width:min(70vw,300px);margin:4px 0 8px}
  .pr3__chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-top:16px}.pr3__chip{flex:none}
  .pr3__hint{display:none}
}
@media (max-width:899px){
  .pr3__copy{background:linear-gradient(transparent 46%,rgba(20,17,13,.9) 58%,var(--pbg) 70%)}
  .pr3__hand{display:none}
  .pr3__pick{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
}
/* footer: calmer - no sketched branch, crest with air above the wordmark */
.foot__branch{display:none}
.foot{padding-top:clamp(64px,7vw,96px)}
.foot__crest{width:72px;margin:0 auto 28px}
.foot__word{margin-bottom:22px}
.foot__sig{margin:0 0 40px}
/* FAQ vine: smaller so the left column never runs longer than the questions */
.sp-faq__vine{width:clamp(90px,7vw,112px);margin-top:30px}
.sp-faq__vine{display:none!important}
.pr3__name{color:color-mix(in srgb,var(--wine,#f0d596) 45%,#f6efe2)}

/* ---------- v5.7: one pen for every lyric (img/lyrics: same stroke, same letter size via --w) ---------- */
.sp-hand svg,.b3__hand svg,.pr3__hand svg,.sp-cta__hand svg{display:block;width:calc(var(--w,30) * var(--hs,14px))!important;max-width:100%;height:auto}
.sp-hand,.b3__hand,.pr3__hand,.sp-cta__hand{width:auto!important}
.is-3d .sp-hand{--hs:17px}
.b3__hand{--hs:14px}.b3__hand svg{margin:0 auto}
.pr3__hand{--hs:15px}
.sp-cta__hand{--hs:14px;color:var(--cream);margin:10px 0 0;min-height:60px;display:flex;justify-content:center}
.sp-cta__ly span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media (max-width:899px){.is-3d .sp-hand{--hs:12px}.b3__hand{--hs:11px}.pr3__hand{--hs:11px}.sp-cta__hand{--hs:10.5px}}
/* Priča: the head and the manifest read as one block */
.sub .sp-head + .sp-manifest,.sub .sp-head + section.manifest{padding-top:clamp(20px,2.5vw,36px)!important}
.sp-cta__ly{min-height:0}
.sub .sp-head:has(+ .sp-manifest){padding-bottom:0!important}
/* footer: the label's vine hangs either side of the crest, where the sketched branch used to be */
.foot{position:relative;overflow:hidden}
.foot::before,.foot::after{content:"";position:absolute;top:-6px;width:clamp(70px,7vw,104px);aspect-ratio:111.95/294.71;background:url(/live/vina-skoro/img/vine-gold.svg) center/contain no-repeat;opacity:.55;pointer-events:none;transform-origin:50% 0;animation:vine-sway 9s ease-in-out infinite}
.foot::before{left:calc(50% - clamp(150px,15vw,230px) - clamp(70px,7vw,104px))}
.foot::after{left:calc(50% + clamp(150px,15vw,230px));animation-name:vine-sway-r;animation-delay:-4s}
@media (max-width:599px){.foot::before{left:4%}.foot::after{left:auto;right:4%}.foot::before,.foot::after{width:56px;opacity:.4}}
@media (min-width:600px){.foot::before{left:calc(50% - 330px - clamp(70px,7vw,104px))}.foot::after{left:calc(50% + 330px)}}

/* ---------- loader: a crystal glass fills while the page loads ---------- */
.gate__glass{position:relative;width:170px;height:266px}
.gate__glass svg{display:block;width:100%;height:100%;overflow:visible}
.gate__cup{fill:none;stroke:url(#gg-gold);stroke-width:1.5;stroke-linecap:round}
.gate__cup--in{stroke-width:.6;opacity:.55}
.gate__rim{fill:none;stroke:url(#gg-gold);stroke-width:1.1}
.gate__stem{fill:rgba(246,239,226,.05);stroke:url(#gg-gold);stroke-width:1.1;stroke-linejoin:round}
.gate__foot{fill:rgba(246,239,226,.04);stroke:url(#gg-gold);stroke-width:1.3}
.gate__foot2{fill:none;stroke:#f0d596;stroke-width:.6;opacity:.45}
.gate__hl{fill:none;stroke:#fff8e6;stroke-width:2.2;stroke-linecap:round;opacity:.42}
.gate__hl--2{stroke-width:1.2;opacity:.22}
.gate__spark{fill:#fff8e6;opacity:0;transform-origin:108px 40px}
.gate__wine{transition:none}
.gate__wine>*{animation:gate-slosh 3.2s ease-in-out infinite;transform-origin:80px 0}
@keyframes gate-slosh{0%,100%{transform:rotate(-2.2deg)}50%{transform:rotate(2.2deg)}}
.gate__halo{opacity:.0;transition:opacity 1.2s}
.gate__glass.is-full .gate__halo{opacity:1}
.gate__glass.is-full .gate__spark{animation:gate-spark 1.4s .25s ease-out forwards}
@keyframes gate-spark{0%{opacity:0;transform:scale(.2) rotate(0)}40%{opacity:1;transform:scale(1.25) rotate(45deg)}100%{opacity:0;transform:scale(.6) rotate(90deg)}}
.gate__glass.is-full{animation:gate-swirl 1.4s cubic-bezier(.45,.05,.3,1)}
@keyframes gate-swirl{0%,100%{transform:rotate(0)}30%{transform:rotate(-3deg)}65%{transform:rotate(2deg)}}
.gate__pct{margin-top:10px;font:400 17px var(--serif)!important;letter-spacing:.12em!important}
@media (prefers-reduced-motion:reduce){.gate__wine>*,.gate__glass.is-full,.gate__glass.is-full .gate__spark{animation:none}}
.posjet__h{font-size:clamp(46px,6.4vw,92px)!important}
/* v5.8 */
.foot::before,.foot::after{display:none!important}
/* Romie in the navigation and on every button */
.top__nav a,.top__nav .dd__btn,.btn,.top__cta{font-family:var(--serif)!important;font-weight:400!important;letter-spacing:.08em!important}
.top__nav a,.top__nav .dd__btn{font-size:15.5px!important}
.btn{font-size:15px!important}.btn--sm{font-size:14px!important}
.top__nav .dd__menu a{font-size:16px!important;letter-spacing:.04em!important;text-transform:none}
/* v5.9: navigation and buttons in Kabel (overrides the Romie test) */
.top__nav a,.top__nav .dd__btn,.btn,.top__cta{font-family:var(--kabel)!important;font-weight:400!important;letter-spacing:.12em!important;text-transform:uppercase}
.top__nav a,.top__nav .dd__btn{font-size:12px!important}
.btn{font-size:12px!important}.btn--sm{font-size:11px!important}
.top__nav .dd__menu a{font-family:var(--serif)!important;font-size:16px!important;letter-spacing:.02em!important;text-transform:none!important}
@media (max-width:599px){.is-3d .sp-wrap__k{white-space:normal;width:calc(100% - 40px);text-align:center;line-height:1.7}}

/* ===================== v6 ===================== */
/* homepage: Kasna berba, the last wine of the scene, pours into the glass - no extra copy, just the moment + buy */
.pr3--end{--pbg:#2a1c10;background:var(--pbg)}
.pr3--end.is-3d{height:220svh}
.pr3__end{position:absolute;left:0;right:0;bottom:calc(36px + env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;gap:14px;opacity:0;transform:translateY(16px);transition:opacity .8s,transform .9s cubic-bezier(.16,1,.3,1);z-index:2}
.pr3--end.is-poured .pr3__end,.pr3--end:not(.is-3d) .pr3__end{opacity:1;transform:none}
.pr3__end .pr3__name{font:400 clamp(30px,3vw,44px)/1 var(--serif);color:#f0d596;padding-bottom:.08em}
.pr3__btns{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
/* wine pages: "Pjesma na boci" compact - one lyric, in Miroslav's hand only, the typeset copy stays for readers and search */
.sp-wrap.is-3d{height:210svh}
.is-3d .sp-hand + .sp-song__lyric{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;margin:0!important}
.is-3d .sp-hand{--hs:15px;margin:4px 0 14px}
@media (max-width:899px){.is-3d .sp-hand{--hs:11px}.sp-wrap.is-3d{height:190svh}}
/* /live/vina-skoro/vina/: the 3D lineup sits under the wine cards */
.b3--vina{padding-top:clamp(40px,6vw,80px)}
.b3--vina .b3__pick{min-height:0}
/* /live/vina-skoro/vina/ head: the vine sits fully inside the band */
.sub--list .sp-head::after{top:auto!important;bottom:10px;right:clamp(10px,4vw,90px);width:clamp(90px,10vw,150px)}
/* dropdown: catalogue after the wines, set apart by a hairline */
.dd__menu .dd__kat{margin-top:6px;border-top:1px solid var(--line);padding-top:14px!important}
.pr3--end .pr3__end{bottom:calc(30px + env(safe-area-inset-bottom))}@media (min-width:900px){.pr3--end .pr3__end{bottom:46px}}
/* v6.1: the pour lives inside the wine scene, after Kasna berba */
.vina__pour3d{position:absolute!important;inset:0;height:auto!important;z-index:5;opacity:0;pointer-events:none;transition:opacity .4s;background:none!important}
.vina.is-pouring .vina__pour3d{opacity:1}
.vina.is-pouring .vina__pour3d .pr3__end{pointer-events:auto}
.vina__pour3d .pr3__cv{position:absolute;inset:0;width:100%;height:100%}
/* lyrics in white so the gold signature and accents read against them */
.is-3d .sp-hand{color:var(--cream)!important}
/* subpage heads: big display lines keep their descenders, the vine sits inside the band */
.sp-head .h-display{line-height:1.06;padding-bottom:.16em}
.sp-head::after{top:auto!important;bottom:24px!important}
/* closing band (b3--cta) */
.b3--cta .b3__head .h-display{font-size:clamp(40px,5vw,72px)}
.b3--cta .sp-cta__b{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:8px}
.vina__pour3d{z-index:2!important;transition:none!important;opacity:var(--pin,0)!important}
.vina.is-pouring .vina__pour3d{opacity:var(--pin,0)!important}
/* v6.3: Pjesma na boci without the 3D label scene (lighter page): Miroslav's hand + signature, compact */
.sp-wrap:not(.is-3d){padding:clamp(64px,8vw,110px) 0;text-align:center}
.sp-wrap:not(.is-3d) .sp-wrap__copy{display:flex;flex-direction:column;align-items:center}
.sp-wrap:not(.is-3d) .eyebrow{justify-content:center}.sp-wrap:not(.is-3d) .eyebrow::before{display:none}
.sp-wrap:not(.is-3d) .sp-hand{display:block;color:var(--cream);--hs:15px;margin:10px auto 22px}
.sp-wrap:not(.is-3d) .sp-hand svg{margin:0 auto}
.sp-wrap:not(.is-3d) .sp-song__lyric{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:0}
.sp-wrap:not(.is-3d) .sp-sig{width:min(60vw,260px);margin:0 auto}
@media (max-width:899px){.sp-wrap:not(.is-3d) .sp-hand{--hs:10.5px}}
/* phones: the light sits behind the bottle, not behind the copy under it */
@media (max-width:999px){
  .sp-wine .vina__glow{background:radial-gradient(ellipse 75% min(30svh,260px) at 50% calc(170px + min(27svh,230px)),rgba(255,240,200,.12),transparent 70%),radial-gradient(ellipse at 50% 120%,rgba(0,0,0,.55),transparent 60%)}
  .sp-wine .vina__sketch{--mx:50%!important;--my:calc(170px + min(27svh,230px))!important}
  .b3__chips{flex-wrap:wrap;overflow:visible;justify-content:center;gap:7px}.b3__chip{padding:10px 14px;font-size:10px;letter-spacing:.14em}
}
/* v6.1 awards by year */
.ayr{margin-top:44px}.ayr[hidden]{display:none}
.ayr__y{font:400 clamp(34px,4.4vw,56px)/1.1 var(--serif);color:var(--cream);padding-bottom:.12em;margin-bottom:16px;border-bottom:1px solid var(--line)}
.medals .m--more a{color:inherit;text-decoration:none}
.m.m--more{background:none;border:1px solid var(--line)}
.m.m--more::before{display:none}
.m.m--more{border:0;padding-left:2px}
.m.m--more a{border-bottom:1px solid currentColor;padding-bottom:2px;color:var(--cream)}
/* wine pages: the 3D bottle takes over from the packshot in place, no cross-fade */
.sp-wine__cv{transition:none!important}
.sp-wine__b.is-live3d .sp-wine__wrap{transition:none!important}
/* "+N" pill: same shape as a medal pill, no medal dot */
.m.m--n{padding-left:12px;padding-right:12px}
.m.m--n::before{display:none}
.medals .m--more{align-self:center}
/* homepage wine scene: the same 360 hint as on the wine pages, under the 3D bottle */
.vina__hint{position:absolute;left:50%;top:var(--hy,85%);z-index:5;transform:translateX(-50%);white-space:nowrap;font:700 10px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--mute);opacity:0;transition:opacity .6s;pointer-events:none}
.vina.is-3d-live .vina__hint{opacity:var(--ho,1);transition:none}
@media (max-width:899px){.vina__hint{font-size:9px;letter-spacing:.18em}}
/* Posjet: three equal rectangles in a row (phones: one under the other) */
.posjet__media{grid-template-columns:repeat(3,1fr)!important}
.posjet__media .ph--1,.posjet__media .ph--2,.posjet__media .ph--3{grid-row:auto!important;aspect-ratio:3/4!important}
.posjet__media .ph img{width:100%;height:100%;object-fit:cover}
@media (max-width:699px){.posjet__media{grid-template-columns:1fr!important}}
/* one brand grade over every photograph (the -900/-1200/-1600/-1800 photo set): calmer colour, a little depth, warm gold */

/* mGrađani age check dialog */
.agechk{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:16px;background:rgba(8,6,5,.72);backdrop-filter:blur(6px);opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
.agechk.is-on{opacity:1;visibility:visible}
.agechk__box{width:min(520px,100%);background:var(--alt,#19140f);border:1px solid var(--line);border-radius:16px;padding:30px 28px 26px;color:var(--cream)}
.agechk__t{font:400 clamp(26px,3vw,34px)/1.15 var(--serif);margin:10px 0 12px;padding-bottom:.08em}
.agechk__p{color:var(--text);line-height:1.6;margin-bottom:22px}
.agechk__btns{display:flex;flex-wrap:wrap;gap:10px}
.agechk__note{margin-top:18px;font-size:13px;line-height:1.55;color:var(--mute)}
body.agechk-open{overflow:hidden}
/* 1000-1279 (landscape tablets, small laptops): the right column needs its full width, the wine list moves to the free space bottom left */
@media (min-width:1000px) and (max-width:1379px){body:not(.sub) .vina__nav{right:auto;left:var(--pad);align-items:flex-start}}
/* language switch: links, also inside the mobile menu */
.top__lang a{color:inherit;text-decoration:none}.top__lang a.is-on{color:var(--gold)}
.mnav__lang{display:flex;gap:18px;justify-content:center;margin-top:8px;font:700 12px var(--sans);letter-spacing:.16em;color:var(--mute)}
.mnav__lang a{color:inherit;text-decoration:none}.mnav__lang a.is-on{color:var(--gold)}
/* phones: on a wine page the buy block comes right after the facts, the awards follow */
@media (max-width:999px){
  .sp-wine__r{display:flex;flex-direction:column;align-items:center}
  .sp-wine__r .sp-wine__desc{order:1}.sp-wine__r .spec{order:2}.sp-wine__r .bq{order:3;margin-bottom:10px}.sp-wine__r .sp-wine__note{order:4}.sp-wine__r .medals{order:5;margin-top:22px}
}
/* phones: the map pins move left so Mitrovac and Kutjevo never run off the screen */
@media (max-width:699px){
  .terrain{height:clamp(380px,110vw,520px)}
  .tpin--peak{--x:44%!important;--y:14%!important}.tpin--main{--x:24%!important;--y:52%!important}.tpin--town{--x:46%!important;--y:84%!important}
  .tpin small{max-width:48vw;white-space:normal;line-height:1.35}
}
/* wine scene: the outgoing wine's text leaves before the next one arrives, never two texts on top of each other */
.wine{transition:opacity .18s ease,transform .5s var(--ease),visibility 0s linear .18s!important}
.wine.is-on{transition:opacity .5s var(--ease) .16s,transform .7s var(--ease) .16s,visibility 0s!important}
/* award cards: the title's descenders get room before the wine line */
.ac__t{line-height:1.08;padding-bottom:.12em;margin-bottom:6px}
.ac__w{line-height:1.45}
/* medal pills: two-line labels stay aligned with the dot */
.m{line-height:1.35;text-align:left;border-radius:18px;padding-top:7px;padding-bottom:7px}
.m::before{align-self:center}
/* temporarily unavailable wine: everything stays, only ordering is quietly off */
.out-pill{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:0 18px;border-radius:999px;border:1px solid rgba(246,239,226,.22);color:var(--mute);font:700 11px var(--sans);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;cursor:default}
.out-pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.6}
.btn--sm + .out-pill,.wine__btns .out-pill{min-height:38px;font-size:10px;padding:0 14px}
.is-out .qty,.is-out .qty--sm{display:none}
.mbar.is-out{justify-content:space-between}
.pkw.is-out{opacity:.55}
.pkw.is-out .pkw__q{display:none}
.pkw__out{display:block;font:700 9.5px var(--sans);font-style:normal;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-top:3px}
.sp-wine--light .out-pill,.is-paper .out-pill{border-color:rgba(42,33,25,.25);color:rgba(42,33,25,.6)}
/* lite scene (phones): no 3D bottle on the homepage scene, so no drag hint there */
.vs-lite .vina__hint{display:none!important}
/* phones: 2D bottles on the homepage scene (pour.js lite) */
.vina__2d{position:absolute;left:0;top:0;z-index:4;opacity:0;pointer-events:none;user-select:none;-webkit-user-select:none;transform-origin:50% 50%;will-change:transform,opacity;backface-visibility:hidden}
.vs-lite .vina__3d{display:none!important}
.vina__pop{position:absolute;z-index:5;width:0;height:0;pointer-events:none}
.vina__pop .cork{left:0;top:0;width:var(--cw);margin-left:calc(var(--cw) / -2);transform-origin:50% 100%;animation:cork 1.3s cubic-bezier(.2,.7,.3,1) forwards}
.vina__pop .fizz{left:0;top:0}
/* phones: the wine page bottle is the clean packshot, as on the homepage (no sheen or foil glint layered over the label) */
@media (pointer:coarse) and (max-width:899px),(pointer:coarse) and (orientation:portrait){.sp-wine__shine,.sp-wine__foil{display:none!important}}
/* desktop: while Kasna berba pours, the tilted bottle crosses the right column; its description and specs step aside */
@media (min-width:900px){.vina.is-pouring .wine.is-on .wine__desc,.vina.is-pouring .wine.is-on .spec{opacity:calc(1 - var(--pin,0))!important;transition:opacity .25s}}
/* music toggle (js/music.js): four small bars that move while "Vrime" plays */
.snd{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;gap:2.5px;padding:0;background:none;cursor:pointer;transition:border-color .3s}
.snd:hover{border-color:rgba(217,178,95,.6)}
.snd i{display:block;width:2px;height:4px;border-radius:1px;background:var(--gold,#d9b25f);opacity:.55;transition:height .3s,opacity .3s}
.snd.is-on i{opacity:1;animation:snd 1.1s ease-in-out infinite}
.snd.is-on i:nth-child(2){animation-delay:-.35s}.snd.is-on i:nth-child(3){animation-delay:-.7s}.snd.is-on i:nth-child(4){animation-delay:-.2s}
@keyframes snd{0%,100%{height:5px}50%{height:14px}}
@media (max-width:899px){.snd{width:36px;height:36px}}
@media (prefers-reduced-motion:reduce){.snd.is-on i{animation:none;height:10px}}
/* label shown flat where a wine has no lyric (Izborna berba bobica) */
.sp-label{display:block;width:min(640px,92vw);height:auto;margin:22px auto 26px;border-radius:4px;box-shadow:0 30px 60px rgba(0,0,0,.45)}
/* song credit next to the music toggle: Vrime, Miroslav Škoro (instrumental) */
.snd__wrap{position:relative;display:inline-flex}
.snd__tip{position:absolute;top:calc(100% + 12px);right:-6px;display:grid;grid-template-columns:auto auto;column-gap:9px;align-items:baseline;padding:10px 14px 11px;border:1px solid rgba(217,178,95,.35);border-radius:12px;background:rgba(18,15,11,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);white-space:nowrap;pointer-events:none;opacity:0;transform:translateY(-6px);transition:opacity .5s,transform .5s;z-index:60}
.snd__tip.is-on{opacity:1;transform:none}
.snd__tip i{grid-row:span 2;font-style:normal;color:var(--gold,#d9b25f);font-size:15px;line-height:1.2}
.snd__tip b{font:400 19px/1.25 var(--serif);color:var(--cream,#f3ead8);font-style:italic}
.snd__tip small{font:700 9.5px/1.6 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--mute,#b8ab95)}
.foot__music{font-size:12.5px;color:var(--mute,#b8ab95);margin:0 0 8px}
.foot__music em{font-family:var(--serif);font-size:1.15em;color:var(--cream,#f3ead8)}
@media (max-width:899px){.snd__tip{position:fixed;top:calc(74px + env(safe-area-inset-top));left:50%;right:auto;transform:translate(-50%,-6px)}.snd__tip.is-on{transform:translate(-50%,0)}}
/* QA 12.10.: the wine number never touches a longer type line (polusuho), and "Kliknite bocu" keeps air above the type line */
.wc .wine__type{padding-right:68px}
@media (max-width:999px){.sp-wine__info{margin-top:52px}}