/* Product page (filtri-za-vodo.html) — same system as index: navy / gold / cream, glass cards, dusk background */
body.pdp{background:#0c243a}
.pdp-bg{position:fixed;inset:0;z-index:0;background:#0c243a url(../img/filter_bg.jpg) center/cover no-repeat;background-image:image-set(url(../img/filter_bg.webp) type("image/webp"),url(../img/filter_bg.jpg) type("image/jpeg"))}
.pdp-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 55% at 32% 46%,rgba(255,206,130,.16),rgba(255,206,130,0) 70%),linear-gradient(to bottom,rgba(10,30,50,0) 60%,rgba(10,30,50,.55))}
.pdp main{position:relative;z-index:1;padding-top:96px}
.crumbs{max-width:1240px;margin:0 auto;padding:6px clamp(18px,4vw,56px) 0;font-size:12px;letter-spacing:.08em;color:rgba(248,244,236,.65)}
.crumbs a{color:rgba(248,244,236,.8)}.crumbs a:hover{color:#fff}.crumbs b{color:var(--gold);font-weight:400}
.pdp-hero{max-width:1240px;margin:0 auto;padding:8px clamp(18px,4vw,56px) 40px;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.9fr);gap:clamp(18px,3vw,48px);align-items:center}
.stage{position:relative;height:min(84vh,820px);min-height:520px;touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none;outline:none}
.stage:active{cursor:grabbing}
.stage .still{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:opacity .5s;pointer-events:none}
.stage.live .still{opacity:0}
.stage.live:not(.ready) .still{opacity:1}
.f3d-canvas{position:absolute;left:0;top:0;display:block;opacity:0;transition:opacity .6s}
.stage .still.x{opacity:0}
.stage.static.sx .still{opacity:0}.stage.static.sx .still.x{opacity:1}
.stage.live .f3d-canvas{opacity:1}
.f3d-labels{position:absolute;inset:0;pointer-events:none;overflow:visible}
.stage.static .f3d-labels{opacity:0;transition:opacity .4s .25s}.stage.static .f3d-labels.on{opacity:1}
.f3d-leads{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.f3d-leads path{fill:none;stroke:rgba(223,188,119,.7);stroke-width:1}
.f3d-leads circle{fill:rgba(236,205,140,.95)}
.f3d-lab{position:absolute;left:0;top:0;box-sizing:border-box;font-size:12px;line-height:1.35;color:rgba(248,244,236,.84);text-align:left;will-change:transform}
.f3d-lab.l{text-align:right}
.f3d-lab b{display:block;font:700 10.5px/1.3 "DV Sans";letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:2px}
.f3d-lab b,.f3d-lab span{text-shadow:0 1px 6px rgba(8,16,30,.75)}
.f3d-lab span{display:block}
.stage-hint .tap{display:none}
@media not (hover:hover){.stage-hint .hov{display:none}.stage-hint .tap{display:inline}}
.stage-hint{position:absolute;left:50%;bottom:6px;transform:translateX(-50%);font-size:12px;letter-spacing:.06em;color:rgba(248,244,236,.6);white-space:nowrap;pointer-events:none;transition:opacity .4s}
.xbtn{position:absolute;z-index:3;right:8px;bottom:0;display:none;background:rgba(12,36,58,.6);color:var(--cream);border:1px solid rgba(223,188,119,.45);border-radius:999px;padding:8px 16px;font:12px "DV Sans";letter-spacing:.08em;cursor:pointer}
.reduced .xbtn,.static .xbtn{display:block}
.static .stage-hint,.reduced .stage-hint{left:10px;transform:none}
.static{cursor:pointer}.static:active{cursor:pointer}
.buy.card{width:auto}
.buy h1{font:400 clamp(26px,2.5vw,36px)/1.2 "DV Serif";margin:0 0 12px;color:#fff}
.lede{color:rgba(248,244,236,.85);margin:0 0 18px}
.price-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:6px 0 16px}
.price-row .price{font:400 30px "DV Serif";color:#fff}
.akcija{background:linear-gradient(135deg,#e9c98a,#c99a45);color:#0d2a43;border-radius:999px;padding:6px 12px;font-size:12.5px;letter-spacing:.04em}
.akcija b{text-transform:uppercase;letter-spacing:.14em;font-size:10.5px;margin-right:4px}
.ticks{list-style:none;padding:0;margin:0 0 22px}
.ticks li{position:relative;padding:7px 0 7px 26px;border-top:1px solid rgba(223,188,119,.18);font-size:14.5px}
.ticks li::before{content:"";position:absolute;left:4px;top:15px;width:9px;height:5px;border-left:1.5px solid var(--gold);border-bottom:1.5px solid var(--gold);transform:rotate(-45deg)}
.buy-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.qty{display:flex;align-items:center;border:1px solid rgba(223,188,119,.45);border-radius:999px;overflow:hidden}
.qty button{background:none;border:0;color:var(--cream);width:40px;height:44px;font-size:18px;cursor:pointer}
.qty button:hover{background:rgba(223,188,119,.12)}
.qty input{width:42px;height:44px;border:0;background:transparent;color:#fff;text-align:center;font:16px "DV Sans";-moz-appearance:textfield}
.qty input::-webkit-inner-spin-button,.qty input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.pdp-sec{max-width:1240px;margin:0 auto;padding:16px clamp(18px,4vw,56px)}
.pdp-sec .card-wide{width:auto}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.grid4 h3,.steps3 h3{font:400 18px/1.3 "DV Serif";color:#fff;margin:0 0 6px}
.grid4 p,.steps3 p{margin:0;font-size:14px;color:rgba(248,244,236,.78)}
.grid4>div{padding-top:14px;border-top:1px solid rgba(223,188,119,.3)}
.steps3{list-style:none;padding:0;margin:0 0 14px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.steps3 li>b{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid var(--gold);color:var(--gold);font:400 17px "DV Serif";margin-bottom:12px}
.faq details{border-top:1px solid rgba(223,188,119,.22);padding:12px 0}
.faq summary{cursor:pointer;font:400 17px "DV Serif";color:#fff;list-style:none;position:relative;padding-right:30px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:-2px;color:var(--gold);font:300 22px "DV Sans";transition:transform .25s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:8px 0 0;color:rgba(248,244,236,.78);font-size:14.5px}
.menu a[aria-current]{border-bottom-color:var(--gold)}
@media (max-width:899px){
  .f3d-lab{font-size:11px;line-height:1.3}.f3d-lab b{font-size:9.5px;letter-spacing:.1em}
  .pdp main{padding-top:78px}
  .pdp-hero{grid-template-columns:minmax(0,1fr);padding-top:0}
  .stage{height:68vh;min-height:440px}
  .grid4{grid-template-columns:1fr 1fr}
  .steps3{grid-template-columns:1fr}
}
.stage.snap .still,.stage.snap .f3d-canvas{transition:none!important}
@media (prefers-reduced-motion:reduce){.f3d-canvas,.stage .still,.f3d-labels,.stage.static .f3d-labels{transition:none}}

/* ---- category page + cross-links ---- */
.cat-hero{max-width:1240px;margin:0 auto;padding:10px clamp(18px,4vw,56px) 8px}
.cat-hero h1{font:400 clamp(34px,4.4vw,56px)/1.1 "DV Serif";color:#fff;margin:4px 0 10px}
.cat-hero .lede{max-width:640px;color:rgba(248,244,236,.82)}
.cat-grid{max-width:1240px;margin:0 auto;padding:18px clamp(18px,4vw,56px) 30px;display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,32px)}
.pcard{display:grid;grid-template-columns:minmax(150px,40%) 1fr;gap:18px;align-items:center;background:rgba(10,30,50,.55);border:1px solid rgba(223,188,119,.25);border-radius:20px;padding:18px 22px 18px 8px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.pcard{transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.pcard:hover{transform:translateY(-2px);border-color:rgba(223,188,119,.45);box-shadow:0 24px 56px rgba(3,12,24,.4)}
.pcard .pimg{display:block;aspect-ratio:.64;position:relative}
.pcard .pimg::before{content:"";position:absolute;inset:12% 6% 6%;border-radius:50%;background:radial-gradient(closest-side,rgba(223,188,119,.26),rgba(223,188,119,.07) 60%,rgba(223,188,119,0));opacity:.75;transition:opacity .25s ease}
.pcard:hover .pimg::before{opacity:1}
.pcard .pimg img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:transform .25s ease}
.pcard:hover .pimg img{transform:translateY(-4px) rotate(-1.5deg)}
.pcard h2{font:400 22px/1.25 "DV Serif";margin:2px 0 8px}.pcard h2 a{color:#fff}
.pcard p{color:rgba(248,244,236,.8);font-size:14.5px;margin:0 0 8px}
.pcard .price{font-size:24px}
.pact{display:flex;flex-direction:column;align-items:stretch;gap:4px;margin-top:16px;max-width:320px}.pact .add{width:100%}.pact .more{justify-content:center}   /* narrow card body: stacked, full-width primary */
.cmp{display:grid;gap:0;font-size:14px}
.cmp .r{display:grid;grid-template-columns:150px 1fr 1fr;gap:16px;padding:10px 0;border-bottom:1px solid rgba(223,188,119,.18);color:rgba(248,244,236,.85)}
.cmp .r.h{font:700 11px "DV Sans";letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.cmp [role=rowheader]{color:var(--gold);font-weight:700}
.intro{color:rgba(248,244,236,.82);max-width:760px;margin:0 0 18px}
@media (max-width:899px){
  .cat-grid{grid-template-columns:1fr}
  .pcard{grid-template-columns:120px 1fr;padding:14px 14px 14px 4px;gap:10px}
  .pcard h2{font-size:19px}
  .cmp .r{grid-template-columns:90px 1fr 1fr;gap:10px;font-size:13px}
}

/* Dermaclean: cooler, silvery accent behind the dark chrome model */
.pdp-derma .pdp-bg::after{background:radial-gradient(55% 50% at 32% 46%,rgba(170,200,255,.14),rgba(170,200,255,0) 70%),radial-gradient(30% 40% at 30% 50%,rgba(255,214,150,.07),rgba(255,214,150,0) 70%),linear-gradient(to bottom,rgba(10,30,50,0) 60%,rgba(10,30,50,.6))}
.pcard.derma .pimg{filter:drop-shadow(0 0 18px rgba(170,200,255,.18))}

/* ---- "Poglejte tudi" cross-link card: glass card, render on a navy tile with a soft gold glow ---- */
.xprod{position:relative;display:grid;grid-template-columns:clamp(180px,24%,250px) 1fr;gap:clamp(24px,4vw,52px);align-items:center;
  padding:clamp(22px,3vw,36px);border-radius:20px;border:1px solid rgba(223,188,119,.22);
  background:linear-gradient(155deg,rgba(255,255,255,.075),rgba(255,255,255,.015) 55%),rgba(12,34,56,.58);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 18px 46px rgba(3,12,24,.32),inset 0 1px 0 rgba(255,255,255,.05);
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.xprod:hover{transform:translateY(-2px);border-color:rgba(223,188,119,.45);box-shadow:0 26px 60px rgba(3,12,24,.42),inset 0 1px 0 rgba(255,255,255,.07)}
.xph{position:relative;display:block;aspect-ratio:4/5;border-radius:14px;overflow:hidden;border:1px solid rgba(223,188,119,.16);
  background:linear-gradient(165deg,#173d60,#0a2036 78%)}
.xph::before{content:"";position:absolute;inset:0;background:radial-gradient(48% 46% at 50% 54%,rgba(223,188,119,.46),rgba(223,188,119,.12) 52%,rgba(223,188,119,0) 76%);opacity:.8;transition:opacity .25s ease}
.xprod:hover .xph::before{opacity:1}
.xph img{position:absolute;left:0;top:9%;width:100%;height:82%;object-fit:contain;filter:drop-shadow(0 14px 16px rgba(0,0,0,.45));transition:transform .25s ease}
.xprod:hover .xph img{transform:translateY(-4px) rotate(-2deg)}
.pdp-derma .xph img,.xph img[src*="derma"]{filter:drop-shadow(0 14px 16px rgba(0,0,0,.5)) drop-shadow(0 0 10px rgba(190,215,255,.16))}
.xbody .eyebrow{margin:0 0 10px}
.xname{font:400 clamp(21px,2.1vw,27px)/1.25 "DV Serif";margin:0 0 10px;color:#fff}
.xname a{color:#fff}
.xdesc{margin:0 0 22px;max-width:62ch;font-size:14.5px;line-height:1.6;color:rgba(248,244,236,.68);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.xfoot{display:flex;align-items:center;justify-content:space-between;gap:14px 24px;flex-wrap:wrap;padding-top:20px;border-top:1px solid rgba(223,188,119,.14)}
.xfoot .price{font:400 28px/1 "DV Serif";color:#fff;letter-spacing:.01em}
.xact{display:flex;align-items:center;gap:26px}
@media (max-width:699px){
  .xprod{grid-template-columns:minmax(0,1fr);gap:20px;padding:18px 18px 20px}
  .xph{aspect-ratio:16/11}
  .xph img{top:7%;height:86%}
  .xfoot{flex-direction:column;align-items:stretch}
  .xact{flex-direction:column-reverse;align-items:stretch;gap:4px}
  .xact .add{width:100%}.xact .more{justify-content:center}
  .xfoot .price.inq{font-size:clamp(20px,6vw,26px)}
  .pact{max-width:none}
  .pcard{grid-template-columns:1fr;padding:18px;gap:12px}
  .pcard .pimg{aspect-ratio:auto;height:250px}
}
@media (prefers-reduced-motion:reduce){
  .xprod,.xph::before,.xph img,.pcard,.pcard .pimg::before,.pcard .pimg img{transition:none!important}
  .xprod:hover,.pcard:hover,.xprod:hover .xph img,.pcard:hover .pimg img{transform:none!important}}

/* ---- Microcare (wide soft product): full-width landscape stage, buy card below in two columns ---- */
.pdp-micro .pdp-bg::after{background:radial-gradient(62% 46% at 50% 40%,rgba(255,206,130,.15),rgba(255,206,130,0) 70%),linear-gradient(to bottom,rgba(10,30,50,0) 60%,rgba(10,30,50,.55))}
.pdp-micro .pdp-hero{grid-template-columns:1fr;gap:clamp(14px,2vw,22px);align-items:start}
.pdp-micro .stage{height:min(66vh,620px);min-height:440px}
.pdp-micro .buy.card{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.85fr);gap:clamp(20px,4vw,56px);align-items:center}
.pdp-micro .ticks{margin-bottom:0}
.price-inq{font-size:clamp(24px,2.2vw,28px)!important}
.avail{display:flex;align-items:center;gap:8px;margin:-4px 0 18px;font-size:13.5px;color:rgba(248,244,236,.78)}
.avail .dot{width:8px;height:8px;border-radius:50%;background:#8fd19e;box-shadow:0 0 0 3px rgba(143,209,158,.18);flex:none}
.f3d-legend{display:none}
.f3d-num{position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;visibility:hidden;
  background:linear-gradient(135deg,#ecd39c,#c99a45);color:#0d2a43;font:700 11px/1 "DV Sans";box-shadow:0 2px 8px rgba(3,12,24,.45);will-change:transform}
.photo-split{display:grid;grid-template-columns:minmax(200px,300px) 1fr;gap:clamp(22px,4vw,52px);align-items:center}
.real-photo{margin:0}
.real-photo img{display:block;width:100%;height:auto;border-radius:14px;border:1px solid rgba(223,188,119,.22);box-shadow:0 18px 40px rgba(3,12,24,.35)}
.real-photo figcaption{margin-top:10px;font-size:12px;line-height:1.5;color:rgba(248,244,236,.6)}
.specs{margin:0;display:grid;gap:0}
.specs>div{display:grid;grid-template-columns:130px 1fr;gap:14px;padding:9px 0;border-top:1px solid rgba(223,188,119,.18);font-size:14px}
.specs dt{color:var(--gold);font:700 11px/1.9 "DV Sans";letter-spacing:.12em;text-transform:uppercase}
.specs dd{margin:0;color:rgba(248,244,236,.86)}
.ext-i{display:inline-block;margin-left:.3em;font-size:.82em;color:var(--gold);transform:translateY(-.05em)}
/* real product photos on the premium navy tile (no cut-out available): inset photo, hairline, soft gold glow */
.xph.photo{background:linear-gradient(165deg,#173d60,#0a2036 78%)}
.xph.photo img{inset:9%;left:9%;top:9%;width:82%;height:82%;object-fit:cover;border-radius:10px;filter:none;box-shadow:0 16px 30px rgba(0,0,0,.45),0 0 0 1px rgba(223,188,119,.22)}
.xprod:hover .xph.photo img{transform:translateY(-3px)}
@media (max-width:899px){
  .pdp-micro .buy.card{grid-template-columns:1fr;gap:6px}
  .photo-split{grid-template-columns:1fr}
  .real-photo{max-width:340px}
  .f3d-legend{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px 14px;margin:-4px 0 4px;padding:0;list-style:none;counter-reset:lg}
  .f3d-legend li{counter-increment:lg;position:relative;padding-left:28px;font-size:12px;line-height:1.35;color:rgba(248,244,236,.72)}
  .f3d-legend li::before{content:counter(lg);position:absolute;left:0;top:1px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#ecd39c,#c99a45);color:#0d2a43;font:700 11px/1 "DV Sans"}
  .f3d-legend b{display:block;font-weight:700;color:#fff;font-size:12px}
}
@media (max-width:639px){
  .pdp-micro .stage{height:calc((100vw - 36px)/1.25 + 64px);min-height:0}
  .specs>div{grid-template-columns:100px 1fr}
}

/* ---- Spalni program category: featured 3D card + premium dark tiles with real shop photos ---- */
.cat-feature{max-width:1240px;margin:0 auto;padding:18px clamp(18px,4vw,56px) 8px}
.pcard.wide{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);padding:18px 32px 18px 12px;gap:clamp(18px,3vw,40px)}
.pcard.wide .pimg{aspect-ratio:1.25}
.pcard.wide .pimg::before{inset:14% 4% 8%}
.pcard.wide:hover .pimg img{transform:translateY(-4px)}
.pcard.wide h2{font-size:clamp(24px,2.4vw,30px)}
.sgrid{max-width:1240px;margin:0 auto;padding:22px clamp(18px,4vw,56px) 10px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.2vw,28px)}
.scard{display:flex;flex-direction:column;border-radius:18px;overflow:hidden;border:1px solid rgba(223,188,119,.2);
  background:linear-gradient(155deg,rgba(255,255,255,.06),rgba(255,255,255,.01) 55%),rgba(12,34,56,.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  box-shadow:0 14px 36px rgba(3,12,24,.28);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.scard:hover{transform:translateY(-2px);border-color:rgba(223,188,119,.42);box-shadow:0 22px 50px rgba(3,12,24,.4)}
.sph{position:relative;display:block;aspect-ratio:4/3;background:linear-gradient(165deg,#173d60,#0a2036 78%);overflow:hidden}
.sph::before{content:"";position:absolute;inset:0;background:radial-gradient(52% 50% at 50% 55%,rgba(223,188,119,.34),rgba(223,188,119,0) 74%);opacity:.8;transition:opacity .25s}
.scard:hover .sph::before{opacity:1}
.sph img{position:absolute;left:10%;top:10%;width:80%;height:80%;object-fit:cover;border-radius:10px;box-shadow:0 14px 28px rgba(0,0,0,.45),0 0 0 1px rgba(223,188,119,.22);transition:transform .25s ease}
.scard:hover .sph img{transform:translateY(-3px)}
.sbody{display:flex;flex-direction:column;flex:1;padding:18px 20px 18px}
.sbody .eyebrow{margin:0 0 6px}
.sbody h3{font:400 19px/1.3 "DV Serif";margin:0 0 8px}.sbody h3 a{color:#fff}
.sdesc{margin:0 0 14px;font-size:13.5px;line-height:1.55;color:rgba(248,244,236,.7);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sfoot{margin-top:auto;padding-top:14px;border-top:1px solid rgba(223,188,119,.14);display:flex;flex-direction:column;gap:10px}
.sfoot .price{font:400 22px/1 "DV Serif";color:#fff}.sfoot .price.inq{font-size:17px;color:rgba(248,244,236,.9)}
.sact{display:flex;flex-direction:column;align-items:stretch;gap:2px}.sact .add{width:100%}.sact .more{justify-content:center}
.cat-note{max-width:1240px;margin:0 auto;padding:6px clamp(18px,4vw,56px) 20px;font-size:12.5px;color:rgba(248,244,236,.55)}
@media (max-width:1023px){.sgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:899px){.pcard.wide{grid-template-columns:1fr;padding:16px}.pcard.wide .pimg{aspect-ratio:1.25;height:auto}}
@media (max-width:599px){.sgrid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.scard,.sph::before,.sph img{transition:none!important}.scard:hover,.scard:hover .sph img{transform:none!important}}
@media (max-width:599px){
  .scard{display:grid;grid-template-columns:112px minmax(0,1fr)}
  .sph{aspect-ratio:auto;height:100%;min-height:150px}
  .sph img{left:10px;top:12px;width:calc(100% - 20px);height:calc(100% - 24px)}
  .sbody{padding:14px 14px 14px 12px}
  .sbody h3{font-size:17px}
  .sdesc{font-size:13px;margin-bottom:10px}
  .sfoot{padding-top:10px;gap:6px}
  .sact .more{justify-content:flex-start}
}
/* ---- shop pages (category + product pages generated by tools/buildshop.py) ---- */
.nw{white-space:nowrap}
.price,.was,.badge-disc{white-space:nowrap}
.price.inq{white-space:normal}@media (max-width:599px){.buy .price.inq{font-size:clamp(22px,6.6vw,28px)}}
.shop-hero{align-items:start}
.gal{display:flex;flex-direction:column;gap:12px;min-width:0}
.gal-main{position:relative;aspect-ratio:1/1;border-radius:18px;overflow:hidden;border:1px solid rgba(223,188,119,.2);
  background:radial-gradient(52% 50% at 50% 50%,rgba(223,188,119,.26),rgba(223,188,119,0) 72%),linear-gradient(165deg,#173d60,#0a2036 78%);box-shadow:0 26px 60px rgba(3,12,24,.4)}
.gal-main.tile{background:#0d1a33}
.gal-main.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gal-main.photo{display:grid;place-items:center;padding:7%;grid-template:minmax(0,1fr)/minmax(0,1fr)}
.gal-main.photo img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;border-radius:12px;box-shadow:0 16px 30px rgba(0,0,0,.45),0 0 0 1px rgba(223,188,119,.22)}
.gal-thumbs{display:flex;gap:10px;flex-wrap:wrap}
.gthumb{width:72px;height:72px;padding:0;border-radius:10px;overflow:hidden;border:1px solid rgba(223,188,119,.25);background:#0f2a45;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.gthumb img{display:block;width:100%;height:100%;object-fit:cover}
.gthumb:hover{border-color:rgba(223,188,119,.6)}
.gthumb[aria-current="true"]{border-color:var(--gold);box-shadow:0 0 0 2px rgba(223,188,119,.45)}
.gthumb:focus-visible,.size:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.shop-hero .buy h1{overflow-wrap:anywhere}
.sizes{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 16px}
.size{min-width:72px;height:44px;padding:0 14px;border-radius:999px;border:1px solid rgba(223,188,119,.45);background:transparent;color:#fff;font:inherit;font-size:15px;cursor:pointer}
.size[aria-checked="true"]{background:var(--gold);border-color:var(--gold);color:#0b1f33}
.was{color:rgba(248,244,236,.55);font-size:17px}
.badge-disc{font:700 11px/1 "DV Sans";letter-spacing:.12em;padding:6px 10px;border-radius:999px;background:var(--gold);color:#0b1f33}
.specs.mini{margin-top:16px}
.prose h3{font:400 20px/1.3 "DV Serif";color:#fff;margin:22px 0 8px}
.prose p{max-width:78ch;color:rgba(248,244,236,.86)}
.prose .ticks{max-width:78ch;margin:4px 0 14px}
.scard{position:relative}
.sbadge{position:absolute;left:12px;top:12px;z-index:2;font:700 11px/1 "DV Sans";letter-spacing:.12em;padding:6px 10px;border-radius:999px;background:var(--gold);color:#0b1f33}
.sph.cut img{left:9%;top:9%;width:82%;height:82%;object-fit:contain;border-radius:0;box-shadow:none;filter:drop-shadow(0 12px 14px rgba(0,0,0,.45))}
.sfoot .was{font-size:14px;margin-left:6px}
.sact .btn{white-space:nowrap}
.cat-more{max-width:1240px;margin:0 auto;padding:12px clamp(18px,4vw,56px) 26px;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14px;color:rgba(248,244,236,.65)}
.cat-more a{color:rgba(248,244,236,.88)}
.cart-demo a{color:inherit;text-decoration:underline}
@media (max-width:899px){.gal-main{max-width:560px;width:100%;margin:0 auto}.gal-thumbs{justify-content:center}}
@media (max-width:599px){.sph.cut img{left:8px;top:12px;width:calc(100% - 16px);height:calc(100% - 24px)}.gthumb{width:60px;height:60px}}
.avail.out .dot{background:#e0b25a;box-shadow:0 0 0 3px rgba(224,178,90,.2)}
.photo-split.wide-fig{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}
.real-photo.render img{border-color:rgba(223,188,119,.18)}
@media (max-width:899px){.photo-split.wide-fig{grid-template-columns:1fr}.photo-split.wide-fig .real-photo{max-width:none}}
/* ---- photoreal style-B studio composites (real product pixels on a navy studio set): full-bleed photo, no extra glow or drop-shadow ---- */
.gal-main.studio{background:#0d1a33}
.gal-main.studio img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sph.studio::before,.xph.studio::before,.pcard .pimg.photo::before{display:none}
.sph.studio img{left:0;top:0;width:100%;height:100%;object-fit:cover;object-position:50% 46%;border-radius:0;box-shadow:none;filter:none}
.xph.studio img{left:0;top:0;width:100%;height:100%;object-fit:cover;object-position:50% 58%;filter:none}
.xprod:hover .xph.studio img{transform:scale(1.02)}
.scard:hover .sph.studio img{transform:scale(1.02)}
@media (max-width:599px){.sph.studio{background:#081527}.sph.studio img{left:-22%;top:0;width:144%;height:100%;object-fit:contain;object-position:50% 50%;-webkit-mask-image:linear-gradient(transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(transparent,#000 14%,#000 86%,transparent)}}
.pcard.wide .pimg.photo{aspect-ratio:16/9;align-self:center;border-radius:14px;overflow:hidden;border:1px solid rgba(223,188,119,.16)}
.pcard.wide .pimg.photo img{object-fit:cover}
.pcard.wide:hover .pimg.photo img{transform:scale(1.02)}


/* microcare hero + zgradba layout fix */
.pdp-micro .stage .still{z-index:1}
.pdp-micro .stage.live:not(.ready) .still{opacity:1!important}
.pdp-micro .stage.live.ready .still{opacity:0}
.pdp-micro .stage.live .f3d-canvas{z-index:2}
.pdp-micro .buy.card::before,
.photo-split.card::before,
.card.photo-split::before{grid-column:1 / -1;width:28px;margin:0 0 18px}
.pdp-sec .card.photo-split{width:100%;max-width:1120px;box-sizing:border-box}
.pdp-micro .photo-split.wide-fig{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(22px,4vw,52px);align-items:center}
.pdp-micro .photo-split.wide-fig .real-photo,
.pdp-micro .photo-split.wide-fig > div{min-width:0}
@media (max-width:899px){
  .pdp-micro .photo-split.wide-fig{grid-template-columns:1fr}
}

/* aloe vera visco pdp (reuses .pdp-micro chrome) + label/hint stacking above the still/canvas */
.pdp-micro .stage .f3d-labels,.pdp-micro .stage .stage-hint{z-index:3}
.pdp-aloe .buy.card::before,.pdp-aloe .photo-split::before{grid-column:1 / -1}
.pdp-aloe .photo-split.wide-fig .real-photo img{aspect-ratio:4/3;object-fit:cover}
.pdp-aloe .xfoot .price.inq{font-size:clamp(18px,1.8vw,22px);line-height:1.2}
@media (max-width:639px){.pdp-micro .stage.static .stage-hint,.pdp-micro .stage.reduced .stage-hint{right:112px;white-space:normal;line-height:1.35;bottom:4px}}

/* ---- 2026-10-07 range: illustrative-model note, orbit-only viewers, photo gallery under 3D shop pages ---- */
.f3d-note{margin:-6px 0 2px;font-size:12px;line-height:1.45;letter-spacing:.01em;color:rgba(248,244,236,.5);text-align:center}
.pdp-3d .stage.orbit{cursor:grab}
.stage [hidden]{display:none!important}
.pdp-3d .shop-gal .gal{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;max-width:760px;margin:6px auto 0}
.pdp-3d .shop-gal .gal-main{max-height:560px}
@media (max-width:899px){
  .pdp-micro .stage.orbit{height:calc(100vw - 36px + 24px);max-height:560px;min-height:0}
  .f3d-note{margin:-2px 0 0;font-size:12px}
}

/* filter pages (two-column hero): the illustrative note sits inside the stage, directly under the hover/tap hint */
.stage .f3d-note-in{position:absolute;left:50%;bottom:4px;transform:translateX(-50%);margin:0;width:max-content;max-width:calc(100% - 24px);pointer-events:none;z-index:3}
.stage:has(.f3d-note-in) .stage-hint{bottom:24px}
.static .f3d-note-in,.reduced .f3d-note-in{left:10px;transform:none;text-align:left}
@media (max-width:639px){.stage .f3d-note-in{white-space:normal;font-size:11.5px;bottom:2px}.stage:has(.f3d-note-in) .stage-hint{bottom:34px}}
/* ---------- legal pages + 404 (go-live) ---------- */
.legal{max-width:780px;margin:0 auto;padding:14px clamp(18px,4vw,56px) 48px;color:rgba(248,244,236,.88);font-size:16px;line-height:1.7}
.legal h1{font:400 clamp(32px,4.2vw,50px)/1.12 "DV Serif";color:#fff;margin:6px 0 22px}
.legal h2{font:400 clamp(21px,2.2vw,26px)/1.25 "DV Serif";color:var(--gold);margin:34px 0 10px}
.legal h3{font:700 16px/1.4 "DV Sans";color:#fff;margin:22px 0 6px}
.legal p,.legal ul{margin:0 0 14px}
.legal ul{padding-left:1.2em}
.legal li{margin:0 0 6px}
.legal b{color:#fff}
.legal .fine{font-size:13px;color:rgba(248,244,236,.65)}
.legal mark.todo{background:#f6d77a;color:#3a2a05;padding:1px 5px;border-radius:4px;font-size:.92em}
.legal-more{margin-top:34px!important;padding-top:18px;border-top:1px solid rgba(223,188,119,.22);font-size:14px}
.tbl-wrap{overflow-x:auto;margin:0 0 18px;-webkit-overflow-scrolling:touch}
.legal-tbl{width:100%;border-collapse:collapse;font-size:14px;line-height:1.5;min-width:560px}
.legal-tbl caption{text-align:left;font-size:13px;color:rgba(248,244,236,.65);padding-bottom:8px}
.legal-tbl th,.legal-tbl td{text-align:left;vertical-align:top;padding:10px 12px;border-bottom:1px solid rgba(223,188,119,.2)}
.legal-tbl th{color:var(--gold);font-weight:700}
.legal-tbl code{font-size:13px;color:#fff;word-break:break-all}
.nf{text-align:center;padding-top:40px;padding-bottom:80px}
.nf .lede{margin:0 auto 22px;max-width:520px}
.nf-links{list-style:none;padding:0!important;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 22px}
@media (max-width:639px){
  .legal-tbl{min-width:0}
  .legal-tbl thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .legal-tbl tr{display:block;padding:12px 0;border-bottom:1px solid rgba(223,188,119,.2)}
  .legal-tbl td{display:grid;grid-template-columns:6.5em 1fr;gap:10px;border:0;padding:3px 0}
  .legal-tbl td::before{content:attr(data-label);color:var(--gold);font-weight:700;font-size:13px}
}
/* withdrawal form page (obrazec-za-odstop.html, 2026-10-12) */
.legal-tbl.form-tbl{min-width:0}
.form-tbl th{width:42%;color:var(--gold)}
.form-tbl td.blank{height:44px;border-bottom:1px solid rgba(223,188,119,.45)}
@media (max-width:600px){.form-tbl th,.form-tbl td{display:block;width:auto}.form-tbl th{border-bottom:0;padding-bottom:2px}.form-tbl td.blank{height:40px}}