:root{--iv:#F8F5ED;--wh:#FFFFFF;--ink:#262722;--be:#E9E1D4;--go:#B69A62;--mu:#5c5b53;--serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;--sans:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;--w:1240px;--gx:clamp(1.25rem,5vw,3.5rem);color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 76px);-webkit-text-size-adjust:100%;background:var(--iv)}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--iv);color:var(--ink);font:400 1.0625rem/1.65 var(--sans)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--iv);z-index:25}
img{display:block;max-width:100%;height:auto}
.wrap{width:min(var(--w),100% - 2*var(--gx));margin-inline:auto}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:1rem;top:-5rem;background:var(--ink);color:var(--iv);padding:.6rem 1rem;z-index:40}
.skip:focus{top:calc(env(safe-area-inset-top,0px) + .5rem)}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.04;margin:0;letter-spacing:-.01em}
h1{font-size:clamp(3.1rem,7.6vw,6.6rem)}
h2{font-size:clamp(2.3rem,4.8vw,4rem)}
h3{font-size:1.75rem}
em{font-style:italic;font-weight:400}
.tag{display:block;font-size:.85rem;color:var(--mu);margin:0 0 .5rem;padding-left:1.9rem;position:relative}
.tag::before{content:"";position:absolute;left:0;top:.8em;width:1.3rem;height:1px;background:var(--go)}

.hd{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:rgba(248,245,237,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:box-shadow .3s}
.hd-in{display:flex;align-items:center;gap:2.5rem;padding-block:1.4rem;transition:padding .3s}
.hd.sm{box-shadow:0 1px 0 rgba(38,39,34,.1)}.hd.sm .hd-in{padding-block:.7rem}
.logo{margin-right:auto}.logo img{height:2.4rem;width:auto;transition:height .3s}.hd.sm .logo img{height:1.9rem}
nav{display:flex;gap:2.4rem}
nav a,.link{color:inherit;text-decoration:none;font-size:.95rem;position:relative}
nav a::after,.link::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1px;background:var(--go);transform:scaleX(0);transform-origin:left;transition:transform .35s}
nav a:hover::after,.link:hover::after{transform:scaleX(1)}
.btn{display:inline-block;font:500 .95rem var(--sans);padding:.95rem 1.8rem;background:var(--ink);color:var(--iv);border:1px solid var(--ink);text-decoration:none;cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.btn:hover{background:transparent;color:var(--ink);border-color:var(--go)}
.btn-o{background:transparent;color:var(--ink);padding:.65rem 1.3rem;font-size:.9rem}.btn-o:hover{background:var(--ink);color:var(--iv);border-color:var(--ink)}
.burger{display:none;position:relative;width:2.75rem;height:2.75rem;background:none;border:0;cursor:pointer}
.burger i{position:absolute;left:.7rem;right:.7rem;height:1.5px;background:var(--ink);transition:transform .3s}
.burger i:first-of-type{top:1.05rem}.burger i:last-of-type{top:1.6rem}
.burger[aria-expanded=true] i:first-of-type{transform:translateY(.27rem) rotate(45deg)}
.burger[aria-expanded=true] i:last-of-type{transform:translateY(-.28rem) rotate(-45deg)}

.lead{max-width:30rem;color:var(--mu);font-size:1.15rem;margin:1.8rem 0 2.4rem}
.cta{display:flex;align-items:center;gap:2.2rem;flex-wrap:wrap}

.sec{padding-block:clamp(4.5rem,10vw,9rem)}
.sec-h{max-width:40rem;margin-bottom:clamp(2.5rem,6vw,5rem)}
.sec-h p{color:var(--mu);margin:1.2rem 0 0}

.p{margin:0}
.ph{overflow:hidden;background:var(--be)}
.ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.p:hover .ph img{transform:scale(1.035)}
figcaption{padding-top:1.3rem;max-width:26rem}
figcaption p{color:var(--mu);margin:.6rem 0 1.1rem;font-size:1rem}
.more,.lnk{background:none;border:0;border-bottom:1px solid var(--go);padding:0 0 2px;font:inherit;font-size:.92rem;color:var(--ink);cursor:pointer;text-decoration:none;transition:border-color .3s,letter-spacing .3s}
.more:hover,.lnk:hover{border-color:var(--ink)}

.origin{display:grid;grid-template-columns:5fr 6fr;gap:clamp(2rem,7vw,7rem);align-items:center}
.o-i{margin:0}.o-i img{width:100%;aspect-ratio:3/4;object-fit:cover}
.o-t h2{margin-bottom:2rem}.o-t p{color:var(--mu);max-width:34rem}

.proc{background:var(--wh)}
.proc-in{display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(2rem,6vw,6rem);align-items:start}
.pr-h p{color:var(--mu);max-width:30rem;margin:1.4rem 0 2.5rem}
.pr-i{margin:0;grid-column:2;grid-row:1/3}.pr-i img{width:100%;aspect-ratio:3/4;object-fit:cover}
.steps{list-style:none;margin:0;padding:0;grid-column:1}
.steps li{display:grid;grid-template-columns:3.4rem 1fr;column-gap:1rem;padding:1.6rem 0;border-top:1px solid var(--be)}
.steps span{font:italic 500 1.8rem/1.2 var(--serif)}
.steps h3{font-size:1.55rem}.steps h3,.steps p{grid-column:2}.steps p{margin:.4rem 0 0;color:var(--mu)}


.nl{background:var(--be)}
.nl-in{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,6rem);align-items:center}
.nl p{color:var(--mu)}.nl h2+p{margin:1.2rem 0 0;max-width:30rem}
.row{display:flex;gap:.6rem;flex-wrap:wrap}
.row input{flex:1 1 15rem;font:inherit;padding:.95rem 1.1rem;background:var(--wh);border:1px solid transparent;color:var(--ink);min-width:0}
.consent{display:flex;gap:.7rem;margin-top:1.1rem;font-size:.9rem;color:var(--ink)}
.consent input{accent-color:var(--ink);margin-top:.3rem;flex:none;width:1rem;height:1rem}
#nl-msg{min-height:1.6rem;margin:.9rem 0 0;font-size:.95rem;color:var(--ink)}
.fine{font-size:.85rem;margin:.4rem 0 0}

footer{padding-block:clamp(3.5rem,7vw,6rem) 2.5rem;border-top:1px solid var(--go)}
.ft{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:3rem}
.ft img{height:2.6rem;width:auto}.st{font:italic 400 1.7rem var(--serif);margin:1.2rem 0 0}
.ft h4{font:500 .9rem var(--sans);color:var(--mu);margin:0 0 1rem}
.ft ul{list-style:none;margin:0;padding:0;display:grid;gap:.55rem;justify-items:start}
.ft a{color:inherit;text-decoration:none}.ft a:hover{text-decoration:underline;text-decoration-color:var(--go);text-underline-offset:4px}
.todo{border-bottom:1px dashed var(--mu);color:var(--mu)}
.legal{margin-top:3.5rem;padding-top:1.5rem;border-top:1px solid var(--be);display:flex;flex-wrap:wrap;gap:.6rem 2rem;justify-content:space-between;font-size:.85rem;color:var(--mu)}

dialog{border:0;padding:2rem;max-width:min(92vw,50rem);max-height:88vh;background:var(--iv);color:var(--ink)}
dialog::backdrop{background:rgba(38,39,34,.6)}
#lb{padding:0;background:var(--wh)}#lb img{max-height:72vh;width:auto;max-width:100%;margin:auto}#lb p{margin:0;padding:1rem 1.5rem;font-size:.95rem}
.x{position:absolute;top:.5rem;right:.6rem;width:2.5rem;height:2.5rem;font-size:1.8rem;line-height:1;background:rgba(248,245,237,.92);border:0;cursor:pointer;color:var(--ink)}
#priv h2{font-size:2.2rem;margin-bottom:1rem}#priv p{font-size:.95rem;color:var(--mu)}

@media(prefers-reduced-motion:no-preference){
.js .rv{opacity:0;transform:translateY(18px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.js .rv.in{opacity:1;transform:none}}

@media(max-width:860px){
.hd-cta{display:none}.burger{display:block}
nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;background:var(--iv);padding:.3rem var(--gx) 1.2rem;border-bottom:1px solid var(--be)}
nav.open{display:flex}nav a{padding:.95rem 0;font-size:1.1rem;border-bottom:1px solid var(--be)}nav a::after{display:none}
.origin,.proc-in,.nl-in,.ft{grid-template-columns:1fr}
.pr-i{grid-column:1;grid-row:auto;margin-bottom:2rem}.steps{grid-column:1}
.o-i img{aspect-ratio:4/3.4}}

/* Izdelki */
.pg{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2.5vw,2rem)}
.pc{display:flex;flex-direction:column}.pc .ph{aspect-ratio:4/5}
.pc figcaption{padding-top:1rem;max-width:none;display:flex;flex-direction:column;flex:1}
.pc h3{font-size:1.5rem}.pc p{font-size:.95rem;margin:.4rem 0 .9rem}.pc .more{align-self:flex-start;margin-top:auto}
/* Zgodba */
.origin{align-items:start}.o-i{position:sticky;top:6rem}
.o-t .tag{margin-bottom:1rem}.o-t .quote{font:italic 400 clamp(1.4rem,2.4vw,1.9rem)/1.3 var(--serif);color:var(--ink);margin-top:2rem;padding-top:1.6rem;border-top:1px solid var(--go)}
/* Postopek */
.pr-top{max-width:46rem;margin-bottom:clamp(2.5rem,5vw,4rem)}.pr-top .big{font-size:1.2rem;color:var(--ink);margin:1.4rem 0 0}
.pr-in{display:grid;grid-template-columns:6fr 5fr;gap:clamp(2rem,6vw,6rem);align-items:start}
.pr-in .steps{grid-column:auto}.pr-in figure{margin:0;position:sticky;top:6rem}
.pr-in figure img{width:100%;aspect-ratio:3/4;object-fit:cover}.pr-in figcaption{font-size:.9rem;color:var(--mu);padding-top:.8rem}
.cmp{width:100%;border-collapse:collapse;margin-top:clamp(3rem,6vw,5rem)}
.cmp caption{text-align:left;font:500 clamp(1.8rem,3vw,2.4rem)/1.1 var(--serif);padding-bottom:1.2rem}
.cmp th,.cmp td{text-align:left;padding:1rem 1rem 1rem 0;border-top:1px solid var(--be);vertical-align:top}
.cmp thead th{font-size:.9rem;color:var(--mu);font-weight:500}.cmp tbody th{font-weight:500;width:26%}
.use{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.2rem,3vw,3rem);margin-top:clamp(3rem,6vw,5rem);padding-top:2rem;border-top:1px solid var(--go)}
.use h3{font-size:1.5rem;margin-bottom:.5rem}.use p{margin:0;color:var(--mu);font-size:.98rem}
/* Povpraševanje */
.inq{background:var(--wh)}.inq-in{display:grid;grid-template-columns:5fr 6fr;gap:clamp(2rem,6vw,6rem);align-items:start}
.inq p{color:var(--mu)}.inq h2+p{margin:1.2rem 0 1.6rem;max-width:30rem}
.how{list-style:none;margin:0;padding:0;counter-reset:h;display:grid;gap:.8rem}
.how li{counter-increment:h;padding-left:2.2rem;position:relative}.how li::before{content:counter(h);position:absolute;left:0;font:italic 500 1.4rem/1.2 var(--serif)}
#inq{display:grid;gap:1.4rem}#inq fieldset{border:0;padding:0;margin:0}
#inq legend{font-size:.9rem;color:var(--mu);margin-bottom:.6rem;padding:0}
#inq fieldset label{display:inline-flex;gap:.55rem;align-items:center;margin:0 1.4rem .5rem 0}
#inq input[type=checkbox],#inq input[type=radio]{accent-color:var(--ink);width:1.05rem;height:1.05rem}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
#inq>label,.f2 label{display:grid;gap:.4rem;font-size:.9rem;color:var(--mu)}
#inq input:not([type=checkbox]):not([type=radio]),#inq textarea{font:inherit;color:var(--ink);padding:.9rem 1rem;background:var(--iv);border:1px solid var(--be);width:100%;min-width:0}
#inq .btn{justify-self:start}#inq-msg{min-height:1.4rem;margin:0;color:var(--ink);font-size:.95rem}
@media(max-width:860px){
.pg{grid-template-columns:1fr 1fr}.o-i,.pr-in figure{position:static}
.pr-in,.inq-in,.use,.f2{grid-template-columns:1fr}.cmp tbody th{width:auto}}

.o-i{margin:0}.o-i img{object-position:50% 25%}.o-i figcaption{font-size:.9rem;color:var(--mu);padding-top:.8rem}

/* Izdelki: enake velikosti, 3 + 2 na sredini */
.pg{grid-template-columns:repeat(6,1fr)}
.pc{grid-column:span 2}.pc .ph{aspect-ratio:4/5}
.pc:nth-child(4){grid-column:2/4}.pc:nth-child(5){grid-column:4/6}
.pc .pair{color:var(--ink);padding-top:.7rem;border-top:1px solid var(--be);margin:0 0 1rem}
@media(max-width:860px){.pg{grid-template-columns:repeat(4,1fr)}.pc,.pc:nth-child(4){grid-column:span 2}.pc:nth-child(5){grid-column:2/4}}
@media(max-width:560px){.pg{grid-template-columns:1fr}.pc,.pc:nth-child(4),.pc:nth-child(5){grid-column:auto}}


/* ============ HERO: animacija čez cel zaslon, napisi na animaciji ============ */
.sh{--glow:0 0 28px rgba(246,236,224,.85),0 0 3px rgba(246,236,224,.6);position:relative;background:#CFAE93;margin-top:calc(-1 * var(--hdh,5.4rem))}
.js .sh{height:560vh}
.sh-stage{position:relative;height:100svh;min-height:34rem;overflow:hidden;isolation:isolate}
.js .sh-stage{position:sticky;top:0}
.sh-amb{position:absolute;inset:-10%;width:120%;height:120%;z-index:-3;filter:blur(36px) saturate(1.15);display:none}
.sh-media{position:absolute;inset:0;z-index:-2;background:#CFAE93 url(../img/hero-poster.jpg) center/cover no-repeat}
.sh-video{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 55%}
.sh-media::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(246,238,228,.55) 0%,rgba(246,238,228,0) 18%),linear-gradient(0deg,rgba(222,198,176,.55) 0%,rgba(222,198,176,0) 32%)}
.sh-caps{position:absolute;inset:0;padding:calc(var(--hdh,5.4rem) + 2rem) var(--gx) clamp(2.5rem,7vh,5rem);pointer-events:none}
.sh-cap{position:absolute;max-width:min(40rem,48vw);color:var(--ink);text-shadow:var(--glow)}
.sh-cap::before{content:"";position:absolute;inset:-35% -30%;z-index:-1;background:radial-gradient(closest-side,rgba(244,233,220,.62),rgba(244,233,220,0));opacity:var(--a,0);pointer-events:none}
.sh-cap h1{font-size:clamp(3.4rem,8.4vw,8.6rem);line-height:.92;letter-spacing:-.02em}
.sh-cap h2{font-size:clamp(2.8rem,6.2vw,6.4rem);line-height:.95;letter-spacing:-.015em}
.sh-cap .tag{color:var(--ink);margin-bottom:1rem;font-weight:500}
.sh-cap .lead{color:var(--ink);font-weight:500;max-width:30rem;margin:1.4rem 0 0}
.sh-cap .cta{margin-top:1.8rem}.sh-cap .btn{text-shadow:none}
.sh-cap .w{display:inline-block;will-change:transform,opacity}
.js .sh-cap{visibility:hidden}.js .sh-cap.on{visibility:visible}
.js .sh-cap.on.live{pointer-events:auto}
.js .sh-cap .sub{opacity:var(--s,0);transform:translateY(calc((1 - var(--s,0)) * 14px))}
/* položaji napisov glede na prazen prostor v kadru */
.p-bl{left:var(--gx);bottom:clamp(3rem,9vh,6rem)}
.p-br{right:var(--gx);bottom:clamp(3rem,9vh,6rem);text-align:right}.p-br .lead{margin-left:auto}.p-br .tag{padding-left:0;padding-right:1.9rem}.p-br .tag::before{left:auto;right:0}
.p-split{inset:0;max-width:none}
.p-split h2{font-size:clamp(2.6rem,4.9vw,5.2rem);white-space:nowrap;position:absolute;left:0;right:0;top:44%;display:flex;justify-content:space-between;gap:34vw;padding-inline:var(--gx)}
.p-split h2 .half{flex:1 1 0;display:block}.p-split h2 .half:last-child{text-align:right}
.p-split .tag{position:absolute;left:var(--gx);top:calc(44% - 2.6rem)}
.p-split .foot{position:absolute;left:var(--gx);bottom:clamp(3rem,9vh,6rem);max-width:24rem}
.p-split .foot .lead{margin-top:0}
html:not(.js) .sh-cap:not(:first-child),html:not(.js) .sh-steps,html:not(.js) .sh-hint{display:none}
/* faze */
.sh-steps{position:absolute;left:50%;bottom:max(.9rem,env(safe-area-inset-bottom,0px));transform:translateX(-50%);display:grid;grid-auto-flow:column;gap:.4rem}
.sh-steps button{position:relative;background:none;border:0;cursor:pointer;font:500 .8rem var(--sans);letter-spacing:.04em;color:rgba(38,39,34,.62);text-shadow:var(--glow);padding:.5rem .6rem .5rem 1.5rem;min-height:44px;white-space:nowrap;transition:color .4s}
.sh-steps button::after{content:"";position:absolute;left:.5rem;top:50%;width:.45rem;height:.45rem;margin-top:-.225rem;border-radius:50%;border:1px solid currentColor;transition:background .4s,transform .4s}
.sh-steps button.on,.sh-steps button:hover{color:var(--ink)}.sh-steps button.on::after{background:var(--ink);transform:scale(1.25)}
.sh-bar{display:none}
.sh-hint{position:absolute;left:50%;bottom:4.4rem;transform:translateX(-50%);margin:0;font-size:.8rem;letter-spacing:.08em;color:var(--ink);text-shadow:var(--glow);padding-bottom:2.4rem;transition:opacity .5s}
.sh-hint::after{content:"";position:absolute;left:50%;bottom:0;width:1px;height:1.8rem;background:var(--ink);transform-origin:top;animation:shHint 2s ease-in-out infinite}
.sh.moved .sh-hint{opacity:0}
@keyframes shHint{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(0);transform-origin:bottom}}
/* glava je nad animacijo prosojna */
.hd.ov{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}
@media(prefers-reduced-motion:reduce){.sh-hint::after{animation:none}}

@media(max-width:860px){
.js .sh{height:470vh}
.sh-amb{display:block}
.sh-media{inset:auto 0;top:calc(var(--hdh,4.6rem) + 1.5svh);height:min(72vw,52svh);background-color:transparent;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 10%,#000 76%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 10%,#000 76%,transparent 100%)}
.sh-media::after{display:none}
.sh-caps{padding:0}
.sh-cap,.p-bl,.p-br,.p-split{left:var(--gx);right:var(--gx);bottom:calc(4.6rem + env(safe-area-inset-bottom,0px));top:auto;max-width:none;text-align:left}
.p-br .lead{margin-left:0}.p-br .tag{padding-left:1.9rem;padding-right:0}.p-br .tag::before{left:0;right:auto}
.sh-cap h1{font-size:clamp(3rem,14vw,4.6rem)}
.sh-cap h2{font-size:clamp(2.5rem,11vw,3.8rem)}
.sh-cap .lead{font-size:1rem;margin-top:.9rem}
.sh-cap .cta{margin-top:1.2rem;gap:1.2rem}
.p-split h2,.p-split .tag,.p-split .foot{position:static;display:block;padding:0;white-space:normal;font-size:inherit}.p-split h2{font-size:clamp(2.5rem,11vw,3.8rem)}
.p-split h2 .half,.p-split h2 .half:last-child{display:inline;text-align:left}
.p-split .tag{margin-bottom:.8rem}.p-split .foot{margin-top:.9rem}
.sh-steps{top:auto;right:var(--gx);left:var(--gx);bottom:max(.8rem,env(safe-area-inset-bottom,0px));transform:none;grid-auto-flow:row;grid-template-columns:repeat(4,auto);justify-content:space-between;gap:0}
.sh-steps button{padding:1.1rem 0 .4rem;font-size:.72rem;white-space:nowrap}
.sh-steps button::after{display:none}
.sh-bar{display:block;position:absolute;left:0;right:0;top:0;height:2px;background:rgba(38,39,34,.15)}
.sh-bar b{display:block;height:100%;background:var(--ink);transform:scaleX(var(--p,0));transform-origin:left}
.sh-hint{display:none}}
@media(max-width:860px) and (max-height:700px){.sh-media{height:min(68vw,44svh)}.sh-cap h1{font-size:2.7rem}.sh-cap h2{font-size:2.3rem}.sh-cap .lead{font-size:.93rem}}
@media(max-width:860px) and (max-height:620px){.sh-cap .lead{display:none}.sh-cap .cta .link{display:none}}
@media(max-width:380px){.sh-steps button{font-size:.66rem}}