/* APD Web · Athos™ Storage vertical — estados que la maqueta calcula en JS y que aquí se fijan
   con CSS para que no haya saltos al cargar. Sin movimiento (o con ?captura) manda el estado
   estático de la página, igual que en la maqueta. */

/* Rótulos y cota del hero: solo a partir de 960 px (maqueta: estado «wide») */
@media (max-width: 959px) {
  #inicio [data-apd-h="hero-anno"], #inicio [data-apd-h="hero-dims"] { display: none; }
}

/* Elementor no guarda un «flex» con decimales (ni su base) («flex: 1.5 1 380px» en la maqueta) */
#instalaciones [data-apd-h="oc"] { flex: 1.5 1 380px; }

/* Cifra «80–120%»: el «%» va dentro del mismo texto (como en la maqueta, para que «120%» baje junto si no cabe) */
#por-que .elementor-element-6896951c span span { color: var(--emphasis); }

@media (prefers-reduced-motion: no-preference) {
  /* entrada de la foto del producto, los rótulos y la cota de altura */
  html.apd-js:not([data-apd-reduced-motion]) #inicio [data-apd-h="hero-img"] { clip-path: inset(100% 0% 0% 0%); transform: scale(1.08); transition: clip-path 1200ms var(--ease-enter) 150ms, transform 1600ms var(--ease-enter) 150ms; }
  html.apd-js:not([data-apd-reduced-motion]) #inicio [data-apd-h="hero-anno"] { opacity: 0; transition: opacity 600ms var(--ease-enter) 1300ms; }
  html.apd-js:not([data-apd-reduced-motion]) #inicio [data-apd-h="dim-line"] { opacity: 0; transition: opacity 400ms var(--ease-enter) 600ms; }
  html.apd-js:not([data-apd-reduced-motion]) #inicio [data-apd-h="dim-bar"] { transform: scaleY(0); transition: transform 1200ms var(--ease-enter) 700ms; }
  html.apd-js:not([data-apd-reduced-motion]) #inicio [data-apd-h="dim-top"] { opacity: 0; transition: opacity 400ms var(--ease-enter) 1700ms; }
  html.apd-js:not([data-apd-reduced-motion]) #inicio [data-apd-h="dim-label"] { opacity: 0; transition: opacity 400ms var(--ease-enter) 1500ms; }
  html.apd-js:not([data-apd-reduced-motion]) #inicio.is-in [data-apd-h="hero-img"] { clip-path: inset(0% 0% 0% 0%); transform: scale(1); }
  html.apd-js:not([data-apd-reduced-motion]) #inicio.is-in :is([data-apd-h="hero-anno"], [data-apd-h="dim-line"], [data-apd-h="dim-top"], [data-apd-h="dim-label"]) { opacity: 1; }
  html.apd-js:not([data-apd-reduced-motion]) #inicio.is-in [data-apd-h="dim-bar"] { transform: scaleY(1); }
}