/* Devsinc animation pack — lifted from design files (Home.dc.html et al.) */

/* ---- Scroll reveals ---- */
@keyframes dz-slideUp { from { opacity: 0; transform: translateY(20px) } to { opacity: 1; transform: translateY(0) } }
@keyframes dz-fadeIn { from { opacity: 0 } to { opacity: 1 } }
[data-reveal] { opacity: 0; }
[data-reveal].is-in { animation: dz-slideUp 0.6s ease-out forwards; }

/* ---- Marquee ---- */
[data-marquee] { overflow: hidden; display: flex; }
[data-marquee] .dz-marquee-track { display: flex; align-items: center; gap: 48px; flex-shrink: 0; padding-right: 48px; will-change: transform; animation: dz-marquee var(--dz-marquee-dur, 30s) linear infinite; }
@keyframes dz-marquee { from { transform: translateX(0) } to { transform: translateX(-100%) } }
[data-marquee]:hover .dz-marquee-track { animation-play-state: paused; }

/* ---- Slider ---- */
[data-slider] { position: relative; }
[data-slider] > .slide { position: absolute; inset: 0; opacity: 0; transition: opacity .8s; pointer-events: none; } /* keyboard/AT are handled by [inert], set in markup and kept in sync by initSliders() — opacity alone leaves the slide tabbable */
[data-slider] > .slide.is-active { opacity: 1; pointer-events: auto; }
[data-slider] > .slide:first-child { position: relative; min-height: 100%; box-sizing: border-box; } /* sizes the container; fills fixed-height sliders */

/* ---- Hover states (0.2s ease, from style-hover) ---- */
.hv-lift { transition: transform .2s ease, box-shadow .2s ease; }
.hv-lift:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(5, 24, 36, 0.12); }
.hv-darken { transition: background .2s ease; }
.hv-darken:hover { background: var(--color-ink, #051824) !important; }
.hv-arrow .arrow { display: inline-block; transition: transform .2s ease; }
.hv-arrow:hover .arrow { transform: translate(3px, -3px); }
.hv-underline { position: relative; }
.hv-underline::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 100%; height: 1.5px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .25s ease; }
.hv-underline:hover::after { transform: scaleX(1); }

/* ---- Dropdowns ---- */
[data-dropdown] { position: relative; }
[data-dropdown] [data-dropdown-panel] { position: absolute; top: 100%; left: 0; opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .18s ease, transform .18s ease, visibility .18s; z-index: 50; }
[data-dropdown].is-open [data-dropdown-panel] { opacity: 1; visibility: visible; transform: translateY(0); }

/* ---- Ambient loops (decorative, from Home hero) ---- */
@keyframes dz-breathe { 0%, 100% { transform: scale(1) } 50% { transform: scale(1.015) } }
@keyframes dz-orbit { from { transform: rotate(0deg) } to { transform: rotate(360deg) } }
@keyframes dz-pulse { 0%, 100% { opacity: .5; transform: scale(1) } 50% { opacity: .9; transform: scale(1.12) } }
@keyframes dz-ring { 0% { transform: scale(.82); opacity: .5 } 100% { transform: scale(1.22); opacity: 0 } }
@keyframes dz-eq { 0%, 100% { transform: scaleY(.4) } 50% { transform: scaleY(1) } }
@keyframes dz-float { 0%, 100% { transform: translateY(0) rotate(0deg) } 50% { transform: translateY(-10px) rotate(-4deg) } }
.amb-breathe { animation: dz-breathe 8s ease-in-out infinite; }
.amb-orbit { animation: dz-orbit 40s linear infinite; }
.amb-pulse { animation: dz-pulse 3s ease-in-out infinite; }
.amb-ring { animation: dz-ring 3.2s ease-out infinite; }
.amb-eq { transform-origin: bottom; animation: dz-eq 1s ease-in-out infinite; }
.amb-float { animation: dz-float 7s ease-in-out infinite; }

/* ---- Reduced motion ---- */
@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1; animation: none; }
  [data-marquee] .dz-marquee-track,
  .amb-breathe, .amb-orbit, .amb-pulse, .amb-ring, .amb-eq, .amb-float { animation: none; }
  [data-slider] > .slide { transition: none; }
}
