@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700&family=Montserrat:wght@300;400;600&display=swap');
        
        html { scroll-behavior: smooth; }
        #map { scroll-margin-top: 90px; }
        @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

        body {
            font-family: 'Montserrat', sans-serif;
            scroll-behavior: smooth;
        }
        
        h1, h2, h3 {
            font-family: 'Playfair Display', serif;
        }

        .sr-only {
            position: absolute;
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
             border: 0;
        }
        
        .carousel-item {
            opacity: 0;
            transition: opacity 1s ease-in-out;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }
        
        .carousel-item.active {
            opacity: 1;
        }
        
        .menu-hover.is-open .menu-dropdown {
            opacity: 1;
            visibility: visible;
            transform: translateY(0);
        }
        .menu-hover .menu-arrow { transition: transform .3s ease; }
        .menu-hover.is-open .menu-arrow { transform: rotate(180deg); }
        @media (prefers-reduced-motion: reduce) { .menu-hover .menu-arrow, .menu-hover .menu-dropdown { transition: none; } }
        
        .reserve-btn {
            transition: all 0.3s ease;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        }
        
        .reserve-btn:hover {
            transform: translateY(-3px) scale(1.05);
            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
        }
        

        /* Mettre en valeur les réservations sans gêner la lecture. */
        .reserve-pulse {
            border: 2px solid #fff;
            box-shadow: 0 0 0 0 rgba(255,255,255,.65), 0 5px 14px rgba(0,0,0,.22);
            animation: reserve-pulse 2.4s ease-out infinite;
        }
        @keyframes reserve-pulse {
            0%, 100% { box-shadow: 0 0 0 0 rgba(255,255,255,.58), 0 5px 14px rgba(0,0,0,.22); }
            55% { box-shadow: 0 0 0 8px rgba(255,255,255,0), 0 5px 14px rgba(0,0,0,.22); }
        }
        .reserve-pulse:hover, .reserve-pulse:focus-visible {
            animation-play-state: paused;
            box-shadow: 0 0 0 4px rgba(255,255,255,.22), 0 10px 20px rgba(0,0,0,.28);
        }
        @media (prefers-reduced-motion: reduce) {
            .reserve-pulse { animation: none; }
        }
        .transats-btn {
            border: 2px solid #fa746b;
            background: #fff;
            color: #4c1918;
            border-radius: 999px;
            padding: .5rem 1.25rem;
            font-weight: 700;
            line-height: 1.4;
            white-space: nowrap;
            cursor: pointer;
            transition: background .2s ease, transform .2s ease;
        }
        .transats-btn:hover, .transats-btn:focus-visible { background: #fff2f0; transform: translateY(-2px); }
        .topbar-transats { animation: transats-pulse 2.4s ease-out infinite; }
        @keyframes transats-pulse {
            0%, 100% { box-shadow: 0 0 0 0 rgba(250,116,107,.7), 0 5px 14px rgba(0,0,0,.22); }
            55% { box-shadow: 0 0 0 8px rgba(250,116,107,0), 0 5px 14px rgba(0,0,0,.22); }
        }
        .topbar-transats:hover, .topbar-transats:focus-visible {
            animation-play-state: paused;
            box-shadow: 0 0 0 4px rgba(250,116,107,.24), 0 10px 20px rgba(0,0,0,.28);
        }
        .cta-transats { padding: 1rem 2rem; font-size: 1.125rem; }
        .contact-transats { display: block; margin-top: 1rem; }
        @media (max-width: 640px) {
            .cta-actions > a, .cta-actions > button {
                width: min(100%, 21rem);
                min-height: 3.25rem;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                text-align: center;
                white-space: normal;
            }
            .contact-event-btn { width: min(100%, 21rem); justify-content: center; text-align: center; }
        }
        @media (prefers-reduced-motion: reduce) { .topbar-transats { animation: none; } }
        .transats-dialog {
            width: min(92vw, 450px);
            max-height: min(90vh, 550px);
            margin: auto;
            padding: 2.75rem 1.5rem 2.25rem;
            border: 2px solid #fa746b;
            border-radius: 20px;
            background: #fff;
            color: #4c1918;
            text-align: center;
            box-shadow: 0 24px 70px rgba(0,0,0,.35);
        }
        .transats-dialog::backdrop { background: rgba(18,7,7,.78); }
        .transats-dialog .close-dialog {
            position: absolute;
            top: .5rem;
            right: .8rem;
            padding: .3rem .6rem;
            font-size: 2rem;
            line-height: 1;
            color: #4c1918;
        }
        .transats-dialog .phone-link {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: .7rem;
            margin-top: 1.4rem;
            color: #4c1918;
            font-size: clamp(1.4rem, 6vw, 2rem);
            font-weight: 700;
            white-space: nowrap;
        }
        @media (max-width: 640px) {
            .nav-actions { gap: .4rem; }
            .nav-actions .nav-organise { display: none; }
            .nav-actions .reserve-pulse { padding: .45rem .75rem; font-size: .85rem; }
            .nav-actions .transats-btn { padding: .45rem .7rem; font-size: .85rem; }
            .nav-logo { width: 3rem; }
        }

        .mobile-menu-toggle {
            position: relative;
            width: 2.75rem;
            height: 2.75rem;
            display: none;
            align-items: center;
            justify-content: center;
        }
        @media (max-width: 767px) { .mobile-menu-toggle { display: inline-flex; } }
        .mobile-menu-toggle .menu-icon-bars,
        .mobile-menu-toggle .menu-icon-arrow { position: absolute; inset: 0; display: grid; place-items: center; }
        .mobile-menu-toggle .menu-icon-bars { animation: menu-bars-cycle 4s ease-in-out infinite; }
        .mobile-menu-toggle .menu-icon-arrow { animation: menu-arrow-cycle 4s ease-in-out infinite; }
        @keyframes menu-bars-cycle {
            0%, 31%, 68%, 100% { opacity: 1; transform: translateY(0) scale(1); }
            42%, 57% { opacity: 0; transform: translateY(-5px) scale(.85); }
        }
        @keyframes menu-arrow-cycle {
            0%, 31%, 68%, 100% { opacity: 0; transform: translateY(-5px) scale(.85); }
            42%, 57% { opacity: 1; transform: translateY(0) scale(1); }
        }
        @media (prefers-reduced-motion: reduce) {
            .mobile-menu-toggle .menu-icon-bars,
            .mobile-menu-toggle .menu-icon-arrow { animation: none; }
            .mobile-menu-toggle .menu-icon-arrow { opacity: 0; }
        }
        .topbar .language-switcher a[aria-current="page"] { display: none; }
        .topbar .menu-label-landscape { display: none; }
        .topbar .organise-label-mobile { display: none; }
        .topbar .menu-dropdown { left: 0; right: auto; }
        .topbar .menu-dropdown a { font-weight: 700; }
        @media (min-width: 768px) {
            .topbar .nav-actions { flex: 1; justify-content: space-between; margin-left: clamp(1.25rem, 4vw, 3rem); }
        }
        @media (max-width: 767px) {
            .topbar .language-switcher { display: flex; }
            .topbar .language-switcher a[aria-current="page"] { display: none; }
            .topbar .language-switcher a:not([aria-current="page"]) { opacity: 1 !important; }
        }
        @media (max-width: 767px) {
            .topbar { padding: .6rem .5rem; }
            .topbar .nav-logo { display: none; }
            .topbar .nav-actions {
                display: flex;
                flex-wrap: nowrap;
                align-items: center;
                justify-content: space-between;
                width: 100%;
                gap: .2rem;
            }
            .topbar .mobile-menu-toggle { order: 0; flex: 0 0 2.5rem; width: 2.5rem; height: 2.5rem; }
            .topbar .language-switcher { order: 3; flex: 0 0 auto; margin-left: auto; }
            .topbar .nav-reserve,
            .topbar .nav-transats {
                flex: 0 0 auto;
                min-height: 2.5rem;
                padding: .4rem .55rem;
                font-size: .75rem;
                white-space: nowrap;
            }
            .topbar .nav-reserve { order: 1; }
            .topbar .nav-reserve i { margin-right: .3rem; }
            .topbar .nav-transats { order: 2; }
            .topbar .nav-organise { display: none; }
        }
        @media (max-width: 767px) and (orientation: portrait) {
            .topbar .nav-actions { justify-content: flex-end; }
            .topbar .mobile-menu-toggle { margin-right: auto; }
            .topbar .language-switcher { order: 4; margin-left: 0; }
            .topbar .nav-organise {
                display: flex;
                order: 3;
                flex: 0 0 auto;
                align-items: center;
                min-height: 2.5rem;
                padding: .4rem .55rem;
                font-size: .75rem;
                white-space: nowrap;
            }
            .topbar .organise-label-desktop, .topbar .nav-reserve i, .topbar .nav-organise i { display: none; }
            .topbar .organise-label-mobile { display: inline; }
        }
        @media (max-width: 380px) and (orientation: portrait) {
            .topbar .nav-actions { gap: .15rem; }
            .topbar .nav-reserve, .topbar .nav-transats, .topbar .nav-organise { padding: .35rem; }
            .topbar .mobile-menu-toggle { flex-basis: 2.25rem; width: 2.25rem; }
            .topbar .language-switcher a { width: 2.25rem; height: 2.25rem; }
        }

        @media (max-width: 767px) and (orientation: landscape) {
            .topbar .nav-logo { display: block; flex: 0 0 2.5rem; width: 2.5rem; }
            .topbar .nav-actions { width: auto; flex: 1; justify-content: flex-end; margin-left: .75rem; gap: clamp(.25rem, 1vw, .6rem); }
            .topbar .mobile-menu-toggle { display: none; }
            .topbar .menu-hover { display: block; order: 0; margin-right: auto; font-size: .75rem; white-space: nowrap; }
            .topbar .menu-label-desktop { display: none; }
            .topbar .menu-label-landscape { display: inline; }
            .topbar .nav-reserve { order: 1; }
            .topbar .nav-transats { order: 2; }
            .topbar .nav-organise { display: flex; order: 3; min-height: 2.5rem; padding: .4rem .55rem; font-size: .75rem; white-space: nowrap; }
            .topbar .language-switcher { order: 4; gap: .25rem; margin-left: .25rem; }
        }

        .fade-in {
            opacity: 0;
            transform: translateY(20px);
            transition: opacity 0.8s ease, transform 0.8s ease;
        }

        .menu-card {
            transition: all 0.3s ease;
            overflow: hidden;
        }

        .menu-card:hover {
            transform: translateY(-5px);
        }

        .menu-card img {
            transition: transform 0.5s ease;
        }

        .menu-card:hover img {
            transform: scale(1.05);
        }
        .event-coffee-icon { position: relative; flex: 0 0 4rem; }
        .event-coffee-icon .fa-mug-hot {
            position: absolute;
            top: 60%;
            left: 50%;
            transform: translate(-50%, -50%);
            font-size: 1.65rem;
        }
        .event-coffee-icon .fa-check,
        .event-coffee-icon .fa-xmark {
            position: absolute;
            top: 20%;
            left: 50%;
            font-size: .85rem;
        }
        .event-coffee-icon .fa-check { animation: coffee-check-cycle 5s ease-in-out infinite; }
        .event-coffee-icon .fa-xmark { animation: coffee-x-cycle 5s ease-in-out infinite; }
        @keyframes coffee-check-cycle {
            0%, 44%, 72%, 100% { opacity: 1; transform: translate(-50%, -50%) rotate(-12deg) scale(1); }
            49%, 67% { opacity: 0; transform: translate(-50%, -50%) rotate(-12deg) scale(.6); }
        }
        @keyframes coffee-x-cycle {
            0%, 44%, 72%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(.6); }
            49%, 67% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
        }
        @media (prefers-reduced-motion: reduce) {
            .event-coffee-icon .fa-check { animation: none; transform: translate(-50%, -50%) rotate(-12deg); }
            .event-coffee-icon .fa-xmark { animation: none; opacity: 0; }
        }
        .event-wedding-icon { position: relative; }
        .event-wedding-icon .fa-gem {
            display: inline-block;
            font-size: 32px;
            animation: wedding-gem-glow 5s ease-in-out infinite;
        }
        .event-wedding-icon .wedding-sparkle {
            position: absolute; font-size: 8px; opacity: 0;
            animation: wedding-sparkle 3.6s ease-in-out infinite;
        }
        .event-wedding-icon .sparkle-one { top: 10px; left: 11px; }
        .event-wedding-icon .sparkle-two { top: 9px; right: 10px; animation-delay: 1.2s; font-size: 6px; }
        .event-wedding-icon .sparkle-three { bottom: 10px; left: 14px; animation-delay: 2.4s; font-size: 6px; }
        @keyframes wedding-gem-glow {
            0%, 100% { transform: rotate(-6deg) scale(1); filter: drop-shadow(0 0 0 transparent); }
            50% { transform: rotate(6deg) scale(1.13); filter: drop-shadow(0 0 5px rgba(255, 255, 255, .85)); }
        }
        @keyframes wedding-sparkle {
            0%, 20%, 75%, 100% { opacity: 0; transform: scale(.4) rotate(-20deg); }
            42% { opacity: 1; transform: scale(1.3) rotate(20deg); }
        }
        @media (prefers-reduced-motion: reduce) {
            .event-wedding-icon .fa-gem, .event-wedding-icon .wedding-sparkle { animation: none; }
            .event-wedding-icon .wedding-sparkle { opacity: .7; }
        }

        .beach-palm-icon { position: relative; overflow: hidden; }
        .beach-palm-icon svg { position: absolute; width: 48px; height: 48px; bottom: -2px; left: 8px; }
        .beach-palm-icon .beach-sun { position: absolute; top: 6px; left: 50%; font-size: 13px; animation: beach-sun-pulse 2.8s ease-in-out infinite; }
        @keyframes beach-sun-pulse {
            0%, 100% { transform: translateX(-50%) scale(.8); }
            50% { transform: translateX(-50%) scale(1.3); }
        }
        @media (prefers-reduced-motion: reduce) { .beach-palm-icon .beach-sun { animation: none; transform: translateX(-50%); } }

        .table-icon { position: relative; }
        .table-icon .table-plate {
            position: absolute; width: 44px; height: 44px;
            border: 2px solid currentColor; border-radius: 50%;
            animation: table-plate-reveal 4.8s ease-in-out infinite;
        }
        .table-icon .table-plate::after {
            content: ""; position: absolute; inset: 5px;
            border: 1px solid currentColor; border-radius: 50%; opacity: .65;
        }
        .table-icon .fa-utensils {
            position: relative; font-size: 25px;
        }
        @keyframes table-plate-reveal {
            0%, 12%, 100% { transform: scale(.88); opacity: 0; }
            36%, 64% { transform: scale(1); opacity: .9; }
            88% { transform: scale(1.04); opacity: 0; }
        }
        @media (prefers-reduced-motion: reduce) {
            .table-icon .table-plate { animation: none; opacity: .9; }
        }

        .cocktail-icon { position: relative; }
        .cocktail-icon .fa-champagne-glasses {
            font-size: 24px; transform-origin: center 80%;
            animation: cocktail-toast 3.6s ease-in-out infinite;
        }
        .cocktail-icon .cocktail-bubble {
            position: absolute; font-size: 5px; opacity: 0;
            animation: cocktail-bubble-rise 3.6s ease-out infinite;
        }
        .cocktail-icon .bubble-one { top: 18px; left: 22px; }
        .cocktail-icon .bubble-two { top: 16px; left: 34px; animation-delay: .18s; font-size: 4px; }
        .cocktail-icon .bubble-three { top: 20px; left: 43px; animation-delay: .36s; font-size: 3px; }
        @keyframes cocktail-toast {
            0%, 18%, 58%, 100% { transform: rotate(0) scale(1); }
            27% { transform: rotate(-10deg) scale(1.05); }
            38% { transform: rotate(9deg) scale(1.16); }
            46% { transform: rotate(-3deg) scale(1.07); }
        }
        @keyframes cocktail-bubble-rise {
            0%, 31% { transform: translateY(3px) scale(.65); opacity: 0; }
            39% { opacity: 1; }
            67% { transform: translateY(-15px) scale(1); opacity: .9; }
            77%, 100% { transform: translateY(-21px) scale(.7); opacity: 0; }
        }
        @media (prefers-reduced-motion: reduce) {
            .cocktail-icon .fa-champagne-glasses, .cocktail-icon .cocktail-bubble { animation: none; }
        }

        .map-container {
            overflow: hidden;
            border-radius: 12px;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
        }
        .map-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 1rem 1.5rem; margin-top: 1.25rem; }
        .map-action-btn {
            display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
            background: transparent; color: #fff; border: 2px solid #fff;
            border-radius: 14px; padding: .75rem 1.15rem; font-weight: 700;
            text-decoration: none; transition: transform .2s ease, box-shadow .2s ease;
        }
        .map-action-btn:hover, .map-action-btn:focus-visible { color: #fff; background: rgba(255, 255, 255, .12); transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0, 0, 0, .25); }
        @media (prefers-reduced-motion: reduce) { .map-action-btn { transition: none; } }
        .social-icon-link { border: 2px solid #fff; animation: social-outline-pulse 2.8s ease-out infinite; }
        .social-icon-link .fa-instagram, .social-icon-link .fa-facebook { font-size: 22px; }
        .social-icon-link .infinity-icon { color: #fff; font: 700 27px/1 Arial, sans-serif; }
        @keyframes social-outline-pulse {
            0%, 100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, .7); }
            55% { box-shadow: 0 0 0 6px rgba(255, 255, 255, 0); }
        }
        @media (prefers-reduced-motion: reduce) { .social-icon-link { animation: none; } }
        .cookie-manage-wrap { margin-top:22px; text-align:center; }
        .cookie-manage-link { color:#4c1918; font-size:13px; font-weight:700; text-decoration:underline; text-underline-offset:4px; cursor:pointer; }
        .cookie-manage-link i { margin-right:7px; color:#d64f47; font-size:16px; }
        .cookie-manage-link:hover, .cookie-manage-link:focus-visible { color:#b53d36; }
        .cookie-dialog { width:min(92vw,520px); max-height:calc(100dvh - 32px); margin:auto; padding:30px; border:2px solid #fa746b; border-radius:18px; background:#fff; color:#4c1918; box-shadow:0 20px 70px #0007; }
        .cookie-dialog::backdrop { background:rgba(20,7,7,.74); }
        .cookie-dialog h2 { margin:0 30px 14px 0; font-size:1.5rem; font-weight:700; }
        .cookie-dialog p { font-size:15px; line-height:1.55; }
        .cookie-dialog-close { position:absolute; top:12px; right:18px; font-size:28px; line-height:1; }
        .cookie-dialog-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
        .cookie-dialog-actions button { flex:1 1 180px; padding:11px 14px; border:2px solid #4c1918; border-radius:10px; font-weight:700; }
        .cookie-dialog-actions button:last-child { background:#4c1918; color:#fff; }
        .cookie-dialog-actions button:hover, .cookie-dialog-actions button:focus-visible { outline:2px solid #fa746b; outline-offset:2px; }
        .video-section { padding:8px 24px 48px; }
        .video-frame { width:min(100%,960px); aspect-ratio:16/9; margin:auto; overflow:hidden; border:2px solid rgba(237,230,220,.45); border-radius:20px; background:#2d100f; box-shadow:0 18px 42px rgba(0,0,0,.25); }
        .video-frame iframe { display:block; width:100%; height:100%; border:0; }
        @media (max-width:640px) { .video-section { padding:4px 16px 32px; } .video-frame { border-radius:14px; } }

        /* Mobile side navigation */
        .sidenav {
            height: 100%;
            width: 0;
            position: fixed;
            z-index: 100;
            top: 0;
            left: 0;
            background-color: #4c1918;
            overflow-x: hidden;
            padding-top: 60px;
            transition: 0.5s;
        }

        .sidenav a {
            padding: 8px 8px 8px 32px;
            text-decoration: none;
            font-size: 1.25rem;
            color: #ede6dc;
            display: block;
            transition: 0.3s;
        }

        .sidenav a:hover {
            color: #fa746b;
        }

        .sidenav .closebtn {
            position: absolute;
            top: 0;
            right: 25px;
            font-size: 36px;
            margin-left: 50px;
        }

        .fa-tripadvisor {
            color: #fff; /* vert Tripadvisor */
            font-size: 32px;
        }

        
        .gradient-overlay {
            background: linear-gradient(to top,
                rgba(0, 0, 0, .96) 0%,
                rgba(0, 0, 0, .92) 18%,
                rgba(0, 0, 0, .82) 34%,
                rgba(0, 0, 0, .68) 48%,
                rgba(0, 0, 0, .30) 60%,
                transparent 70%);
            z-index: 10;
        }

        .carrousel .carousel-copy {
            font-family: 'Montserrat', sans-serif;
            font-weight: 600;
            color: #fff;
            opacity: 1;
            text-shadow: 0 2px 12px rgba(0, 0, 0, .9), 0 1px 3px rgba(0, 0, 0, .95);
        }
        .carousel-logo { position:absolute; top:24%; left:50%; transform:translateX(-50%); }
        .carousel-text { position:absolute; bottom:104px; left:50%; transform:translateX(-50%); width:min(92%,860px); text-align:center; z-index:20; }
        .carousel-text h2 { margin:16px 0 0; line-height:1.5; }
        @media (max-width:640px) { .carousel-logo { top:15%; width:11rem; } .carousel-text { bottom:98px; width:92%; } .carousel-text h1 { font-size:1.05rem; line-height:1.4; } .carousel-text h2 { font-size:.94rem; line-height:1.4; margin-top:10px; } }
        @media (max-height:650px) { .carousel-logo { top:12%; width:8rem; } .carousel-text { bottom:90px; } }

        @media screen and (max-height: 450px) {
            .sidenav {padding-top: 15px;}
            .sidenav a {font-size: 18px;}
        }

        .universe-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
        .universe-photo { width:100%; aspect-ratio:1/1; object-fit:cover; display:block; border-radius:18px; background:#381514; box-shadow:0 12px 28px rgba(0,0,0,.15); transition:transform .3s ease, box-shadow .3s ease; }
        .universe-photo:first-child { grid-column:span 2; aspect-ratio:2/1; }
        .universe-photo:hover { transform:translateY(-4px); box-shadow:0 20px 36px rgba(0,0,0,.25); }
        @media (prefers-reduced-motion:reduce) { .universe-photo { transition:none; } .universe-photo:hover { transform:none; } }
        .sparkle-star { display:inline-block; color:#fff7d0; font-size:1.7rem; filter:drop-shadow(0 0 7px rgba(255,247,208,.8)); animation:star-sparkle 2.2s ease-in-out infinite; }
        @keyframes star-sparkle { 0%,100% { transform:scale(.9) rotate(-8deg); opacity:.65; filter:drop-shadow(0 0 3px rgba(250,116,107,.5)); } 50% { transform:scale(1.2) rotate(8deg); opacity:1; filter:drop-shadow(0 0 14px rgba(250,116,107,1)); } }
        @media (prefers-reduced-motion:reduce) { .sparkle-star { animation:none; } }
        @media(max-width:700px) { .universe-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .universe-photo:first-child, .universe-photo:last-child { grid-column:span 2; aspect-ratio:2/1; } }
        @media(max-width:440px) { .universe-grid { gap:10px; } .universe-photo { border-radius:12px; } }