:root {
        --gold: #c8a05c;
        --dark-gold: #b8924d;
        --light-gold: #d4b06f;
        --charcoal: #3a3a3a;
        --dark-gray: #2a2a2a;
        --light-gray: #e8e6e1;
        --white: #ffffff;
    }
    
    *{box-sizing:border-box;margin:0;padding:0;}
    
    body{
        font-family:'Poppins', sans-serif;
        color:var(--charcoal);
        line-height:1.6;
        background:var(--light-gray);
        overflow-x:hidden;
    }
    
    .container{max-width:1200px;margin:0 auto;padding:15px;}
    
    /* Elegant Header */
    header{
        display:flex;
        justify-content:space-between;
        align-items:center;
        padding:20px 15px;
        background:rgba(255,255,255,0.98);
        backdrop-filter:blur(10px);
        position:sticky;
        top:0;
        z-index:100;
        box-shadow:0 8px 32px rgba(58,58,58,0.1);
        animation:slideDown 0.5s ease;
        border-bottom:2px solid var(--gold);
    }
    
    @keyframes slideDown{
        from{transform:translateY(-100%);opacity:0;}
        to{transform:translateY(0);opacity:1;}
    }
    
    .logo-container{
        display:flex;
        align-items:center;
        gap:12px;
    }
    
    .logo-img{
        width: 45px;
        max-width: 45px;
        height: 45px;
        max-height: 45px;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        flex-shrink: 0;
        box-sizing: border-box;
    }

    .logo-img img{
        width: 100% !important;
        max-width: 100% !important;
        height: 100% !important;
        max-height: 100% !important;
        object-fit: cover;
        display: block;
    }
    
    .logo{
        font-size:20px;
        background:linear-gradient(135deg, var(--gold) 0%, var(--dark-gold) 100%);
        -webkit-background-clip:text;
        -webkit-text-fill-color:transparent;
        background-clip:text;
        font-weight:800;
        text-decoration:none;
        transition:transform 0.3s;
        letter-spacing:-0.5px;
        white-space: nowrap;
    }
    
    .logo:hover{transform:scale(1.05);}
    
    /* Mobile Menu */
    .menu-toggle{
        display:none;
        flex-direction:column;
        gap:5px;
        cursor:pointer;
        padding:5px;
    }
    
    .menu-toggle span{
        width:25px;
        height:3px;
        background:var(--gold);
        transition:all 0.3s;
        border-radius:2px;
    }
    
    .menu-toggle.active span:nth-child(1){
        transform:rotate(45deg) translate(7px, 7px);
    }
    
    .menu-toggle.active span:nth-child(2){
        opacity:0;
    }
    
    .menu-toggle.active span:nth-child(3){
        transform:rotate(-45deg) translate(7px, -7px);
    }
    
    nav{
        display:flex;
        gap:30px;
    }
    
    nav a{
        text-decoration:none;
        color:var(--charcoal);
        font-weight:600;
        position:relative;
        transition:color 0.3s;
        text-transform:uppercase;
        font-size:0.85rem;
        letter-spacing:0.5px;
    }
    
    nav a::after{
        content:'';
        position:absolute;
        bottom:-5px;
        left:0;
        width:0;
        height:2px;
        background:linear-gradient(135deg, var(--gold) 0%, var(--dark-gold) 100%);
        transition:width 0.3s;
    }
    
    nav a:hover{color:var(--gold);}
    nav a:hover::after{width:100%;}
    
    /* Luxury Hero Section */
    #intro{
        padding:50px 20px;
        text-align:center;
        background:linear-gradient(135deg, var(--charcoal) 0%, var(--dark-gray) 50%, var(--charcoal) 100%);
        color:white;
        border-radius:20px;
        margin-bottom:40px;
        box-shadow:0 20px 60px rgba(58,58,58,0.4);
        position:relative;
        overflow:hidden;
    }
    
    #intro::before{
        content:'';
        position:absolute;
        top:0;
        left:0;
        right:0;
        height:3px;
        background:linear-gradient(90deg, transparent, var(--gold), transparent);
        animation:shimmer 3s infinite;
    }
    
    @keyframes shimmer{
        0%{transform:translateX(-100%);}
        100%{transform:translateX(100%);}
    }
    
    #intro::after{
        content:'';
        position:absolute;
        top:-50%;
        left:-50%;
        width:200%;
        height:200%;
        background:radial-gradient(circle, rgba(200,160,92,0.1) 0%, transparent 70%);
        animation:rotate 25s linear infinite;
    }
    
    @keyframes rotate{
        from{transform:rotate(0deg);}
        to{transform:rotate(360deg);}
    }
    
    #intro h1{
        font-size:2.2rem;
        margin-bottom:20px;
        animation:fadeInUp 0.8s ease;
        position:relative;
        z-index:1;
        font-weight:800;
        letter-spacing:-1px;
        line-height:1.2;
    }
    
    #intro h1 span{
        background:linear-gradient(135deg, var(--gold) 0%, var(--light-gold) 100%);
        -webkit-background-clip:text;
        -webkit-text-fill-color:transparent;
        background-clip:text;
    }
    
    #intro p{
        font-size:1rem;
        max-width:800px;
        margin:0 auto;
        animation:fadeInUp 1s ease;
        position:relative;
        z-index:1;
        font-weight:300;
        line-height:1.8;
    }
    
    @keyframes fadeInUp{
        from{opacity:0;transform:translateY(30px);}
        to{opacity:1;transform:translateY(0);}
    }
    
    /* Enhanced Elegant Filters */
    .filters{
        background:white;
        padding:25px 20px;
        border-radius:20px;
        box-shadow:0 10px 40px rgba(58,58,58,0.1);
        margin-bottom:35px;
        animation:fadeIn 1.4s ease;
        border:1px solid rgba(200,160,92,0.2);
    }
    
    @keyframes fadeIn{
        from{opacity:0;}
        to{opacity:1;}
    }
    
    .filters-header{
        display:flex;
        align-items:center;
        gap:12px;
        margin-bottom:20px;
        justify-content:center;
    }
    
    .filters-icon{
        font-size:22px;
    }
    
    .filters-title{
        font-weight:700;
        font-size:1.1rem;
        background:linear-gradient(135deg, var(--gold) 0%, var(--dark-gold) 100%);
        -webkit-background-clip:text;
        -webkit-text-fill-color:transparent;
        background-clip:text;
    }
    
    .filters-buttons{
        display:flex;
        flex-wrap:wrap;
        gap:10px;
        justify-content:center;
    }
    
    .filter-btn{
        background:white;
        border:2px solid rgba(200,160,92,0.3);
        padding:10px 20px;
        border-radius:25px;
        cursor:pointer;
        transition:all 0.3s;
        font-weight:600;
        font-family:'Poppins', sans-serif;
        color:var(--charcoal);
        font-size:0.85rem;
    }
    
    .filter-btn:hover{
        transform:translateY(-2px);
        box-shadow:0 4px 15px rgba(200,160,92,0.2);
        border-color:var(--gold);
    }
    
    .filter-btn.active{
        background:linear-gradient(135deg, var(--gold) 0%, var(--dark-gold) 100%);
        color:white;
        border-color:transparent;
        box-shadow:0 4px 20px rgba(200,160,92,0.4);
    }
    
    /* Premium Grid */
    .grid{
        display:grid;
        grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
        gap:20px;
        margin-top:30px;
    }
    
    .card{
        background:#fff;
        border-radius:20px;
        overflow:hidden;
        box-shadow:0 10px 40px rgba(58,58,58,0.1);
        transition:all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        animation:cardAppear 0.6s ease backwards;
        position:relative;
        border:1px solid rgba(200,160,92,0.1);
    }
    
    .card:nth-child(1){animation-delay:0.1s;}
    .card:nth-child(2){animation-delay:0.2s;}
    .card:nth-child(3){animation-delay:0.3s;}
    
    @keyframes cardAppear{
        from{opacity:0;transform:translateY(50px) scale(0.9);}
        to{opacity:1;transform:translateY(0) scale(1);}
    }
    
    .card:hover{
        transform:translateY(-15px);
        box-shadow:0 25px 60px rgba(58,58,58,0.2);
    }
    
    .card::before{
        content:'';
        position:absolute;
        top:0;
        left:0;
        right:0;
        height:4px;
        background:linear-gradient(90deg, var(--gold), var(--dark-gold), var(--gold));
        transform:scaleX(0);
        transition:transform 0.4s;
    }
    
    .card:hover::before{
        transform:scaleX(1);
    }
    
    .card-img-container{
        position:relative;
        overflow:hidden;
        display:block;
        cursor:pointer;
    }

    /* Higher specificity than .img-frame's height:100% so the thumbnail
       always gets a real, finite height instead of collapsing/expanding
       unpredictably (this was the cause of the oversized cards). */
    a.card-img-container.img-frame{
        height:170px;
    }

    .floor-badge{
        position:absolute;
        top:15px;
        left:15px;
        background:rgba(58,58,58,0.75);
        backdrop-filter:blur(4px);
        color:#fff;
        padding:6px 14px;
        border-radius:20px;
        font-weight:700;
        font-size:0.78rem;
        letter-spacing:0.03em;
        z-index:2;
    }

    .home-promo-banner{
        background:linear-gradient(135deg, var(--gold) 0%, var(--dark-gold) 100%);
        color:#fff;
        text-align:center;
        padding:18px 20px;
        margin:0 auto 30px;
        max-width:900px;
        border-radius:12px;
        font-size:1.05rem;
        font-weight:600;
        box-shadow:0 6px 20px rgba(200,160,92,0.35);
    }

    .home-promo-banner strong{
        font-size:1.2rem;
    }

    .home-promo-banner .promo-note{
        display:block;
        font-weight:400;
        font-size:0.85rem;
        margin-top:4px;
        opacity:0.9;
    }

    @media (max-width:600px){
        .home-promo-banner{
            font-size:0.95rem;
            padding:14px 16px;
        }
        .home-promo-banner strong{
            font-size:1.05rem;
        }
    }
    
    .card img{
        width:100%;
        height:100%;
        object-fit:cover;
        display:block;
        transition:transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        filter:brightness(0.95);
    }
    
    .card:hover img{
        transform:scale(1.06);
        filter:brightness(1);
    }
    
    .card-overlay{
        position:absolute;
        top:15px;
        right:15px;
        background:linear-gradient(135deg, var(--gold) 0%, var(--dark-gold) 100%);
        padding:8px 16px;
        border-radius:20px;
        font-weight:700;
        color:white;
        opacity:1;
        transform:translateY(0);
        transition:all 0.3s;
        font-size:0.8rem;
        box-shadow:0 4px 15px rgba(200,160,92,0.4);
    }
    
    .card-body{padding:24px;}
    
    .card h3{
        font-size:1.4rem;
        margin-bottom:10px;
        color:var(--charcoal);
        font-weight:700;
        letter-spacing:-0.5px;
    }
    
    .rating{
        display:flex;
        align-items:center;
        margin-bottom:12px;
        gap:8px;
        flex-wrap:wrap;
    }
    
    .stars{
        color:var(--gold);
        font-size:1rem;
        letter-spacing:2px;
    }
    
    .rating span{
        color:#666;
        font-weight:600;
        font-size:0.9rem;
    }
    
    .location{
        display:flex;
        align-items:center;
        color:#666;
        margin-bottom:15px;
        font-size:0.9rem;
    }
    
    .location svg{
        width:16px;
        height:16px;
        margin-right:6px;
        fill:var(--gold);
        flex-shrink:0;
    }
    
    .price{
        font-size:26px;
        font-weight:800;
        background:linear-gradient(135deg, var(--gold) 0%, var(--dark-gold) 100%);
        -webkit-background-clip:text;
        -webkit-text-fill-color:transparent;
        background-clip:text;
        margin:15px 0 18px;
        letter-spacing:-0.5px;
    }
    
    .amenities{
        display:flex;
        flex-wrap:wrap;
        gap:8px;
        margin:18px 0;
    }
    
    .amenity{
        background:linear-gradient(135deg, #f8f6f2 0%, #e8e6e1 100%);
        padding:6px 12px;
        border-radius:20px;
        font-size:0.8rem;
        font-weight:600;
        color:var(--charcoal);
        transition:all 0.3s;
        border:1px solid rgba(200,160,92,0.2);
    }
    
    .amenity:hover{
        background:linear-gradient(135deg, var(--gold) 0%, var(--dark-gold) 100%);
        color:white;
        transform:translateY(-2px);
        border-color:transparent;
    }
    
    .card p{
        color:#666;
        margin-bottom:20px;
        font-size:0.9rem;
        line-height:1.7;
    }
    
    .btn{
        display:inline-block;
        background:linear-gradient(135deg, var(--gold) 0%, var(--dark-gold) 100%);
        color:white;
        padding:14px 24px;
        border-radius:12px;
        text-decoration:none;
        font-weight:700;
        transition:all 0.3s;
        width:100%;
        text-align:center;
        box-shadow:0 4px 20px rgba(200,160,92,0.3);
        text-transform:uppercase;
        letter-spacing:0.5px;
        font-size:0.85rem;
    }
    
    .btn:hover{
        transform:translateY(-3px);
        box-shadow:0 8px 30px rgba(200,160,92,0.5);
    }
    
    /* Luxury Advantages Section */
    .advantages{
        display:grid;
        grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
        gap:25px;
        margin:50px 0;
    }
    
    .advantage{
        text-align:center;
        padding:30px 20px;
        background:white;
        border-radius:20px;
        box-shadow:0 10px 40px rgba(58,58,58,0.08);
        transition:all 0.3s;
        animation:fadeIn 1.6s ease backwards;
        border:1px solid rgba(200,160,92,0.1);
    }
    
    .advantage:nth-child(1){animation-delay:0.2s;}
    .advantage:nth-child(2){animation-delay:0.3s;}
    .advantage:nth-child(3){animation-delay:0.4s;}
    .advantage:nth-child(4){animation-delay:0.5s;}
    
    .advantage:hover{
        transform:translateY(-8px);
        box-shadow:0 20px 50px rgba(58,58,58,0.12);
        border-color:var(--gold);
    }
    
    .advantage-icon{
        font-size:3rem;
        margin-bottom:15px;
        display:inline-block;
        transition:transform 0.3s;
        filter:grayscale(100%) brightness(0) saturate(100%);
        opacity:0.7;
    }
    
    .advantage:hover .advantage-icon{
        transform:scale(1.2) rotate(5deg);
        filter:grayscale(0%) brightness(1) saturate(100%) hue-rotate(20deg);
        opacity:1;
    }
    
    .advantage h3{
        margin-bottom:10px;
        color:var(--charcoal);
        font-weight:700;
        font-size:1.05rem;
    }
    
    .advantage p{
        color:#666;
        line-height:1.7;
        font-size:0.9rem;
    }
    
    /* Booking Platforms */
    .booking-platforms{
        background:white;
        padding:35px 25px;
        border-radius:20px;
        box-shadow:0 10px 40px rgba(58,58,58,0.1);
        margin:50px 0;
        text-align:center;
        border:1px solid rgba(200,160,92,0.2);
    }
    
    .booking-platforms h2{
        font-size:1.8rem;
        margin-bottom:15px;
        background:linear-gradient(135deg, var(--gold) 0%, var(--dark-gold) 100%);
        -webkit-background-clip:text;
        -webkit-text-fill-color:transparent;
        background-clip:text;
        font-weight:800;
    }
    
    .booking-platforms p{
        color:#666;
        margin-bottom:25px;
        font-size:1rem;
    }
    
    .platforms-grid{
        display:grid;
        grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
        gap:20px;
        margin-top:25px;
    }
    
    .platform-card{
        background:linear-gradient(135deg, #f8f6f2 0%, #e8e6e1 100%);
        padding:25px 15px;
        border-radius:15px;
        transition:all 0.3s;
        border:2px solid rgba(200,160,92,0.2);
        text-decoration:none;
        display:block;
    }
    
    .platform-card:hover{
        transform:translateY(-5px);
        box-shadow:0 10px 30px rgba(58,58,58,0.15);
        background:linear-gradient(135deg, var(--gold) 0%, var(--dark-gold) 100%);
        border-color:transparent;
    }
    
    .platform-card:hover .platform-name{
        color:white;
    }
    
    .platform-icon{
        font-size:2.5rem;
        margin-bottom:12px;
        display:block;
    }
    
    .platform-name{
        font-weight:700;
        color:var(--charcoal);
        font-size:1rem;
        transition:color 0.3s;
    }
    
    /* Premium Footer */
    footer{
        margin-top:60px;
        background:linear-gradient(135deg, var(--charcoal) 0%, var(--dark-gray) 100%);
        color:white;
        padding:50px 0 20px;
        border-radius:20px 20px 0 0;
        position:relative;
    }
    
    footer::before{
        content:'';
        position:absolute;
        top:0;
        left:0;
        right:0;
        height:3px;
        background:linear-gradient(90deg, transparent, var(--gold), transparent);
    }
    
    .footer-content{
        display:grid;
        grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
        gap:35px;
        margin-bottom:35px;
        padding:0 20px;
    }
    
    .footer-section h3{
        margin-bottom:18px;
        background:linear-gradient(135deg, var(--gold) 0%, var(--light-gold) 100%);
        -webkit-background-clip:text;
        -webkit-text-fill-color:transparent;
        background-clip:text;
        font-weight:700;
        font-size:1.1rem;
    }
    
    .footer-section p{
        color:#ccc;
        line-height:1.7;
        font-size:0.9rem;
    }
    
    .footer-section a{
        display:block;
        color:#ddd;
        text-decoration:none;
        margin-bottom:12px;
        transition:all 0.3s;
        position:relative;
        padding-left:0;
        font-weight:500;
        font-size:0.9rem;
    }
    
    .footer-section a:hover{
        color:var(--gold);
        padding-left:12px;
    }
    
    /* Social Media - Amélioré */
    .social-links{
        display:flex;
        gap:15px;
        margin-top:25px;
        flex-wrap:wrap;
        justify-content:flex-start;
    }
    
    .social-link{
        width:60px;
        height:60px;
        background:rgba(255,255,255,0.08);
        backdrop-filter:blur(10px);
        border-radius:15px;
        display:flex;
        align-items:center;
        justify-content:center;
        transition:all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        border:2px solid rgba(200,160,92,0.3);
        font-size:28px;
        padding:0;
        position:relative;
        overflow:hidden;
        color:rgba(255,255,255,0.9);
    }
    
    .social-link i{
        font-size:28px;
        position:relative;
        z-index:1;
    }
    
    .social-link::before{
        content:'';
        position:absolute;
        top:0;
        left:0;
        right:0;
        bottom:0;
        background:linear-gradient(135deg, var(--gold) 0%, var(--dark-gold) 100%);
        opacity:0;
        transition:opacity 0.3s;
        z-index:-1;
    }
    
    .social-link:hover{
        transform:translateY(-8px) scale(1.1);
        border-color:transparent;
        box-shadow:0 10px 30px rgba(200,160,92,0.5);
        color:white;
    }
    
    .social-link:hover::before{
        opacity:1;
    }
    
    /* Couleurs spécifiques par réseau social */
    .social-link.facebook:hover::before{
        background:linear-gradient(135deg, #1877f2 0%, #0d5dbf 100%);
    }
    
    .social-link.instagram:hover::before{
        background:linear-gradient(135deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
    }
    
    .social-link.twitter:hover::before{
        background:linear-gradient(135deg, #000000 0%, #333333 100%);
    }
    
    .social-link.tiktok:hover::before{
        background:linear-gradient(135deg, #000000 0%, #ee1d52 50%, #69c9d0 100%);
    }
    
    .social-link.whatsapp:hover::before{
        background:linear-gradient(135deg, #25d366 0%, #128c7e 100%);
    }
    
    /* Animation de pulse pour attirer l'attention */
    @keyframes pulse{
        0%, 100%{transform:scale(1);}
        50%{transform:scale(1.05);}
    }
    
    .social-link:nth-child(1){animation:pulse 2s ease-in-out infinite; animation-delay:0s;}
    .social-link:nth-child(2){animation:pulse 2s ease-in-out infinite; animation-delay:0.2s;}
    .social-link:nth-child(3){animation:pulse 2s ease-in-out infinite; animation-delay:0.4s;}
    .social-link:nth-child(4){animation:pulse 2s ease-in-out infinite; animation-delay:0.6s;}
    .social-link:nth-child(5){animation:pulse 2s ease-in-out infinite; animation-delay:0.8s;}
    .social-link:nth-child(6){animation:pulse 2s ease-in-out infinite; animation-delay:1s;}
    
    .social-link:hover{
        animation:none;
    }
    
    .copyright{
        text-align:center;
        margin-top:35px;
        padding-top:25px;
        border-top:1px solid rgba(200,160,92,0.2);
        color:#aaa;
        font-size:0.85rem;
    }
    
    /* Responsive Mobile */
    @media (max-width: 768px) {
        .container{padding:10px;}
        
        header{
            flex-wrap:wrap;
            padding:15px;
        }
        
        .logo-container{
            flex:1;
        }
        
        .logo{font-size:16px;}
        
        .logo-img{
            width:38px;
            height:38px;
        }
        
        .menu-toggle{display:flex;}
        
        nav{
            display:none;
            width:100%;
            flex-direction:column;
            gap:0;
            margin-top:15px;
        }
        
        nav.active{
            display:flex;
        }
        
        nav a{
            padding:12px 0;
            border-bottom:1px solid rgba(200,160,92,0.2);
            font-size:0.9rem;
        }
        
        nav a::after{display:none;}
        
        #intro{
            padding:40px 15px;
            margin-bottom:30px;
            border-radius:15px;
        }
        
        #intro h1{
            font-size:1.8rem;
            line-height:1.3;
        }
        
        #intro p{
            font-size:0.95rem;
        }
        
        .filters{
            padding:20px 15px;
            margin-bottom:30px;
            border-radius:15px;
        }
        
        .filters-header{
            flex-direction:row;
            gap:10px;
        }
        
        .filters-icon{font-size:20px;}
        
        .filters-title{font-size:1rem;}
        
        .filter-btn{
            padding:9px 16px;
            font-size:0.8rem;
        }
        
        .grid{
            grid-template-columns:1fr;
            gap:25px;
        }
        
        a.card-img-container.img-frame{height:160px;}
        
        .card-body{padding:20px;}
        
        .card h3{font-size:1.3rem;}
        
        .card-overlay{
            padding:6px 14px;
            font-size:0.75rem;
            top:12px;
            right:12px;
        }
        
        .price{font-size:24px;}
        
        .advantages{
            grid-template-columns:1fr;
            gap:20px;
            margin:40px 0;
        }
        
        .advantage{padding:25px 20px;}
        
        .advantage-icon{font-size:2.8rem;}
        
        .booking-platforms{
            padding:30px 20px;
            margin:40px 0;
            border-radius:15px;
        }
        
        .booking-platforms h2{font-size:1.6rem;}
        
        .platforms-grid{
            grid-template-columns:repeat(2, 1fr);
            gap:15px;
        }
        
        .platform-card{padding:20px 12px;}
        
        .platform-icon{font-size:2.2rem;}
        
        .platform-name{font-size:0.95rem;}
        
        footer{
            margin-top:50px;
            padding:40px 0 20px;
            border-radius:15px 15px 0 0;
        }
        
        .footer-content{
            grid-template-columns:1fr;
            gap:30px;
            padding:0 15px;
        }
        
        .footer-section{text-align:center;}
        
        .footer-section a{
            padding-left:0!important;
        }
        
        .social-links{
            justify-content:center;
        }
        
        .social-link{
            width:55px;
            height:55px;
            font-size:26px;
        }
        
        .social-link i{
            font-size:26px;
        }
        
        .copyright{
            font-size:0.8rem;
            padding:0 10px;
        }
    }
    
    /* Extra Small Mobile */
    @media (max-width: 480px) {
        .logo{font-size:14px;}
        
        .logo-img{
            width:35px;
            height:35px;
        }
        
        #intro h1{font-size:1.6rem;}
        
        #intro p{font-size:0.9rem;}
        
        .filter-btn{
            padding:8px 14px;
            font-size:0.75rem;
        }
        
        .card h3{font-size:1.2rem;}
        
        .price{font-size:22px;}
        
        .btn{
            padding:12px 20px;
            font-size:0.8rem;
        }
        
        .platforms-grid{
            grid-template-columns:1fr;
        }
        
        .booking-platforms h2{font-size:1.4rem;}
    }

    /* Robust image fallback system - zero external dependency, always renders */
    .img-frame {
      position: relative;
      width: 100%;
      height: 100%;
      background: linear-gradient(135deg, #efe8d8 0%, #ddd0b3 100%);
      overflow: hidden;
    }

    .img-frame img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }

    .img-frame.is-broken img {
      display: none;
    }

    .img-frame .img-fallback {
      display: none;
      position: absolute;
      inset: 0;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 10px;
      color: var(--dark-gold);
      text-align: center;
      padding: 20px;
    }

    .img-frame.is-broken .img-fallback {
      display: flex;
    }

    .img-fallback svg {
      width: 30px;
      height: 30px;
      opacity: 0.55;
    }

    .img-fallback span {
      font-size: 0.72rem;
      font-weight: 600;
      letter-spacing: 0.3px;
      opacity: 0.65;
    }

    .logo-fallback {
      padding: 0 !important;
      gap: 0 !important;
    }

    .logo-fallback span {
      font-size: 15px;
      font-weight: 800;
      opacity: 1;
      background: linear-gradient(135deg, var(--gold) 0%, var(--dark-gold) 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      letter-spacing: 0.5px;
    }

    .logo-fallback svg { display: none; }

    /* Neutralize hover-stuck effects on touch devices (tap doesn't "stick" hover) */
    @media (hover: none) {
      .card:hover { transform: none; box-shadow: 0 10px 40px rgba(58,58,58,0.1); }
      .card:hover::before { transform: scaleX(0); }
      .card:hover img { transform: none; filter: brightness(0.95); }
      .amenity:hover { background: transparent; color: var(--charcoal); transform: none; border-color: rgba(200,160,92,0.2); }
      .btn:hover { transform: none; box-shadow: 0 4px 20px rgba(200,160,92,0.3); }
      .advantage:hover { transform: none; box-shadow: 0 10px 40px rgba(58,58,58,0.08); border-color: rgba(200,160,92,0.1); }
      .advantage:hover .advantage-icon { transform: none; filter: grayscale(100%) brightness(0) saturate(100%); opacity: 0.7; }
      .platform-card:hover { transform: none; box-shadow: none; background: linear-gradient(135deg, #f8f6f2 0%, #e8e6e1 100%); border-color: rgba(200,160,92,0.2); }
      .platform-card:hover .platform-name { color: var(--charcoal); }
    }

.special-offer { animation: none; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }

/* Keep home thumbnails free of text overlays and titles. */
.stay-hero-slide span, .card .floor-badge, .card .card-overlay, .card .card-body h3 { display: none !important; }