/* ================================================================
   CresAlta Theme — Animations
   ================================================================ */

/* ── Keyframes ───────────────────────────────────────────────────── */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(32px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes fadeInLeft {
    from { opacity: 0; transform: translateX(-32px); }
    to   { opacity: 1; transform: translateX(0); }
}

@keyframes fadeInRight {
    from { opacity: 0; transform: translateX(32px); }
    to   { opacity: 1; transform: translateX(0); }
}

@keyframes scaleIn {
    from { opacity: 0; transform: scale(0.88); }
    to   { opacity: 1; transform: scale(1); }
}

@keyframes scrollPulse {
    0%, 100% { opacity: 0.5; transform: scaleY(1); }
    50%       { opacity: 1;   transform: scaleY(1.15); }
}

@keyframes pulse {
    0%, 100% { opacity: 1;   transform: scale(1); }
    50%       { opacity: 0.6; transform: scale(0.95); }
}

@keyframes floatY {
    0%, 100% { transform: translateY(0px); }
    50%       { transform: translateY(-20px); }
}

@keyframes preloaderPulse {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.5; }
}

@keyframes preloaderBar {
    0%   { width: 0%; }
    65%  { width: 82%; }
    100% { width: 100%; }
}

@keyframes heroOrb {
    0%, 100% { transform: translateY(0px) scale(1); }
    50%       { transform: translateY(-28px) scale(1.04); }
}

@keyframes shimmer {
    0%   { background-position: -200% 0; }
    100% { background-position: 200%  0; }
}

@keyframes goldUnderline {
    from { width: 0; }
    to   { width: 100%; }
}

/* ── Hero entrance (delayed past preloader ~1s) ───────────────────── */
.hero__eyebrow  { animation: fadeInLeft  0.7s ease both; animation-delay: 1.1s; }
.hero h1        { animation: fadeInUp    0.8s ease both; animation-delay: 1.3s; }
.hero__lead     { animation: fadeInUp    0.8s ease both; animation-delay: 1.5s; }
.hero__cta      { animation: fadeInUp    0.8s ease both; animation-delay: 1.7s; }
.hero__scroll   { animation: fadeInUp    0.8s ease both; animation-delay: 2.0s; }

/* ── Stats bar ───────────────────────────────────────────────────── */
.stat-item__value {
    transition: color 0.3s ease;
}

/* ── Gold underline on headings (hover) ──────────────────────────── */
.section-title--underline {
    display: inline-block;
    position: relative;
}

.section-title--underline::after {
    content: '';
    position: absolute;
    bottom: -6px;
    left: 0;
    width: 48px;
    height: 3px;
    background: var(--gold);
    border-radius: 2px;
}

/* ── AOS custom easing overrides ──────────────────────────────────── */
[data-aos] {
    transition-property: transform, opacity;
}

[data-aos="fade-up"] {
    transform: translateY(28px);
}

[data-aos="fade-right"] {
    transform: translateX(-28px);
}

[data-aos="fade-left"] {
    transform: translateX(28px);
}

[data-aos="zoom-in"] {
    transform: scale(0.9);
}

/* ── Card hover lift (shared) ────────────────────────────────────── */
.hover-lift {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.hover-lift:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 48px rgba(38, 63, 110, 0.14);
}

/* ── Gold accent line (reusable) ─────────────────────────────────── */
.gold-line {
    display: block;
    width: 48px;
    height: 3px;
    background: var(--gold);
    border-radius: 2px;
    margin: 1rem 0 1.5rem;
}

/* ── Centered heading block ──────────────────────────────────────── */
/* Shrinks to H2 width, centers the block, left-aligns everything
   inside — so the label and gold line start at the H2's first letter */
.section-heading--center {
    display: block;
    width: fit-content;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}
.section-heading--center .gold-line {
    margin-left: 0;
    margin-right: auto;
}

.gold-line--center {
    margin-left: auto;
    margin-right: auto;
}

/* ── Page transition: handled by preloader — no additional animation ── */

/* ── Scroll progress bar ─────────────────────────────────────────── */
.scroll-progress {
    position: fixed;
    top: 0; left: 0;
    height: 3px;
    width: 0%;
    background: linear-gradient(90deg, var(--gold-dark), var(--gold-light));
    z-index: 10000;
    pointer-events: none;
    transition: width 0.08s linear;
}

/* ── Gold line: draw-in transition ────────────────────────────────── */
.gold-line,
.vision-gold__line {
    transition: width 0.65s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ── Button shimmer on hover ─────────────────────────────────────── */
.btn-primary,
.btn-navy {
    position: relative;
    overflow: hidden;
}
.btn-primary::after,
.btn-navy::after {
    content: '';
    position: absolute;
    top: 0; left: -120%;
    width: 60%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255,255,255,0.28) 50%,
        transparent 100%
    );
    transition: left 0.55s ease;
    pointer-events: none;
}
.btn-primary:hover::after,
.btn-navy:hover::after {
    left: 160%;
}

/* ── Philosophy + solution cards: gold shimmer on hover ──────────── */
.solution-icon-card {
    position: relative;
    overflow: hidden;
}
.philosophy-card::after,
.solution-icon-card::after {
    content: '';
    position: absolute;
    top: 0; left: -120%;
    width: 60%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(195,165,82,0.10) 50%,
        transparent 100%
    );
    transition: left 0.6s ease;
    pointer-events: none;
}
.philosophy-card:hover::after,
.solution-icon-card:hover::after {
    left: 160%;
}

/* ── Reduced motion ──────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    [data-aos] { transition: none !important; }
    .scroll-progress { transition: none; }
    .gold-line, .vision-gold__line { transition: none; }
}
