/* ===================================================
   NOIR & GOLD — Animations
   =================================================== */

/* ── Scroll Reveal Base ── */
[data-animate] {
    opacity: 0;
    transition-property: opacity, transform;
    transition-duration: .8s;
    transition-timing-function: cubic-bezier(.25,.46,.45,.94);
    will-change: opacity, transform;
}
[data-animate].is-visible { opacity: 1; transform: none !important; }

/* Directions */
[data-animate="fade-up"] { transform: translateY(50px); }
[data-animate="fade-down"] { transform: translateY(-50px); }
[data-animate="fade-left"] { transform: translateX(60px); }
[data-animate="fade-right"] { transform: translateX(-60px); }
[data-animate="fade-in"] { transform: none; }
[data-animate="scale-in"] { transform: scale(.9); }

/* ── Gold Shimmer on Headings ── */
@keyframes shimmer {
    0% { background-position: -200% center; }
    100% { background-position: 200% center; }
}
.section__title .gold {
    background: linear-gradient(90deg, var(--gold-dark), var(--gold-light), var(--gold), var(--gold-dark));
    background-size: 200% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: shimmer 4s linear infinite;
}

/* ── Float Animation ── */
@keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}

/* ── Pulse Glow ── */
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 15px rgba(201,168,76,.3); }
    50% { box-shadow: 0 0 30px rgba(201,168,76,.6); }
}

/* ── Line Draw ── */
@keyframes lineDraw {
    from { width: 0; }
    to { width: 60px; }
}
.section__divider.is-visible { animation: lineDraw .8s ease forwards; }

/* ── Spin ── */
@keyframes spin {
    from { transform: rotate(0); }
    to { transform: rotate(360deg); }
}

/* ── Spirit Card Hover Effects ── */
.spirit-card::before {
    content: '';
    position: absolute;
    inset: 0;
    border: 1px solid transparent;
    transition: border-color .6s ease;
    z-index: 1;
    pointer-events: none;
}
.spirit-card:hover::before { border-color: rgba(201,168,76,.2); }

.spirit-card__image::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, var(--gold), transparent);
    transform: scaleX(0);
    transition: transform .6s ease;
}
.spirit-card:hover .spirit-card__image::after { transform: scaleX(1); }

/* ── Button Ripple ── */
.btn::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background: rgba(201,168,76,.1);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    transition: width .6s ease, height .6s ease;
}
.btn:hover::after { width: 400px; height: 400px; }

/* ── Nav Link Hover Decorations ── */
.nav__link::before {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 50%;
    width: 4px;
    height: 4px;
    background: var(--gold);
    border-radius: 50%;
    transform: translateX(-50%) scale(0);
    transition: transform .3s ease;
}
.nav__link:hover::before { transform: translateX(-50%) scale(1); }
.nav__link.is-active::before { transform: translateX(-50%) scale(1); }

/* ── Experience Card Icon Animation ── */
.exp-card__icon {
    transition: transform .5s ease, color .3s ease;
}
.exp-card:hover .exp-card__icon { transform: translateY(-5px) scale(1.1); }

/* ── Value Card Number Gradient Animation ── */
@keyframes gradientMove {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}
.value-card:hover .value-card__num {
    background-size: 200% 200%;
    animation: gradientMove 2s ease infinite;
}

/* ── Timeline Dot Pulse ── */
.timeline__dot { animation: pulseGlow 3s ease-in-out infinite; }

/* ── Intro Badge Float ── */
.intro__badge { animation: float 4s ease-in-out infinite; }

/* ── Page Transition ── */
.main {
    animation: pageIn .8s ease forwards;
}
@keyframes pageIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ── Testimonial slide-out ── */
.testimonial.is-leaving {
    opacity: 0;
    transform: translateX(-40px);
}

/* ── Parallax Background Shift ── */
@keyframes bgShift {
    0% { background-position: 0% 0%; }
    100% { background-position: 100% 100%; }
}

/* ── Loading dots for form submit ── */
@keyframes dots {
    0%, 80%, 100% { opacity: 0; }
    40% { opacity: 1; }
}

/* ── Hover line animation for footer links ── */
.footer__list a {
    position: relative;
}
.footer__list a::before {
    content: '—';
    position: absolute;
    left: -1.2rem;
    color: var(--gold);
    opacity: 0;
    transition: opacity .3s ease;
}
.footer__list a:hover::before { opacity: 1; }

/* ── Contact Social Link Hover ── */
.contact__social-link { position: relative; }
.contact__social-link::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 1px;
    background: var(--gold);
    transition: width .3s ease;
}
.contact__social-link:hover::after { width: 100%; }

/* ── Stagger Utility ── */
[data-delay] { transition-delay: var(--anim-delay, 0ms); }