/* =========================================================
   AADAR SATKAR — CONTROLLED BRAND FILM FIX V2
   Only the approved hero film is affected.
   Cards, page sections, enquiry bar and layout are untouched.
   ========================================================= */
.as-brand-film-hero .as-hero-media,
.as-brand-film-hero .as-hero-video-stack {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    min-width: 100%;
    min-height: 100%;
    overflow: hidden;
    contain: layout paint;
    background: #020a13;
}

.as-brand-film-hero .as-hero-video-slide {
    display: block;
    inset: 0;
    width: 100%;
    height: 100%;
    min-width: 100%;
    min-height: 100%;
    max-width: none;
    max-height: none;
    object-fit: cover;
    object-position: center 46%;
    opacity: 0;
    filter: saturate(1.12) contrast(1.13) brightness(.96);
    transform: translate3d(0,0,0) scale(1.012);
    transform-origin: center center;
    backface-visibility: hidden;
    transition: opacity 1.4s cubic-bezier(.42,0,.18,1);
    will-change: opacity;
}

.as-brand-film-hero .as-hero-video-slide.is-preparing {
    opacity: 0;
    visibility: visible;
}

.as-brand-film-hero .as-hero-video-slide.is-active {
    opacity: 1;
    visibility: visible;
}

.as-brand-film-hero .as-hero-video-slide.is-leaving {
    opacity: 0;
    visibility: visible;
}

.as-brand-film-hero .as-hero-shade {
    background:
        linear-gradient(90deg,
            rgba(2,10,19,.86) 0%,
            rgba(2,10,19,.65) 31%,
            rgba(2,10,19,.22) 60%,
            rgba(2,10,19,.06) 100%),
        linear-gradient(180deg,
            rgba(2,10,19,.06) 0%,
            rgba(2,10,19,.08) 48%,
            rgba(2,10,19,.56) 100%);
}

.as-brand-film-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 96px 0 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 67% 42%, transparent 0 32%, rgba(0,0,0,.09) 74%, rgba(0,0,0,.25) 100%),
        linear-gradient(180deg, rgba(239,197,93,.04), transparent 30%);
}

.as-brand-film-hero .as-film-content .as-eyebrow,
.as-brand-film-hero .as-film-content h1,
.as-brand-film-hero .as-film-content .as-hero-subtitle {
    text-shadow: 0 5px 14px rgba(0,0,0,.72), 0 16px 38px rgba(0,0,0,.46);
}

/* Event title only: Medical Tourism, Destination Weddings, Corporate & MICE, etc. */
.as-brand-film-hero .as-film-content .as-eyebrow {
    font-size: clamp(1.05rem, 1.45vw, 1.35rem);
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: .065em;
}

/* Keep the main service tagline/headline unchanged. */
.as-brand-film-hero .as-film-content h1 {
    font-size: clamp(3.2rem, 5.15vw, 6rem);
}

/* Only the descriptive sentence is made slightly larger and clearer. */
.as-brand-film-hero .as-film-content .as-hero-subtitle {
    font-size: clamp(1.08rem, 1.48vw, 1.32rem);
    line-height: 1.55;
    font-weight: 500;
}

.as-brand-film-hero .as-film-photo,
.as-brand-film-hero .as-film-photo img {
    backface-visibility: hidden;
    transform: translateZ(0);
}

.as-brand-film-hero .as-film-photo {
    will-change: opacity, transform;
}

/* Finale timing: Join -> Explore Beyond Destinations -> large cinematic logo. */
.as-brand-film-hero .as-film-beyond {
    font-size: clamp(1.45rem, 2.55vw, 2.75rem);
    letter-spacing: .07em;
}

.as-brand-film-hero .as-film-final-logo {
    width: min(960px, 88vw);
    max-height: 360px;
    margin-top: 0;
    object-fit: contain;
    background: transparent;
    filter:
        drop-shadow(0 24px 44px rgba(0,0,0,.55))
        drop-shadow(0 0 28px rgba(232,184,68,.16));
}

.as-brand-film-hero.is-brand-finale .as-film-join,
.as-brand-film-hero.is-brand-finale .as-film-beyond,
.as-brand-film-hero.is-brand-finale .as-film-final-logo {
    animation-duration: 9.6s;
}

.as-brand-film-hero.is-brand-finale .as-film-join {
    animation-name: asFinalJoinV2;
}

.as-brand-film-hero.is-brand-finale .as-film-beyond {
    animation-name: asFinalBeyondV2;
}

.as-brand-film-hero.is-brand-finale .as-film-final-logo {
    animation-name: asFinalLogoV2;
}

@keyframes asFinalJoinV2 {
    0%, 4% { opacity: 0; transform: translateY(24px) scale(.98); }
    13%, 30% { opacity: 1; transform: translateY(0) scale(1); }
    39%, 100% { opacity: 0; transform: translateY(-14px) scale(1.015); }
}

@keyframes asFinalBeyondV2 {
    0%, 24% { opacity: 0; transform: translateY(22px) scale(.96); }
    36%, 55% { opacity: 1; transform: translateY(0) scale(1); }
    64%, 100% { opacity: 0; transform: translateY(-12px) scale(1.025); }
}

@keyframes asFinalLogoV2 {
    0%, 53% { opacity: 0; transform: scale(.66); filter: blur(5px); }
    66% { opacity: .82; transform: scale(.82); filter: blur(1px); }
    82% { opacity: 1; transform: scale(1.02); filter: blur(0); }
    100% { opacity: 1; transform: scale(1.13); filter: blur(0); }
}

@media (max-width: 767px) {
    .as-brand-film-hero .as-hero-video-slide {
        object-position: 58% center;
        filter: saturate(1.09) contrast(1.10) brightness(.93);
    }

    .as-brand-film-hero .as-film-content .as-eyebrow {
        font-size: 1rem;
    }

    .as-brand-film-hero .as-film-content .as-hero-subtitle {
        font-size: 1rem;
    }

    .as-brand-film-hero .as-film-final-logo {
        width: 94vw;
        max-height: 250px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .as-brand-film-hero.is-brand-finale .as-film-join,
    .as-brand-film-hero.is-brand-finale .as-film-beyond,
    .as-brand-film-hero.is-brand-finale .as-film-final-logo {
        animation-duration: 1ms !important;
        animation-delay: 0s !important;
    }
}

/* =========================================================
   V2.1 — TWO APPROVED MICRO FIXES ONLY
   1) Wedding photos remain sharp and proportionate.
   2) Final logo reveal uses GPU-friendly opacity/scale only.
   ========================================================= */
.as-brand-film-hero .as-film-photo {
    contain: layout paint;
}

.as-brand-film-hero .as-film-photo img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center 34%;
    image-rendering: auto;
}

.as-brand-film-hero .as-film-final-logo {
    filter: none;
    backface-visibility: hidden;
    transform: translate3d(0, 0, 0) scale(.86);
    transform-origin: center center;
    will-change: transform, opacity;
    contain: paint;
}

.as-brand-film-hero.is-brand-finale .as-film-final-logo {
    animation-name: asFinalLogoV21;
    animation-duration: 9.6s;
    animation-timing-function: cubic-bezier(.22,.61,.36,1);
    animation-fill-mode: both;
}

@keyframes asFinalLogoV21 {
    0%, 56% {
        opacity: 0;
        transform: translate3d(0, 18px, 0) scale(.86);
    }
    68% {
        opacity: .55;
        transform: translate3d(0, 8px, 0) scale(.93);
    }
    84% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1.02);
    }
    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1.10);
    }
}


/* =========================================================
   V2.1.1 — TWO MICRO FIXES ONLY
   1) First-scene supporting photos use reliable local assets.
   2) Final logo reveal is moderate, sharp and GPU-friendly.
   No video, card, layout or enquiry-bar rules are changed.
   ========================================================= */
.as-brand-film-hero .as-film-final-logo {
    width: min(760px, 78vw);
    max-height: 270px;
    image-rendering: auto;
    transform: translate3d(0, 10px, 0) scale(.96);
    will-change: opacity, transform;
}

.as-brand-film-hero.is-brand-finale .as-film-final-logo {
    animation-name: asFinalLogoV211;
    animation-duration: 9.6s;
    animation-timing-function: cubic-bezier(.22,.61,.36,1);
    animation-fill-mode: both;
}

@keyframes asFinalLogoV211 {
    0%, 58% {
        opacity: 0;
        transform: translate3d(0, 10px, 0) scale(.96);
    }
    72% {
        opacity: .72;
        transform: translate3d(0, 4px, 0) scale(.985);
    }
    86%, 100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1.02);
    }
}

@media (max-width: 767px) {
    .as-brand-film-hero .as-film-final-logo {
        width: min(620px, 88vw);
        max-height: 220px;
    }
}