/* =========================================================
   POMOSDA — SECTION 10 MOTION R17
   Motion-only layer for Redesign R15 + Visual R16.
   Final static layout remains unchanged.
   ========================================================= */

.pomosda-facilities-section.s10m17 {
    --s10m17-ease: cubic-bezier(.22, 1, .36, 1);
    --s10m17-ease-soft: cubic-bezier(.22, .72, .25, 1);
}

/* ---------------------------------------------------------
   SECTION ENTRANCE
   Static state is untouched until JS adds s10m17-ready.
   --------------------------------------------------------- */

.pomosda-facilities-section.s10m17.s10m17-ready:not(.is-s10m17-visible)
.pomosda-facilities-section__eyebrow,
.pomosda-facilities-section.s10m17.s10m17-ready:not(.is-s10m17-visible)
.pomosda-facilities-section__header h2,
.pomosda-facilities-section.s10m17.s10m17-ready:not(.is-s10m17-visible)
.pomosda-facilities-section__header p,
.pomosda-facilities-section.s10m17.s10m17-ready:not(.is-s10m17-visible)
.pomosda-facilities-tabs {
    opacity: 0;
    translate: 0 20px;
}

.pomosda-facilities-section.s10m17 .pomosda-facilities-section__eyebrow,
.pomosda-facilities-section.s10m17 .pomosda-facilities-section__header h2,
.pomosda-facilities-section.s10m17 .pomosda-facilities-section__header p,
.pomosda-facilities-section.s10m17 .pomosda-facilities-tabs {
    transition:
        opacity 720ms var(--s10m17-ease),
        translate 720ms var(--s10m17-ease);
}

.pomosda-facilities-section.s10m17.is-s10m17-visible
.pomosda-facilities-section__eyebrow,
.pomosda-facilities-section.s10m17.is-s10m17-visible
.pomosda-facilities-section__header h2,
.pomosda-facilities-section.s10m17.is-s10m17-visible
.pomosda-facilities-section__header p,
.pomosda-facilities-section.s10m17.is-s10m17-visible
.pomosda-facilities-tabs {
    opacity: 1;
    translate: 0 0;
}

.pomosda-facilities-section.s10m17
.pomosda-facilities-section__header h2 {
    transition-delay: 90ms;
}

.pomosda-facilities-section.s10m17
.pomosda-facilities-section__header p {
    transition-delay: 180ms;
}

.pomosda-facilities-section.s10m17
.pomosda-facilities-tabs {
    transition-delay: 270ms;
}

/* active tab gets one small "lock-in" pulse */
.pomosda-facilities-section.s10m17
.pomosda-facilities-tab.s10m17-tab-pulse {
    animation: s10m17TabPulse 430ms var(--s10m17-ease) 1 both;
}

@keyframes s10m17TabPulse {
    0% { scale: .94; }
    55% { scale: 1.045; }
    100% { scale: 1; }
}

/* ---------------------------------------------------------
   POCKET / SCENE ENTRANCE
   --------------------------------------------------------- */

.pomosda-facilities-section.s10m17
.pomosda-facility-pocket.is-active.s10m17-pocket-enter {
    animation: s10m17PocketEnter 720ms var(--s10m17-ease) 1 both;
}

@keyframes s10m17PocketEnter {
    0% {
        opacity: .45;
        translate: 0 18px;
        filter: blur(5px);
    }
    100% {
        opacity: 1;
        translate: 0 0;
        filter: none;
    }
}

/* ---------------------------------------------------------
   INFO PANEL STAGGER
   Use independent translate property so R15 transform rules
   are not disturbed.
   --------------------------------------------------------- */

.pomosda-facilities-section.s10m17
.pomosda-facility-pocket__info.s10m17-info-refresh
> * {
    animation: s10m17InfoItem 650ms var(--s10m17-ease) 1 both;
}

.pomosda-facilities-section.s10m17
.pomosda-facility-pocket__info.s10m17-info-refresh
> :nth-child(1) { animation-delay: 40ms; }

.pomosda-facilities-section.s10m17
.pomosda-facility-pocket__info.s10m17-info-refresh
> :nth-child(2) { animation-delay: 105ms; }

.pomosda-facilities-section.s10m17
.pomosda-facility-pocket__info.s10m17-info-refresh
> :nth-child(3) { animation-delay: 175ms; }

.pomosda-facilities-section.s10m17
.pomosda-facility-pocket__info.s10m17-info-refresh
> :nth-child(4) { animation-delay: 245ms; }

@keyframes s10m17InfoItem {
    0% {
        opacity: 0;
        translate: -18px 0;
    }
    100% {
        opacity: 1;
        translate: 0 0;
    }
}

.pomosda-facilities-section.s10m17
.pomosda-facility-pocket__info.s10m17-info-refresh
h3::after {
    animation: s10m17Underline 620ms var(--s10m17-ease) 210ms 1 both;
    transform-origin: left center;
}

@keyframes s10m17Underline {
    0% { scale: 0 1; opacity: .2; }
    100% { scale: 1 1; opacity: 1; }
}

/* ---------------------------------------------------------
   HERO ENTRANCE
   --------------------------------------------------------- */

.pomosda-facilities-section.s10m17
.pomosda-facility-card.is-active.s10m17-hero-enter {
    animation: s10m17HeroEnter 820ms var(--s10m17-ease) 1 both;
}

@keyframes s10m17HeroEnter {
    0% {
        opacity: 0;
        translate: 0 22px;
        scale: .965;
        filter: saturate(.82) blur(3px);
    }
    62% {
        opacity: 1;
        translate: 0 -2px;
        scale: 1.006;
        filter: saturate(1.02) blur(0);
    }
    100% {
        opacity: 1;
        translate: 0 0;
        scale: 1;
        filter: none;
    }
}

/* Featured badge snap */
.pomosda-facilities-section.s10m17
.pomosda-facility-card.is-active.s10m17-hero-enter::after {
    animation: s10m17BadgeEnter 520ms var(--s10m17-ease) 470ms 1 both;
}

@keyframes s10m17BadgeEnter {
    0% { opacity: 0; translate: -8px 0; scale: .88; }
    100% { opacity: 1; translate: 0 0; scale: 1; }
}

/* subtle idle breath only after scene settles */
.pomosda-facilities-section.s10m17.is-s10m17-visible
.pomosda-facility-card.is-active:not(.s10m17-hero-enter) img {
    animation: s10m17HeroBreath 8s ease-in-out infinite alternate;
    transform-origin: center center;
}

@keyframes s10m17HeroBreath {
    from { scale: 1; }
    to { scale: 1.012; }
}

/* ---------------------------------------------------------
   PREVIEW STAGGER
   --------------------------------------------------------- */

.pomosda-facilities-section.s10m17
.pomosda-facility-card.s10m17-preview-enter {
    animation: s10m17PreviewEnter 680ms var(--s10m17-ease) 1 both;
}

.pomosda-facilities-section.s10m17
.pomosda-facility-card.is-next.s10m17-preview-enter {
    animation-delay: 210ms;
}

.pomosda-facilities-section.s10m17
.pomosda-facility-card.is-next-2.s10m17-preview-enter {
    animation-delay: 330ms;
}

@keyframes s10m17PreviewEnter {
    0% {
        opacity: 0;
        translate: 22px 0;
        scale: .93;
        filter: saturate(.55) blur(2px);
    }
    100% {
        opacity: 1;
        translate: 0 0;
        scale: 1;
    }
}

/* ---------------------------------------------------------
   ONE-SHOT HERO LIGHT SWEEP
   JS injects .s10m17-sheen into cards; it never affects layout.
   --------------------------------------------------------- */

.pomosda-facilities-section.s10m17
.pomosda-facility-card .s10m17-sheen {
    position: absolute;
    inset: 0;
    z-index: 11;
    overflow: hidden;
    border-radius: inherit;
    pointer-events: none;
}

.pomosda-facilities-section.s10m17
.pomosda-facility-card .s10m17-sheen::before {
    content: "";
    position: absolute;
    top: -18%;
    bottom: -18%;
    left: -54%;
    width: 34%;
    opacity: 0;
    rotate: 7deg;
    background:
        linear-gradient(
            100deg,
            transparent 0%,
            rgba(255,255,255,.08) 20%,
            rgba(255,255,255,.58) 48%,
            rgba(243,198,35,.13) 64%,
            transparent 100%
        );
}

.pomosda-facilities-section.s10m17
.pomosda-facility-card.is-active.s10m17-sweep
.s10m17-sheen::before {
    animation: s10m17Sweep 760ms var(--s10m17-ease-soft) 1 both;
}

@keyframes s10m17Sweep {
    0% {
        opacity: 0;
        translate: 0 0;
    }
    18% { opacity: .74; }
    100% {
        opacity: 0;
        translate: 500% 0;
    }
}

/* ---------------------------------------------------------
   SLIDER FLIP / DEPTH
   JS uses WAAPI for geometry. These classes add atmosphere.
   --------------------------------------------------------- */

.pomosda-facilities-section.s10m17
.pomosda-facility-card.s10m17-became-active {
    animation: s10m17ActiveSettle 620ms var(--s10m17-ease) 1 both;
}

@keyframes s10m17ActiveSettle {
    0% { filter: saturate(.90); }
    45% { filter: saturate(1.07); }
    100% { filter: none; }
}

.pomosda-facilities-section.s10m17
.pomosda-facility-card.s10m17-going-away {
    animation: s10m17GoingAway 420ms ease 1 both;
}

@keyframes s10m17GoingAway {
    from { filter: saturate(1); }
    to { filter: saturate(.78); }
}

/* ---------------------------------------------------------
   ARROW TACTILE RESPONSE
   --------------------------------------------------------- */

.pomosda-facilities-section.s10m17
.pomosda-facility-pocket__arrow.s10m17-arrow-hit {
    animation: s10m17ArrowHit 360ms var(--s10m17-ease) 1 both;
}

@keyframes s10m17ArrowHit {
    0% { scale: 1; }
    42% { scale: .87; }
    75% { scale: 1.08; }
    100% { scale: 1; }
}

/* ---------------------------------------------------------
   AMBIENT R16 SHAPES
   --------------------------------------------------------- */

.pomosda-facilities-section.s10m17.is-s10m17-visible
.pomosda-facility-pocket.is-active
.pomosda-facility-pocket__slider::before {
    animation: s10m17GoldFloat 7.5s ease-in-out infinite alternate;
}

.pomosda-facilities-section.s10m17.is-s10m17-visible
.pomosda-facility-pocket.is-active
.pomosda-facility-pocket__slider::after {
    animation: s10m17OutlineFloat 9s ease-in-out infinite alternate;
}

@keyframes s10m17GoldFloat {
    from { translate: 0 0; scale: 1; }
    to { translate: 10px 8px; scale: 1.035; }
}

@keyframes s10m17OutlineFloat {
    from { translate: 0 0; rotate: 12deg; }
    to { translate: -10px -7px; rotate: 16deg; }
}

/* ---------------------------------------------------------
   MOBILE
   Reduce perpetual/depth motion; preserve entrance.
   --------------------------------------------------------- */

@media (max-width: 820px) {
    .pomosda-facilities-section.s10m17.is-s10m17-visible
    .pomosda-facility-card.is-active:not(.s10m17-hero-enter) img,
    .pomosda-facilities-section.s10m17.is-s10m17-visible
    .pomosda-facility-pocket.is-active
    .pomosda-facility-pocket__slider::before,
    .pomosda-facilities-section.s10m17.is-s10m17-visible
    .pomosda-facility-pocket.is-active
    .pomosda-facility-pocket__slider::after {
        animation: none !important;
    }

    .pomosda-facilities-section.s10m17
    .pomosda-facility-card.is-active.s10m17-hero-enter {
        animation-duration: 600ms;
    }
}

/* ---------------------------------------------------------
   ACCESSIBILITY
   --------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
    .pomosda-facilities-section.s10m17 *,
    .pomosda-facilities-section.s10m17 *::before,
    .pomosda-facilities-section.s10m17 *::after {
        animation: none !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }

    .pomosda-facilities-section.s10m17.s10m17-ready
    .pomosda-facilities-section__eyebrow,
    .pomosda-facilities-section.s10m17.s10m17-ready
    .pomosda-facilities-section__header h2,
    .pomosda-facilities-section.s10m17.s10m17-ready
    .pomosda-facilities-section__header p,
    .pomosda-facilities-section.s10m17.s10m17-ready
    .pomosda-facilities-tabs {
        opacity: 1 !important;
        translate: 0 !important;
    }
}