/* Premium frontend animation layer. Backend/admin logic is untouched. */
:root {
    --anim-ease: cubic-bezier(.2, .8, .2, 1);
    --anim-shadow: 0 22px 55px rgba(24, 50, 68, .14);
    --anim-border: rgba(11, 120, 182, .28);
}

html {
    scroll-behavior: smooth;
}

body {
    overflow-x: hidden;
}

.site-header {
    transition: box-shadow .28s ease, transform .28s ease, background-color .28s ease;
}

.site-header.header-scrolled {
    box-shadow: 0 14px 34px rgba(24, 50, 68, .1);
}

.hero-slide,
.page-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}

.hero-slide::before,
.hero-slide::after,
.page-hero::before,
.page-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    pointer-events: none;
    border-radius: 999px;
    opacity: .22;
    filter: blur(.2px);
}

.hero-slide::before,
.page-hero::before {
    width: 220px;
    height: 220px;
    right: 9%;
    top: 13%;
    border: 42px solid rgba(255, 255, 255, .2);
    animation: medicalFloat 9s var(--anim-ease) infinite alternate;
}

.hero-slide::after,
.page-hero::after {
    width: 340px;
    height: 82px;
    left: 48%;
    bottom: 16%;
    background: rgba(255, 255, 255, .14);
    box-shadow: -130px 0 0 rgba(255, 255, 255, .08), 0 -130px 0 rgba(255, 255, 255, .07);
    animation: medicalFloatSlow 12s var(--anim-ease) infinite alternate;
}

.carousel-item {
    transition: opacity .85s var(--anim-ease), transform .85s var(--anim-ease);
}

.carousel-item-next:not(.carousel-item-start),
.active.carousel-item-end {
    transform: translateX(26px);
    opacity: .25;
}

.carousel-item-prev:not(.carousel-item-end),
.active.carousel-item-start {
    transform: translateX(-26px);
    opacity: .25;
}

.hero-copy h1,
.hero-copy p,
.hero-actions {
    animation: heroFadeUp .82s var(--anim-ease) both;
}

.hero-copy p {
    animation-delay: .12s;
}

.hero-actions {
    animation-delay: .22s;
}

.btn {
    position: relative;
    overflow: hidden;
    transform: translateZ(0);
    transition: transform .22s var(--anim-ease), box-shadow .22s var(--anim-ease), border-color .22s ease, background-color .22s ease;
}

.btn:hover,
.btn:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(11, 120, 182, .2);
}

.btn-primary::after,
.btn-success::after,
.btn-danger::after,
.floating-call::after,
.floating-whatsapp::after {
    content: "";
    position: absolute;
    inset: -45% auto -45% -70%;
    width: 42%;
    transform: skewX(-18deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .34), transparent);
    opacity: 0;
    transition: left .7s var(--anim-ease), opacity .22s ease;
}

.btn-primary:hover::after,
.btn-success:hover::after,
.btn-danger:hover::after,
.floating-call:hover::after,
.floating-whatsapp:hover::after {
    left: 128%;
    opacity: 1;
}

.floating-call,
.floating-whatsapp {
    overflow: hidden;
    animation: subtlePulse 3.4s ease-in-out infinite;
}

.floating-whatsapp {
    animation-delay: .8s;
}

.quick-card,
.dept-card,
.doctor-card,
.service-card,
.package-card,
.post-card,
.review-card,
.job-card,
.contact-panel,
.contact-form-card {
    transition: transform .28s var(--anim-ease), box-shadow .28s var(--anim-ease), border-color .28s ease;
    will-change: transform;
}

.quick-card:hover,
.dept-card:hover,
.doctor-card:hover,
.service-card:hover,
.package-card:hover,
.post-card:hover,
.review-card:hover,
.job-card:hover,
.contact-panel:hover,
.contact-form-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--anim-shadow);
    border-color: var(--anim-border);
}

.doctor-card img,
.package-card img,
.gallery-item img,
.post-card img,
.service-card img,
.dept-card img {
    transition: transform .5s var(--anim-ease), filter .5s ease;
    will-change: transform;
}

.doctor-card:hover img,
.package-card:hover img,
.gallery-item:hover img,
.post-card:hover img,
.service-card:hover img,
.dept-card:hover img {
    transform: scale(1.04);
}

.package-media img,
.package-preview-media img {
    transform-origin: center;
}

.gallery-item a {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 8px;
}

.gallery-item a::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 45%, rgba(7, 89, 133, .34));
    opacity: 0;
    transition: opacity .3s ease;
    pointer-events: none;
}

.gallery-item a:hover::after {
    opacity: 1;
}

.stat-number {
    display: inline-block;
    transform-origin: left center;
}

.stat-number.counter-complete {
    animation: counterSettle .42s var(--anim-ease);
}

.js-animations-enabled .reveal-on-scroll {
    opacity: 0;
    transform: translate3d(0, 28px, 0);
    transition: opacity .72s var(--anim-ease), transform .72s var(--anim-ease);
    transition-delay: var(--reveal-delay, 0ms);
}

.js-animations-enabled .reveal-on-scroll.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.js-animations-enabled .reveal-soft {
    transform: translate3d(0, 18px, 0) scale(.985);
}

.js-animations-enabled .reveal-soft.is-visible {
    transform: translate3d(0, 0, 0) scale(1);
}

@keyframes heroFadeUp {
    from {
        opacity: 0;
        transform: translate3d(0, 26px, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes medicalFloat {
    from {
        transform: translate3d(0, 0, 0) rotate(0deg);
    }
    to {
        transform: translate3d(-18px, 22px, 0) rotate(8deg);
    }
}

@keyframes medicalFloatSlow {
    from {
        transform: translate3d(0, 0, 0) rotate(-1deg);
    }
    to {
        transform: translate3d(18px, -18px, 0) rotate(3deg);
    }
}

@keyframes subtlePulse {
    0%, 100% {
        box-shadow: 0 12px 30px rgba(0, 0, 0, .2);
    }
    50% {
        box-shadow: 0 12px 30px rgba(0, 0, 0, .2), 0 0 0 8px rgba(32, 177, 90, .08);
    }
}

@keyframes counterSettle {
    0% {
        transform: scale(.96);
    }
    55% {
        transform: scale(1.045);
    }
    100% {
        transform: scale(1);
    }
}

@media (max-width: 767px) {
    .hero-slide::before,
    .hero-slide::after,
    .page-hero::before,
    .page-hero::after {
        display: none;
    }

    .js-animations-enabled .reveal-on-scroll {
        transform: translate3d(0, 14px, 0);
        transition-duration: .52s;
    }

    .quick-card:hover,
    .dept-card:hover,
    .doctor-card:hover,
    .service-card:hover,
    .package-card:hover,
    .post-card:hover,
    .review-card:hover,
    .job-card:hover,
    .contact-panel:hover,
    .contact-form-card:hover {
        transform: translateY(-3px);
    }

    .floating-call,
    .floating-whatsapp {
        animation: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .001ms !important;
    }

    .js-animations-enabled .reveal-on-scroll {
        opacity: 1 !important;
        transform: none !important;
    }
}