/* ==========================================================================
   Digidrom — Animations layer
   All IO-based reveals are triggered by .is-visible class applied by
   public/js/animations.js. Respects prefers-reduced-motion.
   ========================================================================== */

/* Base reveal state ------------------------------------------------------- */
[data-anim]{opacity:0;will-change:transform,opacity;transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1)}
[data-anim].is-visible{opacity:1;transform:none}

[data-anim="fade-up"]{transform:translateY(40px)}
[data-anim="fade-down"]{transform:translateY(-40px)}
[data-anim="fade-left"]{transform:translateX(40px)}
[data-anim="fade-right"]{transform:translateX(-40px)}
[data-anim="zoom-in"]{transform:scale(.92)}
[data-anim="rotate-in"]{transform:rotate(-6deg) translateY(30px)}
[data-anim="blur-in"]{filter:blur(20px)}
[data-anim="blur-in"].is-visible{filter:none}

/* Stagger via --i index --------------------------------------------------- */
[data-anim][style*="--i"],[data-anim-stagger]>*{transition-delay:calc(var(--i,0) * 80ms)}

/* Hero entrance ----------------------------------------------------------- */
.dd-hero__eyebrow,.dd-hero__title,.dd-hero__lead,.dd-hero__cta,.dd-hero__meta{animation:none}
.dd-hero__eyebrow,.dd-hero__title,.dd-hero__lead,.dd-hero__cta,.dd-hero__meta{opacity:1;transform:none}

/* Floating decorative orbs ------------------------------------------------ */
.dd-orb{position:absolute;border-radius:50%;pointer-events:none;filter:blur(60px);opacity:.55;mix-blend-mode:plus-lighter;animation:ddFloat 12s ease-in-out infinite alternate;will-change:transform}
.dd-orb--a{width:380px;height:380px;top:-80px;left:-60px;background:radial-gradient(circle,#f97316,transparent 60%);animation-delay:0s}
.dd-orb--b{width:460px;height:460px;right:-120px;top:10%;background:radial-gradient(circle,#fdba74,transparent 60%);animation-delay:-3s}
.dd-orb--c{width:320px;height:320px;left:30%;bottom:-80px;background:radial-gradient(circle,#1e40af,transparent 60%);animation-delay:-6s}
@media (max-width:768px){
    .dd-orb--a{width:220px;height:220px}
    .dd-orb--b{width:260px;height:260px;right:-80px}
    .dd-orb--c{width:200px;height:200px;bottom:-120px;left:20%}
}
@keyframes ddFloat{0%{transform:translate(0,0) scale(1)}50%{transform:translate(40px,-30px) scale(1.05)}100%{transform:translate(-30px,40px) scale(.95)}}

/* Ken Burns hero image ---------------------------------------------------- */
.dd-kenburns{animation:ddKenburns 18s ease-in-out infinite alternate}
@keyframes ddKenburns{0%{transform:scale(1) translate(0,0)}100%{transform:scale(1.12) translate(-2%,-2%)}}

/* Gradient border shimmer ------------------------------------------------- */
.dd-shimmer{position:relative;overflow:hidden;isolation:isolate}
.dd-shimmer::after{content:"";position:absolute;inset:-50%;background:conic-gradient(from 0deg,transparent 0deg,rgba(255,255,255,.18) 40deg,transparent 80deg,transparent 360deg);animation:ddSpin 6s linear infinite;z-index:-1}
@keyframes ddSpin{to{transform:rotate(360deg)}}

/* Button magnetic / glow -------------------------------------------------- */
.dd-btn{position:relative;overflow:hidden;isolation:isolate}
.dd-btn--primary::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.4) 50%,transparent 70%);transform:translateX(-150%);transition:transform .8s}
.dd-btn--primary:hover::before{transform:translateX(150%)}

/* Hover lift on cards (override default) ---------------------------------- */
.dd-card,.dd-tile,.dd-testimonial{transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s}

/* Ticker / marquee -------------------------------------------------------- */
.dd-marquee{display:flex;gap:3rem;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);padding:1rem 0}
.dd-marquee__track{display:flex;gap:3rem;flex-shrink:0;animation:ddMarquee 28s linear infinite}
.dd-marquee:hover .dd-marquee__track{animation-play-state:paused}
@keyframes ddMarquee{to{transform:translateX(-100%)}}

/* Counter pulse on visible ------------------------------------------------ */
.dd-stat.is-visible .dd-stat__value{animation:ddPulse .8s ease}
@keyframes ddPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}

/* Parallax layer ---------------------------------------------------------- */
[data-parallax]{will-change:transform}

/* Skeleton loader --------------------------------------------------------- */
.dd-skel{position:relative;overflow:hidden;background:var(--dd-surface);border-radius:8px;isolation:isolate}
.dd-skel::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--dd-fg) 8%,transparent),transparent);transform:translateX(-100%);animation:ddSkel 1.3s infinite;will-change:transform}
@keyframes ddSkel{to{transform:translateX(100%)}}

/* Reduced motion ---------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
    [data-anim],.dd-hero__eyebrow,.dd-hero__title,.dd-hero__lead,.dd-hero__cta,.dd-hero__meta{opacity:1!important;transform:none!important;animation:none!important;filter:none!important}
    .dd-orb,.dd-kenburns,.dd-shimmer::after,.dd-marquee__track{animation:none!important}
}
