:root{--curva-suave:cubic-bezier(.22,1,.36,1)}
/* El contenido permanece visible si JavaScript o IntersectionObserver no están disponibles. */
.entrada-pendiente{opacity:.06;transform:translateY(18px)}
.entrada-visible{animation:entrada-profesional .65s var(--curva-suave) both;animation-delay:var(--demora-entrada,0ms)}
@keyframes entrada-profesional{from{opacity:.06;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
.pantalla-tarjeta{transition:transform .35s var(--curva-suave),border-color .35s ease,box-shadow .35s ease}
.pantalla-imagen img{transition:transform .65s var(--curva-suave)}
.pantalla-imagen>span,.ampliar,.ia-captura-real>span{transition:transform .3s var(--curva-suave),background .3s ease}
.hero-vistas button,.rubros button{transition:background .25s ease,border-color .25s ease,color .25s ease,transform .3s var(--curva-suave)}
.boton>span,.enlace>span{transition:transform .3s var(--curva-suave)}
.boton:hover>span,.enlace:hover>span{transform:translate(2px,-2px)}
.hero-producto{transition:border-color .4s ease,box-shadow .4s ease}
.hero-producto:hover{border-color:#829636;box-shadow:0 0 65px -28px #cbf0002e}
.pestanas button[aria-selected=true]:after{transform-origin:center;animation:indicador-pestana .3s var(--curva-suave) both}
@keyframes indicador-pestana{from{transform:scaleX(.7);opacity:.3}to{transform:scaleX(1);opacity:1}}
dialog[open]{animation:entrada-ventana .22s var(--curva-suave) both}
dialog[open]::backdrop{animation:entrada-fondo .2s ease both}
@keyframes entrada-ventana{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes entrada-fondo{from{opacity:0}to{opacity:1}}
.acordeon details[open]>p{animation:entrada-respuesta .25s var(--curva-suave) both}
@keyframes entrada-respuesta{from{opacity:.3;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(hover:hover) and (pointer:fine){
 .pantalla-tarjeta:hover,.pantalla-tarjeta:focus-within{transform:translateY(-4px);border-color:#758253;box-shadow:0 14px 30px #0002}
 .pantalla-imagen:hover>span,.ia-captura-real:hover>span{transform:translateY(-3px);background:#fff}
 .hero-vistas button:hover,.rubros button:hover{transform:translateY(-2px)}
}
@media(max-width:800px){.entrada-pendiente{transform:translateY(12px)}.entrada-visible{animation-duration:.5s}.barra nav.visible{animation:entrada-menu .2s var(--curva-suave) both}}
@keyframes entrada-menu{from{opacity:.4;transform:translateY(-7px)}to{opacity:1;transform:translateY(0)}}
@media print{.entrada-pendiente,.entrada-visible{opacity:1!important;transform:none!important;animation:none!important}}
@media(prefers-reduced-motion:reduce){
 .entrada-pendiente,.entrada-visible{opacity:1!important;transform:none!important;animation:none!important}
 .pantalla-tarjeta,.pantalla-imagen img,.pantalla-imagen>span,.ampliar,.ia-captura-real>span,.hero-vistas button,.rubros button,.boton>span,.enlace>span,.hero-producto{transition:none!important}
 .pantalla-tarjeta:hover,.pantalla-tarjeta:focus-within,.hero-vistas button:hover,.rubros button:hover,.boton:hover>span,.enlace:hover>span,.pantalla-imagen:hover>span,.ia-captura-real:hover>span{transform:none}
 dialog[open],dialog[open]::backdrop,.acordeon details[open]>p,.pestanas button[aria-selected=true]:after,.barra nav.visible{animation:none!important}
}