@font-face{font-family:"Cormorant";src:url(fonts/cormorant.woff) format("woff");font-weight:300 700;font-display:swap}
@font-face{font-family:"Cormorant";src:url(fonts/cormorant-italic.woff) format("woff");font-weight:300 700;font-style:italic;font-display:swap}
@font-face{font-family:"Inter";src:url(fonts/inter.woff) format("woff");font-weight:300 700;font-display:swap}

:root{
  --f-paper:#f7f2ec; --f-paper-2:#fffdfb; --f-ink:#1b1419; --f-ink-2:#5d5258; --f-ink-3:#968a90;
  --f-rule:rgba(27,20,25,.13); --f-fx:#E6007E; --f-fx-deep:#b30062; --f-fx-soft:#fbe4f0;
  --f-serif:"Cormorant","Cormorant Garamond",Georgia,serif; --f-sans:"Inter",system-ui,-apple-system,sans-serif;
  --f-ease:cubic-bezier(.2,.8,.2,1); --f-spring:cubic-bezier(.34,1.3,.5,1);
  --safe-b:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;background:var(--f-paper);color:var(--f-ink);font-family:var(--f-sans);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
body{overflow:hidden}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.eyebrow{font:500 10.5px/1 var(--f-sans);letter-spacing:.32em;text-transform:uppercase;color:var(--f-ink-2);display:flex;align-items:center;gap:12px}
.rule{display:inline-block;width:28px;height:1px;background:currentColor;opacity:.5}

/* ── Top bar ── */
.bar{position:fixed;inset:0 0 auto 0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:calc(14px + env(safe-area-inset-top,0px)) 16px 0;pointer-events:none}
.bar>*{pointer-events:auto}
.pill{display:flex;align-items:center;gap:10px;height:40px;padding:0 16px 0 14px;border-radius:40px;background:rgba(255,253,251,.62);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);border:1px solid rgba(27,20,25,.08);font:500 10.5px/1 var(--f-sans);letter-spacing:.26em;text-transform:uppercase}
.burger{display:grid;gap:5px}.burger i{display:block;width:16px;height:1px;background:var(--f-ink)}.burger i:last-child{width:10px}
.mark img{width:34px;height:34px;border-radius:50%;box-shadow:0 4px 14px rgba(230,0,126,.25)}
.count{min-width:64px;text-align:right;font:400 11px/1 var(--f-sans);letter-spacing:.2em;color:var(--f-ink-2);font-variant-numeric:tabular-nums}
.count b{font-weight:500;color:var(--f-ink)}

/* progress ticks */
.ticks{position:fixed;right:10px;top:50%;transform:translateY(-50%);z-index:25;display:grid;gap:10px;transition:opacity .5s}
.ticks i{display:block;width:8px;height:1px;margin-left:auto;background:var(--f-ink);opacity:.25;transition:all .5s var(--f-ease)}
.ticks i.on{width:20px;opacity:1;background:var(--f-fx)}

/* ── Reel ── */
.reel{height:100%;overflow-y:auto;scroll-snap-type:y mandatory;overscroll-behavior:contain;scrollbar-width:none}
.reel::-webkit-scrollbar{display:none}
.reel>section{position:relative;height:100svh;min-height:600px;scroll-snap-align:start;scroll-snap-stop:always;overflow:hidden}

/* Cover */
.cover{background:radial-gradient(120% 70% at 50% 38%,#fffaf6 0%,var(--f-paper) 55%,#efe5dc 100%)}
.cover-word{position:absolute;left:0;right:0;top:13svh;display:flex;flex-direction:column;align-items:center;font:italic 300 46vw/.78 var(--f-serif);letter-spacing:-.035em;color:var(--f-fx);user-select:none}
.cover-word span:last-child{margin-left:18vw}
.cover-shoe{position:absolute;left:5vw;right:3vw;top:calc(13svh + 68vw);transform-origin:50% 60%;animation:float 14s var(--f-ease) infinite alternate}
.cover-shoe img{width:100%;filter:drop-shadow(0 30px 22px rgba(60,20,40,.22)) drop-shadow(0 6px 6px rgba(60,20,40,.18));transform:rotate(-9deg)}
@keyframes float{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(1vw,-1.4svh,0) scale(1.035)}}
.cover-copy{position:absolute;left:0;right:0;bottom:calc(96px + var(--safe-b));text-align:center;display:grid;justify-items:center;gap:14px;padding:0 28px}
.cover h1{font:300 54px/1 var(--f-serif);letter-spacing:-.01em}
.cover h1 em{font-style:italic;color:var(--f-fx)}
.cover-sub{font:300 14px/1.55 var(--f-sans);color:var(--f-ink-2)}
.scroll-cue{position:absolute;left:50%;bottom:calc(22px + var(--safe-b));transform:translateX(-50%);display:grid;justify-items:center;gap:10px;font:500 9.5px/1 var(--f-sans);letter-spacing:.38em;text-transform:uppercase;color:var(--f-ink-2);padding-left:.38em}
.scroll-cue i{width:1px;height:34px;background:linear-gradient(var(--f-ink),transparent);animation:cue 2.4s var(--f-ease) infinite}
@keyframes cue{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}}

/* Product slide */
.slide{background:var(--tint)}
.slide::before{content:"";position:absolute;inset:0;background:radial-gradient(90% 55% at 50% 36%,rgba(255,255,255,.85),rgba(255,255,255,0) 70%);pointer-events:none}
.ghost{position:absolute;left:0;right:0;top:12svh;text-align:center;white-space:nowrap;font:italic 300 38vw/1 var(--f-serif);letter-spacing:-.04em;color:var(--f-fx);opacity:.09;user-select:none;pointer-events:none;transform:translateX(var(--gx,0));transition:transform 1.2s var(--f-ease)}
.stage{position:absolute;left:0;right:0;top:calc(72px + env(safe-area-inset-top,0px));height:calc(100svh - 72px - 352px - var(--safe-b));min-height:250px;display:grid;place-items:center;cursor:pointer}
.stage .shoe{position:relative;width:100%;height:100%;display:grid;place-items:center}
.stage img{position:absolute;max-width:var(--mw,94%);max-height:88%;width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 22px 18px rgba(60,20,40,.16)) drop-shadow(0 4px 4px rgba(60,20,40,.14));transition:opacity .55s var(--f-ease),transform .9s var(--f-ease);transform:translateY(var(--ty,0)) rotate(var(--rot,-4deg)) scale(.96);opacity:0}
.stage img.on{opacity:1;transform:translateY(var(--ty,0)) rotate(var(--rot,-4deg)) scale(1)}
.slide.in .stage img.on{animation:settle 1.1s var(--f-ease) both}
@keyframes settle{from{transform:translateY(var(--ty,0)) rotate(calc(var(--rot,-4deg) - 5deg)) translateX(10vw) scale(.94);opacity:0}to{transform:translateY(var(--ty,0)) rotate(var(--rot,-4deg)) scale(1);opacity:1}}
.floor{display:none;position:absolute;left:50%;bottom:6%;width:62%;height:18px;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(60,20,40,.16),transparent);filter:blur(2px)}

.copy{position:absolute;left:0;right:0;bottom:0;padding:0 26px calc(26px + var(--safe-b));display:grid;gap:0}
.copy .eyebrow{color:var(--f-fx);margin-bottom:14px}
.copy .eyebrow .n{color:var(--f-ink-2);letter-spacing:.2em}
.copy h2{font:300 64px/.92 var(--f-serif);letter-spacing:-.02em}
.copy h2 em{display:block;font:italic 400 22px/1.1 var(--f-serif);letter-spacing:0;color:var(--f-ink-2);margin-bottom:6px}
.copy .line{font:300 14px/1.5 var(--f-sans);color:var(--f-ink-2);margin-top:14px;max-width:30ch}
.row{display:flex;align-items:center;justify-content:space-between;margin-top:20px}
.swatches{display:flex;gap:10px;align-items:center}
.sw{position:relative;width:22px;height:22px;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 1px rgba(27,20,25,.16);transition:transform .35s var(--f-spring)}
.sw::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid var(--f-ink);opacity:0;transform:scale(.8);transition:all .35s var(--f-ease)}
.sw[aria-pressed="true"]::after{opacity:1;transform:scale(1)}
.sw:active{transform:scale(.88)}
.cname{font:500 10px/1 var(--f-sans);letter-spacing:.22em;text-transform:uppercase;color:var(--f-ink-2)}
.foot{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:20px;padding-top:18px;border-top:1px solid var(--f-rule)}
.foot .price{font:400 32px/1 var(--f-serif);font-variant-numeric:lining-nums;letter-spacing:.01em}
.foot .price small{font:500 9.5px/1 var(--f-sans);letter-spacing:.24em;color:var(--f-ink-3);display:block;margin-bottom:6px}
.actions{display:flex;align-items:center;gap:18px}
.more{font:500 10.5px/1 var(--f-sans);letter-spacing:.24em;text-transform:uppercase;padding:8px 0;border-bottom:1px solid var(--f-ink)}
.cta{display:flex;align-items:center;gap:12px;height:50px;padding:0 10px 0 22px;border-radius:50px;background:var(--f-fx);color:#fff;font:500 11px/1 var(--f-sans);letter-spacing:.24em;text-transform:uppercase;box-shadow:0 12px 26px -10px rgba(230,0,126,.65);transition:transform .3s var(--f-spring),background .3s}
.cta i{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.18);font-style:normal;font-size:15px;letter-spacing:0}
.cta:active{transform:scale(.96);background:var(--f-fx-deep)}

/* end slide */
.end{background:var(--f-fx);color:#fff;display:grid;align-content:center;justify-items:center;text-align:center;padding:0 30px;gap:22px}
.end .eyebrow{color:rgba(255,255,255,.8)}
.end h2{font:300 56px/.98 var(--f-serif)}
.end h2 em{font-style:italic}
.end p{font:300 14px/1.6 var(--f-sans);color:rgba(255,255,255,.86);max-width:28ch}
.end .ghostbtn{margin-top:8px;display:flex;align-items:center;gap:12px;height:52px;padding:0 26px;border-radius:52px;background:#fff;color:var(--f-fx);font:500 11px/1 var(--f-sans);letter-spacing:.24em;text-transform:uppercase}
.end .mini{display:flex;gap:10px;margin-top:6px}
.end .mini button{font:500 10px/1 var(--f-sans);letter-spacing:.2em;text-transform:uppercase;padding:10px 14px;border:1px solid rgba(255,255,255,.45);border-radius:30px}
.end .ffbig{width:62px;height:62px;border-radius:50%;box-shadow:0 0 0 1px rgba(255,255,255,.5)}

/* ── Curtain ── */
.curtain{position:fixed;inset:0;z-index:50;pointer-events:none}
.curtain-in{position:absolute;inset:0;background:var(--f-paper-2);clip-path:inset(0 0 100% 0);transition:clip-path .8s var(--f-ease);display:flex;flex-direction:column;padding:calc(22px + env(safe-area-inset-top,0px)) 26px calc(28px + var(--safe-b))}
.curtain.open{pointer-events:auto}
.curtain.open .curtain-in{clip-path:inset(0 0 0 0)}
.curtain-top{display:flex;justify-content:space-between;align-items:center;height:40px}
.x{position:relative;width:40px;height:40px;border-radius:50%;border:1px solid var(--f-rule)}
.x i{position:absolute;left:12px;top:19.5px;width:16px;height:1px;background:var(--f-ink);transform:rotate(45deg)}.x i+i{transform:rotate(-45deg)}
.toc{list-style:none;margin-top:auto;margin-bottom:auto;display:grid}
.toc li{border-top:1px solid var(--f-rule);opacity:0;transform:translateY(-14px);transition:all .6s var(--f-ease)}
.toc li:last-child{border-bottom:1px solid var(--f-rule)}
.curtain.open .toc li{opacity:1;transform:none}
.toc button{width:100%;display:grid;grid-template-columns:30px 1fr 96px;align-items:center;gap:6px;padding:16px 0;text-align:left}
.toc .n{font:400 11px/1 var(--f-sans);letter-spacing:.18em;color:var(--f-ink-3)}
.toc .t{font:300 44px/1 var(--f-serif);letter-spacing:-.01em}
.toc .t small{display:block;margin-top:8px;font:italic 400 16px/1 var(--f-serif);color:var(--f-ink-2)}.toc .t small b{font:500 9.5px/1 var(--f-sans);font-style:normal;letter-spacing:.2em;color:var(--f-fx);margin-left:10px}
.toc .s{font:italic 400 16px/1 var(--f-serif);color:var(--f-ink-2);text-align:right}
.toc .s small{display:block;font:500 9.5px/1 var(--f-sans);font-style:normal;letter-spacing:.2em;color:var(--f-ink-3);margin-top:6px}
.toc .th{height:62px;display:grid;place-items:center}.toc .th img{max-width:96px;max-height:62px;object-fit:contain;transform:rotate(-6deg);filter:drop-shadow(0 8px 6px rgba(60,20,40,.15))}
.curtain-foot{display:flex;justify-content:space-between;align-items:center;font:400 11px/1.4 var(--f-sans);color:var(--f-ink-2);letter-spacing:.04em}
.curtain-foot a{font-weight:500;letter-spacing:.2em;text-transform:uppercase;font-size:10.5px;color:var(--f-ink);border-bottom:1px solid var(--f-fx);padding-bottom:5px}

/* ── Sheet ── */
.scrim{position:fixed;inset:0;z-index:40;background:rgba(40,16,30,.28);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .5s var(--f-ease)}
.scrim.on{opacity:1;pointer-events:auto}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:45;height:92svh;border-radius:26px 26px 0 0;background:rgba(255,253,251,.94);backdrop-filter:blur(24px) saturate(1.3);-webkit-backdrop-filter:blur(24px) saturate(1.3);box-shadow:0 -20px 60px -20px rgba(60,20,40,.35);transform:translateY(104%);transition:transform .62s var(--f-ease);display:flex;flex-direction:column;overflow:hidden}
.sheet.on{transform:translateY(0)}
.sheet.drag{transition:none}
.grab{position:absolute;left:0;right:0;top:0;height:30px;z-index:3;display:grid;place-items:center;touch-action:none}
.grab i{width:38px;height:4px;border-radius:4px;background:rgba(27,20,25,.22)}
.sheet-scroll{flex:1;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none}
.sheet-scroll::-webkit-scrollbar{display:none}
.gallery{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;background:var(--tint,#f3ece6);height:min(46svh,380px)}
.gallery::-webkit-scrollbar{display:none}
.gallery figure{flex:0 0 100%;scroll-snap-align:center;display:grid;place-items:center;position:relative;padding:34px 22px 18px}
.gallery img{max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 18px 16px rgba(60,20,40,.16))}
.gallery figcaption{position:absolute;left:22px;bottom:14px;font:500 9.5px/1 var(--f-sans);letter-spacing:.24em;text-transform:uppercase;color:var(--f-ink-2)}
.dots{display:flex;justify-content:center;gap:6px;margin-top:-22px;position:relative;height:22px;align-items:center}
.dots i{width:5px;height:5px;border-radius:5px;background:rgba(27,20,25,.2);transition:all .4s var(--f-ease)}
.dots i.on{width:18px;background:var(--f-fx)}
.sheet-body{padding:26px 24px 30px;display:grid;gap:0}
.sheet-body>.eyebrow{color:var(--f-fx)}
.sheet-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:12px}
.sheet-head h2{font:300 46px/.95 var(--f-serif);letter-spacing:-.015em}
.sheet-head .price{font:400 26px/1 var(--f-serif);white-space:nowrap}
.sline{font:300 14px/1.55 var(--f-sans);color:var(--f-ink-2);margin-top:12px}
.pick{margin-top:26px}
.pick-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px;font:500 10px/1 var(--f-sans);letter-spacing:.26em;text-transform:uppercase;color:var(--f-ink-3)}
.pick-h b{font:italic 400 17px/1 var(--f-serif);letter-spacing:0;text-transform:none;color:var(--f-ink)}
.swatches.lg{gap:16px;padding-left:5px}
.swatches.lg .sw{width:30px;height:30px}
.note{font:400 11.5px/1.4 var(--f-sans);color:var(--f-ink-3);margin-top:12px}
.sizes{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.sz{height:50px;border-radius:12px;border:1px solid var(--f-rule);font:400 20px/1 var(--f-serif);font-variant-numeric:lining-nums;background:rgba(255,255,255,.6);transition:all .3s var(--f-ease);position:relative}
.sz[aria-pressed="true"]{background:var(--f-ink);color:#fff;border-color:var(--f-ink)}
.sz:disabled{color:var(--f-ink-3);background:transparent;cursor:not-allowed;opacity:.55}
.sz:disabled::after{content:"";position:absolute;left:22%;right:22%;top:50%;height:1px;background:var(--f-ink-3);transform:rotate(-28deg)}
.notes{list-style:none;margin-top:28px;border-top:1px solid var(--f-rule)}
.notes li{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--f-rule);font:300 13.5px/1.45 var(--f-sans);color:var(--f-ink-2)}
.notes li::before{content:"";flex:0 0 5px;height:5px;margin-top:7px;border-radius:50%;background:var(--f-fx)}
.assure{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.assure li{padding:14px;border-radius:14px;background:var(--f-fx-soft);font:400 12.5px/1.35 var(--f-sans);color:var(--f-ink)}
.assure span{display:block;font:500 9.5px/1 var(--f-sans);letter-spacing:.24em;text-transform:uppercase;color:var(--f-fx-deep);margin-bottom:8px}
.pdp{margin-top:22px;justify-self:start;font:500 10.5px/1 var(--f-sans);letter-spacing:.22em;text-transform:uppercase;border-bottom:1px solid var(--f-ink);padding-bottom:6px}
.buybar{padding:12px 16px calc(14px + var(--safe-b));border-top:1px solid var(--f-rule);background:rgba(255,253,251,.96)}
.buy{display:flex;align-items:center;justify-content:space-between;height:58px;padding:0 10px 0 26px;border-radius:58px;background:var(--f-fx);color:#fff;font:500 11.5px/1 var(--f-sans);letter-spacing:.22em;text-transform:uppercase;box-shadow:0 14px 30px -12px rgba(230,0,126,.7);transition:all .35s var(--f-ease)}
.buy i{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.2);font-style:normal;font-size:17px}
.buy[aria-disabled="true"]{background:#e9e1dc;color:var(--f-ink-2);box-shadow:none;pointer-events:none}
.buy[aria-disabled="true"] i{background:rgba(27,20,25,.06)}
.buy.go{animation:pulse .6s var(--f-spring)}
@keyframes pulse{50%{transform:scale(1.03)}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important}
  .stage img.on{opacity:1}
}
@media (min-width:600px){
  body{background:#e9e0d8}
  .reel,.bar,.ticks,.curtain-in,.sheet{max-width:430px;margin:0 auto}
  .bar{left:50%;transform:translateX(-50%);width:430px}
  .ticks{right:calc(50% - 205px)}
  .cover-word{font-size:197px}.ghost{font-size:163px}
  .sheet{left:50%;transform:translate(-50%,104%);width:430px}.sheet.on{transform:translate(-50%,0)}
}

/* ═════ Catálogo completo: escala ═════ */
.prog{position:fixed;right:12px;top:50%;transform:translateY(-50%);z-index:25;width:1px;height:120px;background:rgba(27,20,25,.14);transition:opacity .5s}
.prog i{position:absolute;left:-1px;top:0;width:3px;height:var(--ph,10%);background:var(--f-fx);border-radius:3px;transform:translateY(var(--py,0));transition:transform .5s var(--f-ease),height .5s var(--f-ease)}
.count{min-width:110px;line-height:1.35}
.count small{display:block;font:500 9px/1 var(--f-sans);letter-spacing:.24em;text-transform:uppercase;color:var(--f-fx);margin-bottom:5px}

/* intro de categoría */
.catintro{background:var(--tint)}
.catintro .ci-n{position:absolute;left:26px;top:calc(96px + env(safe-area-inset-top,0px));font:500 10.5px/1 var(--f-sans);letter-spacing:.32em;text-transform:uppercase;color:var(--f-fx);display:flex;gap:12px;align-items:center}
.catintro .ci-strip{position:absolute;left:0;right:0;top:calc(150px + env(safe-area-inset-top,0px));height:36svh;display:flex;align-items:center;justify-content:center}
.catintro .ci-strip img{position:absolute;max-height:78%;max-width:62%;object-fit:contain;filter:drop-shadow(0 18px 16px rgba(60,20,40,.16));transition:opacity .8s var(--f-ease)}
.catintro .ci-strip img:nth-child(1){transform:translateX(-24%) rotate(-8deg) scale(.78);opacity:.85;z-index:1}
.catintro .ci-strip img:nth-child(2){transform:rotate(-3deg);z-index:3}
.catintro .ci-strip img:nth-child(3){transform:translateX(24%) rotate(6deg) scale(.78);opacity:.85;z-index:2}
.catintro .ci-copy{position:absolute;left:0;right:0;bottom:calc(34px + var(--safe-b));padding:0 26px}
.catintro h2{font:300 clamp(56px,17vw,84px)/.9 var(--f-serif);letter-spacing:-.025em}
.catintro h2 em{font-style:italic;color:var(--f-fx)}
.catintro .ci-meta{display:flex;gap:22px;margin-top:18px;font:300 14px/1.4 var(--f-sans);color:var(--f-ink-2)}
.catintro .ci-meta b{display:block;font:400 30px/1 var(--f-serif);color:var(--f-ink);margin-bottom:4px}
.catintro .ci-act{display:flex;gap:12px;margin-top:26px;padding-top:20px;border-top:1px solid var(--f-rule);align-items:center;justify-content:space-between}
.btn-line{display:flex;align-items:center;gap:10px;height:48px;padding:0 22px;border-radius:48px;border:1px solid var(--f-ink);font:500 10.5px/1 var(--f-sans);letter-spacing:.22em;text-transform:uppercase}
.hint{font:500 9.5px/1 var(--f-sans);letter-spacing:.3em;text-transform:uppercase;color:var(--f-ink-3);display:flex;align-items:center;gap:10px}
.hint i{width:1px;height:22px;background:linear-gradient(var(--f-ink-3),transparent)}

/* nombres largos */
.copy h2.m{font-size:52px}.copy h2.l{font-size:42px}.copy h2.xl{font-size:34px}
.sheet-head h2.l{font-size:36px}.sheet-head h2.xl{font-size:30px}
/* orientación de foto */
.stage img.tall{max-width:62%;--rot:-2deg}
.stage img.sq{max-width:78%}
.stage img.nocut{border-radius:18px;max-width:86%;max-height:80%;filter:drop-shadow(0 18px 24px rgba(60,20,40,.14))}
.gallery img.nocut{border-radius:14px}
.stage img:not([src]){visibility:hidden}

/* agotado */
.badge{position:absolute;right:26px;top:calc(96px + env(safe-area-inset-top,0px));z-index:3;font:500 9.5px/1 var(--f-sans);letter-spacing:.26em;text-transform:uppercase;padding:9px 12px;border-radius:30px;background:var(--f-ink);color:#fff}
.badge.warn{background:rgba(255,253,251,.75);color:var(--f-ink-2);border:1px solid var(--f-rule)}
.slide.out .stage img{filter:grayscale(.55) opacity(.72) drop-shadow(0 18px 16px rgba(60,20,40,.1))}
.cta.off{background:#e3dbd6;color:var(--f-ink-2);box-shadow:none}
.cta.off i{background:rgba(27,20,25,.06)}

/* índice escalable */
.curtain-in{overflow-y:auto}
.toc{margin-top:28px;margin-bottom:18px}
.toc button{grid-template-columns:30px 1fr 84px;padding:12px 0}
.toc .t{font-size:34px}
.toc .t small b{color:var(--f-ink-3)}
.toc .t small i{font-style:normal;font:500 9.5px/1 var(--f-sans);letter-spacing:.2em;color:var(--f-fx);margin-left:10px}
.toc .th{height:54px}.toc .th img{max-width:84px;max-height:54px}
.toc-total{font:italic 400 16px/1.3 var(--f-serif);color:var(--f-ink-2);margin-bottom:22px}
.curtain-foot{margin-top:auto}

/* cuadrícula */
.grid{position:fixed;inset:0;z-index:48;background:var(--f-paper-2);transform:translateY(102%);transition:transform .65s var(--f-ease);display:flex;flex-direction:column}
.grid.on{transform:none}
.grid-top{display:flex;justify-content:space-between;align-items:flex-end;padding:calc(22px + env(safe-area-inset-top,0px)) 22px 14px}
.grid-top .eyebrow{color:var(--f-fx);margin-bottom:10px}
.grid-top h3{font:300 40px/1 var(--f-serif);letter-spacing:-.01em}
.grid-chips{display:flex;gap:8px;overflow-x:auto;padding:4px 22px 14px;scrollbar-width:none;border-bottom:1px solid var(--f-rule)}
.grid-chips::-webkit-scrollbar{display:none}
.grid-chips button{flex:0 0 auto;height:34px;padding:0 14px;border-radius:34px;border:1px solid var(--f-rule);font:500 9.5px/1 var(--f-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--f-ink-2)}
.grid-chips button[aria-pressed="true"]{background:var(--f-ink);border-color:var(--f-ink);color:#fff}
.grid-list{list-style:none;flex:1;overflow-y:auto;display:grid;grid-template-columns:1fr 1fr;gap:22px 12px;padding:18px 16px calc(30px + var(--safe-b));align-content:start}
.grid-list button{width:100%;text-align:left;display:grid;gap:10px}
.grid-list .gimg{aspect-ratio:1/1.05;border-radius:16px;background:var(--tint,#f3ece6);display:grid;place-items:center;position:relative;overflow:hidden}
.grid-list .gimg img{max-width:84%;max-height:78%;object-fit:contain;transform:rotate(-5deg);filter:drop-shadow(0 10px 8px rgba(60,20,40,.14))}
.grid-list .gimg img.nocut{transform:none;border-radius:10px;max-width:90%}
.grid-list .gimg .badge{top:10px;right:10px;padding:6px 8px;font-size:8.5px}
.grid-list .out .gimg img{filter:grayscale(.6) opacity(.65)}
.grid-list .gk{font:500 9px/1 var(--f-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--f-ink-3)}
.grid-list .gn{font:400 22px/1 var(--f-serif)}
.grid-list .gp{font:400 13px/1 var(--f-sans);color:var(--f-ink-2);margin-top:-4px}
.sizes{grid-template-columns:repeat(auto-fill,minmax(48px,1fr))}
.sz.wide{grid-column:span 2}
.stage img{--ty:7svh}.stage img.tall{--ty:2svh}.stage img.sq{--ty:4svh}.stage img.nocut{--ty:3svh;--rot:0deg}

.toc .t{font-size:30px;white-space:nowrap}
.catintro .ci-strip{top:calc(130px + env(safe-area-inset-top,0px));height:42svh}
.catintro .ci-strip img{position:absolute;width:56%;height:62%;max-width:none;max-height:none;object-fit:contain}
.catintro .ci-strip img:nth-child(1){left:-2%;top:6%;transform:rotate(-9deg) scale(.86);opacity:1;z-index:1}
.catintro .ci-strip img:nth-child(2){left:22%;top:22%;width:58%;transform:rotate(-3deg);z-index:3}
.catintro .ci-strip img:nth-child(3){right:-2%;top:40%;transform:rotate(7deg) scale(.86);opacity:1;z-index:2}
.catintro .ci-strip img:only-child{left:15%;width:70%;top:18%;transform:rotate(-4deg)}
