/* =========================================================
   Hamida Traders
   RTM-014 — Home Animation System
   Load AFTER hero.css
   ========================================================= */

/* ===== Generic reveal states ===== */
.ht-reveal{
    opacity:0;
    transform:translateY(24px);
    transition:
        opacity .7s cubic-bezier(.22,.8,.3,1),
        transform .7s cubic-bezier(.22,.8,.3,1);
    will-change:opacity,transform;
}

.ht-reveal.is-visible{
    opacity:1;
    transform:translateY(0);
}

.ht-reveal--left{
    transform:translateX(-26px);
}

.ht-reveal--left.is-visible{
    transform:translateX(0);
}

.ht-reveal--right{
    transform:translateX(26px);
}

.ht-reveal--right.is-visible{
    transform:translateX(0);
}

.ht-reveal--scale{
    transform:scale(.97);
}

.ht-reveal--scale.is-visible{
    transform:scale(1);
}

/* ===== Stagger support ===== */
.ht-reveal[data-delay="1"]{transition-delay:.06s}
.ht-reveal[data-delay="2"]{transition-delay:.12s}
.ht-reveal[data-delay="3"]{transition-delay:.18s}
.ht-reveal[data-delay="4"]{transition-delay:.24s}
.ht-reveal[data-delay="5"]{transition-delay:.30s}
.ht-reveal[data-delay="6"]{transition-delay:.36s}

/* ===== Inquiry spotlight animation ===== */
.inquiry-spotlight-card{
    isolation:isolate;
}

.inquiry-spotlight-card::before{
    content:'';
    position:absolute;
    inset:-2px;
    border-radius:inherit;
    background:
        linear-gradient(
            110deg,
            transparent 10%,
            rgba(255,255,255,.26) 38%,
            transparent 66%
        );
    transform:translateX(-125%);
    animation:ht-spotlight-sheen 5.8s ease-in-out infinite;
    z-index:0;
    pointer-events:none;
}

@keyframes ht-spotlight-sheen{
    0%,58%{transform:translateX(-125%)}
    78%,100%{transform:translateX(125%)}
}

.inquiry-spotlight-card__action{
    animation:ht-action-breathe 3s ease-in-out infinite;
}

@keyframes ht-action-breathe{
    0%,100%{
        transform:translateY(0);
        box-shadow:0 0 0 0 rgba(255,255,255,.08);
    }
    50%{
        transform:translateY(-2px);
        box-shadow:0 0 0 7px rgba(255,255,255,.035);
    }
}

/* ===== Value-card micro motion ===== */
.home-value-card{
    position:relative;
    overflow:hidden;
}

.home-value-card::after{
    content:'';
    position:absolute;
    left:-60%;
    bottom:-75%;
    width:180px;
    height:180px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(0,82,204,.08),transparent 70%);
    transition:
        left .45s ease,
        bottom .45s ease;
    pointer-events:none;
}

.home-value-card:hover::after{
    left:58%;
    bottom:-54%;
}

/* ===== Category card movement ===== */
.home-category-preview div{
    position:relative;
    overflow:hidden;
}

.home-category-preview div::after{
    content:'→';
    position:absolute;
    right:18px;
    bottom:14px;
    color:#0052cc;
    font-size:12px;
    opacity:0;
    transform:translateX(-6px);
    transition:opacity .25s ease,transform .25s ease;
}

.home-category-preview div:hover::after{
    opacity:1;
    transform:translateX(0);
}

/* ===== Contact CTA subtle pulse ===== */
.home-contact-cta__card{
    position:relative;
    overflow:hidden;
}

.home-contact-cta__card::before{
    content:'';
    position:absolute;
    width:300px;
    height:300px;
    right:-140px;
    top:-160px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(0,82,204,.07),transparent 72%);
    animation:ht-cta-glow 7s ease-in-out infinite;
    pointer-events:none;
}

@keyframes ht-cta-glow{
    0%,100%{transform:scale(1);opacity:.65}
    50%{transform:scale(1.12);opacity:1}
}

/* ===== Orb extra ambient motion ===== */
.trade-orb__longitude{
    animation-duration:22s;
}

.trade-orb__equator{
    animation-duration:27s;
}

.trade-particle{
    filter:drop-shadow(0 0 5px rgba(0,82,204,.18));
}

/* ===== Small attention animation for primary CTA ===== */
.home-hero__actions .home-btn--primary{
    animation:ht-primary-nudge 5.5s ease-in-out infinite;
}

@keyframes ht-primary-nudge{
    0%,72%,100%{transform:translateY(0)}
    80%{transform:translateY(-2px)}
    87%{transform:translateY(0)}
    93%{transform:translateY(-1px)}
}

/* ===== Performance safety ===== */
@media (max-width:700px){
    .inquiry-spotlight-card::before{
        animation-duration:7s;
    }

    .home-contact-cta__card::before{
        animation-duration:9s;
    }

    .trade-particle--4,
    .trade-particle--5{
        display:none;
    }
}

/* ===== Reduced motion ===== */
@media (prefers-reduced-motion:reduce){
    .ht-reveal,
    .ht-reveal--left,
    .ht-reveal--right,
    .ht-reveal--scale{
        opacity:1!important;
        transform:none!important;
        transition:none!important;
    }

    .inquiry-spotlight-card::before,
    .inquiry-spotlight-card__action,
    .home-contact-cta__card::before,
    .home-hero__actions .home-btn--primary{
        animation:none!important;
    }
}
