/**
 * Our Core Services — one-time premium entrance (homepage).
 * Scoped to .core-services-section.
 *
 * Card state machine (on each .core-services__card):
 *   (default)       → FOUC-safe hidden
 *   .is-entering    → keyframes play
 *   .is-entered     → locked final (inline styles also forced by JS)
 */

/* Allow mid-animation travel without clipping */
.acc-services.core-services-section {
    overflow: visible;
}

.core-services-section .acc-svc-inner,
.core-services-section .core-services__grid,
.core-services-section .core-services__row {
    overflow: visible;
}

/* Row wrappers do not generate boxes — children stay grid items */
.core-services-section .core-services__row {
    display: contents;
}

/* Perspective for Card 4 / Card 6 rotateY flips */
.core-services-section .core-services__grid {
    perspective: 900px;
}

.core-services-section .core-services__card.card-flip-left,
.core-services-section .core-services__card.card-flip-right {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    transform-style: preserve-3d;
}

.core-services-section .core-services__card.card-flip-left {
    transform-origin: left center;
}

.core-services-section .core-services__card.card-flip-right {
    transform-origin: right center;
}

/* Kill redesign CSS reveals — this module owns motion */
.core-services-section .acc-svc-head > *,
.core-services-section .acc-svc-card {
    animation: none;
}

/* Wider head on tablet+ so the title can settle on 2 lines */
@media (min-width: 768px) {
    .core-services-section .core-services__head {
        max-width: 1100px;
    }
}

/*
 * Heading: dynamic CMS text. Base navy; last words gold via heading-flip.js
 * (.heading-tone-blue / .heading-tone-gold) — not a per-character gradient.
 */
.core-services-section .core-services__heading {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.22;
    color: var(--navy-800, #13285A);
}

/* ---------- Keyframes: heading block ---------- */
@keyframes core-svc-label-in {
    from { opacity: 0; transform: translateY(15px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes core-svc-heading-in {
    from { opacity: 0; transform: translateY(25px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes core-svc-subtext-in {
    from { opacity: 0; transform: translateY(18px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes core-svc-divider-in {
    from { opacity: 0; transform: scaleX(0); }
    to   { opacity: 1; transform: scaleX(1); }
}

/* ---------- Keyframes: 9 card styles ---------- */
@keyframes core-svc-card-slide-left {
    from { opacity: 0; transform: translateX(-60px) rotate(-5deg); }
    to   { opacity: 1; transform: translateX(0) rotate(0deg); }
}

@keyframes core-svc-card-rise-pop {
    0%   { opacity: 0; transform: translateY(50px) scale(0.85); }
    70%  { opacity: 1; transform: translateY(0) scale(1.03); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes core-svc-card-slide-right {
    from { opacity: 0; transform: translateX(60px) rotate(5deg); }
    to   { opacity: 1; transform: translateX(0) rotate(0deg); }
}

@keyframes core-svc-card-flip-left {
    from { opacity: 0; transform: rotateY(-70deg); }
    to   { opacity: 1; transform: rotateY(0deg); }
}

@keyframes core-svc-card-zoom-blur {
    from { opacity: 0; transform: scale(0.8); filter: blur(4px); }
    to   { opacity: 1; transform: scale(1); filter: blur(0px); }
}

@keyframes core-svc-card-flip-right {
    from { opacity: 0; transform: rotateY(70deg); }
    to   { opacity: 1; transform: rotateY(0deg); }
}

@keyframes core-svc-card-drop-bounce {
    0%   { opacity: 0; transform: translateY(-50px); }
    70%  { opacity: 1; transform: translateY(8px); }
    100% { opacity: 1; transform: translateY(0); }
}

@keyframes core-svc-card-diagonal-bl {
    from { opacity: 0; transform: translate(-40px, 40px); }
    to   { opacity: 1; transform: translate(0, 0); }
}

@keyframes core-svc-card-diagonal-br {
    from { opacity: 0; transform: translate(40px, 40px); }
    to   { opacity: 1; transform: translate(0, 0); }
}

@keyframes core-svc-icon-pop {
    from { opacity: 0; transform: scale(0); }
    to   { opacity: 1; transform: scale(1); }
}

@keyframes core-svc-title-rise {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes core-svc-desc-fade {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* ---------- Pre-animation rest (heading) ---------- */
.core-services-section:not(.core-services-head-in):not(.core-services-head-done):not(.core-services-anim-reduced) .core-services__label {
    opacity: 0;
    transform: translateY(15px);
    will-change: transform, opacity;
}

/* Heading motion owned by heading-flip.js (3D character flip) — do not pre-hide */

.core-services-section:not(.core-services-head-in):not(.core-services-head-done):not(.core-services-anim-reduced) .core-services__divider {
    opacity: 0;
    transform: scaleX(0);
    transform-origin: center center;
    will-change: transform, opacity;
}

.core-services-section:not(.core-services-head-in):not(.core-services-head-done):not(.core-services-anim-reduced) .core-services__subtext {
    opacity: 0;
    transform: translateY(18px);
    will-change: transform, opacity;
}

/* ---------- Pre-animation rest (cards — class on card itself) ---------- */
.core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-slide-left {
    opacity: 0;
    transform: translateX(-60px) rotate(-5deg);
    will-change: transform, opacity;
}

.core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-rise-pop {
    opacity: 0;
    transform: translateY(50px) scale(0.85);
    will-change: transform, opacity;
}

.core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-slide-right {
    opacity: 0;
    transform: translateX(60px) rotate(5deg);
    will-change: transform, opacity;
}

.core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-flip-left {
    opacity: 0;
    transform: rotateY(-70deg);
    will-change: transform, opacity;
}

.core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-zoom-blur {
    opacity: 0;
    transform: scale(0.8);
    filter: blur(4px);
    will-change: transform, opacity, filter;
}

.core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-flip-right {
    opacity: 0;
    transform: rotateY(70deg);
    will-change: transform, opacity;
}

.core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-drop-bounce {
    opacity: 0;
    transform: translateY(-50px);
    will-change: transform, opacity;
}

.core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-diagonal-bl {
    opacity: 0;
    transform: translate(-40px, 40px);
    will-change: transform, opacity;
}

.core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-diagonal-br {
    opacity: 0;
    transform: translate(40px, 40px);
    will-change: transform, opacity;
}

.core-services-section .core-services__card:not(.is-entering):not(.is-entered) .core-services__card-icon {
    opacity: 0;
    transform: scale(0);
    will-change: transform, opacity;
}

.core-services-section .core-services__card:not(.is-entering):not(.is-entered) .core-services__card-title {
    opacity: 0;
    transform: translateY(6px);
    will-change: transform, opacity;
}

.core-services-section .core-services__card:not(.is-entering):not(.is-entered) .core-services__card-desc {
    opacity: 0;
    will-change: opacity;
}

/* ---------- Heading play ---------- */
.core-services-section.core-services-head-in:not(.core-services-head-done) .core-services__label {
    animation: core-svc-label-in 0.5s ease-out 0s both;
    will-change: transform, opacity;
}

/* Heading play owned by heading-flip.js — skip block fade here */

.core-services-section.core-services-head-in:not(.core-services-head-done) .core-services__divider {
    transform-origin: center center;
    animation: core-svc-divider-in 0.5s ease-out 0.2s both;
    will-change: transform, opacity;
}

.core-services-section.core-services-head-in:not(.core-services-head-done) .core-services__subtext {
    animation: core-svc-subtext-in 0.5s ease-out 0.2s both;
    will-change: transform, opacity;
}

/* ---------- Card play (left → middle → right stagger ~0.12s) ---------- */
.core-services-section .core-services__card.is-entering:not(.is-entered).card-slide-left {
    animation: core-svc-card-slide-left 0.6s ease-out 0s both;
    will-change: transform, opacity;
}

.core-services-section .core-services__card.is-entering:not(.is-entered).card-rise-pop {
    animation: core-svc-card-rise-pop 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) 0.12s both;
    will-change: transform, opacity;
}

.core-services-section .core-services__card.is-entering:not(.is-entered).card-slide-right {
    animation: core-svc-card-slide-right 0.6s ease-out 0.24s both;
    will-change: transform, opacity;
}

.core-services-section .core-services__card.is-entering:not(.is-entered).card-flip-left {
    animation: core-svc-card-flip-left 0.65s ease-out 0s both;
    will-change: transform, opacity;
}

.core-services-section .core-services__card.is-entering:not(.is-entered).card-zoom-blur {
    animation: core-svc-card-zoom-blur 0.6s ease-out 0.12s both;
    will-change: transform, opacity, filter;
}

.core-services-section .core-services__card.is-entering:not(.is-entered).card-flip-right {
    animation: core-svc-card-flip-right 0.65s ease-out 0.24s both;
    will-change: transform, opacity;
}

.core-services-section .core-services__card.is-entering:not(.is-entered).card-drop-bounce {
    animation: core-svc-card-drop-bounce 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) 0s both;
    will-change: transform, opacity;
}

.core-services-section .core-services__card.is-entering:not(.is-entered).card-diagonal-bl {
    animation: core-svc-card-diagonal-bl 0.6s ease-out 0.12s both;
    will-change: transform, opacity;
}

.core-services-section .core-services__card.is-entering:not(.is-entered).card-diagonal-br {
    animation: core-svc-card-diagonal-br 0.6s ease-out 0.24s both;
    will-change: transform, opacity;
}

/* Icon → title → desc (after ~70% of card entrance) */
.core-services-section .core-services__card.is-entering:not(.is-entered).card-slide-left .core-services__card-icon,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-flip-left .core-services__card-icon,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-drop-bounce .core-services__card-icon {
    animation: core-svc-icon-pop 0.25s ease-out 0.42s both;
    will-change: transform, opacity;
}

.core-services-section .core-services__card.is-entering:not(.is-entered).card-rise-pop .core-services__card-icon,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-zoom-blur .core-services__card-icon,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-diagonal-bl .core-services__card-icon {
    animation: core-svc-icon-pop 0.25s ease-out 0.54s both;
    will-change: transform, opacity;
}

.core-services-section .core-services__card.is-entering:not(.is-entered).card-slide-right .core-services__card-icon,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-flip-right .core-services__card-icon,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-diagonal-br .core-services__card-icon {
    animation: core-svc-icon-pop 0.25s ease-out 0.66s both;
    will-change: transform, opacity;
}

.core-services-section .core-services__card.is-entering:not(.is-entered).card-slide-left .core-services__card-title,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-flip-left .core-services__card-title,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-drop-bounce .core-services__card-title {
    animation: core-svc-title-rise 0.25s ease-out 0.72s both;
    will-change: transform, opacity;
}

.core-services-section .core-services__card.is-entering:not(.is-entered).card-rise-pop .core-services__card-title,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-zoom-blur .core-services__card-title,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-diagonal-bl .core-services__card-title {
    animation: core-svc-title-rise 0.25s ease-out 0.84s both;
    will-change: transform, opacity;
}

.core-services-section .core-services__card.is-entering:not(.is-entered).card-slide-right .core-services__card-title,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-flip-right .core-services__card-title,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-diagonal-br .core-services__card-title {
    animation: core-svc-title-rise 0.25s ease-out 0.96s both;
    will-change: transform, opacity;
}

.core-services-section .core-services__card.is-entering:not(.is-entered).card-slide-left .core-services__card-desc,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-flip-left .core-services__card-desc,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-drop-bounce .core-services__card-desc {
    animation: core-svc-desc-fade 0.3s ease-out 1.02s both;
    will-change: opacity;
}

.core-services-section .core-services__card.is-entering:not(.is-entered).card-rise-pop .core-services__card-desc,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-zoom-blur .core-services__card-desc,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-diagonal-bl .core-services__card-desc {
    animation: core-svc-desc-fade 0.3s ease-out 1.14s both;
    will-change: opacity;
}

.core-services-section .core-services__card.is-entering:not(.is-entered).card-slide-right .core-services__card-desc,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-flip-right .core-services__card-desc,
.core-services-section .core-services__card.is-entering:not(.is-entered).card-diagonal-br .core-services__card-desc {
    animation: core-svc-desc-fade 0.3s ease-out 1.26s both;
    will-change: opacity;
}

/* ---------- Final locked state (heading) ---------- */
.core-services-section.core-services-head-done .core-services__label,
.core-services-section.core-services-head-done .core-services__heading,
.core-services-section.core-services-head-done .core-services__divider,
.core-services-section.core-services-head-done .core-services__subtext,
.core-services-section.core-services-anim-reduced .core-services__label,
.core-services-section.core-services-anim-reduced .core-services__heading,
.core-services-section.core-services-anim-reduced .core-services__divider,
.core-services-section.core-services-anim-reduced .core-services__subtext {
    opacity: 1;
    transform: none;
    animation: none;
    will-change: auto;
}

/* ---------- Final locked state (cards) ---------- */
.core-services-section .core-services__card.is-entered,
.core-services-section .core-services__card.is-entered .core-services__card-icon,
.core-services-section .core-services__card.is-entered .core-services__card-title,
.core-services-section .core-services__card.is-entered .core-services__card-desc,
.core-services-section.core-services-anim-reduced .core-services__card,
.core-services-section.core-services-anim-reduced .core-services__card-icon,
.core-services-section.core-services-anim-reduced .core-services__card-title,
.core-services-section.core-services-anim-reduced .core-services__card-desc {
    opacity: 1;
    transform: none;
    filter: none;
    animation: none;
    will-change: auto;
}

/* ---------- Mobile: shorter travel ---------- */
@media (max-width: 767px) {
    .core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-slide-left {
        transform: translateX(-28px) rotate(-3deg);
    }

    .core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-rise-pop {
        transform: translateY(28px) scale(0.9);
    }

    .core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-slide-right {
        transform: translateX(28px) rotate(3deg);
    }

    .core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-flip-left {
        transform: rotateY(-40deg);
    }

    .core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-flip-right {
        transform: rotateY(40deg);
    }

    .core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-drop-bounce {
        transform: translateY(-28px);
    }

    .core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-diagonal-bl {
        transform: translate(-20px, 20px);
    }

    .core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-diagonal-br {
        transform: translate(20px, 20px);
    }

    .core-services-section .core-services__card:not(.is-entering):not(.is-entered).card-zoom-blur {
        filter: blur(2px);
        transform: scale(0.9);
    }

    @keyframes core-svc-card-slide-left {
        from { opacity: 0; transform: translateX(-28px) rotate(-3deg); }
        to   { opacity: 1; transform: translateX(0) rotate(0deg); }
    }

    @keyframes core-svc-card-rise-pop {
        0%   { opacity: 0; transform: translateY(28px) scale(0.9); }
        70%  { opacity: 1; transform: translateY(0) scale(1.02); }
        100% { opacity: 1; transform: translateY(0) scale(1); }
    }

    @keyframes core-svc-card-slide-right {
        from { opacity: 0; transform: translateX(28px) rotate(3deg); }
        to   { opacity: 1; transform: translateX(0) rotate(0deg); }
    }

    @keyframes core-svc-card-flip-left {
        from { opacity: 0; transform: rotateY(-40deg); }
        to   { opacity: 1; transform: rotateY(0deg); }
    }

    @keyframes core-svc-card-flip-right {
        from { opacity: 0; transform: rotateY(40deg); }
        to   { opacity: 1; transform: rotateY(0deg); }
    }

    @keyframes core-svc-card-drop-bounce {
        0%   { opacity: 0; transform: translateY(-28px); }
        70%  { opacity: 1; transform: translateY(4px); }
        100% { opacity: 1; transform: translateY(0); }
    }

    @keyframes core-svc-card-diagonal-bl {
        from { opacity: 0; transform: translate(-20px, 20px); }
        to   { opacity: 1; transform: translate(0, 0); }
    }

    @keyframes core-svc-card-diagonal-br {
        from { opacity: 0; transform: translate(20px, 20px); }
        to   { opacity: 1; transform: translate(0, 0); }
    }

    @keyframes core-svc-card-zoom-blur {
        from { opacity: 0; transform: scale(0.9); filter: blur(2px); }
        to   { opacity: 1; transform: scale(1); filter: blur(0px); }
    }
}

@media (prefers-reduced-motion: reduce) {
    .core-services-section .core-services__label,
    .core-services-section .core-services__heading,
    .core-services-section .core-services__divider,
    .core-services-section .core-services__subtext,
    .core-services-section .core-services__card,
    .core-services-section .core-services__card-icon,
    .core-services-section .core-services__card-title,
    .core-services-section .core-services__card-desc {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
        animation: none !important;
        will-change: auto;
    }

    /* Two-tone word colours come from heading-flip.css — do not force transparent fill */
}
