/* Homepage motion system */
.home-page header .topbar {
    animation: homeHeaderDrop .55s ease-out both
}

.home-page header .navbar {
    animation: homeHeaderDrop .7s .08s ease-out both
}

@keyframes homeHeaderDrop {
    from {
        opacity: 0;
        transform: translateY(-18px)
    }
    to {
        opacity: 1;
        transform: translateY(0)
    }
}

.home-page .home-motion-ready .about-split>div:first-child,
.home-page .home-motion-ready .about-split>div:last-child,
.home-page .home-motion-ready .pilgrimage-section-heading,
.home-page .home-motion-ready .attraction-slider,
.home-page .home-motion-ready .live-darshan-panel,
.home-page .home-motion-ready .featured-sites-panel {
    opacity: 0;
    transition: opacity .75s ease, transform .75s cubic-bezier(.2, .75, .25, 1)
}

.home-page .home-motion-ready .about-split>div:first-child,
.home-page .home-motion-ready .live-darshan-panel {
    transform: translateX(-45px)
}

.home-page .home-motion-ready .about-split>div:last-child,
.home-page .home-motion-ready .featured-sites-panel {
    transform: translateX(45px)
}

.home-page .home-motion-ready .pilgrimage-section-heading,
.home-page .home-motion-ready .attraction-slider {
    transform: translateY(34px)
}

.home-page .home-motion-ready.is-visible .about-split>div:first-child,
.home-page .home-motion-ready.is-visible .about-split>div:last-child,
.home-page .home-motion-ready.is-visible .pilgrimage-section-heading,
.home-page .home-motion-ready.is-visible .attraction-slider,
.home-page .home-motion-ready.is-visible .live-darshan-panel,
.home-page .home-motion-ready.is-visible .featured-sites-panel {
    opacity: 1;
    transform: translate(0)
}

.home-page .home-motion-ready.is-visible .about-split>div:last-child,
.home-page .home-motion-ready.is-visible .attraction-slider,
.home-page .home-motion-ready.is-visible .featured-sites-panel {
    transition-delay: .15s
}

.home-page .home-motion-ready .about-heading-divider {
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .8s .35s cubic-bezier(.2, .75, .25, 1)
}

.home-page .home-motion-ready.is-visible .about-heading-divider {
    transform: scaleX(1)
}

.home-page .home-motion-ready .about-split li {
    opacity: 0;
    transform: translateX(-18px);
    transition: opacity .45s ease, transform .45s ease
}

.home-page .home-motion-ready.is-visible .about-split li {
    opacity: 1;
    transform: translateX(0)
}

.home-page .home-motion-ready.is-visible .about-split li:nth-child(1) {
    transition-delay: .38s
}

.home-page .home-motion-ready.is-visible .about-split li:nth-child(2) {
    transition-delay: .48s
}

.home-page .home-motion-ready.is-visible .about-split li:nth-child(3) {
    transition-delay: .58s
}

.home-page .home-motion-ready.is-visible .about-split li:nth-child(4) {
    transition-delay: .68s
}

.home-page .home-motion-ready .pilgrimage-section-heading h2::before,
.home-page .home-motion-ready .pilgrimage-section-heading h2::after {
    transform: scaleX(0);
    transition: transform .8s .3s ease
}

.home-page .home-motion-ready .pilgrimage-section-heading h2::before {
    transform-origin: right center
}

.home-page .home-motion-ready .pilgrimage-section-heading h2::after {
    transform-origin: left center
}

.home-page .home-motion-ready.is-visible .pilgrimage-section-heading h2::before,
.home-page .home-motion-ready.is-visible .pilgrimage-section-heading h2::after {
    transform: scaleX(1)
}

.home-page .about-split img,
.home-page .attraction-card,
.home-page .live-darshan-video,
.home-page .pilgrimage-featured-carousel,
.home-page .pilgrimage-thumbnail {
    transition: transform .4s cubic-bezier(.2, .75, .25, 1), box-shadow .4s ease, border-color .3s ease
}

.home-page .about-split img:hover {
    transform: scale(1.025)
}

.home-page .attraction-card:hover {
    border-color: #e5a77a;
    box-shadow: 0 16px 30px rgba(83, 39, 15, .16);
    transform: translateY(-8px)
}

.home-page .attraction-card .attraction-photo {
    transition: transform .55s cubic-bezier(.2, .75, .25, 1)
}

.home-page .attraction-card:hover .attraction-photo {
    transform: scale(1.055)
}

.home-page .live-darshan-video:hover,
.home-page .pilgrimage-featured-carousel:hover {
    box-shadow: 0 24px 50px rgba(0, 0, 0, .28);
    transform: translateY(-5px)
}

.home-page .live-play-button {
    animation: homePlayPulse 2.2s ease-in-out infinite
}

@keyframes homePlayPulse {
    0%, 100% {
        box-shadow: 0 0 0 10px rgba(255, 255, 255, .12)
    }
    50% {
        box-shadow: 0 0 0 18px rgba(255, 255, 255, 0)
    }
}

.home-page .feature-heading h2::after {
    transform-origin: left center;
    animation: homeAccentDraw 1.2s ease both
}

@keyframes homeAccentDraw {
    from {
        transform: scaleX(0)
    }
    to {
        transform: scaleX(1)
    }
}

.home-page .btn,
.home-page .attraction-control,
.home-page .carousel-control-prev,
.home-page .carousel-control-next {
    transition: transform .25s ease, box-shadow .25s ease, color .25s ease, background-color .25s ease
}

.home-page .btn:hover,
.home-page .attraction-control:hover,
.home-page .carousel-control-prev:hover,
.home-page .carousel-control-next:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(66, 28, 10, .18)
}

.home-page .attraction-control:hover {
    transform: translateY(calc(-50% - 3px))
}

.home-page .home-motion-ready.motion-complete .about-split>div,
.home-page .home-motion-ready.motion-complete .pilgrimage-section-heading,
.home-page .home-motion-ready.motion-complete .attraction-slider,
.home-page .home-motion-ready.motion-complete .live-darshan-panel,
.home-page .home-motion-ready.motion-complete .featured-sites-panel,
.home-page .home-motion-ready.motion-complete .about-split li {
    transition-delay: 0s
}

@media(max-width:767.98px) {
    .home-page .home-motion-ready .about-split>div:first-child,
    .home-page .home-motion-ready .about-split>div:last-child,
    .home-page .home-motion-ready .live-darshan-panel,
    .home-page .home-motion-ready .featured-sites-panel {
        transform: translateY(30px)
    }

    .home-page .home-motion-ready.is-visible .about-split>div:first-child,
    .home-page .home-motion-ready.is-visible .about-split>div:last-child,
    .home-page .home-motion-ready.is-visible .live-darshan-panel,
    .home-page .home-motion-ready.is-visible .featured-sites-panel {
        transform: translateY(0)
    }
}

@media(prefers-reduced-motion:reduce) {
    .home-page header .topbar,
    .home-page header .navbar,
    .home-page .live-play-button,
    .home-page .feature-heading h2::after {
        animation: none
    }

    .home-page .home-motion-ready *,
    .home-page .home-motion-ready *::before,
    .home-page .home-motion-ready *::after {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important
    }
}

/* Heritage-inspired homepage colour rhythm and restrained ambient motion. */
.home-page main {
    background: #fffaf5
}

.home-page main>.about-leaders,
.home-page main>.updates-highlights-section,
.home-page main>.mela-attractions-section,
.home-page main>.home-leaders-showcase,
.home-page main>.social-feed-section,
.home-page main>.compact-section {
    position: relative;
    isolation: isolate;
    overflow: hidden
}

.home-page main>.about-leaders>.container,
.home-page main>.updates-highlights-section>.container,
.home-page main>.mela-attractions-section>.container,
.home-page main>.home-leaders-showcase>.container,
.home-page main>.social-feed-section>.container,
.home-page main>.compact-section>.container {
    position: relative;
    z-index: 1
}

.home-page main>.about-leaders {
    background:
        radial-gradient(circle at 88% 18%, rgba(218, 118, 40, .16), transparent 27%),
        radial-gradient(circle at 8% 82%, rgba(119, 35, 22, .08), transparent 30%),
        linear-gradient(120deg, #fffaf4 0%, #fff3e5 52%, #f9eee5 100%)
}

.home-page main>.home-priority-updates {
    background:
        radial-gradient(circle at 8% 8%, rgba(203, 73, 20, .08), transparent 24%),
        radial-gradient(circle at 93% 90%, rgba(24, 88, 101, .11), transparent 28%),
        linear-gradient(145deg, #f3f8f6 0%, #e5f0ef 52%, #edf4f2 100%)
}

.home-page main>.mela-attractions-section {
    background:
        radial-gradient(circle at 86% 16%, rgba(216, 119, 37, .11), transparent 23%),
        radial-gradient(circle at 12% 86%, rgba(17, 56, 81, .08), transparent 24%),
        linear-gradient(135deg, #fffdf9 0%, #f7f2eb 55%, #eef4f3 100%)
}

.home-page main>.home-leaders-showcase {
    background:
        radial-gradient(circle at 16% 30%, rgba(203, 83, 25, .12), transparent 23%),
        linear-gradient(125deg, #f8eee5, #fff9f3 48%, #f2e7de)
}

.home-page main>.social-feed-section {
    background:
        radial-gradient(circle at 6% 12%, rgba(211, 84, 29, .08), transparent 22%),
        radial-gradient(circle at 94% 88%, rgba(23, 76, 102, .12), transparent 26%),
        linear-gradient(140deg, #f2f7f8 0%, #e8f1f2 52%, #f4f7f4 100%)
}

.home-page #main-content>.compact-section {
    background-image:
        radial-gradient(circle at 92% 20%, rgba(17, 74, 101, .11), transparent 26%),
        radial-gradient(circle at 10% 84%, rgba(211, 84, 29, .1), transparent 24%),
        linear-gradient(130deg, #f6faf9 0%, #fffaf3 55%, #f2f6f5 100%) !important;
    background-color: #f6faf9
}

.home-page main>.home-highlights-section {
    background:
        radial-gradient(circle at 12% 0%, rgba(255, 181, 112, .2), transparent 28%),
        linear-gradient(120deg, #5c1b15 0%, #7d2b1b 52%, #4d1713 100%)
}

.home-page main>.about-leaders::before,
.home-page main>.compact-section::before {
    content: "";
    position: absolute;
    z-index: 0;
    width: 270px;
    height: 270px;
    border: 1px solid rgba(183, 79, 29, .13);
    border-radius: 50%;
    background: repeating-radial-gradient(circle, transparent 0 18px, rgba(191, 87, 34, .045) 19px 20px);
    pointer-events: none;
    animation: homeAmbientFloat 13s ease-in-out infinite alternate
}

.home-page main>.about-leaders::before {
    top: -105px;
    right: -70px
}

.home-page main>.compact-section::before {
    bottom: -125px;
    left: -65px;
    animation-delay: -5s
}

@keyframes homeAmbientFloat {
    from {
        transform: translate3d(0, 0, 0) rotate(0deg)
    }
    to {
        transform: translate3d(-18px, 14px, 0) rotate(7deg)
    }
}

.home-page .home-motion-ready .mela-attractions-heading,
.home-page .home-motion-ready .social-feed-heading,
.home-page .compact-section.home-motion-ready .pilgrimage-section-heading,
.home-page .home-motion-ready .mela-attraction-card,
.home-page .home-motion-ready .social-feed-card,
.home-page .compact-section.home-motion-ready .attraction-card {
    opacity: 0;
    transform: translateY(26px);
    transition: opacity .62s ease, transform .62s cubic-bezier(.2, .75, .25, 1)
}

.home-page .home-motion-ready.is-visible .mela-attractions-heading,
.home-page .home-motion-ready.is-visible .social-feed-heading,
.home-page .compact-section.home-motion-ready.is-visible .pilgrimage-section-heading,
.home-page .home-motion-ready.is-visible .mela-attraction-card,
.home-page .home-motion-ready.is-visible .social-feed-card,
.home-page .compact-section.home-motion-ready.is-visible .attraction-card {
    opacity: 1;
    transform: translateY(0)
}

.home-page .home-motion-ready.is-visible .mela-attraction-card:nth-child(2),
.home-page .home-motion-ready.is-visible .social-feed-card:nth-child(2),
.home-page .compact-section.home-motion-ready.is-visible .attraction-card:nth-child(2) {
    transition-delay: .08s
}

.home-page .home-motion-ready.is-visible .mela-attraction-card:nth-child(3),
.home-page .home-motion-ready.is-visible .social-feed-card:nth-child(3),
.home-page .compact-section.home-motion-ready.is-visible .attraction-card:nth-child(3) {
    transition-delay: .16s
}

.home-page .home-motion-ready.is-visible .mela-attraction-card:nth-child(4),
.home-page .compact-section.home-motion-ready.is-visible .attraction-card:nth-child(4) {
    transition-delay: .24s
}

.home-page .home-hero-quicklinks-inner>a,
.home-page .announcement-item,
.home-page .highlight-stat,
.home-page .social-feed-card {
    transition: transform .3s cubic-bezier(.2, .75, .25, 1), box-shadow .3s ease, border-color .3s ease
}

.home-page .home-hero-quicklinks-inner>a:hover,
.home-page .announcement-item:hover,
.home-page .highlight-stat:hover {
    transform: translateY(-5px)
}

@media(prefers-reduced-motion:reduce) {
    .home-page main>.about-leaders::before,
    .home-page main>.compact-section::before {
        animation: none
    }
}
