/* ============================================================
   מירב עיצובים — bright luxury
   ============================================================ */
:root{
  --bg:#FBF7F0;          /* warm ivory */
  --bg-soft:#F4EBDD;     /* deeper cream */
  --bg-blush:#F7E9E3;    /* blush wash */
  --paper:#FFFFFF;
  --ink:#241C16;         /* deep espresso text */
  --ink-soft:#857669;
  --gold:#9C7B3C;        /* antique gold */
  --gold-bright:#C2A05A;
  --rose:#CE9A8C;
  --line:rgba(36,28,22,.12);
  --line-soft:rgba(36,28,22,.06);
  --shadow:0 40px 90px -40px rgba(70,48,24,.3);
  --sans:'Assistant', system-ui, sans-serif;
  --display:'Heebo', system-ui, sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  --ease-lux:cubic-bezier(.22,1,.36,1);
}
/* tactile paper grain — warmth/depth without darkening */
body::after{content:"";position:fixed;inset:0;z-index:9000;pointer-events:none;opacity:.04;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:auto}
body{
  background:var(--bg);color:var(--ink);
  font-family:var(--sans);font-weight:300;line-height:1.65;
  overflow-x:hidden;-webkit-font-smoothing:antialiased;cursor:none;
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
::selection{background:var(--gold);color:#fff}
input{cursor:text}

/* ---- cursor ---- */
.cursor{position:fixed;top:0;left:0;width:34px;height:34px;border:1px solid var(--gold);border-radius:50%;z-index:9999;pointer-events:none;transform:translate(-50%,-50%);transition:width .3s var(--ease),height .3s var(--ease),background .3s,border-color .3s}
.cursor-dot{position:fixed;top:0;left:0;width:5px;height:5px;background:var(--gold);border-radius:50%;z-index:9999;pointer-events:none;transform:translate(-50%,-50%)}
.cursor.grow{width:70px;height:70px;background:rgba(176,136,74,.1);border-color:transparent}
@media (hover:none){.cursor,.cursor-dot{display:none}body{cursor:auto}}

.scroll-progress{position:fixed;top:0;inset-inline-start:0;height:2px;width:0;background:linear-gradient(90deg,var(--gold),var(--gold-bright));z-index:900}

/* ---- loader ---- */
.loader{position:fixed;inset:0;z-index:10000;background:var(--bg);display:grid;place-items:center}
.loader-inner{display:flex;flex-direction:column;align-items:center;gap:26px}
.loader-word{display:flex;gap:.04em;font-family:var(--display);font-weight:200;font-size:clamp(56px,11vw,120px);color:var(--ink);line-height:1}
.loader-word span{opacity:0;transform:translateY(40px)}
.loader-bar{width:180px;height:1px;background:var(--line);position:relative;overflow:hidden}
.loader-bar i{position:absolute;inset:0;width:0;background:var(--gold)}

/* ---- nav ---- */
.nav{position:fixed;top:0;inset-inline:0;z-index:800;display:flex;align-items:center;justify-content:space-between;padding:24px clamp(20px,4vw,56px);transition:padding .4s var(--ease),background .4s,box-shadow .4s}
.nav.shrink{padding-top:14px;padding-bottom:14px;background:rgba(251,247,240,.82);backdrop-filter:blur(16px);box-shadow:0 1px 0 var(--line-soft)}
.nav-logo{font-family:var(--display);font-size:21px;font-weight:600;letter-spacing:-.01em;display:flex;gap:.35em;align-items:baseline}
.nav-logo em{font-style:normal;font-weight:300;font-size:.66em;color:var(--gold);letter-spacing:.02em}
.nav-links{display:flex;gap:32px;font-size:14px;font-weight:400}
.nav-links a{position:relative;color:var(--ink-soft);transition:color .3s}
.nav-links a::after{content:"";position:absolute;bottom:-6px;inset-inline:0;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:right;transition:transform .4s var(--ease)}
.nav-links a:hover{color:var(--ink)}
.nav-links a:hover::after{transform:scaleX(1)}
.nav-cta{font-size:13px;font-weight:500;padding:11px 22px;border:1px solid var(--ink);border-radius:40px;color:var(--ink);transition:.4s var(--ease)}
.nav-cta:hover{background:var(--ink);color:var(--bg)}
@media(max-width:780px){.nav-links{display:none}}

/* ---- buttons ---- */
.btn{position:relative;display:inline-flex;align-items:center;gap:10px;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.01em;padding:15px 30px;border-radius:46px;overflow:hidden;transition:.5s var(--ease);will-change:transform}
.btn-primary{background:var(--ink);color:var(--bg)}
.btn-primary::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent,rgba(255,255,255,.22),transparent);transform:translateX(-130%);transition:transform .7s var(--ease)}
.btn-primary:hover::before{transform:translateX(130%)}
.btn-primary:hover{box-shadow:0 16px 40px -14px rgba(42,35,30,.5)}
.btn-ghost{border:1px solid var(--line);color:var(--ink)}
.btn-ghost:hover{border-color:var(--ink)}
.btn-light{background:var(--bg);color:var(--ink)}
.btn-light:hover{box-shadow:var(--shadow)}
.btn.big{padding:19px 40px;font-size:16px}
.btn.full{width:100%;justify-content:center}
.btn-gold{background:linear-gradient(135deg,var(--gold),var(--gold-bright));color:#fff}
.btn-gold::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent,rgba(255,255,255,.35),transparent);transform:translateX(-130%);transition:transform .7s var(--ease)}
.btn-gold:hover::before{transform:translateX(130%)}
.btn-gold:hover{box-shadow:0 18px 44px -14px rgba(156,123,60,.65)}

.reveal{opacity:0;transform:translateY(30px)}

/* ============ CINEMATIC CONFIGURATOR STAGE ============ */
.cstage{position:relative;min-height:100svh;display:grid;grid-template-rows:auto 1fr auto;align-items:center;justify-items:center;text-align:center;padding:92px 20px 60px;gap:1.4vh;overflow:hidden;background:radial-gradient(ellipse 80% 70% at 50% 26%,var(--bg-blush),var(--bg) 72%)}
.cstage-head{position:relative;z-index:3}
.hero-eyebrow{overflow:hidden;margin-bottom:6px}
.hero-eyebrow span{display:inline-block;font-size:13px;letter-spacing:.32em;color:var(--gold);font-weight:500;transform:translateY(120%)}
.hero-name{position:relative;z-index:1;font-family:var(--display);font-weight:100;line-height:.88;letter-spacing:-.035em;font-size:clamp(58px,11vw,144px)}
.hero-name .hn-line{display:block;overflow:hidden}
.hero-name .hn{display:inline-block;transform:translateY(101%)}
.cstage-tag{margin-top:8px;color:var(--ink-soft);font-size:clamp(14px,1.7vw,18px);letter-spacing:.02em}

.cstage-product{position:relative;z-index:2;width:min(52vh,470px);aspect-ratio:1;display:grid;place-items:center}
.cstage-halo{position:absolute;inset:-10%;border-radius:50%;background:radial-gradient(circle,rgba(206,154,140,.35),rgba(194,160,90,.12) 46%,transparent 64%);filter:blur(22px);z-index:0}
.cstage-photos{position:absolute;inset:0;z-index:2;will-change:transform}
.cstage-photos .bld{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .5s var(--ease);filter:drop-shadow(0 34px 34px rgba(70,48,24,.22))}
.cstage-photos .bld.on{opacity:1}
.cstage-shadow{position:absolute;bottom:-4%;left:50%;transform:translateX(-50%);width:58%;height:6.5%;border-radius:50%;background:radial-gradient(ellipse,rgba(70,48,24,.28),transparent 68%);filter:blur(6px);z-index:1;will-change:transform,opacity}

.cstage-panel{position:relative;z-index:3;width:min(600px,94vw);display:flex;flex-direction:column;gap:13px;
  background:rgba(255,255,255,.55);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border:1px solid rgba(255,255,255,.7);box-shadow:0 24px 60px -30px rgba(70,48,24,.25);
  border-radius:24px;padding:22px 26px}
.cstage-meta{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.cstage-name{font-family:var(--display);font-weight:400;font-size:clamp(15px,1.9vw,19px)}
.cstage-price{font-family:var(--display);font-weight:500;font-size:clamp(20px,2.6vw,26px);color:var(--gold)}
.cstage-row{display:flex;align-items:center;gap:14px}
.cstage-label{font-size:12px;letter-spacing:.16em;color:var(--ink-soft);min-width:44px;text-align:start}
.cstage-colors{display:flex;gap:10px}
.cstage-stones{display:flex;gap:8px;flex-wrap:wrap}
.cstage-stones button{font-family:var(--sans);font-size:13px;padding:8px 15px;border-radius:30px;border:1px solid var(--line);background:var(--paper);color:var(--ink-soft);cursor:none;transition:.3s var(--ease)}
.cstage-stones button:hover{color:var(--ink);border-color:var(--gold)}
.cstage-stones button.active{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.cstage-cta{display:flex;align-items:center;gap:20px;justify-content:center;margin-top:6px;flex-wrap:wrap}
.cstage-more{font-size:13px;color:var(--ink-soft);letter-spacing:.02em;transition:color .3s}
.cstage-more:hover{color:var(--gold)}

.hero-scroll{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);z-index:3;display:flex;flex-direction:column;align-items:center;gap:8px;font-size:11px;letter-spacing:.28em;color:var(--ink-soft)}
.hero-scroll i{width:1px;height:34px;background:linear-gradient(var(--gold),transparent);animation:scrolly 2s var(--ease) infinite}
@keyframes scrolly{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
@media(max-width:600px){
  .cstage{min-height:auto;padding:90px 18px 46px;gap:2.2vh}
  .cstage-product{width:min(82vw,360px)}
  .cstage-panel{width:100%}
  .cstage-row{flex-wrap:wrap;gap:8px}
  .cstage-label{min-width:auto}
  .cstage-cta{gap:12px}
  .hero-scroll{display:none}
}

/* ---- scroll-scrubbed product film ---- */
.scrub{position:relative;height:340vh;background:var(--bg)}
.scrub-sticky{position:sticky;top:0;height:100svh;overflow:hidden;display:grid;place-items:center;background:radial-gradient(ellipse 60% 60% at 50% 42%,var(--bg-blush),var(--bg) 72%)}
.scrub-video{width:min(60vh,540px);aspect-ratio:1;object-fit:cover;border-radius:30px;box-shadow:var(--shadow)}
.scrub-caps{position:absolute;inset:0;pointer-events:none}
.scrub-cap{position:absolute;bottom:9vh;left:0;right:0;text-align:center;font-family:var(--display);font-weight:100;font-size:clamp(28px,4.8vw,70px);line-height:1.05;letter-spacing:-.03em;color:var(--ink);opacity:0;padding:0 24px;will-change:opacity}
.scrub-cap em{font-style:normal;color:var(--gold)}
/* THE REEL — falling, twisting shoe cycling every design */
.reel{position:relative;height:620vh;background:radial-gradient(ellipse 70% 60% at 50% 38%,var(--bg-blush),var(--bg) 72%)}
.reel-sticky{position:sticky;top:0;height:100svh;overflow:hidden;display:grid;place-items:center;perspective:1500px}
.reel-kicker{position:absolute;top:11vh;z-index:3;font-size:13px;letter-spacing:.3em;color:var(--gold);font-weight:600}
.reel-glow{position:absolute;z-index:1;width:min(60vh,88vw,520px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(206,154,140,.5),rgba(176,136,74,.18) 40%,transparent 68%);filter:blur(24px);opacity:.2;will-change:transform,opacity}
.reel-shoe{position:relative;z-index:2;width:min(52vh,76vw,440px);aspect-ratio:3/4;transform-style:preserve-3d;will-change:transform;filter:drop-shadow(0 44px 60px rgba(70,48,24,.3))}
.reel-shoe .rbld{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0}
.reel-shoe .rbld.on{opacity:1}
.reel-meta{position:absolute;bottom:12vh;z-index:3;text-align:center;display:flex;flex-direction:column;gap:8px;align-items:center}
.reel-count{font-family:var(--display);font-size:14px;letter-spacing:.14em;color:var(--ink-soft)}
.reel-count i{font-style:normal}.reel-count i:first-child{color:var(--gold)}
.reel-name{font-family:var(--display);font-weight:200;font-size:clamp(26px,4vw,52px);letter-spacing:-.02em;min-height:1.1em}
.reel-cta{position:absolute;bottom:11vh;z-index:4;text-align:center;display:flex;flex-direction:column;gap:18px;align-items:center;opacity:0;pointer-events:none}
.reel-cta>span{font-family:var(--display);font-weight:200;font-size:clamp(34px,5.5vw,76px);letter-spacing:-.02em}
.reel-cta>span em{font-style:normal;color:var(--gold)}
.reel-cta .btn{pointer-events:auto}

/* ---- infinite-designs showcase ---- */
.showcase{position:relative;height:380vh;background:var(--bg)}
.showcase-sticky{position:sticky;top:0;height:100svh;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:20px;padding:0 clamp(24px,7vw,110px);overflow:hidden}
.showcase-bg{position:absolute;inset:0;z-index:0;background:radial-gradient(ellipse 60% 60% at 72% 50%,var(--bg-blush),var(--bg) 72%);transition:background .7s var(--ease)}
.showcase-copy{position:relative;z-index:2}
.showcase-kicker{font-size:13px;letter-spacing:.26em;color:var(--gold);font-weight:600;display:block;margin-bottom:18px}
.showcase-title{font-family:var(--display);font-weight:200;font-size:clamp(46px,7.5vw,118px);line-height:.98;letter-spacing:-.02em;min-height:1.1em}
.showcase-sub{margin-top:22px;color:var(--ink-soft);font-size:clamp(16px,1.9vw,20px);max-width:400px}
.showcase-stage{position:relative;z-index:1;justify-self:center;width:min(46vh,400px);aspect-ratio:3/4;border-radius:26px;overflow:hidden;box-shadow:var(--shadow)}
.showcase-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .45s var(--ease)}
.showcase-stage img.on{opacity:1}
.showcase-count{position:absolute;bottom:5.5vh;inset-inline-start:clamp(24px,7vw,110px);z-index:2;font-family:var(--display);color:var(--ink-soft);letter-spacing:.12em;font-size:14px}
.showcase-count span:first-child{color:var(--gold)}
@media(max-width:860px){.showcase-sticky{grid-template-columns:1fr;grid-template-rows:1fr auto;text-align:center;padding-top:14vh}.showcase-stage{width:min(34vh,250px)}.showcase-title{font-size:42px}.showcase-sub{margin-inline:auto}}

/* ---- marquee ---- */
.marquee{position:relative;padding:clamp(26px,4vh,44px) 0;border-block:1px solid var(--line);overflow:hidden;background:var(--paper)}
.marquee-track{display:flex;width:max-content;animation:marq 38s linear infinite}
.marquee-track span{font-family:var(--display);font-weight:100;font-size:clamp(34px,5.6vw,72px);letter-spacing:-.02em;color:var(--ink);white-space:nowrap;padding-inline:8px;line-height:1}
.marquee-track em{font-style:normal;color:transparent;-webkit-text-stroke:1px var(--gold)}
.marquee-track i{font-style:normal;color:var(--gold);font-size:.5em;vertical-align:middle;opacity:.7}
@keyframes marq{to{transform:translateX(50%)}}

/* ============ sections shared ============ */
.eyebrow{font-size:12px;letter-spacing:.3em;color:var(--gold);display:block;margin-bottom:20px;font-weight:500}
.eyebrow::before{content:"";display:inline-block;width:34px;height:1px;background:var(--gold);vertical-align:middle;margin-inline-end:14px;opacity:.55}
.section-head{padding:clamp(100px,14vh,170px) clamp(24px,6vw,90px) 56px;max-width:1300px;margin-inline:auto}
.section-head.center{text-align:center}
.section-title{font-family:var(--display);font-weight:100;font-size:clamp(42px,7.5vw,104px);line-height:.96;letter-spacing:-.03em}
.section-title em{font-style:normal;color:var(--gold)}
.section-lede{margin:22px auto 0;max-width:540px;color:var(--ink-soft);font-size:clamp(16px,1.9vw,19px)}

/* ============ ATELIER ============ */
.atelier{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(30px,6vw,80px);padding:clamp(80px,12vh,150px) clamp(24px,6vw,90px);max-width:1400px;margin-inline:auto}
.atelier-media{border-radius:20px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:3/2}
.atelier-media img{width:100%;height:120%;object-fit:cover;will-change:transform}
.atelier-copy h2{font-family:var(--display);font-weight:200;font-size:clamp(34px,4.6vw,68px);line-height:1;letter-spacing:-.02em;margin-bottom:22px}
.atelier-copy h2 em{font-style:normal;color:var(--gold)}
.atelier-copy p{color:var(--ink-soft);font-size:clamp(16px,1.9vw,19px);max-width:480px}
.atelier-stats{display:flex;gap:36px;margin-top:38px;flex-wrap:wrap}
.atelier-stats strong{display:block;font-family:var(--display);font-weight:300;font-size:38px;color:var(--ink)}
.atelier-stats span{font-size:13px;color:var(--ink-soft);letter-spacing:.04em}
@media(max-width:860px){.atelier{grid-template-columns:1fr}}

/* ============ ASSEMBLY ============ */
.assembly{position:relative;height:640vh;background:linear-gradient(180deg,var(--bg),var(--bg-soft))}
.assembly-sticky{position:sticky;top:0;height:100svh;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:20px;padding:0 clamp(24px,6vw,90px)}
.assembly-stage{position:relative;height:100%;display:grid;place-items:center}
.assembly-glow{position:absolute;width:64%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(206,154,140,.28),transparent 66%);filter:blur(16px);z-index:0}
.assembly-shoe{position:relative;z-index:2;width:min(38vh,300px);aspect-ratio:896/1200;border-radius:22px;overflow:hidden;box-shadow:var(--shadow)}
.assembly-shoe .bld{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;will-change:opacity}
.assembly-progress{position:absolute;bottom:14%;inset-inline:18%;height:2px;background:var(--line);z-index:3;border-radius:2px;overflow:hidden}
.assembly-progress i{position:absolute;inset:0;width:0;background:var(--gold);border-radius:2px}
.assembly-copy{position:relative;height:54vh}
.assembly-kicker{position:absolute;top:0;font-size:12px;letter-spacing:.26em;color:var(--gold);font-weight:600}
.assembly-step{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;opacity:0}
.assembly-step .step-num{font-family:var(--display);font-weight:300;font-size:15px;color:var(--gold);letter-spacing:.1em;margin-bottom:12px}
.assembly-step h3{font-family:var(--display);font-weight:200;font-size:clamp(30px,4.6vw,60px);line-height:1.02;letter-spacing:-.02em;margin-bottom:14px}
.assembly-step p{font-size:clamp(16px,1.9vw,20px);color:var(--ink-soft);max-width:400px}
@media(max-width:860px){
  .assembly-sticky{grid-template-columns:1fr;grid-template-rows:1fr auto;gap:0;padding-bottom:8vh}
  .assembly-shoe{width:min(30vh,200px)}.assembly-copy{height:30vh}.assembly-step h3{font-size:30px}
}

/* ============ COLLECTIONS ============ */
.coll-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;padding:0 clamp(24px,6vw,90px) 40px;max-width:1440px;margin-inline:auto}
.coll-card{position:relative;border-radius:22px;overflow:hidden;min-height:340px;display:flex;align-items:flex-end;padding:26px;background:var(--bg-soft)}
.coll-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:transform 1s var(--ease)}
.coll-card:hover img{transform:scale(1.07)}
.coll-card::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(30,22,16,.72),rgba(30,22,16,.05) 55%,transparent)}
.coll-card>div{position:relative;z-index:2}
.coll-card *{color:#fff}
.coll-card .coll-num{position:absolute;top:16px;inset-inline-end:22px;z-index:2;font-family:var(--display);font-weight:100;opacity:.9;font-size:clamp(28px,3vw,44px);line-height:1;color:transparent !important;-webkit-text-stroke:1px rgba(255,255,255,.85)}
.coll-card h3{font-family:var(--display);font-weight:300;font-size:clamp(26px,3vw,40px);line-height:1;letter-spacing:-.01em}
.coll-card p{margin-top:8px;font-size:14px;opacity:.85;max-width:92%}
.coll-card .coll-go{margin-top:14px;display:inline-flex;gap:8px;font-size:13px;letter-spacing:.05em;color:#fff;opacity:0;transform:translateY(10px);transition:.4s var(--ease)}
.coll-card:hover .coll-go{opacity:1;transform:translateY(0)}
.c-span-7{grid-column:span 7}.c-span-5{grid-column:span 5}
.c-span-4{grid-column:span 4}.c-span-8{grid-column:span 8}
.c-span-6{grid-column:span 6}
@media(max-width:860px){.coll-grid>*{grid-column:1/-1 !important;min-height:300px}}

/* ============ LIFESTYLE (real women) ============ */
.lifestyle{padding:0 clamp(24px,6vw,90px) clamp(40px,8vh,90px);max-width:1440px;margin-inline:auto}
.lifestyle-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.lf-item{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:4/5;box-shadow:var(--shadow)}
.lf-item img{width:100%;height:114%;object-fit:cover;will-change:transform}
.lf-wide{grid-column:1/-1;aspect-ratio:21/8}
@media(max-width:760px){.lifestyle-grid{grid-template-columns:1fr 1fr}.lf-wide{grid-column:1/-1;aspect-ratio:16/10}}

/* ============ MATCHING SETS ============ */
.sets{padding:0 clamp(24px,6vw,90px) clamp(50px,9vh,110px);max-width:1440px;margin-inline:auto}
.sets-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.set-card{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:4/5;box-shadow:var(--shadow);display:block;isolation:isolate}
.set-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:transform 1s var(--ease)}
.set-card:hover img{transform:scale(1.07)}
.set-card::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(28,20,14,.78),rgba(28,20,14,.05) 52%,transparent)}
.set-info{position:absolute;inset-inline:0;bottom:0;z-index:2;padding:22px;color:#fff}
.set-info h3{font-family:var(--display);font-weight:300;font-size:clamp(20px,2.3vw,28px);letter-spacing:-.01em}
.set-info .set-sub{font-size:13px;opacity:.85;margin-top:3px;display:block}
.set-info .set-price{font-family:var(--display);font-size:18px;color:var(--gold-bright);margin-top:10px;display:inline-flex;align-items:center;gap:8px}
.set-info .set-price::after{content:"הזמיני בוואטסאפ ←";font-family:var(--sans);font-size:12px;color:#fff;opacity:0;transform:translateX(6px);transition:.4s var(--ease)}
.set-card:hover .set-price::after{opacity:.85;transform:translateX(0)}
@media(max-width:860px){.sets-grid{grid-template-columns:1fr 1fr}}

/* ============ EDITORIAL BANNER ============ */
.editorial{position:relative;min-height:90svh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;margin:clamp(40px,8vh,90px) 0}
.editorial-media{position:absolute;inset:0;z-index:-2}
.editorial-media img,.editorial-media video{width:100%;height:100%;object-fit:cover;object-position:center 35%}
.editorial::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(30,22,16,.35),rgba(30,22,16,.15))}
.editorial-text h2{font-family:var(--display);font-weight:200;font-size:clamp(40px,7vw,100px);line-height:.98;letter-spacing:-.02em;color:#fff}
.editorial-text h2 em{font-style:normal;color:#fff;text-decoration:underline;text-decoration-color:var(--gold-bright);text-underline-offset:10px}
.editorial-text .btn{margin-top:30px}

/* ============ BUILDER ============ */
.builder{background:var(--bg-soft)}
.builder-wrap{display:grid;grid-template-columns:1fr .92fr;gap:40px;max-width:1280px;margin:0 auto;padding:0 clamp(24px,6vw,90px) clamp(80px,12vh,140px);align-items:start}
.builder-stage{position:sticky;top:90px;border-radius:24px;background:radial-gradient(ellipse 70% 60% at 50% 32%,var(--bg-blush),var(--paper) 72%);box-shadow:var(--shadow);min-height:60vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px}
.builder-shoe{position:relative;width:min(40vh,310px);aspect-ratio:896/1200;border-radius:20px;overflow:hidden;box-shadow:var(--shadow)}
.builder-shoe .bld{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s var(--ease)}
.builder-shoe .bld.on{opacity:1}
.builder-meta{margin-top:18px;text-align:center}
.builder-name{font-family:var(--display);font-weight:300;font-size:24px;letter-spacing:-.01em;margin-bottom:6px}
.builder-price span{display:block;font-size:12px;letter-spacing:.18em;color:var(--ink-soft)}
.builder-price strong{font-family:var(--display);font-weight:400;font-size:32px;color:var(--gold)}
.builder-controls{display:flex;flex-direction:column;gap:24px}
.design-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(76px,1fr));gap:10px}
.design-opt{cursor:none;border-radius:12px;overflow:hidden;border:2px solid transparent;outline:1px solid var(--line);background:var(--paper);transition:.3s var(--ease);padding-bottom:6px}
.design-opt img{width:100%;aspect-ratio:1;object-fit:cover;display:block}
.design-opt span{display:block;font-size:11px;color:var(--ink-soft);margin-top:5px;text-align:center}
.design-opt:hover{transform:translateY(-2px)}
.design-opt.active{border-color:var(--gold);outline-color:var(--gold);box-shadow:0 6px 18px -8px rgba(176,136,74,.55)}
.design-opt.active span{color:var(--ink);font-weight:600}
.ctrl-group h4{font-family:var(--display);font-weight:500;font-size:15px;letter-spacing:.02em;margin-bottom:13px}
.swatches{display:flex;flex-wrap:wrap;gap:10px}
.swatch{width:36px;height:36px;border-radius:50%;border:2px solid transparent;outline:1px solid var(--line);cursor:none;transition:.3s var(--ease);position:relative}
.swatch:hover{transform:scale(1.12)}
.swatch.active{border-color:var(--gold);outline-color:var(--gold);box-shadow:0 0 0 4px rgba(176,136,74,.16)}
.swatch span{position:absolute;bottom:-19px;left:50%;transform:translateX(-50%);font-size:10px;color:var(--ink-soft);white-space:nowrap;opacity:0;transition:.3s}
.swatch:hover span{opacity:1}
.chips{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:4px}
.chips button{font-family:var(--sans);font-size:14px;padding:9px 16px;border-radius:30px;border:1px solid var(--line);background:var(--paper);color:var(--ink-soft);cursor:none;transition:.3s var(--ease)}
.chips button:hover{color:var(--ink);border-color:var(--gold)}
.chips button.active{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.initial-input,.name-input{margin-top:10px;width:100%;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:13px 16px;color:var(--ink);font-family:var(--sans);font-size:15px;outline:none;transition:.3s}
.initial-input{width:68px;text-align:center;font-family:var(--display);font-size:22px}
.initial-input:focus,.name-input:focus{border-color:var(--gold)}
.upsell{display:flex;align-items:center;gap:14px;padding:12px;border:1px solid var(--line);border-radius:16px;background:var(--paper);transition:.4s var(--ease)}
.upsell.added{border-color:var(--gold);background:linear-gradient(0deg,rgba(176,136,74,.08),rgba(176,136,74,.08)),var(--paper);box-shadow:0 8px 24px -12px rgba(176,136,74,.5)}
.upsell img{width:56px;height:56px;border-radius:12px;object-fit:cover;flex:none}
.upsell-text{flex:1;min-width:0}
.upsell-text strong{display:block;font-family:var(--display);font-weight:500;font-size:15px}
.upsell-text span{font-size:12.5px;color:var(--ink-soft)}
.upsell-btn{flex:none;font-family:var(--sans);font-size:13px;font-weight:500;padding:10px 16px;border-radius:30px;border:1px solid var(--ink);background:transparent;color:var(--ink);cursor:none;transition:.3s var(--ease)}
.upsell-btn:hover{background:var(--ink);color:var(--bg)}
.upsell.added .upsell-btn{background:var(--gold);color:#fff;border-color:var(--gold)}
.builder-actions{display:flex;flex-direction:column;gap:12px;margin-top:6px}
@media(max-width:860px){.builder-wrap{grid-template-columns:1fr}.builder-stage{position:relative;top:0}}

/* ============ QUOTES ============ */
.quotes{padding:clamp(80px,12vh,140px) 0;overflow:hidden}
.quotes-head{text-align:center;padding:0 24px 50px}
.quotes-track{display:flex;gap:22px;width:max-content;padding-inline:30px}
.quote-card{position:relative;width:min(78vw,430px);border:1px solid var(--line-soft);border-radius:22px;padding:40px 34px 34px;background:var(--paper);box-shadow:0 20px 50px -34px rgba(70,48,24,.25)}
.quote-card::before{content:"”";position:absolute;top:6px;inset-inline-start:22px;font-family:var(--display);font-weight:100;font-size:84px;line-height:1;color:transparent;-webkit-text-stroke:1px rgba(156,123,60,.4);pointer-events:none}
.quote-card .stars{color:var(--gold);letter-spacing:.2em;margin-bottom:14px;font-size:14px}
.quote-card blockquote{font-family:var(--display);font-weight:300;font-size:clamp(19px,2.3vw,25px);line-height:1.45;letter-spacing:-.01em}
.quote-card cite{display:block;margin-top:18px;font-style:normal;color:var(--gold);font-size:14px;font-weight:500}

/* ============ CONTACT ============ */
.contact{padding:clamp(100px,16vh,200px) clamp(24px,6vw,90px);text-align:center;position:relative;overflow:hidden;background:radial-gradient(ellipse 60% 70% at 50% 50%,var(--bg-blush),var(--bg) 72%)}
.contact-inner{position:relative;max-width:760px;margin-inline:auto}
.contact-title{font-family:var(--display);font-weight:200;font-size:clamp(46px,9vw,120px);line-height:.95;margin:16px 0 22px;letter-spacing:-.02em}
.contact-title em{font-style:normal;color:var(--gold)}
.contact p{color:var(--ink-soft);font-size:clamp(16px,2vw,20px);max-width:460px;margin-inline:auto}
.contact-actions{margin-top:38px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ---- footer ---- */
.footer{border-top:1px solid var(--line);padding:64px clamp(24px,6vw,90px) 40px;background:var(--bg-soft)}
.footer-top{display:flex;justify-content:space-between;align-items:flex-start;gap:36px;flex-wrap:wrap;max-width:1300px;margin-inline:auto}
.footer-brand p{color:var(--ink-soft);font-size:14px;margin-top:10px}
.footer-mark{font-family:var(--display);font-weight:600;font-size:27px;display:flex;gap:.35em;align-items:baseline}
.footer-mark em{font-style:normal;font-weight:300;font-size:.6em;color:var(--gold)}
.footer-links{display:flex;flex-direction:column;gap:10px;font-size:14px}
.footer-links a{color:var(--ink-soft);transition:color .3s}
.footer-links a:hover{color:var(--gold)}
.footer-wa{font-family:var(--display);font-weight:500;font-size:16px;color:var(--gold);border:1px solid rgba(156,123,60,.35);border-radius:40px;padding:13px 24px;transition:.4s var(--ease)}
.footer-wa:hover{background:var(--gold);color:#fff}
.footer small{display:block;text-align:center;color:var(--ink-soft);opacity:.6;font-size:12px;margin-top:44px;padding-top:22px;border-top:1px solid var(--line-soft)}
@media(max-width:640px){.footer-top{flex-direction:column;align-items:center;text-align:center;gap:26px}.footer-links{flex-direction:row;gap:18px;flex-wrap:wrap;justify-content:center}}

/* ---- sandal twinkle ---- */
.sandal .twinkle{transform-box:fill-box;transform-origin:center;animation:tw 2.6s ease-in-out infinite;animation-delay:var(--d,0s)}
@keyframes tw{0%,100%{opacity:0;transform:scale(.3)}50%{opacity:1;transform:scale(1)}}
.sandal .gem .spark{animation:gemSpark 3s ease-in-out infinite}
@keyframes gemSpark{0%,100%{opacity:.5}50%{opacity:1}}

@media (prefers-reduced-motion:reduce){*{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}}

/* ---- before/after atelier slider (v26) ---- */
.ba{position:relative;user-select:none;touch-action:pan-y;cursor:none}
.ba img{width:100%;height:100%;object-fit:cover;pointer-events:none}
.ba .ba-after{position:absolute;inset:0}
.ba-before{position:absolute;inset:0;clip-path:inset(0 0 0 50%);will-change:clip-path}
.ba-handle{position:absolute;top:0;bottom:0;left:50%;width:2px;background:rgba(255,255,255,.9);box-shadow:0 0 0 1px rgba(36,28,22,.08);transform:translateX(-50%);will-change:left}
.ba-handle i{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;background:var(--paper);box-shadow:0 10px 30px -8px rgba(70,48,24,.45);display:grid;place-items:center}
.ba-handle i::before{content:"⇄";font-size:17px;color:var(--gold);font-weight:600}
.ba-tag{position:absolute;bottom:14px;font-size:11px;letter-spacing:.22em;font-weight:600;color:var(--ink);background:rgba(255,255,255,.82);backdrop-filter:blur(6px);padding:6px 12px;border-radius:99px;pointer-events:none}
.ba-tag-b{right:14px}
.ba-tag-a{left:14px}

/* ---- 360° scroll spin (v29: full-bleed cinematic) ---- */
.spin{position:relative;height:320vh;background:var(--bg)}
.spin-sticky{position:sticky;top:0;height:100svh;overflow:hidden;background:var(--bg-soft)}
#spinCanvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.spin-vignette{position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse 78% 72% at 50% 48%,transparent 55%,var(--bg) 100%)}
.spin-kicker{position:absolute;top:9vh;left:0;right:0;text-align:center;z-index:3;font-size:13px;letter-spacing:.5em;color:var(--gold);font-weight:600}
.spin-cap{position:absolute;bottom:12vh;left:0;right:0;z-index:3;text-align:center;font-family:var(--display);font-weight:100;font-size:clamp(40px,7.5vw,110px);line-height:1.02;letter-spacing:-.03em;color:var(--ink);opacity:0;padding:0 24px;will-change:opacity,transform}
.spin-cap em{font-style:normal;color:var(--gold)}
.spin-cap-in{opacity:1}
.spin-progress{position:absolute;bottom:6vh;left:50%;transform:translateX(-50%);z-index:3;width:140px;height:1px;background:rgba(156,123,60,.25);border-radius:2px;overflow:hidden}
.spin-progress b{position:absolute;inset:0;width:0;background:var(--gold)}

/* ---- ghost editorial type (v27) ---- */
.ghost{position:absolute;z-index:1;pointer-events:none;user-select:none;font-family:var(--display);font-weight:100;line-height:1;letter-spacing:-.02em;color:transparent;-webkit-text-stroke:1px rgba(156,123,60,.22);white-space:nowrap}
.ghost-hero{top:47%;left:50%;transform:translate(-50%,-50%);font-size:clamp(100px,19vw,300px);letter-spacing:.02em;text-transform:lowercase}
.ghost-spin{display:none}
.ghost-contact{top:50%;left:50%;transform:translate(-50%,-50%);font-size:clamp(160px,26vw,420px);z-index:0;-webkit-text-stroke:1px rgba(156,123,60,.16)}
.contact-inner{z-index:2}

/* ---- luxury detailing (v27) ---- */
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:rgba(156,123,60,.35);border-radius:8px;border:3px solid var(--bg)}
::-webkit-scrollbar-thumb:hover{background:rgba(156,123,60,.6)}
.swatch{width:40px;height:40px}
.ba-handle{width:1px;background:rgba(255,255,255,.95)}
.ba-handle i{width:52px;height:52px;box-shadow:0 12px 34px -10px rgba(70,48,24,.5),0 0 0 1px rgba(156,123,60,.25)}

/* ---- mobile pass (v27) ---- */
@media(max-width:600px){
  .ghost-hero{font-size:24vw;top:44%}
  .ghost-spin{font-size:52vw}
  .ghost-contact{font-size:38vw}
  .cstage-panel{padding:18px 16px;backdrop-filter:blur(14px)}
  .cstage-stones button{font-size:12.5px;padding:8px 13px}
  .marquee-track span{font-size:34px}
  .section-head{padding-top:80px;padding-bottom:36px}
  .atelier-stats{gap:22px}
  .atelier-stats strong{font-size:30px}
  .builder-stage{min-height:auto;padding:24px 16px}
  .builder-shoe{width:min(58vw,260px)}
  .quote-card{padding:34px 26px 28px}
}
@media(max-width:520px){
  .sets-grid{grid-template-columns:1fr}
  .lifestyle-grid{grid-template-columns:1fr 1fr;gap:10px}
  .coll-grid{gap:12px}
  .coll-card{min-height:260px;padding:20px}
}

/* ---- SHOP (v30): arrivals / specials / bundles + summer vibes ---- */
:root{--coral:#E8734A;--coral-soft:#FBE3D6}

/* new arrivals — snap-scroll product shelf */
.arrivals{background:linear-gradient(180deg,var(--bg) 0%,var(--coral-soft) 140%);overflow:hidden}
.arrivals-row{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px clamp(24px,6vw,90px) 56px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.arrivals-row::-webkit-scrollbar{display:none}
.prod-card{position:relative;flex:0 0 min(66vw,270px);scroll-snap-align:start;background:var(--paper);border-radius:22px;overflow:hidden;border:1px solid var(--line-soft);box-shadow:0 18px 44px -30px rgba(70,48,24,.35);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.prod-card:hover{transform:translateY(-8px);box-shadow:0 30px 60px -28px rgba(70,48,24,.45)}
.prod-badge{position:absolute;top:14px;inset-inline-start:14px;z-index:2;font-size:11px;font-weight:600;letter-spacing:.08em;color:#fff;background:var(--coral);padding:6px 12px;border-radius:99px}
.prod-media{aspect-ratio:1;overflow:hidden;background:var(--bg-soft)}
.prod-media img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.prod-card:hover .prod-media img{transform:scale(1.07)}
.prod-info{padding:16px 18px 18px}
.prod-info h3{font-family:var(--display);font-weight:400;font-size:17px;letter-spacing:-.01em}
.prod-buy{display:flex;align-items:baseline;justify-content:space-between;margin-top:8px}
.prod-buy strong{font-family:var(--display);font-weight:500;font-size:20px;color:var(--gold)}
.prod-cta{font-size:13px;color:var(--ink-soft);opacity:0;transform:translateX(6px);transition:.4s var(--ease)}
.prod-card:hover .prod-cta{opacity:1;transform:translateX(0);color:var(--coral)}

/* specials — one-of-a-kind editorial cards */
.specials{background:radial-gradient(ellipse 70% 90% at 50% 0%,var(--bg-blush),var(--bg) 70%)}
.specials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:0 clamp(24px,6vw,90px) clamp(46px,7vh,80px);max-width:1440px;margin-inline:auto}
.special-card{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:3/4;box-shadow:var(--shadow);isolation:isolate;display:block}
.special-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.special-card:hover img{transform:scale(1.06)}
.special-card::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(28,20,14,.78),rgba(28,20,14,.03) 55%,transparent)}
.special-tag{position:absolute;top:16px;inset-inline-start:16px;z-index:2;font-size:11px;font-weight:600;letter-spacing:.1em;color:var(--ink);background:rgba(255,255,255,.9);backdrop-filter:blur(6px);padding:7px 13px;border-radius:99px}
.special-info{position:absolute;inset-inline:0;bottom:0;z-index:2;padding:22px;color:#fff}
.special-info h3{font-family:var(--display);font-weight:300;font-size:clamp(22px,2.4vw,30px)}
.special-info p{font-size:13.5px;opacity:.85;margin-top:4px;max-width:94%}
.special-info strong{display:inline-block;margin-top:10px;font-family:var(--display);font-weight:500;font-size:19px;color:var(--gold-bright)}
@media(max-width:860px){.specials-grid{grid-template-columns:1fr;gap:14px}.special-card{aspect-ratio:4/3}}

/* bundles strip (inside sets) */
.bundles{margin-top:clamp(30px,5vh,50px)}
.bundles-head{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.bundles-head h3{font-family:var(--display);font-weight:200;font-size:clamp(26px,3.4vw,44px);letter-spacing:-.02em}
.bundles-head h3 em{font-style:normal;color:var(--coral)}
.bundles-head span{font-size:14px;color:var(--ink-soft)}
.bundles-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.bundle-card{position:relative;background:var(--paper);border:1px solid var(--line-soft);border-radius:20px;padding:22px 22px 20px;transition:.45s var(--ease);box-shadow:0 16px 40px -30px rgba(70,48,24,.3);display:block}
.bundle-card:hover{transform:translateY(-6px);border-color:rgba(232,115,74,.45);box-shadow:0 26px 54px -26px rgba(232,115,74,.4)}
.bundle-save{position:absolute;top:-11px;inset-inline-start:18px;font-size:11px;font-weight:700;letter-spacing:.06em;color:#fff;background:var(--coral);padding:5px 12px;border-radius:99px}
.bundle-card h4{font-family:var(--display);font-weight:400;font-size:20px;margin-top:6px}
.bundle-card p{font-size:13.5px;color:var(--ink-soft);margin-top:4px;min-height:2.6em}
.bundle-price{display:flex;align-items:baseline;gap:10px;margin-top:12px}
.bundle-price strong{font-family:var(--display);font-weight:500;font-size:26px;color:var(--gold)}
.bundle-price s{font-size:15px;color:var(--ink-soft);opacity:.7}
@media(max-width:860px){.bundles-row{grid-template-columns:1fr;gap:18px}}

/* ---- density pass (v30): tighter vertical rhythm ---- */
.section-head{padding:clamp(60px,8vh,104px) clamp(24px,6vw,90px) 40px}
.atelier{padding:clamp(54px,8vh,100px) clamp(24px,6vw,90px)}
.quotes{padding:clamp(56px,8vh,100px) 0}
.contact{padding:clamp(76px,11vh,150px) clamp(24px,6vw,90px)}
.editorial{min-height:76svh;margin:clamp(24px,4vh,54px) 0}
.marquee{padding:clamp(20px,3vh,34px) 0}
.lifestyle{padding-bottom:clamp(30px,5vh,60px)}
.sets{padding-bottom:clamp(40px,6vh,80px)}

/* ---- BAG mini-cart (v31) ---- */
.bag-fab{position:fixed;bottom:22px;inset-inline-start:22px;z-index:950;width:56px;height:56px;border-radius:50%;border:none;cursor:none;display:grid;place-items:center;background:var(--ink);color:var(--bg);box-shadow:0 18px 40px -14px rgba(36,28,22,.55);transition:.4s var(--ease)}
.bag-fab:hover{transform:translateY(-3px)}
.bag-fab.has{background:linear-gradient(135deg,var(--gold),var(--gold-bright))}
.bag-count{position:absolute;top:-4px;inset-inline-end:-4px;min-width:22px;height:22px;border-radius:99px;background:var(--coral);color:#fff;font-size:12px;font-weight:700;font-style:normal;display:grid;place-items:center;padding:0 5px;opacity:0;transform:scale(.5);transition:.3s var(--ease)}
.bag-fab.has .bag-count{opacity:1;transform:scale(1)}
.bag-scrim{position:fixed;inset:0;z-index:960;background:rgba(36,28,22,.35);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .4s}
.bag{position:fixed;top:0;bottom:0;inset-inline-start:0;z-index:970;width:min(400px,92vw);background:var(--bg);box-shadow:0 0 80px -20px rgba(36,28,22,.4);display:flex;flex-direction:column;transform:translateX(calc(100% + 40px));transition:transform .55s var(--ease-lux)}
body.bag-open .bag{transform:translateX(0)}
body.bag-open .bag-scrim{opacity:1;pointer-events:auto}
.bag-head{display:flex;align-items:center;justify-content:space-between;padding:22px 24px;border-bottom:1px solid var(--line-soft)}
.bag-head h3{font-family:var(--display);font-weight:200;font-size:28px}
.bag-head h3 em{font-style:normal;color:var(--gold)}
.bag-close{background:none;border:none;font-size:16px;color:var(--ink-soft);cursor:none;padding:8px}
.bag-items{flex:1;overflow-y:auto;padding:14px 20px}
.bag-empty{text-align:center;color:var(--ink-soft);padding:60px 10px;font-size:15px;line-height:2}
.bag-empty span{font-size:13px;opacity:.8}
.bag-item{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line-soft)}
.bag-item img{width:58px;height:58px;border-radius:14px;object-fit:cover;flex:none;background:var(--bg-soft)}
.bag-item-ph{width:58px;height:58px;border-radius:14px;flex:none;display:grid;place-items:center;background:var(--coral-soft);color:var(--coral);font-style:normal;font-size:20px}
.bag-item-info{flex:1;min-width:0}
.bag-item-info strong{display:block;font-family:var(--display);font-weight:400;font-size:15px}
.bag-item-info span{display:block;font-size:12px;color:var(--ink-soft)}
.bag-item-info em{font-style:normal;font-size:14px;color:var(--gold);font-weight:600}
.bag-qty{display:flex;align-items:center;gap:8px}
.bag-qty button{width:26px;height:26px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--ink);font-size:15px;cursor:none;display:grid;place-items:center;transition:.25s}
.bag-qty button:hover{border-color:var(--gold);color:var(--gold)}
.bag-qty b{font-family:var(--display);font-weight:500;min-width:14px;text-align:center}
.bag-foot{padding:18px 22px 22px;border-top:1px solid var(--line-soft);display:flex;flex-direction:column;gap:12px;background:var(--paper)}
.bag-total{display:flex;justify-content:space-between;align-items:baseline}
.bag-total span{font-size:13px;color:var(--ink-soft)}
.bag-total strong{font-family:var(--display);font-weight:500;font-size:26px;color:var(--gold)}
.bag-note{font-size:11.5px;color:var(--ink-soft);text-align:center}

/* + add buttons on cards */
.prod-add{position:absolute;top:12px;inset-inline-end:12px;z-index:3;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.92);backdrop-filter:blur(4px);color:var(--ink);font-size:18px;line-height:1;cursor:none;display:grid;place-items:center;transition:.3s var(--ease)}
.prod-add:hover{background:var(--coral);border-color:var(--coral);color:#fff;transform:scale(1.08)}
.special-add{top:14px;inset-inline-end:14px}
.bundle-add{top:12px;inset-inline-end:12px}
.builder-actions-row{display:flex;gap:10px}
.builder-actions-row .btn{flex:1;justify-content:center}
@media(max-width:600px){
  .bag-fab{bottom:16px;inset-inline-start:16px;width:52px;height:52px}
  .builder-actions-row{flex-direction:column}
}