/*
Theme Name: Karting de Rennes
Theme URI: https://karting-rennes.fr/
Author: Erwan Tanguy / Ticoet
Author URI: https://ticoet.fr/
Description: Thème WordPress pour Karting Rennes Cap Malo - Le karting indoor en Bretagne
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.4
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: karting
Tags: karting, dark-theme, grid-layout, custom-header, custom-menu, featured-images, threaded-comments, translation-ready, accessibility-ready, block-styles, wide-blocks, full-width-template
*/

/* ==========================================================================
   POLICES LOCALES - Oswald & Montserrat (RGPD compliant)
   ========================================================================== */

/* Montserrat 400 - latin-ext */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('./fonts/montserrat-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Montserrat 400 - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('./fonts/montserrat-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Montserrat 600 - latin-ext */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('./fonts/montserrat-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Montserrat 600 - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('./fonts/montserrat-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Oswald 700 - latin-ext */
@font-face {
    font-family: 'Oswald';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('./fonts/oswald-700-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Oswald 700 - latin */
@font-face {
    font-family: 'Oswald';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('./fonts/oswald-700-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ==========================================================================
   VARIABLES CSS - CHARTE GRAPHIQUE KARTING RENNES
   Charte: #FFC400 (jaune), #111111 (noir), #C4C4C4 (gris), #FFFFFF (blanc)
   Typo: Oswald (titres), Montserrat (texte)
   ========================================================================== */

:root {
    /* Couleurs principales */
    --primary: #FFC400;
    --primary-hover: #E6B000;
    --bg-dark: #111111;
    --bg-card: #1a1a1a;
    --bg-darker: #0a0a0a;
    --text-light: #FFFFFF;
    --text-gray: #C4C4C4;
    --border-color: #333;
    --pale: #FFC40055;
    
    /* Typographie */
    --font-heading: 'Oswald', sans-serif;
    --font-body: 'Montserrat', sans-serif;
    
    /* Tailles de police */
    --text-xs: 0.75rem;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.125rem;
    --text-xl: 1.25rem;
    --text-2xl: 1.5rem;
    --text-3xl: 1.875rem;
    --text-4xl: 2.25rem;
    --text-5xl: 3rem;
    
    /* Espacements */
    --space-1: 0.5rem;
    --space-2: 1rem;
    --space-3: 1.5rem;
    --space-4: 2rem;
    --space-5: 2.5rem;
    --space-6: 3rem;
    --space-8: 4rem;
    --space-10: 5rem;
    
    /* Layout */
    --container-max: 1200px;
    --header-height: 80px;
    
    /* Transitions */
    --transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    --transition-fast: 0.2s ease;
}

/* ==========================================================================
   RESET & BASE
   ========================================================================== */

*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 16px;
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
    overflow-x: hidden;
}

body {
    font-family: var(--font-body);
    font-size: var(--text-base);
    line-height: 1.6;
    color: var(--text-light);
    background-color: var(--bg-dark);
    overflow-x: hidden;
    max-width: 100vw;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: var(--space-2);
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: 1px;
}

h1 { font-size: clamp(2rem, 5vw, var(--text-5xl)); }
h2 { font-size: clamp(1.5rem, 4vw, var(--text-4xl)); }
h3 { font-size: var(--text-2xl); }
h4 { font-size: var(--text-xl); }
h5 { font-size: var(--text-lg); }
h6 { font-size: var(--text-base); }

p {
    margin-bottom: var(--space-2);
    color: var(--text-gray);
}

a {
    color: var(--primary);
    text-decoration: none;
    transition: color var(--transition-fast);
}

a:hover {
    color: var(--primary-hover);
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

ul, ol {
    padding-left: 1.5rem;
    margin-bottom: var(--space-2);
    color: var(--text-gray);
}

/* ==========================================================================
   LAYOUT PRINCIPAL
   ========================================================================== */

.site {
    min-height: 100vh;
    display: grid;
    grid-template-rows: auto 1fr auto auto;
    grid-template-areas:
        "header"
        "main"
        "contact"
        "footer";
    overflow-x: hidden;
    max-width: 100%;
}

.site-header { grid-area: header; }
.site-main { grid-area: main; }
.contact { grid-area: contact; }
.site-footer { grid-area: footer; }

/* Container */
.container {
    width: 100%;
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 5%;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

/* Top Bar - Barre supérieure */
.top-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1001;
    background: #0a0a0a;
    border-bottom: 1px solid var(--border-color);
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.top-bar.hidden {
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none;
}

.top-bar-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 8px 5%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

/* Menu top bar */
.top-bar-menu ul {
    display: flex;
    gap: 20px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.top-bar-menu a {
    font-family: var(--font-body);
    font-size: 11px;
    color: var(--text-gray);
    text-decoration: none;
    transition: color 0.2s ease;
}
.top-bar-menu li.jaune{
    background-color: var(--primary);
    padding: 0 10px;
    border-radius: 4px;
    transition: var(--transition);
}
.top-bar-menu li.jaune a{
    color: var(--bg-dark);
    font-weight: bold;
}
.top-bar-menu li.jaune:hover{
    transform: scale(1.05);
    background: var(--primary-hover);
}
.top-bar-menu a:hover {
    color: var(--primary);
}

/* Réseaux sociaux top bar */
.top-bar-social {
    display: flex;
    gap: 12px;
    align-items: center;
}

.top-bar-social .social-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.05);
    color: var(--text-gray);
    transition: background 0.2s ease, color 0.2s ease;
}

.top-bar-social .social-link:hover {
    background: var(--primary);
    color: var(--bg-dark);
}

.top-bar-social .social-link svg {
    width: 14px;
    height: 14px;
}

/* Ajustement header quand top-bar visible */
.site-header {
    position: fixed;
    top: 45px;
    width: 100%;
    z-index: 1000;
    padding: 15px 5%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: var(--transition);
    background: linear-gradient(to bottom, rgba(0,0,0,0.8), transparent);
    min-height: 70px;
    box-sizing: border-box;
}

/* Header quand top-bar cachée */
.top-bar.hidden + .site-header,
.site-header.scrolled {
    top: 0;
}

.site-header.scrolled {
    padding: 10px 5%;
    background: rgba(17, 17, 17, 0.95);
    min-height: 60px;
    border-bottom: 1px solid var(--border-color);
}

/* Responsive top bar */
@media (max-width: 768px) {
    .top-bar-inner {
        padding: 6px 15px;
    }
    
    .top-bar-menu ul {
        gap: 12px;
    }
    
    .top-bar-menu a {
        font-size: 10px;
    }
    
    .top-bar-social .social-link {
        width: 24px;
        height: 24px;
    }
    
    .top-bar-social .social-link svg {
        width: 12px;
        height: 12px;
    }
    
    .site-header {
        top: 37px;
    }
}

@media (max-width: 480px) {
    .top-bar-menu {
        display: none;
    }
    
    .top-bar-social {
        margin: 0 auto;
    }
}

/* Logo animé */
.logo-container {
    display: flex;
    align-items: center;
    gap: 15px;
    transition: var(--transition);
}

.logo-container .logo-link {
    display: flex;
    align-items: center;
    gap: 15px;
    text-decoration: none;
}

.logo-k {
    position: relative;
    height: 60px;
    transition: var(--transition);
    flex-shrink: 0;
    overflow: visible;
}

.k-graphic {
    height: 100%;
    width: auto;
    display: block;
    max-height: 60px;
}

.logo-star {
    position: absolute;
    top: -10px;
    right: -2px;
    width: 25px;
    height: 25px;
    animation: sparkle 2s ease-in-out infinite;
    z-index: -1;
}

.logo-star img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.logo-text {
    opacity: 1;
    transform: translateX(0);
    transition: var(--transition);
    flex-shrink: 0;
}

.logo-text img {
    max-height: 40px;
    width: auto;
    display: block;
}

/* Logo état scrolled */
.site-header.scrolled .logo-text {
    opacity: 0;
    transform: translateX(-20px);
    pointer-events: none;
}

.site-header.scrolled .logo-k {
    height: 40px;
}

.site-header.scrolled .logo-star {
    top: -8px;
    right: -2px;
    width: 20px;
}

@keyframes sparkle {
    0%, 100% { opacity: 1; transform: scale(1) rotate(0deg); }
    50% { opacity: 0.7; transform: scale(1.2) rotate(180deg); }
}

/* Site branding classique (fallback) */
.site-branding a {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    color: var(--text-light);
    text-decoration: none;
}

.site-title {
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.custom-logo {
    max-height: 60px;
    width: auto;
}

/* Navigation principale */
.main-navigation ul {
    display: flex;
    list-style: none;
    gap: 30px;
    padding: 0;
    margin: 0;
}

.main-navigation a {
    color: var(--text-light);
    text-decoration: none;
    font-size: 14px;
    letter-spacing: 1px;
    transition: 0.3s;
    font-family: var(--font-heading);
    text-transform: uppercase;
    padding: var(--space-1) 0;
}

.main-navigation a:hover,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_item > a {
    color: var(--primary);
}

.main-navigation .current-menu-ancestor > a {
    color: var(--primary);
}

/* Sous-menus */
.main-navigation ul ul {
    position: absolute;
    top: 100%;
    left: 0;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 4px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
    min-width: 200px;
    padding: var(--space-1);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: var(--transition);
    flex-direction: column;
    gap: 0;
}

.main-navigation li {
    position: relative;
}

.main-navigation li:hover > ul,
.main-navigation li:focus-within > ul {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.main-navigation ul ul a {
    padding: var(--space-1) var(--space-2);
    border-radius: 4px;
    display: block;
}

.main-navigation ul ul a:hover {
    background: rgba(255, 196, 0, 0.1);
}

/* Menu burger mobile */
.menu-toggle {
    display: none;
    flex-direction: column;
    gap: 5px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 10px;
    z-index: 1003;
}

.menu-toggle span {
    display: block;
    width: 25px;
    height: 2px;
    background: var(--text-light);
    transition: var(--transition);
}
.btn-reserve.mobile{
    display: none;
}

.menu-toggle.active span:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
}

.menu-toggle.active span:nth-child(2) {
    opacity: 0;
}

.menu-toggle.active span:nth-child(3) {
    transform: rotate(-45deg) translate(5px, -5px);
}

/* Bouton réserver header */
.btn-reserve {
    background: var(--primary);
    color: var(--bg-dark);
    padding: 10px 25px;
    border-radius: 4px;
    font-weight: bold;
    text-decoration: none;
    transition: var(--transition);
    font-family: var(--font-heading);
    text-transform: uppercase;
    border: none;
    cursor: pointer;
    letter-spacing: 1px;
}

.btn-reserve:hover {
    transform: scale(1.05);
    background: var(--primary-hover);
    color: var(--bg-dark);
}

/* ==========================================================================
   HEADER RESPONSIVE MOBILE
   ========================================================================== */

@media (max-width: 1100px) {
    .site-header {
        padding: 10px 15px;
    }
    
    /* Menu burger visible */
    .menu-toggle {
        display: flex;
    }
    .btn-reserve.mobile{
        display: block;
    }
    
    /* Bouton réserver sticky en bas sur mobile */
    .btn-reserve.mobile {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 1004;
        margin: 0;
        padding: 16px 20px;
        text-align: center;
        border-radius: 0;
        font-size: 1.1rem;
        box-shadow: 0 -4px 20px rgba(0,0,0,0.4);
        display: none;
    }
    
    /* Navigation mobile - overlay scrollable */
    .main-navigation {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: var(--bg-dark);
        opacity: 0;
        visibility: hidden;
        transition: var(--transition);
        z-index: 1002;
        display: none;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        padding: 80px 20px 100px;
        max-height: 100vh;
        max-height: 100dvh;
    }
    
    .main-navigation.active {
        opacity: 1;
        visibility: visible;
        display: block;
    }
    
    .main-navigation.active + .btn-reserve.mobile,
    .site-header:has(.main-navigation.active) .btn-reserve.mobile {
        display: block;
    }
    
    /* Empêcher le scroll du body quand le menu mobile est ouvert */
    body.menu-open {
        overflow: hidden;
        height: 100vh;
        height: 100dvh;
        touch-action: none;
    }
    
    /* Cacher les FAB quand le menu mobile est ouvert */
    body.menu-open .fab-reserve,
    body.menu-open .fab-appli {
        display: none !important;
    }
    
    /* Padding-bottom du menu pour laisser la place au bouton sticky */
    .main-navigation.active {
        padding-bottom: 120px;
    }
    
    .main-navigation ul {
        flex-direction: column;
        text-align: left;
        gap: 0;
        list-style: none;
        padding: 0;
        margin: 0;
    }
    
    .main-navigation > ul > li {
        border-bottom: 1px solid var(--border-color);
    }
    
    .main-navigation > ul > li:last-child{
        border-bottom: none;
    }
    
    .main-navigation a {
        font-size: 1.2rem;
        padding: 16px 0;
        display: block;
    }
    
    /* Items avec sous-menu */
    .main-navigation .menu-item-has-children {
        position: relative;
    }
    
    .main-navigation .menu-item-has-children > a {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    
    /* Chevron pour sous-menus */
    .main-navigation .menu-item-has-children > a::after {
        content: '';
        width: 10px;
        height: 10px;
        border-right: 2px solid var(--primary);
        border-bottom: 2px solid var(--primary);
        transform: rotate(45deg);
        transition: transform 0.3s ease;
        flex-shrink: 0;
        margin-left: 10px;
    }
    
    .main-navigation .menu-item-has-children.submenu-open > a::after {
        transform: rotate(-135deg);
    }
    
    /* Sous-menus mobile - cachés par défaut */
    .main-navigation ul ul {
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        background: rgba(0, 0, 0, 0.3);
        border: none;
        box-shadow: none;
        min-width: auto;
        padding: 0;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease;
    }
    
    .main-navigation .menu-item-has-children.submenu-open > ul {
        max-height: 500px;
        padding: 8px 0;
    }
    
    .main-navigation ul ul li {
        border-bottom: none;
    }
    
    .main-navigation ul ul a {
        font-size: 1rem;
        color: var(--text-gray);
        padding: 12px 20px;
    }
    
    .main-navigation ul ul a:hover {
        color: var(--primary);
        background: rgba(255, 196, 0, 0.05);
    }
    
    /* Bouton réserver caché en mobile sauf .mobile */
    .btn-reserve:not(.mobile) {
        display: none;
    }
}

@media (max-width: 768px) {
    .site-header {
        padding: 8px 12px;
    }
    
    /* Logo plus petit sur mobile */
    .logo-container {
        max-width: 150px;
    }
    
    .logo-k {
        width: 45px;
        height: 45px;
    }
    
    .logo-k .k-graphic {
        width: 45px;
        height: auto;
    }
    
    .logo-star {
        width: 20px;
        height: 20px;
        top: -5px;
        right: -5px;
    }
    
    .logo-star img {
        width: 100%;
        height: auto;
    }
    
    /* Logo texte plus petit ou caché */
    .logo-text {
        max-width: 80px;
    }
    
    .logo-text img {
        width: 100%;
        height: auto;
    }
    
    /* Navigation mobile ajustée */
    .main-navigation a {
        font-size: 1.25rem;
    }
    
    .main-navigation ul ul a {
        font-size: 1rem;
    }
    
}

@media (max-width: 480px) {
    .site-header {
        padding: 8px 10px;
    }
    
    .logo-container {
        max-width: 120px;
    }
    
    .logo-k {
        width: 40px;
        height: 40px;
    }
    
    .logo-k .k-graphic {
        width: 40px;
    }
    
    .logo-star {
        width: 16px;
        height: 16px;
        top: -4px;
        right: -4px;
    }
    
    .logo-text {
        max-width: 65px;
    }
    
    /* Menu burger plus petit */
    .menu-toggle span {
        width: 22px;
    }
}

/* ==========================================================================
   BOUTONS
   ========================================================================== */

.btn {
    display: inline-block;
    padding: 12px 30px;
    font-family: var(--font-heading);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-decoration: none;
    border-radius: 4px;
    transition: var(--transition);
    cursor: pointer;
    border: none;
    font-size: var(--text-sm);
}

.btn-primary {
    background: var(--primary);
    color: var(--bg-dark);
}

.btn-primary:hover {
    background: var(--primary-hover);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(255, 196, 0, 0.4);
    color: var(--bg-dark);
}

.btn-secondary {
    background: transparent;
    color: var(--primary);
    border: 2px solid var(--primary);
}

.btn-secondary:hover {
    background: var(--primary);
    color: var(--bg-dark);
}
.boutique-sidebar .btn-primary:hover{
    color:var(--bg-card);
}

.btn-link {
    color: var(--primary);
    text-decoration: none;
    font-weight: bold;
    font-size: 14px;
    font-family: var(--font-heading);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.btn-link:hover {
    color: var(--primary-hover);
}

/* ==========================================================================
   MAIN CONTENT
   ========================================================================== */

.site-main {
    padding-top: var(--header-height);
}

/* Page standard */
.page-content,
.entry-content {
    padding: var(--space-8) 5%;
    max-width: var(--container-max);
    margin: 0 auto;
}
.single-event .entry-content {
    padding: 0;
    max-width: var(--container-max);
    margin: 0 auto;
}
.entry-content > * + * {
    margin-top: var(--space-3);
}

/* Titres de section */
.section-title {
    text-align: center;
    margin-bottom: 60px;
    font-size: 2.5rem;
}

.section-title span {
    color: var(--primary);
}

.section-intro {
    text-align: center;
    margin-bottom: 50px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.section-subtitle {
    color: var(--text-gray);
    font-size: 1.1rem;
    margin-top: -40px;
    margin-bottom: 40px;
    text-align: center;
}

/* ==========================================================================
   HERO SECTION (PAGE D'ACCUEIL)
   ========================================================================== */

.hero {
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)),
                url('') no-repeat center center;
    background-size: cover;
    position: relative;
    overflow: hidden;
}

/* ==========================================================================
   VIDÉO HERO (desktop uniquement, fallback image mobile)
   ========================================================================== */
.hero-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
    pointer-events: none;
}
.hero-video-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(rgba(0,0,0,0.55), rgba(0,0,0,0.65));
    z-index: 1;
    pointer-events: none;
}
.hero--has-video .hero-content {
    position: relative;
    z-index: 2;
}
/* Mobile : on masque la vidéo, on garde l'image de fond de la section */
@media (max-width: 768px) {
    .hero-video,
    .hero-video-overlay { display: none; }
}

/* ==========================================================================
   AMBIANCE : SPOTLIGHTS / HALOS / GRADIENT RACING
   Inspiration : effet "lumières" karting-toulouse.com
   Applicable via .bg-spotlights sur n'importe quelle section sombre
   ========================================================================== */
.bg-spotlights,
.hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}
.bg-spotlights::before,
.hero::before {
    content: "";
    position: absolute;
    inset: -20%;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 20% 30%, rgba(255, 196, 0, 0.12), transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(255, 170, 60, 0.07), transparent 55%),
        radial-gradient(circle at 60% 20%, rgba(255, 230, 160, 0.04), transparent 45%);
    animation: kartSpotlights 18s ease-in-out infinite alternate;
}
.hero-content,
.bg-spotlights > * { position: relative; z-index: 2; }

@keyframes kartSpotlights {
    0%   { transform: translate(0, 0) scale(1); opacity: .9; }
    33%  { transform: translate(5%, -3%) scale(1.1); opacity: 1; }
    66%  { transform: translate(-4%, 4%) scale(1.05); opacity: .85; }
    100% { transform: translate(3%, 2%) scale(1.08); opacity: .95; }
}

/* Lignes de vitesse (optionnel, pour sections CTA) */
.bg-speed-lines {
    position: relative;
    overflow: hidden;
}
.bg-speed-lines::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        repeating-linear-gradient(
            -20deg,
            transparent 0 80px,
            rgba(255, 196, 0, 0.04) 80px 82px,
            transparent 82px 160px
        );
    animation: kartSpeedLines 12s linear infinite;
    opacity: .7;
}
.bg-speed-lines > * { position: relative; z-index: 2; }

@keyframes kartSpeedLines {
    from { background-position: 0 0; }
    to   { background-position: 400px 0; }
}

/* Halo animé subtil (pour sections claires sur fond sombre) */
.bg-glow {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}
.bg-glow::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 80%;
    height: 120%;
    transform: translate(-50%, -50%);
    background: radial-gradient(ellipse at center, rgba(255, 196, 0, 0.12), transparent 60%);
    z-index: 0;
    pointer-events: none;
    animation: kartGlow 8s ease-in-out infinite alternate;
}
.bg-glow > * { position: relative; z-index: 2; }

@keyframes kartGlow {
    from { opacity: .5; transform: translate(-50%, -50%) scale(.95); }
    to   { opacity: 1;  transform: translate(-50%, -50%) scale(1.05); }
}

/* Accessibilité : désactive les animations si l'utilisateur le demande */
@media (prefers-reduced-motion: reduce) {
    .hero::before,
    .bg-spotlights::before,
    .bg-speed-lines::after,
    .bg-glow::before {
        animation: none !important;
    }
}

.hero-content {
    max-width: 900px;
    padding: 0 5%;
}

.hero-content h1{
    font-size: clamp(3rem, 8vw, 3.5rem);/* 3rem, 8vw, 5.5rem */
    line-height: 1;
    margin-bottom: 20px;
    opacity: 0;
    transform: translateY(30px);
}

.hero-content h1 span,.page-hero h1 span {
    color: var(--primary);
}

.hero-content p {
    font-size: 1.2rem;
    color: var(--text-gray);
    max-width: 700px;
    margin: 0 auto 30px;
    opacity: 0;
}

.hero-content.active h1,
.hero-content.active p {
    opacity: 1;
    transform: translateY(0);
    transition: 1s ease-out;
}

/* ==========================================================================
   SECTION PISTE
   ========================================================================== */

.piste-section {
    padding: 100px 5% 50px;
    background: var(--bg-dark);
}

.piste-header {
    text-align: center;
    margin-bottom: 50px;
}

.piste-header p {
    color: var(--text-gray);
}

.piste-container {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 40px;
    max-width: var(--container-max);
    margin: 0 auto;
    align-items: center;
}

.cta-container{
    max-width: var(--container-max);
    margin: 0 auto;
}

.virtual-tour-wrapper {
    background: var(--bg-card);
    aspect-ratio: 16 / 9;
    border: 2px solid var(--border-color);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    transition: var(--transition);
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.virtual-tour-wrapper:hover {
    border-color: var(--primary);
}

.virtual-tour-wrapper iframe {
    width: 100%;
    height: 100%;
    border: none;
}

.piste-stats {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.stat-card {
    background: linear-gradient(90deg, var(--bg-card) 0%, transparent 100%);
    padding: 18px;/* 30px*/
    border-left: 3px solid var(--primary);
}

.stat-value {
    display: block;
    font-family: var(--font-heading);
    font-size: 2rem;
    color: var(--text-light);
    line-height: 1;
}

.stat-label {
    font-size: 0.8rem;
    color: var(--primary);
    letter-spacing: 2px;
    text-transform: uppercase;
    padding-top: 10px;
    display: block;
}

/* ==========================================================================
   SECTION OFFRES / CARDS
   ========================================================================== */

.offers {
    padding: 50px 5%;
}

.grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
    gap: 30px;
    max-width: var(--container-max);
    margin: 0 auto;
}

.card {
    background: var(--bg-card);
    padding: 40px;
    border-radius: 8px;
    border: 1px solid var(--border-color);
    transition: var(--transition);
    position: relative;
    overflow: hidden;
}

.card:hover {
    border-color: var(--primary);
    transform: translateY(-10px);
}

.card h3 {
    font-size: 1.8rem;
    margin-bottom: 15px;
}

.card p {
    color: var(--text-gray);
    margin-bottom: 25px;
}

/* --------------------------------------------------------------------------
   VARIANTES UNIVERS : card 1 = adultes (jaune défaut)
   card 2 = kids (violet), card 3 = entreprise (turquoise)
   -------------------------------------------------------------------------- */
:root {
    --accent-kids: #8b5cf6;          /* violet racing kids */
    --accent-kids-hover: #a78bfa;
    --accent-enterprise: #14b8a6;    /* turquoise pro */
    --accent-enterprise-hover: #2dd4bf;
}
.offers .grid .card:nth-child(1):hover {
    border-color: var(--primary);
    box-shadow: 0 10px 40px rgba(255, 196, 0, 0.25);
}
.offers .grid .card:nth-child(1):hover h3,
.offers .grid .card:nth-child(1):hover .btn-link {
    color: var(--primary);
}
.offers .grid .card:nth-child(2):hover {
    border-color: var(--accent-kids);
    box-shadow: 0 10px 40px rgba(139, 92, 246, 0.25);
}
.offers .grid .card:nth-child(2):hover h3,
.offers .grid .card:nth-child(2):hover .btn-link {
    color: var(--accent-kids);
}

.offers .grid .card:nth-child(3):hover {
    border-color: var(--accent-enterprise);
    box-shadow: 0 10px 40px rgba(20, 184, 166, 0.25);
}
.offers .grid .card:nth-child(3):hover h3,
.offers .grid .card:nth-child(3):hover .btn-link {
    color: var(--accent-enterprise);
}

/* Transition douce des couleurs au survol */
.offers .card h3,
.offers .card .btn-link {
    transition: color .3s ease;
}

/* ==========================================================================
   SECTION KIDS
   ========================================================================== */

.kids-section {
    padding: 70px 5% 50px;//120px 5% 100px;
    background: linear-gradient(180deg, var(--bg-dark) 0%, #151515 100%);
    border-top: 1px solid #222;
}

.kids-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    max-width: var(--container-max);
    margin: 0 auto;
}

.kids-card {
    background: var(--bg-card);
    padding: 60px 40px;
    border-radius: 8px;
    border: 1px solid var(--border-color);
    position: relative;
    transition: var(--transition);
}

.kids-card:hover {
    border-color: var(--primary);
}

.kids-card h2 {
    font-size: 2.2rem;
    margin-bottom: 20px;
    line-height: 1.2;
}

.kids-card h2 span {
    color: var(--primary);
}

.kids-card p {
    color: var(--text-gray);
}

.badge {
    position: absolute;
    top: 25px;
    right: 25px;
    background: transparent;
    border: 1px solid var(--primary);
    color: var(--primary);
    padding: 5px 15px;
    font-family: var(--font-heading);
    font-size: 0.9rem;
    border-radius: 4px;
    text-transform: uppercase;
}

.badge.accent {
    background: var(--primary);
    color: var(--bg-dark);
}

.kids-features {
    list-style: none;
    margin: 25px 0;
    padding: 0;
    color: var(--text-gray);
}

.kids-features li {
    margin-bottom: 10px;
    font-size: 0.95rem;
    padding-left: 20px;
    position: relative;
}

.kids-features li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--primary);
}

.info-tag {
    display: inline-block;
    background: rgba(255, 196, 0, 0.1);
    color: var(--primary);
    padding: 8px 15px;
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 20px;
    border-radius: 4px;
}
.kids-card a.btn-link{
    display: block;
}
/* ==========================================================================
   SECTION Instagram
   ========================================================================== */
#instagram{
    padding: 50px 5%;
}

/* ==========================================================================
   SECTION TARIFS
   ========================================================================== */
.tarifs {
    padding: 50px 5%;
    background: var(--bg-darker);
}

.pricing-table {
    max-width: 900px;
    margin: 0 auto;
}

.price-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 25px;
    border-bottom: 1px solid #222;
    transition: 0.3s;
}

.price-row:hover {
    background: #151515;
}

.price-row.highlight {
    border-left: 4px solid var(--primary);
    background: rgba(255, 196, 0, 0.05);
}

.price-info h3 {
    font-size: 1.4rem;
    color: var(--text-light);
    margin-bottom: 5px;
}

.price-info p {
    color: var(--text-gray);
    font-size: 0.9rem;
    margin: 0;
}

.price-value {
    font-family: var(--font-heading);
    font-size: 2rem;
    color: var(--primary);
}

.price-value span {
    font-size: 1rem;
    color: var(--text-gray);
}

.tarif-note {
    text-align: center;
    margin-top: 30px;
    font-size: 0.8rem;
    color: #555;
}

/* ==========================================================================
   MODALE ACCUEIL
   ========================================================================== */
.kart-modal{position:fixed;inset:0;z-index:99999;display:none;align-items:center;justify-content:center;padding:20px}
.kart-modal.is-open{display:flex}
.kart-modal-overlay{position:absolute;inset:0;background:rgba(0,0,0,.85);backdrop-filter:blur(4px);cursor:pointer}
.kart-modal-content{position:relative;background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;max-width:600px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,.8);animation:kartModalIn .3s ease-out}
@keyframes kartModalIn{from{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}
.kart-modal-close{position:absolute;top:12px;right:12px;background:rgba(0,0,0,.6);color:#fff;border:none;width:36px;height:36px;border-radius:50%;font-size:24px;line-height:1;cursor:pointer;z-index:2;transition:all .2s}
.kart-modal-close:hover{background:var(--primary);color:var(--bg-dark)}
.kart-modal-image img{width:100%;height:auto;display:block;border-radius:12px 12px 0 0}
.kart-modal-body{padding:30px}
.kart-modal-title{font-family:var(--font-heading);color:var(--primary);text-transform:uppercase;font-size:1.75rem;margin:0 0 15px;letter-spacing:1px}
.kart-modal-desc{color:var(--text-gray);line-height:1.6;margin-bottom:20px}
.kart-modal-desc p{margin:0 0 10px}
.kart-modal-btn{display:inline-block}
@media (max-width:600px){.kart-modal-body{padding:20px}.kart-modal-title{font-size:1.35rem}}

.btn-tarifs {
    background: var(--primary);
    color: var(--bg-dark);
    padding: 10px 25px;
    border-radius: 4px;
    font-weight: bold;
    text-decoration: none;
    transition: var(--transition);
    font-family: var(--font-heading);
    text-transform: uppercase;
    border: none;
    cursor: pointer;
    letter-spacing: 1px;
    margin-left: auto;
    margin-right: auto;
    display:table;
}

.btn-tarifs:hover {
    transform: scale(1.05);
    background: var(--primary-hover);
    color: var(--bg-dark);
}

/* ==========================================================================
   SHORTCODE : ÉVÉNEMENTS PAR CATÉGORIE
   ========================================================================== */

.em-events-shortcode {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 30px;
    margin: 40px 0;
    justify-content: center;
}

.em-events-shortcode .event-card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.3s ease;
    width: calc(33.333% - 20px);
    min-width: 280px;
    max-width: 350px;
}

.em-events-shortcode .event-card:hover {
    transform: translateY(-5px);
    border-color: var(--primary);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.em-events-shortcode .event-link {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    height: 100%;
    width: 105%;
    background-color: var(--primary);
}

.em-events-shortcode .event-image {
    position: relative;
    height: 180px;
    background-size: cover;
    background-position: center;
    flex-shrink: 0;
}

.em-events-shortcode .event-date-badge {
    position: absolute;
    top: 15px;
    left: 15px;
    background: var(--primary);
    color: var(--bg-dark);
    padding: 10px 15px;
    border-radius: 6px;
    text-align: center;
    min-width: 60px;
}

.em-events-shortcode .event-date-badge .day {
    display: block;
    font-family: var(--font-heading);
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
}

.em-events-shortcode .event-date-badge .month {
    display: block;
    font-family: var(--font-heading);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.em-events-shortcode .event-title {
    font-family: var(--font-heading);
    font-size: 1.1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--bg-dark, #111);
    padding: 20px;
    margin: 0;
    line-height: 1.3;
}
.em-events-shortcode .event-card:hover .event-title{
    color: var(--text-light);
}

.em-events-shortcode .no-events {
    color: var(--text-gray);
    text-align: center;
    padding: 40px;
    width: 100%;
}

/* Responsive */
@media (max-width: 1100px) {
    .em-events-shortcode .event-card {
        width: calc(50% - 15px);
    }
}

@media (max-width: 600px) {
    .em-events-shortcode {
        flex-direction: column;
        align-items: center;
    }
    
    .em-events-shortcode .event-card {
        width: 100%;
        max-width: 400px;
    }
}

/* ==========================================================================
   SECTION ACTUALITÉS
   ========================================================================== */
.actus-section {
    padding: 80px 0;
    background: var(--bg-dark);
    overflow: hidden;
}

.actus-section .container {
    margin-bottom: 40px;
}

.actus-footer {
    margin-top: 40px;
    text-align: center;
}

/* Bandeau défilant actualités */
.actus-marquee {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding: 20px 0;
}

.actus-marquee::before,
.actus-marquee::after {
    content: '';
    position: absolute;
    top: 0;
    width: 150px;
    height: 100%;
    z-index: 2;
    pointer-events: none;
}

.actus-marquee::before {
    left: 0;
    background: linear-gradient(to right, var(--bg-dark), transparent);
}

.actus-marquee::after {
    right: 0;
    background: linear-gradient(to left, var(--bg-dark), transparent);
}

.actus-track {
    display: flex;
    gap: 30px;
    animation: marquee-actus 40s linear infinite;
    width: max-content;
}

.actus-track:hover {
    animation-play-state: paused;
}

@keyframes marquee-actus {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

/* Carte actualité */
.actus-card {
    flex-shrink: 0;
    width: 320px;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.3s ease;
    cursor: pointer;
}

.actus-card:hover {
    transform: translateY(-5px);
    border-color: var(--primary);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    cursor: pointer;
}

.actus-link {
    display: block;
    text-decoration: none;
    color: inherit;
}

.actus-image {
    position: relative;
    height: 180px;
    overflow: hidden;
    background: var(--bg-darker);
    cursor: pointer;
}

.actus-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.actus-card:hover .actus-image img {
    transform: scale(1.05);
}

.actus-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    font-size: 3rem;
    background: var(--bg-darker);
}

.actus-content {
    padding: 20px;
    cursor: pointer;
}

.actus-category {
    display: inline-block;
    background: var(--primary);
    color: var(--bg-dark);
    font-family: var(--font-heading);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 4px 10px;
    border-radius: 4px;
    margin-bottom: 12px;
}

.actus-title {
    font-family: var(--font-heading);
    font-size: 1.1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-light);
    margin: 0 0 12px 0;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.actus-date {
    display: block;
    color: var(--text-gray);
    font-size: 0.875rem;
}

/* Responsive */
@media (max-width: 768px) {
    .actus-track {
        gap: 20px;
        animation-duration: 25s;
    }
    
    .actus-card {
        width: 280px;
    }
    
    .actus-image {
        height: 160px;
    }
    
    .actus-marquee::before,
    .actus-marquee::after {
        width: 80px;
    }
}

/* ==========================================================================
   SECTION PARTENAIRES
   ========================================================================== */
.partenaires {
    padding: 80px 0;
    background: linear-gradient(180deg, var(--bg-dark) 0%, #151515 100%);
    border-top: 1px solid #222;
    overflow: hidden;
}

.partenaires .container {
    margin-bottom: 40px;
}

/* Bandeau défilant */
.partenaires-marquee {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding: 20px 0;
}

.partenaires-marquee::before,
.partenaires-marquee::after {
    content: '';
    position: absolute;
    top: 0;
    width: 150px;
    height: 100%;
    z-index: 2;
    pointer-events: none;
}

.partenaires-marquee::before {
    left: 0;
    background: linear-gradient(to right, #151515, transparent);
}

.partenaires-marquee::after {
    right: 0;
    background: linear-gradient(to left, #151515, transparent);
}

.partenaires-track {
    display: flex;
    gap: 60px;
    animation: marquee 30s linear infinite;
    width: max-content;
}

.partenaires-track:hover {
    animation-play-state: paused;
}

@keyframes marquee {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

.partenaire-item {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 80px;
    padding: 0 20px;
    filter: grayscale(100%) brightness(0.8);
    transition: all 0.3s ease;
}

.partenaire-item:hover {
    filter: grayscale(0%) brightness(1);
}

.partenaire-link {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.partenaire-logo {
    max-height: 60px;
    max-width: 150px;
    width: auto;
    height: auto;
    object-fit: contain;
}

/* Responsive */
@media (max-width: 768px) {
    .partenaires-track {
        gap: 40px;
        animation-duration: 20s;
    }
    
    .partenaire-item {
        height: 60px;
    }
    
    .partenaire-logo {
        max-height: 50px;
        max-width: 120px;
    }
    
    .partenaires-marquee::before,
    .partenaires-marquee::after {
        width: 80px;
    }
}

/* ==========================================================================
   SECTION REVIEWS / AVIS
   ========================================================================== */

.reviews-section {
    padding: 80px 5%;
    background: #0d0d0d;
    border-bottom: 1px solid #222;
}

.reviews-container {
    max-width: var(--container-max);
    margin: 0 auto;
}

.google-rating-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 60px;
}

.rating-stars .score {
    display: block;
    font-family: var(--font-heading);
    font-size: 3rem;
    color: var(--primary);
    line-height: 1;
}

.rating-stars .stars {
    color: var(--primary);
    font-size: 1.5rem;
    letter-spacing: 5px;
}

.rating-stars .count {
    color: var(--text-gray);
    font-size: 0.9rem;
    margin-top: 10px;
}

.reviews-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
    gap: 30px;
}

.review-card {
    background: var(--bg-card);
    padding: 30px;
    border-radius: 4px;
    border-top: 2px solid var(--primary);
}

.review-stars {
    color: var(--primary);
    margin-bottom: 15px;
}

.review-card p {
    font-style: italic;
    font-size: 0.95rem;
    color: var(--text-light);
    margin-bottom: 20px;
}

.review-card .author {
    color: var(--text-gray);
    font-weight: 600;
    font-size: 0.8rem;
    text-transform: uppercase;
}

/* ==========================================================================
   SECTION CONTACT
   ========================================================================== */

/* bordure jaune */
.borderjaune{
    border-color: var(--primary);
}

.contact {
    padding: 100px 5%;
}

.contact-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 60px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 5%;
}

/* Reset des styles widget dans la zone contact */
.contact-grid .widget,
.contact-grid .contact-widget {
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
    border-radius: 0;
}

.contact-grid .widget-title {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

/* Titre section contact */
.contact-grid .section-title,
.contact-grid h2.section-title,
.contact-grid h3.section-title {
    text-align: left;
    margin-bottom: 60px;
    font-size: 2.5rem;
    color: var(--text-light);
}

.contact-grid .section-title span {
    color: var(--primary);
}

/* Formulaires */
.contact-grid form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.contact-grid form input,
.contact-grid form select,
.contact-grid form textarea {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    padding: 15px;
    color: var(--text-light);
    font-family: 'Montserrat', sans-serif;
    border-radius: 4px;
    transition: 0.3s;
    width: 100%;
}

.contact-grid form input:focus,
.contact-grid form select:focus,
.contact-grid form textarea:focus {
    border-color: var(--primary);
    outline: none;
}

.contact-grid form input::placeholder,
.contact-grid form textarea::placeholder {
    color: var(--text-gray);
}

.contact-grid form textarea {
    min-height: 150px;
    resize: vertical;
}

.contact-grid form button[type="submit"],
.contact-grid form input[type="submit"],
.contact-grid .wpcf7-submit {
    background: var(--primary);
    color: var(--bg-dark);
    padding: 15px 30px;
    border: none;
    border-radius: 4px;
    font-family: 'Oswald', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: var(--transition);
}

.contact-grid form button[type="submit"]:hover,
.contact-grid form input[type="submit"]:hover,
.contact-grid .wpcf7-submit:hover {
    background: var(--primary-hover);
    transform: translateY(-2px);
}

/* Contact info colonne droite */
.contact-grid .contact-info {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

/* Info items */
.contact-grid .info-item,
.contact-grid .contact-info-widget {
    margin: 0;
}

.contact-grid .info-item h4,
.contact-grid .contact-info h4,
.contact-grid .info-title,
.contact-grid .contact-info-widget h4 {
    color: var(--primary) !important;
    margin-bottom: 10px;
    font-size: 1.2rem;
    letter-spacing: 1px;
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
}

.contact-grid .info-item h5,
.contact-grid .contact-info h5,
.contact-grid .contact-info-widget h5{
    font-size: .8rem;
    color: var(--primary) !important;
    font-family: 'Oswald', sans-serif;
    margin-top: 10px;
    margin-bottom: 10px;
}

.contact-grid .info-item p,
.contact-grid .contact-info p,
.contact-grid .contact-info-widget p {
    color: var(--text-gray);
    margin: 0;
    line-height: 1.6;
}

.contact-grid .contact-info a {
    color: var(--text-gray);
    transition: 0.3s;
}

.contact-grid .contact-info a:hover {
    color: var(--primary);
}

.info-item h4 {
    color: var(--primary);
    margin-bottom: 10px;
    font-size: 1.2rem;
    letter-spacing: 1px;
}

.info-item p {
    color: var(--text-gray);
    margin: 0;
}

.info-item a {
    color: var(--text-gray);
    transition: 0.3s;
}

.info-item a:hover {
    color: var(--primary);
}

/* ==========================================================================
   PLUGIN: RICH SHOWCASE FOR GOOGLE REVIEWS - OVERRIDE STYLES
   ========================================================================== */

/* Container principal */
.reviews-section .wp-gr {
    background: transparent !important;
    max-width: 100%;
    overflow: hidden;
}

/* Layout vertical : header en haut, slider en bas */
.reviews-section .grw-row {
    display: flex !important;
    flex-direction: column !important;
    padding-bottom: 36px !important;
}

/* Header avec logo Google et note */
.reviews-section .grw-header {
    margin-bottom: 60px;
    width: 100%;
}

.reviews-section .grw-header-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 15px;
}

/* Ajout du logo Google via CSS ::before */
.reviews-section .grw-header .rpi-flx.rpi-col8 {
    position: relative;
    align-items: center !important;
    justify-content: center;
}

/*.reviews-section .grw-header .rpi-flx.rpi-col8::before {
    content: " ";
    display: block;
    width: 100px;
    height: 34px;
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/2/2f/Google_2015_logo.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-bottom: 20px;
}*/

.reviews-section .grw-img-wrap {
    margin-bottom: 10px;
}

.reviews-section .grw-img {
    border-radius: 8px;
}

/* Nom de l'établissement */
.reviews-section .wp-google-name {
    font-family: 'Oswald', sans-serif;
    font-size: 1.5rem;
    color: var(--text-light) !important;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.reviews-section .wp-google-name a {
    color: var(--text-light) !important;
    text-decoration: none;
}

.reviews-section .wp-google-name a:hover {
    color: var(--primary) !important;
}
.reviews-section .wp-gr .wp-google-based{
    margin-top: 10px !important;
}
/* Étoiles de notation */
.reviews-section .rpi-stars {
    font-family: 'Oswald', sans-serif;
    font-size: 2.5rem !important;
    color: var(--primary) !important;
    margin-left: auto;
    margin-right: auto;
}

.reviews-section .rpi-stars::before {
    color: var(--primary) !important;
}

/* Texte "Basé sur X avis" */
.reviews-section .wp-google-based {
    color: var(--text-gray) !important;
    font-size: 0.9rem;
}

/* Powered by Google */
.reviews-section .wp-google-powered {
    color: var(--text-gray) !important;
    font-size: 0.8rem;
    margin-top: 5px;
}

/* Lien "notez-nous" */
.reviews-section .wp-google-wr a {
    color: var(--primary) !important;
    font-size: 0.85rem;
    transition: 0.3s;
}

.reviews-section .wp-google-wr a:hover {
    color: var(--primary-hover) !important;
}

/* Slider de reviews */
.reviews-section .grw-content {
    /*margin-top: 30px;*/
}

/* Cards des avis individuels */
.reviews-section .grw-review-inner {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-color) !important;
    border-top: 2px solid var(--primary) !important;
    border-radius: 4px !important;
    padding: 25px !important;
    min-height: 200px;
}

.reviews-section .grw-review-inner:hover {
    border-color: var(--primary) !important;
}

/* Photo de profil */
.reviews-section .grw-review .grw-img {
    border-radius: 50%;
    width: 50px !important;
    height: 50px !important;
}

/* Nom de l'auteur dans review */
.reviews-section .grw-review .wp-google-name {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.95rem;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
}

.reviews-section .grw-review .wp-google-name a {
    color: var(--text-light) !important;
}

/* Date de l'avis */
.reviews-section .wp-google-time {
    color: var(--text-gray) !important;
    font-size: 0.8rem;
}

/* Étoiles dans les reviews */
.reviews-section .grw-review .rpi-stars {
    font-size: 1rem;
    margin: 10px 0;
}

/* Texte de l'avis */
.reviews-section .wp-google-text {
    color: var(--text-light) !important;
    font-style: italic;
    font-size: 0.95rem;
    line-height: 1.6;
}

.reviews-section .wp-google-feedback {
    color: var(--text-light) !important;
}

/* Boutons de navigation du slider */
.reviews-section .rpi-lt,
.reviews-section .rpi-gt {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-light) !important;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    transition: 0.3s;
}

.reviews-section .rpi-lt:hover,
.reviews-section .rpi-gt:hover {
    background: var(--primary) !important;
    border-color: var(--primary) !important;
    color: var(--bg-dark) !important;
}

.reviews-section .rpi-lt::before,
.reviews-section .rpi-gt::before {
    border-color: currentColor !important;
}

/* Points de pagination */
.reviews-section .rpi-dots {
    margin-top: 20px;
}

.reviews-section .rpi-dot {
    background: var(--border-color) !important;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: none !important;
    margin: 0 5px;
    transition: 0.3s;
}

.reviews-section .rpi-dot.active,
.reviews-section .rpi-dot:hover {
    background: var(--primary) !important;
}

/* Icône Google dans les cards */
.reviews-section .grw-review svg {
    position: absolute;
    bottom: 15px;
    right: 15px;
    opacity: 0.5;
}

/* Responsive */
@media (max-width: 768px) {
    .reviews-section .grw-header-inner {
        padding: 0 20px;
    }
    
    .reviews-section .grw-review-inner {
        padding: 20px !important;
    }
}
.wp-google-powered{
    display:none;
}
/* ==========================================================================
   ARCHIVES / GRILLE ARTICLES
   ========================================================================== */

.archive article .post-categories{
    margin-bottom: 15px;
}

.archive-header {
    padding: var(--space-8) 5%;
    text-align: center;
    background: var(--bg-card);
    border-bottom: 1px solid var(--border-color);
}

/* Archive hero - style similaire à page-hero et single-hero */
.archive-hero {
    height: 400px;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: flex-end;
    padding-bottom: 60px;
    position: relative;
    margin-bottom: 0;
}

.archive-hero .hero-content-inner {
    width: 100%;
}

.archive-content {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: var(--space-6) 5%;
}

.archive-header h1 {
    margin-bottom: var(--space-2);
}

.archive-description {
    color: var(--text-gray);
    max-width: 600px;
    margin: 0 auto;
}

.posts-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: var(--space-4);
    padding: var(--space-6) 5%;
    max-width: var(--container-max);
    margin: 0 auto;
}

.post-card {
    background: var(--bg-card);
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid var(--border-color);
    transition: var(--transition);
}

.post-card:hover {
    transform: translateY(-5px);
    border-color: var(--primary);
}

.post-thumbnail {
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

.post-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.post-card:hover .post-thumbnail img {
    transform: scale(1.05);
}

.post-card-content {
    padding: var(--space-3);
}

.post-card-content h3 {
    font-size: var(--text-xl);
    margin-bottom: var(--space-1);
}

.post-card-content h3 a {
    color: var(--text-light);
}

.post-card-content h3 a:hover {
    color: var(--primary);
}

.post-meta {
    font-size: var(--text-sm);
    color: var(--text-gray);
    margin-bottom: var(--space-2);
}

.post-excerpt {
    color: var(--text-gray);
    font-size: var(--text-sm);
}

/* Pagination */
.pagination,
.posts-navigation {
    padding: var(--space-6) 5%;
    text-align: center;
}

.pagination .nav-links,
.posts-navigation .nav-links {
    display: flex;
    justify-content: center;
    gap: var(--space-2);
}

.pagination a,
.pagination span,
.posts-navigation a {
    display: inline-block;
    padding: var(--space-1) var(--space-2);
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 4px;
    color: var(--text-light);
    transition: var(--transition);
}

.pagination a:hover,
.posts-navigation a:hover {
    background: var(--primary);
    color: var(--bg-dark);
    border-color: var(--primary);
}

.pagination .current {
    background: var(--primary);
    color: var(--bg-dark);
    border-color: var(--primary);
}

/* ==========================================================================
   PAGE HERO - STYLE RACING
   ========================================================================== */

.page-hero {
    height: 450px;
    background-color: var(--bg-darker);
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: flex-end;
    padding-bottom: 60px;
    position: relative;
    margin-bottom: 0;
}

.page-hero .container {
    width: 100%;
}

.page-hero .hero-content-inner {
    width: 100%;
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 5%;
}

/* Breadcrumbs sur l'image hero */
.hero-breadcrumbs {
    margin-bottom: 15px;
}

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

.hero-breadcrumbs li {
    display: flex;
    align-items: center;
    color: var(--text-gray);
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.hero-breadcrumbs li:not(:first-child)::before {
    content: "/";
    margin: 0 8px;
    color: var(--text-gray);
}

.hero-breadcrumbs a {
    color: #fff;
    text-decoration: none;
    transition: color 0.3s ease;
}

.hero-breadcrumbs a:hover {
    color: var(--primary);
}

/* Titre Racing H1 */
.page-title-racing {
    font-family: var(--font-heading);
    font-size: clamp(2.5rem, 5vw, 4.5rem);
    color: #fff;
    text-transform: uppercase;
    font-weight: 700;
    line-height: 1.2;
    transform: skewX(-8deg);
    display: inline-block;
    margin: 0;
}

.page-title-racing::after {
    content: "";
    display: block;
    width: 80px;
    height: 6px;
    background: var(--primary);
    margin-top: 15px;
    transform: skewX(8deg);
}

/* Accroche sous le titre des pages */
.page-hero-accroche {
    font-size: 1.2rem;
    color: var(--text-gray);
    max-width: 700px;
    margin-top: 25px;
    line-height: 1.6;
}

/* Conteneur de contenu page */
.page-section {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 60px 5% 80px;
}

/* Full Width template - largeur étendue */
.page-section.fullwidth-content {
    max-width: 1400px;
}

.page-section.fullwidth-content .entry-content {
    max-width: 100%;
}

/* Permettre les blocs alignfull et alignwide */
.fullwidth-content .alignfull {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.fullwidth-content .alignwide {
    width: calc(100% + 10%);
    max-width: calc(100% + 10%);
    margin-left: -5%;
    margin-right: -5%;
}

.page-section .entry-content {
    max-width: 100%;
    padding: 0;
}

/* Responsive page hero */
@media (max-width: 768px) {
    .page-hero {
        height: 80vh/*350px*/;
        padding-bottom: 40px;
    }
    .page-hero .container {
        background-color: #00000055;
    }
    .page-title-racing {
        font-size: 2.5rem;
    }
    .hero-breadcrumbs a{
        color:#fff;
        font-weight: bold;
    }
    .page-title-racing::after {
        width: 60px;
        height: 4px;
    }
    .hero-breadcrumbs li:last-child{
        display:none;
    }
    .page-hero-accroche {
        font-size: 1rem;
        margin-top: 20px;
        color: #fff;
    }
    
    .page-section {
        padding: 40px 5% 60px;
    }
}

/* ==========================================================================
   SINGLE ARTICLE
   ========================================================================== */

/* Hero single - hérite de page-hero avec ajouts */
.single-hero .hero-meta {
    margin-top: 20px;
    color: var(--text-gray);
    font-size: 0.9rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.single-hero .hero-meta time {
    color: var(--text-light);
}

.single-hero .hero-meta .meta-separator {
    color: var(--primary);
}

.single-hero .hero-meta a {
    color: var(--primary);
    text-decoration: none;
}

.single-hero .hero-meta a:hover {
    text-decoration: underline;
}

/* Layout single avec sidebar */
.single-layout {
    display: block;
}

.single-layout.has-sidebar {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 60px;
    align-items: start;
}

.single-content-main {
    min-width: 0;
}

.single-content-main .entry-content {
    max-width: 100%;
    margin: 0;
    padding: 0;
}

/* Sidebar single */
.single-sidebar {
    position: sticky;
    top: calc(var(--header-height) + 30px);
}

.single-sidebar .widget {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 25px;
    margin-bottom: 30px;
}

.single-sidebar .widget:last-child {
    margin-bottom: 0;
}

.single-sidebar .widget-title,.event-sidebar .widget-title{
    font-family: var(--font-heading);
    font-size: 1.1rem;
    color: var(--primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--primary);
}

.single-sidebar ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.single-sidebar li {
    padding: 8px 0;
    border-bottom: 1px solid var(--border-color);
}

.single-sidebar li:last-child {
    border-bottom: none;
}

.single-sidebar a {
    color: var(--text-light);
    text-decoration: none;
    transition: color 0.3s ease;
}

.single-sidebar a:hover {
    color: var(--primary);
}

/* Contenu article */
.entry-content h2 {
    margin-top: var(--space-6);
    color: var(--primary);
}

.entry-content h3 {
    margin-top: var(--space-4);
}

.entry-content blockquote {
    border-left: 4px solid var(--primary);
    padding: var(--space-3);
    margin: var(--space-4) 0;
    background: rgba(255, 196, 0, 0.05);
    font-style: italic;
    color: var(--text-light);
    border-radius: 4px;
}

/* Footer article (tags) */
.entry-footer {
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid var(--border-color);
}

.entry-footer .tags {
    color: var(--text-gray);
}

.entry-footer .tags a {
    color: var(--primary);
    text-decoration: none;
}

.entry-footer .tags a:hover {
    text-decoration: underline;
}

/* Navigation articles */
.post-navigation {
    border-top: 1px solid var(--border-color);
    padding-top: var(--space-6);
    margin-top: var(--space-6);
}

.post-navigation .nav-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
}

.post-navigation a {
    color: var(--text-gray);
    font-size: var(--text-sm);
}

.post-navigation .nav-subtitle {
    display: block;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 0.75rem;
    margin-bottom: 5px;
}

.post-navigation .nav-title {
    display: block;
    color: var(--text-light);
    font-family: var(--font-heading);
    font-size: 1.1rem;
}

.post-navigation a:hover .nav-title {
    color: var(--primary);
}

/* Responsive single */
@media (max-width: 768px) {
    .single-hero .hero-meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }
    
    .single-hero .hero-meta .meta-separator {
        display: none;
    }
    
    .single-layout.has-sidebar {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .single-sidebar {
        position: static;
    }
    
    .post-navigation .nav-links {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   SIDEBAR / WIDGETS
   ========================================================================== */

.widget-area {
    position: sticky;
    top: calc(var(--header-height) + var(--space-4));
}

.widget {
    background: var(--bg-card);
    padding: var(--space-3);
    border-radius: 8px;
    margin-bottom: var(--space-3);
    border: 1px solid var(--border-color);
}

.widget-title {
    font-size: var(--text-lg);
    margin-bottom: var(--space-2);
    padding-bottom: var(--space-2);
    border-bottom: 2px solid var(--primary);
    color: var(--text-light);
}

.widget ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.widget ul li {
    padding: var(--space-1) 0;
    border-bottom: 1px solid var(--border-color);
}

.widget ul li:last-child {
    border-bottom: none;
}

.widget ul li a {
    color: var(--text-gray);
}

.widget ul li a:hover {
    color: var(--primary);
}

/* ==========================================================================
   FOOTER
   ========================================================================== */

.site-footer {
    padding: 30px 5%;
    border-top: 1px solid #222;
    background: var(--bg-darker);
}

.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /*max-width: var(--container-max);*/
    margin: 0 auto;
    flex-wrap: wrap;
    gap: 20px;
}

.footer-bottom p,
.footer-bottom a {
    color: var(--text-gray);
    text-decoration: none;
    font-size: 0.85rem;
    margin: 0;
}

.footer-bottom a:hover {
    color: var(--primary);
}

.footer-menu {
    display: flex;
    gap: 20px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-menu a {
    color: var(--text-gray);
    text-decoration: none;
    font-size: 0.85rem;
    transition: 0.3s;
}

.footer-menu a:hover {
    color: var(--primary);
}

/* ==========================================================================
   BOUTON FLOTTANT RÉSERVER
   ========================================================================== */

.fab-reserve,.fab-appli {
    position: fixed;
    bottom: 30px;
    left: 30px;
    background: var(--primary);
    color: var(--bg-dark);
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: none;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 20px rgba(0,0,0,0.5);
    z-index: 999;
    text-decoration: none;
    font-size: 1.5rem;
    transition: var(--transition);
}

.fab-appli{
    left:105px;
}

.fab-reserve:hover,.fab-appli:hover {
    transform: scale(1.1);
    background: var(--primary-hover);
}

.fab-reserve.visible,.fab-appli.visible {
    display: flex;
}
.fab-reserve.visible:hover,.fab-appli.visible:hover{
    color:var(--bg-dark);
}

/* ==========================================================================
   SCROLL TO TOP
   ========================================================================== */

.scroll-to-top {
    position: fixed;
    bottom: 100px;
    left: var(--space-4);
    width: 48px;
    height: 48px;
    background: var(--primary);
    color: var(--bg-dark);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transform: translateY(16px);
    transition: var(--transition);
    box-shadow: 0 4px 20px rgba(255, 196, 0, 0.4);
    z-index: 999;
}

.scroll-to-top.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.scroll-to-top:hover {
    background: var(--primary-hover);
    transform: translateY(-4px);
}

/* ==========================================================================
   BREADCRUMBS
   ========================================================================== */

.breadcrumbs {
    font-size: var(--text-sm);
    color: var(--text-gray);
    padding: var(--space-2) 0;
}

.breadcrumbs a {
    color: var(--text-gray);
}

.breadcrumbs a:hover {
    color: var(--primary);
}

.breadcrumbs-list {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    margin: 0;
}

.breadcrumbs-list li {
    display: flex;
    align-items: center;
}

.breadcrumbs-list li:not(:first-child)::before {
    content: "/";
    margin: 0 var(--space-1);
    color: var(--text-gray);
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

/* Mobile (max 900px) */
@media (max-width: 900px) {
    :root {
        --header-height: 70px;
    }
    
    /* Hero */
    .hero-content h1 {
        font-size: clamp(2.5rem, 10vw, 3.5rem);
    }
    
    /* Sections */
    .piste-container {
        grid-template-columns: 1fr;
    }
    
    .piste-stats {
        flex-direction: row;
        flex-wrap: wrap;
    }
    
    .stat-card {
        flex: 1;
        min-width: 200px;
    }
    
    .kids-grid {
        grid-template-columns: 1fr;
    }
    
    .contact-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    /* Footer */
    .footer-bottom {
        flex-direction: column;
        text-align: center;
    }
    
    .footer-menu {
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media (max-width: 768px) {
    .google-rating-header {
        margin-bottom: 40px;
    }
    
    .price-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .posts-grid {
        grid-template-columns: 1fr;
    }
    
    .post-navigation .nav-links {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .stat-card {
        min-width: 100%;
    }
    
    .badge {
        position: static;
        display: inline-block;
        margin-bottom: var(--space-2);
    }
}

/* ==========================================================================
   WORDPRESS ADMIN BAR - UTILISATEURS CONNECTÉS
   ========================================================================== */

body.logged-in {
    margin-top: 32px;
}

body.logged-in .top-bar {
    top: 32px;
}

body.logged-in .site-header {
    top: calc(32px + 45px);
}

body.logged-in .top-bar.hidden + .site-header,
body.logged-in .site-header.scrolled {
    top: 32px;
}

@media (max-width: 782px) {
    body.logged-in {
        margin-top: 46px;
    }
    
    body.logged-in .top-bar {
        top: 46px;
    }
    
    body.logged-in .site-header {
        top: calc(46px + 37px);
    }
    
    body.logged-in .top-bar.hidden + .site-header,
    body.logged-in .site-header.scrolled {
        top: 46px;
    }
}

/* ==========================================================================
   GUTENBERG - SUPPORT DES BLOCS
   ========================================================================== */

.wp-block-button__link {
    background: var(--primary);
    color: var(--bg-dark);
    padding: var(--space-2) var(--space-4);
    border-radius: 4px;
    display: inline-block;
    font-family: var(--font-heading);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: var(--transition);
}

.wp-block-button__link:hover {
    background: var(--primary-hover);
    color: var(--bg-dark);
    transform: translateY(-2px);
}

.wp-block-columns {
    display: grid;
    gap: var(--space-4);
}

.alignwide {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

.alignfull {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
}

/* ==========================================================================
   CONTACT FORM 7
   ========================================================================== */

.wpcf7 {
    margin-top: var(--space-4);
}

.wpcf7-form-control-wrap {
    display: block;
    margin-bottom: var(--space-3);
}

.wpcf7 input:not([type="submit"]),
.wpcf7 select,
.wpcf7 textarea {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    padding: 15px;
    color: var(--text-light);
    font-family: var(--font-body);
    border-radius: 4px;
    transition: 0.3s;
    width: 100%;
}

.wpcf7 input:not([type="submit"]):focus,
.wpcf7 select:focus,
.wpcf7 textarea:focus {
    border-color: var(--primary);
    outline: none;
}

.wpcf7 input[type="submit"] {
    background: var(--primary);
    color: var(--bg-dark);
    padding: 15px 30px;
    border: none;
    border-radius: 4px;
    font-family: var(--font-heading);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: var(--transition);
}

.wpcf7 input[type="submit"]:hover {
    background: var(--primary-hover);
    transform: translateY(-2px);
}

.wpcf7-response-output {
    margin-top: var(--space-3);
    padding: var(--space-2);
    border-radius: 4px;
}

.wpcf7-validation-errors {
    border-color: #c62f49;
    background: rgba(198, 47, 73, 0.1);
}

.wpcf7-mail-sent-ok {
    border-color: var(--primary);
    background: rgba(255, 196, 0, 0.1);
}

/* ==========================================================================
   UTILITAIRES
   ========================================================================== */

.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
    word-wrap: normal !important;
}

.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 999999;
    padding: var(--space-2);
    background: var(--primary);
    color: var(--bg-dark);
}

.skip-link:focus {
    left: 0;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.text-center { text-align: center; }
.text-primary { color: var(--primary); }
.bg-dark { background-color: var(--bg-dark); }
.bg-card { background-color: var(--bg-card); }

/* ==========================================================================
   RESPONSIVE GLOBAL - SECTIONS & CONTENUS
   ========================================================================== */

@media (max-width: 1100px) {
    /* Piste section */
    .piste-container {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .piste-stats {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }
    
    /* Grilles */
    .grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
    
    .kids-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    /* Tarifs */
    .pricing-table {
        max-width: 100%;
    }
    
    /* Section padding */
    section {
        padding: 60px 5%;
    }
    
    .piste-section,
    .offers,
    .kids-section,
    .tarifs {
        padding: 60px 5%;
    }
}

@media (max-width: 768px) {
    /* Typographie mobile */
    h1 {
        font-size: clamp(1.75rem, 6vw, 2.5rem);
    }
    
    h2, .section-title {
        font-size: clamp(1.5rem, 5vw, 2rem);
    }
    
    h3 {
        font-size: 1.25rem;
    }
    
    /* Hero home */
    .hero {
        height: auto;
        min-height: 100vh;
        padding: 100px 5% 60px;
    }
    
    .hero-content h1 {
        font-size: clamp(2rem, 8vw, 3rem);
    }
    
    .hero-content p {
        font-size: 1rem;
    }
    
    /* Grilles */
    .grid {
        grid-template-columns: 1fr;
    }
    
    /* Cards */
    .card {
        padding: 25px 20px;
    }
    
    /* Virtual tour */
    .virtual-tour-wrapper {
        height: 300px;
        width: 100% !important;
        max-width: 100% !important;
        aspect-ratio: auto;
    }
    
    .piste-container,.cta-container {
        width: 100%;
        max-width: 100%;
        overflow: hidden;
    }
    
    .piste-stats{
        flex-direction: column;
    }
    
    /* Stats */
    .stat-card {
        padding: 20px 15px;
        min-width: 100px;
    }
    
    .stat-value {
        font-size: 1.5rem;
    }
    
    /* Kids cards */
    .kids-card {
        padding: 30px 20px;
    }
    
    /* Tarifs */
    .price-row {
        flex-direction: column;
        text-align: center;
        gap: 15px;
        padding: 20px;
    }
    
    .price-value {
        font-size: 2rem;
    }
    
    /* Reviews */
    .reviews-container {
        padding: 40px 20px;
    }
    
    .reviews-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    /* Contact */
    .contact-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    /* FAB buttons */
    .fab-reserve,.fab-appli {
        bottom: 15px;
        left: 15px;
        width: 55px;
        height: 55px;
    }
    .fab-appli{
        left:80px;
    }
    
    .scroll-to-top {
        bottom: 80px;
        left: 15px;
        width: 40px;
        height: 40px;
    }
}

@media (max-width: 480px) {
    /* Padding global réduit */
    section {
        padding: 40px 4%;
    }
    
    .piste-section,
    .offers,
    .kids-section,
    .tarifs {
        padding: 40px 4%;
    }
    
    /* Hero */
    .hero {
        padding: 80px 4% 40px;
    }
    
    .hero-content h1 {
        font-size: 1.75rem;
    }
    
    .hero-content p {
        font-size: 0.9rem;
    }
    
    /* Boutons */
    .btn, .btn-primary {
        padding: 12px 25px;
        font-size: 0.9rem;
    }
    
    /* Cards */
    .card {
        padding: 20px 15px;
    }
    
    .card h3 {
        font-size: 1.1rem;
    }
    
    .card p {
        font-size: 0.9rem;
    }
    
    /* Stats inline sur mobile */
    .piste-stats {
        gap: 10px;
    }
    
    .stat-card {
        padding: 15px 10px;
        min-width: 80px;
    }
    
    .stat-value {
        font-size: 1.25rem;
    }
    
    .stat-label {
        font-size: 0.65rem;
    }
    
    /* Virtual tour */
    .virtual-tour-wrapper {
        height: 220px;
        width: 100% !important;
        max-width: 100% !important;
        aspect-ratio: auto;
        margin: 0;
    }
    
    .virtual-tour-wrapper iframe {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* Kids */
    .kids-card {
        padding: 25px 15px;
    }
    
    .kids-features li {
        font-size: 0.9rem;
    }
    
    /* Tarifs */
    .tarif-note {
        font-size: 0.8rem;
    }
    
    /* Reviews */
    .review-card {
        padding: 20px 15px;
    }
    
    .review-card p {
        font-size: 0.9rem;
    }
    
    /* Contact form */
    .contact h2 {
        font-size: 1.5rem;
    }
    
    .wpcf7 input:not([type="submit"]),
    .wpcf7 select,
    .wpcf7 textarea {
        padding: 12px;
        font-size: 0.9rem;
    }
    
    /* Page hero */
    .page-hero {
        height: 50vh/*280px*/;
        padding-bottom: 30px;
    }
    .page-hero .container {
        background-color: #00000055;
    }
    
    .page-title-racing {
        font-size: 2rem;
    }
    
    .page-title-racing::after {
        width: 50px;
        height: 4px;
        margin-top: 10px;
    }
    
    .hero-breadcrumbs li:last-child{
        display:none;
    }
    .page-hero-accroche {
        font-size: 0.9rem;
        margin-top: 15px;
        color: #fff;
    }
    
    /* Breadcrumbs */
    .hero-breadcrumbs li {
        font-size: 0.7rem;
        letter-spacing: 1px;
    }
    
    /* Single */
    .single-hero .hero-meta {
        font-size: 0.8rem;
    }
    
    /* Sidebar mobile */
    .single-sidebar .widget {
        padding: 20px 15px;
    }
}

/* ==========================================================================
   ANTI-OVERFLOW GLOBAL - Empêcher le scroll horizontal
   ========================================================================== */

img, video, iframe, embed, object {
    max-width: 100%;
    height: auto;
}
.iframe600{
    height: 600px;
}
section, article, aside, main, footer {
    max-width: 100%;
    overflow-x: hidden;
}

/* Navigation - pas d'overflow hidden pour permettre les sous-menus */
.main-navigation {
    overflow: visible;
}

.site-main {
    overflow-x: hidden;
}

/* Force les longs mots à ne pas déborder */
p, h1, h2, h3, h4, h5, h6, li, span, a {
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* ==========================================================================
   GEO BLOCKS SUITE - SURCHARGE CHARTE KARTING
   ========================================================================== */

/* --------------------------------------------------------------------------
   STATS GEO
   -------------------------------------------------------------------------- */
/* Base commune */
.wp-block-geo-blocks-stats-geo .geo-stats-box {
    border-radius: 8px;
}

.wp-block-geo-blocks-stats-geo .geo-stats-value {
    font-family: var(--font-heading);
}

.wp-block-geo-blocks-stats-geo .geo-stats-label {
    color: var(--text-gray) !important;
}

.wp-block-geo-blocks-stats-geo .geo-stats-source {
    color: var(--text-gray) !important;
}

/* Style Default - Jaune Karting (couleur principale) */
.wp-block-geo-blocks-stats-geo.geo-stats-style-default .geo-stats-box {
    background: linear-gradient(135deg, rgba(255, 196, 0, 0.15) 0%, rgba(255, 196, 0, 0.05) 100%) !important;
    border: 2px solid rgba(255, 196, 0, 0.4) !important;
}
.wp-block-geo-blocks-stats-geo.geo-stats-style-default .geo-stats-value {
    color: var(--primary) !important;
}
.wp-block-geo-blocks-stats-geo.geo-stats-style-default .geo-stats-unit {
    color: var(--primary-hover) !important;
}
.wp-block-geo-blocks-stats-geo.geo-stats-style-default .geo-stats-source a {
    color: var(--primary) !important;
}

/* Style Accent - Violet */
.wp-block-geo-blocks-stats-geo.geo-stats-style-accent .geo-stats-box {
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.15) 0%, rgba(139, 92, 246, 0.05) 100%) !important;
    border: 2px solid rgba(139, 92, 246, 0.4) !important;
}
.wp-block-geo-blocks-stats-geo.geo-stats-style-accent .geo-stats-value {
    color: #a78bfa !important;
}
.wp-block-geo-blocks-stats-geo.geo-stats-style-accent .geo-stats-unit {
    color: #8b5cf6 !important;
}
.wp-block-geo-blocks-stats-geo.geo-stats-style-accent .geo-stats-source a {
    color: #a78bfa !important;
}

/* Style Success - Vert */
.wp-block-geo-blocks-stats-geo.geo-stats-style-success .geo-stats-box {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.15) 0%, rgba(16, 185, 129, 0.05) 100%) !important;
    border: 2px solid rgba(16, 185, 129, 0.4) !important;
}
.wp-block-geo-blocks-stats-geo.geo-stats-style-success .geo-stats-value {
    color: #34d399 !important;
}
.wp-block-geo-blocks-stats-geo.geo-stats-style-success .geo-stats-unit {
    color: #10b981 !important;
}
.wp-block-geo-blocks-stats-geo.geo-stats-style-success .geo-stats-source a {
    color: #34d399 !important;
}

/* Style Warning - Rouge */
.wp-block-geo-blocks-stats-geo.geo-stats-style-warning .geo-stats-box {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.15) 0%, rgba(239, 68, 68, 0.05) 100%) !important;
    border: 2px solid rgba(239, 68, 68, 0.4) !important;
}
.wp-block-geo-blocks-stats-geo.geo-stats-style-warning .geo-stats-value {
    color: #f87171 !important;
}
.wp-block-geo-blocks-stats-geo.geo-stats-style-warning .geo-stats-unit {
    color: #ef4444 !important;
}
.wp-block-geo-blocks-stats-geo.geo-stats-style-warning .geo-stats-source a {
    color: #f87171 !important;
}

/* Style Minimal - Gris sobre */
.wp-block-geo-blocks-stats-geo.geo-stats-style-minimal .geo-stats-box {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-color) !important;
}
.wp-block-geo-blocks-stats-geo.geo-stats-style-minimal .geo-stats-value {
    color: var(--text-light) !important;
}
.wp-block-geo-blocks-stats-geo.geo-stats-style-minimal .geo-stats-unit {
    color: var(--text-gray) !important;
}
.wp-block-geo-blocks-stats-geo.geo-stats-style-minimal .geo-stats-source a {
    color: var(--text-gray) !important;
}

/* --------------------------------------------------------------------------
   FAQ GEO
   -------------------------------------------------------------------------- */
.faq-geo,
.wp-block-geo-blocks-faq-geo .faq-geo {
    margin: 1.5rem 0;
}
.wp-block-geo-blocks-faq-geo h2.faq-geo-title{
    margin-bottom: 3rem;
}


.faq-geo details,
.wp-block-geo-blocks-faq-geo .faq-geo details,
.wp-block-geo-blocks-faq-geo details,
body .faq-geo details {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 8px !important;
    padding: 1rem !important;
    margin-bottom: 0.75rem;
}

.faq-geo summary,
.wp-block-geo-blocks-faq-geo .faq-geo summary,
.wp-block-geo-blocks-faq-geo summary,
body .faq-geo summary {
    color: var(--text-light) !important;
    font-family: var(--font-heading);
    font-weight: 700;
    cursor: pointer;
    transition: color 0.3s ease;
}

.faq-geo summary span,
.wp-block-geo-blocks-faq-geo summary span,
body .faq-geo summary span {
    color: var(--text-light) !important;
}

.faq-geo summary:hover,
.faq-geo summary:hover span,
.wp-block-geo-blocks-faq-geo summary:hover,
.wp-block-geo-blocks-faq-geo summary:hover span,
body .faq-geo summary:hover,
body .faq-geo summary:hover span {
    color: var(--primary) !important;
}

.faq-geo details[open] summary,
.wp-block-geo-blocks-faq-geo details[open] summary,
body .faq-geo details[open] summary {
    color: var(--primary) !important;
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 0.75rem;
    margin-bottom: 0.5rem;
}

.faq-geo details[open] summary span,
.wp-block-geo-blocks-faq-geo details[open] summary span,
body .faq-geo details[open] summary span {
    color: var(--primary) !important;
}

.faq-geo p,
.faq-geo details div p,
.wp-block-geo-blocks-faq-geo .faq-geo p,
.wp-block-geo-blocks-faq-geo p,
.wp-block-geo-blocks-faq-geo details div p,
body .faq-geo p,
body .faq-geo details div p {
    color: var(--text-gray) !important;
    margin: 0.5rem 0 0 0;
    line-height: 1.6;
}

/* --------------------------------------------------------------------------
   TL;DR GEO
   -------------------------------------------------------------------------- */
.wp-block-geo-blocks-tldr-geo .geo-tldr-box {
    background: var(--bg-card) !important;
    border: none !important;
    border-left: 4px solid var(--primary) !important;
    border-radius: 0 8px 8px 0 !important;
}

.wp-block-geo-blocks-tldr-geo .geo-tldr-icon {
    color: var(--primary) !important;
}

.wp-block-geo-blocks-tldr-geo .geo-tldr-title {
    color: var(--primary) !important;
    font-family: var(--font-heading);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.wp-block-geo-blocks-tldr-geo .geo-tldr-content {
    color: var(--text-gray) !important;
}

/* --------------------------------------------------------------------------
   BLOCKQUOTE GEO
   -------------------------------------------------------------------------- */
.wp-block-geo-blocks-blockquote-geo blockquote {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-color) !important;
    border-left: 4px solid var(--primary) !important;
    border-radius: 0 8px 8px 0 !important;
    color: var(--text-light) !important;
}

.wp-block-geo-blocks-blockquote-geo blockquote::before {
    color: var(--primary) !important;
    opacity: 0.2;
}

.wp-block-geo-blocks-blockquote-geo blockquote p {
    color: var(--text-light) !important;
}

.wp-block-geo-blocks-blockquote-geo blockquote footer {
    color: var(--text-gray) !important;
}

.wp-block-geo-blocks-blockquote-geo blockquote cite,
.wp-block-geo-blocks-blockquote-geo blockquote span {
    color: var(--primary) !important;
}

/* --------------------------------------------------------------------------
   PROS/CONS GEO
   -------------------------------------------------------------------------- */
.wp-block-geo-blocks-proscons-geo .geo-proscons-box {
    border: 1px solid var(--border-color) !important;
    background: var(--bg-card) !important;
    border-radius: 8px !important;
    overflow: hidden;
}

.wp-block-geo-blocks-proscons-geo .geo-proscons-title {
    background: var(--bg-darker) !important;
    border-bottom-color: var(--border-color) !important;
    color: var(--text-light) !important;
    font-family: var(--font-heading);
}

.wp-block-geo-blocks-proscons-geo .geo-proscons-pros {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.15) 0%, rgba(16, 185, 129, 0.05) 100%) !important;
    border-left: 4px solid #10b981 !important;
}

.wp-block-geo-blocks-proscons-geo .geo-proscons-cons {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.15) 0%, rgba(239, 68, 68, 0.05) 100%) !important;
    border-left: 4px solid #ef4444 !important;
}

.wp-block-geo-blocks-proscons-geo .geo-proscons-pros .geo-proscons-label {
    color: #34d399 !important;
    font-family: var(--font-heading);
}

.wp-block-geo-blocks-proscons-geo .geo-proscons-cons .geo-proscons-label {
    color: #f87171 !important;
    font-family: var(--font-heading);
}

.wp-block-geo-blocks-proscons-geo .geo-proscons-pros .geo-proscons-list li {
    color: #a7f3d0 !important;
}

.wp-block-geo-blocks-proscons-geo .geo-proscons-cons .geo-proscons-list li {
    color: #fecaca !important;
}

.wp-block-geo-blocks-proscons-geo .geo-proscons-pros .geo-proscons-list li::before {
    color: #10b981 !important;
}

.wp-block-geo-blocks-proscons-geo .geo-proscons-cons .geo-proscons-list li::before {
    color: #ef4444 !important;
}
.wp-block-geo-blocks-proscons-geo.vert .geo-proscons-cons{
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.15) 0%, rgba(16, 185, 129, 0.05) 100%) !important;
    border-left: 4px solid #10b981 !important;
}
.wp-block-geo-blocks-proscons-geo.vert .geo-proscons-cons .geo-proscons-label {
    color: #34d399 !important;
}
.wp-block-geo-blocks-proscons-geo.vert .geo-proscons-icon{
    display: none;
}
.wp-block-geo-blocks-proscons-geo.vert .geo-proscons-header:before{
    content:"✅";
}
.wp-block-geo-blocks-proscons-geo.vert .geo-proscons-cons .geo-proscons-list li::before {
    content: '✓';
    color: #10b981 !important;
}
.wp-block-geo-blocks-proscons-geo.vert .geo-proscons-cons .geo-proscons-list li{
    color: #a7f3d0 !important;
}


.wp-block-geo-blocks-proscons-geo.jaune .geo-proscons-column{
    background: linear-gradient(135deg, rgba(255, 196, 0, 0.15) 0%, rgba(255, 196, 0, 0.05) 100%) !important;
    border-left: 4px solid #ffc400 !important;
}
.wp-block-geo-blocks-proscons-geo.jaune .geo-proscons-column .geo-proscons-label {
    color: #ffc400 !important;
}
.wp-block-geo-blocks-proscons-geo.jaune .geo-proscons-icon{
    display: none;
}
.wp-block-geo-blocks-proscons-geo.jaune .geo-proscons-column .geo-proscons-list li::before {
    content: '✓';
    color: #ffc400 !important;
}
.wp-block-geo-blocks-proscons-geo.jaune .geo-proscons-column .geo-proscons-list li{
    color: #ffc400 !important;
}

.wp-block-geo-blocks-proscons-geo.jauneG .geo-proscons-pros{
    background: linear-gradient(135deg, rgba(255, 196, 0, 0.15) 0%, rgba(255, 196, 0, 0.05) 100%) !important;
    border-left: 4px solid #ffc400 !important;
}
.wp-block-geo-blocks-proscons-geo.jauneG .geo-proscons-pros .geo-proscons-label {
    color: #ffc400 !important;
}
.wp-block-geo-blocks-proscons-geo.jauneG .geo-proscons-pros .geo-proscons-icon{
    filter: /*grayscale(50%)*/ sepia(90%);
    color: #ffc400 !important;
}
.wp-block-geo-blocks-proscons-geo.jauneG .geo-proscons-pros .geo-proscons-list li::before {
    content: '✓';
    color: #ffc400 !important;
}
.wp-block-geo-blocks-proscons-geo.jauneG .geo-proscons-pros .geo-proscons-list li{
    color: #ffc400 !important;
}
/* --------------------------------------------------------------------------
   HOWTO GEO
   -------------------------------------------------------------------------- */
.wp-block-geo-blocks-howto-geo .geo-howto-box {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 8px !important;
}

.wp-block-geo-blocks-howto-geo .geo-howto-header {
    border-bottom-color: var(--border-color) !important;
}

.wp-block-geo-blocks-howto-geo .geo-howto-title {
    color: var(--text-light) !important;
    font-family: var(--font-heading);
}

.wp-block-geo-blocks-howto-geo .geo-howto-description {
    color: var(--text-gray) !important;
}

.wp-block-geo-blocks-howto-geo .geo-howto-time,
.wp-block-geo-blocks-howto-geo .geo-howto-difficulty {
    color: var(--text-gray) !important;
}

.wp-block-geo-blocks-howto-geo .geo-howto-step {
    border-bottom-color: var(--border-color) !important;
}

.wp-block-geo-blocks-howto-geo .geo-howto-step-number {
    background: var(--primary) !important;
    color: var(--bg-dark) !important;
    font-family: var(--font-heading);
    font-weight: 700;
}

.wp-block-geo-blocks-howto-geo .geo-howto-step-title {
    color: var(--text-light) !important;
    font-family: var(--font-heading);
}

.wp-block-geo-blocks-howto-geo .geo-howto-step-text {
    color: var(--text-gray) !important;
}

/* --------------------------------------------------------------------------
   DEFINITION GEO
   -------------------------------------------------------------------------- */
.wp-block-geo-blocks-definition-geo .geo-definition-box {
    background: var(--bg-card) !important;
    border: none !important;
    border-left: 4px solid var(--primary) !important;
    border-radius: 0 8px 8px 0 !important;
}

.wp-block-geo-blocks-definition-geo .geo-definition-label {
    color: var(--primary) !important;
    font-family: var(--font-heading);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.wp-block-geo-blocks-definition-geo .geo-definition-icon {
    color: var(--primary) !important;
}

.wp-block-geo-blocks-definition-geo .geo-definition-term {
    color: var(--text-light) !important;
    font-family: var(--font-heading);
}

.wp-block-geo-blocks-definition-geo .geo-definition-text {
    color: var(--text-gray) !important;
}

.wp-block-geo-blocks-definition-geo .geo-definition-source {
    color: var(--text-gray) !important;
}

.wp-block-geo-blocks-definition-geo .geo-definition-source a {
    color: var(--primary) !important;
}

/* --------------------------------------------------------------------------
   AUTHOR GEO
   -------------------------------------------------------------------------- */
.wp-block-geo-blocks-author-geo .geo-author-box {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 8px !important;
}

.wp-block-geo-blocks-author-geo .geo-author-label {
    color: var(--text-gray) !important;
}

.wp-block-geo-blocks-author-geo .geo-author-name {
    color: var(--text-light) !important;
    font-family: var(--font-heading);
}

.wp-block-geo-blocks-author-geo .geo-author-job {
    color: var(--primary) !important;
}

.wp-block-geo-blocks-author-geo .geo-author-bio {
    color: var(--text-gray) !important;
}

.wp-block-geo-blocks-author-geo .geo-author-links a {
    color: var(--text-gray) !important;
    transition: color 0.3s ease;
}

.wp-block-geo-blocks-author-geo .geo-author-links a:hover {
    color: var(--primary) !important;
}

/* Style horizontal adapté */
.wp-block-geo-blocks-author-geo.geo-author-style-horizontal .geo-author-box {
    border-left: 4px solid var(--primary) !important;
    background: var(--bg-card) !important;
}

/* --------------------------------------------------------------------------
   MEDIA (AUDIO, VIDEO, IMAGE)
   -------------------------------------------------------------------------- */
.geo-audio figcaption,
.geo-video figcaption,
.geo-media.geo-image figcaption {
    color: var(--text-gray) !important;
}

.geo-media.geo-image img {
    border: 1px solid var(--border-color);
    border-radius: 8px;
}

/* ==========================================================================
   GEO IMAGE - STYLE PREMIUM
   ========================================================================== */

.geo-media.geo-image {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 12px;
    margin: var(--space-4) 0;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.geo-media.geo-image:hover {
    border-color: var(--primary);
    box-shadow: 0 8px 32px rgba(255, 196, 0, 0.1);
}

.geo-media.geo-image img {
    border: none;
    border-radius: 8px;
    width: 100%;
    height: auto;
    display: block;
}

.geo-media.geo-image figcaption {
    font-family: var(--font-heading);
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--text-light) !important;
    text-align: center;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-color);
}

.geo-media.geo-image .geo-credits {
    font-size: 0.7rem;
    color: var(--text-gray);
    text-align: center;
    margin-top: 8px;
    opacity: 0.7;
}

.geo-media.geo-image .geo-credits a {
    color: var(--primary);
}

/* ==========================================================================
   LISTES STYLISÉES - STYLE PREMIUM
   ========================================================================== */

.entry-content ul.wp-block-list,
.entry-content ul:not([class]),
#cmplz-document ul,
.editor-styles-wrapper .cmplz-unlinked-mode ul {
    list-style: none;
    padding: 0;
    margin: var(--space-4) 0;
}

.entry-content ul.wp-block-list li,
.entry-content ul:not([class]) li {
    position: relative;
    padding: 16px 20px 16px 24px;
    margin-bottom: 12px;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    border-left: 4px solid var(--primary);
    color: var(--text-light);
    font-size: 1rem;
    line-height: 1.6;
    transition: border-color 0.2s ease, transform 0.2s ease;
}

.entry-content ul.wp-block-list li:hover,
.entry-content ul:not([class]) li:hover {
    border-color: var(--primary);
    transform: translateX(4px);
}

/* Listes ordonnées */
.entry-content ol.wp-block-list,
.entry-content ol:not([class]) {
    list-style: none;
    padding: 0;
    margin: var(--space-4) 0;
    counter-reset: list-counter;
}

.entry-content ol.wp-block-list li,
.entry-content ol:not([class]) li {
    position: relative;
    padding: 16px 20px 16px 60px;
    margin-bottom: 12px;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    color: var(--text-light);
    font-size: 1rem;
    line-height: 1.6;
    counter-increment: list-counter;
    transition: border-color 0.2s ease;
}

.entry-content ol.wp-block-list li::before,
.entry-content ol:not([class]) li::before {
    content: counter(list-counter);
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    width: 32px;
    height: 32px;
    background: var(--primary);
    color: var(--bg-dark);
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: 0.9rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.entry-content ol.wp-block-list li:hover,
.entry-content ol:not([class]) li:hover {
    border-color: var(--primary);
}

/* Colonnes avec listes - ajustements */
.wp-block-columns .wp-block-list {
    margin: 0;
}

.wp-block-columns .wp-block-list li {
    padding: 14px 16px 14px 20px;
    margin-bottom: 10px;
}

/* Audio player - adaptation thème sombre */
.geo-audio audio {
    filter: invert(1) hue-rotate(180deg);
    border-radius: 8px;
}

/* ==========================================================================
   RACING CARDS - CARTES DE CONVERSION
   ========================================================================== */

/* Conteneur grille - ajouter classe "racing-cards" au bloc Colonnes */
.racing-cards {
    gap: 24px !important;
}

.racing-cards > .wp-block-column {
    padding: 0 !important;
}

/* Carte individuelle - ajouter classe "racing-card" au bloc Groupe dans chaque colonne */
.racing-card {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    overflow: hidden;
    padding: 0 !important;
    transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.racing-card:hover {
    transform: translateY(-8px);
    border-color: var(--primary);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), 0 0 0 1px var(--primary);
}

/* Image de la carte */
.racing-card .wp-block-image {
    margin: 0 !important;
    position: relative;
    overflow: hidden;
}

.racing-card .wp-block-image img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
    border-radius: 0 !important;
}

.racing-card:hover .wp-block-image img {
    transform: scale(1.05);
}

/* Badge - ajouter classe "racing-badge" au bloc Paragraphe */
.racing-badge {
    position: absolute !important;
    top: 12px;
    right: 12px;
    background: var(--primary) !important;
    color: var(--bg-dark) !important;
    font-family: var(--font-heading);
    font-size: 0.7rem !important;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 6px 12px !important;
    border-radius: 20px;
    margin: 0 !important;
    z-index: 2;
}

/* Contenu de la carte */
.racing-card-content {
    padding: 24px !important;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

/* Titre H3 */
.racing-card h3,
.racing-card .wp-block-heading {
    font-family: var(--font-heading);
    font-size: 1.25rem !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--primary) !important;
    margin-bottom: 12px !important;
    line-height: 1.3;
}

/* Texte descriptif */
.racing-card p:not(.racing-badge) {
    color: var(--text-gray) !important;
    font-size: 0.95rem !important;
    line-height: 1.7;
    margin-bottom: 20px !important;
    flex-grow: 1;
}

/* CTA / Bouton */
.racing-card .wp-block-button {
    margin-top: auto !important;
}

.racing-card .wp-block-button__link {
    width: 100%;
    text-align: center;
    background: transparent !important;
    border: 2px solid var(--primary) !important;
    color: var(--primary) !important;
    padding: 12px 20px !important;
    font-size: 0.85rem !important;
    transition: all 0.3s ease;
}

.racing-card .wp-block-button__link:hover {
    background: var(--primary) !important;
    color: var(--bg-dark) !important;
}

/* Variante avec bordure colorée en haut */
.racing-card-accent {
    border-top: 4px solid var(--primary);
}

/* Responsive */
@media (max-width: 1100px) {
    .racing-cards {
        flex-direction: column !important;
    }
    
    .racing-cards > .wp-block-column {
        flex-basis: 100% !important;
        max-width: 500px;
        margin: 0 auto 24px;
    }
    
    .racing-card .wp-block-image img {
        height: 180px;
    }
}

@media (max-width: 480px) {
    .racing-card-content {
        padding: 20px !important;
    }
    
    .racing-card .wp-block-image img {
        height: 160px;
    }
}

/* ==========================================================================
   TEMPLATE BOUTIQUE
   ========================================================================== */

/* Barre de réassurance */
.boutique-reassurance {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: var(--border-color);
    border-top: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
}

.boutique-reassurance .reassurance-item {
    background: var(--bg-card);
    padding: 16px 5%;
    display: flex;
    align-items: center;
    gap: 14px;
}

.boutique-reassurance .reassurance-icon {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255, 196, 0, 0.12);
    border: 1px solid rgba(255, 196, 0, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.boutique-reassurance .reassurance-icon svg {
    width: 16px;
    height: 16px;
    stroke: var(--primary);
}

.boutique-reassurance .reassurance-text {
    display: flex;
    flex-direction: column;
}

.boutique-reassurance .reassurance-label {
    font-family: var(--font-heading);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--text-light);
}

.boutique-reassurance .reassurance-sub {
    font-size: 11px;
    color: var(--text-gray);
    margin-top: 2px;
}

/* Layout boutique */
.boutique-content {
    padding-top: 48px;
    padding-bottom: 80px;
}

.boutique-layout {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 32px;
    align-items: start;
}

/* Zone iframe */
.iframe-container {
    /*background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;*/
    overflow: hidden;
    border: 4px solid #FFC400;
    border-radius: 15px;
}

.iframe-header {
/*    background: #0a0a0a;
    padding: 14px 20px;
    border-bottom: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;*/
    background: #FFC400;
    color: #111;
    padding: 10px 20px;
    font-family: 'Oswald', sans-serif;
    font-weight: bold;
    text-transform: uppercase;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.iframe-header-left {
    display: flex;
    align-items: center;
    gap: 8px;
}

.iframe-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    border: 1px solid #11111155;
}

.iframe-dot-red { background: #ff5f57; }
.iframe-dot-yellow { background: #febc2e; }
.iframe-dot-green { background: #28c840; }

.iframe-label {
    font-family: var(--font-heading);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 2px;
    /*color: var(--text-gray);*/
    color:#111;
    margin-left: 8px;
}

.iframe-badge {
    font-family: var(--font-heading);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 1px;
    /*color: var(--primary);*/
    color:#111;
    /*background: rgba(255, 196, 0, 0.1);*/
    background-color: rgba(0,0,0,.18);
    border: 1px solid rgba(255, 196, 0, 0.3);
    padding: 3px 10px;
    border-radius: 12px;
}

.iframe-body {
    background: #f5f5f5;
    min-height: 500px;
    position: relative;
}

.iframe-body iframe {
    width: 100%;
    height: 3060px;
    border: none;
    display: block;
}

.iframe-note {
    padding: 12px 20px;
    /*border-top: 1px solid var(--border-color);*/
    /*background: #0a0a0a;*/
    display: flex;
    align-items: center;
    gap: 8px;
    background: #FFC400;
}

.iframe-note svg {
    width: 14px;
    height: 14px;
    /*stroke: var(--text-gray);*/
    stroke:#111;
    flex-shrink: 0;
}

.iframe-note span {
    font-size: 11px;
    /*color: var(--text-gray);*/
    color: #111;    
}
.iframe-note span p{
    margin-bottom: 0;
    margin-top: 2px;
    color: #111;
}

.iframe-note strong {
    /*color: var(--text-light);*/
    color:#111;
}

.iframe-note span p a{
    color:#111;
}

/* Contenu éditeur boutique */
/* Section contenu additionnel (FAQ, etc.) */
.boutique-additional-content {
    margin-top: 48px;
    padding-top: 40px;
    border-top: 1px solid var(--border-color);
}

.boutique-additional-content .entry-content {
    max-width: 100%;
}

/* Sidebar boutique */
.boutique-sidebar {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sidebar-card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    overflow: hidden;
}

.sidebar-card-highlight {
    border-color: var(--primary);
    display: none;
}

.sidebar-card-header {
    padding: 16px 20px;
    border-bottom: 1px solid var(--border-color);
}

.sidebar-card-highlight .sidebar-card-header {
    background: rgba(255, 196, 0, 0.1);
}

.sidebar-card-header h3 {
    font-family: var(--font-heading);
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--primary);
    margin: 0;
}

.sidebar-card-help .sidebar-card-header h3 {
    color: var(--text-gray);
}

.sidebar-card-body {
    padding: 20px;
}

.sidebar-card-body p {
    font-size: 12px;
    color: var(--text-gray);
    line-height: 1.7;
    margin-bottom: 16px;
}

/* Options bons cadeaux */
.gift-options {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 16px;
}

.gift-option {
    background: #0a0a0a;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    padding: 10px 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    transition: border-color 0.2s ease;
}

.gift-option:hover {
    border-color: var(--primary);
}

.gift-option-best {
    border-color: rgba(255, 196, 0, 0.4);
}

.gift-option-name {
    font-family: var(--font-heading);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--text-light);
    display: block;
}

.gift-option-desc {
    font-size: 10px;
    color: var(--text-gray);
    display: block;
    margin-top: 2px;
}

.gift-option-best-label {
    color: var(--primary);
}

.gift-option-price {
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 700;
    color: var(--primary);
}

.btn-gift {
    width: 100%;
    text-align: center;
    display: block;
}

/* Bloc aide */
.help-contact {
    display: flex;
    align-items: center;
    gap: 12px;
}

.help-contact-icon {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255, 196, 0, 0.1);
    border: 1px solid rgba(255, 196, 0, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.help-contact-icon svg {
    width: 16px;
    height: 16px;
    stroke: var(--primary);
}

.help-contact-info {
    display: flex;
    flex-direction: column;
}

.help-phone {
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 700;
    color: var(--primary);
    text-decoration: none;
}

.help-phone:hover {
    text-decoration: underline;
}

.help-hours {
    font-size: 10px;
    color: var(--text-gray);
}

/* Responsive boutique */
@media (max-width: 1100px) {
    .boutique-layout {
        grid-template-columns: 1fr;
    }
    
    .boutique-sidebar {
        flex-direction: row;
        flex-wrap: wrap;
    }
    
    .sidebar-card {
        flex: 1;
        min-width: 280px;
    }
}

@media (max-width: 768px) {
    .boutique-reassurance {
        grid-template-columns: 1fr;
    }
    
    .boutique-reassurance .reassurance-item {
        padding: 14px 5%;
        border-bottom: 1px solid var(--border-color);
    }
    
    .boutique-reassurance .reassurance-item:last-child {
        border-bottom: none;
    }
    
    .iframe-body iframe {
        height: 3060px;
    }
    
    .boutique-sidebar {
        flex-direction: column;
    }
    
    .sidebar-card {
        min-width: auto;
    }
}

@media (max-width: 480px) {
    .iframe-header {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .iframe-body iframe {
        height: 3060px;
    }
}



.boutique-reassurance{
    /*display: none;*/
}
#wp-live-chat-by-3CX{
    left:20px !important;
}
call-us{
    left:0 !important;
}
.none{
    display: none;
}

/* ==========================================================================
   EVENTS MANAGER - INTÉGRATION THÈME KARTING
   Plugin: Events Manager (Pixelbones templates)
   ========================================================================== */

/* --- Page Section ajustée pour Events --- */
.page-section.events-page {
    max-width: 100%;
    padding: 0;
}

/* --- Wrapper principal EM --- */
#em-wrapper {
    max-width: var(--container-max);
    margin: 0 auto;
    /*padding: 0 5%;*/
}

/* ==========================================================================
   BARRE DE RECHERCHE ÉVÉNEMENTS
   ========================================================================== */

.em-search {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: var(--space-4);
    margin-bottom: var(--space-6);
}

.em-search-main {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    align-items: center;
}

.em-search-main-bar {
    flex: 1;
    min-width: 250px;
}

.em-search-main-bar input[type="text"],
.em-search-main-bar input[type="search"],
.em-search input[type="text"],
.em-search select {
    width: 100%;
    background: var(--bg-darker);
    border: 1px solid var(--border-color);
    color: var(--text-light);
    padding: 12px 16px;
    border-radius: 4px;
    font-family: var(--font-body);
    font-size: var(--text-base);
    transition: var(--transition-fast);
}

.em-search-main-bar input:focus,
.em-search input:focus,
.em-search select:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 2px rgba(255, 196, 0, 0.2);
}

.em-search-main-bar input::placeholder {
    color: var(--text-gray);
}

.em-search-main .em-search-submit,
.em-search button[type="submit"] {
    background: var(--primary);
    color: var(--bg-dark);
    border: none;
    padding: 12px 24px;
    border-radius: 4px;
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: var(--text-base);
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: var(--transition-fast);
}

.em-search-main .em-search-submit:hover,
.em-search button[type="submit"]:hover {
    background: var(--primary-hover);
}

/* Filtres avancés */
.em-search-advanced {
    margin-top: var(--space-3);
    padding-top: var(--space-3);
    border-top: 1px solid var(--border-color);
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.em-search-advanced select {
    background: var(--bg-darker);
    border: 1px solid var(--border-color);
    color: var(--text-light);
    padding: 10px 14px;
    border-radius: 4px;
    min-width: 150px;
}

/* ==========================================================================
   LISTE DES ÉVÉNEMENTS (Archive)
   ========================================================================== */

.em-events-list,
#em-events-list-1 {
    display: grid;
    gap: var(--space-4);
}

/* Card événement */
.em-event.em-item {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    overflow: hidden;
    transition: var(--transition);
    display: grid;
    grid-template-columns: 280px 1fr;
}

.em-event.em-item:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    border-color: var(--primary);
}

/* Image de l'événement */
.em-item-image {
    position: relative;
    overflow: hidden;
    height: 100%;
    min-height: 200px;
}

.em-item-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.em-event.em-item:hover .em-item-image img {
    transform: scale(1.05);
}

/* Badge catégorie sur l'image */
.em-item-image .em-item-cats,
.em-item-cats {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 2;
}

.em-item-cats a,
.em-item-cats span,
.em-event-categories a {
    display: inline-block;
    background: var(--default-border, var(--primary));
    color: var(--bg-dark);
    padding: 4px 12px;
    border-radius: 4px;
    font-family: var(--font-heading);
    font-size: var(--text-xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-decoration: none;
    transition: var(--transition-fast);
}

.em-item-cats a:hover,
.em-event-categories a:hover {
    background: var(--primary-hover);
}

/* Contenu de la card */
.em-item-info {
    padding: var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

/* Titre de l'événement */
.em-item-info h3,
.em-item-title,
.em-event .event-title {
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
    line-height: 1.3;
}

.em-item-info h3 a,
.em-item-title a,
.em-event .event-title a {
    color: inherit;
    text-decoration: none;
    transition: var(--transition-fast);
}

.em-item-info h3 a:hover,
.em-item-title a:hover,
.em-event .event-title a:hover {
    color: var(--primary);
}

/* Méta-informations (date, heure, lieu) */
.em-item-meta,
.em-event-meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-4);
    color: var(--text-gray);
    font-size: var(--text-sm);
}

.em-item-meta > span,
.em-item-meta-line,
.em-event-when,
.em-event-where {
    display: flex;
    align-items: center;
    gap: 6px;
}

/* Icônes pour les métas */
.em-item-meta .em-icon,
.em-event-meta .em-icon {
    width: 16px;
    height: 16px;
    opacity: 0.7;
}

.em-item-meta .em-icon-clock::before,
.em-event-when::before {
    content: "🕐";
    margin-right: 4px;
}

.em-item-meta .em-icon-location::before,
.em-event-where::before {
    content: "📍";
    margin-right: 4px;
}

/* Date mise en valeur */
.em-item-meta .em-event-date,
.em-event-dates {
    color: var(--primary);
    font-weight: 600;
}

/* Description */
.em-item-desc,
.em-event-excerpt,
.em-event-description p {
    color: var(--text-gray);
    font-size: var(--text-sm);
    line-height: 1.6;
    margin: 0;
    flex-grow: 1;
}

/* Bouton "En savoir plus" */
.em-item-actions,
.em-event-actions {
    margin-top: auto;
    padding-top: var(--space-2);
}

.em-item-actions a,
.em-event-actions a,
.em-item-read-more {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: transparent;
    color: var(--primary);
    padding: 10px 0;
    font-family: var(--font-heading);
    font-size: var(--text-sm);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-decoration: none;
    transition: var(--transition-fast);
}

.em-item-actions a:hover,
.em-event-actions a:hover,
.em-item-read-more:hover {
    color: var(--text-light);
}

.em-item-actions a::after,
.em-item-read-more::after {
    content: "→";
    transition: transform 0.2s ease;
}

.em-item-actions a:hover::after,
.em-item-read-more:hover::after {
    transform: translateX(4px);
}

/* ==========================================================================
   ÉTAT VIDE - AUCUN ÉVÉNEMENT
   ========================================================================== */

.em-events-list:empty,
#em-events-list-1:empty,
.em-view-container:empty {
    position: relative;
}

.em-no-events,
.em-events-list:empty::before,
#em-events-list-1:empty::before {
    display: block;
    text-align: center;
    padding: var(--space-8) var(--space-4);
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
}

.em-no-events {
    color: var(--text-gray);
    font-size: var(--text-lg);
}

/* Fallback visuel quand pas d'événements */
.events-empty-fallback {
    background: linear-gradient(135deg, var(--bg-card) 0%, var(--bg-darker) 100%);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: var(--space-8) var(--space-4);
    text-align: center;
}

.events-empty-fallback img,
.events-empty-fallback video {
    max-width: 400px;
    width: 100%;
    height: auto;
    border-radius: 8px;
    margin-bottom: var(--space-4);
    opacity: 0.8;
}

.events-empty-fallback h3 {
    font-family: var(--font-heading);
    font-size: var(--text-2xl);
    color: var(--text-light);
    margin-bottom: var(--space-2);
}

.events-empty-fallback p {
    color: var(--text-gray);
    margin-bottom: var(--space-4);
}

/* ==========================================================================
   PAGE SINGLE ÉVÉNEMENT
   ========================================================================== */

/* Container single */
.em-item-single.em-event-single {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 5%;
}

/* Header de l'événement single */
.em-item-single .em-item-header,
section.em-item-header {
    display: grid;
    grid-template-columns: 1fr 350px;
    gap: var(--space-6);
    margin-bottom: var(--space-6);
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    overflow: hidden;
}

/* Image principale */
.em-item-header .em-item-image {
    position: relative;
    min-height: 400px;
}

.em-item-header .em-item-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Sidebar méta du single */
.em-item-header .em-item-meta-column,
.em-item-header .em-item-info {
    padding: var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

/* Bloc méta individual */
.em-event-when-where,
.em-item-meta-block {
    background: var(--bg-darker);
    border: 1px solid var(--border-color);
    border-radius: 6px;
    padding: var(--space-3);
}

.em-item-meta-block h4,
.em-event-when-where h4 {
    font-family: var(--font-heading);
    font-size: var(--text-sm);
    color: var(--primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: var(--space-1);
}

.em-item-meta-block p,
.em-event-when-where p {
    color: var(--text-light);
    font-size: var(--text-base);
    margin: 0;
}

/* Section Carte/Lieu */
section.em-event-location {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: var(--space-4);
    margin-bottom: var(--space-6);
}

section.em-event-location h3 {
    font-family: var(--font-heading);
    font-size: var(--text-lg);
    color: var(--text-light);
    text-transform: uppercase;
    margin-bottom: var(--space-3);
}

section.em-event-location .em-location-map {
    border-radius: 6px;
    overflow: hidden;
}

section.em-event-location iframe {
    width: 100%;
    height: 300px;
    border: none;
    filter: grayscale(80%) invert(95%);
}

/* Section Contenu principal */
section.em-event-content {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: var(--space-6);
    margin-bottom: var(--space-6);
}

section.em-event-content h2,
section.em-event-content h3 {
    font-family: var(--font-heading);
    color: var(--text-light);
    text-transform: uppercase;
    margin-top: var(--space-4);
    margin-bottom: var(--space-2);
}

section.em-event-content h2:first-child,
section.em-event-content h3:first-child {
    margin-top: 0;
}

section.em-event-content p {
    color: var(--text-gray);
    line-height: 1.7;
    margin-bottom: var(--space-3);
}

section.em-event-content ul,
section.em-event-content ol {
    color: var(--text-gray);
    padding-left: var(--space-4);
    margin-bottom: var(--space-3);
}

section.em-event-content li {
    margin-bottom: var(--space-1);
}

section.em-event-content a {
    color: var(--primary);
    text-decoration: underline;
}

section.em-event-content a:hover {
    color: var(--primary-hover);
}

/* Bouton réservation/inscription */
.em-booking-button,
.em-event-book-button,
a.em-item-read-more.button {
    display: inline-block;
    background: var(--primary);
    color: var(--bg-dark);
    padding: 14px 32px;
    border-radius: 4px;
    font-family: var(--font-heading);
    font-size: var(--text-base);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    transition: var(--transition-fast);
    border: none;
}

.em-booking-button:hover,
.em-event-book-button:hover,
a.em-item-read-more.button:hover {
    background: var(--primary-hover);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(255, 196, 0, 0.3);
}

/* ==========================================================================
   CATÉGORIES D'ÉVÉNEMENTS - COULEURS PERSONNALISÉES
   ========================================================================== */

/* Utilisation de la variable --default-border définie par EM */
.em-event.em-item[style*="--default-border"] .em-item-cats a {
    background: var(--default-border);
}

/* Fallback si pas de couleur custom */
.em-item-cats a:not([style]) {
    background: var(--primary);
}

/* ==========================================================================
   RESPONSIVE EVENTS MANAGER
   ========================================================================== */

@media (max-width: 1100px) {
    .em-event.em-item {
        grid-template-columns: 220px 1fr;
    }
    
    .em-item-single .em-item-header,
    section.em-item-header {
        grid-template-columns: 1fr;
    }
    
    .em-item-header .em-item-image {
        min-height: 300px;
    }
}

@media (max-width: 768px) {
    .em-event.em-item {
        grid-template-columns: 1fr;
    }
    
    .em-item-image {
        height: 200px;
        min-height: 200px;
    }
    
    .em-search-main {
        flex-direction: column;
    }
    
    .em-search-main-bar {
        width: 100%;
        min-width: auto;
    }
    
    .em-search-main .em-search-submit,
    .em-search button[type="submit"] {
        width: 100%;
    }
    
    .em-search-advanced {
        flex-direction: column;
    }
    
    .em-search-advanced select {
        width: 100%;
    }
    
    .em-item-header .em-item-image {
        min-height: 250px;
    }
    
    section.em-event-content {
        padding: var(--space-4);
    }
}

@media (max-width: 480px) {
    .em-item-info {
        padding: var(--space-3);
    }
    
    .em-item-meta {
        flex-direction: column;
        gap: var(--space-1);
    }
    
    .em-events-list,
    #em-events-list-1 {
        gap: var(--space-3);
    }
}

/* ==========================================================================
   PAGINATION EVENTS MANAGER
   ========================================================================== */

.em-pagination,
.em-events-pagination {
    display: flex;
    justify-content: center;
    gap: var(--space-1);
    margin-top: var(--space-6);
    padding-top: var(--space-4);
    border-top: 1px solid var(--border-color);
}

.em-pagination a,
.em-pagination span,
.em-events-pagination a,
.em-events-pagination span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 4px;
    color: var(--text-light);
    font-family: var(--font-heading);
    font-size: var(--text-sm);
    text-decoration: none;
    transition: var(--transition-fast);
}

.em-pagination a:hover,
.em-events-pagination a:hover {
    border-color: var(--primary);
    color: var(--primary);
}

.em-pagination .current,
.em-pagination span.current,
.em-events-pagination .current {
    background: var(--primary);
    border-color: var(--primary);
    color: var(--bg-dark);
    font-weight: 700;
}

/* ==========================================================================
   FORMULAIRES EVENTS MANAGER (Réservation/Inscription)
   ========================================================================== */

.em-booking-form,
.em-event-booking {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: var(--space-4);
    margin-top: var(--space-4);
}

.em-booking-form label {
    display: block;
    color: var(--text-light);
    font-family: var(--font-heading);
    font-size: var(--text-sm);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: var(--space-1);
}

.em-booking-form input[type="text"],
.em-booking-form input[type="email"],
.em-booking-form input[type="tel"],
.em-booking-form input[type="number"],
.em-booking-form select,
.em-booking-form textarea {
    width: 100%;
    background: var(--bg-darker);
    border: 1px solid var(--border-color);
    color: var(--text-light);
    padding: 12px 16px;
    border-radius: 4px;
    font-family: var(--font-body);
    font-size: var(--text-base);
    margin-bottom: var(--space-3);
    transition: var(--transition-fast);
}

.em-booking-form input:focus,
.em-booking-form select:focus,
.em-booking-form textarea:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 2px rgba(255, 196, 0, 0.2);
}

.em-booking-form button[type="submit"] {
    background: var(--primary);
    color: var(--bg-dark);
    border: none;
    padding: 14px 32px;
    border-radius: 4px;
    font-family: var(--font-heading);
    font-size: var(--text-base);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: var(--transition-fast);
    width: 100%;
}

.em-booking-form button[type="submit"]:hover {
    background: var(--primary-hover);
}

/* ==========================================================================
   EVENTS MANAGER - TEMPLATES CUSTOM KARTING
   Styles spécifiques pour les templates events-list et single-event
   ========================================================================== */

/* Container fullwidth pour la page événements */
.container-fullwidth {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 5%;
}

/* ==========================================================================
   PAGE ARCHIVE ÉVÉNEMENTS
   ========================================================================== */

.events-archive {
    padding: 60px 0;
}

.events-header {
    text-align: center;
    margin-bottom: 60px;
}

.events-header .page-title-racing {
    margin-bottom: 15px;
}

.events-subtitle {
    color: var(--text-gray);
    font-size: var(--text-lg);
    max-width: 600px;
    margin: 0 auto;
}

/* Layout 2 colonnes */
.events-columns {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 40px;
}

/* Headers de section */
.events-section-header-bouton{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding-bottom: 15px;
}
.events-section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding-bottom: 15px;
    border-bottom: 2px solid var(--primary);
}

.events-section-header h2 {
    font-family: var(--font-heading);
    font-size: var(--text-2xl);
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0;
}

.events-count {
    background: var(--bg-card);
    color: var(--text-gray);
    padding: 6px 14px;
    border-radius: 20px;
    font-size: var(--text-sm);
    font-weight: 600;
}
.page-template-template-fullwidth .events-count{
    display: none;
}
/* ==========================================================================
   CARDS ÉVÉNEMENTS - FORMAT COMPLET
   ========================================================================== */

.events-list {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.event-card {
    display: grid;
    grid-template-columns: 300px 1fr;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    overflow: hidden;
    transition: var(--transition);
}

.event-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 40px rgba(255, 196, 0, 0.1);
    border-color: var(--primary);
}

/* Image de l'événement */
.event-image-link {
    display: block;
    position: relative;
}

.event-image {
    height: 100%;
    min-height: 220px;
    background-size: cover;
    background-position: center;
    position: relative;
    background-color: var(--bg-darker);
}

/* Badge date */
.event-date-badge {
    position: absolute;
    top: 15px;
    left: 15px;
    background: var(--primary);
    color: var(--bg-dark);
    padding: 12px 16px;
    border-radius: 6px;
    text-align: center;
    min-width: 70px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}

.event-date-badge .date-day {
    font-family: var(--font-heading);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
}

.event-date-badge .date-month {
    font-family: var(--font-heading);
    font-size: 0.875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.event-date-badge .date-year {
    font-family: var(--font-heading);
    font-size: 0.75rem;
    font-weight: 600;
    margin-top: 2px;
}

/* Badge catégorie */
.event-category-badge {
    position: absolute;
    bottom: 15px;
    left: 15px;
    background: var(--primary);
    color: var(--bg-dark);
    padding: 6px 14px;
    border-radius: 4px;
    font-family: var(--font-heading);
    font-size: var(--text-xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Contenu de la card */
.event-info {
    padding: 25px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.event-header h3 {
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 15px 0;
    line-height: 1.3;
}

.event-header h3 a {
    color: inherit;
    text-decoration: none;
    transition: var(--transition-fast);
}

.event-header h3 a:hover {
    color: var(--primary);
}

/* Métadonnées */
.event-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 15px;
}

.event-meta-item {
    color: var(--text-gray);
    font-size: var(--text-sm);
    display: flex;
    align-items: center;
    gap: 6px;
}

.event-description {
    color: var(--text-gray);
    font-size: var(--text-base);
    line-height: 1.6;
    margin: 0 0 20px 0;
}

.event-footer {
    margin-top: auto;
}

/* ==========================================================================
   CARDS COMPACTES - ÉVÉNEMENTS PASSÉS
   ========================================================================== */

.events-past {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 25px;
    height: fit-content;
}

.events-list-compact {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.event-card-compact {
    background: var(--bg-darker);
    border: 1px solid var(--border-color);
    border-radius: 6px;
    overflow: hidden;
    transition: var(--transition-fast);
}

.event-card-compact:hover {
    border-color: var(--primary);
}

.event-compact-link {
    display: grid;
    grid-template-columns: 80px 1fr;
    text-decoration: none;
    color: inherit;
}

.event-compact-thumb {
    height: 80px;
    background-size: cover;
    background-position: center;
    position: relative;
    background-color: var(--bg-card);
}

.event-date-badge-small {
    position: absolute;
    top: 5px;
    left: 5px;
    background: var(--primary);
    color: var(--bg-dark);
    padding: 4px 8px;
    border-radius: 4px;
    text-align: center;
    min-width: 45px;
}

.event-date-badge-small .date-day {
    font-family: var(--font-heading);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1;
    display: block;
}

.event-date-badge-small .date-month {
    font-family: var(--font-heading);
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
}

.event-compact-info {
    padding: 12px 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.event-compact-info h4 {
    font-family: var(--font-heading);
    font-size: var(--text-sm);
    color: var(--text-light);
    text-transform: uppercase;
    margin: 0 0 5px 0;
    line-height: 1.3;
}

.event-compact-meta {
    color: var(--text-gray);
    font-size: var(--text-xs);
    display: flex;
    align-items: center;
    gap: 4px;
}

/* ==========================================================================
   ÉTAT VIDE / FALLBACK
   ========================================================================== */

.events-empty-fallback {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 60px 40px;
    text-align: center;
}

.no-events-icon {
    font-size: 3rem;
    margin-bottom: 20px;
}

.events-empty-fallback h3 {
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    color: var(--text-light);
    text-transform: uppercase;
    margin-bottom: 10px;
}

.events-empty-fallback p {
    color: var(--text-gray);
    margin-bottom: 25px;
}

.events-fallback-media {
    max-width: 500px;
    margin: 0 auto;
    border-radius: 8px;
    overflow: hidden;
}

.events-fallback-media video,
.events-fallback-media img {
    width: 100%;
    height: auto;
    display: block;
}

/* ==========================================================================
   PAGE SINGLE ÉVÉNEMENT
   ========================================================================== */

.event-hero {
    min-height: 450px;
}

.event-category-hero {
    display: inline-block;
    background: var(--primary);
    color: var(--bg-dark);
    padding: 8px 20px;
    border-radius: 4px;
    font-family: var(--font-heading);
    font-size: var(--text-sm);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 20px;
}

.event-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-top: 20px;
    color: var(--text-light);
    font-size: var(--text-base);
}

.event-hero-meta .meta-separator {
    color: var(--primary);
}

/* Layout single */
.event-single {
    padding: 60px 0;
}

.event-single-layout {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 40px;
}

/* Grille de métadonnées */
.event-meta-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin-bottom: 40px;
}

.event-meta-card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 25px;
    text-align: center;
    transition: var(--transition-fast);
}

.event-meta-card:hover {
    border-color: var(--primary);
    transform: translateY(-2px);
}

.event-meta-card .meta-icon {
    font-size: 1.5rem;
    margin-bottom: 10px;
}

.event-meta-card .meta-label {
    font-family: var(--font-heading);
    font-size: var(--text-xs);
    color: var(--primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 5px;
}

.event-meta-card .meta-value {
    font-family: var(--font-heading);
    font-size: var(--text-lg);
    color: var(--text-light);
    font-weight: 600;
}

/* Sections de contenu */
.event-description-section,
.event-location-section {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 30px;
    margin-bottom: 30px;
}

.event-description-section h2,
.event-location-section h2 {
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 2px solid var(--primary);
}

/* Carte et adresse */
.event-address-card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    align-items: start;
}

.event-address-info {
    background: var(--bg-darker);
    border: 1px solid var(--border-color);
    border-radius: 6px;
    padding: 20px;
}

.event-address-info strong {
    color: var(--primary);
    font-family: var(--font-heading);
    text-transform: uppercase;
    font-size: var(--text-sm);
    letter-spacing: 0.5px;
}

.event-address-info p {
    color: var(--text-light);
    margin: 10px 0 0 0;
    line-height: 1.6;
}
.event-address-info a.btn-primary{
    margin-top:15px;
}
.event-map {
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid var(--border-color);
    min-height: 300px;
}

.event-map iframe,
.event-map #event-map-leaflet {
    width: 100%;
    height: 300px;
    border: none;
    display: block;
}

/* Styles pour Leaflet dans la carte événement */
.event-map .leaflet-container {
    background: var(--bg-darker);
    border-radius: 6px;
    z-index: 1;
}

/* Sidebar */
.event-sidebar {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.event-date-widget {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 30px;
    text-align: center;
}

.event-date-badge-large {
    background: var(--primary);
    color: var(--bg-dark);
    padding: 25px;
    border-radius: 8px;
    text-align: center;
}

.event-date-badge-large .date-day {
    font-family: var(--font-heading);
    font-size: 4rem;
    font-weight: 700;
    line-height: 1;
}

.event-date-badge-large .date-month {
    font-family: var(--font-heading);
    font-size: 1.5rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.event-date-badge-large .date-year {
    font-family: var(--font-heading);
    font-size: 1rem;
    font-weight: 600;
    margin-top: 5px;
}

/* Actions */
.event-actions {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px solid var(--border-color);
}

/* ==========================================================================
   RESPONSIVE EVENTS
   ========================================================================== */

@media (max-width: 1100px) {
    .events-columns {
        grid-template-columns: 1fr;
    }
    
    .events-past {
        order: -1;
    }
    
    .event-card {
        grid-template-columns: 250px 1fr;
    }
    
    .event-single-layout {
        grid-template-columns: 1fr;
    }
    
    .event-sidebar {
        order: -1;
    }
    
    .event-date-widget {
        display: none;
    }
    
    .event-address-card {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .events-archive {
        padding: 40px 0;
    }
    
    .event-card {
        grid-template-columns: 1fr;
    }
    
    .event-image {
        min-height: 180px;
    }
    
    .event-info {
        padding: 20px;
    }
    
    .event-meta-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .event-description-section,
    .event-location-section {
        padding: 20px;
    }
    
    .event-hero {
        min-height: 350px;
    }
}

@media (max-width: 480px) {
    .events-section-header {
        flex-direction: column;
        gap: 10px;
        align-items: flex-start;
    }
    
    .event-meta {
        flex-direction: column;
        gap: 8px;
    }
    
    .event-meta-grid {
        grid-template-columns: 1fr;
    }
    
    .event-actions {
        flex-direction: column;
    }
    
    .event-actions .btn {
        width: 100%;
        text-align: center;
    }
}

/* ==========================================================================
   PAGE CATÉGORIE ÉVÉNEMENT
   ========================================================================== */

.event-category-single {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 5% 60px;
}

.category-header-bar {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-left: 4px solid var(--primary);
    border-radius: 8px;
    padding: 30px;
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}

.category-badge {
    display: inline-block;
    background: var(--primary);
    color: var(--bg-dark);
    padding: 8px 20px;
    border-radius: 4px;
    font-family: var(--font-heading);
    font-size: var(--text-lg);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.category-description {
    color: var(--text-gray);
    font-size: var(--text-base);
    margin: 0;
    flex: 1;
    min-width: 200px;
}

.category-events-section {
    margin-bottom: 40px;
}

.category-past-events {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 25px;
}

@media (max-width: 768px) {
    .category-header-bar {
        flex-direction: column;
        align-items: flex-start;
        padding: 20px;
    }
}



/* test */
/*.page-hero h1{
        color: purple !important;
    }
@media (max-width: 992px){
    .page-hero h1{
        color: blue !important;
    }
}
@media (max-width: 768px){
    .page-hero h1{
        color: red !important;
    }
}
@media (max-width: 480px){
    .page-hero h1{
        color: yellow !important;
    }
}*/

/* widget events */
.widget .em.pixelbones ul{
    list-style: none !important;
}
.widget .em.pixelbones ul li {
    padding: var(--space-1) 0 !important;
    border-bottom: 1px solid #333 !important;
}
.widget .em.pixelbones ul li:last-child{
    border: none !important;
    padding-bottom: 0 !important;
}
.widget .em.pixelbones ul li a {
    color: var(--text-gray) !important;
    transition: color 0.3s ease;
    font-family: var(--font-body);
    font-size: var(--text-base);
    line-height: 1.6;
}
.widget .em.pixelbones ul li a:hover {
    color: var(--primary) !important;
}

/* corrections blocs */
.tarif-card__cta:hover,.challenge-card__cta:hover{
    color:#fff;
}


/* tableaux tarifs racing */
.racing table,.racing table thead,.racing table tbody,.racing table th,.racing table td{
    border: 1px solid var(--pale);
}
.racing table thead tr{
    background-color: var(--bg-card);
}
.racing table tbody tr td:not(:first-child){
    text-align: center;
}
.racing table tbody tr td:nth-child(2){
    background-color: var(--primary);
    color:var(--bg-dark);
    font-weight: bold;
}
.racing table tbody tr:not(:last-child) td:nth-child(2){
    border-bottom-color:var(--border-color);
}

/* survol cards icones */

.survol .wp-block-column{
    border: 1px solid var(--border-color);
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}
.survol .wp-block-column p{
    font-weight: bold;
}
.survol .wp-block-column p:last-child{
    margin-bottom: 0;
}
.survol .wp-block-column.primary{
    border-color: #ccc;
}
.survol .wp-block-column:hover{
    transform: translateY(-8px);
    border-color: var(--primary);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), 0 0 0 1px var(--primary);
}
.survol .wp-block-column.primary:hover{
    border-color: var(--text-light);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4), 0 0 0 1px var(--text-light);
}
.survol .wp-block-column .kart-icon__glyph,.survol .wp-block-column .wp-block-image{
    transition: transform 0.3s ease;
}
.survol .wp-block-column:hover .kart-icon__glyph,.survol .wp-block-column:hover .wp-block-image{
    transform:scale(1.05);
}

/* IMAGE GEO modale */

.geo-modal-content {
    position: relative;
    max-width: 70%;
    max-height: 96%;
    animation: geoFadeIn 0.25s ease-in;
}
/* CTA Home */
.home .kart-cta--accent {
    background: var(--primary, #ffc400);
}
.home .kart-cta--horizontal {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 32px 40px;
}
.home .wp-block-karting-cta-block {
    margin: var(--space-6, 48px) 0 0;
    border-radius: 12px;
    overflow: hidden;
}
.home .kart-cta__content {
    flex: 1;
}
.home .kart-cta--accent .kart-cta__title {
    color: var(--bg-dark, #111);
}
.home .kart-cta__title {
    font-family: 'Oswald', sans-serif;
    font-size: clamp(1.25rem, 3vw, 1.75rem);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 0 8px 0;
    line-height: 1.3;
}
.home .kart-cta--accent .kart-cta__desc {
    color: rgba(0, 0, 0, 0.7);
}
.home .kart-cta__desc {
    font-size: 1rem;
    line-height: 1.6;
    margin: 0;
}
.home .kart-cta__action {
    flex-shrink: 0;
}
.home .kart-cta--accent .kart-cta__button {
    background: var(--bg-dark, #111);
    color: var(--primary, #ffc400);
    border: 2px solid var(--bg-dark, #111);
}

/* ==========================================================================
   RESPONSIVE CTA HORIZONTAUX (sections piste & chronomètre)
   ========================================================================== */
@media (max-width: 900px) {
    .home .kart-cta--horizontal {
        flex-direction: column;
        align-items: flex-start;
        gap: 18px;
        padding: 28px 24px;
    }
    .home .kart-cta__action {
        align-self: stretch;
    }
    .home .kart-cta__button {
        width: 100%;
        justify-content: center;
    }
}
@media (max-width: 600px) {
    .home .kart-cta--horizontal {
        padding: 22px 18px;
        border-radius: 8px;
    }
    .home .kart-cta__title { font-size: 1.2rem; }
    .home .kart-cta__desc { font-size: .95rem; }
    .home .kart-cta__button {
        padding: 12px 20px;
        font-size: .9rem;
    }
}

/* ==========================================================================
   SECTION CHRONOMÈTRE — IMAGE ILLUSTRATIVE (image_c)
   ========================================================================== */
.chrono-visual {
    max-width: 1100px;
    margin: 40px auto 0;
    padding: 0 20px;
}
.chrono-visual figure {
    margin: 0;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--border-color);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
    position: relative;
}
.chrono-visual img {
    width: 100%;
    height: auto;
    display: block;
    /*aspect-ratio: 16 / 7;
    object-fit: cover;*/
}
.chrono-visual figcaption {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px 25px;
    background: linear-gradient(transparent, rgba(0,0,0,0.85));
    color: var(--text-light);
    font-family: var(--font-heading);
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 0.95rem;
}
@media (max-width: 600px) {
    /*.chrono-visual img { aspect-ratio: 4 / 3; }*/
    .chrono-visual figcaption { padding: 14px 16px; font-size: .85rem; }
}
.home .kart-cta__button {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 28px;
    font-family: 'Oswald', sans-serif;
    font-size: 0.95rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.3s ease;
    white-space: nowrap;
}
.home .kart-cta__button svg {
    transition: transform 0.3s ease;
}
.home .kart-cta--accent .kart-cta__button:hover {
    background: transparent;
    color: var(--bg-dark, #111);
    border-color: var(--bg-dark, #111);
}
.home .kart-cta--accent .kart-cta__button {
    background: var(--bg-dark, #111);
    color: var(--primary, #ffc400);
    border: 2px solid var(--bg-dark, #111);
}

/* ==========================================================================
   MENU : items .noclick (lien parent non cliquable)
   ========================================================================== */
.menu-item.noclick > a {
    cursor: default;
}
/* Indicateur chevron sur mobile pour les items noclick */
@media (max-width: 960px) {
    .menu-item.noclick > a::after {
        content: "▾";
        margin-left: 8px;
        font-size: .7em;
        display: inline-block;
        transition: transform .2s ease;
    }
    .menu-item.noclick.is-open > a::after {
        transform: rotate(180deg);
    }
    .menu-item.noclick > .sub-menu {
        display: none;
    }
    .menu-item.noclick.is-open > .sub-menu {
        display: block;
    }
}

/* execption pour first section */
.page .entry-content .geo-tldr-hidden+section{
    margin-top: 0 !important;
}
/* ==========================================================================
   COMPLIANZ : surcharge uniquement sur le contenu du document cookies
   ATTENTION : le plugin ajoute `.cmplz-document` sur <body> → on NE cible
   QUE `#cmplz-document` (wrapper du contenu généré par le shortcode).
   ========================================================================== */

/* Wrapper général du document cookies */
#cmplz-document {
    color: var(--text-light) !important;
    background-color: var(--bg-dark, #111) !important;
    padding: clamp(20px, 3vw, 32px);
    border-radius: 8px;
}

/* Titres */
#cmplz-document h1,
#cmplz-document h2,
#cmplz-document h3,
#cmplz-document h4,
#cmplz-document h5,
#cmplz-document h6 {
    color: var(--primary, #ffc400) !important;
    background-color: transparent !important;
}

/* Texte courant */
#cmplz-document p,
#cmplz-document li,
#cmplz-document span,
#cmplz-document td {
    color: var(--text-light) !important;
}

/* Liens (uniquement dans le document) */
#cmplz-document a {
    color: var(--primary, #ffc400) !important;
    text-decoration: underline;
}
#cmplz-document a:hover {
    color: #fff !important;
}

/* ---- details / summary génériques ---- */
#cmplz-document details {
    background-color: var(--bg-card, #1a1a1a) !important;
    border: 1px solid rgba(255, 196, 0, 0.25);
    border-radius: 6px;
    padding: 12px 16px;
    margin-bottom: 12px;
    color: var(--text-light) !important;
}
#cmplz-document details > summary {
    color: var(--primary, #ffc400) !important;
    cursor: pointer;
    font-weight: 600;
    padding: 4px 0;
    list-style: none;
    background-color: transparent !important;
}
#cmplz-document details[open] > summary {
    margin-bottom: 8px;
    border-bottom: 1px solid rgba(255, 196, 0, 0.25);
}
#cmplz-document details summary::marker { color: var(--primary, #ffc400); }

/* Quand <details> est ouvert : forcer les titres DANS à être lisibles
   (h3/h4/h5 ne doivent pas se fondre avec un éventuel fond jaune) */
#cmplz-document details[open] h1,
#cmplz-document details[open] h2,
#cmplz-document details[open] h3,
#cmplz-document details[open] h4,
#cmplz-document details[open] h5,
#cmplz-document details[open] h6 {
    color: var(--primary, #ffc400) !important;
    background-color: transparent !important;
}

/* ---- Tableaux "cookies par finalité" ---- */
#cmplz-document .cookies-per-purpose {
    background-color: var(--bg-card, #1a1a1a) !important;
    color: var(--text-light) !important;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    padding: 12px;
    margin: 16px 0;
}
#cmplz-document .cookies-per-purpose > div {
    background-color: transparent !important;
    color: var(--text-light) !important;
}

/* En-têtes colonnes (Nom / Expiration / Fonction)
   → fond jaune plein appliqué directement sur les éléments (qu'ils soient div, h5…)
   → tous les descendants forcés en noir pour battre la règle h1-h6 (jaune) ci-dessus */
#cmplz-document .name-header,
#cmplz-document .retention-header,
#cmplz-document .function-header {
    background-color: var(--primary, #ffc400) !important;
    background-image: none !important;
    border-radius: 4px !important;
    padding: 10px 12px !important;
    margin: 2px 0 !important;
}
#cmplz-document .name-header,
#cmplz-document .name-header *,
#cmplz-document .retention-header,
#cmplz-document .retention-header *,
#cmplz-document .function-header,
#cmplz-document .function-header * {
    color: var(--bg-dark, #111) !important;
    font-weight: 700 !important;
}
#cmplz-document .name-header *,
#cmplz-document .retention-header *,
#cmplz-document .function-header * {
    background-color: transparent !important;
    margin: 0 !important;
}
/* Conteneur parent éventuel (div.row contenant les 3 headers) */
#cmplz-document .cookies-per-purpose > div:has(> .name-header),
#cmplz-document .cookies-per-purpose > div:has(> .retention-header),
#cmplz-document .cookies-per-purpose > div:has(> .function-header) {
    background-color: var(--primary, #ffc400) !important;
    border-radius: 4px;
}

/* Contenu colonnes */
#cmplz-document .name,
#cmplz-document .retention,
#cmplz-document .function,
#cmplz-document .purpose {
    color: var(--text-light) !important;
    background-color: transparent !important;
    padding: 6px 10px;
}

/* Zebra : exclut explicitement tout élément portant une classe *-header */
#cmplz-document .cookies-per-purpose > div:nth-child(even):not(.name-header):not(.retention-header):not(.function-header):not(:has(.name-header)):not(:has(.retention-header)):not(:has(.function-header)) {
    background-color: rgba(255, 255, 255, 0.06) !important;
    border-radius: 3px;
}

/* ---- Dropdowns Complianz (accordéons catégories) ---- */
#cmplz-document .cmplz-dropdown {
    background-color: var(--bg-card, #1a1a1a) !important;
    border-radius: 6px;
    margin-bottom: 10px;
}
#cmplz-document .cmplz-dropdown > summary {
    background-color: var(--bg-card, #1a1a1a) !important;
    color: var(--primary, #ffc400) !important;
    border: 1px solid rgba(255, 196, 0, 0.3) !important;
    border-radius: 6px !important;
    padding: 12px 16px !important;
    font-weight: 600;
}
#cmplz-document .cmplz-dropdown > summary:hover {
    background-color: #222 !important;
    border-color: var(--primary, #ffc400) !important;
}
#cmplz-document .cmplz-dropdown[open] > summary {
    background-color: var(--primary, #ffc400) !important;
    color: var(--bg-dark, #111) !important;
    border-color: var(--primary, #ffc400) !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}
/* Titres DANS le summary ouvert : noir pour rester lisibles sur jaune */
#cmplz-document .cmplz-dropdown[open] > summary h1,
#cmplz-document .cmplz-dropdown[open] > summary h2,
#cmplz-document .cmplz-dropdown[open] > summary h3,
#cmplz-document .cmplz-dropdown[open] > summary h4,
#cmplz-document .cmplz-dropdown[open] > summary h5,
#cmplz-document .cmplz-dropdown[open] > summary h6,
#cmplz-document .cmplz-dropdown[open] > summary span {
    color: var(--bg-dark, #111) !important;
}

/* ---- Consent Manager (cmplz-manage-consent-container) ---- */
#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category {
    background-color: var(--bg-card, #1a1a1a) !important;
    border: 1px solid rgba(255, 196, 0, 0.2) !important;
    border-radius: 6px !important;
    margin-bottom: 10px !important;
}
#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header {
    background-color: var(--bg-card, #1a1a1a) !important;
    color: var(--text-light) !important;
    border-bottom: 1px solid rgba(255, 196, 0, 0.15) !important;
    padding: 12px 16px !important;
}
#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header h3,
#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-category-title {
    color: var(--primary, #ffc400) !important;
    background-color: transparent !important;
}
#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-description {
    color: var(--text-gray, #C4C4C4) !important;
    background-color: transparent !important;
    padding: 12px 16px !important;
}

/* ---- Tableaux génériques Complianz ---- */
#cmplz-document table {
    background-color: var(--bg-card, #1a1a1a) !important;
    color: var(--text-light) !important;
    border-collapse: collapse;
    width: 100%;
}
#cmplz-document table th {
    background-color: var(--primary, #ffc400) !important;
    color: var(--bg-dark, #111) !important;
    padding: 8px 10px;
    text-align: left;
}
#cmplz-document table td {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding: 8px 10px;
    color: var(--text-light) !important;
}

/* ---- Blocs info / blockquote ---- */
#cmplz-document .cmplz-info,
#cmplz-document blockquote {
    background-color: rgba(255, 255, 255, 0.04) !important;
    border-left: 3px solid var(--primary, #ffc400);
    color: var(--text-gray, #C4C4C4) !important;
    padding: 12px 16px;
    margin: 12px 0;
}

/* ==========================================================================
   APEX TIMING : marge de scroll pour le header fixe
   ========================================================================== */
.leaderboard-wrapper,
iframe.axiframe,
iframe[src*="apex-timing.com"] {
    scroll-margin-top: 120px;
}


/* vidéo geo portrait */
.portrait .geo-video iframe,.portrait .geo-video video {
    aspect-ratio: 9 / 16;
}

/* image geo licence et crédits caches */
.nolicence .geo-credits .geo-license,.nocredits .geo-credits{
    display: none;
}


video[poster]{
height:100%;
width:100%;
}

.GrosPrix .challenge-card__condition,.GrosPrix .challenge-card__condition span{
    font-size: 1.5rem;
    color: var(--primary, #ffc400);
    font-weight: 700;
    font-family: 'Oswald', sans-serif;
    letter-spacing: 1px;
}
.GrosPrix .challenge-card__condition svg{
    display: none;
}

.section-number {
    display: inline-block;
    font-family: var(--font-heading);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--primary);
    background: rgba(255, 196, 0, 0.08);
    border: 1px solid rgba(255, 196, 0, 0.25);
    border-radius: 20px;
    padding: 4px 14px;
    margin-bottom: 0;
}


.page-id-403 #contact{
    display: none;
}