/* Orbe: claro y aireado, neutros fríos, tinta negra para leer y comprar, y el verde de marca solo como relleno con
   tinta encima (sobre blanco da 1,36:1: nunca como texto). Motivo: el orbe (círculos y píldoras) y el isotipo. */

/* ---------- base ---------- */
.tpl-orbe{--track:.12em;--focus:var(--ink);
  --shadow:0 1px 2px rgba(12,16,24,.04),0 6px 14px -6px rgba(12,16,24,.08),0 24px 48px -24px rgba(12,16,24,.18);
  --shadow-sm:0 1px 2px rgba(12,16,24,.05),0 8px 20px -12px rgba(12,16,24,.16);
  --line-strong:color-mix(in srgb,var(--ink) 45%,var(--surface))}
.tpl-orbe :is(h1,h2,h3,h4){font-stretch:100%;letter-spacing:-.025em}
.tpl-orbe section.sec > .sec-head h2{font-size:clamp(1.6rem,2.6vw,2.4rem)}
.tpl-orbe :is(.pr,.goal b,.stage-card .p b,.combo .total b,.carttotal b,.sumrow.total b){font-stretch:100%;letter-spacing:-.03em}
/* Etiquetas en mayúscula espaciada, como la palabra ORBE ACTIVE: nunca menos de 12 px ni más de .12em. */
.tpl-orbe :is(.eyebrow,.kicker,.goal .k,.card .br,.buybox .brandlink,.promo-card .k,footer h4,.filters h4){letter-spacing:var(--track);font-weight:700;font-size:.75rem}

/* ---------- botones: píldora de tinta con el orbe verde en el ícono ---------- */
.tpl-orbe .btn{border-radius:var(--pill);background:var(--ink);color:#FFFFFF;font-weight:700;letter-spacing:.005em;gap:10px;
  box-shadow:0 10px 22px -14px rgba(12,16,24,.7);transition:background .18s,color .18s,box-shadow .18s,transform .18s}
.tpl-orbe .btn:hover{background:var(--brand);color:var(--on-brand);box-shadow:inset 0 0 0 1.5px var(--ink)}
.tpl-orbe .btn:active{transform:translateY(1px)}
.tpl-orbe .btn .ico{box-sizing:content-box;width:16px;height:16px;padding:6px;border-radius:50%;background:var(--brand);color:var(--on-brand);transition:background .18s,color .18s}
.tpl-orbe .btn:hover .ico{background:var(--ink);color:var(--brand)}
.tpl-orbe .btn.sec{background:transparent;color:var(--ink);border:1.5px solid var(--ink);box-shadow:none}
.tpl-orbe .btn.sec:hover{background:var(--ink);color:#FFFFFF}
.tpl-orbe .btn.sec .ico{background:transparent;padding:0;width:20px;height:20px}
.tpl-orbe .btn.sec:hover .ico{color:var(--brand)}
.tpl-orbe .btn.ghost{background:transparent;color:var(--on-dark);border:1.5px solid color-mix(in srgb,var(--on-dark) 45%,transparent);box-shadow:none}
.tpl-orbe .btn.ghost:hover{background:var(--on-dark);color:var(--dark)}
.tpl-orbe .btn.lg{height:56px;padding:0 28px}
.tpl-orbe :is(.card,.combo,.pdp-actions,.cta-band) .btn:not(.sec):not(.ghost){padding-left:10px;padding-right:22px}
.tpl-orbe .hero-ctas .btn:not(.sec){padding-left:28px;padding-right:10px}
.tpl-orbe .chip{border-radius:var(--pill)}
.tpl-orbe :is(input.f,select.f){border-radius:var(--pill);padding:0 18px}
.tpl-orbe textarea.f{border-radius:18px}

/* ---------- tira superior: relleno verde, texto en tinta ---------- */
.tpl-orbe .promo{background:var(--brand);color:var(--on-brand);letter-spacing:var(--track);font-weight:700;font-size:.75rem;--focus:var(--ink);--focus-gap:var(--brand)}
.tpl-orbe .promo .row{gap:4px 44px;padding-top:9px;padding-bottom:9px}
.tpl-orbe .promo span:before{width:6px;height:6px;border-radius:50%;background:var(--ink);transform:none}

/* ---------- encabezado claro ---------- */
.tpl-orbe header.top{background:color-mix(in srgb,var(--surface) 92%,transparent);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);
  border-bottom:1px solid var(--line-soft);--focus:var(--ink);--focus-gap:var(--surface)}
.tpl-orbe .bar{min-height:80px;gap:14px 28px}
.tpl-orbe .brand img{height:40px;width:auto}
.tpl-orbe .brand .txt{font-family:var(--font);font-weight:600;font-size:1.05rem;letter-spacing:.32em;text-transform:uppercase;color:var(--ink)}
.tpl-orbe .search{max-width:640px}
.tpl-orbe .search form{border-radius:var(--pill);background:var(--bg);border:1.5px solid var(--line-strong);height:50px}
.tpl-orbe .search form:focus-within{box-shadow:0 0 0 3px var(--surface),0 0 0 5px var(--ink);border-color:var(--ink);background:var(--surface)}
.tpl-orbe .search input{padding:0 22px}
.tpl-orbe .search input::placeholder{color:var(--mut);opacity:1}
.tpl-orbe .search button{width:44px;height:44px;margin-right:2px;border-radius:50%;background:var(--ink);color:#FFFFFF}
.tpl-orbe .search button .ico{width:18px;height:18px}
.tpl-orbe .search button:hover{background:var(--brand);color:var(--on-brand)}
.tpl-orbe .iconbtn{border-radius:var(--pill)}
.tpl-orbe .hdr-actions{gap:6px}
.tpl-orbe .cartbtn{background:var(--ink);color:#FFFFFF;padding:0 8px 0 18px}
.tpl-orbe .cartbtn:hover{background:var(--brand);color:var(--on-brand)}
.tpl-orbe .cartbtn .cartcount{min-width:28px;height:28px;background:var(--brand);color:var(--on-brand);font-size:.78rem}
.tpl-orbe .cartbtn:hover .cartcount{background:var(--ink);color:var(--brand)}
/* Menú de categorías en minúscula de oración, con un fundido a la derecha que avisa que se desplaza. */
.tpl-orbe nav.cats{border-top:1px solid var(--line-soft)}
.tpl-orbe nav.cats .row{gap:0 28px;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 48px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 48px),transparent)}
.tpl-orbe nav.cats a,.tpl-orbe nav.cats .all{padding:14px 0 12px;font-size:.92rem;font-weight:600;letter-spacing:.005em;text-transform:none;color:var(--text-2)}
.tpl-orbe nav.cats a:hover,.tpl-orbe nav.cats a.on{color:var(--ink);border-bottom-color:var(--ink)}
.tpl-orbe nav.cats a.hot{color:var(--ink);font-weight:700}

/* ---------- portada dividida: el producto dentro del isotipo ---------- */
.tpl-orbe .hero-split{position:relative;overflow:hidden;border-bottom:0;
  background:linear-gradient(180deg,var(--surface) 0%,var(--surface) 62%,var(--bg) 100%)}
.tpl-orbe .hero-split .hero-grid{grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(32px,5vw,80px);padding-top:clamp(40px,4.5vw,64px);padding-bottom:clamp(28px,3.5vw,48px)}
.tpl-orbe .hero-copy{gap:24px}
.tpl-orbe .hero-split .hero-copy .eyebrow{align-self:flex-start;padding:9px 16px 9px 14px;border-radius:var(--pill);background:var(--brand);color:var(--on-brand);display:inline-flex;align-items:center;gap:10px}
.tpl-orbe .hero-split .hero-copy .eyebrow:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ink);flex:none}
.tpl-orbe .hero-split .hero-copy h1{font-size:clamp(2.6rem,5.4vw,5rem);line-height:.98;letter-spacing:-.045em;max-width:7.2em}
.tpl-orbe .hero-split .hero-copy p{font-size:clamp(1.02rem,1.3vw,1.18rem);line-height:1.6;max-width:44ch}
.tpl-orbe .hero-ctas{gap:12px;margin-top:4px}
/* El orbe: el isotipo plano (sin halos ni sombras), su órbita fina y un satélite. El envase, más chico que el orbe,
   deja ver el corte en S arriba y abajo para que se lea el logo. */
.tpl-orbe .split-media-wrap{position:relative;width:min(100%,560px);aspect-ratio:1;margin:0 0 0 auto;isolation:isolate}
.tpl-orbe .split-media-wrap:after{content:"";position:absolute;inset:0;border-radius:50%;z-index:-2;border:1.5px solid var(--line-2)}
.tpl-orbe .split-media-wrap > .firma{position:absolute;left:7%;top:8.9%;width:86%;height:auto;z-index:-1;color:var(--brand)}
.tpl-orbe .split-media-wrap > .split-media{position:absolute;inset:0;aspect-ratio:auto;border-radius:50%;overflow:visible;background:none}
/* Foto propia de la portada (sin producto destacado): una placa redondeada, sin orbe ni satélite. */
.tpl-orbe .hero-grid > .split-media{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow)}
.tpl-orbe .split-media-wrap > .split-media:after{content:"";position:absolute;left:calc(85.36% - 8px);top:calc(14.64% - 8px);width:16px;height:16px;border-radius:50%;
  background:var(--ink);box-shadow:0 0 0 5px var(--surface)}
.tpl-orbe .split-plate > img,.tpl-orbe .split-plate.split-recorte img{inset:auto;left:25%;top:20%;width:50%;height:58%;object-fit:contain;
  filter:drop-shadow(0 22px 22px rgba(12,16,24,.28)) drop-shadow(0 5px 7px rgba(12,16,24,.16));transition:transform .35s cubic-bezier(.2,.7,.2,1)}
/* Foto sin recortar (con fondo): en su propio círculo blanco, para que el rectángulo no pise el isotipo. */
.tpl-orbe .split-plate:not(.split-recorte) > img{left:24%;top:24%;width:52%;height:52%;padding:7%;box-sizing:border-box;border-radius:50%;
  background:#FFFFFF;mix-blend-mode:normal;filter:none;box-shadow:0 24px 40px -24px rgba(12,16,24,.45)}
.tpl-orbe .split-media-wrap > .split-media:hover > img{transform:translateY(-6px)}
.tpl-orbe .split-media-wrap > .split-media:focus-visible{outline-offset:-10px}
.tpl-orbe .split-tag{left:0;bottom:9%;max-width:250px;padding:14px 20px 14px 18px;border-radius:22px;background:var(--surface);color:var(--ink);
  box-shadow:var(--shadow);gap:4px;font-size:.86rem;line-height:1.3}
.tpl-orbe .split-tag b{font-weight:600;color:var(--text-2)}
.tpl-orbe .split-tag span{font-size:1.6rem;color:var(--ink);letter-spacing:-.03em;line-height:1.05}
.tpl-orbe .carr-ctrl{background:color-mix(in srgb,var(--ink) 78%,transparent)}
/* La firma solo tiene lugar en la portada dividida con producto. */
.tpl-orbe section > .firma{display:none}

/* ---------- beneficios en píldoras ---------- */
.tpl-orbe .benefits{background:var(--bg);border-bottom:0}
.tpl-orbe .benefits ul{gap:12px;padding-top:0;padding-bottom:8px}
.tpl-orbe .benefits li{padding:12px 20px 12px 12px;border-radius:var(--pill);background:var(--surface);box-shadow:var(--shadow-sm);gap:14px}
.tpl-orbe .benefits .ic{width:46px;height:46px;border-radius:50%;background:var(--brand);color:var(--on-brand)}
.tpl-orbe .benefits b{font-weight:700;letter-spacing:-.01em}

/* ---------- secciones ---------- */
.tpl-orbe section.sec{margin-block:clamp(48px,6vw,88px)}  /* solo vertical: .wrap.sec se centra con margin-inline */
.tpl-orbe .sec-head{align-items:center;margin-bottom:28px}
.tpl-orbe .sec-head a{min-height:44px;padding:0 18px;border-radius:var(--pill);border:1.5px solid var(--line-2);background:var(--surface);font-size:.86rem;font-weight:700;gap:8px;transition:border-color .15s}
.tpl-orbe .sec-head a:after{content:"";width:7px;height:7px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg);margin-left:2px}
.tpl-orbe .sec-head a:hover{color:var(--ink);border-color:var(--ink)}

/* ---------- categorías: cada foto en su orbe ---------- */
.tpl-orbe .goals{grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr));gap:16px}
.tpl-orbe .goal{border:0;background:var(--surface);box-shadow:var(--shadow-sm);isolation:isolate}
.tpl-orbe .goal:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.tpl-orbe .goal .k{color:var(--mut)}
.tpl-orbe .goal.cat.has-img{min-height:208px;padding:22px 24px;--orb:150px}
.tpl-orbe .goal.cat.has-img b{font-size:1.3rem;line-height:1.14;margin-top:6px;max-width:calc(100% - var(--orb) + 24px)}
.tpl-orbe .goal small{font-size:.86rem;margin-top:auto}
.tpl-orbe .goal.cat.has-img:before{content:"";position:absolute;right:20px;bottom:20px;width:var(--orb);height:var(--orb);border-radius:50%;z-index:-1;
  background:var(--bg);box-shadow:0 0 0 0 var(--brand);transition:box-shadow .25s}
.tpl-orbe .goal.cat.has-img:hover:before{box-shadow:0 0 0 6px var(--brand)}
.tpl-orbe .goal.cat img{right:calc(20px + var(--orb) * .09);bottom:calc(20px + var(--orb) * .09);width:calc(var(--orb) * .82);height:calc(var(--orb) * .82);
  max-width:none;object-fit:contain;border-radius:50%;mix-blend-mode:multiply;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.tpl-orbe .goal.cat.has-img:hover img{transform:scale(1.06)}

/* ---------- combo: el bloque de marca, verde con el isotipo en negro (el par del logo, invertido) ---------- */
.tpl-orbe .combo{position:relative;overflow:hidden;isolation:isolate;border-radius:var(--r-lg);background:var(--brand);color:var(--on-brand);
  padding:clamp(24px,4vw,56px);--on-dark:var(--ink);--on-dark-hi:var(--ink);--on-dark-2:#2A3320;--on-dark-mut:#2A3320;--brand-on-dark:var(--ink);--focus:var(--ink);--focus-gap:var(--brand)}
.tpl-orbe .combo .eyebrow{display:inline-flex;align-items:center;gap:10px;padding:8px 14px;border-radius:var(--pill);background:var(--ink);color:var(--brand)}
.tpl-orbe .combo h2{font-size:clamp(1.9rem,3.4vw,3rem);letter-spacing:-.04em}
.tpl-orbe .combo .total b{font-size:clamp(2.2rem,3.4vw,2.9rem)}
.tpl-orbe .combo .total span{font-weight:600}
.tpl-orbe .combo .btn{background:var(--ink);color:#FFFFFF}
.tpl-orbe .combo .btn:hover{background:var(--surface);color:var(--ink)}
.tpl-orbe .combo .btn:hover .ico{background:var(--brand);color:var(--on-brand)}
.tpl-orbe .combo-imgs{position:relative;isolation:isolate;gap:clamp(10px,1.6vw,20px)}
.tpl-orbe .combo-imgs:before{content:"";position:absolute;left:50%;top:50%;width:min(118%,560px);aspect-ratio:100/96.24;transform:translate(-50%,-50%);z-index:-1;
  background:var(--ink);-webkit-mask:url(/tema/orbe-isotipo.svg) center/contain no-repeat;mask:url(/tema/orbe-isotipo.svg) center/contain no-repeat}
.tpl-orbe .combo-imgs a,.tpl-orbe .combo-imgs a:has(.envase-rec){aspect-ratio:1;align-self:center;border-radius:50%;background:var(--surface);overflow:visible;
  box-shadow:0 24px 40px -26px rgba(12,16,24,.55);transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.tpl-orbe .combo-imgs a:hover{transform:translateY(-4px)}
.tpl-orbe .combo-imgs img,.tpl-orbe .combo-imgs img.envase-rec{inset:12%;width:76%;height:76%;filter:drop-shadow(0 12px 12px rgba(12,16,24,.25))}

/* ---------- tarjetas de producto: foto grande en su orbe, sin caja ---------- */
.tpl-orbe .grid{grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr));gap:28px 20px}
.tpl-orbe .grid .card .ph{border-radius:var(--r);background:var(--surface);box-shadow:var(--shadow-sm);isolation:isolate}
.tpl-orbe .card .ph:before{content:"";position:absolute;inset:4%;border-radius:50%;z-index:-1;background:var(--bg);box-shadow:0 0 0 0 var(--brand);transition:box-shadow .25s}
.tpl-orbe .grid .card:hover .ph:before{box-shadow:0 0 0 6px var(--brand)}
.tpl-orbe .card .ph>a{inset:8%}
.tpl-orbe .card .ph img{mix-blend-mode:multiply}
.tpl-orbe .grid .card:hover{transform:none}
.tpl-orbe .grid .card:hover .ph{box-shadow:var(--shadow)}
.tpl-orbe .card .body{padding:16px 4px 4px;gap:6px}
.tpl-orbe .card .nm{font-size:1.02rem;font-weight:600;letter-spacing:-.01em}
/* Nombre en dos líneas fijas: precio y botón quedan alineados en cada fila, y el enlace mide 44 px o más. */
.tpl-orbe .card .nm a{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:max(44px,2.6em)}
.tpl-orbe .card .price{padding-top:8px;gap:3px}
.tpl-orbe .card .pr{font-size:1.75rem}
.tpl-orbe .card .ph .placeholder-img{border-radius:50%;opacity:.55}
.tpl-orbe .card .pr-note{font-size:.8rem;line-height:1.45}
/* «Agregar» lleno (la compra es la acción más fuerte); «Elegir sabor» y «Ver producto» en contorno. */
.tpl-orbe .card .btn{height:48px;margin-top:16px}
.tpl-orbe .favbtn,.tpl-orbe .cmpbtn{top:12px;border:1px solid var(--line-soft);box-shadow:0 4px 12px -6px rgba(12,16,24,.25)}
.tpl-orbe .favbtn{right:12px}
.tpl-orbe .favbtn:hover,.tpl-orbe .favbtn.on{color:var(--ink);background:var(--brand)}
.tpl-orbe :is(.save,.pbadge,.mkt-off){background:var(--ink);color:#FFFFFF}
.tpl-orbe .avail:before{box-shadow:0 0 0 3px color-mix(in srgb,currentColor 18%,transparent)}

/* ---------- marcas en píldoras ---------- */
.tpl-orbe .brand-rail{justify-content:flex-start;gap:12px;font-family:var(--font);font-size:.9rem;font-weight:700;font-stretch:100%;letter-spacing:.14em}
.tpl-orbe .brand-rail a{display:inline-flex;align-items:center;min-height:56px;padding:0 30px;border-radius:var(--pill);background:var(--surface);color:var(--ink);
  box-shadow:var(--shadow-sm);transition:background .15s,transform .15s}
.tpl-orbe .brand-rail a:hover{background:var(--brand);color:var(--on-brand);transform:translateY(-2px)}

/* ---------- llamado a WhatsApp: el único bloque de tinta ---------- */
.tpl-orbe .cta-band{position:relative;overflow:hidden;isolation:isolate;background:var(--deep);padding:clamp(28px,4.5vw,64px)}
.tpl-orbe .cta-band:before{content:"";position:absolute;right:-90px;bottom:-150px;width:340px;aspect-ratio:1;border-radius:50%;z-index:-1;background:var(--brand)}
.tpl-orbe .cta-band:after{content:"";position:absolute;right:-170px;bottom:-230px;width:500px;aspect-ratio:1;border-radius:50%;z-index:-1;border:1.5px solid color-mix(in srgb,var(--on-dark) 22%,transparent)}
.tpl-orbe .cta-band h2{font-size:clamp(1.8rem,3vw,2.6rem)}
.tpl-orbe .cta-band .btn:not(.ghost){background:var(--brand);color:var(--on-brand)}
.tpl-orbe .cta-band .btn:not(.ghost) .ico{background:var(--ink);color:var(--brand)}
.tpl-orbe .cta-band .btn:not(.ghost):hover{background:var(--surface);color:var(--ink)}
.tpl-orbe .cta-band .btn.ghost{background:var(--deep)}
.tpl-orbe .cta-band .btn.ghost:hover{background:var(--surface);color:var(--ink)}
.tpl-orbe .cta-band-btns{position:relative}

/* ---------- pie claro, con el logo ---------- */
.tpl-orbe footer{--dark:var(--surface);--dark-2:var(--bg);--dark-line:var(--line);--on-dark:var(--ink);--on-dark-hi:var(--ink);--on-dark-2:var(--text-2);
  --on-dark-mut:var(--mut);--focus:var(--ink);--focus-gap:var(--surface);border-top:1px solid var(--line-soft)}
.tpl-orbe footer .f-logo{height:36px}
.tpl-orbe footer .f-name{font-family:var(--font);font-weight:600;font-size:1rem;letter-spacing:.32em;text-transform:uppercase}
.tpl-orbe footer a:hover{text-decoration:underline;text-underline-offset:3px}
.tpl-orbe footer .legal .cs-pie a.cs-boton{border-color:var(--ink);padding:9px 18px}
.tpl-orbe footer .legal .cs-pie a.cs-boton:hover{background:var(--brand);color:var(--on-brand);border-color:var(--ink);text-decoration:none}
.tpl-orbe main.home{padding-bottom:clamp(8px,2vw,24px)}
.tpl-orbe footer .legal{position:relative;border-top:0}
.tpl-orbe footer .legal:before{content:"";position:absolute;top:0;left:clamp(16px,4vw,40px);right:clamp(16px,4vw,40px);border-top:1px solid var(--line)}
.tpl-orbe .health{display:block;flex:1 1 100%;margin-top:10px;padding:14px 18px;border-radius:18px;background:var(--bg);color:var(--text-2);font-size:.8rem;line-height:1.5}

/* ---------- ficha de producto ---------- */
.tpl-orbe .crumb{gap:4px 8px}
.tpl-orbe .gal{border:0;background:var(--surface);box-shadow:var(--shadow-sm);isolation:isolate}
.tpl-orbe .gal:before{content:"";position:absolute;inset:7%;border-radius:50%;background:var(--bg);z-index:-1}
.tpl-orbe .gal img{mix-blend-mode:multiply;inset:10%;width:80%;height:80%}
.tpl-orbe .thumbs img{border-radius:50%}
.tpl-orbe .buybox{border:0;box-shadow:var(--shadow);gap:20px;padding:32px}
.tpl-orbe .buybox .brandlink{color:var(--mut)}
.tpl-orbe .buybox h1{font-stretch:100%;letter-spacing:-.035em;font-size:clamp(1.7rem,2.6vw,2.4rem)}
.tpl-orbe .pricebox{border-radius:22px;padding:20px 22px;background:var(--bg);gap:6px}
.tpl-orbe .pricebox .pr{font-size:clamp(2.4rem,3.4vw,3rem)}
.tpl-orbe .pricebox .pr-note{line-height:1.6}
/* Sabores: el elegido en tinta llena con texto blanco (nunca solo verde); sin stock, tachado (tienda.css). */
.tpl-orbe .chip.on{background:var(--ink);border-color:var(--ink);color:#FFFFFF}
.tpl-orbe .qty{border-radius:var(--pill);border:1.5px solid var(--line-strong);height:56px;padding:0 4px}
.tpl-orbe .qty button{width:44px;border-radius:50%}
.tpl-orbe .qty button:hover{background:var(--bg)}
.tpl-orbe .pdp-actions .btn{height:56px;font-size:1rem}
.tpl-orbe .shipbox{border-radius:22px;border:0;background:var(--brand-soft)}
.tpl-orbe .shipbox .t{color:var(--ink)}
.tpl-orbe .shipbox .t .ico{box-sizing:content-box;width:14px;height:14px;padding:5px;border-radius:50%;background:var(--brand);color:var(--on-brand)}
.tpl-orbe .panel{border:0;box-shadow:var(--shadow-sm)}
.tpl-orbe .avs{border-radius:22px}
.tpl-orbe .sticky-cta{background:color-mix(in srgb,var(--surface) 94%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.tpl-orbe .sticky-cta form{flex:1;max-width:240px}
.tpl-orbe .sticky-cta .btn{width:100%}
@media(max-width:480px){
  .tpl-orbe .pdp-actions{flex-wrap:wrap}
  .tpl-orbe .pdp-actions .qty{flex:1 1 100%;justify-content:space-between}
  .tpl-orbe .pdp-actions .btn{flex:1 1 100%}
}

/* ---------- celular ---------- */
@media(max-width:760px){
  .tpl-orbe .bar{min-height:0;gap:10px 8px}
  .tpl-orbe .brand{min-height:44px}
  .tpl-orbe .brand img{height:30px}
  .tpl-orbe .search form{height:48px}
  .tpl-orbe .cartbtn{padding:0;width:44px}
  .tpl-orbe .cartbtn .cartcount{min-width:22px;height:22px;top:-4px;right:-6px;font-size:.72rem;box-shadow:0 0 0 2px var(--surface)}
  .tpl-orbe nav.cats a{padding:14px 0 12px;min-width:44px;text-align:center}
  /* Portada: producto y precio en el primer pantallazo. */
  .tpl-orbe .hero-split .hero-grid{grid-template-columns:1fr;gap:8px;padding-top:20px;padding-bottom:12px}
  .tpl-orbe .hero-copy{gap:14px}
  .tpl-orbe .hero-split .hero-copy h1{font-size:clamp(2.2rem,10vw,2.7rem)}
  .tpl-orbe .hero-split .hero-copy p{font-size:1rem;line-height:1.5}
  .tpl-orbe .hero-ctas{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .tpl-orbe .hero-ctas .btn.lg{height:52px;padding:0 10px 0 18px;font-size:.95rem;gap:8px}
  .tpl-orbe .hero-ctas .btn.sec{padding:0 16px}
  .tpl-orbe .split-media-wrap{width:min(100%,280px);margin:4px auto 0}
  .tpl-orbe .split-tag{left:-8px;bottom:4%;padding:10px 14px;border-radius:18px;max-width:170px}
  .tpl-orbe .split-tag b{font-size:.8rem}
  .tpl-orbe .split-tag span{font-size:1.3rem}
  .tpl-orbe .benefits ul{gap:8px;padding-bottom:4px}
  .tpl-orbe .benefits li{padding:10px 12px 10px 10px;border-radius:22px;gap:10px;align-items:center}
  .tpl-orbe .benefits .ic{width:36px;height:36px}
  .tpl-orbe .benefits .ic .ico{width:18px;height:18px}
  .tpl-orbe section.sec{margin-block:44px}
  .tpl-orbe .sec-head{margin-bottom:18px}
  .tpl-orbe .sec-head a{padding:0 14px;font-size:.82rem}
  .tpl-orbe .goal{flex:0 0 168px}
  .tpl-orbe .goal.cat.has-img{min-height:200px;padding:16px;--orb:104px}
  .tpl-orbe .goal.cat.has-img b{font-size:1.06rem;max-width:none}
  .tpl-orbe .goal.cat.has-img:before{right:12px;bottom:12px}
  .tpl-orbe .goal.cat img{right:calc(12px + var(--orb) * .09);bottom:calc(12px + var(--orb) * .09)}
  .tpl-orbe .goal small{display:block;margin-top:2px;font-size:.8rem}
  .tpl-orbe .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px}
  .tpl-orbe .card .ph>a{inset:7%}
  .tpl-orbe .card .ph:before{inset:3%}
  .tpl-orbe .card .body{padding:12px 2px 2px;gap:4px}
  .tpl-orbe .card .nm{font-size:.92rem}
  .tpl-orbe .card .pr{font-size:1.32rem}
  .tpl-orbe .card .btn{height:44px;margin-top:10px;padding-left:6px;padding-right:12px;gap:6px;font-size:.86rem}
  .tpl-orbe .card .btn .ico{padding:5px;width:14px;height:14px}
  .tpl-orbe .favbtn{top:6px;right:6px}
  .tpl-orbe .cmpbtn{top:54px;right:6px}
  .tpl-orbe .combo{gap:22px}
  .tpl-orbe .brand-rail{gap:8px}
  .tpl-orbe .brand-rail a{min-height:48px;padding:0 20px;font-size:.8rem}
  .tpl-orbe .cta-band:before{width:200px;right:-70px;bottom:-110px}
  .tpl-orbe .cta-band:after{width:300px;right:-120px;bottom:-160px}
  .tpl-orbe .crumb a{min-height:44px;min-width:44px}
  .tpl-orbe .buybox .brandlink{display:inline-flex;align-items:center;min-height:44px;min-width:44px;margin:-12px 0 -10px}
  .tpl-orbe .buybox{padding:22px}
  .tpl-orbe .pricebox .pr{font-size:2.3rem}
  /* objetivos táctiles de 44 px en el pie */
  .tpl-orbe footer a:not(.pie-link),.tpl-orbe footer .legal .cs-pie a{display:flex;align-items:center;min-height:44px;padding:0}
  .tpl-orbe footer .legal a.pie-link{display:inline-flex;align-items:center;min-height:44px}
  .tpl-orbe footer .legal .cs-pie a.cs-boton{display:inline-flex;padding:0 18px}
}
@media(prefers-reduced-motion:reduce){
  .tpl-orbe :is(.split-media-wrap > .split-media:hover > img,.combo-imgs a:hover,.brand-rail a:hover,.goal:hover,.goal.cat.has-img:hover img){transform:none}
}