/* ============================================
   BRIKK CHILD - DESIGN BRYDGE
   ============================================ */

/* ============================================
   1. VARIABLES GLOBALES
   ============================================ */

:root {
    /* Couleurs Brydge */
    --main: #078dee;
    --main-shade: #0066cc;
    --main-soft: #f0f9ff;
    --main-hover: #0576c7;

    /* Textes */
    --text-primary: #111827;
    --text-secondary: #6b7280;
    --text-muted: #9ca3af;

    /* Backgrounds */
    --bg-white: #ffffff;
    --bg-soft: #f9fafb;
    --bg-card: #ffffff;

    /* Bordures */
    --border: #e5e7eb;
    --border-light: #f3f4f6;

    /* Shadows */
    --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1);
    --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1);
    --shadow-card-hover: 0 25px 50px -12px rgb(0 0 0 / 0.15);

    /* Shadows Brydge App (warm beige) */
    --shadow-card: rgba(197, 171, 147, 0.15) 0px 8px 24px;
    --shadow-card-hover-warm: rgba(197, 171, 147, 0.25) 0px 12px 32px;

    /* Border radius */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --radius-2xl: 32px;
    --radius-full: 9999px;

    /* Typographie */
    --font-body: 'Public Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-heading: 'Public Sans', -apple-system, BlinkMacSystemFont, sans-serif;

    /* Header height (pour référence) */
    --header-height: 80px;
}

/* ============================================
   1.5. LAYOUT - HEADER FIXED COMPENSATION
   ============================================ */

/* Le header fait 80px, pas 57px comme dans le thème parent */
body {
    padding-top: var(--header-height);
}

/* Pages avec header overlap (homepage) : pas de padding */
body.brk-overlap-header {
    padding-top: 0;
}

/* Single listing : supprimer le margin-top du thème parent car le body padding suffit */
.single-rz_listing .brk-container {
    margin-top: 0;
}

/* Mobile : supprimer le margin-top de 67px du thème parent pour que le contenu remonte sous le header fixe */
@media (max-width: 1199.98px) {
    .single-rz_listing .brk-container {
        margin-top: 0;
    }
}

/* Page Explore : le contenu doit commencer juste après le header */
.rz-is-explore .rz--title {
    margin-top: 0;
}

/* Admin bar : pas besoin d'ajuster car le header a déjà top: 32px */
body.admin-bar.brk-overlap-header {
    padding-top: 0;
}

/* Mobile : géré séparément (header mobile = 56px) */
@media (max-width: 1199.98px) {
    body {
        padding-top: 0;
        padding-bottom: 64px; /* Espace pour la nav mobile en bas */
    }

    body.admin-bar {
        padding-top: 0;
    }
}

/* ============================================
   2. TYPOGRAPHIE GLOBALE
   ============================================ */

body,
.routiz,
.brk-main {
    font-family: var(--font-body);
    color: var(--text-primary);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.brk-font-heading,
.rz-font-heading {
    font-family: var(--font-heading);
    font-weight: 900;
    letter-spacing: -0.025em;
}

/* Selection text style Brydge */
::selection {
    background-color: rgba(7, 141, 238, 0.2);
    color: var(--main);
}

/* Liens globaux */
.brk-main .brk-content a {
    font-weight: 400;
    color: var(--main);
}

.brk-main .brk-content a:hover {
    color: var(--main-shade);
}

/* ============================================
   3. CARTES DE LISTINGS
   ============================================ */

/* Container des listings - espace pour les ombres sans décalage */
.rz-listings,
.brk-listings {
    overflow: visible !important;
    display: flex;
    flex-wrap: wrap;
    margin: 0 -12px; /* Marge horizontale uniquement pour compenser le padding des items */
}

/* Widget Elementor Listings - permettre l'overflow des shadows */
.elementor-widget-rz_listings,
.elementor-widget-rz_listings > .elementor-widget-container {
    overflow: visible !important;
}

/* Reset des styles par défaut de Routiz */
.rz-listing-item {
    padding: 12px !important;
    overflow: visible !important;
    box-sizing: border-box;
}

/* Container carte principal */
.rz-listing {
    background: var(--bg-card);
    border-radius: var(--radius-xl) !important;
    border: 3px solid transparent;
    overflow: hidden;
    transition: all 0.3s ease;
    box-shadow: var(--shadow-card) !important;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.rz-listing:hover {
    box-shadow: var(--shadow-card-hover-warm) !important;
    transform: translateY(-8px);
    border-color: transparent;
}

/* Cover/Image */
.rz-listing-cover {
    position: relative;
    margin-bottom: 0;
    overflow: hidden;
}

.rz-listing-cover-inner {
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: hidden;
}

.rz-listing-image {
    border-radius: 0 !important;
}

/* Image et galerie - pas de zoom au hover */
.rz-listing-image .rz-image,
.rz-listing-gallery-item {
    transition: none;
}

.rz-listing:hover .rz-listing-image .rz-image,
.rz-listing:hover .rz-listing-gallery-item {
    transform: none;
}

/* Badge Priority/Type */
.rz-listing-priority {
    position: absolute;
    top: 12px;
    left: 12px;
    margin: 0;
    z-index: 10;
}

.rz-listing-priority .rz--tag {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    color: var(--main);
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 6px 12px;
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-sm);
}

/* Bouton Favori */
.rz-listing-badges {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 10;
    margin: 0;
    padding: 0;
}

.rz-listing-badges li {
    margin: 0;
    padding: 0;
    list-style: none;
}

.rz-listing-favorite {
    width: 36px;
    height: 36px;
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-radius: var(--radius-full) !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    box-shadow: var(--shadow-sm);
    transition: all 0.2s ease;
    font-size: 16px;
    color: var(--text-muted);
    border: none;
}

.rz-listing-favorite:hover {
    color: #ef4444;
    transform: scale(1.1);
    background: #ffffff !important;
}

.rz-listing-favorite.rz-active,
.rz-listing-favorite.rz-active i {
    color: #ef4444 !important;
}

/* Contenu carte */
.rz-listing-content {
    padding: 20px;
    display: flex;
    flex-direction: column;
    flex: 1;
}

/* Header (Titre + Rating) */
.rz-listing .rz--heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
    gap: 12px;
}

.rz-listing .rz--heading .rz--main {
    flex: 1;
    min-width: 0;
}

.rz-listing .rz-title h4 {
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 800;
    color: var(--text-primary);
    margin: 0 0 8px 0;
    line-height: 1.3;
    transition: color 0.2s ease;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rz-listing:hover .rz-title h4 {
    color: var(--main);
}

/* Rating */
.rz-listing .rz--review {
    flex-shrink: 0;
    text-align: right;
}

.rz-listing-review {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    font-weight: 700;
    color: var(--text-primary);
}

.rz-listing-review i {
    color: #facc15;
    font-size: 12px;
}

/* Score description */
.rz-listing .score-description {
    font-size: 11px;
    font-weight: 600;
    color: var(--main) !important;
    margin-top: 2px;
}

/* Tagline/Description */
.rz-listing-tagline {
    font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.5;
    margin: 0 0 12px 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Details (Hammam, Sauna, Location) - Style chips/badges */
.rz-listing-details,
.rz-listing-details-content {
    margin-bottom: 0;
}

.rz-listing-details {
    margin-top: 2px;
    padding-top: 5px;
    border-top: 1px solid hsla(0, 0%, 74.5%, .4);
    pointer-events: none;
}

.rz-listing-details ul,
.rz-listing-details-content ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.rz-listing-details li,
.rz-listing-details-content li {
    margin: 0;
    padding: 0;
}

.rz-listing-details li span,
.rz-listing-details-content li span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 600;
    color: var(--text-secondary);
    background: var(--bg-soft);
    padding: 6px 12px;
    border-radius: var(--radius-full);
    transition: all 0.2s ease;
}

.rz-listing:hover .rz-listing-details li span,
.rz-listing:hover .rz-listing-details-content li span {
    background: var(--main-soft);
    color: var(--main);
}

.rz-listing-details li span i,
.rz-listing-details-content li span i {
    color: var(--main);
    font-size: 10px;
}

/* Footer de carte - Localisation uniquement */
.rz-listing-bottom {
    padding-top: 16px;
    border-top: 1px solid var(--border-light);
    margin-top: auto;
    display: flex;
    align-items: center;
    font-family: var(--font-body) !important;
}

.rz-listing-bottom ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 !important;
    padding: 0;
    list-style: none;
}

.rz-listing-bottom li {
    margin: 0;
    padding: 0;
}

.rz-listing-bottom li span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: var(--font-body) !important;
    font-size: 12px;
    font-weight: 600;
    color: var(--main);
    background: var(--main-soft);
    padding: 8px 14px;
    border-radius: var(--radius-full);
    white-space: nowrap;
}

.rz-listing-bottom li span i {
    color: inherit;
    font-size: 11px;
    min-width: auto !important;
    margin-right: 0 !important;
}

/* Slider navigation */
.rz-slider-nav span {
    width: 32px;
    height: 32px;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
    box-shadow: var(--shadow-md);
}

.rz-slider-nav span i {
    line-height: 32px;
    font-size: 12px;
}

/* ============================================
   4. HEADER
   ============================================ */

.brk-header {
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--border-light);
    box-shadow: none;
}

/* ============================================
   HOMEPAGE - HEADER TRANSPARENT (avant scroll)
   ============================================ */

/* Header transparent - supprimer fond et border */
.brk-header-text-white:not(.brk-is-sticky) .brk-header {
    background: transparent;
    border-bottom: 1px solid transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

/* Navigation principale en blanc */
.brk-header-text-white:not(.brk-is-sticky) .brk-nav-main ul li a {
    color: #ffffff;
}

.brk-header-text-white:not(.brk-is-sticky) .brk-nav-main ul li a:hover,
.brk-header-text-white:not(.brk-is-sticky) .brk-nav-main ul li.current-menu-item a {
    color: rgba(255, 255, 255, 0.7);
}

/* Nom utilisateur en blanc */
.brk-header-text-white:not(.brk-is-sticky) .brk-nav-user span {
    color: #ffffff;
}

/* Reset des containers pour un header full-width */
.brk-header .brk-row {
    max-width: 100%;
    width: 100%;
    padding: 0;
    margin: 0;
}

.brk-site-header {
    max-width: 100%;
    width: 100%;
    margin: 0;
    padding: 0 3rem;
}

@media (max-width: 767px) {
    .brk-site-header {
        padding: 0 1.5rem;
    }
}

.brk-header-container {
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

/* Actions header (nav + CTA) à droite */
.brk-site-actions {
    display: flex;
    align-items: center;
    gap: 32px;
    margin-left: auto;
}

/* Logo */
.brk-site-logo a {
    display: flex;
    align-items: center;
    gap: 16px;
    text-decoration: none;
}

.brk-site-logo img {
    height: 40px;
    width: auto;
}

.brk-site-title {
    font-size: 24px;
    font-weight: 900;
    letter-spacing: -0.025em;
    color: var(--text-primary);
}

/* Navigation */
.brk-nav-main ul {
    display: flex;
    align-items: center;
    gap: 48px;
}

.brk-nav-main ul li a {
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--text-primary);
    transition: color 0.2s ease;
    text-decoration: none;
}

.brk-nav-main ul li a:hover,
.brk-nav-main ul li.current-menu-item a {
    color: var(--main);
}

/* Bouton CTA Header - Style unifié desktop & mobile */
.brydge-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--main);
    color: #ffffff !important;
    padding: 12px 24px;
    border-radius: var(--radius-sm);
    font-size: 0.9rem;
    font-weight: 800 !important;
    text-decoration: none;
    text-transform: none;
    letter-spacing: 0.2px;
    box-shadow: 0 4px 12px rgba(7, 141, 238, 0.3);
    transition: all 0.2s ease;
    border: none;
    cursor: pointer;
}

.brydge-cta-btn:hover {
    background: var(--main-hover);
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(7, 141, 238, 0.4);
}

.brydge-cta-btn i {
    font-size: 14px;
}

.brydge-cta-btn span {
    color: inherit;
}

/* Header mobile - styles de base (appliqués aussi sur desktop pour éviter FOUC) */
.brk-mobile-header {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--border-light);
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    transition: transform 0.3s ease, background 0.3s ease;
}

/* ============================================
   5. FOOTER
   ============================================ */

.brk-footer {
    background: var(--bg-white);
    border-top: 1px solid var(--border-light);
    padding-top: 96px;
}

.brk-footer .brk-row {
    max-width: 1600px;
    margin: 0 auto;
    padding: 0 24px;
}

@media (min-width: 1024px) {
    .brk-footer .brk-row {
        padding: 0 64px;
    }
}

/* Footer grid */
.brk-footer .widget-area {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 80px;
    margin-bottom: 80px;
}

@media (max-width: 991px) {
    .brk-footer .widget-area {
        grid-template-columns: repeat(2, 1fr);
        gap: 40px;
    }
}

@media (max-width: 575px) {
    .brk-footer .widget-area {
        grid-template-columns: 1fr;
    }
}

/* Titres widgets footer */
.brk-footer .widget-title {
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--text-primary);
    margin-bottom: 32px;
}

/* Liens footer */
.brk-footer .widget ul li {
    margin-bottom: 16px;
}

.brk-footer .widget ul li a {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-secondary);
    text-decoration: none;
    transition: color 0.2s ease;
}

.brk-footer .widget ul li a:hover {
    color: var(--main);
}

/* Copyright */
.brk-footer .brk-copyright {
    padding-top: 40px;
    border-top: 1px solid var(--border-light);
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: var(--text-muted);
}

/* ============================================
   6. GRILLE DE LISTINGS RESPONSIVE
   ============================================ */

/* 4 colonnes par défaut sur desktop (>=1024px) */
@media (min-width: 1024px) {
    .rz-listings .rz-listing-item {
        flex: 0 1 25%;
        max-width: 25%;
    }
}

/* 3 colonnes sur tablette large */
@media (min-width: 768px) and (max-width: 1023px) {
    .rz-listings .rz-listing-item {
        flex: 0 1 33.333%;
        max-width: 33.333%;
    }
}

/* 2 colonnes tablette */
@media (min-width: 640px) and (max-width: 767px) {
    .rz-listings .rz-listing-item {
        flex: 0 1 50%;
        max-width: 50%;
    }
}

/* 1 colonne mobile */
@media (max-width: 639px) {
    .rz-listings .rz-listing-item {
        flex: 0 1 100%;
        max-width: 100%;
    }
}

/* ============================================
   7. BOUTONS GLOBAUX
   ============================================ */

.rz-button,
.brk-button {
    font-family: var(--font-body);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    border-radius: var(--radius-sm);
    transition: all 0.2s ease;
}

.rz-button-accent,
.brk-button-accent {
    background: linear-gradient(135deg, var(--main) 0%, var(--main-shade) 100%);
    color: white;
    box-shadow: 0 10px 25px -5px rgba(7, 141, 238, 0.4);
}

.rz-button-accent:hover,
.brk-button-accent:hover {
    filter: brightness(1.1);
    transform: translateY(-2px);
}

/* Bouton outline */
.rz-button-outline {
    background: transparent;
    border: 2px solid var(--border);
    color: var(--text-primary);
}

.rz-button-outline:hover {
    border-color: var(--main);
    color: var(--main);
}

/* ============================================
   8. PAGE EXPLORE
   ============================================ */

.rz-explore-listings {
    padding: 32px;
}

@media (min-width: 1024px) {
    .rz-explore-listings {
        padding: 48px 64px;
    }
}

/* Summary/Resultats */
.rz-summary {
    font-size: 14px;
    color: var(--text-secondary);
}

/* Titre section resultats */
.rz-explore-listings h2,
.rz-explore .rz--heading {
    font-size: 32px;
    font-weight: 900;
    letter-spacing: -0.025em;
    color: var(--text-primary);
}

.rz-explore-listings h2 span,
.rz-explore .rz--heading span {
    color: var(--main);
}

/* ============================================
   9. SCROLLBAR PERSONNALISEE
   ============================================ */

::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
    background: var(--main);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--main-shade);
}

/* ============================================
   10. UTILITAIRES
   ============================================ */

/* Couleur accent globale */
.rz-accent,
.brk-accent {
    color: var(--main);
}

.rz-bg-accent,
.brk-bg-accent {
    background-color: var(--main);
}

/* Override couleur principale Routiz */
.routiz {
    --rz-main: #078dee;
    --rz-main-light: #f0f9ff;
}

/* ============================================
   11. SEARCH FILTER / TABS (Hero Section)
   ============================================ */

/* Variables de champs */
:root {
    --field-bg: #f3f4f6;
    --field-text: #111827;
    --field-placeholder: #9ca3af;
}

/* Barre de recherche inline */
.rz-search-filter--inline {
    border-bottom: 1px solid var(--border-light);
    background: var(--bg-white);
}

.rz-search-filter--inline .rz-search-filter-inner {
    padding: 1.5rem 1.5rem 1rem;
}

/* Onglets/Tabs de recherche */
.rz-filter-tab .rz-tab-title {
    background-color: var(--field-bg);
    color: var(--text-primary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    font-weight: 600;
    font-size: 14px;
    padding: 0 40px 0 16px;
    line-height: 44px;
    transition: all 0.2s ease;
}

.rz-filter-tab .rz-tab-title:hover {
    border-color: var(--border);
    background-color: var(--bg-white);
}

.rz-filter-tab .rz-tab-title span {
    color: var(--text-primary);
}

.rz-filter-tab .rz-tab-title.rz-is-placeholder span {
    color: var(--text-secondary);
}

/* Chevron du tab */
.rz-filter-tab .rz-tab-title:after {
    color: var(--text-muted);
}

/* Tab actif/sélectionné */
.rz-filter-tab.rz-expand .rz-tab-title {
    border-color: var(--main);
    background-color: var(--bg-white);
}

/* Flyout/dropdown du tab */
.rz-filter-tab .rz-tab-flyout {
    background-color: var(--bg-white);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-xl);
}

.rz-filter-tab .rz-tab-flyout .rz-tab-content {
    padding: 1.25rem;
}

/* Champs de formulaire */
.rz-form-group input[type="text"],
.rz-form-group input[type="email"],
.rz-form-group input[type="number"],
.rz-form-group input[type="search"],
.rz-form-group select,
.rz-form-group textarea {
    background-color: var(--field-bg);
    color: var(--text-primary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    font-family: var(--font-body);
    font-size: 14px;
    padding: 12px 16px;
    transition: all 0.2s ease;
}

.rz-form-group input:focus,
.rz-form-group select:focus,
.rz-form-group textarea:focus {
    border-color: var(--main);
    outline: none;
    box-shadow: 0 0 0 3px rgba(7, 141, 238, 0.1);
}

.rz-form-group input::placeholder,
.rz-form-group textarea::placeholder {
    color: var(--field-placeholder);
}

/* Bouton de recherche */
.rz-search-filter .rz-button-search,
.rz-search-filter button[type="submit"] {
    background: var(--main);
    color: white;
    border-radius: var(--radius-full);
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    box-shadow: 0 4px 12px rgba(7, 141, 238, 0.3);
    transition: all 0.2s ease;
}

.rz-search-filter .rz-button-search:hover,
.rz-search-filter button[type="submit"]:hover {
    transform: scale(1.05);
    box-shadow: 0 6px 16px rgba(7, 141, 238, 0.4);
}

/* Select dropdown style */
.rz-form-group select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%239ca3af' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    padding-right: 40px;
}

/* ============================================
   12. HERO SECTION / PAGE D'ACCUEIL
   ============================================ */

/* Section Hero */
.brk-hero,
.rz-hero {
    background: var(--bg-white);
}

/* Titre Hero */
.brk-hero h1,
.rz-hero h1,
.brk-hero .brk-hero-title {
    font-family: var(--font-heading);
    font-weight: 900;
    font-size: 48px;
    letter-spacing: -0.025em;
    color: var(--text-primary);
    line-height: 1.1;
}

@media (min-width: 768px) {
    .brk-hero h1,
    .rz-hero h1,
    .brk-hero .brk-hero-title {
        font-size: 64px;
    }
}

/* Sous-titre Hero */
.brk-hero p,
.rz-hero p,
.brk-hero .brk-hero-subtitle {
    font-size: 18px;
    color: var(--text-secondary);
    line-height: 1.6;
    max-width: 600px;
}

/* Bouton CTA Hero */
.brk-hero .rz-button,
.brk-hero a.brk-button {
    background: var(--main);
    color: white;
    padding: 16px 32px;
    border-radius: var(--radius-sm);
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    box-shadow: 0 10px 25px -5px rgba(7, 141, 238, 0.4);
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.brk-hero .rz-button:hover,
.brk-hero a.brk-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 15px 30px -5px rgba(7, 141, 238, 0.5);
}

/* Lien "Edit search form" */
a[href*="edit"],
.brk-edit-link {
    color: var(--main);
    font-size: 13px;
    font-weight: 600;
}

a[href*="edit"]:hover {
    color: var(--main-shade);
}

/* ============================================
   13. CAROUSEL NAV / TABS HORIZONTAUX
   ============================================ */

/* Navigation carousel (Homes, Bar & Restaurants, etc.) */
.brk-carousel-nav {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.brk-carousel-nav li a,
.brk-carousel-search.brk--style-horizontal .brk-carousel-nav li a {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px 20px;
    background: var(--field-bg);
    backdrop-filter: none;
    color: var(--text-primary);
    font-size: 13px;
    line-height: 21px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: none;
    border: 1px solid var(--border-light);
    border-radius: 50px;
    transition: all 0.2s ease;
}

.brk-carousel-nav li a:hover,
.brk-carousel-search.brk--style-horizontal .brk-carousel-nav li a:hover {
    background: var(--bg-white);
    border-color: var(--border);
    color: var(--text-primary);
}

/* Tab actif */
.brk-carousel-nav li.brk-active a,
.brk-carousel-search.brk--style-horizontal .brk-carousel-nav li.brk-active a {
    background: var(--text-primary);
    border-color: var(--text-primary);
    color: var(--bg-white);
}

.brk-carousel-nav li.brk-active a:hover,
.brk-carousel-search.brk--style-horizontal .brk-carousel-nav li.brk-active a:hover {
    background: var(--text-primary);
    color: var(--bg-white);
}

/* Classe .brk-bg sur les liens */
.brk-carousel-nav li a.brk-bg {
    background: var(--field-bg);
    color: var(--text-primary);
}

.brk-carousel-nav li.brk-active a.brk-bg {
    background: var(--text-primary);
    color: var(--bg-white);
}

/* ============================================
   14. BOUTONS CTA PRINCIPAUX
   ============================================ */

/* Bouton accent (Commencer l'exploration, etc.) */
.rz-button.rz-button-accent,
.brk-bg.rz-button-accent,
.brk-main .brk-content a.rz-button-accent,
a.rz-button.rz-button-accent {
    background: linear-gradient(135deg, var(--main) 0%, var(--main-shade) 100%);
    color: #ffffff !important;
    padding: 16px 32px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    border-radius: var(--radius-sm);
    box-shadow: 0 10px 25px -5px rgba(7, 141, 238, 0.4);
    transition: all 0.2s ease;
    text-decoration: none;
}

.rz-button.rz-button-accent span,
.brk-bg.rz-button-accent span,
a.rz-button.rz-button-accent span {
    color: #ffffff !important;
}

.rz-button.rz-button-accent:hover,
.brk-bg.rz-button-accent:hover,
a.rz-button.rz-button-accent:hover {
    transform: translateY(-2px);
    box-shadow: 0 15px 30px -5px rgba(7, 141, 238, 0.5);
    color: #ffffff !important;
}

/* Bouton CTA dans la section hero */
.brk--cta a.rz-button,
.brk-carousel-search .brk--button-cta {
    background: linear-gradient(135deg, var(--main) 0%, var(--main-shade) 100%);
    color: #ffffff !important;
    padding: 16px 32px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    border-radius: var(--radius-xl);
    box-shadow: 0 10px 25px -5px rgba(7, 141, 238, 0.4);
}

.brk--cta a.rz-button span,
.brk-carousel-search .brk--button-cta span {
    color: #ffffff !important;
}

/* ============================================
   15. BOXES / CATEGORIES GRID (Elementor)
   ============================================ */

/* Titre des boxes - BLANC sur image */
.brk-bx-item .brk--name,
.brk-bx-item .brk--name.brk-font-heading {
    color: #ffffff !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

/* Description des boxes */
.brk-bx-item .brk--desc {
    color: rgba(255, 255, 255, 0.9) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}

/* ============================================
   16. HERO CAROUSEL - STYLE GOOGLE STUDIO
   ============================================ */

/* Container principal du hero carousel */
.brk-carousel-search {
    position: relative;
    min-height: auto;
    display: block;
    padding: 0;
    background: transparent;
}

/* Overlay gradient subtil sur l'image de fond */
.brk-carousel-search::before {
    display: none;
}

/* Container du contenu hero */
.brk-carousel-search .brk--content {
    position: relative;
    z-index: 10;
    text-align: left;
    max-width: 100%;
    margin: 0;
    padding: 0;
}

/* Titre Hero - Style Google Studio */
.brk-carousel-search .brk--content h2,
.brk-carousel-search .brk--content .brk--title {
    font-family: var(--font-heading);
    font-size: clamp(36px, 6vw, 72px);
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: -0.03em;
    color: var(--text-primary);
    margin-bottom: 24px;
}

/* Highlight du titre en bleu */
.brk-carousel-search .brk--content h2 span,
.brk-carousel-search .brk--content .brk--title span,
.brk-carousel-search .brk--content h2 strong,
.brk-carousel-search .brk--content .brk--title strong {
    color: var(--main);
    background: linear-gradient(135deg, var(--main) 0%, var(--main-shade) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Description Hero */
.brk-carousel-search .brk--content p,
.brk-carousel-search .brk--content .brk--desc {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.7;
    color: var(--text-secondary);
    max-width: 600px;
    margin: 0 auto 48px;
}

@media (min-width: 768px) {
    .brk-carousel-search .brk--content p,
    .brk-carousel-search .brk--content .brk--desc {
        font-size: 20px;
    }
}

/* ============================================
   17. HERO SEARCH BAR - STYLE GOOGLE STUDIO
   ============================================ */

/* Container du formulaire de recherche */
.brk-carousel-search .rz-search-form,
.brk-carousel-search .brk--search {
    position: relative;
    z-index: 10;
    max-width: 600px;
    margin: 0;
}

/* Barre de recherche principale - Style Google Studio */
.brk-carousel-search .rz-search-filter,
.brk-carousel-search .brk-search-filter {
    background: var(--bg-white);
    border-radius: 2rem;
    box-shadow: 0 30px 100px -20px rgba(0, 0, 0, 0.12);
    padding: 10px;
    border: 1px solid rgba(0, 0, 0, 0.03);
}

/* Inner container de la recherche */
.brk-carousel-search .rz-search-filter-inner {
    display: flex;
    align-items: stretch;
    gap: 0;
    flex-wrap: wrap;
}

@media (min-width: 768px) {
    .brk-carousel-search .rz-search-filter-inner {
        flex-wrap: nowrap;
    }
}

/* Champs de recherche - style avec label */
.brk-carousel-search .rz-form-group,
.brk-carousel-search .rz-field {
    flex: 1;
    min-width: 0;
    padding: 12px 20px;
    border-right: 1px solid var(--border-light);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.brk-carousel-search .rz-form-group:last-of-type {
    border-right: none;
}

/* Label du champ - Style Google Studio */
.brk-carousel-search .rz-heading label,
.brk-carousel-search .rz-form-group .rz-heading label {
    display: block;
    font-size: 9px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: var(--text-muted);
    margin-bottom: 4px;
}

/* Input du champ */
.brk-carousel-search .rz-quick-input input,
.brk-carousel-search .rz-form-group input {
    background: transparent;
    border: none;
    font-size: 14px;
    font-weight: 700;
    color: var(--text-primary);
    padding: 0;
    width: 100%;
}

.brk-carousel-search .rz-quick-input input::placeholder,
.brk-carousel-search .rz-form-group input::placeholder {
    color: var(--text-muted);
    font-weight: 700;
}

.brk-carousel-search .rz-quick-input input:focus,
.brk-carousel-search .rz-form-group input:focus {
    outline: none;
}

/* Icône du champ */
.brk-carousel-search .rz-form-group [data-icon]::before,
.brk-carousel-search .rz-quick-input i {
    color: var(--main);
    opacity: 0.5;
    margin-right: 12px;
}

/* Tabs dans la barre (Select dates, Select guests) */
.brk-carousel-search .rz-filter-tab {
    flex: 1;
    min-width: 0;
    position: relative;
}

.brk-carousel-search .rz-filter-tab .rz-tab-title {
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 12px 20px;
    font-size: 14px;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.4;
    transition: all 0.2s ease;
    cursor: pointer;
    width: 100%;
    text-align: left;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-right: 1px solid var(--border-light);
}

.brk-carousel-search .rz-filter-tab:last-of-type .rz-tab-title {
    border-right: none;
}

.brk-carousel-search .rz-filter-tab .rz-tab-title:hover {
    background: rgba(0, 0, 0, 0.02);
}

.brk-carousel-search .rz-filter-tab.rz-expand .rz-tab-title {
    background: rgba(0, 0, 0, 0.02);
}

/* Placeholder du champ tab */
.brk-carousel-search .rz-filter-tab .rz-tab-title.rz-is-placeholder span {
    color: var(--text-muted);
    font-weight: 700;
}

/* Chevron dropdown caché ou stylé */
.brk-carousel-search .rz-filter-tab .rz-tab-title::after {
    color: var(--text-muted);
    opacity: 0.5;
}

/* Bouton de recherche - Style "Explorer" */
.brk-carousel-search .rz-button-search,
.brk-carousel-search button[type="submit"],
.brk-carousel-search .rz-search-filter .rz--submit {
    flex-shrink: 0;
    min-width: 48px;
    height: 48px;
    background: var(--main);
    color: white;
    border: none;
    border-radius: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
    box-shadow: 0 8px 20px -4px rgba(7, 141, 238, 0.35);
    transition: all 0.2s ease;
    cursor: pointer;
    margin: 4px;
    padding: 0 20px;
}

.brk-carousel-search .rz-button-search:hover,
.brk-carousel-search button[type="submit"]:hover,
.brk-carousel-search .rz-search-filter .rz--submit:hover {
    filter: brightness(1.1);
    box-shadow: 0 12px 28px -4px rgba(7, 141, 238, 0.45);
}

/* Flyout/dropdown amélioré */
.brk-carousel-search .rz-tab-flyout {
    background: var(--bg-white);
    border-radius: 1.5rem;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.2);
    border: 1px solid var(--border-light);
    margin-top: 8px;
    overflow: hidden;
}

/* Masquer les éléments non nécessaires */
.brk-carousel-search .rz-search-mods {
    display: flex;
    align-items: stretch;
    flex: 1;
}

.brk-carousel-search .rz-mod {
    flex: 1;
    display: flex;
}

/* ============================================
   18. HERO NAVIGATION TABS (Homes, Bars, etc.)
   ============================================ */

/* Container des tabs de navigation */
.brk-carousel-search .brk-carousel-nav {
    display: flex;
    justify-content: flex-start;
    gap: 12px;
    margin-bottom: 24px;
    flex-wrap: wrap;
    position: relative;
    z-index: 10;
}

/* Tabs individuels */
.brk-carousel-search .brk-carousel-nav li a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: var(--radius-full);
    font-size: 14px;
    font-weight: 600;
    color: var(--text-secondary);
    text-decoration: none;
    transition: all 0.3s ease;
}

.brk-carousel-search .brk-carousel-nav li a:hover {
    background: var(--bg-white);
    color: var(--text-primary);
    border-color: rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* Tab actif */
.brk-carousel-search .brk-carousel-nav li.brk-active a {
    background: var(--text-primary);
    color: var(--bg-white);
    border-color: var(--text-primary);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.brk-carousel-search .brk-carousel-nav li.brk-active a:hover {
    background: var(--text-primary);
    color: var(--bg-white);
    transform: translateY(-2px);
}

/* Icône dans les tabs */
.brk-carousel-search .brk-carousel-nav li a i {
    font-size: 16px;
    opacity: 0.8;
}

.brk-carousel-search .brk-carousel-nav li.brk-active a i {
    opacity: 1;
}

/* ============================================
   19. HERO RESPONSIVE ADJUSTMENTS
   ============================================ */

@media (max-width: 991px) {
    .brk-carousel-search {
        padding: 24px 16px;
    }

    .brk-carousel-search .brk--content {
        padding: 0;
    }

    .brk-carousel-search .brk-carousel-nav {
        margin-bottom: 24px;
    }
}

@media (max-width: 767px) {
    .brk-carousel-search {
        padding: 0;
    }

    .brk-carousel-search .brk-carousel-nav {
        gap: 8px;
        margin-bottom: 16px;
    }

    .brk-carousel-search .brk-carousel-nav li a {
        padding: 10px 16px;
        font-size: 13px;
    }

    /* Barre de recherche en colonne sur mobile */
    .brk-carousel-search .rz-search-filter,
    .brk-carousel-search .brk-search-filter {
        padding: 12px;
        border-radius: 1.5rem;
    }

    .brk-carousel-search .rz-search-filter-inner {
        flex-direction: column;
        gap: 0;
    }

    .brk-carousel-search .rz-search-mods {
        flex-direction: column;
        flex-wrap: wrap !important;
        width: 100%;
    }

    .brk-carousel-search .rz-mod {
        width: 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    .brk-carousel-search .rz-mod .rz-form-group {
        width: 100% !important;
    }

    .brk-carousel-search .rz-form-group,
    .brk-carousel-search .rz-field {
        border-right: none;
        border-bottom: 1px solid var(--border-light);
        padding: 12px 16px;
    }

    .brk-carousel-search .rz-form-group:last-of-type,
    .brk-carousel-search .rz-field:last-of-type {
        border-bottom: none;
    }

    .brk-carousel-search .rz-filter-tab {
        width: 100%;
    }

    .brk-carousel-search .rz-filter-tab .rz-tab-title {
        border-right: none;
        border-bottom: 1px solid var(--border-light);
        border-radius: 0;
    }

    .brk-carousel-search .rz-filter-tab:last-of-type .rz-tab-title {
        border-bottom: none;
    }

    .brk-carousel-search .rz-button-search,
    .brk-carousel-search button[type="submit"],
    .brk-carousel-search .rz-search-filter .rz--submit {
        width: 100%;
        height: 48px;
        border-radius: 1rem;
        margin: 8px 0 0 0;
    }
}

/* ============================================
   20. HERO SLIDE BACKGROUND
   ============================================ */

/* Background image du carousel */
.brk-carousel-search .brk-carousel-slide,
.brk-carousel-search .brk--slide {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.brk-carousel-search .brk-carousel-slide img,
.brk-carousel-search .brk--slide img,
.brk-carousel-search .brk--bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.4;
}

/* Overlay sur l'image */
.brk-carousel-search .brk-carousel-slide::after,
.brk-carousel-search .brk--slide::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
        rgba(255,255,255,0.3) 0%,
        rgba(255,255,255,0.8) 50%,
        rgba(255,255,255,1) 100%
    );
}

/* ============================================
   21. HERO GALLERY GRID (4 images style Google Studio)
   ============================================ */

/* Container principal - à mettre sur la colonne Elementor */
.brydge-hero-gallery {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 16px;
    max-width: 600px;
    margin: 0 auto;
}

/* Image 1 - Grande image à gauche (occupe 2 rows) */
.brydge-hero-gallery .brydge-img-1,
.brydge-hero-gallery .elementor-widget:nth-child(1) {
    grid-column: 1;
    grid-row: 1 / 3;
}

.brydge-hero-gallery .brydge-img-1 img,
.brydge-hero-gallery .elementor-widget:nth-child(1) img {
    width: 100%;
    height: 100%;
    min-height: 400px;
    object-fit: cover;
    border-radius: 24px 24px 24px 80px;
    box-shadow: var(--shadow-card);
}

/* Image 2 - Haut droite */
.brydge-hero-gallery .brydge-img-2,
.brydge-hero-gallery .elementor-widget:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
}

.brydge-hero-gallery .brydge-img-2 img,
.brydge-hero-gallery .elementor-widget:nth-child(2) img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    border-radius: 24px 80px 24px 24px;
    box-shadow: var(--shadow-card);
}

/* Image 3 - Bas droite */
.brydge-hero-gallery .brydge-img-3,
.brydge-hero-gallery .elementor-widget:nth-child(3) {
    grid-column: 2;
    grid-row: 2;
}

.brydge-hero-gallery .brydge-img-3 img,
.brydge-hero-gallery .elementor-widget:nth-child(3) img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    border-radius: 24px 24px 80px 24px;
    box-shadow: var(--shadow-card);
}

/* Carte Stats (optionnelle - widget 4) */
.brydge-hero-gallery .brydge-stats-card,
.brydge-hero-gallery .elementor-widget:nth-child(4) {
    position: absolute;
    bottom: -42px;
    left: 30%;
    transform: translateX(-50%);
    z-index: 10;
}

/* Style pour la carte de stats bleue */
.brydge-stats-card-inner {
    background: linear-gradient(135deg, var(--main) 0%, var(--main-shade) 100%);
    color: white;
    padding: 24px 40px;
    border-radius: 20px;
    text-align: center;
    box-shadow: 0 20px 40px -10px rgba(7, 141, 238, 0.4);
}

.brydge-stats-card-inner .brydge-stats-label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    opacity: 0.9;
    margin-bottom: 4px;
}

.brydge-stats-card-inner .brydge-stats-value {
    font-size: 24px;
    font-weight: 900;
    letter-spacing: -0.02em;
}

/* Container avec position relative pour la carte stats */
.brydge-hero-gallery-wrapper {
    position: relative;
    padding-bottom: 60px;
}

/* Responsive */
@media (max-width: 991px) {
    .brydge-hero-gallery {
        max-width: 500px;
        gap: 12px;
    }

    .brydge-hero-gallery .brydge-img-1 img,
    .brydge-hero-gallery .elementor-widget:nth-child(1) img {
        min-height: 320px;
        border-radius: 20px 20px 20px 60px;
    }

    .brydge-hero-gallery .brydge-img-2 img,
    .brydge-hero-gallery .elementor-widget:nth-child(2) img,
    .brydge-hero-gallery .brydge-img-3 img,
    .brydge-hero-gallery .elementor-widget:nth-child(3) img {
        height: 150px;
        border-radius: 20px;
    }
}

@media (max-width: 767px) {
    .brydge-hero-gallery {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto;
        gap: 10px;
        max-width: 100%;
    }

    .brydge-hero-gallery .brydge-img-1 img,
    .brydge-hero-gallery .elementor-widget:nth-child(1) img {
        min-height: 250px;
        border-radius: 16px 16px 16px 40px;
    }

    .brydge-hero-gallery .brydge-img-2 img,
    .brydge-hero-gallery .elementor-widget:nth-child(2) img,
    .brydge-hero-gallery .brydge-img-3 img,
    .brydge-hero-gallery .elementor-widget:nth-child(3) img {
        height: 120px;
        border-radius: 16px;
    }

    .brydge-stats-card-inner {
        padding: 16px 24px;
    }

    .brydge-stats-card-inner .brydge-stats-value {
        font-size: 20px;
    }
}

/* ============================================
   22. HERO SECTION LEFT CONTENT
   ============================================ */

/* Badge "Nouveau" style - largeur auto, pas 100% */
.brydge-hero-badge,
.elementor-widget-text-editor .brydge-hero-badge {
    display: inline-flex !important;
    width: auto !important;
    max-width: fit-content !important;
    align-items: center;
    gap: 8px;
    background: rgba(7, 141, 238, 0.1);
    color: var(--main);
    padding: 8px 16px;
    border-radius: var(--radius-full);
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    margin-bottom: 32px;
}

.brydge-hero-badge::before {
    content: '';
    width: 8px;
    height: 8px;
    background: var(--main);
    border-radius: 50%;
    animation: pulse-dot 2s ease-in-out infinite;
}

@keyframes pulse-dot {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(1.2); }
}

/* Titre avec highlight italique */
.brydge-hero-title {
    font-family: var(--font-heading);
    font-size: clamp(36px, 5vw, 56px);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: -0.03em;
    color: var(--text-primary);
    margin-bottom: 24px;
}

.brydge-hero-title em,
.brydge-hero-title i,
.brydge-hero-title .highlight {
    font-style: italic;
    color: var(--main);
    background: linear-gradient(135deg, var(--main) 0%, var(--main-shade) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Description */
.brydge-hero-description {
    font-size: 17px;
    font-weight: 400;
    line-height: 1.7;
    color: var(--text-secondary);
    margin-bottom: 32px;
    max-width: 450px;
}

/* ============================================
   23. HERO GALLERY ANIMATIONS
   ============================================ */

/* Keyframes pour le fade-in depuis le bas */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(40px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Keyframes pour l'effet de flottement subtil */
@keyframes float {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-12px);
    }
}

/* Keyframes pour le flottement plus doux (images secondaires) */
@keyframes floatSoft {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-8px);
    }
}

/* Application des animations aux images */
.brydge-hero-gallery .brydge-img-1,
.brydge-hero-gallery .elementor-widget:nth-child(1) {
    opacity: 0;
    animation:
        fadeInUp 0.8s ease-out forwards,
        float 6s ease-in-out infinite;
    animation-delay: 0.1s, 0.9s;
}

.brydge-hero-gallery .brydge-img-2,
.brydge-hero-gallery .elementor-widget:nth-child(2) {
    opacity: 0;
    animation:
        fadeInUp 0.8s ease-out forwards,
        floatSoft 5s ease-in-out infinite;
    animation-delay: 0.3s, 1.1s;
}

.brydge-hero-gallery .brydge-img-3,
.brydge-hero-gallery .elementor-widget:nth-child(3) {
    opacity: 0;
    animation:
        fadeInUp 0.8s ease-out forwards,
        floatSoft 7s ease-in-out infinite;
    animation-delay: 0.5s, 1.3s;
}

/* Carte stats avec animation */
.brydge-hero-gallery .brydge-stats-card,
.brydge-hero-gallery .elementor-widget:nth-child(4) {
    opacity: 0;
    animation: fadeInUp 0.8s ease-out forwards;
    animation-delay: 0.7s;
}

/* Désactiver les animations si l'utilisateur préfère réduire les mouvements */
@media (prefers-reduced-motion: reduce) {
    .brydge-hero-gallery .brydge-img-1,
    .brydge-hero-gallery .elementor-widget:nth-child(1),
    .brydge-hero-gallery .brydge-img-2,
    .brydge-hero-gallery .elementor-widget:nth-child(2),
    .brydge-hero-gallery .brydge-img-3,
    .brydge-hero-gallery .elementor-widget:nth-child(3),
    .brydge-hero-gallery .brydge-stats-card,
    .brydge-hero-gallery .elementor-widget:nth-child(4) {
        opacity: 1;
        animation: none;
    }
}

/* ============================================
   24. EXPLORE - BOUTON "TOUT VOIR" DISCRET
   ============================================ */

/* Container des boutons de recherche */
.rz-submit-buttons {
    align-items: center !important;
}

/* Bouton "Tout voir" - Style lien discret */
.rz-submit-buttons .rz--submit:last-child .rz-button {
    background: transparent !important;
    box-shadow: none !important;
    color: var(--text-main) !important;
    padding: 8px 16px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    border: none !important;
}

.rz-submit-buttons .rz--submit:last-child .rz-button::after {
    display: none !important;
}

.rz-submit-buttons .rz--submit:last-child .rz-button span {
    color: var(--main) !important;
}

.rz-submit-buttons .rz--submit:last-child .rz-button:hover {
    background: transparent !important;
    color: var(--main-shade) !important;
    transform: none !important;
}

.rz-submit-buttons .rz--submit:last-child .rz-button:hover span {
    color: var(--main-shade) !important;
}

/* ============================================
   25. EXPLORE - TITRES DE RECHERCHE
   ============================================ */

/* Container des titres */
.rz--title {
    margin-top: 16px;
}

/* Premier titre (Type de listing : Restaurants) */
.rz--title .searched-term:first-of-type {
    font-size: 28px;
    font-weight: 900;
    color: var(--text-primary);
    margin: 0 0 4px 0;
    line-height: 1.4;
}

/* Deuxième titre (Filtre : Chinese) */
.rz--title .searched-term:nth-of-type(2) {
    font-size: 18px;
    font-weight: 700;
    color: var(--text-secondary);
    margin: 0;
    line-height: 1.3;
}

/* ============================================
   26. HERO CAROUSEL - BOUTON FERMER DANS TABS
   ============================================ */

/* Bouton Fermer dans les flyouts des tabs - Style lien */
.rz-tab-footer .rz-button {
    background: transparent !important;
    color: var(--main) !important;
    padding: 8px 16px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    box-shadow: none !important;
    border: none !important;
}

.rz-tab-footer .rz-button::after {
    display: none !important;
}

.rz-tab-footer .rz-button span {
    color: var(--main) !important;
}

.rz-tab-footer .rz-button:hover {
    background: transparent !important;
    color: var(--main-shade) !important;
    transform: none !important;
}

.rz-tab-footer .rz-button:hover span {
    color: var(--main-shade) !important;
}

/* ============================================
   27. HERO CAROUSEL - ALIGNEMENT DES CHAMPS
   ============================================ */

/* Aligner tous les champs sur la même hauteur */
.brk-carousel-search .rz-search-form .rz-search-mods {
    align-items: stretch !important;
}

/* Uniformiser la hauteur des modules */
.brk-carousel-search .rz-search-form .rz-search-mods > .rz-mod {
    display: flex !important;
    align-items: stretch !important;
}

.brk-carousel-search .rz-search-form .rz-search-mods > .rz-mod > .rz-form-group {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
}

/* Réduire la hauteur de l'input text pour matcher les tabs */
.brk-carousel-search .rz-search-form .rz-search-mods > .rz-mod > .rz-form-group > input[type=text] {
    height: auto !important;
    line-height: 1.4 !important;
    padding: 8px 16px !important;
}

/* Supprimer le label heading dans le carousel (ils sont cachés visuellement) */
.brk-carousel-search .rz-search-form .rz-search-mods > .rz-mod > .rz-form-group > .rz-heading {
    display: none !important;
}

/* Filter tab - flexbox pour alignement */
.brk-carousel-search .rz-filter-tab {
    display: flex !important;
    align-items: stretch !important;
}

/* Tab title - même style que l'input */
.brk-carousel-search .rz-filter-tab .rz-tab-title {
    height: auto !important;
    padding: 8px 16px !important;
    line-height: 1.4 !important;
    display: flex !important;
}

/* ============================================
   28. SINGLE LISTING - STYLES
   ============================================ */

/* Cover Wide Wall - Afficher sous le header (pas d'overlap) */
.single-rz_listing .brk-wall {
    margin-top: 0;
}

/* Enlever le border-bottom sur les actions info */
.single-rz_listing .rz-action-info p {
    border-bottom: none !important;
}

/* Titre des actions dans la sidebar */
.rz-mod-action .rz--title {
    margin-bottom: 1rem;
    font-size: 21px;
    margin-top: 0;
}
.rz-sidebar .rz-single-sidebar.rz--sticky {
    padding-top: 4.75rem;
    margin-top: -4.75rem;
}

.rz-single-heading {
    display: flex;
    margin-bottom: 0rem;
}

/* Titre plus grand sur mobile */
@media (max-width: 767.98px) {
    .rz-single-heading .rz-single-heading-title .rz-title {
        font-size: 26px;
    }
}

.rz-mod-listing .rz-mod-content {
    margin: 0 0 2rem 0;
}

.brk-nearby {
    margin-top: 4rem;
}
.brk-similar {
    margin-top: 2rem;
    margin-bottom: 4rem;
}

/* ============================================
   29.1. SINGLE LISTING - MASQUER LES MODULES VIDES
   ============================================ */

/* Masquer les modules meta qui n'ont pas de li (liste vide) */
.rz-mod-listing-meta:not(:has(li)) {
    display: none !important;
}

/* Icônes pour les réseaux sociaux (auto-détection par URL) */
.rz-mod-listing-meta li a[href*="facebook.com"]::before,
.rz-mod-listing-meta li a[href*="instagram.com"]::before,
.rz-mod-listing-meta li a[href*="linkedin.com"]::before,
.rz-mod-listing-meta li a[href*="twitter.com"]::before,
.rz-mod-listing-meta li a[href*="x.com"]::before,
.rz-mod-listing-meta li a[href*="youtube.com"]::before,
.rz-mod-listing-meta li a[href*="tiktok.com"]::before {
    font-family: "Font Awesome 6 Brands";
    font-weight: 400;
    min-width: 24px;
    margin-right: 10px;
    font-size: 22px;
    text-align: center;
    color: var(--text-primary);
}

.rz-mod-listing-meta li a[href*="facebook.com"]::before {
    content: "\f39e"; /* fa-facebook-f */
}

.rz-mod-listing-meta li a[href*="instagram.com"]::before {
    content: "\f16d"; /* fa-instagram */
}

.rz-mod-listing-meta li a[href*="linkedin.com"]::before {
    content: "\f0e1"; /* fa-linkedin-in */
}

.rz-mod-listing-meta li a[href*="twitter.com"]::before,
.rz-mod-listing-meta li a[href*="x.com"]::before {
    content: "\e61b"; /* fa-x-twitter */
}

.rz-mod-listing-meta li a[href*="youtube.com"]::before {
    content: "\f167"; /* fa-youtube */
}

.rz-mod-listing-meta li a[href*="tiktok.com"]::before {
    content: "\e07b"; /* fa-tiktok */
}

/* ============================================
   29. MOBILE SEARCH BAR FIX
   ============================================ */

/* Fix pour la barre de recherche sur mobile - forcer le retour à la ligne */
@media (max-width: 767.98px) {
    /* Container principal doit s'adapter au contenu */
    .rz-search-form {
        max-width: 100%;
        overflow: visible !important;
        height: auto !important;
    }

    /* Le formulaire doit aussi s'adapter */
    .rz-search-form form,
    .rz--form,
    .rz-search-filter,
    .rz-search-filter-inner {
        height: auto !important;
        overflow: visible !important;
    }

    /* rz-search-mods doit wrapper les enfants et s'adapter à la hauteur */
    .rz-search-mods {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: wrap !important;
        width: 100% !important;
        height: auto !important;
        overflow: visible !important;
    }

    /* Chaque module prend 100% de la largeur */
    .rz-search-mods > .rz-mod {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        display: block !important;
    }

    /* Form group à l'intérieur des modules */
    .rz-search-mods > .rz-mod > .rz-form-group,
    .rz-search-mods > .rz-mod > .rz-filter-tab,
    .rz-search-mods > .rz-mod > .rz-geo {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
    }

    /* Input text ne doit pas déborder */
    .rz-search-mods input[type="text"] {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Barre de recherche carousel - hauteur auto */
    .brk-carousel-search .rz-search-filter,
    .brk-carousel-search .brk-search-filter {
        height: auto !important;
        min-height: auto !important;
        overflow: visible !important;
    }

    /* Container du contenu de recherche */
    .brk--cont-search,
    .brk-carousel-search-type {
        height: auto !important;
        overflow: visible !important;
    }

    /* ===== STYLE DES CHAMPS DE RECHERCHE MOBILE ===== */

    /* Container des modules - espacement entre champs */
    .brk-carousel-search .rz-search-mods {
        gap: 0 !important;
    }

    /* Chaque champ de formulaire - style carte avec padding généreux */
    .brk-carousel-search .rz-search-mods > .rz-mod > .rz-form-group,
    .brk-carousel-search .rz-search-mods > .rz-mod > .rz-filter-tab,
    .brk-carousel-search .rz-search-mods > .rz-mod > .rz-geo {
        padding: 16px 20px !important;
        border-bottom: 1px solid var(--border-light) !important;
        background: transparent !important;
    }

    /* Dernier élément sans bordure */
    .brk-carousel-search .rz-search-mods > .rz-mod:last-child > .rz-form-group,
    .brk-carousel-search .rz-search-mods > .rz-mod:last-child > .rz-filter-tab,
    .brk-carousel-search .rz-search-mods > .rz-mod:last-child > .rz-geo {
        border-bottom: none !important;
    }

    /* Label des champs - visible et stylé */
    .brk-carousel-search .rz-search-mods .rz-heading {
        display: block !important;
        margin-bottom: 6px !important;
    }

    .brk-carousel-search .rz-search-mods .rz-heading label {
        display: block !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.05em !important;
        color: var(--text-primary) !important;
        margin-bottom: 0 !important;
    }

    /* Masquer la description sous le label */
    .brk-carousel-search .rz-search-mods .rz-heading p {
        display: none !important;
    }

    /* Input text - style amélioré */
    .brk-carousel-search .rz-search-mods input[type="text"] {
        padding: 10px 0 !important;
        font-size: 15px !important;
        font-weight: 500 !important;
        color: var(--text-primary) !important;
        background: transparent !important;
        border: none !important;
        border-radius: 0 !important;
    }

    .brk-carousel-search .rz-search-mods input[type="text"]::placeholder {
        color: var(--text-muted) !important;
        font-weight: 400 !important;
    }

    /* Tab title (Type de cuisine, etc.) */
    .brk-carousel-search .rz-filter-tab .rz-tab-title {
        padding: 10px 0 !important;
        font-size: 15px !important;
        font-weight: 500 !important;
        color: var(--text-muted) !important;
        background: transparent !important;
        border: none !important;
        border-radius: 0 !important;
        line-height: 1.4 !important;
        min-height: auto !important;
        height: auto !important;
    }

    .brk-carousel-search .rz-filter-tab .rz-tab-title span {
        font-size: 15px !important;
        font-weight: 500 !important;
    }

    /* Champ géolocalisation */
    .brk-carousel-search .rz-geo .rz-geo-field {
        padding: 0 !important;
    }

    .brk-carousel-search .rz-geo .rz-geo-field input {
        padding: 10px 0 !important;
        font-size: 15px !important;
        font-weight: 500 !important;
    }

    /* Icône GPS dans le champ localisation */
    .brk-carousel-search .rz-geo .rz-geo-get {
        right: 0 !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
    }
}

/* ============================================
   30. MOBILE HEADER - STICKY HIDE/SHOW
   ============================================ */

/* Header mobile - Base styles */
@media (max-width: 1199.98px) {
    /* Renforcer le z-index et la transition pour le hide/show */
    .brk-mobile-header {
        z-index: 1000 !important;
        line-height: normal;
    }

    /* État caché (scroll down) */
    .brk-mobile-header.header-hidden {
        transform: translateY(-100%);
    }

    /* État visible (scroll up ou en haut de page) */
    .brk-mobile-header.header-visible {
        transform: translateY(0);
    }

    /* Inner container - flexbox layout */
    .brk-mobile-header-inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 16px;
        height: 56px;
    }

    /* Logo à gauche */
    .brk-mobile-logo {
        flex-shrink: 0;
    }

    .brk-mobile-logo a {
        display: flex;
        align-items: center;
        text-decoration: none;
    }

    .brk-mobile-logo img {
        max-width: 100px;
        max-height: 32px;
        width: auto;
        height: auto;
    }

    .brk-mobile-logo .brk-site-name {
        font-family: var(--font-heading);
        font-size: 20px;
        font-weight: 900;
        color: var(--text-primary);
    }

    /* Bouton CTA à droite */
    .brk-mobile-cta {
        flex-shrink: 0;
    }

    /* Fallback pour l'ancien template (logo centré) */
    .brk-mobile-header .brk--site-name {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
    }

    .brk-mobile-header .brk--site-name img {
        max-width: 100px;
        max-height: 32px;
        margin: 12px 0;
        vertical-align: middle;
    }

    /* Ajouter du padding-top au body pour compenser le header fixed */
    body:not(.rz-is-explore):not(.single-rz_listing) {
        padding-top: 56px;
    }

    /* Support admin bar */
    .admin-bar .brk-mobile-header {
        top: 32px;
    }

    @media (max-width: 782px) {
        .admin-bar .brk-mobile-header {
            top: 46px;
        }

        .admin-bar body:not(.rz-is-explore):not(.single-rz_listing) {
            padding-top: calc(56px + 46px);
        }
    }

    /* ============================================
       HOMEPAGE - HEADER MOBILE TRANSPARENT
       ============================================ */

    /* Header transparent sur homepage (avant scroll) */
    body.brk-header-text-white:not(.brk-is-sticky) .brk-mobile-header {
        background: transparent;
        border-bottom: 1px solid transparent;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    /* Logo en blanc sur fond sombre */
    body.brk-header-text-white:not(.brk-is-sticky) .brk-mobile-logo .brk-site-name {
        color: #ffffff;
    }

    /* Si le logo est une image, on peut utiliser un filtre pour le rendre blanc */
    body.brk-header-text-white:not(.brk-is-sticky) .brk-mobile-logo img {
        filter: brightness(0) invert(1);
    }

    /* Bouton CTA - style transparent/outline sur fond sombre */
    body.brk-header-text-white:not(.brk-is-sticky) .brk-mobile-cta .brk-cta-button {
        background: transparent;
        border: 1px solid rgba(255, 255, 255, 0.5);
        color: #ffffff;
    }

    body.brk-header-text-white:not(.brk-is-sticky) .brk-mobile-cta .brk-cta-button:hover {
        background: rgba(255, 255, 255, 0.1);
        border-color: #ffffff;
    }

    /* Quand sticky (après scroll) - revenir au style normal */
    body.brk-header-text-white.brk-is-sticky .brk-mobile-header {
        background: rgba(255, 255, 255, 0.95);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        border-bottom: 1px solid var(--border-light);
    }

    body.brk-header-text-white.brk-is-sticky .brk-mobile-logo .brk-site-name {
        color: var(--text-primary);
    }

    body.brk-header-text-white.brk-is-sticky .brk-mobile-logo img {
        filter: none;
    }

    body.brk-header-text-white.brk-is-sticky .brk-mobile-cta .brk-cta-button {
        background: var(--accent-blue);
        border: none;
        color: #ffffff;
    }

    /* Homepage avec header overlap - pas de padding-top sur mobile */
    body.brk-overlap-header:not(.rz-is-explore):not(.single-rz_listing) {
        padding-top: 0;
    }
}

/* ============================================
   31. EXPLORE PAGE - SEO HEADER
   ============================================ */

/* H1 SEO dans le header de la page Explore */
.rz-taxonomy-heading .brydge-explore-h1 {
    font-family: var(--font-heading);
    font-size: 28px;
    font-weight: 700;
    color: var(--text-primary);
    letter-spacing: -0.025em;
    line-height: 1.2;
    margin: 0 0 8px 0;
}

/* Description SEO */
.rz-taxonomy-heading .brydge-explore-description {
    font-size: 14px;
    font-weight: 400;
    color: var(--text-secondary);
    line-height: 1.5;
    margin: 0 0 16px 0;
    max-width: 100%;
}

/* Responsive */
@media (max-width: 767px) {
    .rz-taxonomy-heading .brydge-explore-h1 {
        font-size: 22px;
    }

    .rz-taxonomy-heading .brydge-explore-description {
        font-size: 13px;
    }
}

/* ============================================
   32. NOUVEAU FOOTER SEO - BRYDGE
   ============================================ */

/* Variables footer */
.brydge-footer {
    --footer-bg: #010411;
    --footer-bg-cta: #020617;
    --footer-text: #94a3b8;
    --footer-text-light: #cbd5e1;
    --footer-heading: #ffffff;
    --footer-link: #94a3b8;
    --footer-link-hover: #ffffff;
    --footer-border: rgba(255, 255, 255, 0.1);
}

.brydge-footer {
    font-family: var(--font-body);
}

/* Container commun */
.brydge-footer-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 24px;
}

@media (min-width: 1024px) {
    .brydge-footer-container {
        padding: 0 64px;
    }
}

/* ============================================
   32.1. SECTION CTA BTOB
   ============================================ */

.brydge-footer-cta {
    background: var(--footer-bg-cta);
    padding: 80px 0;
    position: relative;
    overflow: hidden;
}

.brydge-footer-cta::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -10%;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);
    pointer-events: none;
}

.brydge-footer-cta-content {
    display: grid;
    grid-template-columns: 1fr;
    gap: 48px;
    align-items: center;
    position: relative;
    z-index: 1;
}

@media (min-width: 1024px) {
    .brydge-footer-cta-content {
        grid-template-columns: 1fr 1fr;
        gap: 80px;
    }
}

/* Badge gratuit */
.brydge-footer-cta-badge {
    display: inline-block;
    background: rgba(16, 185, 129, 0.15);
    color: #10b981;
    font-size: 13px;
    font-weight: 600;
    padding: 6px 14px;
    border-radius: 20px;
    margin-bottom: 16px;
    border: 1px solid rgba(16, 185, 129, 0.3);
}

.brydge-footer-cta-title {
    font-family: var(--font-heading);
    font-size: clamp(28px, 4vw, 42px);
    font-weight: 900;
    color: #ffffff;
    line-height: 1.1;
    margin: 0 0 16px 0;
    letter-spacing: -0.025em;
}

.brydge-footer-cta-description {
    font-size: 16px;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.7;
    margin: 0 0 32px 0;
}

.brydge-footer-cta-description strong {
    color: #ffffff;
    font-weight: 600;
}

/* Liste des features */
.brydge-footer-cta-features {
    list-style: none;
    padding: 0;
    margin: 0 0 32px 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.brydge-footer-cta-features li {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 15px;
    color: rgba(255, 255, 255, 0.9);
}

.brydge-footer-cta-features li i {
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(16, 185, 129, 0.2);
    color: #10b981;
    border-radius: 50%;
    font-size: 11px;
}

.brydge-footer-cta-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

.brydge-footer-cta .brydge-cta-btn--primary {
    background: #ffffff;
    color: var(--main) !important;
    padding: 16px 32px;
    border-radius: var(--radius-full);
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    transition: all 0.3s ease;
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.3);
}

.brydge-footer-cta .brydge-cta-btn--primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 15px 40px -10px rgba(0, 0, 0, 0.4);
}

.brydge-footer-cta .brydge-cta-btn--primary span {
    color: inherit;
}

.brydge-footer-cta .brydge-cta-btn--secondary {
    background: transparent;
    color: #ffffff !important;
    padding: 16px 32px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: var(--radius-full);
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    transition: all 0.3s ease;
}

.brydge-footer-cta .brydge-cta-btn--secondary:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.5);
}

.brydge-footer-cta .brydge-cta-btn--secondary span {
    color: inherit;
}

/* Mockup visual */
.brydge-footer-cta-visual {
    display: none;
}

@media (min-width: 1024px) {
    .brydge-footer-cta-visual {
        display: block;
    }
}

.brydge-footer-cta-mockup {
    position: relative;
}

.brydge-footer-cta-mockup img {
    max-width: 100%;
    height: auto;
    border-radius: 16px;
    box-shadow: 0 30px 60px -20px rgba(0, 0, 0, 0.4);
}


/* Texte dégradé */
.brydge-gradient-text {
    background: linear-gradient(to right, #078dee, #22d3ee);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

/* ============================================
   32.2. SECTION PRINCIPALE FOOTER
   ============================================ */

.brydge-footer-main {
    background: var(--footer-bg);
    padding: 80px 0 60px;
}

/* Intro SEO */
.brydge-footer-seo-intro {
    margin-bottom: 48px;
    padding-bottom: 48px;
    border-bottom: 1px solid var(--footer-border);
}

.brydge-footer-seo-intro p {
    font-size: 14px;
    color: var(--footer-text);
    line-height: 1.8;
    margin: 0;
    max-width: 900px;
}

/* Grille du footer */
.brydge-footer-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
}

@media (min-width: 640px) {
    .brydge-footer-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .brydge-footer-grid {
        grid-template-columns: 1.5fr repeat(4, 1fr);
        gap: 48px;
    }
}

/* Colonne marque */
.brydge-footer-col--brand {
    grid-column: 1 / -1;
}

@media (min-width: 1024px) {
    .brydge-footer-col--brand {
        grid-column: 1;
    }
}

.brydge-footer-logo {
    display: inline-block;
    margin-bottom: 20px;
    text-decoration: none;
}

.brydge-footer-logo img {
    height: 40px;
    width: auto;
}

.brydge-footer-logo-text {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 900;
    color: var(--footer-heading);
    letter-spacing: -0.025em;
}

.brydge-footer-logo-text span {
    color: var(--main);
}

.brydge-footer-tagline {
    font-size: 14px;
    color: var(--footer-text);
    line-height: 1.7;
    margin: 0 0 24px 0;
    max-width: 300px;
}

/* Réseaux sociaux */
.brydge-footer-social {
    display: flex;
    gap: 12px;
}

.brydge-footer-social a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid var(--footer-border);
    border-radius: var(--radius-sm);
    color: var(--footer-text);
    font-size: 16px;
    text-decoration: none;
    transition: all 0.2s ease;
}

.brydge-footer-social a:hover {
    background: var(--main);
    border-color: var(--main);
    color: #ffffff;
    transform: translateY(-2px);
}

/* Titres colonnes */
.brydge-footer-heading {
    font-family: var(--font-heading);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: var(--footer-heading);
    margin: 0 0 20px 0;
}

/* Listes de liens */
.brydge-footer-links {
    list-style: none;
    margin: 0;
    padding: 0;
}

.brydge-footer-links li {
    margin-bottom: 12px;
}

.brydge-footer-links li:last-child {
    margin-bottom: 0;
}

.brydge-footer-links a {
    font-size: 14px;
    color: var(--footer-link);
    text-decoration: none;
    transition: all 0.2s ease;
    display: inline-block;
}

.brydge-footer-links a:hover {
    color: var(--footer-link-hover);
    transform: translateX(3px);
}

.brydge-footer-links a strong {
    color: var(--main);
    font-weight: 600;
}

.brydge-footer-links a:hover strong {
    color: #ffffff;
}

.brydge-footer-links li span {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.35);
}

.brydge-footer-coming-soon {
    margin-bottom: 12px;
    font-size: 12px;
    color: var(--main);
    font-weight: 600;
    font-style: italic;
}

/* ============================================
   32.3. SECTION COPYRIGHT
   ============================================ */

.brydge-footer-bottom {
    background: var(--footer-bg);
    padding: 24px 0;
    border-top: 1px solid var(--footer-border);
}

.brydge-footer-bottom-inner {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
    text-align: center;
}

@media (min-width: 768px) {
    .brydge-footer-bottom-inner {
        flex-direction: row;
        justify-content: space-between;
        text-align: left;
    }
}

.brydge-footer-copyright p {
    font-size: 13px;
    color: var(--footer-text);
    margin: 0;
}

.brydge-footer-copyright a {
    color: var(--footer-text-light);
    text-decoration: none;
    transition: color 0.2s ease;
}

.brydge-footer-copyright a:hover {
    color: var(--main);
}

.brydge-footer-legal {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: center;
}

.brydge-footer-legal a {
    font-size: 12px;
    color: var(--footer-text);
    text-decoration: none;
    transition: color 0.2s ease;
}

.brydge-footer-legal a:hover {
    color: var(--footer-link-hover);
}

.brydge-footer-sep {
    color: var(--footer-text);
    opacity: 0.5;
}

/* ============================================
   32.4. MASQUER L'ANCIEN FOOTER
   ============================================ */

/* Masquer l'ancien footer si le nouveau est présent */
.brydge-footer ~ .brk-footer,
.brydge-footer + .brk-footer {
    display: none !important;
}

/* L'ancien footer .brk-footer garde ses styles par défaut */

/* ============================================
   33. CTA FLOTTANT BTOB
   ============================================ */

.brydge-floating-cta {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 9999;
    max-width: 400px;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.4s ease;
    pointer-events: none;
}

.brydge-floating-cta.is-visible {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.brydge-floating-cta-inner {
    background: #ffffff;
    border-radius: var(--radius-lg);
    box-shadow: 0 20px 60px -15px rgba(0, 0, 0, 0.25);
    padding: 24px;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 16px;
    border: 1px solid var(--border-light);
}

.brydge-floating-cta-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 28px;
    height: 28px;
    border: none;
    background: var(--bg-soft);
    border-radius: var(--radius-full);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-muted);
    transition: all 0.2s ease;
}

.brydge-floating-cta-close:hover {
    background: var(--main-soft);
    color: var(--main);
}

.brydge-floating-cta-icon {
    width: 48px;
    height: 48px;
    background: var(--main-soft);
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--main);
    font-size: 20px;
}

.brydge-floating-cta-title {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 800;
    color: var(--text-primary);
    margin: 0;
    line-height: 1.3;
}

.brydge-floating-cta-text {
    font-size: 13px;
    color: var(--text-secondary);
    margin: 0;
    line-height: 1.5;
}

.brydge-floating-cta-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: var(--main);
    color: #ffffff !important;
    padding: 14px 24px;
    border-radius: var(--radius-sm);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.2s ease;
    text-align: center;
}

.brydge-floating-cta-btn:hover {
    background: var(--main-hover);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px -8px rgba(7, 141, 238, 0.5);
}

/* Responsive - masquer sur mobile où on a le sticky CTA */
@media (max-width: 767px) {
    .brydge-floating-cta {
        bottom: 16px;
        right: 16px;
        left: 16px;
        max-width: none;
    }

    .brydge-floating-cta-inner {
        padding: 20px;
    }
}

/* ============================================
   34. CTA STICKY MOBILE BTOC
   ============================================ */

.brydge-mobile-sticky-cta {
    display: none;
}

@media (max-width: 767px) {
    .brydge-mobile-sticky-cta {
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 1000;
        background: #ffffff;
        padding: 12px 16px;
        padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
        box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.1);
        border-top: 1px solid var(--border-light);
    }

    .brydge-mobile-sticky-cta-inner {
        display: flex;
        gap: 12px;
    }

    .brydge-mobile-sticky-btn {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 14px 16px;
        border-radius: var(--radius-sm);
        font-size: 14px;
        font-weight: 700;
        text-decoration: none;
        transition: all 0.2s ease;
    }

    .brydge-mobile-sticky-btn--primary {
        background: var(--main);
        color: #ffffff !important;
    }

    .brydge-mobile-sticky-btn--primary:hover {
        background: var(--main-hover);
    }

    .brydge-mobile-sticky-btn--secondary {
        background: var(--bg-soft);
        color: var(--text-primary) !important;
        border: 1px solid var(--border);
    }

    .brydge-mobile-sticky-btn--secondary:hover {
        background: var(--main-soft);
        border-color: var(--main);
        color: var(--main) !important;
    }

    .brydge-mobile-sticky-btn i {
        font-size: 16px;
    }

    /* Ajuster le padding du body pour ne pas masquer le contenu */
    .single-rz_listing {
        padding-bottom: 80px;
    }
}

/* ============================================
   35. FIL D'ARIANE (BREADCRUMB)
   ============================================ */

.brydge-breadcrumb {
    padding: 16px 0;
    margin-bottom: 16px;
}

.brydge-breadcrumb-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
    list-style: none;
    margin: 0;
    padding: 0;
}

.brydge-breadcrumb-item {
    display: flex;
    align-items: center;
    font-size: 13px;
}

.brydge-breadcrumb-item a {
    color: var(--text-secondary);
    text-decoration: none;
    transition: color 0.2s ease;
}

.brydge-breadcrumb-item a:hover {
    color: var(--main);
}

.brydge-breadcrumb-item.is-current span {
    color: var(--text-primary);
    font-weight: 600;
}

.brydge-breadcrumb-sep {
    display: inline-flex;
    align-items: center;
    margin: 0 10px;
    color: var(--text-muted);
    font-size: 8px;
}

/* ============================================
   36. SECTION SEO ENRICHIE
   ============================================ */

.brydge-seo-section {
    margin-top: 48px;
    padding-top: 32px;
    border-top: 1px solid var(--border-light);
}

.brydge-seo-title {
    font-family: var(--font-heading);
    font-size: 20px;
    font-weight: 800;
    color: var(--text-primary);
    margin: 0 0 16px 0;
}

.brydge-seo-content {
    font-size: 14px;
    color: var(--text-secondary);
    line-height: 1.7;
}

.brydge-seo-content p {
    margin: 0 0 12px 0;
}

.brydge-seo-content p:last-child {
    margin-bottom: 0;
}

.brydge-seo-content strong {
    color: var(--text-primary);
    font-weight: 600;
}

/* ============================================
   37. CTA BTOB SIDEBAR (DISCRET)
   ============================================ */

.brydge-sidebar-btob {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--border-light);
}

.brydge-sidebar-btob-inner {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.brydge-sidebar-btob-text {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 13px;
    color: var(--text-secondary);
}

.brydge-sidebar-btob-text i {
    color: var(--text-muted);
    font-size: 14px;
}

.brydge-sidebar-btob-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--main);
    text-decoration: none;
    transition: color 0.2s ease;
}

.brydge-sidebar-btob-link:hover {
    color: var(--main-shade);
}

.brydge-sidebar-btob-link i {
    font-size: 10px;
    transition: transform 0.2s ease;
}

.brydge-sidebar-btob-link:hover i {
    transform: translateX(3px);
}

/* ============================================
   38. MOBILE TOP BAR - SINGLE LISTING
   ============================================ */

/* Mobile : override le position: absolute du thème parent avec position: fixed */
@media (max-width: 1199.98px) {
    .brk-mobile-listing-top {
        position: fixed !important;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1000;
        background: var(--bg-white);
        border-bottom: 1px solid var(--border-light);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
        height: 56px;
    }

    .admin-bar .brk-mobile-listing-top {
        top: 32px;
    }

    /* Padding-top sur le body pour compenser le header fixed (comme sur desktop) */
    body.single-rz_listing {
        padding-top: 56px;
    }
}

@media (max-width: 782px) {
    .admin-bar .brk-mobile-listing-top {
        top: 46px;
    }
}

.brk-mobile-listing-top-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    height: 56px;
    width: 100%;
}

/* Fallback pour l'ancien markup du thème parent (brk-row/brk-grid) */
.brk-mobile-listing-top > .brk-row {
    padding: 0 16px;
}

.brk-mobile-listing-top .brk-grid {
    display: flex !important;
    align-items: center;
    justify-content: space-between !important;
    width: 100%;
    height: 56px;
}

.brk-mobile-listing-top .brk-grid .brk-col-6 {
    width: auto !important;
    flex: none !important;
    padding: 0;
}

/* Bouton Retour */
.brk-mobile-back-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--main);
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.brk-mobile-back-btn:hover {
    opacity: 0.7;
}

.brk-mobile-back-btn i {
    font-size: 14px;
}

/* Logo à droite */
.brk-mobile-listing-logo {
    display: flex;
    align-items: center;
}

.brk-mobile-listing-logo img {
    max-width: 90px;
    max-height: 28px;
    width: auto;
    height: auto;
}

.brk-mobile-listing-logo .brk-site-name {
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 900;
    color: var(--text-primary);
}

/* Masquer sur desktop */
@media (min-width: 992px) {
    .brk-mobile-listing-top {
        display: none;
    }
}

/* ============================================
   39. MOBILE CTA BAR (BOTTOM)
   ============================================ */

.brk-mobile-listing-bottom.brydge-mobile-cta-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background: var(--bg-white);
    border-top: 1px solid var(--border);
    padding: 12px 16px;
    padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.08);
}

/* Mobile : boutons full-width */
.brydge-mobile-cta-inner {
    display: flex;
    gap: 12px;
    width: 100%;
}

/* Tablette : limiter la largeur pour éviter des boutons trop larges */
@media (min-width: 768px) {
    .brydge-mobile-cta-inner {
        max-width: 400px;
        margin: 0 auto;
    }
}

.brydge-mobile-cta-btn {
    flex: 1 1 0%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 24px;
    border-radius: var(--radius-md);
    font-family: var(--font-body);
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s ease;
    white-space: nowrap;
    width: 100%;
    max-width: none !important;
}

.brydge-mobile-cta-btn i {
    font-size: 16px;
}

.brydge-mobile-cta-btn--primary {
    background: var(--main) !important;
    color: #fff !important;
}

.brydge-mobile-cta-btn--primary:hover {
    background: var(--main-shade) !important;
    color: #fff !important;
}

.brydge-mobile-cta-btn--primary i,
.brydge-mobile-cta-btn--primary span {
    color: #fff !important;
}

.brydge-mobile-cta-btn--secondary {
    background: var(--bg-white) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border) !important;
}

.brydge-mobile-cta-btn--secondary:hover {
    background: var(--bg-soft) !important;
    color: var(--text-primary) !important;
}

.brydge-mobile-cta-btn--secondary i,
.brydge-mobile-cta-btn--secondary span {
    color: var(--text-primary) !important;
}

/* Si un seul bouton, le centrer */
.brydge-mobile-cta-inner .brydge-mobile-cta-btn:only-child {
    max-width: 280px;
    margin: 0 auto;
}

/* Masquer sur desktop */
@media (min-width: 992px) {
    .brk-mobile-listing-bottom.brydge-mobile-cta-bar {
        display: none;
    }
}

/* Ajouter du padding en bas du contenu pour éviter que le CTA recouvre */
@media (max-width: 991px) {
    body.single-rz_listing .brk-main,
    body.single-rz_listing .site-main {
        padding-bottom: 32px;
    }
}

/* ============================================
   39. BREADCRUMB WRAPPER & WALL SPACING
   ============================================ */

.brk-wall-outer {
    margin-bottom: 0;
}

.brk-wall {
    position: relative;
    margin: -2rem auto 0rem;
    overflow: hidden;
}

.brydge-breadcrumb-wrapper {
    background: var(--bg-soft);
    border-bottom: 1px solid var(--border-light);
    margin-bottom: 2rem;
}

.brydge-breadcrumb-wrapper .brk-row {
    padding: 0;
}

.brydge-breadcrumb-wrapper .brydge-breadcrumb {
    padding: 16px 0px;
    margin: 0;
}

@media (max-width: 768px) {
    .brydge-breadcrumb-wrapper .brydge-breadcrumb {
        padding: 12px 16px;
    }
}

/* Masquer le heading de contenu sur mobile */
@media (max-width: 767px) {
    .brk--cont-heading.brk-active {
        display: none;
    }
}

/* Réduire l'espace au-dessus de .brk-nearby sur mobile */
@media (max-width: 767px) {
    .brk-nearby {
        margin-top: 2rem;
    }
}

/* ============================================
   MAP CLUSTERING
   ============================================ */

.brydge-cluster-marker {
    position: absolute;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--main);
    border: 3px solid var(--bg-white);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    z-index: 100;
}

.brydge-cluster-marker:hover {
    transform: scale(1.15);
    box-shadow: 0 4px 14px rgba(7, 141, 238, 0.5);
}

.brydge-cluster-marker span {
    color: #fff;
    font-family: var(--font-body, 'Public Sans', sans-serif);
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
}

/* ============================================
   MAP: Hide markers until clustering is ready
   ============================================ */

.rz-explore-map .rz-marker {
    visibility: hidden !important;
    opacity: 0 !important;
}

.rz-explore-map.brydge-markers-ready .rz-marker {
    visibility: visible !important;
    opacity: 1 !important;
}

/* During pagination transition - hide only markers, not map tiles */
.rz-explore-map.brydge-transitioning .rz-marker,
.rz-explore-map.brydge-transitioning .rz-marker * {
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* ============================================
   INFOBOX LAZY LOADING
   ============================================ */

.brydge-infobox-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 280px;
    min-height: 160px;
    background: #fff;
    border-radius: 12px;
}

.rz-infobox-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
}

.brydge-spinner {
    width: 28px;
    height: 28px;
    border: 3px solid #e5e7eb;
    border-top-color: var(--main, #078dee);
    border-radius: 50%;
    animation: brydge-spin 0.6s linear infinite;
}

@keyframes brydge-spin {
    to { transform: rotate(360deg); }
}

/* ============================================
   PAGE 404 CUSTOM
   ============================================ */

.brk-404-custom {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 8px 20px 80px;
    min-height: 50vh;
}

.brk-404-code {
    font-size: 5rem;
    font-weight: 800;
    color: var(--text-primary);
    line-height: 1;
    margin-bottom: 24px;
}

.brk-404-icon {
    width: 180px;
    height: auto;
    margin-bottom: 24px;
}

.brk-404-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 8px;
}

.brk-404-custom p {
    font-size: 1rem;
    color: var(--text-secondary);
    margin-bottom: 28px;
    max-width: 400px;
}

@media (min-width: 768px) {
    .brk-404-custom {
        padding-top: 60px;
    }
}