/* =========================================
   HOTEL SNOWLION — GLOBAL ANIMATIONS
========================================= */

html {
    scroll-behavior: smooth;
}

/* ---------- Base reveal state ---------- */

[data-reveal] {
    opacity: 0;
    transform: translateY(28px);
    transition:
        opacity 0.75s ease,
        transform 0.75s ease;
    will-change: opacity, transform;
}

[data-reveal="left"] {
    transform: translateX(-36px);
}

[data-reveal="right"] {
    transform: translateX(36px);
}

[data-reveal="zoom"] {
    transform: scale(0.94);
}

[data-reveal].is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
}


/* ---------- Stagger support ---------- */

[data-delay="1"] {
    transition-delay: 0.08s;
}

[data-delay="2"] {
    transition-delay: 0.16s;
}

[data-delay="3"] {
    transition-delay: 0.24s;
}

[data-delay="4"] {
    transition-delay: 0.32s;
}

[data-delay="5"] {
    transition-delay: 0.40s;
}

[data-delay="6"] {
    transition-delay: 0.48s;
}


/* =========================================
   HERO
========================================= */

.hero,
.page-hero {
    overflow: hidden;
}

.hero::before,
.page-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.hero {
    animation: heroBackgroundEntrance 1.1s ease both;
}

.hero-content > *,
.page-hero-content > * {
    opacity: 0;
    transform: translateY(24px);
    animation: heroContentUp 0.8s ease forwards;
}

.hero-content > *:nth-child(1),
.page-hero-content > *:nth-child(1) {
    animation-delay: 0.12s;
}

.hero-content > *:nth-child(2),
.page-hero-content > *:nth-child(2) {
    animation-delay: 0.24s;
}

.hero-content > *:nth-child(3),
.page-hero-content > *:nth-child(3) {
    animation-delay: 0.36s;
}

.hero-content > *:nth-child(4),
.page-hero-content > *:nth-child(4) {
    animation-delay: 0.48s;
}

.hero-content > *:nth-child(5),
.page-hero-content > *:nth-child(5) {
    animation-delay: 0.60s;
}

@keyframes heroContentUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes heroBackgroundEntrance {
    from {
        filter: brightness(0.85);
    }

    to {
        filter: brightness(1);
    }
}


/* =========================================
   NAVBAR
========================================= */

.site-header {
    animation: navbarDrop 0.75s ease both;
}

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

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.main-nav a,
.nav-contact,
.brand {
    transition:
        transform 0.25s ease,
        opacity 0.25s ease,
        color 0.25s ease,
        background-color 0.25s ease;
}

.main-nav a:hover {
    transform: translateY(-2px);
}


/* =========================================
   BUTTONS
========================================= */

.btn,
.samdo-whatsapp-btn,
.samdo-call-btn {
    position: relative;
    overflow: hidden;
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        background-color 0.25s ease,
        color 0.25s ease,
        border-color 0.25s ease;
}

.btn:hover,
.samdo-whatsapp-btn:hover,
.samdo-call-btn:hover {
    transform: translateY(-3px);
}

.btn:active,
.samdo-whatsapp-btn:active,
.samdo-call-btn:active {
    transform: translateY(0) scale(0.98);
}


/* =========================================
   IMAGES
========================================= */

.welcome-image,
.rooms-intro-image,
.dining-page-image,
.about-story-image,
.about-hospitality-image,
.host-image,
.samdo-intro-image,
.samdo-stay-image,
.contact-location-image,
.gallery-item,
.gallery-card {
    overflow: hidden;
}

.welcome-image img,
.rooms-intro-image img,
.dining-page-image img,
.about-story-image img,
.about-hospitality-image img,
.host-image img,
.samdo-intro-image img,
.samdo-stay-image img,
.contact-location-image img,
.gallery-item img,
.gallery-card img {
    transition:
        transform 0.75s cubic-bezier(.2,.7,.2,1),
        filter 0.5s ease;
}

.welcome-image:hover img,
.rooms-intro-image:hover img,
.dining-page-image:hover img,
.about-story-image:hover img,
.about-hospitality-image:hover img,
.host-image:hover img,
.samdo-intro-image:hover img,
.samdo-stay-image:hover img,
.gallery-item:hover img,
.gallery-card:hover img {
    transform: scale(1.035);
}


/* =========================================
   CARDS
========================================= */

.fact-item,
.room-feature-card,
.about-fact-card,
.samdo-experience-card,
.contact-method-card {
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease;
}

.fact-item:hover,
.room-feature-card:hover,
.about-fact-card:hover,
.samdo-experience-card:hover,
.contact-method-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.08);
}


/* =========================================
   TEXT LINKS
========================================= */

.text-link {
    display: inline-block;
    transition:
        transform 0.25s ease,
        color 0.25s ease;
}

.text-link:hover {
    transform: translateX(5px);
}


/* =========================================
   FOOTER
========================================= */

.site-footer a {
    transition:
        transform 0.2s ease,
        color 0.2s ease;
}

.site-footer a:hover {
    transform: translateX(4px);
}


/* =========================================
   MOBILE MENU
========================================= */

.menu-toggle {
    transition:
        transform 0.3s ease,
        background-color 0.3s ease;
}

.menu-toggle.is-active {
    transform: rotate(90deg);
}


/* =========================================
   ACCESSIBILITY
========================================= */

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        transition-delay: 0ms !important;
    }

    [data-reveal] {
        opacity: 1 !important;
        transform: none !important;
    }
}

/* =========================================
   SUBTLE ANIMATION POLISH
========================================= */

[data-reveal] {
    transition:
        opacity 0.65s ease,
        transform 0.65s ease;
}

[data-reveal="left"] {
    transform: translateX(-24px);
}

[data-reveal="right"] {
    transform: translateX(24px);
}

[data-reveal="zoom"] {
    transform: scale(0.97);
}

[data-reveal].is-visible {
    opacity: 1;
    transform: translate(0, 0) scale(1);
}


/* Gentle image hover */

.welcome-image img,
.rooms-intro-image img,
.dining-page-image img,
.about-story-image img,
.about-hospitality-image img,
.host-image img,
.samdo-intro-image img,
.samdo-stay-image img,
.gallery-card img,
.gallery-item img {
    transition: transform 0.55s ease;
}

@media (hover: hover) {
    .welcome-image:hover img,
    .rooms-intro-image:hover img,
    .dining-page-image:hover img,
    .about-story-image:hover img,
    .about-hospitality-image:hover img,
    .host-image:hover img,
    .samdo-intro-image:hover img,
    .samdo-stay-image:hover img,
    .gallery-card:hover img,
    .gallery-item:hover img {
        transform: scale(1.025);
    }
}


/* Subtle card hover */

.room-feature-card,
.about-fact-card,
.samdo-experience-card,
.contact-method-card,
.facility-card {
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

@media (hover: hover) {
    .room-feature-card:hover,
    .about-fact-card:hover,
    .samdo-experience-card:hover,
    .contact-method-card:hover,
    .facility-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 14px 34px rgba(0, 0, 0, 0.07);
    }
}


/* Keep mobile simple */

@media (max-width: 640px) {
    [data-reveal="left"],
    [data-reveal="right"] {
        transform: translateY(20px);
    }
}


/* Accessibility */

@media (prefers-reduced-motion: reduce) {
    [data-reveal] {
        opacity: 1 !important;
        transform: none !important;
    }
}