/* ===== Responsive Styles ===== */

@media screen and (max-width: 1024px) {
    .hero-title { font-size: 3rem; }
    .section-title { font-size: 2.4rem; }
    .section-title-dark { font-size: 2.2rem; }
    .split-text { padding: 40px 50px; }
    .section-left-content { max-width: 500px; padding: 0 40px; }

    /* Rooms Grid */
    .rooms-grid { gap: 24px; padding: 0 30px; }
    .room-carousel { aspect-ratio: 16/10; }
    .room-name { font-size: 1.2rem; }
    .room-price { font-size: 1.3rem; }
}

@media screen and (max-width: 768px) {
    /* Nav */
    .desktop-nav { display: none; }
    .nav-actions .lang-switch { display: none; }
    .nav-cta { display: none; }
    .hamburger { display: flex; }
    .top-nav { padding: 14px 20px; }
    .top-nav.scrolled { padding: 10px 20px; }
    .mobile-menu { padding: 20px; }
    .mobile-lang { margin-top: 10px; }

    /* Hero */
    .hero-title { font-size: 2.2rem; }
    .hero-sub { font-size: 0.8rem; letter-spacing: 4px; }
    .hero-btns { flex-direction: column; align-items: center; }
    .btn-primary, .btn-outline { width: 100%; max-width: 300px; text-align: center; }

    /* Sections */
    .section-title { font-size: 2rem; }
    #sec2 .section-title { font-size: 2.2rem; }
    .section-title-dark { font-size: 1.8rem; }
    .section-desc { font-size: 0.95rem; }
    .section-desc-dark { font-size: 0.95rem; }
    .section-label { font-size: 0.75rem; letter-spacing: 3px; }

    .section-center-content { padding-top: 80px; padding-bottom: 40px; }
    .section-bottom-content { bottom: 40px; padding: 0 20px; }
    .section-left-content {
        position: relative; top: auto; transform: none;
        max-width: 100%; padding: 40px 20px; text-align: center;
    }
    .section-full .section-left-content { 
        display: flex; flex-direction: column; align-items: center;
        justify-content: center;
    }

    /* Section 5 Pet Friendly - mobile overlay fix */
    #sec5 {
        display: flex; align-items: flex-end;
    }
    #sec5 .section-left-content {
        background: linear-gradient(to top, rgba(15,28,20,0.85) 0%, rgba(15,28,20,0.4) 80%, transparent 100%);
        padding: 40px 20px 60px;
        margin: 0;
    }
    #sec5 .overlay-gradient-left {
        background: linear-gradient(to top, rgba(15,28,20,0.7) 0%, rgba(15,28,20,0.2) 50%, transparent 100%);
    }

    /* Section 2 & Philosophy Cards */
    #sec2 .video-bg-wrapper { display: none; }
    #sec2MobileBg { 
        display: block; 
        background-image: url('../assets/images/sec2_custom_bg.jpg'); 
    }
    #sec2 .overlay-heavy { background: rgba(15, 28, 20, 0.2); }
    #sec2 .section-center-content { padding-top: 100px; padding-bottom: 100px; }
    #sec2 .section-title, #sec2 .section-desc { text-shadow: 0 2px 6px rgba(0,0,0,0.8); }
    .philosophy-cards { display: none; }
    .mobile-bg-caption {
        display: block;
        position: absolute;
        bottom: 20px;
        right: 20px;
        font-size: 0.85rem;
        color: rgba(255, 255, 255, 0.9);
        text-shadow: 0 2px 4px rgba(0,0,0,0.9);
        font-weight: 300;
        z-index: 10;
    }
    /* Section 4 Nature in Nature */
    .handdrawn-map { max-width: 100%; }
    .sec4-nature .section-center-content { padding: 0 16px; }

    /* Nature */
    .nature-features { flex-direction: column; }
    .nature-divider { width: 80px; height: 1px; }

    /* Split Section (Sauna Tour) */
    .section-split { flex-direction: column; }
    .split-img { min-height: 50vh; }
    .split-text { padding: 40px 20px; align-items: center; text-align: center; }
    .split-text .btn-dark { align-self: center; max-width: 100%; }

    /* Section 7 Room Reservation - mobile */
    .section-rooms { padding: 70px 0 60px; }
    .rooms-header { margin-bottom: 40px; padding: 0 20px; }
    .rooms-grid { grid-template-columns: 1fr; padding: 0 16px; gap: 20px; }
    .room-card-deluxe { grid-column: auto; flex-direction: column; }
    .room-card-deluxe .room-carousel { aspect-ratio: 16/10; min-height: auto; }
    .room-carousel { aspect-ratio: 16/10; }
    .carousel-btn { opacity: 1; width: 34px; height: 34px; font-size: 1.2rem; }
    .room-info { padding: 20px 20px 24px; }
    .room-name { font-size: 1.15rem; }
    .room-price { font-size: 1.3rem; }
    .room-name-price { flex-wrap: wrap; }

    /* 24 Hours Stay - mobile */
    .stay-24h-cards { flex-direction: column; align-items: center; }
    .stay-card { max-width: 100%; }
    .stay-example-box { padding: 14px 20px; }
    .stay-example-box p { font-size: 0.9rem; }

    /* Section 8 Gastronomy */
    .gastro-text-box { padding: 24px 20px; margin: 0 16px; }
    #sec8 .section-bottom-content { bottom: 60px; }

    /* Reviews */
    .section-reviews-vertical { padding: 60px 20px; }
    .reviews-vertical-container { max-height: 400px; }
    .review-card { padding: 24px; }
    .review-text { font-size: 0.9rem; }

    /* Contact Form */
    .contact-form { padding: 24px 16px; }
    .contact-form input { padding: 14px 16px; font-size: 1rem; }
    .hyatt-teaser { margin-top: 40px; padding: 20px 16px; }
    .hyatt-teaser p { font-size: 0.8rem; }

    /* Footer */
    .site-footer { padding: 40px 20px 20px; }
    .footer-inner { flex-direction: column; gap: 30px; }
    .mobile-only-br { display: inline; }
    .footer-ai-notice::before { content: ''; }

    /* Floating CTA - hide on mobile, use sticky bar instead */
    .floating-cta.desktop-float {
        display: none;
    }

    /* Mobile Sticky Bottom Bar */
    .mobile-sticky-bar {
        display: flex;
    }

    /* Add bottom padding to body so sticky bar doesn't cover content */
    body { padding-bottom: 56px; }

    /* Pet Trust Section - mobile */
    .section-pet-trust { padding: 60px 20px; }
    .pet-trust-cards { gap: 16px; }
    .trust-card {
        min-width: 100%;
        padding: 28px 24px;
    }
    .walking-trail-section { margin-top: 50px; padding-top: 40px; }
    .trail-title { font-size: 1.6rem; }
    .trail-desc { font-size: 0.9rem; }
    .trail-map-wrap { margin: 0 auto 24px; border-radius: var(--radius-sm); }
    .trail-info-cards {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }
    .trail-info-item { min-width: auto; padding: 14px 20px; flex-direction: column; text-align: center; }

    /* 24h stay - remove forced br on mobile */
    .stay-card p br { display: none; }

    /* Content padding */
    .hero-content, .section-center-content { padding: 0 20px; }

    /* YouTube video background mobile */
    .video-bg-wrapper iframe {
        width: 300vw; height: 300vh;
    }

    /* Modal mobile */
    .modal { padding: 30px 20px; }
    .modal h3 { font-size: 1.3rem; }

    /* Dog Paradise - mobile: 2-column grid */
    .section-dog-paradise { aspect-ratio: auto; padding: 80px 0 60px; }
    .dog-paradise-inner { padding: 0 16px; }
    .dog-carousel-wrap { display: block; }
    .dog-carousel-arrow { display: none; }
    .dog-carousel-viewport { overflow: visible; }
    .dog-carousel-track {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
        transform: none !important;
    }
    .dog-carousel-card {
        width: auto !important;
        flex: none;
        aspect-ratio: 1/1;
    }
    .dog-card-caption { font-size: 0.75rem; padding: 16px 10px 10px; }

    /* Dog Lightbox - mobile */
    .dog-lightbox-nav { width: 36px; height: 36px; font-size: 1.2rem; }
    .dog-lb-prev { left: 10px; }
    .dog-lb-next { right: 10px; }
}

@media screen and (max-width: 480px) {
    .hero-title { font-size: 1.8rem; }
    .section-title { font-size: 1.6rem; }
    #sec2 .section-title { font-size: 1.8rem; }
    .section-title-dark { font-size: 1.5rem; }
    .review-card { min-width: auto; max-width: 100%; }
    .nav-logo { font-size: 0.9rem; letter-spacing: 1px; }
    .room-name { font-size: 1.05rem; }
    .room-price { font-size: 1.2rem; }
    .room-copy { font-size: 0.85rem; }
    .room-specs { font-size: 0.78rem; gap: 10px; }
    .deluxe-event-badge { font-size: 0.78rem; padding: 6px 14px; }
    .phi-card { padding: 24px 20px; }
    .section-desc { font-size: 0.9rem; }
    .badge-michelin { font-size: 0.75rem; padding: 6px 14px; }
    .split-text { padding: 32px 16px; }
    .split-text .section-title-dark { font-size: 1.4rem; }
    .split-text .section-desc-dark { font-size: 0.9rem; }
    .btn-dark { padding: 12px 24px; font-size: 0.85rem; }

    /* Dog Paradise - small mobile */
    .dog-carousel-track { gap: 8px; }
    .dog-card-caption { font-size: 0.7rem; padding: 14px 8px 8px; }

    /* Pet Trust - small mobile */
    .section-pet-trust { padding: 48px 16px; }
    .trust-card { padding: 24px 20px; }
    .trust-icon { font-size: 2rem; }
    .trust-card h3 { font-size: 1rem; }
    .trust-card p { font-size: 0.82rem; }
    .trail-title { font-size: 1.4rem; }
    .trail-desc { font-size: 0.85rem; }
    .trail-info-item { padding: 12px 16px; }
    .trail-info-icon { font-size: 1.3rem; }
    .trail-info-item strong { font-size: 0.75rem; }
    .trail-info-item p { font-size: 0.82rem; }

    /* Sticky bar - small mobile */
    .sticky-btn { padding: 14px 0; font-size: 0.88rem; }
    .sticky-btn-icon { font-size: 1rem; }
}
