@charset "UTF-8";
@import url(main.css);
/* ============================================================ NAVBAR - COCKTAILS ET SAVEURS ============================================================ */
#navigation-bar-hide { opacity: 1 !important; top: 0 !important; }

nav.navbar { position: fixed !important; top: 0 !important; right: 0; left: 0; z-index: 9999; width: 100%; padding-top: 8px; padding-bottom: 8px; border-bottom: 1px solid rgba(255, 255, 255, 0.18); background-color: rgba(15, 81, 99, 0.72) !important; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: none !important; transition: background-color .3s ease, border-color .3s ease, padding .3s ease; }

/* ============================================================ NAVBAR AU SCROLL ============================================================ */
nav.navbar.scrolled { padding-top: 5px; padding-bottom: 5px; border-bottom: 1px solid rgba(255, 255, 255, 0.22); background-color: rgba(15, 81, 99, 0.94) !important; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }

/* ============================================================ LOGO ============================================================ */
.navbar-brand { display: flex; align-items: center; width: auto !important; height: auto !important; margin: 0 !important; padding: 0 !important; }

.navbar-brand .logo_nav, .logo_nav { display: block; width: auto !important; height: 72px !important; max-width: 180px; object-fit: contain; transition: height .3s ease; }

nav.navbar.scrolled .logo_nav { height: 62px !important; }

/* ============================================================ LIENS DU MENU ============================================================ */
nav.navbar .nav-link { color: #FFFFFF !important; transition: color .3s ease, opacity .3s ease; }

nav.navbar .nav-link:hover, nav.navbar .nav-link:focus { color: #FFFFFF !important; opacity: .72; }

/* ============================================================ DROPDOWN ============================================================ */
nav.navbar .dropdown-menu { margin-top: 8px; border: 0 !important; border-radius: 0 !important; background: rgba(15, 81, 99, 0.97) !important; box-shadow: none !important; }

nav.navbar .dropdown-item { color: #FFFFFF !important; background: transparent !important; transition: background-color .3s ease, color .3s ease; }

nav.navbar .dropdown-item:hover, nav.navbar .dropdown-item:focus { background: rgba(255, 255, 255, 0.1) !important; color: #FFFFFF !important; }

/* ============================================================ BOUTON D'APPEL ============================================================ */
nav.navbar .button-header-telephone { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 10px 18px !important; border: 1px solid #FFFFFF !important; border-radius: 0 !important; background: #FFFFFF !important; color: #0F5163 !important; box-shadow: none !important; text-decoration: none !important; transition: background-color .3s ease, color .3s ease, border-color .3s ease; }

nav.navbar .button-header-telephone i { color: #0F5163 !important; }

nav.navbar .button-header-telephone:hover { border-color: #FFFFFF !important; background: transparent !important; color: #FFFFFF !important; }

nav.navbar .button-header-telephone:hover i { color: #FFFFFF !important; }

nav.navbar .button-header-telephone:focus-visible { outline: 2px solid #FFFFFF; outline-offset: 3px; }

nav.navbar .button-header-telephone.rounded-pill { border-radius: 0 !important; }

/* ============================================================ BURGER ============================================================ */
nav.navbar .navbar-toggler { border: 1px solid rgba(255, 255, 255, 0.45) !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }

nav.navbar .navbar-toggler:focus { box-shadow: none !important; }

/* ============================================================ TABLETTE / MOBILE ============================================================ */
@media screen and (max-width: 991px) { nav.navbar { padding: 7px 18px; background-color: rgba(15, 81, 99, 0.94) !important; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); } nav.navbar.scrolled { background-color: rgba(15, 81, 99, 0.98) !important; } .navbar-brand .logo_nav, .logo_nav { height: 58px !important; max-width: 150px; } nav.navbar.scrolled .logo_nav { height: 54px !important; } nav.navbar .navbar-collapse { margin-top: 10px; padding: 15px 0 18px; } nav.navbar .button-header-telephone { margin-top: 10px !important; margin-bottom: 10px !important; } }

/* ============================================================ PETITS MOBILES ============================================================ */
@media screen and (max-width: 480px) { nav.navbar { padding-right: 14px; padding-left: 14px; } .navbar-brand .logo_nav, .logo_nav { height: 52px !important; max-width: 135px; } nav.navbar.scrolled .logo_nav { height: 50px !important; } nav.navbar .button-header-telephone { width: 100%; } }

/* ============================================================ ACCESSIBILITÉ ============================================================ */
@media (prefers-reduced-motion: reduce) { nav.navbar, nav.navbar .nav-link, nav.navbar .dropdown-item, nav.navbar .button-header-telephone, .logo_nav { transition: none !important; } }

/* -------------------------------------------------- HERO -------------------------------------------------- */
.cs-hero { position: relative; min-height: 780px; height: 92vh; max-height: 980px; overflow: hidden; background-position: center; background-size: cover; background-repeat: no-repeat; }

.cs-hero-overlay { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(15, 81, 99, 0.24) 0%, rgba(20, 20, 20, 0.3) 45%, rgba(20, 20, 20, 0.38) 100%); }

.cs-hero::before { position: absolute; inset: 0; z-index: 1; background: radial-gradient(circle at center, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0) 58%); content: ""; pointer-events: none; }

/* -------------------------------------------------- CONTAINER -------------------------------------------------- */
.cs-hero-container { position: relative; z-index: 2; display: flex; align-items: center; justify-content: center; max-width: 1300px; height: 100%; min-height: 100%; margin: 0 auto; padding: 45px 30px 90px; }

.cs-hero-content { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; max-width: 950px; text-align: center; animation: csHeroReveal .9s ease both; }

/* -------------------------------------------------- LOGO -------------------------------------------------- */
.cs-hero-logo-wrap { margin-bottom: 18px; animation: csHeroLogoReveal 1s ease .1s both; }

.cs-hero-logo { display: block; width: 190px; max-width: 100%; height: auto; object-fit: contain; }

/* -------------------------------------------------- CONTENU -------------------------------------------------- */
.cs-hero-eyebrow { margin-bottom: 6px; color: #FFFFFF; letter-spacing: .26em; text-transform: uppercase; animation: csHeroFadeUp .8s ease .2s both; }

.cs-hero-title { max-width: 900px; color: #FFFFFF; line-height: 1.08; animation: csHeroFadeUp .8s ease .3s both; }

.cs-hero-line { width: 65px; height: 1px; margin: 12px 0; background: rgba(255, 255, 255, 0.75); animation: csHeroLine 1s ease .55s both; }

.cs-hero-description { max-width: 720px; margin-bottom: 16px; color: #FFFFFF; line-height: 1.55; animation: csHeroFadeUp .8s ease .45s both; }

.cs-hero-description p { margin: 0; }

/* -------------------------------------------------- BOUTONS -------------------------------------------------- */
.cs-hero-actions { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 0; animation: csHeroFadeUp .8s ease .6s both; }

.cs-hero-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 14px; min-height: 54px; margin: 0; padding: 15px 28px; border-radius: 0; color: #FFFFFF !important; text-decoration: none; overflow: hidden; transition: transform .3s ease, background-color .3s ease, border-color .3s ease, color .3s ease; }

.cs-hero-btn-primary { background: #0F5163; border: 1px solid #0F5163; }

.cs-hero-btn-secondary { background: rgba(255, 255, 255, 0.12); border: 1px solid rgba(255, 255, 255, 0.8); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }

/* -------------------------------------------------- LABELS DES BOUTONS -------------------------------------------------- */
.cs-hero-btn-label { margin: 0 !important; padding: 0; color: #FFFFFF !important; transition: color .3s ease; }

.cs-hero-btn-label p, .cs-hero-btn-label span, .cs-hero-btn-label strong, .cs-hero-btn-label em { margin: 0 !important; padding: 0; color: #FFFFFF !important; transition: color .3s ease; }

/* -------------------------------------------------- FLÈCHE -------------------------------------------------- */
.cs-hero-btn-icon { width: 18px; height: 18px; flex: 0 0 auto; color: #FFFFFF !important; transition: transform .3s ease, color .3s ease; }

/* -------------------------------------------------- HOVER BOUTONS -------------------------------------------------- */
.cs-hero-btn:hover { background: #FFFFFF; border-color: #FFFFFF; color: #0F5163 !important; transform: translateY(-3px); }

/* Force tous les éléments générés par le CMS */
.cs-hero-btn:hover .cs-hero-btn-label, .cs-hero-btn:hover .cs-hero-btn-label *, .cs-hero-btn:hover p, .cs-hero-btn:hover span, .cs-hero-btn:hover strong, .cs-hero-btn:hover em { color: #0F5163 !important; }

/* Flèche au hover */
.cs-hero-btn:hover .cs-hero-btn-icon, .cs-hero-btn:hover .cs-hero-btn-icon *, .cs-hero-btn:hover .cs-hero-btn-icon path { color: #0F5163 !important; stroke: #0F5163 !important; }

.cs-hero-btn-primary:hover .cs-hero-btn-icon { transform: translateX(4px); }

.cs-hero-btn:focus-visible { outline: 2px solid #FFFFFF; outline-offset: 4px; }

/* -------------------------------------------------- INDICATEUR BAS -------------------------------------------------- */
.cs-hero-scroll { position: absolute; left: 50%; bottom: 26px; width: 1px; height: 46px; overflow: hidden; transform: translateX(-50%); }

.cs-hero-scroll::before { position: absolute; inset: 0; background: rgba(255, 255, 255, 0.28); content: ""; }

.cs-hero-scroll span { position: absolute; top: -46px; left: 0; width: 1px; height: 32px; background: #FFFFFF; animation: csHeroScroll 2s ease-in-out infinite; }

/* -------------------------------------------------- ANIMATIONS -------------------------------------------------- */
@keyframes csHeroReveal { from { opacity: 0; }
  to { opacity: 1; } }

@keyframes csHeroLogoReveal { from { opacity: 0;
    transform: translateY(-15px) scale(0.96); }
  to { opacity: 1;
    transform: translateY(0) scale(1); } }

@keyframes csHeroFadeUp { from { opacity: 0;
    transform: translateY(20px); }
  to { opacity: 1;
    transform: translateY(0); } }

@keyframes csHeroLine { from { width: 0;
    opacity: 0; }
  to { width: 65px;
    opacity: 1; } }

@keyframes csHeroScroll { 0% { transform: translateY(0); }
  60%, 100% { transform: translateY(92px); } }

/* -------------------------------------------------- TABLETTE -------------------------------------------------- */
@media screen and (max-width: 991px) { .cs-hero { min-height: 720px; height: 90vh; } .cs-hero-container { padding: 40px 25px 85px; } .cs-hero-content { max-width: 800px; } .cs-hero-logo { width: 165px; } .cs-hero-description { max-width: 650px; } }

/* -------------------------------------------------- MOBILE -------------------------------------------------- */
@media screen and (max-width: 767px) { .cs-hero { min-height: 680px; height: auto; max-height: none; } .cs-hero-container { min-height: 680px; padding: 55px 20px 85px; } .cs-hero-logo-wrap { margin-bottom: 14px; } .cs-hero-logo { width: 145px; } .cs-hero-eyebrow { margin-bottom: 5px; letter-spacing: .18em; } .cs-hero-title { line-height: 1.1; } .cs-hero-line { margin: 10px 0; } .cs-hero-description { margin-bottom: 14px; line-height: 1.5; } .cs-hero-actions { flex-direction: column; width: 100%; gap: 10px; margin: 0; } .cs-hero-btn { width: 100%; max-width: 360px; margin: 0; } .cs-hero-scroll { bottom: 18px; height: 36px; } }

/* -------------------------------------------------- PETITS MOBILES -------------------------------------------------- */
@media screen and (max-width: 480px) { .cs-hero-container { padding-right: 16px; padding-left: 16px; } .cs-hero-logo { width: 130px; } .cs-hero-line { width: 50px; } @keyframes csHeroLine { from { width: 0;
      opacity: 0; }
    to { width: 50px;
      opacity: 1; } } }

/* -------------------------------------------------- ACCESSIBILITÉ -------------------------------------------------- */
@media (prefers-reduced-motion: reduce) { .cs-hero-content, .cs-hero-logo-wrap, .cs-hero-eyebrow, .cs-hero-title, .cs-hero-line, .cs-hero-description, .cs-hero-actions, .cs-hero-scroll span { animation: none; } .cs-hero-btn, .cs-hero-btn-label, .cs-hero-btn-label *, .cs-hero-btn-icon { transition: none; } }

/*--------------------------------------------------------------
# SECTION INTRODUCTION
--------------------------------------------------------------*/
.cs-intro { position: relative; padding: 110px 30px; background: #F0F0F0; overflow: hidden; }

/* Trait décoratif sur toute la hauteur */
.cs-intro::before { position: absolute; top: 0; bottom: 0; left: calc(50% - 660px + 95px); z-index: 0; width: 7px; background: #0F5163; content: ""; }

.cs-intro-container { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 42px; max-width: 1320px; margin: 0 auto; }

/*--------------------------------------------------------------
# VISUELS
--------------------------------------------------------------*/
.cs-intro-visual { position: relative; z-index: 1; min-height: 640px; }

.cs-intro-image { position: absolute; overflow: hidden; background: #F0F0F0; }

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

.cs-intro-image-back { top: 0; left: 0; z-index: 1; width: 72%; height: 520px; }

.cs-intro-image-front { right: 0; bottom: 0; z-index: 2; width: 68%; height: 430px; border: 18px solid #F0F0F0; }

/*--------------------------------------------------------------
# CONTENU
--------------------------------------------------------------*/
.cs-intro-content { position: relative; z-index: 3; width: 100%; padding: 32px 0 32px 32px; background: #F0F0F0; color: #353535; }

.cs-intro-content::before { position: absolute; top: 0; right: -50vw; bottom: 0; left: 0; z-index: -1; background: #F0F0F0; content: ""; }

.cs-intro-kicker { display: inline-block; margin-bottom: 4px; color: #0F5163; }

.cs-intro-kicker p, .cs-intro-kicker h3, .cs-intro-kicker h4 { margin: 0 !important; color: inherit !important; }

.cs-intro-title { max-width: 700px; margin-bottom: 30px; color: #353535; line-height: 1.1; }

.cs-intro-title p, .cs-intro-title h1, .cs-intro-title h2, .cs-intro-title h3 { margin-top: 0 !important; color: inherit !important; }

.cs-intro-description { max-width: 680px; margin-bottom: 26px; color: #353535; line-height: 1.6; }

.cs-intro-description p { margin-top: 0; margin-bottom: 6px; color: inherit !important; }

.cs-intro-description p:last-child { margin-bottom: 0; }

/*--------------------------------------------------------------
# POINTS
--------------------------------------------------------------*/
.cs-intro-points { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 22px; }

.cs-intro-point { display: flex; align-items: flex-start; gap: 9px; }

.cs-intro-point-icon { flex: 0 0 auto; color: #0F5163; line-height: 1.4; }

.cs-intro-point-text { color: #353535; line-height: 1.5; }

.cs-intro-point-text p { margin: 0; color: inherit !important; }

/*--------------------------------------------------------------
# TABLETTE LARGE
--------------------------------------------------------------*/
@media screen and (max-width: 1380px) { .cs-intro::before { left: 7%; } }

/*--------------------------------------------------------------
# TABLETTE
--------------------------------------------------------------*/
@media screen and (max-width: 991px) { .cs-intro { padding: 90px 25px; } .cs-intro::before { left: 90px; width: 6px; } .cs-intro-container { grid-template-columns: 1fr; gap: 42px; } .cs-intro-visual { width: 100%; max-width: 760px; min-height: 560px; margin: 0 auto; } .cs-intro-image-back { width: 70%; height: 460px; } .cs-intro-image-front { width: 66%; height: 360px; } .cs-intro-content { width: 100%; max-width: 760px; margin: 0 auto; padding: 30px; } .cs-intro-content::before { right: 0; left: 0; } }

/*--------------------------------------------------------------
# MOBILE
--------------------------------------------------------------*/
@media screen and (max-width: 767px) { .cs-intro { padding: 70px 20px; } /* Suppression du trait décoratif sur téléphone */ .cs-intro::before { display: none; } .cs-intro-container { gap: 34px; } .cs-intro-visual { min-height: 420px; } .cs-intro-image-back { width: 76%; height: 320px; } .cs-intro-image-front { width: 72%; height: 250px; border-width: 12px; } .cs-intro-content { padding: 26px 22px; } .cs-intro-content::before { display: none; } .cs-intro-kicker { margin-bottom: 3px; } .cs-intro-title { margin-bottom: 24px; line-height: 1.15; } .cs-intro-description { margin-bottom: 22px; line-height: 1.55; } .cs-intro-description p { margin-bottom: 5px; } .cs-intro-points { grid-template-columns: 1fr; gap: 9px; } }

/*--------------------------------------------------------------
# PETITS MOBILES
--------------------------------------------------------------*/
@media screen and (max-width: 480px) { .cs-intro { padding: 60px 16px; } .cs-intro-container { gap: 30px; } .cs-intro-visual { min-height: 360px; } .cs-intro-image-back { width: 82%; height: 270px; } .cs-intro-image-front { width: 78%; height: 210px; border-width: 10px; } .cs-intro-content { padding: 24px 18px; } .cs-intro-title { margin-bottom: 22px; } }

/*--------------------------------------------------------------
# SECTION SERVICE
--------------------------------------------------------------*/
.cs-services { padding: 110px 30px; background: #0F5163; }

.cs-services-container { max-width: 1320px; margin: 0 auto; }

/*--------------------------------------------------------------
# TITRE SECTION
--------------------------------------------------------------*/
.cs-services-heading { max-width: 780px; margin: 0 auto 50px; text-align: center; }

.cs-services-title { color: #FFFFFF; line-height: 1.15; }

.cs-services-title-line { width: 70px; height: 2px; margin: 18px auto 20px; background: #FFFFFF; }

.cs-services-intro { color: #F0F0F0; line-height: 1.7; }

.cs-services-intro p { margin: 0; }

/*--------------------------------------------------------------
# GRILLE
--------------------------------------------------------------*/
.cs-services-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 18px; }

.cs-service-card:nth-child(1), .cs-service-card:nth-child(2), .cs-service-card:nth-child(3) { grid-column: span 2; }

.cs-service-card:nth-child(4), .cs-service-card:nth-child(5) { grid-column: span 3; }

/*--------------------------------------------------------------
# CARTE
--------------------------------------------------------------*/
.cs-service-card { position: relative; display: flex; align-items: flex-end; min-height: 470px; overflow: hidden; background-position: center; background-size: cover; background-repeat: no-repeat; color: #FFFFFF; text-decoration: none; isolation: isolate; }

.cs-service-card::before { position: absolute; inset: 0; z-index: -2; background: inherit; background-position: center; background-size: cover; content: ""; transition: transform .55s ease; }

/*--------------------------------------------------------------
# OVERLAY
--------------------------------------------------------------*/
.cs-service-card-overlay { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(15, 15, 15, 0.18) 0%, rgba(15, 15, 15, 0.32) 38%, rgba(10, 10, 10, 0.88) 100%); transition: background .4s ease; }

/*--------------------------------------------------------------
# CONTENU
--------------------------------------------------------------*/
.cs-service-card-content { display: grid; grid-template-rows: 54px 145px auto; width: 100%; min-height: 265px; padding: 34px; }

/*--------------------------------------------------------------
# TITRE CARTE
--------------------------------------------------------------*/
.cs-service-card-title { display: flex; align-items: flex-start; margin: 0; color: #FFFFFF; line-height: 1.15; }

.cs-service-card-title p { margin: 0; }

/*--------------------------------------------------------------
# DESCRIPTION
--------------------------------------------------------------*/
.cs-service-card-description-wrap { display: flex; align-items: flex-start; width: 100%; margin: 0; }

.cs-service-card-description { width: 100%; color: #F0F0F0; line-height: 1.55; }

.cs-service-card-description p { margin-top: 0; margin-bottom: 5px; }

.cs-service-card-description p:last-child { margin-bottom: 0; }

/*--------------------------------------------------------------
# LIEN
--------------------------------------------------------------*/
.cs-service-card-link { display: inline-flex; align-items: flex-end; align-self: end; justify-self: start; gap: 10px; margin: 0; color: #FFFFFF; text-transform: uppercase; letter-spacing: .08em; }

.cs-service-card-link span { color: #FFFFFF; transition: transform .3s ease; }

/*--------------------------------------------------------------
# HOVER
--------------------------------------------------------------*/
.cs-service-card:hover::before { transform: scale(1.05); }

.cs-service-card:hover .cs-service-card-overlay { background: linear-gradient(180deg, rgba(15, 81, 99, 0.25) 0%, rgba(15, 81, 99, 0.42) 40%, rgba(8, 48, 60, 0.94) 100%); }

.cs-service-card:hover .cs-service-card-title, .cs-service-card:hover .cs-service-card-title *, .cs-service-card:hover .cs-service-card-description, .cs-service-card:hover .cs-service-card-description *, .cs-service-card:hover .cs-service-card-link, .cs-service-card:hover .cs-service-card-link span { color: #FFFFFF !important; }

.cs-service-card:hover .cs-service-card-link span { transform: translateX(5px); }

.cs-service-card:focus-visible { outline: 3px solid #FFFFFF; outline-offset: 4px; }

/*--------------------------------------------------------------
# TABLETTE
--------------------------------------------------------------*/
@media screen and (max-width: 991px) { .cs-services { padding: 90px 25px; } .cs-services-grid { grid-template-columns: repeat(2, 1fr); } .cs-service-card:nth-child(1), .cs-service-card:nth-child(2), .cs-service-card:nth-child(3), .cs-service-card:nth-child(4) { grid-column: span 1; } .cs-service-card:nth-child(5) { grid-column: span 2; } .cs-service-card { min-height: 440px; } .cs-service-card-content { grid-template-rows: 52px 140px auto; min-height: 255px; padding: 30px; } }

/*--------------------------------------------------------------
# MOBILE
--------------------------------------------------------------*/
@media screen and (max-width: 767px) { .cs-services { padding: 70px 20px; } .cs-services-heading { margin-bottom: 38px; } .cs-services-title-line { width: 55px; margin: 14px auto 18px; } .cs-services-grid { grid-template-columns: 1fr; gap: 14px; } .cs-service-card:nth-child(1), .cs-service-card:nth-child(2), .cs-service-card:nth-child(3), .cs-service-card:nth-child(4), .cs-service-card:nth-child(5) { grid-column: span 1; } .cs-service-card { min-height: 390px; } .cs-service-card-content { display: flex; flex-direction: column; min-height: 0; padding: 28px; } .cs-service-card-title { min-height: 0; margin-bottom: 12px; } .cs-service-card-description-wrap { min-height: 0; margin-bottom: 22px; } .cs-service-card-link { align-self: flex-start; } }

/*--------------------------------------------------------------
# PETITS MOBILES
--------------------------------------------------------------*/
@media screen and (max-width: 480px) { .cs-services { padding: 60px 16px; } .cs-service-card { min-height: 360px; } .cs-service-card-content { padding: 24px; } }

/*--------------------------------------------------------------
# ACCESSIBILITÉ
--------------------------------------------------------------*/
@media (prefers-reduced-motion: reduce) { .cs-service-card::before, .cs-service-card-overlay, .cs-service-card-link span { transition: none; } .cs-service-card:hover::before { transform: none; } }

/* ============================================================ BLOC CARTE ============================================================ */
/*--------------------------------------------------------------
# SECTION
--------------------------------------------------------------*/
.cs-menu-teaser { position: relative; padding: 110px 30px 135px; background: #F0F0F0; overflow: hidden; }

/* Trait vertical derrière l'image */
.cs-menu-teaser::after { position: absolute; top: 0; right: 14%; bottom: 0; z-index: 0; width: 7px; background: #0F5163; content: ""; }

.cs-menu-teaser-container { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1fr; align-items: stretch; max-width: 1320px; margin: 0 auto; }

/*--------------------------------------------------------------
# CONTENU GAUCHE
--------------------------------------------------------------*/
.cs-menu-teaser-content { display: flex; flex-direction: column; justify-content: center; padding: 70px 65px; background: #FFFFFF; color: #353535; }

/*--------------------------------------------------------------
# SURTITRE
--------------------------------------------------------------*/
.cs-menu-teaser-kicker { margin: 0; color: #0F5163; }

.cs-menu-teaser-kicker p { margin: 0 !important; }

/*--------------------------------------------------------------
# TITRE
--------------------------------------------------------------*/
.cs-menu-teaser-title { max-width: 520px; margin-top: 0; margin-bottom: 26px; color: #353535; line-height: 1.1; }

.cs-menu-teaser-title p { margin-top: 0 !important; margin-bottom: 0 !important; }

/*--------------------------------------------------------------
# TEXTES
--------------------------------------------------------------*/
.cs-menu-teaser-description, .cs-menu-teaser-secondary-text { max-width: 560px; color: #353535; line-height: 1.65; }

.cs-menu-teaser-description { margin-bottom: 12px; }

.cs-menu-teaser-secondary-text { margin-bottom: 42px; }

.cs-menu-teaser-description p, .cs-menu-teaser-secondary-text p { margin-top: 0; margin-bottom: 6px; }

.cs-menu-teaser-description p:last-child, .cs-menu-teaser-secondary-text p:last-child { margin-bottom: 0; }

/*--------------------------------------------------------------
# LISTE PERSONNALISÉE
--------------------------------------------------------------*/
.cs-menu-teaser-secondary-text ul { display: grid; grid-template-columns: 1fr 1fr; gap: 9px 20px; margin: 16px 0 0; padding: 0; list-style: none; }

.cs-menu-teaser-secondary-text li { position: relative; margin: 0; padding-left: 23px; color: #353535; line-height: 1.5; }

.cs-menu-teaser-secondary-text li::before { position: absolute; top: .65em; left: 0; width: 10px; height: 2px; background: #0F5163; content: ""; }

/*--------------------------------------------------------------
# BOUTONS
--------------------------------------------------------------*/
.cs-menu-teaser-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; width: 100%; }

.cs-menu-teaser-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 58px; padding: 14px 18px; border-radius: 0; text-align: center; text-decoration: none; transition: background-color .3s ease, border-color .3s ease, color .3s ease, transform .3s ease; }

/* Neutralisation du contenu généré par le CMS */
.cs-menu-teaser-btn-label, .cs-menu-teaser-btn-label p, .cs-menu-teaser-btn-label span, .cs-menu-teaser-btn-label strong { margin: 0 !important; padding: 0; color: inherit !important; line-height: 1.3; }

.cs-menu-teaser-btn svg { width: 18px; height: 18px; flex: 0 0 auto; color: inherit; transition: transform .3s ease; }

/*--------------------------------------------------------------
# BOUTON PRINCIPAL
--------------------------------------------------------------*/
.cs-menu-teaser-btn-primary { border: 1px solid #0F5163; background: #0F5163; color: #FFFFFF; }

/*--------------------------------------------------------------
# BOUTON SECONDAIRE
--------------------------------------------------------------*/
.cs-menu-teaser-btn-secondary { border: 1px solid #0F5163; background: transparent; color: #0F5163; }

/*--------------------------------------------------------------
# HOVER BOUTONS
--------------------------------------------------------------*/
.cs-menu-teaser-btn-primary:hover { border-color: #353535; background: #353535; color: #FFFFFF; transform: translateY(-2px); }

.cs-menu-teaser-btn-secondary:hover { border-color: #0F5163; background: #0F5163; color: #FFFFFF; transform: translateY(-2px); }

.cs-menu-teaser-btn:hover .cs-menu-teaser-btn-label, .cs-menu-teaser-btn:hover .cs-menu-teaser-btn-label *, .cs-menu-teaser-btn:hover p, .cs-menu-teaser-btn:hover span { color: inherit !important; }

.cs-menu-teaser-btn-primary:hover svg { transform: translateX(4px); }

.cs-menu-teaser-btn-secondary:hover svg { transform: translateY(3px); }

.cs-menu-teaser-btn:focus-visible { outline: 3px solid #0F5163; outline-offset: 4px; }

/*--------------------------------------------------------------
# IMAGE DROITE
--------------------------------------------------------------*/
.cs-menu-teaser-visual { position: relative; z-index: 1; min-height: 620px; overflow: hidden; }

.cs-menu-teaser-visual img { display: block; width: 100%; height: 100%; min-height: 620px; object-fit: cover; }

/*--------------------------------------------------------------
# VAGUE BASSE
--------------------------------------------------------------*/
.cs-menu-teaser-wave { position: absolute; right: 0; bottom: -1px; left: 0; z-index: 3; height: 70px; pointer-events: none; }

.cs-menu-teaser-wave svg { display: block; width: 100%; height: 100%; }

.cs-menu-teaser-wave path { fill: #FFFFFF; }

/* ============================================================ RESPONSIVE ============================================================ */
/*--------------------------------------------------------------
# TABLETTE
--------------------------------------------------------------*/
@media screen and (max-width: 991px) { .cs-menu-teaser { padding: 90px 25px 115px; } .cs-menu-teaser::after { right: 95px; width: 6px; } .cs-menu-teaser-container { grid-template-columns: 1fr; max-width: 760px; } .cs-menu-teaser-content { padding: 60px 50px; } .cs-menu-teaser-secondary-text { margin-bottom: 38px; } .cs-menu-teaser-visual { min-height: 500px; } .cs-menu-teaser-visual img { min-height: 500px; } .cs-menu-teaser-wave { height: 60px; } }

/*--------------------------------------------------------------
# MOBILE
--------------------------------------------------------------*/
@media screen and (max-width: 767px) { .cs-menu-teaser { padding: 70px 20px 100px; } .cs-menu-teaser::after { right: 60px; width: 5px; } .cs-menu-teaser-content { padding: 45px 30px; } .cs-menu-teaser-kicker { margin: 0; } .cs-menu-teaser-title { margin-top: 0; margin-bottom: 22px; line-height: 1.15; } .cs-menu-teaser-secondary-text { margin-bottom: 34px; } .cs-menu-teaser-secondary-text ul { grid-template-columns: 1fr; gap: 8px; } .cs-menu-teaser-actions { grid-template-columns: 1fr 1fr; gap: 10px; } .cs-menu-teaser-btn { min-height: 64px; padding: 12px 10px; } .cs-menu-teaser-visual { min-height: 380px; } .cs-menu-teaser-visual img { min-height: 380px; } .cs-menu-teaser-wave { height: 52px; } }

/*--------------------------------------------------------------
# PETITS MOBILES
--------------------------------------------------------------*/
@media screen and (max-width: 480px) { .cs-menu-teaser { padding: 60px 16px 88px; } .cs-menu-teaser::after { right: 42px; } .cs-menu-teaser-content { padding: 38px 22px; } .cs-menu-teaser-secondary-text { margin-bottom: 32px; } .cs-menu-teaser-actions { gap: 8px; } .cs-menu-teaser-btn { min-height: 68px; padding: 10px 8px; gap: 7px; } .cs-menu-teaser-btn svg { width: 16px; height: 16px; } .cs-menu-teaser-visual { min-height: 320px; } .cs-menu-teaser-visual img { min-height: 320px; } .cs-menu-teaser-wave { height: 45px; } }

/*--------------------------------------------------------------
# ACCESSIBILITÉ
--------------------------------------------------------------*/
@media (prefers-reduced-motion: reduce) { .cs-menu-teaser-btn, .cs-menu-teaser-btn svg { transition: none; } .cs-menu-teaser-btn:hover { transform: none; } }

/* ============================================================ BLOC AVIS CLIENTS ============================================================ */
/*--------------------------------------------------------------
# FOND GÉNÉRAL
--------------------------------------------------------------*/
.photoTitleText, .googleReviews-div { background: #FFFFFF !important; }

/*--------------------------------------------------------------
# TITRE
--------------------------------------------------------------*/
.photoTitleText { padding: 80px 20px 25px; text-align: center; }

.photoTitleText .titles { position: relative; display: inline-block; padding-bottom: 18px; }

.photoTitleText .titles::after { position: absolute; bottom: 0; left: 50%; width: 70px; height: 2px; background: #0F5163; content: ""; transform: translateX(-50%); }

.photoTitleText h2 { margin: 0; }

/*--------------------------------------------------------------
# ESPACEMENT DU WIDGET
--------------------------------------------------------------*/
.googleReviews-div { margin-bottom: 0 !important; padding: 25px 0 90px; }

.googleReviews-div > .container { max-width: 1180px; margin: 0 auto 45px !important; padding: 0 20px; }

/*--------------------------------------------------------------
# CARTE GOOGLE PRINCIPALE
--------------------------------------------------------------*/
.googleReviews-div > .container > .card { padding: 20px 26px !important; border: 0 !important; border-left: 5px solid #0F5163 !important; border-radius: 0 !important; background: #F0F0F0 !important; box-shadow: none !important; }

.googleReviews-div > .container > .card h3 { margin-bottom: 6px; color: #353535; }

.googleReviews-div .avatar-google-place { border-radius: 0 !important; }

/*--------------------------------------------------------------
# NOTE GOOGLE
--------------------------------------------------------------*/
.googleReviews-div #place-rating { color: #353535; }

.googleReviews-div .star { color: #0F5163 !important; }

/*--------------------------------------------------------------
# BOUTON VOIR LA FICHE
--------------------------------------------------------------*/
.googleReviews-div .button_homepageScreen { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; margin: 0; padding: 13px 25px; border: 1px solid #0F5163; border-radius: 0 !important; background: #0F5163; color: #FFFFFF !important; text-decoration: none; transition: background-color .3s ease, border-color .3s ease, color .3s ease, transform .3s ease; }

.googleReviews-div .button_homepageScreen i { color: #FFFFFF !important; transition: color .3s ease; }

.googleReviews-div .button_homepageScreen:hover { border-color: #353535; background: #353535; color: #FFFFFF !important; transform: translateY(-2px); }

.googleReviews-div .button_homepageScreen:hover i { color: #FFFFFF !important; }

/* Neutralisation de l'effet grow existant */
.googleReviews-div .grow:hover { scale: none !important; }

/*--------------------------------------------------------------
# CARTES AVIS
--------------------------------------------------------------*/
.googleReviews-div #google-reviews-widget .card { height: 100%; margin-bottom: 20px !important; border: 0 !important; border-top: 4px solid #0F5163 !important; border-radius: 0 !important; background: #F0F0F0 !important; box-shadow: none !important; }

.googleReviews-div #google-reviews-widget .owl-item { display: flex; height: auto; }

.googleReviews-div #google-reviews-widget .owl-item > .card { width: 100%; }

/*--------------------------------------------------------------
# EN-TÊTE DES AVIS
--------------------------------------------------------------*/
.googleReviews-div #google-reviews-widget .card > .d-flex { justify-content: flex-start !important; padding: 18px 20px 0; text-align: left; }

.googleReviews-div .avatar-google-reviews { width: 42px !important; height: 42px !important; object-fit: contain; }

.googleReviews-div #google-reviews-widget small { color: #6b6b6b !important; }

/*--------------------------------------------------------------
# CONTENU DES AVIS
--------------------------------------------------------------*/
.googleReviews-div #google-reviews-widget .card-body { display: flex; flex-direction: column; padding: 14px 20px 24px; }

.googleReviews-div #google-reviews-widget .card-text { margin-top: 14px; margin-bottom: 0; color: #353535; line-height: 1.6; }

/*--------------------------------------------------------------
# NAVIGATION DU CARROUSEL
--------------------------------------------------------------*/
.googleReviews-div .owl-nav { display: flex; justify-content: center; gap: 10px; margin-top: 12px; }

.googleReviews-div .owl-nav button.owl-prev, .googleReviews-div .owl-nav button.owl-next { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin: 0; border: 1px solid #0F5163 !important; border-radius: 0 !important; background: #FFFFFF !important; color: #0F5163 !important; transition: background-color .3s ease, color .3s ease, border-color .3s ease; }

.googleReviews-div .owl-nav button.owl-prev span, .googleReviews-div .owl-nav button.owl-next span { color: #0F5163 !important; line-height: 1; }

.googleReviews-div .owl-nav button.owl-prev:hover, .googleReviews-div .owl-nav button.owl-next:hover { border-color: #0F5163 !important; background: #0F5163 !important; color: #FFFFFF !important; }

.googleReviews-div .owl-nav button.owl-prev:hover span, .googleReviews-div .owl-nav button.owl-next:hover span { color: #FFFFFF !important; }

/*--------------------------------------------------------------
# SUPPRESSION DES OMBRES BOOTSTRAP
--------------------------------------------------------------*/
.googleReviews-div .shadow, .googleReviews-div .shadow-sm, .googleReviews-div .shadow-lg { box-shadow: none !important; }

/*--------------------------------------------------------------
# ACCESSIBILITÉ
--------------------------------------------------------------*/
.googleReviews-div a:focus-visible, .googleReviews-div button:focus-visible { outline: 3px solid #0F5163; outline-offset: 4px; }

/* ============================================================ RESPONSIVE ============================================================ */
/*--------------------------------------------------------------
# TABLETTE
--------------------------------------------------------------*/
@media screen and (max-width: 991px) { .photoTitleText { padding: 70px 20px 22px; } .googleReviews-div { padding: 20px 0 75px; } .googleReviews-div > .container > .card { padding: 18px !important; } .googleReviews-div .button_homepageScreen { margin-top: 14px; } }

/*--------------------------------------------------------------
# MOBILE
--------------------------------------------------------------*/
@media screen and (max-width: 767px) { .photoTitleText { padding: 60px 16px 18px; } .photoTitleText .titles { padding-bottom: 14px; } .photoTitleText .titles::after { width: 55px; } .googleReviews-div { padding: 18px 0 65px; } .googleReviews-div > .container { padding: 0 16px; margin-bottom: 32px !important; } .googleReviews-div > .container > .card { padding: 16px !important; } .googleReviews-div .button_homepageScreen { width: 100%; } .googleReviews-div #google-reviews-widget .card { margin-right: 12px !important; margin-left: 12px !important; } }

/*--------------------------------------------------------------
# ACCESSIBILITÉ MOUVEMENTS
--------------------------------------------------------------*/
@media (prefers-reduced-motion: reduce) { .googleReviews-div .button_homepageScreen, .googleReviews-div .owl-nav button { transition: none; } .googleReviews-div .button_homepageScreen:hover { transform: none; } }

/* ============================================================ CTA - COCKTAILS ET SAVEURS ============================================================ */
.cta_banner .ctaLinks-button { display: inline-flex; align-items: center; justify-content: center; min-height: 54px; padding: 14px 28px !important; margin: 8px 0 0 !important; border: 1px solid #0F5163; border-radius: 0 !important; background: #0F5163; color: #FFFFFF !important; text-decoration: none; transition: background-color .3s ease, border-color .3s ease, color .3s ease, transform .3s ease; }

/* Supprime la marge générée par le p */
.cta_banner .ctaLinks-button p { margin: 0 !important; padding: 0 !important; color: #FFFFFF !important; }

.cta_banner .ctaLinks-button p span { color: #FFFFFF !important; }

/* Hover */
.cta_banner .ctaLinks-button:hover { border-color: #FFFFFF; background: #FFFFFF; color: #0F5163 !important; transform: translateY(-2px); }

.cta_banner .ctaLinks-button:hover p, .cta_banner .ctaLinks-button:hover p span { color: #0F5163 !important; }

/* Focus clavier */
.cta_banner .ctaLinks-button:focus-visible { outline: 3px solid #FFFFFF; outline-offset: 4px; }

/* Responsive */
@media screen and (max-width: 767px) { .cta_banner .ctaLinks-button { width: 100%; max-width: 340px; margin-top: 8px !important; } }

@media (prefers-reduced-motion: reduce) { .cta_banner .ctaLinks-button { transition: none; } .cta_banner .ctaLinks-button:hover { transform: none; } }

/* ============================================================ GALERIE INFINIE ============================================================ */
.infinite-gallery { position: relative; width: 100%; padding: 50px 0 80px; overflow: hidden; background: #FFFFFF; }

/*--------------------------------------------------------------
# TITRE
--------------------------------------------------------------*/
.infinite-gallery__title { width: 100%; max-width: 1200px; margin: 0 auto 35px; padding: 0 20px; box-sizing: border-box; text-align: center; }

.infinite-gallery__title h2, .infinite-gallery__title h3, .infinite-gallery__title p { margin: 0 !important; text-align: center !important; }

.infinite-gallery__title::after { display: block; width: 65px; height: 2px; margin: 16px auto 0; background: #0F5163; content: ""; }

/*--------------------------------------------------------------
# GALERIE
--------------------------------------------------------------*/
.gallery-track { display: flex; gap: 20px; width: max-content; animation: scrollGallery 60s linear infinite; }

.gallery-item { flex: 0 0 auto; }

.gallery-item a { display: block; }

.gallery-item img { display: block; max-height: 400px; aspect-ratio: 1 / 1; object-fit: cover; }

@keyframes scrollGallery { from { transform: translateX(0); }
  to { transform: translateX(-50%); } }

@media (hover: hover) and (pointer: fine) { .gallery-track:hover { animation-play-state: paused; } }

/*--------------------------------------------------------------
# BOUTON DE REDIRECTION
--------------------------------------------------------------*/
.infinite-gallery__button-wrap { display: flex; justify-content: center; margin-top: 38px; padding: 0 20px; }

.infinite-gallery__button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 54px; padding: 14px 28px; border: 1px solid #0F5163; border-radius: 0; background: #0F5163; color: #FFFFFF !important; text-align: center; text-decoration: none; transition: background-color .3s ease, border-color .3s ease, color .3s ease, transform .3s ease; }

.infinite-gallery__button-label, .infinite-gallery__button-label p, .infinite-gallery__button-label span, .infinite-gallery__button-label strong { margin: 0 !important; padding: 0; color: inherit !important; }

.infinite-gallery__button svg { width: 18px; height: 18px; flex: 0 0 auto; color: #FFFFFF; transition: transform .3s ease; }

.infinite-gallery__button:hover { border-color: #353535; background: #353535; color: #FFFFFF !important; transform: translateY(-2px); }

.infinite-gallery__button:hover .infinite-gallery__button-label, .infinite-gallery__button:hover .infinite-gallery__button-label *, .infinite-gallery__button:hover svg { color: #FFFFFF !important; }

.infinite-gallery__button:hover svg { transform: translateX(4px); }

.infinite-gallery__button:focus-visible { outline: 3px solid #0F5163; outline-offset: 4px; }

/* ============================================================ MOBILE ============================================================ */
@media screen and (max-width: 767px) { .infinite-gallery { overflow: visible; padding: 42px 20px 60px; } .infinite-gallery__title { margin: 0 auto 25px; padding: 0; } .infinite-gallery__title::after { width: 55px; margin-top: 13px; } .gallery-track { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; width: 100%; animation: none; transform: none; } .gallery-item { width: 100%; } .gallery-item a { width: 100%; } .gallery-item img { width: 100%; max-height: none; aspect-ratio: 1 / 1; object-fit: cover; } .infinite-gallery__button-wrap { margin-top: 30px; padding: 0; } .infinite-gallery__button { width: 100%; max-width: 360px; } }

/* ============================================================ LIGHTBOX ============================================================ */
.lightbox { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding: 40px; box-sizing: border-box; background: rgba(0, 0, 0, 0.9); opacity: 0; pointer-events: none; transition: opacity .3s ease; }

.lightbox.active { opacity: 1; pointer-events: auto; }

.lightbox-image { width: auto; height: auto; max-width: 90vw; max-height: 90vh; object-fit: contain; }

.lightbox-close { position: absolute; top: 20px; right: 25px; width: 45px; height: 45px; padding: 0; border: 0; background: transparent; color: #FFFFFF; cursor: pointer; line-height: 1; }

@media (hover: hover) and (pointer: fine) { .lightbox-close:hover { color: #0F5163; } }

@media screen and (max-width: 767px) { .lightbox { padding: 20px; } .lightbox-close { top: 12px; right: 16px; } }

/* ============================================================ ACCESSIBILITÉ ============================================================ */
@media (prefers-reduced-motion: reduce) { .gallery-track { animation: none; } .infinite-gallery__button, .infinite-gallery__button svg, .lightbox { transition: none; } .infinite-gallery__button:hover { transform: none; } }

/* ============================================================ BLOC RÉSEAUX SOCIAUX ============================================================ */
.cs-social { padding: 90px 30px; background: #FFFFFF; }

.cs-social-container { max-width: 1200px; margin: 0 auto; }

/*--------------------------------------------------------------
# TITRE
--------------------------------------------------------------*/
.cs-social-heading { max-width: 760px; margin: 0 auto 40px; text-align: center; }

.cs-social-title { color: #353535; line-height: 1.15; }

.cs-social-title p { margin: 0 !important; }

.cs-social-title-line { width: 65px; height: 2px; margin: 16px auto 18px; background: #0F5163; }

.cs-social-description { color: #353535; line-height: 1.65; }

.cs-social-description p { margin: 0; }

/*--------------------------------------------------------------
# GRILLE
--------------------------------------------------------------*/
.cs-social-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }

/*--------------------------------------------------------------
# CARTES
--------------------------------------------------------------*/
.cs-social-card { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 24px; min-height: 210px; padding: 38px; border: 1px solid #0F5163; border-radius: 0; background: #0F5163; color: #FFFFFF; text-decoration: none; overflow: hidden; transition: background-color .3s ease, border-color .3s ease, transform .3s ease; }

.cs-social-card:hover { border-color: #353535; background: #353535; transform: translateY(-3px); }

.cs-social-card:focus-visible { outline: 3px solid #0F5163; outline-offset: 4px; }

/*--------------------------------------------------------------
# ICÔNES
--------------------------------------------------------------*/
.cs-social-icon { display: flex; align-items: center; justify-content: center; width: 62px; height: 62px; border: 1px solid rgba(255, 255, 255, 0.45); color: #FFFFFF; }

.cs-social-icon i { color: #FFFFFF; }

/*--------------------------------------------------------------
# CONTENU
--------------------------------------------------------------*/
.cs-social-card-content { min-width: 0; }

.cs-social-card-kicker { margin-bottom: 3px; color: rgba(255, 255, 255, 0.75); }

.cs-social-card-kicker p { margin: 0 !important; color: inherit; }

.cs-social-card-title { margin-bottom: 10px; color: #FFFFFF; line-height: 1.15; }

.cs-social-card-title p { margin: 0 !important; color: #FFFFFF; }

.cs-social-card-text { max-width: 420px; color: #F0F0F0; line-height: 1.55; }

.cs-social-card-text p { margin: 0 !important; color: #F0F0F0; }

/*--------------------------------------------------------------
# FLÈCHE
--------------------------------------------------------------*/
.cs-social-arrow { display: flex; align-items: center; justify-content: center; color: #FFFFFF; transition: transform .3s ease; }

.cs-social-arrow i { color: #FFFFFF; }

.cs-social-card:hover .cs-social-arrow { transform: translate(4px, -4px); }

/* ============================================================ TABLETTE ============================================================ */
@media screen and (max-width: 991px) { .cs-social { padding: 75px 25px; } .cs-social-card { grid-template-columns: auto 1fr; min-height: 220px; padding: 32px; } .cs-social-arrow { position: absolute; top: 28px; right: 28px; } }

/* ============================================================ MOBILE ============================================================ */
@media screen and (max-width: 767px) { .cs-social { padding: 60px 20px; } .cs-social-heading { margin-bottom: 30px; } .cs-social-title-line { width: 55px; margin: 13px auto 16px; } .cs-social-grid { grid-template-columns: 1fr; gap: 14px; } .cs-social-card { grid-template-columns: auto 1fr; min-height: 0; padding: 28px; gap: 18px; } .cs-social-icon { width: 54px; height: 54px; } .cs-social-arrow { top: 22px; right: 22px; } }

/* ============================================================ PETITS MOBILES ============================================================ */
@media screen and (max-width: 480px) { .cs-social { padding: 55px 16px; } .cs-social-card { grid-template-columns: 1fr; padding: 24px; } .cs-social-icon { width: 50px; height: 50px; } .cs-social-arrow { top: 22px; right: 22px; } }

/* ============================================================ ACCESSIBILITÉ ============================================================ */
@media (prefers-reduced-motion: reduce) { .cs-social-card, .cs-social-arrow { transition: none; } .cs-social-card:hover { transform: none; } }

/* ============================================================ HERO PAGES SECONDAIRES - COCKTAILS ET SAVEURS ============================================================ */
#secondaires { height: 0; }

#secondaires + style + #fullHeight { height: 85vh; min-height: unset !important; }

.spacer { display: none; }

/*--------------------------------------------------------------
# HERO
--------------------------------------------------------------*/
#fullHeight.carousel-homepage { position: relative; overflow: hidden; }

/* Overlay léger pour garder les photos bien visibles */
#fullHeight .carousel-inner-homepage::after { position: absolute; inset: 0; z-index: 1; background: rgba(20, 20, 20, 0.34); content: ""; pointer-events: none; }

/*--------------------------------------------------------------
# CONTENU
--------------------------------------------------------------*/
#fullHeight .bloc-slider-homepage { position: absolute; top: 50%; left: 50%; z-index: 3; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; max-width: 1000px; padding: 30px; text-align: center; transform: translate(-50%, -50%); }

/*--------------------------------------------------------------
# LOGO
--------------------------------------------------------------*/
#fullHeight .sliderLogoContainer { width: 190px; max-width: 190px; margin: 0 auto 20px !important; }

#fullHeight .fondDegradeLogo { display: block; width: 100%; max-width: 190px; height: auto; margin: 0 auto; object-fit: contain; }

/*--------------------------------------------------------------
# TITRE
--------------------------------------------------------------*/
#fullHeight .titleText { max-width: 900px; margin-top: 0 !important; margin-bottom: 28px !important; color: #FFFFFF !important; line-height: 1.1; }

#fullHeight .titleText h1, #fullHeight .titleText h1 span { margin: 0 !important; color: #FFFFFF !important; letter-spacing: 0 !important; }

/*--------------------------------------------------------------
# BOUTON
--------------------------------------------------------------*/
#fullHeight .button_homepageScreen { display: inline-flex; align-items: center; justify-content: center; min-height: 54px; margin: 0 !important; padding: 14px 28px !important; border: 1px solid #0F5163 !important; border-radius: 0 !important; background: #0F5163 !important; box-shadow: none !important; color: #FFFFFF !important; text-decoration: none; transition: background-color .3s ease, border-color .3s ease, color .3s ease, transform .3s ease; }

#fullHeight .button_homepageScreen span { margin: 0 !important; color: #FFFFFF !important; }

#fullHeight .button_homepageScreen:hover { border-color: #FFFFFF !important; background: #FFFFFF !important; color: #0F5163 !important; transform: translateY(-2px); }

#fullHeight .button_homepageScreen:hover span { color: #0F5163 !important; }

#fullHeight .button_homepageScreen:focus-visible { outline: 3px solid #FFFFFF; outline-offset: 4px; }

/*--------------------------------------------------------------
# IMAGES DU SLIDER
--------------------------------------------------------------*/
#fullHeight .carousel-item-homepage, #fullHeight .carousel-item-homepage img { height: 100%; }

#fullHeight .carousel-item-homepage img { object-fit: cover; object-position: center; }

/*--------------------------------------------------------------
# LOTTIE
--------------------------------------------------------------*/
#fullHeight .lottie-scroll { position: absolute; bottom: 18px; left: 50%; z-index: 4; transform: translateX(-50%); }

/* ============================================================ TABLETTE ============================================================ */
@media screen and (max-width: 991px) { #fullHeight .bloc-slider-homepage { max-width: 850px; padding: 25px; } #fullHeight .sliderLogoContainer { width: 165px; max-width: 165px; margin-bottom: 18px !important; } #fullHeight .fondDegradeLogo { max-width: 165px; } #fullHeight .titleText { margin-bottom: 24px !important; } }

/* ============================================================ MOBILE ============================================================ */
@media screen and (max-width: 767px) { #fullHeight .bloc-slider-homepage { padding: 20px; } #fullHeight .sliderLogoContainer { width: 140px; max-width: 140px; margin-bottom: 16px !important; } #fullHeight .fondDegradeLogo { max-width: 140px; } #fullHeight .titleText { margin-bottom: 22px !important; line-height: 1.15; } #fullHeight .button_homepageScreen { width: 100%; max-width: 340px; } #fullHeight .lottie-scroll { bottom: 12px; } }

/* ============================================================ PETITS MOBILES ============================================================ */
@media screen and (max-width: 480px) { #fullHeight .sliderLogoContainer { width: 125px; max-width: 125px; } #fullHeight .fondDegradeLogo { max-width: 125px; } #fullHeight .bloc-slider-homepage { padding-right: 16px; padding-left: 16px; } }

/* ============================================================ ACCESSIBILITÉ ============================================================ */
@media (prefers-reduced-motion: reduce) { #fullHeight .button_homepageScreen { transition: none; } #fullHeight .button_homepageScreen:hover { transform: none; } }

/* ============================================================ BLOC MARIAGE - COCKTAILS ET SAVEURS ============================================================ */
.phototext-section { padding-top: 90px !important; padding-bottom: 90px !important; background: #FFFFFF !important; }

/* ============================================================ CONTENEUR ============================================================ */
.phototext-section .container { max-width: 1280px; }

/* ============================================================ TITRE ============================================================ */
.phototext-subtitle { position: relative; margin-bottom: 30px !important; padding-bottom: 16px; }

.phototext-subtitle::after { position: absolute; bottom: 0; left: 0; width: 65px; height: 2px; background: #0F5163; content: ""; }

.phototext-subtitle h2, .phototext-subtitle h2 span { margin: 0 !important; color: #0F5163 !important; }

/* ============================================================ TEXTE ============================================================ */
.phototext-description { max-width: 590px; color: #353535 !important; line-height: 1.65; }

.phototext-description p, .phototext-description span { color: #353535 !important; }

.phototext-description > p { margin-bottom: 25px; }

.phototext-description ul { margin: 0; padding-left: 0; list-style: none; }

.phototext-description li { position: relative; margin-bottom: 22px; padding-left: 25px; }

.phototext-description li:last-child { margin-bottom: 0; }

.phototext-description li::before { position: absolute; top: 10px; left: 0; width: 10px; height: 2px; background: #0F5163; content: ""; }

.phototext-description li p { margin: 0 !important; }

.phototext-description li span[style*="font-weight: 600"] { color: #0F5163 !important; }

/* ============================================================ IMAGE / CAROUSEL CARRÉ ============================================================ */
.phototext-carousel { width: 100%; max-width: 580px; margin-left: auto; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }

.phototext-carousel.rounded-3 { border-radius: 0 !important; }

.phototext-carousel-inner { width: 100%; aspect-ratio: 1 / 1; border-radius: 0 !important; overflow: hidden; }

.phototext-carousel-item { width: 100%; height: 100%; border-radius: 0 !important; }

.phototext-carousel-image { display: block; width: 100%; height: 100%; aspect-ratio: 1 / 1; border-radius: 0 !important; object-fit: cover; object-position: center; }

/* ============================================================ FLÈCHES CAROUSEL ============================================================ */
.phototext-carousel .carousel-control-prev, .phototext-carousel .carousel-control-next { top: 50%; bottom: auto; width: 48px; height: 48px; padding: 0; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; opacity: .9; transform: translateY(-50%); }

.phototext-carousel .carousel-control-prev { left: 16px; }

.phototext-carousel .carousel-control-next { right: 16px; }

.phototext-carousel .carousel-control-prev:hover, .phototext-carousel .carousel-control-next:hover, .phototext-carousel .carousel-control-prev:focus, .phototext-carousel .carousel-control-next:focus { border: 0 !important; background: transparent !important; box-shadow: none !important; opacity: 1; }

.phototext-carousel .carousel-control-prev-icon, .phototext-carousel .carousel-control-next-icon { background-color: transparent !important; }

/* ============================================================ TABLETTE ============================================================ */
@media screen and (max-width: 991px) { .phototext-section { padding-top: 70px !important; padding-bottom: 70px !important; } .phototext-content-row { row-gap: 45px !important; } .phototext-description { max-width: 100%; } .phototext-carousel { max-width: 650px; margin-right: auto; margin-left: auto; } }

/* ============================================================ MOBILE ============================================================ */
@media screen and (max-width: 767px) { .phototext-section { padding-top: 55px !important; padding-bottom: 55px !important; } .phototext-subtitle { margin-bottom: 25px !important; padding-bottom: 14px; } .phototext-subtitle::after { width: 55px; } .phototext-description > p { margin-bottom: 20px; } .phototext-description li { margin-bottom: 18px; } .phototext-carousel .carousel-control-prev, .phototext-carousel .carousel-control-next { width: 42px; height: 42px; } .phototext-carousel .carousel-control-prev { left: 10px; } .phototext-carousel .carousel-control-next { right: 10px; } }

/* ============================================================ BLOC PICTOGRAMMES - COCKTAILS ET SAVEURS ============================================================ */
.picto_card { width: 100%; }

/*--------------------------------------------------------------
# CONTENEUR GLOBAL
--------------------------------------------------------------*/
.picto_card > .row { width: 100%; max-width: 1050px; margin-right: auto !important; margin-left: auto !important; --bs-gutter-x: 22px; --bs-gutter-y: 20px; }

/*--------------------------------------------------------------
# COLONNES
--------------------------------------------------------------*/
.picto_card .col { display: flex; justify-content: center; }

/*--------------------------------------------------------------
# CARTES
--------------------------------------------------------------*/
.picto_card .svg-picto-card { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; width: 100%; padding: 18px 10px !important; background: none !important; border: 0 !important; box-shadow: none !important; }

/*--------------------------------------------------------------
# PICTOGRAMMES
--------------------------------------------------------------*/
.picto_card .svg-picto-card svg { display: block; width: 115px !important; height: 115px !important; flex: 0 0 auto; }

/*--------------------------------------------------------------
# TITRES
--------------------------------------------------------------*/
.picto_card .svg-picto-card .text-shadow { width: 100%; margin-top: 16px !important; padding: 0 !important; text-align: center; text-shadow: none !important; }

.picto_card .svg-picto-card .text-shadow p { margin: 0 !important; }

.picto_card .svg-picto-card .text-shadow span, .picto_card .svg-picto-card .text-shadow mark { color: #0F5163 !important; }

/* ============================================================ TABLETTE ============================================================ */
@media screen and (max-width: 991px) { .picto_card > .row { max-width: 820px; --bs-gutter-x: 18px; --bs-gutter-y: 16px; } .picto_card .svg-picto-card { padding: 15px 10px !important; } .picto_card .svg-picto-card svg { width: 105px !important; height: 105px !important; } .picto_card .svg-picto-card .text-shadow { margin-top: 14px !important; } }

/* ============================================================ MOBILE ============================================================ */
@media screen and (max-width: 767px) { .picto_card > .row { width: 100%; max-width: 500px; margin-top: 30px !important; margin-bottom: 30px !important; --bs-gutter-y: 10px; } .picto_card .svg-picto-card { padding: 12px 10px !important; } .picto_card .svg-picto-card svg { width: 95px !important; height: 95px !important; } .picto_card .svg-picto-card .text-shadow { margin-top: 12px !important; } }

/* ============================================================ BLOC TRAITEUR - COCKTAILS ET SAVEURS ============================================================ */
#traiteur.phototext-section { padding-top: 90px !important; padding-bottom: 90px !important; background: #0F5163 !important; }

/* ============================================================ CONTENEUR ============================================================ */
#traiteur .container { max-width: 1280px; }

/* ============================================================ INVERSION TEXTE / CAROUSEL ============================================================ */
#traiteur .phototext-media-col { order: 1; }

#traiteur .phototext-text-col { order: 2; }

/* ============================================================ TITRE ============================================================ */
#traiteur .phototext-subtitle { position: relative; margin-bottom: 30px !important; padding-bottom: 16px; }

#traiteur .phototext-subtitle::after { position: absolute; bottom: 0; left: 0; width: 65px; height: 2px; background: #FFFFFF; content: ""; }

#traiteur .phototext-subtitle h2, #traiteur .phototext-subtitle h2 span { margin: 0 !important; color: #FFFFFF !important; }

/* ============================================================ TEXTE ============================================================ */
#traiteur .phototext-description { max-width: 590px; color: #FFFFFF !important; line-height: 1.65; }

#traiteur .phototext-description p, #traiteur .phototext-description span, #traiteur .phototext-description strong, #traiteur .phototext-description li { color: #FFFFFF !important; }

#traiteur .phototext-description > p { margin-bottom: 25px; }

#traiteur .phototext-description ul { margin: 0; padding-left: 0; list-style: none; }

#traiteur .phototext-description li { position: relative; margin-bottom: 22px; padding-left: 25px; }

#traiteur .phototext-description li:last-child { margin-bottom: 0; }

#traiteur .phototext-description li::before { position: absolute; top: 10px; left: 0; width: 10px; height: 2px; background: #FFFFFF; content: ""; }

#traiteur .phototext-description li p { margin: 0 !important; }

#traiteur .phototext-description li span[style*="font-weight: 600"] { color: #FFFFFF !important; }

/* ============================================================ IMAGE / CAROUSEL CARRÉ ============================================================ */
#traiteur .phototext-carousel { width: 100%; max-width: 580px; margin-right: auto; margin-left: 0; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }

#traiteur .phototext-carousel.rounded-3 { border-radius: 0 !important; }

#traiteur .phototext-carousel-inner { width: 100%; aspect-ratio: 1 / 1; overflow: hidden; border-radius: 0 !important; }

#traiteur .phototext-carousel-item { width: 100%; height: 100%; border-radius: 0 !important; }

#traiteur .phototext-carousel-image { display: block; width: 100%; height: 100%; aspect-ratio: 1 / 1; border-radius: 0 !important; object-fit: cover; object-position: center; }

/* ============================================================ FLÈCHES CAROUSEL ============================================================ */
#traiteur .phototext-carousel .carousel-control-prev, #traiteur .phototext-carousel .carousel-control-next { top: 50%; bottom: auto; width: 48px; height: 48px; padding: 0; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; opacity: .9; transform: translateY(-50%); }

#traiteur .phototext-carousel .carousel-control-prev { left: 16px; }

#traiteur .phototext-carousel .carousel-control-next { right: 16px; }

#traiteur .phototext-carousel .carousel-control-prev:hover, #traiteur .phototext-carousel .carousel-control-next:hover, #traiteur .phototext-carousel .carousel-control-prev:focus, #traiteur .phototext-carousel .carousel-control-next:focus { border: 0 !important; background: transparent !important; box-shadow: none !important; opacity: 1; }

#traiteur .phototext-carousel .carousel-control-prev-icon, #traiteur .phototext-carousel .carousel-control-next-icon { background-color: transparent !important; }

/* ============================================================ TABLETTE ============================================================ */
@media screen and (max-width: 991px) { #traiteur.phototext-section { padding-top: 70px !important; padding-bottom: 70px !important; } #traiteur .phototext-content-row { row-gap: 45px !important; } #traiteur .phototext-description { max-width: 100%; } #traiteur .phototext-carousel { max-width: 650px; margin-right: auto; margin-left: auto; } }

/* ============================================================ MOBILE ============================================================ */
@media screen and (max-width: 767px) { #traiteur.phototext-section { padding-top: 55px !important; padding-bottom: 55px !important; } #traiteur .phototext-subtitle { margin-bottom: 25px !important; padding-bottom: 14px; } #traiteur .phototext-subtitle::after { width: 55px; } #traiteur .phototext-description > p { margin-bottom: 20px; } #traiteur .phototext-description li { margin-bottom: 18px; } #traiteur .phototext-carousel .carousel-control-prev, #traiteur .phototext-carousel .carousel-control-next { width: 42px; height: 42px; } #traiteur .phototext-carousel .carousel-control-prev { left: 10px; } #traiteur .phototext-carousel .carousel-control-next { right: 10px; } }

/* ============================================================ BLOC PLATS À PARTAGER - COCKTAILS ET SAVEURS ============================================================ */
#partager.phototext-section { padding-top: 90px !important; padding-bottom: 90px !important; background: #FFFFFF !important; }

/* ============================================================ CONTENEUR ============================================================ */
#partager .container { max-width: 1280px; }

/* ============================================================ TITRE ============================================================ */
#partager .phototext-subtitle { position: relative; margin-bottom: 30px !important; padding-bottom: 16px; }

#partager .phototext-subtitle::after { position: absolute; bottom: 0; left: 0; width: 65px; height: 2px; background: #0F5163; content: ""; }

#partager .phototext-subtitle h2, #partager .phototext-subtitle h2 span { margin: 0 !important; color: #0F5163 !important; }

/* ============================================================ TEXTE ============================================================ */
#partager .phototext-description { max-width: 590px; color: #353535 !important; line-height: 1.65; }

#partager .phototext-description p, #partager .phototext-description span { color: #353535 !important; }

#partager .phototext-description > p { margin-bottom: 25px; }

#partager .phototext-description ul { margin: 0; padding-left: 0; list-style: none; }

#partager .phototext-description li { position: relative; margin-bottom: 22px; padding-left: 25px; }

#partager .phototext-description li:last-child { margin-bottom: 0; }

#partager .phototext-description li::before { position: absolute; top: 10px; left: 0; width: 10px; height: 2px; background: #0F5163; content: ""; }

#partager .phototext-description li p { margin: 0 !important; }

#partager .phototext-description li span[style*="font-weight: 600"] { color: #0F5163 !important; }

/* ============================================================ IMAGE / CAROUSEL CARRÉ ============================================================ */
#partager .phototext-carousel { width: 100%; max-width: 580px; margin-left: auto; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }

#partager .phototext-carousel.rounded-3 { border-radius: 0 !important; }

#partager .phototext-carousel-inner { width: 100%; aspect-ratio: 1 / 1; overflow: hidden; border-radius: 0 !important; }

#partager .phototext-carousel-item { width: 100%; height: 100%; border-radius: 0 !important; }

#partager .phototext-carousel-image { display: block; width: 100%; height: 100%; aspect-ratio: 1 / 1; border-radius: 0 !important; object-fit: cover; object-position: center; }

/* ============================================================ FLÈCHES CAROUSEL ============================================================ */
#partager .phototext-carousel .carousel-control-prev, #partager .phototext-carousel .carousel-control-next { top: 50%; bottom: auto; width: 48px; height: 48px; padding: 0; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; opacity: .9; transform: translateY(-50%); }

#partager .phototext-carousel .carousel-control-prev { left: 16px; }

#partager .phototext-carousel .carousel-control-next { right: 16px; }

#partager .phototext-carousel .carousel-control-prev:hover, #partager .phototext-carousel .carousel-control-next:hover, #partager .phototext-carousel .carousel-control-prev:focus, #partager .phototext-carousel .carousel-control-next:focus { border: 0 !important; background: transparent !important; box-shadow: none !important; opacity: 1; }

#partager .phototext-carousel .carousel-control-prev-icon, #partager .phototext-carousel .carousel-control-next-icon { background-color: transparent !important; }

/* ============================================================ TABLETTE ============================================================ */
@media screen and (max-width: 991px) { #partager.phototext-section { padding-top: 70px !important; padding-bottom: 70px !important; } #partager .phototext-content-row { row-gap: 45px !important; } #partager .phototext-description { max-width: 100%; } #partager .phototext-carousel { max-width: 650px; margin-right: auto; margin-left: auto; } }

/* ============================================================ MOBILE ============================================================ */
@media screen and (max-width: 767px) { #partager.phototext-section { padding-top: 55px !important; padding-bottom: 55px !important; } #partager .phototext-subtitle { margin-bottom: 25px !important; padding-bottom: 14px; } #partager .phototext-subtitle::after { width: 55px; } #partager .phototext-description > p { margin-bottom: 20px; } #partager .phototext-description li { margin-bottom: 18px; } #partager .phototext-carousel .carousel-control-prev, #partager .phototext-carousel .carousel-control-next { width: 42px; height: 42px; } #partager .phototext-carousel .carousel-control-prev { left: 10px; } #partager .phototext-carousel .carousel-control-next { right: 10px; } }

/* ============================================================ BLOC COCKTAILS - COCKTAILS ET SAVEURS ============================================================ */
#cocktails.phototext-section { padding-top: 90px !important; padding-bottom: 90px !important; background: #0F5163 !important; }

/* ============================================================ CONTENEUR ============================================================ */
#cocktails .container { max-width: 1280px; }

/* ============================================================ INVERSION TEXTE / CAROUSEL ============================================================ */
#cocktails .phototext-media-col { order: 1; }

#cocktails .phototext-text-col { order: 2; }

/* ============================================================ TITRE ============================================================ */
#cocktails .phototext-subtitle { position: relative; margin-bottom: 30px !important; padding-bottom: 16px; }

#cocktails .phototext-subtitle::after { position: absolute; bottom: 0; left: 0; width: 65px; height: 2px; background: #FFFFFF; content: ""; }

#cocktails .phototext-subtitle h2, #cocktails .phototext-subtitle h2 span { margin: 0 !important; color: #FFFFFF !important; }

/* ============================================================ TEXTE ============================================================ */
#cocktails .phototext-description { max-width: 590px; color: #FFFFFF !important; line-height: 1.65; }

#cocktails .phototext-description p, #cocktails .phototext-description span, #cocktails .phototext-description strong, #cocktails .phototext-description li { color: #FFFFFF !important; }

#cocktails .phototext-description > p { margin-bottom: 25px; }

#cocktails .phototext-description ul { margin: 0; padding-left: 0; list-style: none; }

#cocktails .phototext-description li { position: relative; margin-bottom: 22px; padding-left: 25px; }

#cocktails .phototext-description li:last-child { margin-bottom: 0; }

#cocktails .phototext-description li::before { position: absolute; top: 10px; left: 0; width: 10px; height: 2px; background: #FFFFFF; content: ""; }

#cocktails .phototext-description li p { margin: 0 !important; }

#cocktails .phototext-description li span[style*="font-weight: 600"] { color: #FFFFFF !important; }

/* ============================================================ IMAGE / CAROUSEL CARRÉ ============================================================ */
#cocktails .phototext-carousel { width: 100%; max-width: 580px; margin-right: auto; margin-left: 0; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }

#cocktails .phototext-carousel.rounded-3 { border-radius: 0 !important; }

#cocktails .phototext-carousel-inner { width: 100%; aspect-ratio: 1 / 1; overflow: hidden; border-radius: 0 !important; }

#cocktails .phototext-carousel-item { width: 100%; height: 100%; border-radius: 0 !important; }

#cocktails .phototext-carousel-image { display: block; width: 100%; height: 100%; aspect-ratio: 1 / 1; border-radius: 0 !important; object-fit: cover; object-position: center; }

/* ============================================================ FLÈCHES CAROUSEL ============================================================ */
#cocktails .phototext-carousel .carousel-control-prev, #cocktails .phototext-carousel .carousel-control-next { top: 50%; bottom: auto; width: 48px; height: 48px; padding: 0; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; opacity: .9; transform: translateY(-50%); }

#cocktails .phototext-carousel .carousel-control-prev { left: 16px; }

#cocktails .phototext-carousel .carousel-control-next { right: 16px; }

#cocktails .phototext-carousel .carousel-control-prev:hover, #cocktails .phototext-carousel .carousel-control-next:hover, #cocktails .phototext-carousel .carousel-control-prev:focus, #cocktails .phototext-carousel .carousel-control-next:focus { border: 0 !important; background: transparent !important; box-shadow: none !important; opacity: 1; }

#cocktails .phototext-carousel .carousel-control-prev-icon, #cocktails .phototext-carousel .carousel-control-next-icon { background-color: transparent !important; }

/* ============================================================ TABLETTE ============================================================ */
@media screen and (max-width: 991px) { #cocktails.phototext-section { padding-top: 70px !important; padding-bottom: 70px !important; } #cocktails .phototext-content-row { row-gap: 45px !important; } #cocktails .phototext-description { max-width: 100%; } #cocktails .phototext-carousel { max-width: 650px; margin-right: auto; margin-left: auto; } }

/* ============================================================ MOBILE ============================================================ */
@media screen and (max-width: 767px) { #cocktails.phototext-section { padding-top: 55px !important; padding-bottom: 55px !important; } #cocktails .phototext-subtitle { margin-bottom: 25px !important; padding-bottom: 14px; } #cocktails .phototext-subtitle::after { width: 55px; } #cocktails .phototext-description > p { margin-bottom: 20px; } #cocktails .phototext-description li { margin-bottom: 18px; } #cocktails .phototext-carousel .carousel-control-prev, #cocktails .phototext-carousel .carousel-control-next { width: 42px; height: 42px; } #cocktails .phototext-carousel .carousel-control-prev { left: 10px; } #cocktails .phototext-carousel .carousel-control-next { right: 10px; } }

/* ============================================================ BLOC LOCATION & SERVICES - COCKTAILS ET SAVEURS ============================================================ */
#location.phototext-section { padding-top: 90px !important; padding-bottom: 90px !important; background: #FFFFFF !important; }

/* ============================================================ CONTENEUR ============================================================ */
#location .container { max-width: 1280px; }

/* ============================================================ TITRE ============================================================ */
#location .phototext-subtitle { position: relative; margin-bottom: 30px !important; padding-bottom: 16px; }

#location .phototext-subtitle::after { position: absolute; bottom: 0; left: 0; width: 65px; height: 2px; background: #0F5163; content: ""; }

#location .phototext-subtitle h2, #location .phototext-subtitle h2 span { margin: 0 !important; color: #0F5163 !important; }

/* ============================================================ TEXTE ============================================================ */
#location .phototext-description { max-width: 590px; color: #353535 !important; line-height: 1.65; }

#location .phototext-description p, #location .phototext-description span { color: #353535 !important; }

#location .phototext-description > p { margin-bottom: 25px; }

#location .phototext-description ul { margin: 0; padding-left: 0; list-style: none; }

#location .phototext-description li { position: relative; margin-bottom: 22px; padding-left: 25px; }

#location .phototext-description li:last-child { margin-bottom: 0; }

#location .phototext-description li::before { position: absolute; top: 10px; left: 0; width: 10px; height: 2px; background: #0F5163; content: ""; }

#location .phototext-description li p { margin: 0 !important; }

#location .phototext-description li span[style*="font-weight: 600"] { color: #0F5163 !important; }

/* ============================================================ IMAGE / CAROUSEL CARRÉ ============================================================ */
#location .phototext-carousel { width: 100%; max-width: 580px; margin-left: auto; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }

#location .phototext-carousel.rounded-3 { border-radius: 0 !important; }

#location .phototext-carousel-inner { width: 100%; aspect-ratio: 1 / 1; overflow: hidden; border-radius: 0 !important; }

#location .phototext-carousel-item { width: 100%; height: 100%; border-radius: 0 !important; }

#location .phototext-carousel-image { display: block; width: 100%; height: 100%; aspect-ratio: 1 / 1; border-radius: 0 !important; object-fit: cover; object-position: center; }

/* ============================================================ FLÈCHES CAROUSEL ============================================================ */
#location .phototext-carousel .carousel-control-prev, #location .phototext-carousel .carousel-control-next { top: 50%; bottom: auto; width: 48px; height: 48px; padding: 0; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; opacity: .9; transform: translateY(-50%); }

#location .phototext-carousel .carousel-control-prev { left: 16px; }

#location .phototext-carousel .carousel-control-next { right: 16px; }

#location .phototext-carousel .carousel-control-prev:hover, #location .phototext-carousel .carousel-control-next:hover, #location .phototext-carousel .carousel-control-prev:focus, #location .phototext-carousel .carousel-control-next:focus { border: 0 !important; background: transparent !important; box-shadow: none !important; opacity: 1; }

#location .phototext-carousel .carousel-control-prev-icon, #location .phototext-carousel .carousel-control-next-icon { background-color: transparent !important; }

/* ============================================================ TABLETTE ============================================================ */
@media screen and (max-width: 991px) { #location.phototext-section { padding-top: 70px !important; padding-bottom: 70px !important; } #location .phototext-content-row { row-gap: 45px !important; } #location .phototext-description { max-width: 100%; } #location .phototext-carousel { max-width: 650px; margin-right: auto; margin-left: auto; } }

/* ============================================================ MOBILE ============================================================ */
@media screen and (max-width: 767px) { #location.phototext-section { padding-top: 55px !important; padding-bottom: 55px !important; } #location .phototext-subtitle { margin-bottom: 25px !important; padding-bottom: 14px; } #location .phototext-subtitle::after { width: 55px; } #location .phototext-description > p { margin-bottom: 20px; } #location .phototext-description li { margin-bottom: 18px; } #location .phototext-carousel .carousel-control-prev, #location .phototext-carousel .carousel-control-next { width: 42px; height: 42px; } #location .phototext-carousel .carousel-control-prev { left: 10px; } #location .phototext-carousel .carousel-control-next { right: 10px; } }

/* ============================================================ CARTE - CATÉGORIE ============================================================ */
.cs-menu-category { padding: 80px 30px; background: #FFFFFF; }

.cs-menu-category__container { max-width: 1180px; margin: 0 auto; }

/* ============================================================ TITRE PRINCIPAL ============================================================ */
.cs-menu-category__heading { margin-bottom: 45px; text-align: center; }

.cs-menu-category__heading-title { color: #0F5163; }

.cs-menu-category__heading-title p, .cs-menu-category__heading-title h2, .cs-menu-category__heading-title h3 { margin: 0 !important; color: inherit !important; }

.cs-menu-category__heading-line { width: 65px; height: 2px; margin: 16px auto 0; background: #0F5163; }

/* ============================================================ LIGNE CATÉGORIE ============================================================ */
.cs-menu-category__row { display: grid; grid-template-columns: 250px 1fr; align-items: stretch; gap: 45px; }

/* ============================================================ IMAGE ============================================================ */
.cs-menu-category__visual { width: 100%; aspect-ratio: 1 / 1; overflow: hidden; }

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

/* ============================================================ CONTENU ============================================================ */
.cs-menu-category__content { display: flex; flex-direction: column; justify-content: center; }

.cs-menu-category__title { margin-bottom: 10px; color: #0F5163; line-height: 1.2; }

.cs-menu-category__title p, .cs-menu-category__title h2, .cs-menu-category__title h3 { margin: 0 !important; color: inherit !important; }

/* ============================================================ DESCRIPTION ============================================================ */
.cs-menu-category__description { max-width: 750px; margin-bottom: 24px; color: #353535; line-height: 1.55; }

.cs-menu-category__description p { margin: 0 !important; color: inherit !important; }

/* ============================================================ PRIX ============================================================ */
.cs-menu-category__prices { display: flex; flex-direction: column; gap: 9px; width: 100%; }

.cs-menu-category__price-row { display: grid; grid-template-columns: auto 1fr auto; align-items: baseline; gap: 8px; color: #353535; }

.cs-menu-category__price-name, .cs-menu-category__price-value { white-space: nowrap; }

.cs-menu-category__price-name p, .cs-menu-category__price-value p { margin: 0 !important; color: inherit !important; }

.cs-menu-category__price-dots { min-width: 20px; border-bottom: 1px dotted rgba(53, 53, 53, 0.55); transform: translateY(-3px); }

/* ============================================================ TABLETTE ============================================================ */
@media screen and (max-width: 991px) { .cs-menu-category { padding: 70px 25px; } .cs-menu-category__row { grid-template-columns: 220px 1fr; gap: 35px; } }

/* ============================================================ MOBILE ============================================================ */
@media screen and (max-width: 767px) { .cs-menu-category { padding: 55px 20px; } .cs-menu-category__heading { margin-bottom: 35px; } .cs-menu-category__heading-line { width: 55px; margin-top: 13px; } .cs-menu-category__row { grid-template-columns: 1fr; gap: 28px; } .cs-menu-category__visual { max-width: 420px; margin: 0 auto; } .cs-menu-category__content { justify-content: flex-start; } .cs-menu-category__description { margin-bottom: 22px; } }

/* ============================================================ PETITS MOBILES ============================================================ */
@media screen and (max-width: 480px) { .cs-menu-category { padding: 50px 16px; } .cs-menu-category__price-row { grid-template-columns: 1fr auto; gap: 8px; } .cs-menu-category__price-dots { display: none; } .cs-menu-category__price-name { white-space: normal; } .cs-menu-category__price-value { text-align: right; } }

/* ============================================================ CARTE - ITEM ============================================================ */
.cs-menu-item { padding: 32px 30px; background: #FFFFFF; }

.cs-menu-item__container { max-width: 1180px; margin: 0 auto; }

/* ============================================================ LIGNE ============================================================ */
.cs-menu-item__row { display: grid; grid-template-columns: 250px 1fr; align-items: stretch; gap: 45px; }

/* ============================================================ IMAGE ============================================================ */
.cs-menu-item__visual { width: 100%; aspect-ratio: 1 / 1; overflow: hidden; }

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

/* ============================================================ CONTENU ============================================================ */
.cs-menu-item__content { display: flex; flex-direction: column; justify-content: center; }

/* ============================================================ TITRE ============================================================ */
.cs-menu-item__title { margin-bottom: 10px; color: #0F5163; line-height: 1.2; }

.cs-menu-item__title p, .cs-menu-item__title h2, .cs-menu-item__title h3 { margin: 0 !important; color: inherit !important; }

/* ============================================================ DESCRIPTION ============================================================ */
.cs-menu-item__description { max-width: 750px; margin-bottom: 24px; color: #353535; line-height: 1.55; }

.cs-menu-item__description p { margin: 0 !important; color: inherit !important; }

/* ============================================================ LISTE / PRIX ============================================================ */
.cs-menu-item__prices { display: flex; flex-direction: column; gap: 9px; width: 100%; }

.cs-menu-item__price-row { display: grid; grid-template-columns: auto 1fr auto; align-items: baseline; gap: 8px; width: 100%; color: #353535; }

.cs-menu-item__price-name, .cs-menu-item__price-value { white-space: nowrap; }

.cs-menu-item__price-name p, .cs-menu-item__price-value p { margin: 0 !important; color: inherit !important; }

.cs-menu-item__price-dots { min-width: 20px; border-bottom: 1px dotted rgba(53, 53, 53, 0.55); transform: translateY(-3px); }

/* ============================================================ ENCHAÎNEMENT DES BLOCS ============================================================ */
.cs-menu-item + .cs-menu-item { padding-top: 10px; }

.cs-menu-item + .cs-menu-item .cs-menu-item__container { padding-top: 32px; border-top: 1px solid rgba(15, 81, 99, 0.12); }

/* ============================================================ TABLETTE ============================================================ */
@media screen and (max-width: 991px) { .cs-menu-item { padding: 28px 25px; } .cs-menu-item__row { grid-template-columns: 220px 1fr; gap: 35px; } }

/* ============================================================ MOBILE ============================================================ */
@media screen and (max-width: 767px) { .cs-menu-item { padding: 28px 20px; } .cs-menu-item__row { grid-template-columns: 1fr; gap: 28px; } .cs-menu-item__visual { max-width: 420px; margin: 0 auto; } .cs-menu-item__content { justify-content: flex-start; } .cs-menu-item__description { margin-bottom: 22px; } .cs-menu-item + .cs-menu-item .cs-menu-item__container { padding-top: 28px; } }

/* ============================================================ PETITS MOBILES ============================================================ */
@media screen and (max-width: 480px) { .cs-menu-item { padding: 25px 16px; } .cs-menu-item__price-row { grid-template-columns: 1fr auto; gap: 8px; } .cs-menu-item__price-dots { display: none; } .cs-menu-item__price-name { white-space: normal; } .cs-menu-item__price-value { text-align: right; } }

/* ============================================================ CARTE - BOISSONS ============================================================ */
.cs-drinks-item { padding: 32px 30px 55px; background: #FFFFFF; }

.cs-drinks-item__container { max-width: 1180px; margin: 0 auto; }

/* ============================================================ LIGNE ============================================================ */
.cs-drinks-item__row { display: grid; grid-template-columns: 250px 1fr; align-items: stretch; gap: 45px; }

/* ============================================================ IMAGE ============================================================ */
.cs-drinks-item__visual { width: 100%; aspect-ratio: 1 / 1; overflow: hidden; }

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

/* ============================================================ CONTENU ============================================================ */
.cs-drinks-item__content { display: flex; flex-direction: column; justify-content: center; }

/* ============================================================ TITRE ============================================================ */
.cs-drinks-item__title { margin-bottom: 10px; color: #0F5163; line-height: 1.2; }

.cs-drinks-item__title p, .cs-drinks-item__title h2, .cs-drinks-item__title h3 { margin: 0 !important; color: inherit !important; }

/* ============================================================ DESCRIPTION ============================================================ */
.cs-drinks-item__description { max-width: 750px; margin-bottom: 24px; color: #353535; line-height: 1.55; }

.cs-drinks-item__description p { margin: 0 !important; color: inherit !important; }

/* ============================================================ LISTE / PRIX ============================================================ */
.cs-drinks-item__prices { display: flex; flex-direction: column; gap: 9px; width: 100%; }

.cs-drinks-item__price-row { display: grid; grid-template-columns: auto 1fr auto; align-items: baseline; gap: 8px; width: 100%; color: #353535; }

.cs-drinks-item__price-name, .cs-drinks-item__price-value { white-space: nowrap; }

.cs-drinks-item__price-name p, .cs-drinks-item__price-value p { margin: 0 !important; color: inherit !important; }

.cs-drinks-item__price-dots { min-width: 20px; border-bottom: 1px dotted rgba(53, 53, 53, 0.55); transform: translateY(-3px); }

/* ============================================================ TABLETTE ============================================================ */
@media screen and (max-width: 991px) { .cs-drinks-item { padding: 28px 25px 50px; } .cs-drinks-item__row { grid-template-columns: 220px 1fr; gap: 35px; } }

/* ============================================================ MOBILE ============================================================ */
@media screen and (max-width: 767px) { .cs-drinks-item { padding: 28px 20px 45px; } .cs-drinks-item__row { grid-template-columns: 1fr; gap: 28px; } .cs-drinks-item__visual { max-width: 420px; margin: 0 auto; } .cs-drinks-item__content { justify-content: flex-start; } .cs-drinks-item__description { margin-bottom: 22px; } }

/* ============================================================ PETITS MOBILES ============================================================ */
@media screen and (max-width: 480px) { .cs-drinks-item { padding: 25px 16px 40px; } .cs-drinks-item__price-row { grid-template-columns: 1fr auto; gap: 8px; } .cs-drinks-item__price-dots { display: none; } .cs-drinks-item__price-name { white-space: normal; } .cs-drinks-item__price-value { text-align: right; } }

/* ============================================================ FIN DE CARTE - SUR MESURE & BROCHURE ============================================================ */
.cs-menu-final { padding: 90px 30px; background: #F0F0F0; }

.cs-menu-final__container { max-width: 900px; margin: 0 auto; text-align: center; }

/* ============================================================ TITRE ============================================================ */
.cs-menu-final__title { color: #0F5163; }

.cs-menu-final__title p, .cs-menu-final__title h2, .cs-menu-final__title h3 { margin: 0 !important; color: inherit !important; }

.cs-menu-final__line { width: 65px; height: 2px; margin: 16px auto 24px; background: #0F5163; }

/* ============================================================ TEXTE ============================================================ */
.cs-menu-final__text { max-width: 760px; margin: 0 auto; color: #353535; line-height: 1.65; }

.cs-menu-final__text p { margin: 0 0 8px !important; color: inherit !important; }

.cs-menu-final__text p:last-child { margin-bottom: 0 !important; }

/* ============================================================ BOUTON ============================================================ */
.cs-menu-final__actions { display: flex; justify-content: center; margin-top: 35px; }

.cs-menu-final__button { display: inline-flex; align-items: center; justify-content: center; min-height: 54px; padding: 14px 28px; border: 1px solid #0F5163; border-radius: 0; background: #0F5163; color: #FFFFFF; text-decoration: none; transition: background-color .3s ease, border-color .3s ease, color .3s ease; }

.cs-menu-final__button-label, .cs-menu-final__button-label p { margin: 0 !important; color: inherit !important; }

.cs-menu-final__button:hover { border-color: #353535; background: #353535; color: #FFFFFF; }

.cs-menu-final__button:focus-visible { outline: 3px solid #0F5163; outline-offset: 4px; }

/* ============================================================ MOBILE ============================================================ */
@media screen and (max-width: 767px) { .cs-menu-final { padding: 65px 20px; } .cs-menu-final__line { width: 55px; margin-top: 13px; margin-bottom: 20px; } .cs-menu-final__actions { margin-top: 30px; } .cs-menu-final__button { width: 100%; } }

/* ============================================================ BLOCS SEO - COCKTAILS ET SAVEURS SUPPRESSION FORCÉE DE TOUS LES ARRONDIS ============================================================ */
div.first-activity-div, div.second-activity-div, div.third-activity-div { overflow: hidden !important; border: 2px solid #0F5163 !important; border-radius: 0 !important; background: #FFFFFF !important; box-shadow: none !important; }

/* Neutralise absolument tous les arrondis à l'intérieur */
.first-activity-div *, .second-activity-div *, .third-activity-div * { border-radius: 0 !important; }

/* Pseudo-éléments également */
.first-activity-div *::before, .first-activity-div *::after, .second-activity-div *::before, .second-activity-div *::after, .third-activity-div *::before, .third-activity-div *::after { border-radius: 0 !important; }

/* Bootstrap rounded */
.first-activity-div.rounded-3, .second-activity-div.rounded-3, .third-activity-div.rounded-3, .first-activity-div .rounded-3, .second-activity-div .rounded-3, .third-activity-div .rounded-3, .first-activity-div .rounded-4, .second-activity-div .rounded-4, .third-activity-div .rounded-4, .first-activity-div .rounded-pill, .second-activity-div .rounded-pill, .third-activity-div .rounded-pill { border-radius: 0 !important; }

/* ============================================================ CARTES / IMAGES ============================================================ */
.first-activity-div .card, .second-activity-div .card, .third-activity-div .card, .first-activity-div .card-cover, .second-activity-div .card-cover, .third-activity-div .card-cover { overflow: hidden !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }

.first-activity-div .black-screen, .second-activity-div .black-screen, .third-activity-div .black-screen, .first-activity-div .background-image-div-opacity, .second-activity-div .background-image-div-opacity, .third-activity-div .background-image-div-opacity { border-radius: 0 !important; }

/* ============================================================ SUPPRESSION DES OMBRES ============================================================ */
.first-activity-div.shadow-lg, .second-activity-div.shadow-lg, .third-activity-div.shadow-lg, .first-activity-div .shadow-lg, .second-activity-div .shadow-lg, .third-activity-div .shadow-lg { box-shadow: none !important; }

/* ============================================================ TITRES ============================================================ */
.first-activity-title, .second-activity-title, .third-activity-title { position: relative; margin-bottom: 28px !important; }

.first-activity-title h2, .second-activity-title h2, .third-activity-title h2 { position: relative; display: inline-block; margin: 0 !important; padding-bottom: 14px; }

/* Soulignement */
.first-activity-title h2::after, .second-activity-title h2::after, .third-activity-title h2::after { position: absolute; bottom: 0; left: 0; width: 65px; height: 2px; border-radius: 0 !important; background: #0F5163; content: ""; }

/* ============================================================ COULEURS ============================================================ */
.first-activity-title h2, .first-activity-title h2 span, .second-activity-title h2, .second-activity-title h2 span, .third-activity-title h2, .third-activity-title h2 span { color: #0F5163 !important; }

.first-activity-div .lead, .second-activity-div .lead, .third-activity-div .lead { color: #0F5163 !important; line-height: 1.65; }

.first-activity-div .lead p, .second-activity-div .lead p, .third-activity-div .lead p { margin-bottom: 0 !important; }

/* ============================================================ ESPACEMENTS ============================================================ */
.first-activity-div, .second-activity-div, .third-activity-div { margin-top: 45px !important; margin-bottom: 45px !important; }

/* ============================================================ TABLETTE ============================================================ */
@media screen and (max-width: 991px) { div.first-activity-div, div.second-activity-div, div.third-activity-div { border-radius: 0 !important; } .first-activity-div .row, .second-activity-div .row, .third-activity-div .row { padding-right: 10px !important; padding-left: 10px !important; } }

/* ============================================================ MOBILE ============================================================ */
@media screen and (max-width: 767px) { div.first-activity-div, div.second-activity-div, div.third-activity-div { width: calc(100% - 30px); padding: 20px !important; border-width: 1px !important; border-radius: 0 !important; } .first-activity-title, .second-activity-title, .third-activity-title { margin-bottom: 24px !important; } .first-activity-title h2, .second-activity-title h2, .third-activity-title h2 { padding-bottom: 12px; } .first-activity-title h2::after, .second-activity-title h2::after, .third-activity-title h2::after { width: 55px; } }

/* ============================================================ PETITS MOBILES ============================================================ */
@media screen and (max-width: 480px) { div.first-activity-div, div.second-activity-div, div.third-activity-div { width: calc(100% - 24px); padding: 16px !important; border-radius: 0 !important; } }

/*--------------------------------------------------------------
# NAVIGATION PRESTATIONS
--------------------------------------------------------------*/
.cs-presta-nav { padding: 65px 30px; background: #FFFFFF; }

.cs-presta-nav__container { max-width: 1180px; margin: 0 auto; }

/*--------------------------------------------------------------
# TITRE
--------------------------------------------------------------*/
.cs-presta-nav__heading { max-width: 760px; margin: 0 auto 38px; text-align: center; }

.cs-presta-nav__title { color: #0F5163; }

.cs-presta-nav__title p, .cs-presta-nav__title h2, .cs-presta-nav__title h3 { margin: 0 !important; color: inherit !important; }

.cs-presta-nav__line { width: 65px; height: 2px; margin: 16px auto 20px; background: #0F5163; }

.cs-presta-nav__intro { color: #353535; line-height: 1.6; }

.cs-presta-nav__intro p { margin: 0 !important; color: inherit !important; }

/*--------------------------------------------------------------
# NAVIGATION
--------------------------------------------------------------*/
.cs-presta-nav__links { display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid #0F5163; }

/*--------------------------------------------------------------
# ÉLÉMENTS
--------------------------------------------------------------*/
.cs-presta-nav__item { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; min-height: 145px; padding: 22px 15px; border-right: 1px solid rgba(15, 81, 99, 0.25); background: #FFFFFF; color: #0F5163 !important; text-align: center; text-decoration: none !important; transition: background-color .3s ease, color .3s ease; }

.cs-presta-nav__item:last-child { border-right: 0; }

/*--------------------------------------------------------------
# PICTOS
--------------------------------------------------------------*/
.cs-presta-nav__icon { display: flex; align-items: center; justify-content: center; color: #0F5163 !important; line-height: 1; transition: color .3s ease; }

.cs-presta-nav__icon i { color: inherit !important; font-size: 32px; }

/*--------------------------------------------------------------
# LIBELLÉS
--------------------------------------------------------------*/
.cs-presta-nav__label { color: #0F5163 !important; line-height: 1.3; transition: color .3s ease; }

.cs-presta-nav__label p, .cs-presta-nav__label span, .cs-presta-nav__label div { margin: 0 !important; color: inherit !important; }

/*--------------------------------------------------------------
# HOVER
--------------------------------------------------------------*/
.cs-presta-nav__item:hover { background: #0F5163; color: #FFFFFF !important; }

.cs-presta-nav__item:hover .cs-presta-nav__icon, .cs-presta-nav__item:hover .cs-presta-nav__icon i, .cs-presta-nav__item:hover .cs-presta-nav__label, .cs-presta-nav__item:hover .cs-presta-nav__label p, .cs-presta-nav__item:hover .cs-presta-nav__label span, .cs-presta-nav__item:hover .cs-presta-nav__label div { color: #FFFFFF !important; }

/*--------------------------------------------------------------
# FOCUS
--------------------------------------------------------------*/
.cs-presta-nav__item:focus-visible { position: relative; z-index: 2; outline: 2px solid #0F5163; outline-offset: 3px; }

/*--------------------------------------------------------------
# ANCRES
--------------------------------------------------------------*/
#mariage, #traiteur, #partager, #cocktails, #location { scroll-margin-top: 110px; }

/*--------------------------------------------------------------
# TABLETTE
--------------------------------------------------------------*/
@media screen and (max-width: 991px) { .cs-presta-nav { padding: 55px 25px; } .cs-presta-nav__links { display: flex; overflow-x: auto; scrollbar-width: thin; -webkit-overflow-scrolling: touch; } .cs-presta-nav__item { flex: 0 0 190px; } }

/*--------------------------------------------------------------
# MOBILE
--------------------------------------------------------------*/
@media screen and (max-width: 767px) { .cs-presta-nav { padding: 50px 20px; } .cs-presta-nav__heading { margin-bottom: 30px; } .cs-presta-nav__line { width: 55px; margin-top: 13px; margin-bottom: 18px; } .cs-presta-nav__item { flex-basis: 160px; min-height: 125px; padding: 18px 12px; } .cs-presta-nav__icon i { font-size: 28px; } }

/*# sourceMappingURL=custom.css.map */