/* Gabriel Store · Efectos equilibrados — SOLO PRESENTACIÓN.
   Brillos moderados, ondas y entrada suave. No modifica carrito, pagos ni productos. */
html{overflow-x:clip}
:root{--gs-effect-gold:#f5cc83;--gs-effect-violet:#9c7dec;--gs-effect-cyan:#6de5f2}
/* Profundidad de fondo (sin bloquear clicks ni formularios). */
.ambient-a{animation:gs-ambient-left 20s ease-in-out infinite alternate}
.ambient-b{animation:gs-ambient-right 24s ease-in-out infinite alternate}
.ambient-c{animation:gs-ambient-left 28s ease-in-out infinite alternate-reverse}
@keyframes gs-ambient-left{to{transform:translate3d(35px,32px,0) scale(1.04)}}
@keyframes gs-ambient-right{to{transform:translate3d(-32px,22px,0) scale(1.06)}}
/* Tres ondas finas con luz ambiental, detrás del emblema real. */
.hero-display{isolation:isolate}
.gs-luminous-wave{position:absolute;z-index:1;pointer-events:none;width:92%;height:31%;left:4%;top:35%;border-radius:50%;border:1.5px solid transparent;transform:rotate(-24deg);opacity:.55;filter:drop-shadow(0 0 6px #e7b7658c);animation:gs-orbit 11s ease-in-out infinite alternate}
.gs-wave-amber{border-top-color:#f5dba0c9;border-right-color:#bf89f68a;box-shadow:0 -8px 27px -17px #ffda95,0 3px 23px -18px #8d78fd}
.gs-wave-violet{width:85%;left:8%;top:39%;transform:rotate(28deg);border-bottom-color:#9d81f1a1;border-left-color:#7ebceea0;animation-delay:-5s;animation-duration:13s;opacity:.43}
@keyframes gs-orbit{to{translate:0 -8px;scale:1.025;opacity:.73}}
/* 12 partículas puntuales (6 en móvil); sin canvas ni animaciones de carga pesada. */
.gs-particles{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none;border-radius:32px}
.gs-particle{--ps:3px;position:absolute;left:var(--px);top:var(--py);width:var(--ps);height:var(--ps);border-radius:50%;background:#f7dca7;opacity:.62;box-shadow:0 0 8px 2px #f6cd797d;animation:gs-drift var(--pd) ease-in-out infinite alternate;animation-delay:var(--delay)}
.gs-particle:nth-child(3n){background:#bc9dfd;box-shadow:0 0 9px 2px #a17df169}
.gs-particle:nth-child(5n){background:#b4e7ee;box-shadow:0 0 8px 2px #63d6e46b}
@keyframes gs-drift{0%{translate:0 0;opacity:.23;scale:.8}50%{opacity:.68}100%{translate:10px -19px;opacity:.39;scale:1.13}}
/* Reflejo ligero bajo cada marca: visible al hover o foco de teclado. */
.product-card{isolation:isolate}
.product-card::after{content:'';position:absolute;inset:0;z-index:8;pointer-events:none;border-radius:inherit;background:linear-gradient(113deg,transparent 30%,#ffffff05 44%,#fff5dc19 49%,#ffffff05 54%,transparent 70%);background-size:260% 100%;background-position:115% 0;opacity:0;transition:opacity .34s ease,background-position .75s ease}
.product-card:is(:hover,:focus-within)::after{opacity:1;background-position:0 0}
.product-card:is(:hover,:focus-within){box-shadow:0 24px 48px -21px color-mix(in srgb,var(--accent) 60%,transparent),0 0 0 1px color-mix(in srgb,var(--accent) 23%,transparent),0 15px 32px #0008}
.product-card .product-art:before{animation:gs-art-light 13s ease-in-out infinite alternate;will-change:opacity}
@keyframes gs-art-light{from{opacity:.035}to{opacity:.09}}
/* Combos: resaltar el conjunto, sin cargar demasiado las tarjetas. */
.combo-card{box-shadow:0 14px 34px #0004,0 0 17px #cca05e10}
.combo-card .combo-medallion{animation:gs-medallion 6s ease-in-out infinite alternate}
@keyframes gs-medallion{to{box-shadow:0 0 25px #e4bc8e99,0 0 8px #efdaaf6a;filter:brightness(1.1)}}
.combo-card:is(:hover,:focus-within) .combo-logo-row{filter:drop-shadow(0 2px 10px #edcfa24d)}
/* Botones: destello al pasar el puntero, pulsación mínima al hacer clic. */
.button-primary{position:relative;overflow:hidden;isolation:isolate}
.button-primary::after{content:'';position:absolute;inset:-110% -55%;pointer-events:none;background:linear-gradient(110deg,transparent 41%,#ffffff69 50%,transparent 59%);transform:translateX(-100%) rotate(11deg);transition:transform .75s ease}
.button-primary:is(:hover,:focus-visible)::after{transform:translateX(100%) rotate(11deg)}
.button:active,.mini-buy:active,.mini-add:active{transform:translateY(1px) scale(.985)}
.nav-cart.gs-bounce,.floating-cart.gs-bounce{animation:gs-cart-bounce .52s cubic-bezier(.2,.8,.2,1)}
@keyframes gs-cart-bounce{0%,100%{scale:1}35%{scale:1.12}65%{scale:.96}}
/* La aparición por desplazamiento es opcional: sin JS, todo queda visible. */
@media(prefers-reduced-motion:no-preference){
  .gs-reveal:not(.gs-visible){opacity:0;translate:0 19px;filter:saturate(.85)}
  .gs-reveal{transition:opacity .6s ease,translate .6s cubic-bezier(.2,.7,.2,1),filter .6s ease;transition-delay:var(--gs-stagger,0ms)}
  .gs-reveal.gs-visible{opacity:1;translate:0 0;filter:none}
}
/* Sutileza en titulares y tarjetas de pasos. */
.center-heading .kicker,.section-heading .kicker{letter-spacing:2.5px}
.steps .step:focus-within,.help-card:focus-within{border-color:#f1ce9480;box-shadow:0 15px 32px #0005,0 0 22px #d6ad6323}
.feature-band{overflow:hidden}
.feature-band .feature-shine{animation:gs-feature-glow 12s ease-in-out infinite alternate;pointer-events:none}
@keyframes gs-feature-glow{to{opacity:.68;transform:translateX(-12px)}}
/* La imagen bancaria queda expresamente exenta de efectos, transformaciones o filtros. */
#paymentDialog .qr-box>img{filter:none!important;transform:none!important;opacity:1!important;animation:none!important;transition:none!important}
/* Ajustes para móviles y accesibilidad */
@media(max-width:760px){
 .gs-luminous-wave{width:95%;left:2.5%;height:28%;top:37%;opacity:.47}
 .gs-wave-violet{width:86%;left:7%}
 .gs-particle:nth-child(n+7){display:none}
 .ambient-a,.ambient-b,.ambient-c{animation:none}
 .product-card::after{display:none}
}
@media(hover:none){.product-card::after{display:none}}
@media(prefers-reduced-motion:reduce){
 .ambient-a,.ambient-b,.ambient-c,.gs-luminous-wave,.gs-particle,.feature-band .feature-shine,.combo-medallion,.product-card .product-art:before,.nav-cart.gs-bounce,.floating-cart.gs-bounce{animation:none!important}
 .gs-reveal,.gs-reveal:not(.gs-visible){opacity:1!important;translate:none!important;filter:none!important;transition:none!important}
 .button-primary::after{display:none}
}
