/* Glowtto | Estilo B editorial + interacción suave, versión 2026-10-18.
   Solo modifica los carruseles. Mantiene el catálogo, los precios y la paleta actual. */
.hero.hero-carousel{
  background:
    radial-gradient(ellipse at 91% 12%,rgba(248,193,212,.38),transparent 45%),
    linear-gradient(115deg,#fffaf7,#f6e6da 68%,#f8e3e2)!important;
}
.hero-banner{
  grid-template-columns:minmax(0,1.14fr) minmax(0,.86fr);
  grid-template-rows:min-content auto;
  grid-template-areas:"editorial-copy editorial-art" "editorial-desc editorial-art";
  align-content:center;
  align-items:center;
  row-gap:15px;
}
.hero-copy{grid-area:editorial-copy;align-self:end}
.hero-art{grid-area:editorial-art;align-self:center;justify-self:stretch;position:relative}
.hero-desc-bottom{grid-area:editorial-desc;display:flex;flex-direction:column;align-items:flex-start;gap:7px;min-width:0;max-width:480px;align-self:start}
.hero-desc-bottom p{margin:0;color:#7d6767;font-size:clamp(13px,1.5vw,16px);line-height:1.6;overflow-wrap:anywhere}
.hero-price-inline{display:inline-block;color:#994658;font-weight:800;font-size:14px;line-height:1.3}
.hero-art-action{width:100%;min-width:0;max-width:100%;min-height:0;position:relative;border:0!important;box-shadow:none!important;background:transparent!important}
.hero-art-action:hover{filter:none}
.hero-art-product{width:min(100%,390px);height:305px;margin:0 auto;isolation:isolate}
.hero-art-halo{z-index:-1;inset:13% 5% 9%;background:radial-gradient(ellipse,#f8d6d3aa 0%,#f4e1da65 48%,transparent 78%)!important;filter:blur(10px);border-radius:50%}
.hero-art-photo{position:absolute;inset:6px 2px 7px!important;width:auto;height:auto!important;display:grid;place-items:center;overflow:visible!important;padding:0!important;background:transparent!important;box-shadow:none!important;border:0!important;border-radius:0!important}
.hero-art-photo img{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 13px 17px #76524b27);border-radius:12px}
.hero-art-caption{display:none!important}
.hero-art-offer{top:10px;right:5px;z-index:2;background:#a95364!important;color:#fff!important;border-radius:99px}
.hero-deco{max-width:100%;filter:drop-shadow(0 15px 24px #a8718e21)}
.hero-art-custom{max-width:100%;height:100%;overflow:visible}
.hero-art-custom img{max-height:290px;object-fit:contain}
.hero-static-footer .primary{border-radius:99px}
.hero-arrow,.top-carousel-arrow{transition:background .2s ease,transform .2s cubic-bezier(.22,1,.36,1)}
.hero-arrow:active,.top-carousel-arrow:active{transform:scale(.91)}
.hero-dots button,.top-section .dots button{transition:width .34s cubic-bezier(.22,1,.36,1),background-color .24s ease,transform .24s ease}

/* Destacados: imagen bien visible, información a la derecha y acciones separadas. */
.top-carousel .top-slide{
  grid-template-areas:"top-picture top-info" "top-picture top-actions";
  grid-template-rows:auto auto;
  align-content:center;
  align-items:center;
  gap:10px 22px;
}
.top-product-image{grid-area:top-picture;align-self:center;transition:transform .3s cubic-bezier(.22,1,.36,1);border-radius:16px}
.top-product-image:active{transform:scale(.97)}
.top-slide-copy{grid-area:top-info;align-self:end}
.top-buy-actions{grid-area:top-actions;display:flex;flex-wrap:wrap;align-items:center;gap:9px;min-width:0}
.top-buy-actions button{min-width:0;border-radius:11px;min-height:42px;white-space:normal}
.top-gallery-controls{pointer-events:auto}
.top-carousel .top-slide.is-active{will-change:opacity,transform}

/* Disposición editorial para teléfonos, incluido Poco F3 (CSS ~393 px).
   Mantiene la altura automática y deja la descripción bajo la imagen y el título. */
@media(max-width:680px){
 .hero.hero-carousel{min-height:0!important;height:auto!important;overflow:hidden}
 .hero-banners{position:relative!important;min-height:0!important}
 .hero-banner{
  grid-template-columns:minmax(0,1fr) minmax(125px,41%);
  grid-template-rows:auto auto;
  grid-template-areas:"editorial-copy editorial-art" "editorial-desc editorial-desc";
  column-gap:7px;row-gap:10px;
  align-content:start;align-items:start;
  padding:19px 14px 12px!important;
 }
 .hero-copy{align-self:center;max-width:100%}
 .hero-carousel .hero-copy h1,.hero-carousel .hero-copy h2{line-height:1.08;overflow-wrap:break-word;hyphens:auto}
 .hero-feature-link{margin-top:8px;font-size:11px}
 .hero-art{align-self:start;justify-self:end;min-height:0!important;width:100%;max-width:100%}
 .hero-art-action{width:100%!important;max-width:100%!important;min-height:0!important;display:block}
 .hero-art-product{height:205px!important;width:100%!important;max-width:190px!important;position:relative}
 .hero-art-photo{inset:0!important;height:100%!important;width:100%!important;padding:0!important}
 .hero-art-photo img{max-height:205px;object-fit:contain;filter:drop-shadow(0 8px 13px #79554d20)}
 .hero-art-halo{inset:15% -4% 13%}
 .hero-art-custom img{max-height:205px!important;object-fit:contain}
 .hero-deco{width:100%!important;max-width:180px;height:195px!important}
 .hero-deco-symbol{font-size:105px}
 .hero-desc-bottom{min-width:0;width:100%;max-width:100%;gap:7px;padding-top:8px;border-top:1px solid #e9d9d0}
 .hero-desc-bottom p{font-size:12px;line-height:1.55;max-width:100%}
 .hero-price-inline{font-size:14px}
 .hero-static-footer{align-self:flex-start;margin:0 14px 11px}
 .hero-controls{align-self:flex-start;margin:0 14px 14px}
 .hero-banner.is-active{
  animation:glowtto-editorial-in .35s cubic-bezier(.22,1,.36,1) both!important;
 }
 .hero[data-slide-direction="prev"] .hero-banner.is-active{
  animation-name:glowtto-editorial-in-prev!important;
 }
 .top-carousel{min-height:0!important;height:auto!important}
 .top-carousel .top-slide{
  grid-template-columns:minmax(112px,35%) minmax(0,1fr)!important;
  grid-template-rows:auto auto;
  grid-template-areas:"top-picture top-info" "top-actions top-actions";
  gap:11px 13px!important;
  align-content:start;align-items:center;
  padding:15px 14px 11px!important;
 }
 .top-carousel .top-slide.is-active{animation:glowtto-editorial-in .35s cubic-bezier(.22,1,.36,1) both!important}
 .top-carousel[data-slide-direction="prev"] .top-slide.is-active{animation-name:glowtto-editorial-in-prev!important}
 .top-product-image{
  width:100%!important;
  height:154px!important;
  padding:7px!important;
  border-radius:15px;
 }
 .top-product-image img{width:100%;height:100%;object-fit:contain}
 .top-slide-copy{gap:6px;min-width:0}
 .top-slide-copy strong{line-height:1.2}
 .top-buy-actions{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:9px}
 .top-buy-actions button{width:100%;min-height:40px!important;font-size:11px;line-height:1.25;padding:8px 10px}
 .top-gallery-controls{align-self:flex-end;margin:1px 14px 10px}
 .top-section .dots{padding-top:7px}
}
@media(max-width:390px){
 .hero-banner{grid-template-columns:minmax(0,1fr) minmax(110px,40%);padding:16px 11px 10px!important}
 .hero-art-product{height:182px!important}
 .hero-art-photo img{max-height:182px}
 .hero-art-custom img{max-height:182px!important}
 .hero-static-footer,.hero-controls{margin-left:11px}
 .top-carousel .top-slide{grid-template-columns:minmax(105px,34%) minmax(0,1fr)!important;padding:13px 11px 8px!important}
 .top-product-image{height:143px!important}
 .top-buy-actions button{font-size:10.5px}
}
@keyframes glowtto-editorial-in{
 from{opacity:.45;transform:translate3d(17px,0,0)}
 to{opacity:1;transform:translate3d(0,0,0)}
}
@keyframes glowtto-editorial-in-prev{
 from{opacity:.45;transform:translate3d(-17px,0,0)}
 to{opacity:1;transform:translate3d(0,0,0)}
}
@media(prefers-reduced-motion:reduce){
 .hero-banner.is-active,.top-carousel .top-slide.is-active{animation:none!important}
 .hero-arrow,.top-carousel-arrow,.top-product-image{transition:none!important}
}