/* Rights v4 · Tienda 3D (solo chocolates.html)
   Portada: la barra se rompe y abre la tienda. Tarjetas: el empaque real se inclina con el cursor, el dedo o el teléfono.
   Estado por defecto = versión estática (sin JS, sin WebGL o con movimiento reducido).
   La versión animada solo se activa con html.t3d-js y prefers-reduced-motion: no-preference. */

:root{--t3d-navh:73px;--t3d-r:20px;--t3d-gap:clamp(14px,2vw,28px)}
@media (max-width:640px){:root{--t3d-navh:63px}}

/* ================= PORTADA ================= */
.t3d{position:relative;background:#eee3cf}
.t3d__stage{position:relative;overflow:hidden;isolation:isolate;color:var(--ink);
  background:
    radial-gradient(70% 55% at 50% 66%,rgba(255,252,246,.95) 0%,rgba(255,252,246,0) 70%),
    radial-gradient(130% 95% at 50% 40%,#f8f1e6 0%,#efe3cf 55%,#e3d2b6 100%);
  padding-bottom:clamp(40px,6vw,80px)}
.t3d__stage::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;opacity:.32;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .55 0 0 0 0 .42 0 0 0 0 .3 0 0 0 .22 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
.t3d__canvas{display:none}
.t3d__deco{position:absolute;z-index:0;pointer-events:none;user-select:none;max-width:none}
.t3d__deco--bird{left:-2.5%;bottom:-4%;height:min(78%,640px);width:auto}
.t3d__deco--tucan{right:-6%;top:2%;width:min(31vw,470px);height:auto}
.t3d__head{position:relative;z-index:3;text-align:center;max-width:860px;margin:0 auto;padding:clamp(36px,7vh,72px) var(--pad) 0}
.t3d__head .eyebrow{margin-bottom:.9rem}
.t3d__title{font-size:clamp(2.7rem,6.4vw,5.6rem);font-weight:300;letter-spacing:-.035em;line-height:.98}
.t3d__echo{font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(1.05rem,1.7vw,1.4rem);color:var(--ink-70);margin-top:.75rem}
.t3d__lead{margin:.8rem auto 0;max-width:44ch;color:var(--ink-70);font-size:clamp(.98rem,1.25vw,1.12rem);line-height:1.5}
.t3d__hint{display:none}
.t3d__portals{position:relative;z-index:4;padding:clamp(28px,4vw,52px) var(--pad) 0}
.t3d__portals ul{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(12px,2vw,28px);max-width:1180px;margin:0 auto}
.t3d__portal{display:flex;flex-direction:column;align-items:center;text-align:center;color:var(--ink);border-radius:18px;outline:0}
.t3d__pdisc{position:relative;display:block;width:100%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(70% 70% at 50% 38%,#4d2c1c 0%,#2b170d 62%,#1a0d06 100%);
  box-shadow:inset 0 0 0 2px var(--gold),inset 0 0 0 7px rgba(201,162,74,.12),0 26px 40px -28px rgba(31,16,8,.7);transition:transform .45s var(--ease)}
.t3d__portal:hover .t3d__pdisc{transform:translateY(-4px)}
.t3d__pmedia{position:absolute;inset:-6% 8% 10%;display:block}
.t3d__pmedia img{position:absolute;bottom:0;height:100%;width:auto;max-width:none;left:50%;transform:translateX(-50%);filter:drop-shadow(0 10px 12px rgba(0,0,0,.35))}
.t3d__pmedia--fan img{height:86%}
.t3d__pmedia--fan img:nth-child(1){transform:translateX(-95%) rotate(-14deg);transform-origin:50% 100%}
.t3d__pmedia--fan img:nth-child(2){transform:translateX(-72%) rotate(-5deg);transform-origin:50% 100%}
.t3d__pmedia--fan img:nth-child(3){transform:translateX(-28%) rotate(5deg);transform-origin:50% 100%}
.t3d__pmedia--fan img:nth-child(4){transform:translateX(-5%) rotate(14deg);transform-origin:50% 100%}
.t3d__pmedia--trio img{height:80%}
.t3d__pmedia--trio img:nth-child(1){transform:translateX(-88%) rotate(-9deg)}
.t3d__pmedia--trio img:nth-child(2){transform:translateX(-12%) rotate(9deg)}
.t3d__pmedia--trio img:nth-child(3){height:94%}
.t3d__pmedia--taza img:nth-child(1){height:88%;transform:translateX(-78%)}
.t3d__pmedia--taza img:nth-child(2){height:66%;transform:translateX(-22%)}
.t3d__pname{display:block;margin-top:.85rem;font-weight:600;font-size:clamp(.95rem,1.15vw,1.08rem);letter-spacing:-.005em;line-height:1.2}
.t3d__psub{display:block;margin-top:.25rem;font-family:var(--sub);font-size:.64rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-3);line-height:1.35}
.t3d__portal:focus-visible .t3d__pdisc{outline:2px solid var(--gold-3);outline-offset:5px}
.t3d__portal:focus-visible .t3d__pname{text-decoration:underline;text-underline-offset:4px}
@media (max-width:900px){
  .t3d__portals ul{grid-template-columns:repeat(3,minmax(0,1fr))}
  .t3d__portals li:nth-child(4){grid-column:1/span 1;justify-self:end;width:100%}
  .t3d__deco--tucan{width:44vw;right:-14%;top:auto;bottom:-3%}
  .t3d__deco--bird{height:46%;left:-9%}
}
@media (max-width:640px){
  .t3d-js .t3d:not(.t3d--static) .t3d__pname{font-size:.9rem;margin-top:.55rem}
  .t3d-js .t3d:not(.t3d--static) .t3d__psub{font-size:.56rem;letter-spacing:.1em}
}
@media (max-width:520px){
  .t3d__portals ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 14px}
  .t3d__portals li:nth-child(4){grid-column:auto}
  .t3d__portals li:nth-child(5){grid-column:1/-1;width:50%;justify-self:center}
}

/* ---------- Portada animada (WebGL) ---------- */
@media (prefers-reduced-motion:no-preference){
  .t3d-js .t3d:not(.t3d--static){height:calc(100svh - var(--t3d-navh) + 170svh)}
  .t3d-js .t3d:not(.t3d--static) .t3d__stage{position:sticky;top:var(--t3d-navh);height:calc(100svh - var(--t3d-navh));padding:0;touch-action:pan-y}
  .t3d-js .t3d:not(.t3d--static) .t3d__canvas{display:block;position:absolute;inset:0;width:100%;height:100%;z-index:1;opacity:0;transform:scale(1.04);transition:opacity 1.1s var(--ease),transform 1.6s var(--ease)}
  .t3d-js .t3d.is-live .t3d__canvas{opacity:1;transform:none}
  .t3d-js .t3d:not(.t3d--static) .t3d__deco{will-change:transform}
  .t3d-js .t3d:not(.t3d--static) .t3d__head{pointer-events:none}
  .t3d-js .t3d:not(.t3d--static) .t3d__head .eyebrow,
  .t3d-js .t3d:not(.t3d--static) .t3d__title,
  .t3d-js .t3d:not(.t3d--static) .t3d__echo,
  .t3d-js .t3d:not(.t3d--static) .t3d__lead{opacity:0;transform:translateY(16px);animation:t3dRise 1s var(--ease) forwards}
  .t3d-js .t3d:not(.t3d--static) .t3d__title{animation-delay:.08s}
  .t3d-js .t3d:not(.t3d--static) .t3d__echo{animation-delay:.16s}
  .t3d-js .t3d:not(.t3d--static) .t3d__lead{animation-delay:.24s}
  .t3d-js .t3d:not(.t3d--static) .t3d__hint{display:flex;flex-direction:column;align-items:center;gap:.7rem;position:absolute;left:50%;bottom:clamp(16px,3.6vh,34px);z-index:3;transform:translateX(-50%);
    font-family:var(--sub);font-size:.68rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-3);white-space:nowrap;pointer-events:none;transition:opacity .4s}
  .t3d-js .t3d:not(.t3d--static) .t3d__hint i{display:block;width:1px;height:34px;background:linear-gradient(var(--gold-3),transparent);transform-origin:top;animation:t3dLine 1.8s var(--ease) infinite}
  .t3d-js .t3d:not(.t3d--static) .t3d__hint b{font-weight:500}
  .t3d-js .t3d:not(.t3d--static) .t3d__hint .t3d__hint-b{display:none}
  .t3d-js .t3d.is-open .t3d__hint .t3d__hint-a{display:none}
  .t3d-js .t3d.is-open .t3d__hint .t3d__hint-b{display:inline}
  .t3d-js .t3d.is-open .t3d__hint i{display:none}
  .t3d-js .t3d:not(.t3d--static) .t3d__portals{position:absolute;inset:0;padding:0;pointer-events:none}
  .t3d-js .t3d:not(.t3d--static) .t3d__portals ul{display:block;max-width:none;margin:0}
  .t3d-js .t3d:not(.t3d--static) .t3d__portal{position:absolute;left:0;top:0;width:var(--d,160px);transform:translate3d(var(--x,-999px),var(--y,0px),0);opacity:0;pointer-events:none;transition:opacity .45s var(--ease)}
  .t3d-js .t3d:not(.t3d--static) .t3d__pdisc{width:var(--d,160px);height:var(--d,160px);background:none;box-shadow:none;transform:none!important}
  .t3d-js .t3d:not(.t3d--static) .t3d__pmedia{display:none}
  .t3d-js .t3d:not(.t3d--static) .t3d__pname,
  .t3d-js .t3d:not(.t3d--static) .t3d__psub{width:var(--lw,200px);margin-left:calc((var(--d,160px) - var(--lw,200px)) / 2);text-shadow:0 1px 0 rgba(255,250,240,.8)}
  .t3d-js .t3d:not(.t3d--static) .t3d__pname{margin-top:.75rem}
  .t3d-js .t3d.is-open .t3d__portal,
  .t3d-js .t3d.is-focus .t3d__portal{opacity:1;pointer-events:auto}
  .t3d-js .t3d:not(.t3d--static) .t3d__portal:focus-visible .t3d__pdisc{outline:2px solid var(--gold-3);outline-offset:8px;border-radius:50%}
}
@keyframes t3dRise{to{opacity:1;transform:none}}
@keyframes t3dLine{0%{transform:scaleY(0);opacity:1}60%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}

/* ================= TARJETAS 3D ================= */
.tgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(18px,2.4vw,34px) var(--t3d-gap)}
.tgrid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1100px){.tgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){.tgrid--3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.tgrid--3{grid-template-columns:1fr}}

.tc{position:relative;display:flex;flex-direction:column;min-width:0;
  --rx:0deg;--ry:0deg;--lift:0px;--gx:50%;--gy:32%;--go:0;--sx:0px;--sy:0px;--ss:1;--ar:4/5}
.tc__stage{position:relative;display:block;aspect-ratio:var(--ar);border-radius:var(--t3d-r);perspective:1000px;isolation:isolate;
  background:radial-gradient(88% 72% at 50% 32%,#fffdf9 0%,#f7f0e4 52%,#ecdfca 100%);box-shadow:inset 0 0 0 1px rgba(36,24,18,.06)}
.tc__stage::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(55% 45% at var(--gx) var(--gy),rgba(255,255,255,.75),rgba(255,255,255,0) 70%);opacity:var(--go)}
.tc__float{position:absolute;inset:9% 14% 12%;transform-style:preserve-3d}
.tc__shadow{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:brightness(0) blur(14px);opacity:.24;pointer-events:none;
  transform:translate3d(var(--sx),calc(var(--sy) + 16px),0) scale(calc(var(--ss) * .95))}
.tc__floor{position:absolute;left:18%;right:18%;bottom:-5%;height:9%;border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(48,26,14,.32),rgba(48,26,14,0));transform:translate3d(calc(var(--sx) * .6),0,0) scaleX(calc(1.08 - (var(--ss) - 1) * 2))}
.tc__obj{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(var(--rx)) rotateY(var(--ry)) translateZ(var(--lift))}
.tc__img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}
.tc__glare{position:absolute;inset:0;pointer-events:none;transform:translateZ(1px);
  background:radial-gradient(40% 34% at var(--gx) var(--gy),rgba(255,255,255,.85),rgba(255,255,255,0) 72%),linear-gradient(115deg,rgba(255,255,255,0) 30%,rgba(255,255,255,.18) 48%,rgba(255,255,255,0) 60%);
  opacity:calc(var(--go) * .55);-webkit-mask-size:contain;mask-size:contain;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.tc__badge{position:absolute;top:.75rem;left:.75rem;z-index:3;pointer-events:none}
.badge--line-gold{background:rgba(255,253,249,.9);border:1px solid var(--gold);color:var(--gold-3)}
.tc__body{display:flex;flex-direction:column;gap:.3rem;flex:1;padding:1rem .15rem 0}
.tc__pct{font-family:var(--sub);font-size:.64rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-3)}
.tc__name{margin:0;font-family:var(--serif);font-size:clamp(1rem,1.25vw,1.16rem);font-weight:600;line-height:1.22;letter-spacing:-.005em}
.tc__name a{outline:0}
.tc__name a::after{content:"";position:absolute;left:0;right:0;top:0;aspect-ratio:var(--ar);z-index:2;border-radius:var(--t3d-r)}
.tc__name a:focus-visible{text-decoration:underline;text-underline-offset:3px}
.tc__name a:focus-visible::after{outline:2px solid var(--gold-3);outline-offset:3px}
.tc__name a:hover{color:var(--molten)}
.tc__note{font-size:.86rem;line-height:1.45;color:var(--ink-70);flex:1}
.tc__buy{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:.5rem .7rem;flex-wrap:wrap;margin-top:.55rem}
.tc__price{font-size:1.14rem;font-weight:400;letter-spacing:-.01em}
.tc__price small{font-size:.72rem;color:var(--ink-45);margin-left:.25rem}
.tc__buy .btn{padding:.6rem 1.1rem}
.tc__quote{display:inline-flex;align-items:center;gap:.45rem;padding:.55rem .95rem;border-radius:999px;border:1px solid var(--line);font-size:.8rem;font-weight:500;color:var(--ink);background:var(--white);transition:border-color .25s,transform .3s var(--ease),background .25s}
.tc__quote svg{flex:none;color:#2b8a57}
.tc__quote:hover{border-color:var(--cacao);transform:translateY(-2px)}
.tc__quote:focus-visible,.tc__buy .btn:focus-visible,.tcar__btn:focus-visible,.tgyro:focus-visible{outline:2px solid var(--gold-3);outline-offset:3px}
.tc__more{font-size:.78rem;font-weight:500;color:var(--gold-3);letter-spacing:.03em}
.tc__more:hover{color:var(--molten)}
@media (max-width:520px){
  .tc__body{padding-top:.8rem}
  .tc__note{font-size:.8rem}
  .tc__buy{gap:.45rem}
  .tc__quote{padding:.5rem .75rem;font-size:.74rem}
  .tc__buy .btn{padding:.55rem .95rem}
  .tc__badge{top:.5rem;left:.5rem;font-size:.58rem;padding:.28rem .5rem}
}

/* oscuro (coberturas) */
.dark .tc__stage{background:radial-gradient(88% 72% at 50% 30%,#4f301f 0%,#2e1a10 58%,#1d0f08 100%);box-shadow:inset 0 0 0 1px rgba(201,162,74,.18)}
.dark .tc__stage::before{background:radial-gradient(55% 45% at var(--gx) var(--gy),rgba(255,226,180,.22),rgba(255,226,180,0) 70%)}
.dark .tc__shadow{opacity:.55}
.dark .tc__floor{background:radial-gradient(closest-side,rgba(0,0,0,.55),rgba(0,0,0,0))}
.dark .tc__name{color:var(--ivory)}
.dark .tc__name a:hover{color:var(--gold-2)}
.dark .tc__pct{color:var(--gold)}
.dark .tc__note{color:var(--ivory-70)}
.dark .tc__price small{color:var(--ivory-45)}
.dark .tc__quote{background:rgba(244,236,221,.06);border-color:var(--ivory-15);color:var(--ivory)}
.dark .tc__quote svg{color:#58c48b}
.dark .tc__quote:hover{border-color:var(--gold)}
.dark .tc .btn--dark{background:var(--gold);color:var(--cacao-2)}
.dark .tc .btn--dark:hover{background:var(--gold-2)}

/* foto (gotas 200 g) */
.tc--photo .tc__float{inset:7%}
.tc--photo .tc__img{object-fit:cover;border-radius:14px}
.tc--photo .tc__shadow{object-fit:cover;border-radius:14px;filter:brightness(0) blur(18px)}
.tc--photo .tc__glare{border-radius:14px}
.tc--photo .tc__floor{display:none}

/* Animación de reposo y estados (solo con movimiento) */
@media (prefers-reduced-motion:no-preference){
  .tc.is-vis .tc__float{animation:tcFloat 6.6s ease-in-out infinite;animation-delay:var(--fd,0s)}
  .tc__obj{will-change:transform}
}
@keyframes tcFloat{0%,100%{transform:translate3d(0,0,0) rotate(0deg)}50%{transform:translate3d(0,-7px,0) rotate(.45deg)}}

/* ================= BLOQUES AGREGADOS (series, bolsas, Cocoa Bites, líneas) ================= */
.tser{position:relative;margin-top:clamp(56px,7vw,104px);padding-top:clamp(40px,5vw,64px);border-top:1px solid var(--line)}
.dark .tser{border-top-color:var(--ivory-15)}
.tser__head{max-width:760px;margin-bottom:clamp(26px,3.4vw,44px)}
.tser__head .h2,.tser__head .h3{margin:0}
.tser__head .lead{max-width:58ch}
.tser__medals{position:absolute;right:0;top:clamp(28px,4vw,52px);width:clamp(128px,15vw,220px);height:auto;pointer-events:none}
@media (max-width:900px){.tser__medals{position:relative;right:auto;top:auto;display:block;width:30vw;max-width:170px;margin:0 0 1.2rem;transform:none!important}}
.tseries{margin-top:clamp(34px,4.4vw,60px)}
.tser__head + .tseries{margin-top:0}
.tseries__head{display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:.2rem 1.1rem;padding-top:1.1rem;border-top:1px dashed rgba(36,24,18,.14);margin-bottom:clamp(18px,2.4vw,30px)}
.tseries__num{font-family:var(--sub);font-size:.7rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-3)}
.tseries__title{margin:0;font-family:var(--serif);font-size:clamp(1.45rem,2.6vw,2.15rem);font-weight:300;letter-spacing:-.025em;line-height:1.05}
.tseries__desc{grid-column:2;color:var(--ink-70);font-size:.95rem;max-width:62ch;margin-top:.35rem}
.dark .tseries__head{border-top-color:rgba(244,236,221,.16)}
.dark .tseries__num{color:var(--gold)}
.dark .tseries__title{color:var(--ivory)}
.dark .tseries__desc{color:var(--ivory-70)}
@media (max-width:620px){.tseries__head{grid-template-columns:1fr}.tseries__desc{grid-column:1}}

/* Cifras de la portada anterior, en versión clara */
.trust--light{background:var(--paper);backdrop-filter:none;-webkit-backdrop-filter:none;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.trust--light li{color:var(--ink-70);border-right-color:var(--line)}
.trust--light strong{color:var(--gold-3)}
@media (max-width:900px){.trust--light li{border-bottom-color:var(--line)}}

/* Inclinación suave sobre las fotos de las tarjetas existentes (solo con movimiento) */
@media (prefers-reduced-motion:no-preference){
  .product.tp .product__stage{perspective:900px}
  .product.tp .product__stage img{transform:scale(calc(1 + var(--tz,0))) rotateX(calc(var(--rx,0deg) * .45)) rotateY(calc(var(--ry,0deg) * .45));transition:opacity .6s var(--ease)}
  .product.tp .product__stage::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:calc(var(--go,0) * .7);
    background:radial-gradient(48% 40% at var(--gx,50%) var(--gy,30%),rgba(255,255,255,.42),rgba(255,255,255,0) 72%)}
}

/* ================= COLECCIONES: las minibarras salen de la bolsa ================= */
/* Estado abierto por defecto (sin JS o con movimiento reducido se ve todo); cerrado solo con animación */
.tcol__minis,.tcol__pouch{position:absolute;display:block;transition:transform .95s cubic-bezier(.2,.85,.25,1.12),opacity .6s var(--ease)}
.tcol__pouch{left:15%;right:15%;bottom:0;height:72%;transform:translate3d(0,0,30px) scale(.96)}
.tcol__pouch img,.tcol__minis img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 100%}
.tcol__pouch .tc__glare{-webkit-mask-position:50% 100%;mask-position:50% 100%}
.tcol__minis{left:2%;right:2%;top:2%;height:48%;opacity:1;transform:translate3d(0,0,-14px) scale(1) rotateX(0);transform-origin:50% 100%}
.tcol__minis--wellness{left:12%;right:12%;height:56%}
.tcol__fan{position:absolute;left:0;right:0;top:0;height:62%;pointer-events:none;transform:translateZ(-14px)}
.tcol__pack{position:absolute;left:50%;bottom:6%;width:17.5%;aspect-ratio:214/422;background:url(../img/cat3d/col-runa-mini.webp) no-repeat;background-size:300% 200%;
  border-radius:3px;filter:drop-shadow(0 8px 10px rgba(31,16,8,.25));transform-origin:50% 135%;opacity:1;
  transform:translate3d(calc(-50% + var(--ox)),0,0) rotate(var(--rot)) scale(1);transition:transform .95s cubic-bezier(.2,.85,.25,1.12),opacity .5s var(--ease);transition-delay:calc(var(--i) * 45ms)}
@media (prefers-reduced-motion:no-preference){
  .t3d-js .tc--col:not(.is-open) .tcol__minis{opacity:0;transform:translate3d(0,46%,-34px) scale(.62) rotateX(-18deg)}
  .t3d-js .tc--col:not(.is-open) .tcol__pouch{transform:translate3d(0,-6%,24px) scale(1.06)}
  .t3d-js .tc--col:not(.is-open) .tcol__pack{opacity:0;transform:translate3d(-50%,52%,0) rotate(0deg) scale(.7);transition-delay:0s}
}

/* ================= COCOA BITES · carrusel ================= */
.tcar{position:relative;margin:0 calc(var(--pad) * -1)}
.tcar__track{display:flex;gap:var(--t3d-gap);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:var(--pad);
  padding:14px var(--pad) 26px;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;outline:0}
.tcar__track::-webkit-scrollbar{display:none}
.tcar__track:focus-visible{box-shadow:inset 0 0 0 2px var(--gold-3);border-radius:12px}
@media (hover:hover) and (pointer:fine){.tcar__track{cursor:grab}.tcar__track.is-drag{cursor:grabbing}}
.tcar__track.is-drag{scroll-snap-type:none}
.tcar__track.is-drag .tc{pointer-events:none}
.tcar__track>.tc{flex:0 0 clamp(176px,19vw,244px);scroll-snap-align:start}
.tcar__bar{display:flex;align-items:center;gap:1rem;margin-top:.2rem}
.tcar__progress{flex:1;height:2px;border-radius:2px;background:var(--line);overflow:hidden}
.tcar__progress i{display:block;height:100%;width:var(--pw,20%);background:var(--gold-3);transform:translateX(var(--px,0%));transition:transform .2s linear}
.tcar__btn{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:var(--white);color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:background .25s,border-color .25s,opacity .25s,transform .3s var(--ease)}
.tcar__btn:hover:not(:disabled){border-color:var(--cacao);transform:translateY(-2px)}
.tcar__btn:disabled{opacity:.35;cursor:default}
.tbites-head{display:flex;justify-content:space-between;align-items:end;gap:1rem 1.6rem;flex-wrap:wrap;margin-bottom:clamp(8px,1.4vw,16px)}
.tbites-head .tser__head{margin-bottom:0}

/* ================= CHOCOLATE A LA TAZA: bolsa y taza en el mismo encuadre de antes ================= */
.split__fig.tsplit-fig{background:radial-gradient(85% 75% at 40% 34%,#fffaf1 0%,#f6ead6 55%,#e9d6b8 100%)}
.split__fig.tsplit-fig:hover img{transform:none}
.tsplit-fig .tc--taza{position:absolute;inset:0}
.tsplit-fig .tc__stage{position:absolute;inset:0;aspect-ratio:auto;border-radius:0;background:none;box-shadow:none}
.tsplit-fig .tc__stage::before{border-radius:0}
.tc--taza .tc__float{inset:0}
.tc--taza .tc__floor{left:4%;right:40%;bottom:3%;height:7%}
.ttaza__pouch,.ttaza__cup{position:absolute;display:block}
.ttaza__pouch{right:-3%;top:5%;height:72%;aspect-ratio:370/581;transform:translateZ(-12px)}
.ttaza__cup{left:-6%;bottom:-3%;width:51%;aspect-ratio:865/900;transform:translateZ(44px)}
.ttaza__pouch .tc__img,.ttaza__cup .tc__img{object-position:50% 100%}
@media (max-width:900px){
  .ttaza__pouch{height:84%;top:6%;right:-4%}
  .ttaza__cup{width:auto;height:70%;left:4%;bottom:-3%}
}

/* La sombra del carrito cerrado se asomaba por el borde derecho de la portada */
.drawer:not(.is-open) .drawer__panel{box-shadow:none}

/* ================= Decoración con paralaje ================= */
[data-parallax]{will-change:transform}

/* ================= Interruptor de inclinación (teléfono) ================= */
.tgyro{position:fixed;left:14px;bottom:14px;z-index:70;display:inline-flex;align-items:center;gap:.45rem;padding:.5rem .85rem .5rem .6rem;border-radius:999px;
  border:1px solid rgba(201,162,74,.45);background:rgba(31,16,8,.82);color:var(--ivory);font-family:var(--sub);font-size:.7rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;box-shadow:0 12px 30px -14px rgba(0,0,0,.6)}
.tgyro[hidden]{display:none}
.tgyro svg{flex:none}
.tgyro[aria-pressed="true"]{background:var(--gold);color:var(--cacao-2);border-color:var(--gold)}
.tgyro span{display:inline-block;max-width:7em;overflow:hidden;white-space:nowrap;transition:max-width .5s var(--ease),opacity .3s}
.tgyro.is-compact{padding:.55rem}
.tgyro.is-compact span{max-width:0;opacity:0}

/* ================= Movimiento reducido: rejilla estática, sin inclinación ================= */
@media (prefers-reduced-motion:reduce){
  .tc__obj,.tc__shadow,.tc__floor,.tcol__minis,.tcol__pouch,.tcol__pack{transition:none!important;animation:none!important}
  .tc__glare,.tc__stage::before{display:none}
  .tgyro{display:none!important}
  [data-parallax]{transform:none!important}
}
