/*
Theme Name:             Twenty Fifteen Child 2025
Template:               twentyfifteen
Author:                 delicyus
Version:                202510  
Updated:                2025-10
*/


/* ======= Root =======  */
:root {
    --color-bg: #f7f7f5;
    /* faux-blanc légerement cassé */
    --color-bg-menu-mobile: #f0f0f0;
    /* fond menu mobile plus sombre */
    --color-text: #1a1a1a;
    --color-primary: #444444;
    /* gris neutre */
    --color-secondary: #6c757d;
    /* gris secondaire */
    --color-accent: #888888;
    /* accent gris */
    --color-muted: #f5f5f5;
    --color-border: #e5e7eb;
    --color-link: #434343;
    /* liens en gris */
    --color-link-hover: #111111;
    /* survol plus sombre */

    /* Typography */
    --font-sans: "Work Sans", Arial, Helvetica, sans-serif;
    --font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

    --font-body: var(--font-sans);
    --font-heading: "Quicksand", Arial, Helvetica, sans-serif;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-bolder: 900;

    --line-height-body: 1.6;
    --line-height-heading: 1.25;

    --letter-spacing-tight: -0.01em;
    --letter-spacing-normal: 0;
    --letter-spacing-wide: 0.02em;

    --font-size-base: 1rem;
    --font-size-md: 0.9rem;
    --font-size-sm: 0.875rem;
    --font-size-xsm: 0.83rem;
    --font-size-2xsm: 0.75rem;
    --font-size-lg: 1.125rem;
    --font-size-xl: 1.25rem;
    --font-size-2xl: 1.5rem;
    --font-size-3xl: 1.875rem;

    --h1-size: clamp(2rem, 2.5vw + 1rem, 3rem);
    --h2-size: clamp(1.75rem, 2vw + 0.75rem, 2.25rem);
    --h3-size: clamp(1.5rem, 1.5vw + 0.5rem, 1.875rem);
    --h4-size: 1.25rem;
    --h5-size: 1.125rem;
    --h6-size: 1rem;

    --measure: 65ch;
    --paragraph-spacing: 1em;
    --heading-spacing: 0.5em;
}


/* HTML ELEMENTS */
body {
    background-color: var(--color-bg);
    color: var(--color-text);
    font-family: var(--font-body);
}

a {
    color: var(--color-link);
}

a:hover {
    color: var(--color-link-hover);
    text-decoration: none;
}

a:focus {
    color: var(--color-accent);
    text-decoration: none;
}

/* Headings */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-tight);
    line-height: var(--line-height-heading);
}

/* RESPONSIVE IMAGES - Toutes les images sont responsives par défaut */

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

/* Resets */
ul,
li {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* ======= PRESSE NAV =======  */
.archive-header h1 {
    font-size: var(--font-size-xl);
}

/* ======= PRESSE NAV =======  */
.cat-nav {
    list-style: none;
    padding: 0;
    margin: 0 0 30px
}

.cat-nav li a {
    color: #3E3E3E;
    text-decoration: none;
    display: block;
    padding: 5px 10px;
    margin: 5px;
}

.cat-nav li a:hover,
.cat-nav li a.current {
    background: #1a1a1a;
    color: white;
}

.cat-nav li a .badge {
    font-weight: normal;
}

.cat-filters {
    color: #1a1a1a;
}

.cat-filters li.titre {
    font-weight: bold;
    padding: 10px 15px;
    text-transform: uppercase;
}

.cat-filters li a {
    background: #1a1a1a;
    color: white;
    padding: 10px 15px;
    border: 1px solid transparent
}

.cat-filters li a:hover,
.cat-filters li a.current {
    background: white;
    border: 1px solid rgba(0, 0, 0, .2);
    color: #666
}

/* =======  =======  */
.logo-link:hover {
    text-decoration: none;
}

.logo-text {
    font-size: var(--font-size-2xl);
    color: var(--color-primary);
    font-family: var(--font-heading);
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
}

/* ======= MENUS =======  */
.footer {
    padding: 30px 0;
    background: var(--color-text);
}

.footer-content .menu-principal-container .menu-item a {
    font-size: var(--font-size-2xsm) !important;
}

/* ======= FORMULAIRE =======  */
.form-bloc {
    background-color: white;
    padding: 30px 0;
    border-radius: 5px;
}

/* ======= MENUS =======  */

.menu {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 0;
    padding: 0;
    gap: 10px;
}

/* ======= MENU DES MENTIONS (footer) =======  */
.menu-menu-des-mentions-container a {
    display: block;
    font-family: var(--font-body);
    font-weight: var(--font-weight-regular);
    font-size: var(--font-size-2xsm);
    color: rgba(255, 255, 255, 0.5);
    text-decoration: none;
    transition: color 0.2s ease;
}

.menu-menu-des-mentions-container a:hover {
    color: rgba(255, 255, 255, 0.75);
    text-decoration: none;
}

/* ======= MENU PRINCIPAL =======  */
.menu-principal-container {
    padding: 30px 0;
}

.menu-principal-container .menu-item {
    text-align: center;
    margin: 0;
    padding: 0;
}

.menu-principal-container .menu-item a {
    display: block;
    font-family: var(--font-body);
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-md);
    color: var(--color-secondary);
    padding: 12px 8px;
    text-decoration: none;
    transition: all 0.3s ease;
    text-transform: uppercase;
}

.menu-principal-container .menu-item:hover a {
    background-color: var(--color-muted);
    color: var(--color-link-hover);
}

/* Menu items actifs/courants */
.menu-principal-container .menu-item.current-menu-item a,
.menu-principal-container .menu-item.current-menu-ancestor a,
.menu-principal-container .menu-item.current-page-item a,
.menu-principal-container .menu-item.current-page-ancestor a {
    background-color: var(--color-primary);
    color: white;
    font-weight: var(--font-weight-semibold);
    border-radius: 5px;
}

.menu-principal-container .menu-item.current-menu-item:hover a,
.menu-principal-container .menu-item.current-menu-ancestor:hover a,
.menu-principal-container .menu-item.current-page-item:hover a,
.menu-principal-container .menu-item.current-page-ancestor:hover a {
    background-color: var(--color-link-hover);
    color: white;
}

/* Menu item parent avec sous-menu actif */
.menu-principal-container .menu-item.current-menu-parent a {
    background-color: var(--color-accent);
    color: white;
}

.menu-principal-container .menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 0;
    padding: 0;
}

/* ======= LANGUE MENU =======  */
.langue-menu {
    margin: 0 30px;
}

.langue-menu ul {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: var(--font-size-sm);
}

.langue-menu li {
    margin: 0;
}

.langue-menu li a {
    display: inline-block;
    padding: 4px 8px;
    font-size: 0.75rem;
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    text-decoration: none;
    color: var(--color-secondary);
    background: var(--color-muted);
    border: 1px solid var(--color-border);
    border-radius: 4px;
    transition: all 0.2s ease;
    line-height: 1.2;
}

.langue-menu li a:hover {
    color: var(--color-text);
    background: white;
    border-color: var(--color-primary);
    text-decoration: none;
}

.langue-menu li a.langue-current {
    color: white;
    background: var(--color-primary);
    border-color: var(--color-primary);
    font-weight: var(--font-weight-semibold);
}

.langue-menu li a.langue-current:hover {
    background: var(--color-text);
    border-color: var(--color-text);
}

/* ======= SHOP BUTTON =======  */
.btn-shop {
    display: inline-block;
    padding: 6px 12px;
    font-size: 0.8rem;
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    text-decoration: none;
    color: var(--color-text);
    background: transparent;
    border: 1px solid var(--color-primary);
    border-radius: 4px;
    transition: all 0.3s ease;
    line-height: 1.2;
    letter-spacing: 0.5px;
}

.btn-shop:hover {
    color: white;
    background: var(--color-primary);
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.btn-shop:active {
    transform: translateY(0);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

/* Variante dans le menu principal */
.main-navigation .btn-shop {
    margin-left: 10px;
    font-size: 0.75rem;
    padding: 4px 8px;
}

/* =======  =======  */
.page-titre {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-bolder);
    margin-bottom: 10px;
    text-transform: uppercase;
}

/* ======= SOCIAL MENU =======  */
.menu-socials {
    padding: 0 10px;
}

/* ======= CARDS =======  */
.revue-presse-card {
    border: 1px solid rgba(0, 0, 0, .2);
    padding: 20px 30px;
    margin-bottom: 20px;
    display: block;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.revue-presse-card .titre {
    padding: 20px 0;
}

.revue-presse-card .presse-date {
    font-size: 14px
}

.revue-presse-card h4 {
    color: #333;
    font-size: 18px;
    font-weight: bold;
    word-wrap: break-word
}

.revue-presse-card img {
    max-height: 320px;
    width: auto;
    margin-bottom: 40px
}

.revue-presse-card .content p {
    margin: 0
}

.revue-presse-card .presse-categories {
    font-size: 14px;
}

.revue-presse-card .presse-cat-name {
    padding: 0 0 0 15px;
    display: block;
    font-variant: small-caps;
}

/* NEWSLETTER FORM */
#sib-container,
.sib-form {
    padding: 0 !important;
}

.sib-form .entry__label {
    margin: 0;
}

/* ======= VUEJS =======  */
.fade-enter-active,
.fade-leave-active {
    transition: opacity .5s;
}

.fade-enter,
.fade-leave-to {
    opacity: 0;
}

[v-cloak]>* {
    display: none
}

[v-cloak]::before {
    content: "...";
    text-align: center;
    display: block;
}

/* ======= Utilities =======  */

.p-0 {
    padding: 0;
}

.pb-10 {
    padding-bottom: 10px;
}

.pl-20 {
    padding-left: 20px;
}

.p-30 {
    padding: 30px;
}

.pb-30 {
    padding-bottom: 30px;
}

.py-30 {
    padding-top: 30px;
    padding-bottom: 30px;
}

.py-60 {
    padding-top: 60px;
    padding-bottom: 60px;
}

.pb-60 {
    padding-bottom: 60px;
}

.pt-60 {
    padding-top: 60px;
}

.icon-32 {
    width: 32px;
}

.icon-18 {
    width: 18px;
}

/* ======= AUDIO EMBED =======  */

.audio-embed-container {
    position: relative;
    width: 100%;
}

.audio-embed-container iframe {
    width: 100%;
    border: none;
    border-radius: 4px;
}

/* Responsive iframe pour les embeds audio */
.audio-embed-container iframe[src*="soundcloud"],
.audio-embed-container iframe[src*="spotify"],
.audio-embed-container iframe[src*="bandcamp"] {
    min-height: 150px;
}

/* ======= YOUTUBE EMBEDS =======  */

.band-youtube {
    margin-top: 2rem;
}

.band-youtube h3 {
    font-family: var(--font-heading);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text);
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--color-border);
}

.band-youtube h3 i {
    color: #ff0000;
    /* Rouge YouTube */
    margin-right: 0.5rem;
}

.youtube-embeds-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: space-between;
}

.youtube-embed-wrapper {
    position: relative;
    flex: 1 1 calc(50% - 0.5rem);
    /* 2 vidéos par ligne avec gap */
    min-width: 300px;
    /* Largeur minimum */
    padding-bottom: 28.125%;
    /* Ratio 16:9 adapté pour 50% */
    height: 0;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.youtube-embed-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 8px;
}

/* Responsive pour mobile */
@media (max-width: 768px) {
    .youtube-embeds-container {
        flex-direction: column;
        gap: 1rem;
    }

    .youtube-embed-wrapper {
        flex: 1 1 100%;
        /* Une vidéo par ligne sur mobile */
        min-width: unset;
        padding-bottom: 56.25%;
        /* Retour au ratio 16:9 complet */
        border-radius: 4px;
    }

    .youtube-embed-wrapper iframe {
        border-radius: 4px;
    }
}

/* ======= BAND NAVIGATION LINKS =======  */

/* ======= BG BLUR UTILITY ======= */
.elastic-bg {
    position: relative;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.bg-blur {
    position: relative;
    overflow: hidden; /* évite les bavures de flou */
}

.bg-blur::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: inherit; /* récupère l'image de fond inline */
    filter: blur(12px);
    transform: scale(1.06); /* réduit l'effet de bords du flou */
    transform-origin: center;
}

.bg-blur > * {
    position: relative;
    z-index: 1; /* garde le contenu net au-dessus du flou */
}

/* Améliore la lisibilité du texte sur fond flouté */
.bg-blur .page-header h1, 
.bg-blur .page-header h2 {
    color: white;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.band-links {
    margin-top: 2rem;
}

.band-navigation-links {
    text-align: center;
}

.btn {
    display: inline-block;
    padding: 0.75rem 1.5rem;
    text-decoration: none;
    border-radius: 6px;
    font-weight: var(--font-weight-medium);
    transition: all 0.3s ease;
    border: 2px solid;
    font-size: 0.95rem;
}

.btn-outline {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background: transparent;
}

.btn-outline:hover {
    color: white;
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

.btn i {
    margin-right: 0.5rem;
}

/* ======= DISQUES ARCHIVE =======  */
.disques-archive-grid .row {
    display: flex;
    flex-wrap: wrap;
}

.disque-vignette {
    display: flex !important;
    /* Force le flex sur les colonnes Bootstrap */
    flex-direction: column;
    margin-bottom: 2rem;
    /* Assure que les colonnes s'étirent */
    align-items: stretch;
}

.disque-item {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

.disque-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    /* Prend toute la hauteur disponible */
    height: 100%;
    background: white !important;
    /* Fond blanc uniforme forcé */
    border-radius: 3px;
    overflow: hidden;
    transition: transform 0.3s ease;
    /* Ajout d'une ombre légère pour délimiter les cartes */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.disque-body:hover {
    transform: translateY(-5px);
}

.disque-cover {
    width: 100%;
    aspect-ratio: 1 / 1;
    /* Force un rapport carré 1:1 */
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-muted);
    position: relative;
}

/* Fallback pour les anciens navigateurs */
@supports not (aspect-ratio: 1 / 1) {
    .disque-cover {
        height: 0;
        padding-bottom: 100%;
        /* Crée un carré avec padding-bottom: 100% */
    }

    .disque-cover a {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }
}

.disque-cover a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.disque-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.disque-cover .no-image {
    background-color: #e9ecef;
    color: #6c757d;
}

.disque-content {
    flex: 1;
    /* Prend tout l'espace restant */
    display: flex;
    flex-direction: column;
    padding: 1rem;
    /* Force la répartition du contenu */
    justify-content: space-between;
}

.disque-title {
    margin: 0 0 15px 0;
    text-align: center;
    font-size: 1.2rem;
    padding: 10px 0;
    flex-grow: 1;
    /* Prend l'espace disponible pour pousser les actions vers le bas */
    display: flex;
    align-items: center;
    justify-content: center;
}

.disque-actions {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: auto;
    /* Pousse les actions vers le bas */
    padding-top: 1rem;
    /* Espacement avec le contenu au-dessus */
}

.disque-actions .btn-sm {
    display: block;
    width: 100%;
}

.disque-band-name {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-align: center;
    text-transform: uppercase;
}

.disque-band-name:hover {
    color: var(--color-link-hover);
}

.disque-lineup {
    padding: 1rem;
    background-color: var(--color-muted);
    border-left: 3px solid var(--color-accent);
    font-size: var(--font-size-sm);
    line-height: var(--line-height-body);
}

.disque-lineup h6 {
    margin-bottom: 0.5rem;
    font-weight: var(--font-weight-semibold);
    text-transform: uppercase;
    letter-spacing: var(--letter-spacing-wide);
    color: var(--color-primary);
}

/* Force la hauteur égale avec JavaScript-like CSS */
.disques-archive-grid .row {
    display: flex;
    flex-wrap: wrap;
}

.disques-archive-grid .disque-vignette {
    display: flex;
    align-items: stretch;
}

/* Hauteur égale avec flexbox - Solution robuste */
.disques-archive-grid .row:before,
.disques-archive-grid .row:after {
    display: none;
    /* Désactive les clearfix Bootstrap qui peuvent interférer */
}

/* Force toutes les colonnes à avoir la même hauteur */
.disques-archive-grid .row>[class*="col-"] {
    display: flex;
    flex-direction: column;
}

/* Hauteur minimale pour assurer la cohérence */
.disques-archive-grid .disque-body {
    min-height: 400px;
}

/* Media queries pour ajuster la hauteur minimale selon l'écran */
@media (max-width: 767px) {
    .disques-archive-grid .disque-body {
        min-height: 350px;
    }
}

@media (min-width: 992px) {
    .disques-archive-grid .disque-body {
        min-height: 450px;
    }
}

/* ======= BANDS WALL =======  */
.bands-wall-shortcode {
    margin: 0;
    padding: 0;
}

.bands-wall-shortcode .d-flex {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    /* Force tous les enfants à avoir la même hauteur */
}

.band-vignette {
    display: flex;
    flex-direction: column;
    margin-bottom: 2rem;
    padding: 0 15px;
    /* Espacement entre les colonnes */
}

.band-single-head h1 {
    font-size: var(--font-size-3xl);
}

.band-body {
    display: flex;
    flex-direction: column;
    height: 100%;
    /* Prend toute la hauteur disponible */
    background: white;
    border-radius: 3px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.band-body:hover {
    transform: translateY(-5px);
}

.band-body img {
    width: 100%;
    /* Hauteur fixe pour toutes les images */
    object-fit: cover;  
    /* Garde les proportions en recadrant si nécessaire */
    object-position: center;
}

.band-body>div:last-child {
    flex: 1;
    /* Prend l'espace restant pour équilibrer */
    display: flex;
    align-items: center;
    justify-content:  center;
    padding: 1rem;
}

.band-body h4 {
    text-align: center;
}

.band-body a:hover {
    text-decoration: none;
}

.band-name h2 {
    margin: 0;
    text-align: center;
    font-size: 1.2rem;
    line-height: 1.3;
}

.band-name {
    text-decoration: none;
    color: var(--color-text);
}

.band-name:hover {
    color: var(--color-link-hover);
    text-decoration: none;
}

.band-cover {
    border-radius: 3px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.band-cover-large {
    width: 100%;
    height: auto;
}

/* ======= Concert Post ======= */
.concert-post {
    margin-bottom: 5px;
    border-top-width: 3px;
    border-top-style: solid;
}


.concert-post p {
    margin: 0;
}

.concert-post .band-bg {
    border-radius: 3px;
}

.concert-post .band-name,
.concert-post .band-name a {
    text-transform: uppercase;
    font-family: var(--font-heading);
    color: var(--color-link);
    margin-bottom: 12px;
}

/* Style discret pour le label "gratuit" (neutralise le style Bootstrap "badge-success") */
.concert-gratuit.badge {
    background: transparent !important;
    color: var(--color-primary) !important;
    border: 1px solid var(--color-border) !important;
    box-shadow: none !important;
    font-weight: var(--font-weight-medium) !important;
    font-size: 0.85rem !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    margin-left: 8px !important;
    vertical-align: middle !important;
}

.concert-date {
    color: var(--color-text);
    font-weight: var(--font-weight-bolder);
    font-family: var(--font-body);
    padding: 7px 15px;
    text-transform: uppercase;
}

.concert-heure {
    font-size: var(--font-size-md);
    color: var(--color-accent);
}

.concert-ville {
    font-weight: var(--font-weight-bold);
}

.concert-details {
    font-size: var(--font-size-md);
    padding: 15px 0;
}

.concert-vignette-affiche {
    background: #fff;
}

.concerts-prochains-shortcode h2 {
    font-size: var(--font-size-base);
}

/* ======= Footer Description ======= */
.footer-description {
    font-family: var(--font-heading);
    font-size: var(--font-size-sm);
    color: rgba(255, 255, 255, 0.85);
    padding: 30px 0;
    line-height: var(--line-height-body);
}

/* ======= Loading Spinner ======= */
.spinner {
    animation: rotate 2s linear infinite;
    display: inline-block;
}

.spinner .path {
    stroke: var(--color-primary);
    stroke-linecap: round;
    animation: dash 1.5s ease-in-out infinite;
}

@keyframes rotate {
    100% {
        transform: rotate(360deg);
    }
}

@keyframes dash {
    0% {
        stroke-dasharray: 1, 150;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 90, 150;
        stroke-dashoffset: -35;
    }

    100% {
        stroke-dasharray: 90, 150;
        stroke-dashoffset: -124;
    }
}

/* ======= ======= */
.separateur {
    background: #333;
    display: block;
    height: .4em;
    overflow: hidden;
    margin: 7px auto;
    width: 1em;
}


/* ======= HEADER MOBILE ======= */
.header-mobile {
    border-bottom: 1px solid var(--color-border);
}

.logo-mobile .logo-text-mobile {
    font-size: var(--font-size-xl);
    color: var(--color-primary);
    font-family: var(--font-heading);
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    margin-left: 10px;
}

/* Menu Burger */
.btn-menu-mobile {
    background: none;
    border: none;
    padding: 8px;
    cursor: pointer;
    display: block;
    width: 32px;
    height: 32px;
    position: relative;
}

.burger-line {
    display: block;
    height: 2px;
    width: 20px;
    background: var(--color-primary);
    margin: 4px auto;
    transition: all 0.3s ease;
    position: relative;
}

.btn-menu-mobile:hover .burger-line {
    background: var(--color-link-hover);
}

/* Burger actif (X) */
.btn-menu-mobile.active .burger-line:nth-child(1) {
    transform: rotate(45deg);
    top: 6px;
}

.btn-menu-mobile.active .burger-line:nth-child(2) {
    opacity: 0;
}

.btn-menu-mobile.active .burger-line:nth-child(3) {
    transform: rotate(-45deg);
    top: -6px;
}

/*  */
.lanceur-home h4 {
    font-weight: var(--font-weight-bolder);
}

/* Menu Mobile Overlay */
.mobile-menu-overlay {
    background: var(--color-bg-menu-mobile);
    /* Utilise la variable CSS */
    padding: 20px 0;
    /* Pas de padding horizontal */
    border-top: 1px solid var(--color-border);
    margin-left: -15px;
    /* Compense le padding du container */
    margin-right: -15px;
    /* Compense le padding du container */
    width: calc(100% + 30px);
    /* Compense les marges */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    /* Ombre subtile */
}

.mobile-menu-principal {
    margin-bottom: 40px;
}

.mobile-menu-principal .menu {
    flex-direction: column;
    gap: 0;
}

.mobile-menu-principal .menu-item {
    width: 100%;
    border-bottom: 1px solid var(--color-border);
}

.mobile-menu-principal .menu-item a {
    padding: 20px 20px;
    /* Ajoute du padding horizontal pour le contenu */
    font-size: var(--font-size-lg);
    text-align: left;
    display: block;
    width: 100%;
}

.mobile-menu-principal .menu-item.current-menu-item a,
.mobile-menu-principal .menu-item.current-menu-ancestor a,
.mobile-menu-principal .menu-item.current-page-item a,
.mobile-menu-principal .menu-item.current-page-ancestor a {
    border-radius: 0;
    background-color: var(--color-primary);
    color: white;
}

/* Menu Secondaire Mobile */
.mobile-menu-secondary {
    padding: 30px 20px 0;
    /* Ajoute du padding horizontal */
    border-top: 1px solid var(--color-border);
}

.mobile-social-links {
    margin-bottom: 30px;
}

.mobile-social-links .menu-socials {
    justify-content: center;
    gap: 20px;
}

.mobile-lang-menu {
    margin-bottom: 30px;
    text-align: center;
}

.mobile-shop-btn {
    text-align: center;
}

.btn-shop-mobile {
    padding: 12px 24px;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
}

/* Bouton fermer mobile */
.mobile-menu-close {
    position: absolute;
    top: 20px;
    right: 20px;
    background: none;
    border: none;
    font-size: 30px;
    color: var(--color-primary);
    cursor: pointer;
}


/* ======= TRIBUNE LIBRE - DESIGN MINIMAL ======= */

/* Container principal */
.tribune-libre-archive {
    margin: 0;
    padding: 0;
}

/* Article item */
.tribune-libre-item {
    border-bottom: 1px solid #e9ecef;
    padding: 2rem 0 !important;
    margin-bottom: 0;
    transition: all 0.3s ease;
}

.tribune-libre-item:last-child {
    border-bottom: none;
}

.tribune-libre-item:hover {
    background-color: #fafafa;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    margin-left: -1rem;
    margin-right: -1rem;
    border-radius: 4px;
}

/* Header */
.tribune-libre-header {
    margin-bottom: 1.5rem;
}

.tribune-libre-title {
    font-weight: var(--font-weight-bold);
    font-size: 1.5rem;
    line-height: 1.3;
    margin: 0 0 0.75rem 0;
}

.tribune-libre-title a {
    color: #212529;
    text-decoration: none;
    transition: color 0.3s ease;
}

.tribune-libre-title a:hover {
    color: var(--color-primary);
    text-decoration: none;
}

.tribune-libre-date {
    font-size: 0.875rem;
    color: #6c757d;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
}

/* Content */
.tribune-libre-content {
    font-size: 1rem;
    line-height: 1.6;
    color: #495057;
    margin-bottom: 1.5rem;
}

.tribune-libre-content p {
    margin-bottom: 1rem;
}

.tribune-libre-content p:last-child {
    margin-bottom: 0;
}

/* Footer */
.tribune-libre-footer {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.tribune-libre-footer .btn {
    background-color: transparent;
    border: 1px solid var(--color-primary);
    color: var(--color-primary);
    padding: 0.5rem 1.25rem;
    font-size: 0.875rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: 2px;
    transition: all 0.3s ease;
    text-decoration: none;
}

.tribune-libre-footer .btn:hover {
    background-color: var(--color-primary);
    color: white;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

/* Responsive */
@media (max-width: 768px) {
    .tribune-libre-item {
        padding: 1.5rem 0 !important;
    }

    .tribune-libre-title {
        font-size: 1.25rem;
    }

    .tribune-libre-content {
        font-size: 0.95rem;
    }
}

/* ======= TRIBUNE LIBRE - SINGLE ARTICLE ======= */

/* Container principal */
.tribune-libre-single {
    padding: 2rem 0;
}

/* ======= Breadcrumbs (Yoast SEO) ======= */
.breadcrumbs {
    font-family: var(--font-heading);
    font-size: var(--font-size-sm);
    color: var(--color-secondary);
    padding: 0.75rem 0;
}

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

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

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

/* Breadcrumb (Tribune Libre) */
.tribune-libre-breadcrumb {
    margin-bottom: 1rem;
}

.breadcrumb-link {
    color: #6c757d;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    transition: color 0.3s ease;
}

.breadcrumb-link:hover {
    color: var(--color-primary);
    text-decoration: none;
}

/* Header */
.tribune-libre-single-header {
    margin-bottom: 3rem;
}

.tribune-libre-single-title {
    font-size: 2.5rem;
    font-weight: var(--font-weight-bold);
    line-height: 1.2;
    color: #212529;
    margin: 1.5rem 0;
    text-align: center;
}

.tribune-libre-single-meta {
    display: flex;
    justify-content: center;
    gap: 2rem;
    margin: 1.5rem 0;
    font-size: 0.9rem;
    color: #6c757d;
}

.tribune-libre-single-date,
.tribune-libre-single-author {
    display: flex;
    align-items: center;
    font-weight: 500;
}

/* Content */
.tribune-libre-single-content {
    font-size: 1.1rem;
    line-height: 1.7;
    color: #495057;
    margin-bottom: 3rem;
}

.tribune-libre-single-content p {
    margin-bottom: 1.5rem;
}

.tribune-libre-single-content h2,
.tribune-libre-single-content h3,
.tribune-libre-single-content h4 {
    margin-top: 2rem;
    margin-bottom: 1rem;
    color: #212529;
}

.tribune-libre-single-content blockquote {
    border-left: 4px solid var(--color-primary);
    padding-left: 1.5rem;
    margin: 2rem 0;
    font-style: italic;
    color: #6c757d;
}

/* Footer */
.tribune-libre-single-footer {
    border-top: 1px solid #e9ecef;
    padding-top: 2rem;
}

.tribune-libre-single-tags {
    margin-bottom: 2rem;
    font-size: 0.9rem;
    color: #6c757d;
}

.tribune-libre-single-tags a {
    color: var(--color-primary);
    text-decoration: none;
    margin-right: 0.5rem;
}

.tribune-libre-single-tags a:hover {
    text-decoration: underline;
}

/* Navigation */
.tribune-libre-single-navigation {
    margin: 2rem 0;
}

.nav-links .nav-previous,
.nav-links .nav-next {
    flex: 1;
    max-width: 45%;
}

.nav-links .btn {
    margin-bottom: 0.5rem;
    font-size: 0.8rem;
}

.nav-title {
    font-size: 0.9rem;
    font-weight: 500;
    color: #495057;
    line-height: 1.3;
}

/* Bouton retour */
.tribune-libre-single-back .btn {
    padding: 0.75rem 2rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Page links (pagination interne) */
.page-links {
    text-align: center;
    margin: 2rem 0;
    font-weight: 500;
}

.page-links a {
    display: inline-block;
    padding: 0.5rem 1rem;
    margin: 0 0.25rem;
    border: 1px solid #dee2e6;
    border-radius: 3px;
    color: var(--color-primary);
    text-decoration: none;
    transition: all 0.3s ease;
}

.page-links a:hover {
    background-color: var(--color-primary);
    color: white;
}

/* Responsive Single */
@media (max-width: 768px) {
    .tribune-libre-single-title {
        font-size: 2rem;
    }

    .tribune-libre-single-meta {
        flex-direction: column;
        gap: 0.5rem;
    }

    .tribune-libre-single-content {
        font-size: 1rem;
    }

    .nav-links {
        flex-direction: column;
        gap: 1rem;
    }

    .nav-links .nav-previous,
    .nav-links .nav-next {
        max-width: 100%;
        text-align: center;
    }
}
