:root{
  --crna:#110f0e; --oglje:#1c1917; --oglje2:#262220;
  --papir:#efebe3; --papir2:#e5dfd3; --bela:#fbfaf7;
  --bron:#a7865a; --bron-sv:#c8ab7f; --bron-tm:#8a6c45;
  --tekst:#3a3431; --siva:#7b746e; --crta:rgba(17,15,14,.12);
  --serif:"Cormorant Garamond",Georgia,serif; --sans:"Quattrocento Sans",system-ui,sans-serif;
  --ovoj:1240px; --ease:cubic-bezier(.22,.8,.24,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--tekst);background:var(--papir);font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.ovoj{width:min(var(--ovoj),calc(100% - 64px));margin-inline:auto}
h1,h2,h3{font-family:var(--serif);font-weight:500;text-transform:uppercase;letter-spacing:.02em;line-height:1.06;color:var(--crna)}
h2{font-size:clamp(34px,4.2vw,56px)}
h3{font-size:24px;letter-spacing:.04em}
.nad{font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--bron);font-weight:700;margin-bottom:18px;display:flex;align-items:center;gap:14px}
.nad.svetlo{color:var(--bron-sv)}
.crta{width:44px;height:1px;background:currentColor;display:inline-block}
.papir{background:var(--papir)}
.temno{background:var(--oglje);color:#d9d2c7}
.temno h2,.temno h3{color:#f3eee6}

/* gumbi */
.gumb{display:inline-flex;align-items:center;gap:14px;height:52px;padding:0 26px;font-size:11px;letter-spacing:.26em;text-transform:uppercase;font-weight:700;transition:background .3s,color .3s,border-color .3s}
.gumb-mali{height:40px;padding:0 18px;font-size:10px}
.gumb-bron{background:var(--bron);color:#fff}
.gumb-bron:hover{background:var(--bron-tm)}
.gumb-temen{background:var(--crna);color:#fff}
.gumb-temen:hover{background:var(--oglje2)}
.gumb-obroba{border:1px solid rgba(255,255,255,.5);color:#fff}
.gumb-obroba:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.gumb-puscica{padding:0 0 0 26px;gap:22px}
.gumb-puscica i{width:52px;height:52px;background:var(--crna);display:grid;place-items:center;position:relative;transition:background .3s}
.gumb-temen.gumb-puscica i{background:var(--bron)}
.gumb-puscica i::before{content:"";width:16px;height:1px;background:#fff;transition:transform .35s var(--ease)}
.gumb-puscica i::after{content:"";position:absolute;width:7px;height:7px;border-top:1px solid #fff;border-right:1px solid #fff;transform:translateX(5px) rotate(45deg);transition:transform .35s var(--ease)}
.gumb-puscica:hover i::before{transform:translateX(4px)}
.gumb-puscica:hover i::after{transform:translateX(9px) rotate(45deg)}
.pusc{width:50px;height:50px;border:1px solid rgba(255,255,255,.35);display:grid;place-items:center;color:#fff;transition:background .3s,border-color .3s}
.pusc svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.3}
.pusc:hover{background:var(--bron);border-color:var(--bron)}
.pusc-temen{border-color:rgba(17,15,14,.35);color:var(--crna)}

/* glava */
.glava{position:fixed;inset:0 0 auto;z-index:50;color:#fff;transition:background .4s,transform .4s}
.glava-trak{height:36px;display:flex;align-items:center;justify-content:center;gap:16px;font-size:11px;letter-spacing:.14em;color:rgba(255,255,255,.72);border-bottom:1px solid rgba(255,255,255,.12)}
.glava-trak .tocka{width:3px;height:3px;border-radius:50%;background:var(--bron)}
.glava-vrsta{height:86px;display:flex;align-items:center;justify-content:space-between;padding:0 40px;gap:24px}
.logo img{height:46px;width:auto}
.meni{display:flex;gap:38px}
.meni a{font-size:11px;letter-spacing:.26em;text-transform:uppercase;font-weight:700;position:relative;padding:8px 0}
.meni a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--bron);transition:right .35s var(--ease)}
.meni a:hover::after{right:0}
.glava-desno{display:flex;align-items:center;gap:22px}
.jezik{font-size:11px;letter-spacing:.2em;color:rgba(255,255,255,.6)}
.jezik b{color:#fff}
.kosarica{position:relative;width:24px;height:24px}
.kosarica svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.3}
.kosarica .st{position:absolute;top:-6px;right:-9px;width:17px;height:17px;border-radius:50%;background:var(--bron);font-size:9px;display:grid;place-items:center;font-weight:700}
.burger{display:none;width:30px;height:20px;position:relative}
.burger span{position:absolute;left:0;right:0;height:1px;background:currentColor;transition:transform .3s,top .3s}
.burger span:first-child{top:5px}.burger span:last-child{top:14px}
.glava.trden{background:rgba(17,15,14,.96);backdrop-filter:blur(8px);transform:translateY(-36px)}
.glava.trden .glava-vrsta{height:72px}
.glava.trden .logo img{height:38px}

/* junak */
.junak{position:relative;height:100vh;min-height:680px;overflow:hidden;background:var(--crna);color:#fff;display:flex;flex-direction:column;justify-content:flex-end}
.junak-slike,.js-slika,.junak-tema{position:absolute;inset:0}
.js-slika{background:var(--img) center/cover no-repeat;opacity:0;transform:scale(1.08);transition:opacity 1.6s ease,transform 8s linear}
.js-slika.on{opacity:1;transform:scale(1)}
.junak-tema{background:linear-gradient(90deg,rgba(10,8,7,.86) 0%,rgba(10,8,7,.55) 42%,rgba(10,8,7,.08) 75%),linear-gradient(0deg,rgba(10,8,7,.7),transparent 35%)}
.junak-vsebina{position:relative;padding-bottom:40px}
.junak-besedila{position:relative;min-height:360px}
.jb{position:absolute;left:0;bottom:0;max-width:640px;opacity:0;pointer-events:none}
.jb.on{opacity:1;pointer-events:auto}
.jb .nad,.jb h1,.jb .pod{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform 1.1s var(--ease)}
.jb.on .nad{opacity:1;transform:none;transition-delay:.25s}
.jb.on h1{opacity:1;transform:none;transition-delay:.4s}
.jb.on .pod{opacity:1;transform:none;transition-delay:.6s}
@media (min-width:901px){
  .js-slika.desno{left:34%;-webkit-mask-image:linear-gradient(90deg,transparent,#000 22%);mask-image:linear-gradient(90deg,transparent,#000 22%)}
}
.junak h1{color:#fff;font-size:clamp(44px,6.2vw,86px);font-weight:500;letter-spacing:.01em;line-height:1}
.junak .nad{color:var(--bron-sv)}
.junak .pod{margin-top:26px;font-size:17px;max-width:470px;color:rgba(255,255,255,.82)}
.junak-gumbi{display:flex;gap:16px;margin-top:38px;flex-wrap:wrap}
.junak-noga{position:relative;display:flex;justify-content:space-between;align-items:center;padding:26px 0 34px;border-top:1px solid rgba(255,255,255,.14)}
.stevec{display:flex;align-items:center;gap:16px;font-family:var(--serif);font-size:18px;color:rgba(255,255,255,.6)}
.stevec b{color:#fff;font-weight:500}
.napredek{width:120px;height:1px;background:rgba(255,255,255,.25);position:relative;overflow:hidden}
.napredek i{position:absolute;inset:0;background:var(--bron-sv);transform-origin:left;transform:scaleX(0)}
.puscice{display:flex;gap:10px}

/* zgodba */
.zgodba{padding:130px 0 110px}
.zg-blok{display:grid;grid-template-columns:5fr 7fr;align-items:stretch}
.zg-tekst{padding:70px 60px;position:relative;z-index:2;margin:60px -60px 60px 0;box-shadow:0 30px 60px -30px rgba(0,0,0,.4)}
.zg-tekst h2{margin-bottom:28px}
.zg-tekst p{margin-bottom:14px;font-size:15.5px;color:#cfc7bb}
.podpis{font-family:var(--serif);font-style:italic;font-size:26px !important;color:var(--bron-sv) !important;margin-top:24px}
.zg-foto{position:relative;min-height:560px}
.zg-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.zg-gumb{position:absolute;right:0;bottom:60px}
.stebri{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:100px;border-top:1px solid var(--crta)}
.steber{padding:44px 34px 10px;text-align:center;border-right:1px solid var(--crta)}
.steber:last-child{border-right:0}
.steber svg{width:46px;height:46px;fill:none;stroke:var(--bron);stroke-width:1.1;margin:0 auto 22px}
.steber h3{font-size:20px;margin-bottom:10px}
.steber p{font-size:14.5px;color:var(--siva);max-width:230px;margin:auto}

/* ospredje */
.ospredje{position:relative;background:radial-gradient(ellipse at 50% 55%,#2a2421 0%,var(--oglje) 45%,var(--crna) 100%);color:#d9d2c7;overflow:hidden;padding:110px 0}
.velika-beseda{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:var(--serif);font-weight:600;font-size:clamp(140px,22vw,340px);letter-spacing:.04em;color:rgba(255,255,255,.035);white-space:nowrap;pointer-events:none;user-select:none}
.osp-mreza{position:relative;display:grid;grid-template-columns:1fr 360px 1fr;align-items:center;gap:40px;min-height:640px}
.osp-levo h2{color:#f3eee6;font-size:clamp(34px,3.6vw,52px);transition:opacity .5s,transform .6s var(--ease)}
.osp-kat{margin-top:16px;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--siva)}
.osp-crta{display:block;width:60px;height:1px;background:var(--bron);margin-top:30px}
.osp-steklenica{position:relative;height:620px;display:flex;justify-content:center;align-items:flex-end}
.osp-sij{position:absolute;left:50%;bottom:-10px;width:260px;height:40px;transform:translateX(-50%);background:radial-gradient(ellipse,rgba(0,0,0,.7),transparent 70%)}
.osp-steklenica img{position:relative;height:100%;width:auto;object-fit:contain;filter:drop-shadow(0 30px 40px rgba(0,0,0,.45));transition:opacity .55s ease,transform .8s var(--ease)}
.osp-desno{max-width:380px}
.osp-dejstvo{font-family:var(--serif);font-style:italic;font-size:26px;color:var(--bron-sv);line-height:1.2;margin-bottom:18px}
.osp-opis{font-size:15px;color:#bdb5aa;margin-bottom:34px;min-height:150px}
.osp-nav{display:flex;align-items:center;gap:18px;margin-bottom:30px}
.osp-st{font-family:var(--serif);font-size:18px;color:var(--siva)}
.osp-st b{color:#fff;font-weight:500}
.ospredje .menja{opacity:0;transform:translateY(14px)}
.osp-steklenica img.menja{opacity:0;transform:translateX(40px) rotate(2deg)}
.osp-steklenica img.menja-l{opacity:0;transform:translateX(-40px) rotate(-2deg)}

/* trgovina */
.trgovina{padding:130px 0}
.trg-glava{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:46px;flex-wrap:wrap}
.zavihki{display:flex;gap:6px;flex-wrap:wrap}
.zavihki button{height:40px;padding:0 18px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:var(--siva);border:1px solid transparent;transition:all .3s}
.zavihki button:hover{color:var(--crna)}
.zavihki button.on{color:var(--crna);border-color:var(--crna)}
.zavihki sup{font-size:9px;color:var(--bron);margin-left:4px}
.trg-mreza{display:grid;grid-template-columns:1fr 300px;gap:30px;align-items:start}
.izdelki{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.izdelek{background:var(--bela);position:relative;display:flex;flex-direction:column;transition:box-shadow .4s,transform .4s var(--ease);animation:pojav .6s var(--ease) both}
@keyframes pojav{from{opacity:0;transform:translateY(16px)}}
.izdelek:hover{box-shadow:0 26px 50px -24px rgba(40,30,20,.35)}
.iz-slika{height:330px;display:flex;align-items:flex-end;justify-content:center;padding:34px 20px 22px;background:linear-gradient(180deg,#fff,#f4f1ea)}
.iz-slika img{height:100%;width:auto;object-fit:contain;transition:transform .6s var(--ease)}
.izdelek:hover .iz-slika img{transform:translateY(-8px)}
.iz-slika .pis{width:120px;height:120px;align-self:center;opacity:.8}
.iz-oznaka{position:absolute;top:16px;left:16px;font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--bron);font-weight:700}
.iz-tekst{padding:20px 22px 22px;border-top:1px solid var(--crta);display:flex;flex-direction:column;flex:1}
.iz-tekst h3{font-size:21px;line-height:1.1;text-transform:none;letter-spacing:.01em;font-weight:600}
.iz-tekst p{font-size:13.5px;color:var(--siva);margin-top:8px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.iz-dno{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:16px}
.iz-cena{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--siva)}
.iz-gumb{width:40px;height:40px;background:var(--crna);color:#fff;display:grid;place-items:center;transition:background .3s}
.iz-gumb svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.4}
.iz-gumb:hover{background:var(--bron)}
.iz-gumb.dodano{background:var(--bron)}
.trg-vec{margin-top:40px;text-align:center}
.trg-vec[hidden]{display:none}
.trg-stran{display:grid;gap:24px;position:sticky;top:100px}
.ploscica{padding:36px 30px;position:relative;overflow:hidden}
.ploscica h3{font-size:26px;margin-bottom:12px}
.ploscica p{font-size:14.5px}
.ploscica.bron{background:var(--bron);color:#fff;min-height:330px;display:flex;flex-direction:column}
.ploscica.bron h3{color:#fff}
.ploscica.bron .nad{color:#f4e6cf}
.pl-pisanica{position:absolute;right:-60px;top:-50px;width:230px;opacity:.18}
.ploscica .pusc-temen{margin-top:auto;border-color:rgba(255,255,255,.6);color:#fff;align-self:flex-start}
.ploscica .pusc-temen:hover{background:var(--crna);border-color:var(--crna)}
.pl-ikona{width:44px;height:44px;fill:none;stroke:var(--bron-sv);stroke-width:1.2;margin-bottom:18px}
.pl-vrstica{display:flex;justify-content:space-between;gap:10px;border-top:1px solid rgba(255,255,255,.12);padding-top:12px;margin-top:14px;font-size:13px}
.pl-vrstica b{color:var(--bron-sv);font-weight:400;font-style:italic;font-family:var(--serif);font-size:17px}

/* obleka */
.obleka{background:var(--papir2);padding:130px 0;overflow:hidden}
.ob-mreza{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}
.ob-slika{position:relative;aspect-ratio:1;display:grid;place-items:center}
.ob-pisanica{width:82%;color:var(--crna);opacity:.92;animation:vrti 90s linear infinite}
@keyframes vrti{to{transform:rotate(360deg)}}
.ob-jajce{position:absolute;right:-10px;bottom:0;width:46%;box-shadow:0 30px 50px -25px rgba(0,0,0,.5);border:10px solid var(--bela)}
.ob-tekst h2{margin-bottom:24px}
.uvod{font-size:17px;margin-bottom:34px}
.ob-trije{list-style:none;display:grid;gap:0;counter-reset:t}
.ob-trije li{display:grid;grid-template-columns:110px 1fr;gap:20px;padding:20px 0;border-top:1px solid var(--crta);counter-increment:t}
.ob-trije b{font-family:var(--serif);font-size:24px;font-weight:500;text-transform:uppercase;color:var(--crna);letter-spacing:.04em}
.ob-trije b::before{content:"0" counter(t);display:block;font-size:11px;font-family:var(--sans);color:var(--bron);letter-spacing:.2em;font-weight:700}
.ob-trije span{font-size:15px;padding-top:12px}

/* degustacije */
.degustacije{background:var(--oglje);color:#d9d2c7}
.deg-pas{position:relative;height:88vh;min-height:560px;display:grid;place-items:center;text-align:center;overflow:hidden}
.deg-pas picture,.deg-pas img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.deg-pas::after{content:"";position:absolute;inset:0;background:rgba(10,8,7,.55)}
.deg-pas::before{content:"";position:absolute;inset:26px;border:1px solid rgba(255,255,255,.35);z-index:2;pointer-events:none}
.deg-okvir{position:relative;z-index:3;max-width:760px;padding:0 30px}
.deg-okvir .nad{justify-content:center}
.deg-okvir h2{color:#fff;display:flex;align-items:center;justify-content:center;gap:28px;font-size:clamp(36px,5vw,68px)}
.crtica{width:80px;height:1px;background:rgba(255,255,255,.6);flex:none}
.deg-okvir p{margin-top:24px;font-size:17px;color:rgba(255,255,255,.85)}
.deg-cenik{padding:100px 0 110px}
.dc-glava{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:40px}
.dc-glava h3{color:#f3eee6;font-size:clamp(26px,2.6vw,36px);max-width:560px}
.skupine{display:flex;border:1px solid rgba(255,255,255,.2)}
.skupine button{height:46px;padding:0 22px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:#a49b90;transition:all .3s}
.skupine button.on{background:var(--bron);color:#fff}
.dc-seznam{list-style:none}
.dc-seznam li{display:grid;grid-template-columns:240px 120px 1fr 190px;align-items:center;gap:30px;padding:28px 0;border-top:1px solid rgba(255,255,255,.1);transition:background .3s}
.dc-seznam li:last-child{border-bottom:1px solid rgba(255,255,255,.1)}
.dc-seznam li:hover{background:rgba(255,255,255,.025)}
.dc-ime{font-family:var(--serif);font-size:32px;text-transform:uppercase;color:#f3eee6;letter-spacing:.03em;line-height:1}
.dc-st{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--bron-sv);font-weight:700}
.dc-opis{font-size:15px;color:#b3aaa0}
.dc-cena{text-align:right;font-family:var(--serif);font-size:40px;color:#fff;line-height:1}
.dc-cena small{display:block;font-family:var(--sans);font-size:10.5px;letter-spacing:.14em;color:var(--siva);margin-top:6px;text-transform:uppercase}
.dc-cena .stevka{display:inline-block;transition:opacity .25s,transform .35s var(--ease)}
.dc-cena .stevka.menja{opacity:0;transform:translateY(-10px)}
.dc-dodatki{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:40px}
.dc-dodatki p{font-size:14.5px;color:#b3aaa0;padding-left:20px;border-left:1px solid var(--bron)}
.dc-dodatki b{display:block;color:#f3eee6;font-family:var(--serif);font-size:20px;font-weight:500;text-transform:uppercase;letter-spacing:.04em}
.dc-poziv{display:flex;justify-content:space-between;align-items:center;gap:30px;margin-top:56px;flex-wrap:wrap}
.dc-poziv p{color:var(--siva);font-size:14px}

/* vinogradi */
.vinogradi{padding:130px 0 100px}
.vg-zgoraj{display:grid;grid-template-columns:7fr 5fr;gap:70px;align-items:center}
.vg-foto{position:relative}
.vg-foto::after{content:"";position:absolute;inset:18px;border:1px solid rgba(255,255,255,.55)}
.vg-foto img{width:100%;aspect-ratio:16/9;object-fit:cover}
.vg-tekst h2{margin-bottom:20px}
.lege{margin-top:30px}
.lege div{padding:18px 0;border-top:1px solid var(--crta)}
.lege dt{font-family:var(--serif);font-size:24px;text-transform:uppercase;color:var(--crna);letter-spacing:.04em}
.lege dd{font-size:14.5px;color:var(--siva)}
.stevilke{display:grid;grid-template-columns:repeat(4,1fr);margin-top:100px;border-top:1px solid var(--crta);border-bottom:1px solid var(--crta)}
.stevilke div{padding:40px 24px;text-align:center;border-right:1px solid var(--crta)}
.stevilke div:last-child{border-right:0}
.stevilke b{display:block;font-family:var(--serif);font-weight:500;font-size:clamp(46px,5vw,72px);line-height:1;color:var(--crna)}
.stevilke span{display:block;margin-top:12px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--siva)}

/* krajina */
.krajina{display:grid;grid-template-columns:1fr 1fr;background:var(--crna);color:#cfc7bb}
.kr-foto{min-height:620px;position:relative}
.kr-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05)}
.kr-tekst{padding:110px clamp(30px,6vw,100px);align-self:center}
.kr-tekst h2{color:#f3eee6;margin-bottom:24px}
.kr-tekst p{font-size:16px;margin-bottom:16px}
.kr-izlet{margin-top:30px;padding-top:24px;border-top:1px solid rgba(255,255,255,.12);font-size:14px !important;color:#9c938a}
.kr-izlet b{display:block;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--bron-sv);margin-bottom:8px}

/* hiša */
.hisa{padding:120px 0}
.hisa-glava{text-align:center;margin-bottom:50px}
.hisa-glava .nad{justify-content:center}
.hisa-mreza{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.hisa-mreza figure{background:var(--bela);padding:10px 10px 0}
.hisa-mreza img{width:100%;aspect-ratio:4/5;object-fit:cover;filter:sepia(.25)}
.hisa-mreza figcaption{text-align:center;padding:18px 0;font-family:var(--serif);font-size:19px;text-transform:uppercase;letter-spacing:.06em;color:var(--crna)}

/* nakup */
.nakup{background:var(--bron);color:#fff;padding:54px 0}
.nakup-vrsta{display:flex;justify-content:space-between;align-items:center;gap:40px}
.nakup h2{color:#fff;font-size:clamp(22px,2.2vw,30px);text-transform:none;letter-spacing:0;max-width:780px;line-height:1.25}

/* noga */
.noga{background:var(--crna);color:#9c938a;padding:90px 0 0;font-size:14.5px}
.noga-mreza{display:grid;grid-template-columns:1.6fr 1fr 1.2fr 1fr;gap:50px;padding-bottom:70px}
.noga-logo img{height:56px;width:auto;margin-bottom:20px}
.noga-logo p{max-width:300px}
.noga h4{font-family:var(--serif);font-weight:500;font-size:19px;letter-spacing:.08em;text-transform:uppercase;color:#f3eee6;margin-bottom:16px}
.noga a:hover{color:var(--bron-sv)}
.mal{font-size:12px}
.druzbena{display:flex;gap:10px;margin-top:22px}
.druzbena a{width:40px;height:40px;border:1px solid rgba(255,255,255,.18);display:grid;place-items:center;transition:all .3s}
.druzbena a:hover{background:var(--bron);border-color:var(--bron);color:#fff}
.druzbena svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.4}
.noga-dno{display:flex;justify-content:space-between;gap:30px;padding:24px 0 30px;border-top:1px solid rgba(255,255,255,.1);font-size:12px;color:#6f6862}

/* odkrivanje */
.odkrij{opacity:0;transform:translateY(34px);transition:opacity 1s var(--ease),transform 1.1s var(--ease)}
.odkrij.vidno{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}.odkrij{opacity:1;transform:none}}

/* tablica */
@media (max-width:1100px){
  .meni{gap:24px}
  .izdelki{grid-template-columns:repeat(2,1fr)}
  .osp-mreza{grid-template-columns:1fr 300px 1fr}
  .dc-seznam li{grid-template-columns:200px 1fr 150px}
  .dc-st{display:none}
}
/* telefon */
@media (max-width:900px){
  .ovoj{width:calc(100% - 40px)}
  .glava-trak{display:none}
  .glava.trden{transform:none}
  .glava-vrsta{height:70px;padding:0 20px}
  .logo img{height:34px}
  .jezik,.glava-desno .gumb{display:none}
  .burger{display:block}
  .meni{position:fixed;inset:70px 0 auto;background:var(--crna);flex-direction:column;gap:0;padding:10px 20px 30px;transform:translateY(-12px);opacity:0;pointer-events:none;transition:all .35s var(--ease)}
  .meni a{padding:16px 0;border-bottom:1px solid rgba(255,255,255,.08);font-size:12px}
  .glava.odprto{background:var(--crna)}
  .glava.odprto .meni{opacity:1;transform:none;pointer-events:auto}
  .glava.odprto .burger span:first-child{top:10px;transform:rotate(45deg)}
  .glava.odprto .burger span:last-child{top:10px;transform:rotate(-45deg)}
  .junak{min-height:640px;height:100svh}
  .junak-tema{background:linear-gradient(0deg,rgba(10,8,7,.92) 10%,rgba(10,8,7,.45) 60%,rgba(10,8,7,.2))}
  .junak-besedila{min-height:300px}
  .junak .pod{font-size:15.5px;margin-top:18px}
  .junak-gumbi{margin-top:26px}
  .junak-gumbi .gumb-obroba{display:none}
  .junak-noga{padding:18px 0 24px}
  .pusc{width:44px;height:44px}
  .zgodba,.trgovina,.obleka,.vinogradi,.hisa{padding:80px 0}
  .zg-blok{grid-template-columns:1fr}
  .zg-tekst{margin:0;padding:46px 28px;order:2}
  .zg-foto{min-height:300px;order:1}
  .zg-gumb{bottom:20px}
  .stebri{grid-template-columns:1fr 1fr;margin-top:60px}
  .steber{padding:30px 14px 26px;border-bottom:1px solid var(--crta)}
  .steber:nth-child(2){border-right:0}
  .ospredje{padding:80px 0}
  .osp-mreza{grid-template-columns:1fr;gap:20px;min-height:0;text-align:center}
  .osp-levo .nad{justify-content:center}
  .osp-crta{margin:20px auto 0}
  .osp-steklenica{height:420px;order:2}
  .osp-levo{order:1}.osp-desno{order:3;margin:auto}
  .osp-opis{min-height:0}
  .osp-nav{justify-content:center}
  .velika-beseda{top:44%;font-size:120px}
  .trg-mreza{grid-template-columns:1fr}
  .izdelki{gap:12px}
  .iz-slika{height:230px;padding:26px 10px 14px}
  .iz-tekst{padding:14px 14px 16px}
  .iz-tekst h3{font-size:18px}
  .iz-tekst p{-webkit-line-clamp:2;font-size:12.5px}
  .iz-cena{font-size:9.5px;letter-spacing:.08em}
  .iz-gumb{width:34px;height:34px}
  .zavihki{flex-wrap:nowrap;overflow-x:auto;margin:0 -20px;padding:0 20px;width:calc(100% + 40px);scrollbar-width:none}
  .zavihki button{flex:none}
  .trg-stran{position:static;grid-template-columns:1fr}
  .ploscica.bron{min-height:260px}
  .ob-mreza{grid-template-columns:1fr;gap:50px}
  .ob-trije li{grid-template-columns:90px 1fr}
  .deg-pas{height:auto;min-height:540px;padding:90px 0}
  .deg-pas::before{inset:14px}
  .crtica{width:30px}
  .deg-okvir h2{gap:14px}
  .deg-cenik{padding:70px 0}
  .skupine{width:100%}
  .skupine button{flex:1;padding:0 6px;font-size:9.5px;letter-spacing:.12em}
  .dc-seznam li{grid-template-columns:1fr auto;gap:6px 16px;padding:22px 0}
  .dc-ime{font-size:26px}
  .dc-opis{grid-column:1;font-size:14px}
  .dc-cena{grid-row:1 / span 2;grid-column:2;font-size:32px}
  .dc-dodatki{grid-template-columns:1fr}
  .vg-zgoraj{grid-template-columns:1fr;gap:40px}
  .stevilke{grid-template-columns:1fr 1fr;margin-top:60px}
  .stevilke div{border-bottom:1px solid var(--crta);padding:30px 12px}
  .stevilke div:nth-child(2){border-right:0}
  .stevilke div:nth-child(n+3){border-bottom:0}
  .krajina{grid-template-columns:1fr}
  .kr-foto{min-height:340px}
  .kr-tekst{padding:70px 24px}
  .hisa-mreza{grid-template-columns:1fr 1fr;gap:12px}
  .hisa-mreza figcaption{font-size:15px;padding:12px 0}
  .nakup-vrsta{flex-direction:column;align-items:flex-start;gap:24px}
  .noga-mreza{grid-template-columns:1fr 1fr;gap:36px}
  .noga-logo{grid-column:1 / -1}
  .noga-dno{flex-direction:column;gap:8px}
}
.junak .gumb-puscica i{background:var(--bron-tm)}
.nakup .gumb-puscica i{background:var(--oglje2)}

/* ---------- telefon, 2. krog ---------- */
.meni-kontakt,.spodnja,.trak-napredek{display:none}
@media (max-width:900px){
  body{font-size:15.5px}
  body.zaklep{overflow:hidden}
  .ovoj{width:calc(100% - 44px)}

  /* meni čez cel zaslon */
  .meni{inset:70px 0 0;height:calc(100dvh - 70px);padding:34px 22px 30px;justify-content:flex-start;overflow:auto}
  .meni > a{font-family:var(--serif);font-weight:500;font-size:34px;letter-spacing:.03em;padding:12px 0;border:0;display:flex;align-items:center;gap:16px;opacity:0;transform:translateY(14px);transition:opacity .5s var(--ease),transform .6s var(--ease)}
  .meni > a::after{display:none}
  .meni > a::before{content:"";width:0;height:1px;background:var(--bron);transition:width .4s var(--ease)}
  .meni > a:active::before{width:26px}
  .glava.odprto .meni > a{opacity:1;transform:none}
  .glava.odprto .meni > a:nth-child(2){transition-delay:.05s}.glava.odprto .meni > a:nth-child(3){transition-delay:.1s}
  .glava.odprto .meni > a:nth-child(4){transition-delay:.15s}.glava.odprto .meni > a:nth-child(5){transition-delay:.2s}
  .meni-kontakt{display:block;margin-top:auto;padding-top:30px;border-top:1px solid rgba(255,255,255,.1);font-size:14px;color:#9c938a;position:relative}
  .meni-kontakt p{margin-bottom:4px}
  .meni-kontakt a{color:#e8e1d6}
  .meni-kontakt img{position:absolute;right:-30px;bottom:-40px;width:170px;opacity:.14}

  /* prvi zaslon */
  .junak h1{font-size:clamp(40px,11.4vw,52px)}
  .junak-besedila{min-height:280px}
  .nad{font-size:10px;letter-spacing:.26em}

  /* zgodba: stebri kot seznam */
  .zg-tekst{padding:40px 26px}
  .stebri{grid-template-columns:1fr;margin-top:50px}
  .steber{display:grid;grid-template-columns:52px 1fr;column-gap:18px;text-align:left;padding:22px 0;border-right:0}
  .steber svg{grid-row:1 / span 2;width:40px;height:40px;margin:0}
  .steber h3{font-size:19px;margin-bottom:2px;align-self:end}
  .steber p{margin:0;max-width:none;font-size:14px}

  /* vino v ospredju */
  .velika-beseda{font-size:21vw;top:52%;letter-spacing:0}
  .osp-steklenica{height:400px}
  .osp-levo h2{font-size:34px}
  .osp-dejstvo{font-size:23px}
  .osp-opis{font-size:14.5px}
  .osp-desno .gumb{width:100%;justify-content:space-between}

  /* vinoteka: vodoravni trak */
  .trg-glava{margin-bottom:28px}
  .izdelki{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin:0 -22px;padding:4px 22px 6px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .izdelki::-webkit-scrollbar{display:none}
  .izdelek{flex:0 0 72%;scroll-snap-align:start;scroll-margin-left:22px;animation:none}
  .iz-slika{height:320px;padding:40px 20px 22px}
  .iz-tekst{padding:18px 18px 18px}
  .iz-tekst h3{font-size:21px}
  .iz-tekst p{-webkit-line-clamp:3;font-size:13.5px}
  .iz-cena{font-size:10px;letter-spacing:.12em}
  .iz-gumb{width:40px;height:40px}
  .trak-napredek{display:block;height:1px;background:var(--crta);margin-top:22px;overflow:hidden}
  .trak-napredek i{display:block;height:1px;background:var(--crna);transition:transform .15s linear}
  .trg-vec{display:none}
  .trg-stran{margin-top:40px;grid-template-columns:1fr;gap:14px}
  .ploscica{padding:30px 24px}
  .ploscica.bron{min-height:0}
  .ploscica.bron .pusc{margin-top:22px}

  /* obleka */
  .ob-slika{width:84%;margin:0 auto}
  .ob-pisanica{width:74%}
  .ob-jajce{right:-8%;width:48%;border-width:7px}
  .ob-trije li{grid-template-columns:1fr;gap:4px;padding:18px 0}
  .ob-trije span{padding-top:0}

  /* degustacije */
  .deg-okvir h2{font-size:38px}
  .deg-okvir p{font-size:15.5px}
  .dc-seznam li{grid-template-columns:1fr auto;grid-template-areas:"ime cena" "st cena" "opis opis";row-gap:4px}
  .dc-ime{grid-area:ime}
  .dc-st{display:block;grid-area:st;font-size:10px}
  .dc-opis{grid-area:opis;margin-top:8px}
  .dc-cena{grid-area:cena;grid-row:auto;grid-column:auto;align-self:start}
  .dc-cena small{font-size:9px}
  .dc-poziv .gumb{width:100%;justify-content:space-between}

  /* vinogradi, hiša */
  .lege dt{font-size:22px}
  .hisa-mreza{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -22px;padding:0 22px;scrollbar-width:none}
  .hisa-mreza::-webkit-scrollbar{display:none}
  .hisa-mreza figure{flex:0 0 66%;scroll-snap-align:start;scroll-margin-left:22px}
  .nakup h2{font-size:24px}
  .nakup .gumb{width:100%;justify-content:space-between}

  /* spodnja vrstica */
  .spodnja{display:grid;grid-template-columns:1fr 1.25fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:40;height:58px;background:var(--crna);border-top:1px solid rgba(255,255,255,.1);transform:translateY(100%);transition:transform .45s var(--ease);padding-bottom:env(safe-area-inset-bottom)}
  .spodnja.on{transform:none}
  .spodnja a{display:flex;align-items:center;justify-content:center;gap:8px;color:#fff;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;font-weight:700}
  .spodnja a.bron{background:var(--bron)}
  .spodnja svg{width:16px;height:16px;fill:none;stroke:var(--bron-sv);stroke-width:1.4}
  .noga-dno{padding-bottom:30px}
}

.trg-mreza > div{min-width:0}

.meni .meni-kontakt a{font-size:14px;letter-spacing:.02em;text-transform:none;padding:0;border:0;font-weight:400;display:inline}


/* vmesne širine: glava v eni vrstici */
.meni a,.gumb,.jezik{white-space:nowrap}
@media (min-width:901px) and (max-width:1240px){
  .glava-vrsta{padding:0 24px;gap:18px}
  .logo img{height:40px}
  .meni{gap:22px}
  .meni a{font-size:10px;letter-spacing:.2em}
  .jezik{display:none}
  .glava-desno{gap:16px}
  .glava-desno .gumb-mali{padding:0 14px}
}
@media (min-width:901px) and (max-width:1000px){
  .glava-desno .gumb-mali{display:none}
}