/*
Theme Name: Energy Cities
Theme URI: https://www.energy-cities.eu/
Author: Mohamed DABOUB - IDFR
Author URI: https://www.idfr.net/
Description: A custom WordPress theme for the Energy Cities website, designed to provide a modern and responsive user experience while showcasing the organization's mission and initiatives in the field of sustainable energy and urban development.  
Requires at least: WordPress 6.0
Version: 1.1.1
*/

/* VARIABLES GLOBALES */
@import url(fonts/Inter-VariableFont_opsz\,wght.woff2);

* {
    margin: 0;
    box-sizing: border-box;
    font-family: 'Inter', sans-serif;
}

html {
    scroll-behavior: smooth;
}

:root {
    /* Palette */
    --Background_white: #F8F7F4FF;
    --Font: #121212FF;
    --texte-news: #212124FF;
    --Primary_Energy: #394A44FF;
    --Secondary_Energy: #F1EAA4FF;
    --Background_Energy: #F5F1E6FF;
    --Tertiary_Energy: #87CCAFFF;
    --Yellow_energy: #F9E433FF;
    --white_energy: #FFFFFF;
    --black_energy: #000000;
    --gris_clair: #555;
    --gris-fonce: #333;
    --link-color: #3858E9;
    /* Typographie */
    --h1: 2.5rem;
    --h1_tablet: 2rem;
    --h1_Mobile: 1.65rem;
    --h2: 2rem;
    --h2_tablet: 1.35rem;
    --h2_Mobile: 1.25rem;
    --h3: 1.5rem;
    --h3_tablet: 1.25rem;
    --h3_Mobile: 1.25rem;
    --h4: 1.25rem;
    --h4_tablet: 1.125rem;
    --h4_Mobile: 1rem;
    --h5: 1rem;
    --h5_tablet: 0.95rem;
    --h5_Mobile: 0.875rem;
    --h6: 0.75rem;
    --h6_tablet: 0.7rem;
    --h6_Mobile: 0.625rem;
    --paragraph: 1.125rem;
    --paragraph_Mobile: 1rem;
    --paragraph_petit: 1rem;
    --footer-title: 1.5rem;
    --footer-text: 1rem;
    /* Espacements */
    --space-3xs: 4px;
    --space-2xs: 5px;
    --space-xs: 8px;
    --space-sm: 10px;
    --space-md: 12px;
    --space-base: 15px;
    --space-lg: 20px;
    --space-xl: 25px;
    --space-2xl: 30px;
    --space-3xl: 40px;
    --space-4xl: 50px;
    --space-5xl: 60px;
    --space-6xl: 80px;
    --space-7xl: 100px;
    /* Petites tailles de texte recurrentes */
    --text-micro: 0.8rem;
    --text-mini: 0.85rem;
    --text-smaller: 0.9rem;
    --text-small: 0.95rem;
    --text-medium: 1.1rem;
    --text-large: 1.2rem;
    /* Couleurs recurrentes (hors palette de base) */
    --border-grey: #eaeaea;
    --link-hover: #0056b3;
    --green-dark: #0e6b56;
    --green-soft-bg: #e6f4ea;
    --grey-medium: #666;
}

/* TYPOGRAPHIE & LIENS */
.wp-block-heading {
    margin: var(--space-base) 0;
}

p {
    font-size: var(--paragraph);
    color: var(--Font);
}

h1 {
    font-size: var(--h1);
    font-weight: 400;
}

h2 {
    font-size: var(--h2);
}

h3 {
    font-size: var(--h3);
}

h4 {
    font-size: var(--h4);
}

h5 {
    font-size: var(--h5);
}

h6 {
    font-size: var(--h6);
}

.separator {
    margin: var(--space-lg) 0;
    /* agrendir le trait */
    height: 1px;
    background-color: var(--Font);
}

p a,
li a,
div a {
    color: var(--link-color);
    font-weight: 700;
    text-decoration: none;
}

p a:hover,
li a:hover {
    color: var(--link-color);
    text-decoration: underline;
}

iframe {
    max-width: 100%;
}

/* Liens d'accessibilité */
.skip-link.screen-reader-text {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.skip-link.screen-reader-text:focus {
    position: fixed;
    top: 0;
    left: 0;
    width: auto;
    height: auto;
    background: var(--white_energy);
    color: var(--black_energy);
    padding: var(--space-base);
    font-weight: bold;
    z-index: 99999;
    outline: 2px solid var(--black_energy);
}

/*
   UTILITAIRES (Flèches, Surlignages, Scroll-to-top, Icônes sociales)
*/
.surlignage-yellow {
    background: linear-gradient(transparent 55%, var(--Secondary_Energy) 55%);
    padding: 0 var(--space-2xs);
    display: inline-block;
}

.surlignage-green {
    background: linear-gradient(transparent 55%, var(--Tertiary_Energy) 55%);
    padding: 0 var(--space-2xs);
    display: inline-block;
}

.surlignage-white {
    background: linear-gradient(transparent 55%, var(--Background_Energy) 55%);
    padding: 0 var(--space-2xs);
    display: inline-block;
}

/* Scroll to top */
.scroll-to-top {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 50px;
    height: 50px;
    background-color: var(--gris-fonce);
    color: var(--white_energy);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease, background-color 0.3s ease, transform 0.3s ease;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

.scroll-to-top.show {
    opacity: 1;
    visibility: visible;
}

.scroll-to-top:hover {
    background-color: var(--Tertiary_Energy);
    transform: translateY(-5px);
}

/* Flèches personnalisées */
.small-custom-arrow {
    display: inline-block;
    position: relative;
    width: 30px;
    height: 2px;
    background-color: currentColor;
    border-radius: 3px;
    vertical-align: middle;
    margin-left: var(--space-2xs);
}

.small-custom-arrow::before,
.small-custom-arrow::after {
    content: '';
    position: absolute;
    right: 0.2px;
    top: 0;
    width: 7px;
    height: 1.5px;
    background-color: currentColor;
    border-radius: 3px;
    transform-origin: right center;
}

.small-custom-arrow::before {
    transform: rotate(45deg);
}

.small-custom-arrow::after {
    transform: rotate(-45deg);
}

.custom-arrow {
    display: inline-block;
    position: relative;
    width: 35px;
    height: 2px;
    background-color: currentColor;
    border-radius: 3px;
    vertical-align: middle;
    margin-left: var(--space-base);
}

.custom-arrow::before,
.custom-arrow::after {
    content: '';
    position: absolute;
    right: -0.3px;
    top: 0;
    width: 10px;
    height: 1.5px;
    background-color: currentColor;
    border-radius: 3px;
    transform-origin: right center;
}

.custom-arrow::before {
    transform: rotate(45deg);
}

.custom-arrow::after {
    transform: rotate(-45deg);
}

.big-custom-arrow {
    display: inline-block;
    position: relative;
    width: 60px;
    height: 3px;
    background-color: currentColor;
    border-radius: 3px;
    vertical-align: middle;
}

.big-custom-arrow::before,
.big-custom-arrow::after {
    content: '';
    position: absolute;
    right: 1px;
    top: 0;
    width: 10px;
    height: 2px;
    background-color: currentColor;
    border-radius: 3px;
    transform-origin: right center;
}

.big-custom-arrow::before {
    transform: rotate(45deg);
}

.big-custom-arrow::after {
    transform: rotate(-45deg);
}

/* Icônes sociales (sprites) */
.social-icon {
    width: 50px;
    height: 50px;
    background-image: url('img/webp/css_sprites.webp');
    background-repeat: no-repeat;
    display: inline-block;
}

.social-icon:hover {
    filter: brightness(1.4);
    transition: filter 0.3s ease;
}

.bg-it {
    background-position: -10px -10px;
}

.bg-linkedin {
    background-position: -80px -10px;
}

.bg-rss {
    background-position: -10px -80px;
}

.bg-soundcloud {
    background-position: -80px -80px;
}

.bg-Spotify {
    background-position: -150px -10px;
}

.bg-youtube {
    background-position: -150px -80px;
}

/* TOPBAR & HEADER */
.custom-topbar {
    background-color: var(--Primary_Energy);
    padding: var(--space-md) var(--space-2xl);
}

.topbar-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2xl);
    max-width: 1200px;
    margin: 0 auto;
}

.topbar-buttons {
    display: flex;
    gap: var(--space-base);
}

.btn-topbar {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: var(--space-sm) var(--space-sm) var(--space-sm) var(--space-lg);
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.3s ease;
    gap: var(--space-sm);
}

.btn-solid {
    background-color: var(--Background_Energy);
    color: var(--black_energy);
}

.btn-outline {
    background-color: transparent;
    color: var(--white_energy);
    border: 1px solid var(--white_energy);
}

.btn-solid:hover {
    background-color: var(--Background_white);
}

.btn-outline:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

/* Recherche & Langue */
.topbar-actions-search {
    display: flex;
    align-items: center;
    gap: var(--space-lg);
}

.topbar-search {
    position: relative;
    display: flex;
    align-items: center;
}

.topbar-search input {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 50px;
    padding: var(--space-xs) 35px var(--space-xs) var(--space-base);
    color: var(--white_energy);
    width: 300px;
    outline: none;
}

.topbar-search input:focus {
    border-color: var(--white_energy);
}

.search-icon-css {
    position: absolute;
    right: 12px;
    background: transparent;
    border: none;
    cursor: pointer;
    width: 14px;
    height: 14px;
    padding: 0;
}

.search-icon-css::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 10px;
    height: 10px;
    border: 1.5px solid var(--white_energy);
    border-radius: 50%;
}

.search-icon-css::after {
    content: '';
    position: absolute;
    bottom: -1px;
    right: 0;
    width: 5px;
    height: 1.5px;
    background: var(--white_energy);
    transform: rotate(45deg);
}

.topbar-change-lang {
    color: var(--white_energy);
    font-weight: 600;
    cursor: pointer;
}

.lang-arrow-css {
    display: inline-block;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid var(--white_energy);
    margin-top: 2px;
    transition: transform 0.3s ease;
}

.lang-dropdown {
    position: relative;
    display: inline-block;
}

.lang-dropdown .current-lang {
    display: flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    padding: var(--space-2xs) 0;
}

.topbar-change-lang:hover .lang-arrow-css {
    transform: rotate(180deg);
}

.lang-dropdown .lang-list {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    background-color: var(--Background_white);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    list-style: none;
    padding: 0;
    margin: 0;
    min-width: 50px;
    z-index: 20;
    border-radius: 4px;
    overflow: hidden;
}

.topbar-change-lang:hover .lang-list {
    display: block;
}

.lang-dropdown .lang-list li a {
    display: block;
    padding: var(--space-xs) var(--space-md);
    text-decoration: none;
    color: var(--gris-fonce);
    text-align: center;
    font-weight: 600;
    transition: background-color 0.2s ease;
}

.lang-dropdown .lang-list li a:hover {
    background-color: var(--Background_Energy);
}

/* Header principal */
.header-main {
    background-color: var(--Background_white);
}

.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-sm) 0;
    gap: var(--space-6xl);
    max-width: 1200px;
    margin: 0 auto;
}

.header-link-logo {
    display: flex;
    align-items: center;
    text-decoration: none;
    width: fit-content;
}

.header-link-logo .custom-logo,
.logo-mobile-inside {
    max-height: 115px;
    width: 90px;
    height: auto;
}

.logo-mobile {
    display: none;
    height: auto;
}

.nav-principal {
    display: flex;
    gap: var(--space-2xl);
}

.site_header_menu {
    display: flex;
    gap: var(--space-2xl);
    list-style: none;
}

.site_header_menu li a {
    color: var(--Font);
    font-weight: 600;
    text-decoration: none;
    text-transform: capitalize;
    transition: color 0.3s ease;
}

.site_header_menu li a:hover {
    color: var(--Primary_Energy);
}

/* Ligne déco header */
hr.header-gradient-line {
    height: 10px;
    width: 100%;
    margin: 0;
    border: none;
    background: linear-gradient(to right, var(--Secondary_Energy) 0%, var(--Secondary_Energy) 30%, #7AB8A4 80%, #78B8A4 100%);
}

/* Fil d’ariane */
.breadcrumb {
    max-width: 1200px;
    margin: 0 auto;
}

.breadcrumbs-container {
    color: var(--Primary_Energy);
    font-size: var(--footer-text);
    padding: var(--space-base) 0;
    max-width: 1200px;
    margin: 0 auto;
}

.breadcrumbs-container a {
    color: var(--Tertiary_Energy);
    text-decoration: none;
    font-weight: 600;
}

.breadcrumbs-container a:hover {
    color: var(--Primary_Energy);
    text-decoration: underline;
}

#presentation .breadcrumbs-container a {
    color: var(--Font);
}

/* MENU MOBILE */
.menu-burger,
.mobile-menu-overlay {
    display: none;
}

.header-site-title {
    object-fit: contain;
}

@media screen and (max-width: 992px) {

    .custom-topbar,
    .nav-principal {
        display: none !important;
    }

    .header-container {
        justify-content: space-between;
        padding: var(--space-sm) var(--space-lg);
    }

    .header-site-title,
    .custom-logo {
        display: none;
    }

    .logo-mobile {
        display: block;
    }

    .menu-burger {
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        width: 30px;
        height: 25px;
        background: transparent;
        border: none;
        cursor: pointer;
        padding: 0;
        z-index: 1000;
    }

    .menu-burger .bar {
        width: 100%;
        height: 3px;
        background-color: var(--Font);
        border-radius: 5px;
        transition: all 0.3s ease-in-out;
    }

    body.menu-open .menu-burger .bar:nth-child(1) {
        transform: translateY(7px) rotate(46deg);
        background-color: var(--white_energy);
    }

    body.menu-open .menu-burger .bar:nth-child(2) {
        opacity: 0;
    }

    body.menu-open .menu-burger .bar:nth-child(3) {
        transform: translateY(-10px) rotate(-46deg);
        background-color: var(--white_energy);
    }

    .nav-principal {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background-color: var(--Font);
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.4s ease, visibility 0.4s ease;
        z-index: 999;
    }

    body.menu-open .nav-principal {
        opacity: 1;
        visibility: visible;
    }

    .site_header_menu {
        flex-direction: column;
        align-items: center;
        gap: var(--space-2xl);
    }

    .site_header_menu li a {
        color: var(--white_energy);
        font-weight: bold;
    }

    .site_header_menu li a:hover {
        color: #ffcc00;
    }
}

/* Menu mobile alternatif (overlay) */
body.mobile-menu-active {
    overflow: hidden;
}

.mobile-menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 999998;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

body.mobile-menu-active .mobile-menu-overlay {
    opacity: 1;
    visibility: visible;
}

.mobile-menu-container {
    position: fixed;
    top: 0;
    right: -100%;
    width: 100%;
    max-width: 100%;
    height: 100vh;
    background-color: var(--gris-fonce);
    z-index: 999999;
    transition: right 0.4s cubic-bezier(0.77, 0, 0.175, 1);
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    color: var(--white_energy);
}

body.mobile-menu-active .mobile-menu-container {
    right: 0;
}

body.admin-bar .mobile-menu-container {
    top: 32px;
    height: calc(100vh - 32px);
}

@media screen and (max-width: 782px) {
    body.admin-bar .mobile-menu-container {
        top: 46px;
        height: calc(100vh - 46px);
    }
}

.mobile-menu-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-lg);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.mobile-menu-close {
    background: none;
    border: none;
    color: var(--white_energy);
    cursor: pointer;
    padding: var(--space-2xs);
}

.mobile-nav-principal {
    padding: var(--space-lg);
    flex-grow: 1;
}

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

.mobile_header_menu li {
    margin-bottom: var(--space-base);
}

.mobile_header_menu a {
    color: var(--white_energy);
    text-decoration: none;
    font-size: var(--text-large);
    font-weight: 600;
    text-transform: uppercase;
    display: block;
    padding: var(--space-sm) 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.mobile-menu-footer {
    padding: var(--space-lg);
    background-color: rgba(0, 0, 0, 0.15);
}

.mobile-topbar-buttons {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    margin-bottom: var(--space-lg);
}

.mobile-topbar-buttons .btn-topbar {
    display: block;
    text-align: center;
    padding: var(--space-md);
    color: var(--white_energy);
    text-decoration: none;
    border: 1px solid var(--white_energy);
    border-radius: 4px;
    font-size: var(--text-smaller);
}

.mobile-topbar-buttons .btn-solid {
    background-color: var(--white_energy);
    color: var(--black_energy);
    font-weight: bold;
}

.mobile-topbar-buttons .custom-arrow {
    display: none !important;
}

.mobile-lang-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: var(--space-base);
    justify-content: center;
}

.mobile-lang-list a {
    color: var(--white_energy);
    text-decoration: none;
    opacity: 0.6;
    font-weight: bold;
}

.mobile-lang-list a.active-lang {
    opacity: 1;
    text-decoration: underline;
}

/* CONTENEURS GÉNÉRAUX */
.main-content,
.layout-2-cols,
.header-container,
.cartes-grille,
.news-container,
.valeurs-container,
.timeline-content,
.hero-description {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-lg) 0;
}

/* FOOTER */
.footer-call-to-action {
    background-color: var(--Primary_Energy);
    padding: var(--space-2xl) var(--space-lg);
    text-align: center;
    color: var(--white_energy);
    font-weight: 600;
    font-size: var(--footer-title);
    background-image: url("img/webp/footer-cta.webp");
    background-size: cover;
    background-position: center;
}

.footer-container h2.cta-text {
    margin: 0;
}

.footer-beige {
    background-color: var(--Background_Energy);
    padding: var(--space-lg);
    text-align: center;
    color: var(--Primary_Energy);
    font-size: var(--footer-text);
    border-bottom: 2px solid var(--Primary_Energy);
    text-transform: uppercase;
}

.layout-2-cols {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-lg);
}

.footer-col {
    justify-content: start;
}

h2.footer-title {
    font-size: var(--footer-title);
    text-align: start;
    width: 75%;
}

.footer-col:last-child h2.footer-title {
    width: 40%;
}

.footer-title-thin {
    font-weight: normal;
}

.footer-title-bold {
    font-weight: bold;
}

.flexible-links-container {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: var(--space-sm);
    margin: var(--space-lg) 0;
    color: var(--Primary_Energy);
    font-size: var(--footer-text);
    list-style: none;
    padding: 0;
}

.flexible-links-container a {
    text-decoration: none;
    color: inherit;
}

.flexible-links-container a:hover {
    text-decoration: underline;
    color: var(--Primary_Energy);
}

/* Boutons footer */
.btn-no-bg {
    background-color: transparent;
    color: var(--Primary_Energy);
}

.btn-no-bg:hover {
    text-decoration: underline;
}

.btn-bg {
    background-color: var(--Primary_Energy);
    color: var(--white_energy) !important;
    padding: var(--space-sm) var(--space-lg);
    border-radius: 25px;
    text-decoration: none;
    display: inline-block;
}

.btn-bg:hover {
    opacity: 0.8;
    transition: opacity 0.5s ease;
}

.btn-arrow-right,
.btn-arrow-left {
    padding: var(--space-sm) var(--space-lg);
    background-color: var(--Background_Energy);
    color: var(--black_energy);
    border-radius: 50px;
    transition: all 0.3s ease;
    text-decoration: none;
}

.layout-cta {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--space-lg);
    max-width: 1200px;
    margin: 0 auto;
}

.footer-white {
    background-color: var(--white_energy);
    color: var(--Primary_Energy);
    font-size: var(--footer-text);
    max-width: 1200px;
    padding: var(--space-lg);
    margin: auto;
}

.layout-3-cols {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin: var(--space-lg) 0;
    gap: var(--space-lg);
}

.widget_block h2 {
    font-weight: 400;
}

.footer-legal {
    background-color: var(--Primary_Energy);
    color: var(--white_energy);
    text-align: center;
    padding: var(--space-sm);
}

.legal-menu-list {
    display: flex;
    justify-content: center;
    gap: var(--space-lg);
    list-style: none;
    padding: 0;
}

.legal-menu-list li a {
    color: var(--white_energy);
    text-decoration: none;
}

.legal-menu-list li:nth-child(2) {
    border-left: 1px solid var(--white_energy);
    border-right: 1px solid var(--white_energy);
    padding: 0 var(--space-sm);
}

/* Hero */
.custom-hero-section {
    background-color: var(--Background_white);
    background-image: var(--hero-bg, none);
    background-position: right center;
    background-repeat: no-repeat;
    background-size: contain;
    min-height: 550px;
    padding: var(--space-3xl) var(--space-lg);
    display: flex;
    align-items: center;
}

@media (min-width: 1600px) {
    .custom-hero-section {
        background-size: cover;
    }
}

.hero-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

.hero-content {
    max-width: 730px;
    padding-left: var(--space-lg);
}

.hero-title {
    font-weight: 400;
    color: var(--texte-news);
    margin-bottom: var(--space-lg);
    text-transform: capitalize;
}

.hero-subtitle {
    font-weight: 700;
}

@media (max-width: 768px) {
    .custom-hero-section {
        background-image: none !important;
        width: 100%;
    }

    .hero-content {
        max-width: 100%;
        text-align: center;
        padding: var(--space-lg);
        border-radius: 10px;
    }
}

/*  Section général (News, Hubs, Card, Timeline, FAQ, Stats) */
/* Effet de fond étendu pour fait max width */
.news-section.bg-yellow,
.neo-section.bg-yellow,
.faq-section-bg-yellow,
.bloc-cartes-brutalist.bg-yellow {
    background-color: var(--Secondary_Energy);
    box-shadow: 0 0 0 100vmax var(--Secondary_Energy);
    clip-path: inset(0 -100vmax);
}

.neo-section.bg-white,
.faq-section-bg-white,
.bloc-cartes-brutalist.bg-white {
    background-color: var(--white_energy);
}

.news-section.bg-green,
.neo-section.bg-green,
.faq-section-bg-green,
.bloc-cartes-brutalist.bg-green {
    background-color: var(--Tertiary_Energy);
    box-shadow: 0 0 0 100vmax var(--Tertiary_Energy);
    clip-path: inset(0 -100vmax);
}

.news-section.bg-beige,
.neo-section.bg-beige,
.faq-section-bg-beige,
.bloc-cartes-brutalist.bg-beige {
    background-color: var(--Background_Energy);
    box-shadow: 0 0 0 100vmax var(--Background_Energy);
    clip-path: inset(0 -100vmax);
}

.news-section {
    padding: var(--space-6xl) var(--space-lg);
    width: 100%;
}

.news-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-5xl);
}

.news-section.layout-right .news-container {
    flex-direction: row-reverse;
}

.news-text-content {
    flex: 1;
    max-width: 500px;
    color: var(--texte-news);
}

.news-title {
    text-transform: uppercase;
    margin-bottom: var(--space-lg);
    max-width: 280px;
}

.news-title span {
    position: relative;
    display: inline-block;
}

.news-title span::after {
    content: "";
    position: absolute;
    bottom: 5px;
    left: 0;
    width: 100%;
    height: 8px;
    background-color: rgba(0, 0, 0, 0.1);
    z-index: -1;
}

.bg-yellow .news-title span::after {
    background-color: var(--Tertiary_Energy);
}

.bg-white .news-title span::after {
    background-color: var(--Secondary_Energy);
}

.bg-green .news-title span::after {
    background-color: var(--white_energy);
}

/* Card News*/
.news-card,
.wp-block-latest-posts__list.wp-block-latest-posts li {
    background: transparent;
    padding: var(--space-2xl) var(--space-lg);
    width: 250px;
    position: relative;
    z-index: 1;
    border: none;
    color: var(--Font);
    box-sizing: border-box;
}

.news-card::before,
.wp-block-latest-posts__list.wp-block-latest-posts li::before {
    content: "";
    position: absolute;
    top: 10px;
    left: -10px;
    width: 100%;
    height: 100%;
    background-image: url("img/webp/bg-news.webp");
    border: 1px solid var(--black_energy);
    z-index: -2;
    background-size: cover;
    background-repeat: round;
}

.news-card::after,
.wp-block-latest-posts__list.wp-block-latest-posts li::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--Background_Energy);
    border: 1px solid var(--black_energy);
    z-index: -1;
}

.news-card>*,
.wp-block-latest-posts__list.wp-block-latest-posts li>* {
    position: relative;
    z-index: 2;
}

.news-card-date,
.wp-block-latest-posts__post-date {
    font-size: var(--text-micro);
    margin-bottom: var(--space-base);
    display: block;
    color: var(--gris_clair);
}

.news-card-title,
.wp-block-latest-posts__post-title {
    display: block;
    font-weight: 800;
    margin-bottom: var(--space-xs);
    text-decoration: none;
    color: var(--Font);
}

.btn-read-more,
.wp-block-latest-posts__read-more {
    display: inline-block;
    padding: var(--space-2xs) var(--space-base);
    border: 1px solid var(--Primary_Energy);
    border-radius: 20px;
    text-decoration: none;
    color: var(--Primary_Energy);
    font-size: var(--text-smaller);
    margin-top: var(--space-base);
    transition: background 0.3s ease, color 0.3s ease;
}

.btn-read-more:hover,
.wp-block-latest-posts__read-more:hover {
    background: var(--Primary_Energy);
    color: var(--Background_Energy);
}

.btn-see-all {
    display: inline-block;
    padding: 16px;
    border-radius: 30px;
    text-decoration: none;
    margin-top: var(--space-base);
    background: var(--Primary_Energy);
    color: var(--white_energy);
    width: fit-content;
}

.btn-see-all:hover {
    opacity: 0.8;
    transition: opacity 0.5s ease;
}

.wp-block-latest-posts__list.wp-block-latest-posts {
    display: flex;
    gap: var(--space-2xl);
    list-style: none !important;
    padding: 0;
}

.wp-block-latest-posts__post-excerpt {
    font-size: var(--text-small);
    line-height: 1.5;
    color: var(--Font);
}

/* banner */
.custom-banner-block {
    width: 100%;
    padding: var(--space-sm);
}

.banner-button-container {
    display: flex;
    justify-content: end;
}

.banner-text {
    text-align: left;
}

.banner-text p {
    margin: 0;
    font-size: var(--paragraph);
    line-height: 1.5;
}

.banner-hub-btn {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 90px;
    height: 30px;
    border-radius: 15px;
    background-color: var(--btn-color);
    color: var(--black_energy);
    text-decoration: none;
    transition: transform 0.2s ease, filter 0.2s ease;
}

.banner-hub-btn .custom-arrow {
    margin-left: 0px !important;
    width: 45px !important;
}

.banner-hub-btn:hover {
    transform: translateX(5px);
    filter: brightness(0.9);
}

.custom-banner-block.bg-yellow .faq-section-title {
    background-image: linear-gradient(transparent 55%, var(--white_energy) 55%);
}

.custom-banner-block.bg-yellow {
    background-color: var(--Secondary_Energy);
    box-shadow: 0 0 0 100vmax var(--Secondary_Energy);
    clip-path: inset(0 -100vmax);
    color: var(--Font);
}

.custom-banner-block.bg-yellow .faq-section-title {
    background-image: linear-gradient(transparent 55%, var(--Tertiary_Energy) 55%);
    color: var(--Font);
}

.custom-banner-block.bg-green {
    background-color: var(--Tertiary_Energy);
    box-shadow: 0 0 0 100vmax var(--Tertiary_Energy);
    clip-path: inset(0 -100vmax);
    color: var(--Font);
}

.custom-banner-block.bg-green .faq-section-title {
    background-image: linear-gradient(transparent 55%, var(--Secondary_Energy) 55%);
    color: var(--Font);
}

.custom-banner-block.bg-beige {
    background-color: var(--Background_Energy);
    box-shadow: 0 0 0 100vmax var(--Background_Energy);
    clip-path: inset(0 -100vmax);
    color: var(--Font);
}

.custom-banner-block.bg-white {
    background-color: var(--white_energy);
    color: var(--Font);
}

/* Card News utilisé dans custom card */
.news-card-wrapper {
    background: transparent;
    position: relative;
    z-index: 1;
    border: none;
    color: var(--Font);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    transition: transform 0.2s ease;
    height: stretch;
}

.news-card-wrapper:hover {
    transform: translateY(-4px);
}

.news-card-wrapper:hover a:hover {
    text-decoration: none !important;
}

.news-card-wrapper::before {
    content: "";
    position: absolute;
    top: 10px;
    left: -10px;
    width: 100%;
    height: 100%;
    background-image: url("img/webp/bg-news.webp");
    border: 1px solid var(--black_energy);
    z-index: -2;
    background-size: cover;
    background-repeat: round;
}

.news-card-wrapper::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--Background_Energy);
    border: 1px solid var(--black_energy);
    z-index: -1;
}

.news-card-wrapper>* {
    position: relative;
    z-index: 2;
}

.news-post-title {
    display: block;
    margin-bottom: var(--space-xs);
    color: var(--Font);
}

.news-post-date {
    font-size: var(--text-micro);
    margin-bottom: var(--space-base);
    display: block;
    color: var(--gris_clair);
}

.news-post-excerpt p {
    line-height: 1.5;
    color: var(--Font);
}

.news-read-more {
    display: inline-block;
    align-self: flex-start;
    padding: var(--space-2xs) var(--space-base);
    border: 1px solid var(--Primary_Energy);
    border-radius: 20px;
    text-decoration: none;
    color: var(--Primary_Energy);
    font-size: var(--text-smaller);
    margin-top: auto;
    transition: background 0.3s ease, color 0.3s ease;
}

.news-card-wrapper:hover .news-read-more {
    background: var(--Primary_Energy);
    color: var(--Background_Energy);
}

/* styles pour custom card */
/* 1. Structure de la grille ul */
.custom-cards-grid-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* 2. Style card News */
.news-card-inner-link {
    display: flex;
    flex-direction: column;
    height: 100%;
    text-decoration: none;
    color: inherit;
}

.news-card-img {
    height: 180px;
    overflow: hidden;
}

.news-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    padding: 1px;
}

.news-card-info {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    padding: var(--space-lg);
}

.news-card-title-heading {
    line-height: 1.2;
    margin: 0 0 var(--space-sm) 0;
}

.news-card-date-meta {
    display: block;
    margin-bottom: var(--space-sm);
}

.news-card-excerpt-flex {
    flex-grow: 1;
}

.news-card-read-more-btn {
    margin-top: var(--space-base);
    font-weight: bold;
    text-transform: uppercase;
}

/* Style card Project */
.project-card-title-heading {
    margin: 0 0 var(--space-sm) 0;
}

.project-card-date-meta {
    margin-bottom: var(--space-sm);
}

/* Hubs */
.energy-hubs-section {
    padding: var(--space-5xl) var(--space-lg);
}

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

.hubs-header {
    margin-bottom: var(--space-4xl);
}

.hubs-main-title {
    font-weight: 700;
    text-transform: uppercase;
    color: var(--Font);
    margin-bottom: var(--space-lg);
}

.hubs-intro {
    font-size: var(--text-medium);
    color: var(--gris_clair);
}

.hubs-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--space-lg);
}

.hub-card {
    border: 1px solid var(--black_energy);
    padding: var(--space-2xl) var(--space-lg);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    background-color: var(--white_energy);
}

.hub-icon-circle {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--space-lg);
    align-self: flex-end;
    background-color: var(--hub-icon-bg, transparent);
}

.hub-icon-circle img {
    max-width: 60%;
    height: auto;
}

.hub-title {
    font-size: var(--text-medium);
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: var(--space-base);
    color: var(--black_energy);
}

.hub-description {
    font-size: var(--text-smaller);
    color: var(--gris_clair);
    margin-bottom: var(--space-2xl);
    flex-grow: 1;
}

.hub-link {
    height: 100%;
    display: flex;
}

.hub-btn {
    display: inline-block;
    background-color: var(--black_energy);
    color: var(--white_energy);
    padding: 3px var(--space-base) var(--space-3xs) var(--space-md);
    border-radius: 20px;
    text-decoration: none;
    font-weight: bold;
    font-size: var(--text-large);
    transition: transform 0.2s ease;
}

.projects-filters-hubs {
    margin: 0px 0px 105px 0px;
}

.hub-btn:hover {
    transform: scale(1.05);
}

/* Timeline */
.timeline {
    background-color: var(--Secondary_Energy);
    color: var(--Font);
    padding: var(--space-3xl) var(--space-lg);
}

.timeline-header {
    margin-bottom: 70px;
}

.timeline-container {
    max-width: 900px;
    margin: 0 auto;
    position: relative;
}

.ligne-centrale {
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 0;
    border-left: 2px dashed var(--Primary_Energy);
    transform: translateX(-50%);
    z-index: 1;
}

.timeline-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space-2xl);
    position: relative;
    z-index: 2;
    width: 100%;
}

.timeline-item.position-right {
    flex-direction: row-reverse;
}

.timeline-centre {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
}

.point {
    width: 14px;
    height: 14px;
    background-color: var(--Tertiary_Energy);
    border-radius: 50%;
}

.timeline-contenu,
.timeline-date {
    width: calc(50% - 40px);
}

.annee {
    font-size: 32px;
    color: var(--Font);
    font-weight: 700;
    letter-spacing: 1px;
}

.position-left .timeline-date {
    text-align: left;
}

.position-right .timeline-date {
    text-align: right;
}

.ruban-wrapper {
    position: relative;
    display: inline-block;
    max-width: 100%;
    z-index: 1;
}

.position-left .ruban-wrapper {
    float: right;
}

.position-right .ruban-wrapper {
    float: left;
}

.ruban-wrapper::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("img/webp/bg-news.webp");
    background-size: cover;
    border: 1px solid var(--black_energy, var(--Font));
    z-index: -1;
    background-size: cover;
    background-repeat: round;
}

.position-left .ruban-wrapper::before {
    top: 10px;
    left: -10px;
    clip-path: polygon(0% 0%, calc(100% - 15px) 0%, 100% 50%, calc(100% - 15px) 100%, 0% 100%);
}

.position-right .ruban-wrapper::before {
    top: 10px;
    left: 10px;
    clip-path: polygon(15px 0%, 100% 0%, 100% 100%, 15px 100%, 0% 50%);
}

.ruban-description {
    background-color: var(--Tertiary_Energy);
    padding: var(--space-base) var(--space-lg);
    display: block;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

.texte-desc {
    color: var(--Font);
    font-size: 14px;
    margin: 0;
}

.position-left .ruban-description {
    clip-path: polygon(0% 0%, calc(100% - 15px) 0%, 100% 50%, calc(100% - 15px) 100%, 0% 100%);
    padding-right: 35px;
}

.position-left .texte-desc {
    text-align: right;
}

.position-right .ruban-description {
    clip-path: polygon(15px 0%, 100% 0%, 100% 100%, 15px 100%, 0% 50%);
    padding-left: 35px;
}

.position-right .texte-desc {
    text-align: left;
}

.last-info-timeline {
    padding: var(--space-sm) 0;
    text-align: center;
    font-size: 20px;
}

/* FAQ */
#faq-section {
    padding: var(--space-lg);
    margin: 0 var(--space-base);
}

.faq-section-title {
    padding-top: var(--space-lg);
}

.faq-item {
    border-bottom: 1px solid transparent;
    margin-bottom: var(--space-lg);
}

.faq-question {
    width: 100%;
    display: flex;
    align-items: center;
    background: none;
    border: none;
    padding: var(--space-base) 0;
    cursor: pointer;
    text-align: left;
}

.faq-icon {
    position: relative;
    width: 20px;
    height: 20px;
    margin-right: var(--space-lg);
    flex-shrink: 0;
}

.faq-icon::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: currentColor;
    transform: translateY(-50%);
}

.faq-icon::after {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    width: 2px;
    height: 100%;
    background-color: currentColor;
    transform: translateX(-50%);
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.faq-item.active .faq-icon::after {
    transform: translateX(-50%) rotate(90deg);
    opacity: 0;
}

.faq-title {
    font-size: 20px;
    font-weight: bold;
    text-transform: uppercase;
    color: var(--Font);
    margin: 0;
}

.custom-accordion-title .faq-answer .faq-answer-inner {
    border: 1px solid var(--black_energy) !important;
}

.faq-answer {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.4s ease;
}

.faq-item.active .faq-answer {
    grid-template-rows: 1fr;
}

.faq-answer-inner {
    overflow: hidden;
    padding-left: var(--space-lg);
    color: var(--gris_clair);
}

.faq-answer-inner>*:first-child {
    margin-top: var(--space-sm);
}

.faq-answer-inner>*:last-child {
    margin-bottom: var(--space-lg);
}

.custom-accordion-item {
    background-color: transparent;
    margin-bottom: var(--space-lg);
    border: none;
}

.custom-accordion-item .faq-question {
    width: 100%;
    display: flex;
    align-items: center;
    padding: var(--space-lg) var(--space-2xl);
    background-color: var(--acc-bg, transparent);
    color: var(--acc-text, inherit);
    border: none;
    cursor: pointer;
    text-align: left;
    transition: filter 0.3s ease;
}

.custom-accordion-item .faq-question:hover {
    filter: brightness(0.95);
}

.custom-accordion-item .faq-question:focus-visible {
    outline: 2px dashed var(--acc-text);
    outline-offset: 2px;
}

.custom-accordion-item .faq-title {
    font-size: 1.25rem;
    font-weight: 800;
    text-transform: uppercase;
    color: inherit;
    margin: 0;
}

.custom-accordion-item .faq-icon::before,
.custom-accordion-item .faq-icon::after {
    background-color: currentColor;
}

.custom-accordion-item .faq-answer-inner {
    background-color: transparent;
    color: var(--Font, var(--Font));
    line-height: 1.6;
    border: 1px solid var(--black_energy);
    border-top: none;
}

.faq-answer-inner p {
    padding: var(--space-sm) 0px;
}

.custom-accordion-item .faq-answer-inner p {
    color: inherit;
    margin: 0 0 var(--space-base) 0;
}

.custom-accordion-item .faq-answer-inner p:last-child {
    margin-bottom: 0;
}

/* Card version 2 */
.bloc-cartes-brutalist {
    padding: var(--space-2xl) 0;
}

.title-of-section {
    margin-bottom: var(--space-4xl);
}

.cartes-grille {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-2xl);
    list-style: none;
    padding: 0;
    margin: 0 auto;
    max-width: 1200px;
}

.cartes-grille:has(.carte-item:last-child:nth-child(2)) {
    grid-template-columns: repeat(2, 1fr);
}

.carte-item {
    background-color: var(--white_energy);
    padding: var(--space-3xl) var(--space-2xl);
    display: flex;
    flex-direction: column;
    position: relative;
    box-shadow: none;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.carte-icon-wrapper {
    background-color: var(--Secondary_Energy);
    width: 65px;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--space-xl);
}

.carte-icon {
    width: 50px;
    height: 50px;
    object-fit: contain;
}

.carte-titre {
    font-size: 1.4rem;
    color: var(--Font);
    margin: 0 0 var(--space-base) 0;
    font-weight: bold;
}

.carte-texte p {
    font-size: var(--paragraph_petit);
    color: var(--gris_clair);
    line-height: 1.5;
    margin: 0 0 var(--space-lg) 0;
}

.carte-bouton {
    margin-top: auto;
}

/* Neo cards */
.neo-section {
    padding: var(--space-3xl) 0;
}

.neo-heading {
    margin-bottom: var(--space-3xl);
}

.neo-grid {
    max-width: 1200px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

.neo-card {
    display: flex;
    flex-direction: column;
}

.neo-img {
    margin: auto;
    display: flex;
    width: 170px;
    height: 153px;
}

.neo-title {
    font-weight: 400;
    text-align: center;
}

.neo-body {
    padding: var(--space-sm) var(--space-2xs);
}

.stats-impact-section {
    background-color: var(--Secondary_Energy);
    padding: var(--space-lg);
    box-shadow: 0 0 0 100vmax var(--Secondary_Energy);
    clip-path: inset(0 -100vmax);
    width: 100%;
}

.stats-impact-container {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-lg);
    width: 100%;
    max-width: 1200px;
    padding: 35px 0px;
}

.stat-item {
    background-color: var(--Background_white);
    padding: 35px var(--space-xl);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
    border: 1px solid rgba(0, 0, 0, 0.01);
    box-sizing: border-box;
}

.stat-icon-wrapper {
    background-color: var(--Secondary_Energy);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--space-xl);
}

.stat-icon {
    color: var(--Primary_Energy);
}

.stat-number {
    font-size: 4.5rem;
    font-weight: 500;
    color: var(--Font);
    line-height: 1;
    margin-bottom: var(--space-base);
}

.stat-divider {
    width: 35px;
    height: 2px;
    background-color: var(--Secondary_Energy);
    margin-bottom: var(--space-xl);
}

.stat-label {
    font-size: var(--text-micro);
    font-weight: 700;
    letter-spacing: 1.5px;
    color: var(--Primary_Energy);
    margin: 0 0 var(--space-md) 0;
    text-transform: uppercase;
}

.stat-desc {
    font-size: var(--text-smaller);
    color: var(--gris_clair);
    line-height: 1.4;
    margin: 0;
}

.action-card {
    background-color: var(--Primary_Energy);
    color: var(--white_energy);
    text-decoration: none;
    justify-content: space-between;
    position: relative;
    overflow: hidden;
    transition: background-color 0.3s ease;
    display: flex;
    flex-direction: column;
}

.action-card:hover {
    background-color: var(--Font);
}

.action-card::after {
    content: "";
    position: absolute;
    bottom: -60px;
    right: -60px;
    width: 220px;
    height: 220px;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 50%;
    box-shadow: 0 0 0 20px rgba(255, 255, 255, 0.03),
        0 0 0 40px rgba(255, 255, 255, 0.03),
        0 0 0 60px rgba(255, 255, 255, 0.03),
        0 0 0 80px rgba(255, 255, 255, 0.02);
    pointer-events: none;
}

.action-card-content {
    width: 100%;
}

.action-subtitle {
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 1.5px;
    color: var(--Tertiary_Energy);
    margin: 0 0 var(--space-base) 0;
    text-transform: uppercase;
}

.action-title {
    font-size: 2.2rem;
    font-weight: 500;
    color: var(--white_energy);
    line-height: 1.2;
    margin: 0 0 var(--space-base) 0;
    text-transform: capitalize;
}

.action-desc {
    font-size: var(--text-smaller);
    color: var(--Background_Energy);
    line-height: 1.5;
    margin: 0;
}

.action-button {
    background-color: var(--Secondary_Energy);
    color: var(--Primary_Energy);
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: var(--space-lg);
    z-index: 2;
    transition: transform 0.3s ease;
}

.action-card:hover .action-button {
    transform: scale(1.08);
}

/* Blockquote */
blockquote.wp-block-quote {
    background-color: var(--Tertiary_Energy);
    padding: var(--space-2xl) var(--space-3xl);
    position: relative;
    max-width: 750px;
    margin-top: var(--space-6xl) !important;
    margin-bottom: var(--space-6xl) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    color: var(--Font);
    z-index: 1;
}

blockquote.wp-block-quote p {
    margin: 0;
}

blockquote.wp-block-quote::before,
blockquote.wp-block-quote::after {
    position: absolute;
    display: block;
    z-index: -1;
    content: '';
    width: 95px;
    height: 85px;
    background-size: contain;
    background-repeat: no-repeat;
}

blockquote.wp-block-quote::before {
    background-image: url('img/svg/quote-blockquote.svg');
    top: -40px;
    left: -48px;
}

blockquote.wp-block-quote::after {
    background-image: url('img/svg/quote-blockquote.svg');
    bottom: -30px;
    right: -38px;
    transform: rotate(180deg);
}

.wp-block-image.aligncenter {
    margin: auto;
    text-align: center;
}

/* Custom Cards grid et horizontal */
.custom-cards-section {
    margin: var(--space-5xl) auto;
    width: 100%;
    max-width: 1200px;
}

.cards-section-header {
    margin-bottom: var(--space-2xl);
}

.cards-layout-wrapper.is-grid .grid-3-cols {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-2xl);
}

.cards-layout-wrapper.is-horizontal {
    width: 100%;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.cards-layout-wrapper.is-horizontal::-webkit-scrollbar {
    display: none;
}

.horizontal-scroll-track {
    display: flex;
    gap: var(--space-2xl);
    overflow-x: auto;
    padding: var(--space-base) var(--space-lg) var(--space-lg) var(--space-base);
}

.cards-layout-wrapper.is-horizontal .block-card-item {
    flex: 0 0 320px;
    scroll-snap-align: start;
    margin-bottom: 0;
}

/* Section Conclusion */
.section-conclusion {
    padding: var(--space-lg);
    margin: var(--space-lg) 0;
    background-color: var(--Secondary_Energy);
}

.neo-text {
    padding: var(--space-base) 0px;
}

/* page membres + archive */
.card-container {
    max-width: 1200px;
    margin: var(--space-lg) auto;
}

.card-display {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space-3xl);
    flex-wrap: wrap;
    gap: var(--space-lg);
}

.filters-group {
    display: flex;
    gap: var(--space-base);
}

.eco-select {
    padding: var(--space-sm) var(--space-base);
    border: 1px solid var(--gris_clair);
    border-radius: 5px;
    background-color: var(--white_energy);
    font-size: var(--paragraph_petit);
    cursor: pointer;
    outline: none;
}

.eco-select:focus {
    border-color: var(--Tertiary_Energy);
}

.tabs-group {
    display: flex;
    background-color: var(--Background_white);
    border-radius: 30px;
    overflow: hidden;
}

.tab-btn {
    border: none;
    background: none;
    padding: var(--space-sm) var(--space-2xl);
    font-size: var(--paragraph_petit);
    font-weight: bold;
    cursor: pointer;
    color: var(--gris_clair);
    transition: all 0.3s ease;
}

.tab-btn.active {
    background-color: var(--Tertiary_Energy);
    color: var(--Font);
}

.members-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: var(--space-2xl);
    margin-bottom: var(--space-3xl);
    padding: 0;
}

.member-card {
    border: 1px solid var(--border-grey);
    background: var(--white_energy);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
}

/* css template-maps.php */
.members-grid {
    list-style: none;
    padding: 0;
}

.member-card-link {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: inherit;
    text-decoration: none;
}

.member-card-link:hover {
    text-decoration: none;
}

.member-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

.members-map-container {
    height: 600px;
    width: 100%;
    z-index: 1;
}

.icon-membre {
    color: #ef4347 !important;
}

/* css single-member.php */
.info-country-icon {
    flex-shrink: 0;
}

.member-btn-visit {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
}

.member-btn-visit .arrow-icon {
    margin-left: var(--space-sm);
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-in {
    animation: fadeIn 0.4s ease forwards;
}

.member-img {
    width: 100%;
    height: 180px;
    background-color: var(--Background_white);
    border-bottom: 1px solid var(--border-grey);
}

.member-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.img-placeholder {
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, #f0f0f1, #e2e2e2);
}

.member-info {
    padding: var(--space-lg);
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.member-info h3 {
    margin: 0 0 var(--space-2xs) 0;
    color: var(--Font);
    font-weight: 800;
}

.member-pop {
    color: var(--Primary_Energy);
    font-weight: 700;
    margin-bottom: var(--space-sm);
    text-transform: capitalize;
}

.member-meta-bottom {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.member-country {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    color: var(--Font);
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.results-meta-container {
    margin-bottom: var(--space-xl);
    font-size: var(--text-medium);
    color: var(--Font);
}

.results-meta-container strong {
    color: var(--Tertiary_Energy);
    font-size: var(--text-large);
}

.load-more-container {
    text-align: center;
    margin-bottom: var(--space-5xl);
}

.btn-load-more {
    background-color: var(--Background_Energy);
    color: var(--black_energy);
    border: none;
    padding: var(--space-md) 35px;
    font-weight: bold;
    border-radius: 30px;
    cursor: pointer;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.btn-load-more:hover {
    background-color: var(--Tertiary_Energy);
    transform: scale(1.05);
}

.member-layout {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-lg);
    align-items: flex-start;
    margin-bottom: var(--space-5xl);
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

.member-main-content {
    flex: 0 0 calc(70% - 30px);
    min-width: 300px;
}

.member-featured-image {
    margin-bottom: var(--space-2xl);
}

.member-featured-image img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    max-height: 450px;
}

.member-title {
    margin-bottom: var(--space-lg);
}

.member-sidebar {
    flex: 0 0 30%;
    display: flex;
    flex-direction: column;
    gap: var(--space-base);
    position: sticky;
    top: 40px;
}

.info-card {
    border: 1px solid var(--black_energy);
    padding: var(--space-2xl);
    background: var(--white_energy);
}

.info-card::before {
    content: "";
    position: absolute;
    top: 10px;
    right: -10px;
    width: 100%;
    height: 100%;
    background-image: url("img/webp/bg-news.webp");
    border: 1px solid var(--black_energy);
    z-index: -2;
    background-size: cover;
    background-repeat: round;
}


.member-logo {
    border-bottom: 1px dashed var(--Background_white);
}

.member-logo img {
    max-width: 180px;
    height: auto;
    max-height: 80px;
    object-fit: contain;
}

.info-card h3 {
    margin-top: 0;
    margin-bottom: var(--space-lg);
    color: var(--texte-news);
    border-bottom: 2px solid var(--Background_white);
    padding-bottom: var(--space-sm);
}

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

.info-list li {
    display: flex;
    flex-direction: column;
    margin-bottom: var(--space-base);
    padding-bottom: var(--space-sm);
    border-bottom: 1px solid var(--Background_white);
}

.info-list li:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.info-label {
    text-transform: capitalize;
    color: var(--texte-news);
    margin-bottom: var(--space-2xs);
    font-weight: 600;
}

.info-value {
    color: var(--texte-news);
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: var(--space-xs);
}

.member-links {
    display: flex;
    align-items: end;
    justify-content: space-between;
    padding-top: var(--space-2xl);
}

.member-action-com img {
    width: 40px;
    height: auto;
}

/* Related projects dans membre*/
.related-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.related-list li {
    display: flex;
    align-items: center;
    padding: var(--space-base) 0;
    color: var(--Font);
}

.related-list li:hover {
    background-color: #f9f9f9;
    transition: background-color 0.3s ease;
    border-radius: 5px;
}

.related-project-link {
    color: var(--Font);
    text-decoration: none;
    font-weight: 700;
    transition: color 0.3s ease;
    line-height: 1.4;
}

.related-project-link:hover {
    color: var(--Primary_Energy);
    text-decoration: underline;
}

.related-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: var(--space-md);
    min-width: 24px;
}

/* Template Project */
.projects-layout {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: var(--space-2xl);
    align-items: start;
}

.projects-filters {
    position: relative;
    top: auto;
    margin: 45px 0px 105px 0px;
}

/* .news-noise-overlay */

.template-projet-sidebar {
    position: sticky !important;
    top: 40px;
}

.filters-title {
    font-size: 1.4rem;
    text-transform: uppercase;
    font-weight: 800;
    border-bottom: 2px solid var(--black_energy);
    padding-bottom: var(--space-sm);
    margin-bottom: var(--space-sm);
}

.filter-group {
    margin-bottom: var(--space-xl);
}

.filter-label {
    display: block;
    margin-bottom: var(--space-base);
    font-weight: 800;
    text-transform: uppercase;
    font-size: var(--text-medium);
}

.custom-hub-checkbox-group {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}

.hub-checkbox-inner {
    display: flex;
    align-items: center;
    gap: var(--space-base);
    padding: var(--space-md) var(--space-base);
    border: 1px solid var(--black_energy);
    background-color: var(--hub-color);
    color: var(--text-color);
    font-weight: 700;
    text-transform: uppercase;
    font-size: var(--text-small);
    transition: all 0.2s ease;
    box-shadow: 2px 2px 0px var(--black_energy);
    transform: translate(0, 0);
}

.hub-icon {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.custom-hub-checkbox input:checked+.hub-checkbox-inner {
    box-shadow: 6px 6px 0px var(--black_energy);
    transform: translate(-4px, -4px);
}

.custom-hub-checkbox:hover .hub-icon,
.custom-hub-checkbox input:checked+.hub-checkbox-inner .hub-icon {
    filter: brightness(0);
}

.custom-hub-checkbox:hover .hub-checkbox-inner::before,
.custom-hub-checkbox input:checked+.hub-checkbox-inner::before {
    width: 100%;
}

.custom-hub-checkbox:hover .hub-checkbox-inner,
.custom-hub-checkbox input:checked+.hub-checkbox-inner {
    color: var(--text-color);
}

.select-wrapper {
    position: relative;
}

.eco-select-custom {
    width: 100%;
    height: 50px;
    padding: 0 var(--space-base);
    border: 1px solid var(--black_energy);
    background: var(--white_energy);
    appearance: none;
    cursor: pointer;
    font-size: var(--paragraph_petit);
    font-weight: 600;
    border-radius: 0;
    text-transform: uppercase;
}

.eco-select-custom:focus {
    outline: none;
    border-color: var(--Primary_Energy);
    box-shadow: 4px 4px 0px var(--black_energy);
}

.select-arrow {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}

.btn-brutalist {
    background: var(--Primary_Energy);
    color: var(--white_energy);
    border: 1px solid var(--black_energy);
    border-radius: 0;
    padding: var(--space-md) var(--space-lg);
    font-weight: 800;
    text-transform: uppercase;
    text-decoration: none;
    text-align: center;
    transition: all 0.2s ease;
    cursor: pointer;
}

.results-meta-container {
    font-size: 1.3rem;
    color: var(--Font);
    margin-bottom: var(--space-lg);
    font-weight: 400;
}

.results-meta-container strong {
    color: var(--Tertiary_Energy);
    font-size: 1.5rem;
}

.grid-3-cols {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-2xl);
    transition: opacity 0.3s ease;
}

.grid-6-cols {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: var(--space-sm);
    padding: 0 var(--space-sm)
}

.project-card-wrapper {
    display: block;
}

.project-card-link-original {
    display: flex;
    flex-direction: column;
    height: 100%;
    background-color: var(--white_energy);
    border: 1px solid var(--black_energy);
    text-decoration: none;
    color: var(--Font);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    width: fit-content;
}

.project-card-link-original:hover {
    transform: translateY(-4px);
}

.relative-box {
    position: relative;
}

.project-card-img-original {
    height: 220px;
    overflow: hidden;
    border-bottom: 1px solid var(--black_energy);
}

.project-card-img-original img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.card-pin-box {
    position: absolute;
    top: 0;
    left: 0;
    background-color: var(--white_energy);
    border-right: 1px solid var(--black_energy);
    border-bottom: 1px solid var(--black_energy);
    padding: 6px;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
}

.project-card-info-original {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    padding: var(--space-xl) var(--space-lg);
}

.project-card-title-original {
    font-size: 1.4rem;
    font-weight: 800;
    margin: 0 0 var(--space-base) 0;
    line-height: 1.2;
    color: var(--black_energy);
}

.project-card-description-original p {
    font-size: var(--text-small);
    line-height: 1.5;
    color: var(--gris_clair);
    margin: 0;
}

.project-card-badge-wrapper {
    margin-top: auto;
    padding-top: var(--space-xl);
    display: flex;
    justify-content: flex-end;
}

.status-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px var(--space-md);
    font-size: var(--text-mini);
    font-weight: 700;
}

.status-completed {
    background-color: var(--Secondary_Energy);
    color: var(--black_energy);
}

.status-current {
    background-color: #55B07F;
    color: var(--black_energy);
}

.pagination-container {
    margin-top: var(--space-4xl);
}

.pagination-container ul {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--space-sm);
    padding: 0;
    list-style: none;
}

.pagination-container a,
.pagination-container .current {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: 44px;
    border: 1px solid var(--black_energy);
    color: var(--Font);
    text-decoration: none;
    font-weight: 700;
    border-radius: 0;
    background: var(--white_energy);
}

.pagination-container .current,
.pagination-container a:hover {
    background: var(--Primary_Energy);
    color: var(--white_energy);
}

.no-results-box {
    padding: var(--space-5xl) var(--space-2xl);
    text-align: center;
}

@media (max-width: 1024px) {
    .projects-layout {
        grid-template-columns: 1fr;
    }

    .projects-filters {
        position: static !important;
        margin-bottom: var(--space-3xl);
    }

    .grid-3-cols {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .grid-3-cols {
        grid-template-columns: 1fr;
    }
}

.status-badge-absolute {
    position: absolute;
    bottom: 0;
    right: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: var(--space-xs) var(--space-md);
    font-size: var(--text-mini);
    z-index: 10;
}

.status-badge-absolute.status-completed {
    background-color: var(--Secondary_Energy);
    color: var(--black_energy);
}

.project-card-hubs-wrapper {
    margin-top: auto;
    padding-top: var(--space-base);
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: var(--space-base);
}

.project-hub-logo-small {
    width: 32px !important;
    height: 32px !important;
    object-fit: contain;
}

.hub-checkbox-inner {
    display: flex;
    align-items: center;
    gap: var(--space-base);
    padding: var(--space-md) var(--space-base);
    border: 1px solid var(--black_energy);
    background-color: var(--Primary_Energy);
    color: var(--white_energy);
    font-weight: 700;
    text-transform: uppercase;
    font-size: var(--text-small);
    transition: all 0.3s ease;
    box-shadow: 2px 2px 0px var(--black_energy);
    transform: translate(0, 0);
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.hub-checkbox-inner::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 12px;
    background-color: var(--hub-color);
    z-index: -1;
    transition: width 0.3s ease-in-out;
}

.custom-hub-checkbox {
    display: block;
    cursor: pointer;
}

.custom-hub-checkbox input {
    display: none;
}

.custom-hub-checkbox.is-hub-filter:hover .hub-checkbox-inner,
.custom-hub-checkbox.is-hub-filter input:checked+.hub-checkbox-inner {
    color: var(--white_energy);
}

.custom-hub-checkbox.is-hub-filter:hover .hub-icon,
.custom-hub-checkbox.is-hub-filter input:checked+.hub-checkbox-inner .hub-icon {
    filter: brightness(1);
}

.custom-hub-checkbox {
    display: block;
    cursor: pointer;
    position: relative;
}

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

.custom-hub-checkbox input:focus-visible+.hub-checkbox-inner {
    outline: 3px solid var(--Primary_Energy);
    outline-offset: 2px;
}

.hub-checkbox-inner {
    display: flex;
    align-items: center;
    gap: var(--space-base);
    padding: var(--space-md) var(--space-base);
    border: 1px solid var(--black_energy);
    font-weight: 700;
    text-transform: uppercase;
    font-size: var(--text-small);
    transition: all 0.3s ease;
    box-shadow: 2px 2px 0px var(--black_energy);
    transform: translate(0, 0);
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.custom-hub-checkbox.is-status-filter .hub-checkbox-inner {
    background-color: var(--hub-color);
    color: var(--text-color);
}

.custom-hub-checkbox.is-hub-filter .hub-checkbox-inner {
    background-color: var(--Primary_Energy);
    color: var(--white_energy);
}

.custom-hub-checkbox.is-hub-filter .hub-checkbox-inner::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 12px;
    background-color: var(--hub-color);
    z-index: -1;
    transition: width 0.3s ease-in-out;
}

.custom-hub-checkbox.is-hub-filter:hover .hub-checkbox-inner::before,
.custom-hub-checkbox.is-hub-filter input:checked+.hub-checkbox-inner::before {
    width: 100%;
}

.custom-hub-checkbox.is-hub-filter:hover .hub-checkbox-inner,
.custom-hub-checkbox.is-hub-filter input:checked+.hub-checkbox-inner {
    color: var(--hover-text-color, var(--black_energy));
}

.hub-icon {
    width: 24px;
    height: 24px;
    object-fit: contain;
    display: block;
    transition: filter 0.3s ease;
}

.custom-hub-checkbox.is-hub-filter:hover .hub-icon,
.custom-hub-checkbox.is-hub-filter input:checked+.hub-checkbox-inner .hub-icon {
    filter: var(--hover-icon-filter, brightness(0));
}

/* single Projet */
.project-hero {
    position: relative;
    background-color: var(--Secondary_Energy);
    border-bottom: 2px solid var(--black_energy);
    z-index: 0;
}

.card-badge--hero {
    position: static !important;
    display: inline-block;
    margin-bottom: var(--space-base, 16px);
}

.event-authors-block {
    margin-top: var(--space-2xl, 48px);
}

.event-authors-title {
    margin-bottom: var(--space-lg, 24px);
}

.project-hero-inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 2;
}

.hero-content-col {
    width: 70%;
    padding: var(--space-2xl) var(--space-lg) var(--space-2xl) 0;
}

.hero-content-col.full-width-hero {
    width: 100%;
    max-width: 1000px;
    padding-right: var(--space-lg);
}

.breadcrumbs-project {
    font-size: var(--text-smaller);
    font-weight: 600;
    margin-bottom: var(--space-lg);
}

.breadcrumbs-project a {
    color: var(--Font);
    text-decoration: none;
}

.breadcrumbs-project a:hover {
    text-decoration: underline;
}

.project-hero-title {
    text-transform: capitalize;
    margin: 0 0 var(--space-base) 0;
    line-height: 1.1;
    color: var(--Font);
}

.project-subtitle-block {
    margin-bottom: var(--space-xl);
    max-width: 800px;
    border-left: 3px solid var(--black_energy);
    padding-left: var(--space-lg);
}

.project-subtitle-block p {
    font-size: 1.3rem;
    line-height: 1.5;
    color: var(--Font);
    margin: 0;
}

/* Tags dans projet*/
.project-tags-container {
    display: flex;
    flex-direction: column;
    gap: var(--space-base);
    margin-top: var(--space-lg);
}

.tags-list-vertical {
    margin: var(--space-sm) 0px;
}

.tags-row {
    display: flex;
    align-items: center;
    gap: var(--space-base);
    flex-wrap: wrap;
}

.tags-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-md);
}

.tag-brutalist {
    padding: 6px 16px;
    border: 1px solid var(--black_energy);
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    gap: var(--space-xs);
    font-weight: 800;
    margin: var(--space-sm) 0px;
}

.partner-card-inner {
    position: relative;
}

.partner-logo {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 60px;
    height: 60px;
    object-fit: contain;
}

.tag-brutalist span {
    font-size: var(--text-mini);
}

.hub-tag-icon {
    width: 30px;
    height: 30px;
    object-fit: contain;
}

.tag-yellow {
    background-color: var(--Yellow_energy);
    color: var(--Font);
}

.tag-green {
    background-color: var(--white_energy);
    color: var(--Primary_Energy);
}

/* Image hero à droite dans la page projet */
.hero-visual-col-absolute {
    position: absolute;
    top: 0;
    right: 0;
    width: 35%;
    height: 100%;
    z-index: 4;
}

.hero-image-fill {
    width: 100%;
    height: 100%;
}

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

.deco-yellow-rect {
    position: absolute;
    top: 50%;
    left: -25px;
    transform: translateY(-50%);
    width: 50px;
    height: 140px;
    background-color: var(--Yellow_energy);
    z-index: 3;
}

.deco-green-square {
    position: absolute;
    bottom: 15%;
    left: -20px;
    width: 50px;
    height: 50px;
    background-color: var(--Tertiary_Energy);
    z-index: 3;
}

.deco-dots-pattern {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 80px;
    height: 80px;
    background-image: radial-gradient(var(--Tertiary_Energy) 2px, transparent 2px);
    background-size: 15px 15px;
    z-index: 3;
    opacity: 0.8;
}

.hero-logo {
    position: relative;

}

.hero-logo-card {
    position: absolute;
    bottom: 30%;
    right: 30%;
    width: 220px;
    height: 140px;
    background: var(--white_energy);
    border: 2px solid var(--black_energy);
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-lg);
}

.hero-logo-card img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.hero-meta-container {
    margin-top: var(--space-lg);
    max-width: 90%;
}

.project-meta-horizontal {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(225px, 1fr));
    gap: var(--space-lg);
    margin-bottom: 0;
}

.project-meta-horizontal .meta-item {
    border-bottom: none;
    padding: 0;
}

.meta-item:last-child {
    margin-bottom: var(--space-lg);
}

.project-meta-horizontal .meta-label {
    margin-bottom: var(--space-xs);
}

.project-meta-horizontal .meta-icon {
    width: 22px;
    height: 22px;
}

.project-meta-horizontal .meta-value {
    display: block;
    line-height: 1.4;
}

.hero-external-link {
    margin-top: var(--space-xl);
    cursor: pointer;
    display: inline-flex;
}

.External-link a {
    color: var(--white_energy) !important;
}

.project-layout {
    display: flex;
    gap: 35px;
    align-items: stretch;
    max-width: 1200px;
    margin: 0 auto;
    padding-bottom: var(--space-6xl);
}

.project-sidebar {
    flex: 1 1 25%;
    display: flex;
    flex-direction: column;
    gap: var(--space-2xl);
}

.project-content {
    flex: 3 1 75%;
}

.brutalist-card,
.brutalist-card-projet {
    position: relative;
    padding: var(--space-lg);
    border: 1px solid var(--black_energy);
    background-color: transparent;
    z-index: 1;
    height: fit-content;
}

.brutalist-card-hubs-projet {
    margin-top: calc(var(--space-7xl) * -1);
}

.brutalist-card::before,
.brutalist-card-projet::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--white_energy);
    z-index: -1;
}


.brutalist-card::after,
.brutalist-card-projet::after {
    content: "";
    position: absolute;
    top: 10px;
    right: -10px;
    width: 100%;
    height: 100%;
    background-image: url("img/webp/bg-news.webp");
    border: 1px solid var(--black_energy);
    z-index: -2;
    background-size: cover;
    background-repeat: round;
}

.brutalist-card h3 {
    margin-top: 0;
    margin-bottom: var(--space-lg);
    color: var(--texte-news);
    padding-bottom: var(--space-sm);
}

@media (max-width: 768px) {

    .brutalist-card,
    .brutalist-card-projet {
        padding: var(--space-base);
    }

    .brutalist-card::after,
    .brutalist-card-projet::after {
        top: 6px;
        right: -6px;
    }

    .brutalist-card-hubs-projet {
        margin-top: calc(var(--space-4xl) * -1);
    }
}

.sticky-nav {
    position: -webkit-sticky;
    position: sticky;
    top: 30px;
    z-index: 10;
    margin-bottom: var(--space-lg);
}

.mt-30 {
    margin-top: 0;
}

.sidebar-title {
    margin: 0 0 var(--space-lg) 0;
    font-size: var(--text-large);
    font-weight: 800;
    padding-bottom: var(--space-sm);
    text-transform: uppercase;
}

.sub-projects-menu {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.sub-projects-menu a {
    display: flex;
    align-items: center;
    padding: var(--space-md) var(--space-base);
    color: var(--Font);
    font-weight: 600;
    text-decoration: none;
    font-size: var(--paragraph_petit);
    border-radius: 8px;
    background: transparent;
    transition: all 0.2s ease;
}

.sub-projects-menu a:hover {
    background: var(--Background_Energy);
}

.sub-projects-menu li.menu-item-active a {
    background: var(--Background_white);
    color: var(--Primary_Energy);
    font-weight: 700;
}

.sub-projects-menu .nav-icon {
    display: flex;
    align-items: center;
    margin-right: var(--space-base);
    color: var(--gris_clair);
}

.sub-projects-menu li.menu-item-active .nav-icon {
    color: var(--Primary_Energy);
}

.sub-projects-menu .nav-arrow-right {
    margin-left: auto;
    font-size: 1.5rem;
    color: var(--gris_clair);
    line-height: 1;
}

.project-logo {
    text-align: center;
    border-bottom: 2px solid var(--black_energy);
    padding-bottom: var(--space-lg);
    margin-bottom: var(--space-lg);
}

.project-logo img {
    max-width: 100%;
    max-height: 120px;
    object-fit: contain;
}

.project-meta {
    margin-bottom: var(--space-xl);
}

.meta-label {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    text-transform: uppercase;
    font-weight: 700;
    color: var(--black_energy);
    margin-bottom: var(--space-2xs);
}

.meta-icon {
    flex-shrink: 0;
    color: var(--gris_clair);
    opacity: 0.8;
}

.meta-value {
    color: var(--Font);
    text-transform: capitalize;
}

.meta-value a,
.meta-link {
    color: var(--link-color);
    text-decoration: none;
}

.meta-value a:hover,
.meta-link:hover {
    text-decoration: underline;
}

.btn-brutalist {
    display: inline-block;
    background: var(--Primary_Energy);
    color: var(--white_energy);
    border: 1px solid var(--black_energy);
    padding: var(--space-md) var(--space-lg);
    font-weight: 800;
    text-transform: uppercase;
    text-decoration: none;
    text-align: center;
    transition: all 0.2s ease;
}

.btn-brutalist:hover {
    background: var(--Tertiary_Energy);
    color: var(--black_energy);
    box-shadow: 4px 4px 0px var(--black_energy);
    transform: translate(-2px, -2px);
}

.btn-full {
    width: 100%;
    box-sizing: border-box;
}

.project-featured-image {
    border: 1px solid var(--black_energy);
    margin-bottom: var(--space-3xl);
    box-shadow: 6px 6px 0px var(--black_energy);
}

.project-featured-image img {
    width: 100%;
    height: auto;
    display: block;
}

.project-body {
    line-height: 1.7;
    color: var(--Font);
}

.wp-block-image .wp-block-button__link .wp-block-paragraph {
    margin: var(--space-sm) 0px;
}

/* Partenaires projet */
.project-partners {
    margin-top: var(--space-lg);
}

.funding-section {
    margin-top: var(--space-4xl);
}

.partners-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--space-2xl);
    margin-top: var(--space-2xl);
}

.brutalist-partner-card {
    position: relative;
    z-index: 1;
    display: block;
}

.brutalist-partner-card::before {
    content: "";
    position: absolute;
    top: 10px;
    right: -10px;
    width: 100%;
    height: 100%;
    background-image: url("img/webp/bg-news.webp");
    border: 1px solid var(--black_energy);
    z-index: -2;
    background-size: cover;
    background-repeat: round;
}

.brutalist-partner-card::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-color: var(--white_energy);
    border: 1px solid var(--black_energy);
    z-index: -1;
}

.partner-card-inner {
    position: relative;
    z-index: 2;
    padding: var(--space-2xl) var(--space-lg);
    background: transparent;
    border: none;
    color: var(--Font);
}

.partner-status {
    font-size: 0.75rem;
    text-transform: uppercase;
    color: var(--Primary_Energy);
    font-weight: 800;
    margin-bottom: var(--space-sm);
    letter-spacing: 0.5px;
}

.partner-name {
    margin: 0;
    line-height: 1.3;
    font-weight: 800;
}

.partner-name a {
    color: var(--Font);
    text-decoration: none;
}

.partner-name a:hover {
    text-decoration: underline;
    color: var(--Primary_Energy);
}

.partner-badge {
    margin-top: var(--space-base);
    font-size: var(--text-micro);
    font-weight: 800;
    background: var(--Tertiary_Energy);
    display: inline-block;
    padding: var(--space-3xs) var(--space-sm);
    border: 1px solid var(--black_energy);
}

/* Related projects (sidebar) projet */
.related-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.related-links li {
    margin-bottom: var(--space-base);
}

.related-links a {
    color: var(--Font);
    font-weight: 700;
    text-decoration: none;
    display: flex;
    gap: var(--space-sm);
    line-height: 1.3;
}

.related-links a:hover {
    color: var(--Primary_Energy);
    text-decoration: underline;
}

.related-links .arrow {
    color: var(--Tertiary_Energy);
}

/* composants Wordpress (Boutons, Formulaire, Leaflet */
.wp-block-button__link {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

.wp-block-buttons>.wp-block-button.has-custom-width .wp-block-button__link {
    margin: var(--space-base) 0px;
}

.wp-block-paragraph {
    margin: var(--space-2xs) 0px;
}

.wp-block-buttons .wp-block-button__link {
    margin: var(--space-sm) 0px;
}

.wp-block-columns.nombre-grid {
    display: flex !important;
    align-items: stretch !important;
}

.nombre-grid .wp-block-column {
    display: flex !important;
    flex-direction: column !important;
}

.nombre-grid .wp-block-column .wp-block-buttons {
    margin-top: auto !important;
    width: 100%;
}

.wp-block-button__link::before {
    content: '';
    order: 2;
    width: 35px;
    height: 2px;
    background-color: currentColor;
    border-radius: 3px;
    margin-left: var(--space-base);
    transition: transform 0.3s ease;
}

.wp-block-button__link::after {
    content: '';
    order: 3;
    width: 10px;
    height: 10px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    border-radius: 1px;
    transform: rotate(45deg);
    margin-left: calc(var(--space-md) * -1);
    transition: transform 0.3s ease;
}

.wp-block-button__link:hover::before {
    transform: translateX(5px);
}

.wp-block-button__link:hover::after {
    transform: translateX(5px) rotate(45deg);
}

.wp-block-column {
    padding: var(--space-lg) 0px;
}

/* Formulaire Gravity Forms */
.gform_footer {
    display: flex !important;
    justify-content: center !important;
}

.gform_button {
    background-color: var(--Primary_Energy) !important;
    color: var(--white_energy) !important;
    padding: var(--space-sm) var(--space-lg) !important;
    border-radius: 25px !important;
}

.gform_button:hover {
    opacity: 0.8 !important;
    transition: opacity 0.3s ease;
}

/* Leaflet Cluster */
.leaflet-cluster-anim .leaflet-marker-icon,
.leaflet-cluster-anim .leaflet-marker-shadow {
    -webkit-transition: transform .3s ease-out, opacity .3s ease-in;
    transition: transform .3s ease-out, opacity .3s ease-in;
}

.leaflet-cluster-spider-leg {
    -webkit-transition: -webkit-stroke-dashoffset .3s ease-out, -webkit-stroke-opacity .3s ease-in;
    transition: stroke-dashoffset .3s ease-out, stroke-opacity .3s ease-in;
}

.marker-cluster {
    background-clip: padding-box;
    border-radius: 20px;
    background-color: rgba(121, 184, 163, 0.5);
}

.marker-cluster div {
    width: 30px;
    height: 30px;
    margin-left: var(--space-2xs);
    margin-top: var(--space-2xs);
    text-align: center;
    border-radius: 15px;
    background-color: var(--Tertiary_Energy);
    color: var(--white_energy);
    font-size: 13px;
    font-weight: bold;
    font-family: inherit;
}

.marker-cluster span {
    line-height: 30px;
}

h2 {
    --dynamic-highlight: var(--Secondary_Energy, var(--Secondary_Energy));
}

.has-yellowish-bg h2 {
    --dynamic-highlight: var(--Tertiary_Energy, #91deb5) !important;
}

h2.wp-block-heading,
h2.title-of-section,
h2.hubs-main-title,
h2.neo-heading,
h2.faq-section-title {
    background-image: linear-gradient(transparent 55%, var(--dynamic-highlight) 55%);
    display: inline;
    padding: 0 var(--space-2xs);
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    margin-bottom: var(--space-lg);
}

:is(h2.wp-block-heading, h2.title-of-section, h2.hubs-main-title, h2.neo-heading, h2.faq-section-title)+* {
    margin: var(--space-base) 0;
    line-height: 1.4;
}

:is(.wp-block-heading, .title-of-section, .hubs-main-title, .neo-heading, .faq-section-title)+p {
    margin-bottom: var(--space-2xs);
}

:is(.wp-block-heading, .title-of-section, .hubs-main-title, .neo-heading, .faq-section-title)~.wp-block-list {
    margin-top: var(--space-2xs);
    margin-bottom: var(--space-2xs);
}

.widget-footer.widget_block h2.wp-block-heading {
    background-image: none;
    display: block;
    padding: 0;
}

/* staff card desgin */
.member-staff-section {
    margin-top: var(--space-lg);
    padding-top: var(--space-sm);
}

.staff-grid-horizontal {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: var(--space-xl);
    margin-top: var(--space-2xl);
}

.staff-grid-horizontal-projet {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: var(--space-xl);
    margin-top: var(--space-2xl);
}

.staff-card-horizontal {
    background-color: var(--Background_Energy);
    display: flex;
    flex-direction: row;
    align-items: stretch;
    text-decoration: none !important;
    color: inherit !important;
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    min-height: 150px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
    height: 100%;
}

.staff-card-horizontal:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
}

.staff-job-h {
    font-weight: 300;
    font-size: var(--text-smaller);
}

.staff-card-content-h {
    flex: 0 0 55%;
    width: 55%;
    padding: var(--space-lg) var(--space-base);
    display: flex;
    flex-direction: column;
    z-index: 2;
    box-sizing: border-box;
    justify-content: flex-start;
    align-items: flex-start;
}

.staff-name-h {
    margin: 0 0 6px;
    color: var(--black_energy, #2b3336);
}

.staff-card-image-h {
    flex: 0 0 45%;
    width: 45%;
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    box-sizing: border-box;
}

.staff-img-h {
    width: 100%;
    height: 200px;
    object-fit: cover;
    object-position: top;
    display: block;
}

.staff-img-placeholder-h {
    width: 100%;
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.staff-board-function-h {
    font-weight: 300;
}

@media (max-width: 1100px) {
    .staff-grid-horizontal {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 650px) {
    .staff-grid-horizontal {
        grid-template-columns: 1fr;
    }
}

.staff-pills-list-h-custom {
    display: flex;
    gap: var(--space-sm);
    flex-wrap: wrap;
    margin: var(--space-sm) 0;
}

.staff-pill-custom-card {
    background-color: var(--green-soft-bg);
    color: var(--Primary_Energy);
    padding: 6px var(--space-md);
    font-size: var(--text-smaller);
    display: inline-block;
}

/* Single Staffs */
.single-staff-page {
    max-width: 1200px;
    margin: var(--space-3xl) auto var(--space-6xl);
    padding: 0 var(--space-lg);
}

.staff-profile-wrapper {
    display: grid;
    grid-template-columns: 400px 1fr;
    overflow: hidden;
}

.staff-sidebar {
    padding: var(--space-lg);
    border-right: 1px solid var(--border-grey);
    background: #fafafa;
}

.staff-photo {
    width: 100%;
    overflow: hidden;
    margin-bottom: var(--space-xl);
    aspect-ratio: 3 / 4;
}

.staff-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.staff-photo-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.staff-identity {
    margin-bottom: var(--space-2xl);
}

.staff-main-name {
    margin: 0 0 var(--space-2xs);
    color: var(--black_energy, var(--Font));
}

.staff-main-job {
    color: var(--Primary_Energy);
    margin: 0;
}

.staff-contact-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-base);
}

.staff-contact-link {
    display: inline-flex;
    align-items: center;
    gap: var(--space-xs);
    color: var(--black_energy, var(--gris-fonce));
    text-decoration: none;
    transition: color 0.2s;
    word-break: break-all;
}

.staff-contact-link svg {
    color: var(--Tertiary_Energy, var(--green-dark));
    flex-shrink: 0;
}

.staff-contact-link:hover {
    color: var(--Primary_Energy, var(--link-hover));
}

.staff-sidebar-block:nth-child(n+2) {
    margin-top: var(--space-lg);
    padding-top: var(--space-xl);
    border-top: 1px solid var(--border-grey);
}

.staff-sidebar-title {
    margin: 0 0 var(--space-base);
    font-size: var(--text-medium);
    color: var(--black_energy, var(--Font));
}

.staff-projects-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--space-lg);
    margin-top: var(--space-base);
}

/* Colone Droite */
.staff-details {
    padding: var(--space-3xl);
}

.staff-detail-section {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
    padding-bottom: var(--space-2xl);
    margin-bottom: var(--space-2xl);
    border-bottom: 1px solid var(--border-grey);
}

.staff-detail-section:last-child {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

.staff-section-icon {
    width: 48px;
    height: 48px;
    background-color: var(--green-soft-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--Tertiary_Energy, var(--green-dark));
    flex-shrink: 0;
}

.staff-section-content {
    flex-grow: 1;
}

.staff-section-content h2 {
    margin: 0 0 var(--space-base);
    color: var(--black_energy, var(--Font));
}

.staff-text-body {
    line-height: 1.6;
    color: #444;
}

.staff-text-body p {
    margin: 0 0 var(--space-base);
}

.staff-text-body p:last-child {
    margin-bottom: 0;
}

.staff-text-body ul {
    margin: var(--space-sm) 0 0 var(--space-lg);
    padding: 0;
}

.staff-text-body li {
    margin-bottom: var(--space-xs);
}

.staff-pills-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
}

.staff-pill {
    background-color: var(--green-soft-bg);
    color: var(--Primary_Energy);
    padding: 6px 16px;
    display: inline-block;
}

@media (max-width: 992px) {
    .staff-profile-wrapper {
        grid-template-columns: 1fr;
    }

    .staff-sidebar {
        border-right: none;
        border-bottom: 1px solid var(--border-grey);
        padding: var(--space-2xl) var(--space-lg);
        text-align: center;
    }

    .staff-photo {
        max-width: 300px;
        margin: 0 auto var(--space-lg);
    }

    .staff-contact-link,
    .staff-project-link {
        justify-content: center;
    }

    .staff-pills-list {
        justify-content: center;
    }

    .staff-details {
        padding: var(--space-2xl) var(--space-lg);
    }

    .staff-detail-section {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-base);
    }
}

.active-topic-header {
    width: 100%;
    margin-bottom: var(--space-2xl);
}

.remove-active-topic {
    display: inline-flex;
    align-items: center;
    gap: var(--space-md);
    padding-bottom: var(--space-2xs);
    border-bottom: 3px solid var(--Primary_Energy);
    cursor: pointer;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.remove-active-topic:hover {
    opacity: 0.7;
}

.remove-topic-x {
    font-size: var(--h3) !important;
    display: inline-block;
}

.pointer {
    cursor: pointer;
}

/* slider */
/* slider */
.custom-slider-block {
    max-width: 1000px;
    margin: var(--space-3xl) auto !important;
    padding: 0 var(--space-5xl);
    box-sizing: border-box;
}

.eco-slider-container {
    position: relative;
    width: 100%;
}

.eco-slider-track {
    overflow: hidden;
    width: 100%;
}

.eco-slider-list {
    display: flex;
    padding: 0;
    margin: 0;
    list-style: none;
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
    will-change: transform;
}

.eco-slide {
    flex: 0 0 100%;
    width: 100%;
    box-sizing: border-box;
}

.slide-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.slide-image {
    width: 100%;
    height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--space-lg);
}

.eco-slide-img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}

.slide-text {
    font-size: var(--text-medium);
    line-height: 1.5;
    color: var(--black_energy, var(--Font));
    max-width: 800px;
    margin: 0 auto;
}

.eco-slider-btn {
    position: absolute;
    top: 200px;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    color: var(--Primary_Energy, var(--link-hover));
    cursor: pointer;
    padding: var(--space-sm);
    z-index: 10;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.eco-slider-btn:hover {
    transform: translateY(-50%) scale(1.1);
}

.eco-slider-btn:focus-visible {
    outline: 2px dashed var(--Primary_Energy, var(--link-hover));
    outline-offset: 2px;
}

.eco-slider-btn:disabled {
    opacity: 0.2;
    cursor: not-allowed;
}

.eco-prev {
    left: -60px;
}

.eco-next {
    right: -60px;
}

@media (max-width: 768px) {
    .custom-slider-block {
        padding: 0 var(--space-xl);
    }

    .slide-image {
        height: 250px;
    }

    .eco-slider-btn {
        top: 125px;
    }

    .eco-prev {
        left: -40px;
    }

    .eco-next {
        right: -40px;
    }
}

/* ============================================================
LASSES ISSUES DE LA MIGRATION DU CSS INLINE (ex style="")
=========================================================== */
/* Resets de listes / figures (ex inline list-style/padding/margin) */
.grid-3-cols {
    list-style: none;
    margin: 0;
    padding: 0;
}

.neo-grid {
    list-style: none;
    margin: 0;
    padding: 0;
}

.timeline-container {
    list-style: none;
    padding: 0;
}

/* margin: 0 auto conserve par la base */
.tags-list-vertical {
    list-style: none;
    margin: 0;
    padding: 0;
}

.valeurs-grille {
    list-style: none;
    margin: 0;
    padding: 0;
}

.slide-content {
    margin: 0;
}

.filter-label {
    padding: 0;
}

.social-sprite-container {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-base);
    list-style: none;
    margin: 0;
    padding: 0;
}

.social-sprite-container li {
    margin: 0;
    padding: 0;
}

.social-sprite-container a {
    display: inline-block;
}

/* Petites utilitaires (espacements via variables) */
.d-block {
    display: block;
}

.w-full {
    width: 100%;
}

.u-mt-auto {
    margin-top: auto;
}

.u-mt-3xl {
    margin-top: var(--space-3xl);
}

.u-mt-4xl {
    margin-top: var(--space-4xl);
}

.u-mb-base {
    margin-bottom: var(--space-base);
}

.is-hidden {
    display: none;
}

/* archive.php */
.page-header {
    margin-bottom: var(--space-4xl);
}

.archive-description {
    margin-top: var(--space-base);
    font-size: var(--text-medium);
}

.custom-cards-section--flush {
    margin: 0;
    padding: 0;
}

.news-card-img--bordered {
    margin-bottom: var(--space-lg);
    border: 1px solid var(--black_energy);
}

.pagination-wrapper {
    margin-top: var(--space-4xl);
    text-align: center;
}

.arrow-prev {
    transform: rotate(180deg);
}

/* single.php */
.entry-header {
    margin-bottom: var(--space-3xl);
    max-width: 900px;
}

.entry-title {
    margin-bottom: var(--space-lg);
    font-weight: 800;
}

.entry-meta {
    color: var(--gris_clair);
    font-size: var(--paragraph_petit);
    margin-bottom: var(--space-2xl);
}

.entry-meta .meta-separator {
    margin: var(--space-sm);
}

.entry-meta .meta-author {
    color: var(--Font);
}

.entry-thumbnail {
    margin-bottom: var(--space-3xl);
}

.entry-thumbnail-img {
    width: 100%;
    height: auto;
    max-height: 500px;
    object-fit: cover;
    border: 1px solid var(--black_energy);
    box-shadow: 6px 6px 0 var(--black_energy);
}

/* 404.php */
.error-404-content {
    text-align: center;
    padding: var(--space-7xl) var(--space-lg);
}

.error-404-code {
    font-size: 6rem;
    color: var(--Primary_Energy);
    margin-bottom: var(--space-lg);
    font-weight: 800;
}

.error-404-title {
    margin-bottom: var(--space-lg);
}

.error-404-text {
    margin-bottom: var(--space-3xl);
}

.error-404-search {
    max-width: 500px;
    margin: 0 auto var(--space-4xl) auto;
}

/* Sidebar filtres projet */
.filter-group--status {
    border: none;
    padding: 0;
    margin: 0 0 var(--space-xl) 0;
}

.filter-group--hubs {
    border: none;
    padding: 0;
    margin: var(--space-lg) 0 0 0;
}

.filter-group--topic {
    margin-top: var(--space-lg);
}

.filter-label--topic {
    font-weight: 700;
    margin-bottom: var(--space-sm);
}

.eco-select-custom--topic {
    padding: var(--space-sm);
}

.clear-filters-btn {
    display: none;
    margin-top: var(--space-2xl);
}

.hub-status-green {
    --hub-color: #55B07F;
    --text-color: var(--black_energy);
}

.hub-status-yellow {
    --hub-color: var(--Secondary_Energy);
    --text-color: var(--black_energy);
}

/* Home / News */
.news-card-subtitle {
    font-weight: 300;
    font-size: var(--text-mini);
    margin-bottom: var(--space-sm);
}

/* single-sub_project.php */
.title-of-section--bold {
    margin-bottom: var(--space-2xl);
    font-weight: 800;
}

/* single-staff.php */
.board-main-job {
    font-weight: 600;
    margin-top: var(--space-2xs);
}

.staff-location {
    color: var(--grey-medium);
    font-size: 14px;
    margin-top: var(--space-2xs);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

/* Blocs divers */
.icon-grey {
    color: rgb(74, 85, 101);
}

.slider-empty-placeholder {
    padding: var(--space-lg);
    border: 2px dashed #ccc;
    text-align: center;
}

.topbar-widget-box {
    background: #f0f0f1;
    padding: var(--space-base);
    border-radius: 4px;
}

/* Media queries globales */
@media screen and (max-width: 1024px) {

    .main-content,
    .layout-2-cols,
    .header-container,
    .cartes-grille,
    .news-container,
    .valeurs-container,
    .timeline-content,
    .hero-description {
        padding: var(--space-lg) var(--space-sm);
    }
}

/* ---------- Single event map ---------- */
.hero-visual-col-absolute.has-event-map {
    overflow: hidden;
}

.event-single-map {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    min-height: 480px;
    z-index: 2;
    background: #e8e8e8;
}

/* Placeholder éco-conception : aucune requête réseau tant que le bouton n'est pas cliqué */
.event-single-map--lazy {
    background:
        repeating-linear-gradient(45deg, rgba(0, 0, 0, 0.04) 0 12px, transparent 12px 24px),
        #dfe6d8;
}

.event-map-loader {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-sm);
    padding: var(--space-lg);
    border: none;
    background: transparent;
    color: var(--black_energy);
    cursor: pointer;
    font: inherit;
    text-align: center;
    transition: background-color 0.2s ease;
}

.event-map-loader:hover,
.event-map-loader:focus-visible {
    background-color: rgba(255, 255, 255, 0.35);
    outline: none;
}

.event-map-loader__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: var(--white_energy);
    border: 2px solid var(--black_energy);
}

.event-map-loader__label {
    display: flex;
    flex-direction: column;
    gap: var(--space-3xs);
}

.event-map-loader__label strong {
    font-size: var(--paragraph_petit);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.event-map-loader__label small {
    font-size: var(--text-micro);
    opacity: 0.75;
}

.event-single-map.is-loading .event-map-loader {
    opacity: 0.5;
    cursor: progress;
}

@media (max-width: 992px) {
    .event-single-map {
        min-height: 350px;
    }

    .staff-grid-horizontal-projet {
        grid-template-columns: repeat(1, minmax(300px, 1fr));
    }
}

/* ---------- Single news template ---------- */
.news-single .news-author-block {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.news-sidebar {
    flex: 1 1 35%;
    display: flex;
    flex-direction: column;
    gap: var(--space-2xl);
}

.news-sidebar-heading {
    position: sticky;
    top: 10px;
}

.news-filters {
    position: relative;
    top: auto;
    margin: 0 0 var(--space-base) 0;
}

.news-single .news-sidebar-heading {
    font-weight: 600;
    letter-spacing: 0.05em;
    color: var(--black_energy);
    margin: 0;
}

.news-toc-card {
    padding: var(--space-lg);
    background-color: var(--Background_Energy);
}

.news-toc-list {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
}

.news-toc-list::before {
    content: "";
    position: absolute;
    left: 7px;
    top: 8px;
    bottom: 8px;
    width: 1px;
    background-color: var(--black_energy);
}

.news-toc-item {
    position: relative;
    padding-left: 28px;
    padding-bottom: var(--space-md);
}

.news-toc-item:last-child {
    padding-bottom: 0;
}

.news-toc-marker {
    position: absolute;
    left: 0;
    top: 6px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 1.5px solid var(--black_energy);
    background-color: transparent;
    z-index: 1;
}

.news-toc-item.is-active>.news-toc-marker {
    background-color: var(--black_energy);
}

.news-toc-link {
    color: var(--black_energy);
    text-decoration: none;
    font-size: var(--text-small);
    line-height: 1.35;
    display: inline-block;
}

.news-toc-item.is-active>.news-toc-link {
    font-weight: 600;
}

.news-toc-link:hover,
.news-toc-link:focus {
    text-decoration: underline;
}

.staff-grid-horizontal-news {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: var(--space-2xl);
}

.news-related-projects-block {
    padding: var(--space-lg);
    background-color: var(--white_energy);
}

.news-related-projects-block .related-projects-title {
    font-size: var(--text-large);
    font-weight: 800;
    margin: 0 0 var(--space-base) 0;
    color: var(--black_energy);
    background-image: linear-gradient(transparent 55%, var(--Tertiary_Energy) 55%);
    display: inline-block;
    padding: 0 var(--space-3xs);
}

.related-projects-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.related-project-item {
    position: relative;
    padding-left: var(--space-lg);
    margin-bottom: var(--space-xs);
    font-size: 1.15rem;
    font-weight: 700;
}

.related-project-item:last-child {
    margin-bottom: 0;
}

.related-project-item::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--Tertiary_Energy);
}

.related-project-link {
    color: var(--black_energy);
    text-decoration: none;
    transition: text-decoration 0.2s ease;
}

.related-project-link:hover,
.related-project-link:focus {
    text-decoration: underline;
    color: var(--Primary_Energy);
}

.news-toc-list::before {
    content: "";
    position: absolute;
    left: 6.5px;
    top: 8px;
    bottom: 8px;
    width: 2px;
    background-color: rgba(0, 0, 0, 0.15);
    z-index: 0;
}

.news-toc-progress {
    position: absolute;
    left: 6.5px;
    top: 8px;
    width: 2px;
    background-color: var(--black_energy);
    z-index: 1;
    transition: height 0.3s ease;
    height: 0;
}

.news-toc-item.is-active>.news-toc-marker,
.news-toc-item.is-passed>.news-toc-marker {
    background-color: var(--black_energy);
    transition: background-color 0.3s ease;
}

.project-body h2[id] {
    scroll-margin-top: 80px;
}

@media (max-width: 900px) {
    .news-single .project-layout {
        flex-direction: column;
    }

    .cartes-grille,
    .cartes-grille:has(.carte-item:last-child:nth-child(5)) {
        grid-template-columns: repeat(2, 1fr);
    }

    .cartes-grille:has(.carte-item:last-child:nth-child(5)) .carte-item {
        grid-column: span 1 !important;
    }

    .cards-layout-wrapper.is-grid .grid-3-cols {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .stats-impact-container {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-base);
    }
}

@media (max-width: 992px) {
    .topbar-container {
        gap: var(--space-base);
    }

    .topbar-search input {
        width: 180px;
    }

    .card-container {
        margin: var(--space-lg);
    }

    h2.footer-title {
        width: 100%;
    }

    .news-container,
    .news-section.layout-right .news-container {
        flex-direction: column;
    }

    .news-cards-wrapper {
        flex-direction: column;
        align-items: center;
    }

    .news-card {
        width: 100%;
        max-width: 300px;
    }

    .wp-block-latest-posts__list.wp-block-latest-posts {
        flex-direction: column;
        align-items: center;
    }

    .wp-block-latest-posts__list.wp-block-latest-posts li {
        width: 100%;
        max-width: 300px;
    }

    .project-hero {
        flex-direction: column;
        min-height: auto;
    }

    .project-hero-inner {
        order: 2;
        padding: var(--space-lg);
    }

    .hero-content-col {
        width: 100%;
        padding: var(--space-3xl) 0;
    }

    .hero-visual-col-absolute {
        position: relative;
        width: 100%;
        height: 350px;
        order: 1;
    }

    .deco-yellow-rect {
        top: auto;
        bottom: 0px;
        left: 20px;
        transform: none;
        width: 80px;
        height: 40px;
    }

    .deco-green-square {
        bottom: 20px;
        left: auto;
        right: 20px;
    }

    .project-layout {
        flex-direction: column;
        gap: var(--space-2xl);
    }

    .project-sidebar,
    .project-content {
        flex: 1 1 100%;
        width: 100%;
    }

    .sticky-nav {
        position: static;
    }

    .tags-row {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-sm);
    }

    .project-meta-horizontal {
        grid-template-columns: 1fr;
        gap: var(--space-2xl);
    }

    .hero-logo-card {
        bottom: 0px;
        right: auto;
        right: 20px;
        margin-right: 0;
        width: 180px;
        height: 110px;
    }

    .member-layout {
        flex-direction: column;
    }

    .member-sidebar {
        position: static;
        width: 100%;
    }
}

@media screen and (max-width: 768px) {
    h1 {
        font-size: var(--h1_tablet);
    }

    h2 {
        font-size: var(--h2_tablet);
        font-weight: 700;
    }

    h3 {
        font-size: var(--h3_tablet);
    }

    h4 {
        font-size: var(--h4_tablet);
    }

    h5 {
        font-size: var(--h5_tablet);
    }

    h6 {
        font-size: var(--h6_tablet);
    }

    .scroll-to-top {
        bottom: 20px;
        right: 20px;
        width: 40px;
        height: 40px;
    }

    blockquote.wp-block-quote {
        margin: var(--space-5xl) var(--space-lg);
        padding: var(--space-lg);
    }

    blockquote.wp-block-quote::before,
    blockquote.wp-block-quote::after {
        width: 50px;
        height: 45px;
    }

    blockquote.wp-block-quote::before {
        left: -15px;
        top: -20px;
    }

    blockquote.wp-block-quote::after {
        right: -15px;
        bottom: -20px;
    }

    .layout-3-cols,
    .layout-2-cols {
        grid-template-columns: 1fr;
    }

    .ligne-centrale {
        left: 40px;
    }

    .timeline-item,
    .timeline-item.position-right {
        flex-direction: column;
        align-items: flex-start;
        padding-left: var(--space-6xl);
    }

    .timeline-centre {
        left: 40px;
        top: 5px;
    }

    .timeline-contenu,
    .timeline-date {
        width: 100%;
    }

    .timeline-date {
        order: 1;
        margin-bottom: var(--space-sm);
    }

    .timeline-contenu {
        order: 2;
    }

    .position-left .timeline-date,
    .position-right .timeline-date {
        text-align: left;
    }

    .position-left .ruban-description,
    .position-right .ruban-description {
        float: left;
        clip-path: polygon(15px 0%, 100% 0%, 100% 100%, 15px 100%, 0% 50%);
        padding-left: 35px;
        padding-right: var(--space-lg);
    }

    .position-left .texte-desc,
    .position-right .texte-desc {
        text-align: left;
    }

    .cartes-grille,
    .cartes-grille:has(.carte-item:last-child:nth-child(2)),
    .cartes-grille:has(.carte-item:last-child:nth-child(5)) {
        grid-template-columns: 1fr;
        gap: var(--space-3xl);
    }

    .carte-item {
        min-height: 200px;
    }

    .card-display {
        flex-direction: column;
        align-items: stretch;
    }

    .filters-group {
        flex-direction: column;
    }

    .tabs-group {
        justify-content: center;
        width: 180px;
    }

    .member-layout {
        flex-direction: column;
    }

    .member-sidebar {
        width: 100%;
    }

    .stats-impact-container {
        grid-template-columns: 1fr;
    }

    .stats-impact-section {
        padding: var(--space-lg) var(--space-base);
    }
}

@media screen and (max-width: 640px) {
    .cards-layout-wrapper.is-grid .grid-3-cols {
        grid-template-columns: 1fr;
    }

    .cards-layout-wrapper.is-horizontal .block-card-item {
        flex: 0 0 280px;
    }
}

@media screen and (max-width: 480px) {
    h1 {
        font-size: var(--h1_Mobile);
    }

    h2 {
        font-size: var(--h2_Mobile);
    }

    h3 {
        font-size: var(--h3_Mobile);
    }

    h4 {
        font-size: var(--h4_Mobile);
    }

    h5 {
        font-size: var(--h5_Mobile);
    }

    h6 {
        font-size: var(--h6_Mobile);
    }

    p {
        font-size: var(--paragraph_Mobile);
    }
}

@media (max-width: 900px) {
    .valeurs-grille {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-3xl);
    }
}

@media (max-width: 600px) {
    .valeurs-grille {
        grid-template-columns: 1fr;
    }

    .numero-contour {
        font-size: 120px;
    }
}

.numero-contour {
    font-weight: 900;
    color: transparent;
    -webkit-text-stroke: 3px var(--Secondary_Energy);
    margin-bottom: 0;
}

/* On cible les Groupes ET les Colonnes qui ont un fond de couleur */
body:not(.wp-admin):not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.has-background,
body:not(.wp-admin):not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-columns.has-background {
    box-shadow: 0 0 0 100vmax var(--ombre-dynamique, transparent) !important;
    clip-path: inset(0 -100vmax) !important;
    overflow: visible !important;
    border: none !important;
}

/* SECTION FEATURED CONTENT  */

.hub-featured-section {
    background-color: var(--Secondary_Energy);
    box-shadow: 0 0 0 100vmax var(--Secondary_Energy);
    clip-path: inset(0 -100vmax);
    padding: var(--space-5xl) 0;
    width: 100%;
}

.hub-featured-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-base) 0;
}

.featured-title {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    margin-bottom: var(--space-4xl);
}

.featured-title .icon-pin {
    color: var(--Primary_Energy);
    transform: rotate(45deg);
}

/* card home news */
.news-cards-wrapper {
    display: flex;
    gap: var(--space-lg);
}

.card-content-wrap-home {
    padding: var(--space-4xl) var(--space-lg) var(--space-lg);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 100%;
    position: relative;
    z-index: 3;
    width: 250px;
    min-height: 350px;
}

.card-featured-home {
    position: relative;
}

.card-featured-home::after {
    content: "";
    position: absolute;
    top: 10px;
    right: -10px;
    width: 100%;
    height: 100%;
    background-image: url("img/webp/bg-news.webp");
    border: 1px solid var(--black_energy);
    z-index: -1;
    background-size: cover;
    background-repeat: round;
}

/* GRILLE DES CARTES*/

.featured-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: var(--space-2xl);
}

.card-featured {
    position: relative;
    flex-direction: column;
    overflow: hidden;
    text-decoration: none;
    border: 1px solid var(--black_energy);
    background-color: var(--white_energy);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    box-sizing: border-box;
    height: 100%;
    width: 100%;
    min-height: 430px;
}

.card-featured:hover,
.card-featured:focus-within {
    transform: translateY(-4px);
}

.full-card-link {
    color: inherit;
    text-decoration: none;
}

.full-card-link:focus-visible::after {
    outline: 3px solid var(--Primary_Energy);
    outline-offset: -3px;
}

.card-badge {
    position: absolute;
    top: var(--space-base);
    left: var(--space-base);
    padding: var(--space-xs) var(--space-md);
    font-size: var(--text-micro);
    font-weight: 800;
    text-transform: uppercase;
    z-index: 10;
    color: var(--Font);
    background-color: var(--badge-bg, transparent);
}

/* Home news cards used white text on the badge -- keep that as a modifier */
.card-featured-home-color .card-badge {
    color: var(--white_energy);
}

/* DESIGN 1 : NEWS */

.card-news {
    background-color: var(--Background_Energy);
    padding: 0;
}

.news-bg-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

.news-gradient-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(180deg,
            rgba(57, 74, 68, 0) 0%,
            var(--Background_Energy) 70%,
            var(--Background_Energy) 100%);
    z-index: 3;
}

.news-noise-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url('img/webp/bg-card.webp');
    background-repeat: repeat;
    background-size: cover;
    mix-blend-mode: multiply;
    opacity: 0.25;
    z-index: 2;
}

.card-news .card-content-wrap {
    padding: var(--space-4xl) var(--space-lg) var(--space-lg);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 100%;
    position: relative;
    z-index: 3;
    min-height: 430px;
}

.card-news .news-card-title {
    color: var(--Primary_Energy);
    margin: auto 0 var(--space-lg) 0;
    line-height: 1.2;
}

.card-news .news-card-title .full-card-link:hover {
    text-decoration: underline;
}

.card-news .news-bottom-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-md);
}

.card-news .news-date {
    color: var(--gris_clair);
    font-size: var(--text-micro);
}

.card-news .news-btn-read {
    display: inline-flex;
    align-items: center;
    padding: 6px 18px;
    border: 1px solid var(--Primary_Energy);
    border-radius: 30px;
    font-size: var(--text-smaller);
    color: var(--Primary_Energy);
    font-weight: 600;
    position: relative;
    z-index: 6;
    transition: all 0.3s ease;
}

/* Survol géré par le parent */
.card-news:hover .news-btn-read,
.card-news:focus-within .news-btn-read {
    background-color: var(--Primary_Energy);
    color: var(--Background_white);
}

.card-news .news-btn-read .custom-arrow {
    margin-left: var(--space-sm);
    width: 25px;
}

.news-corner-arrow {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 60px;
    height: 60px;
    background-color: var(--Primary_Energy);
    border-top-left-radius: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    padding: 0 var(--space-sm) var(--space-lg) 0;
    z-index: 6;
    color: var(--white_energy);
    transition: background-color 0.3s ease;
}

.news-corner-arrow .custom-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s ease;
}

.card-news:hover .news-corner-arrow,
.card-news:focus-within .news-corner-arrow {
    background-color: var(--black_energy, #222);
}

.card-news:hover .news-corner-arrow .custom-arrow,
.card-news:focus-within .news-corner-arrow .custom-arrow {
    transform: translateX(4px);
}

/* DESIGN 2 : EVENTS */

.card-event-new {
    background-color: var(--Primary_Energy);
    padding: 0;
}

.card-event-new .card-content-wrap {
    padding: var(--space-4xl) var(--space-lg) var(--space-lg);
    display: flex;
    flex-direction: column;
    height: 100%;
    z-index: 2;
}

.card-event-new .event-card-title {
    color: var(--Background_white);
    margin: 0 0 var(--space-lg) 0;
    line-height: 1.2;
}

.card-event-new .full-card-link:hover {
    text-decoration: underline;
}

.card-event-new .event-card-location {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    margin-bottom: auto;
}

.card-event-new .location-icon {
    color: var(--Background_white);
    flex-shrink: 0;
}

.card-event-new .location-text {
    color: var(--Background_white);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.card-event-new .event-card-bottom-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-top: var(--space-xl);
}

.card-event-new .event-card-date {
    display: flex;
    flex-direction: column;
    color: var(--Background_Energy);
    width: fit-content;
}

.card-event-new .date-days {
    font-weight: 800;
    line-height: 1;
    letter-spacing: -1px;
    color: var(--white_energy);
    font-size: var(--h1_tablet);
}

.card-event-new .date-months {
    margin-top: var(--space-2xs);
    color: var(--white_energy);
    font-size: var(--h1_Mobile);
}

.card-event-new .single-month {
    text-align: center;
}

.card-event-new .multi-month {
    display: flex;
    justify-content: space-between;
    padding: 0 4px;
}

.card-event-new .event-card-dynamic-icon {
    position: absolute;
    bottom: -30px;
    right: -30px;
    color: var(--white_energy);
    opacity: 0.9;
    pointer-events: none;
}

.card-event-new .event-card-dynamic-icon svg {
    width: 130px;
    height: 130px;
}


/* DESIGN 3 : ADVOCACY  */

.card-advocacy-new {
    background-color: var(--Background_Energy);
    padding: 0;
}

.card-advocacy-new .card-content-wrap {
    padding: var(--space-4xl) var(--space-lg) var(--space-lg);
    display: flex;
    flex-direction: column;
    height: 100%;
    position: relative;
    z-index: 2;
    min-height: 430px;
}

.card-advocacy-new .advocacy-card-title {
    margin: 0 0 var(--space-lg) 0;
    line-height: 1.2;
    z-index: 3;
}

.card-advocacy-new .advocacy-card-title .full-card-link {
    color: var(--Primary_Energy);
}


.card-advocacy-new .advocacy-tag {
    background-color: var(--Primary_Energy);
    color: var(--white_energy);
    display: inline-block;
    padding: 6px 14px;
    font-size: var(--text-small);
    font-weight: 700;
    width: fit-content;
    z-index: 10;
}

.card-advocacy-new .advocacy-card-dynamic-icon {
    position: absolute;
    bottom: -50px;
    right: -50px;
    color: var(--Primary_Energy);
    pointer-events: none;
    z-index: 1;
}

.card-advocacy-new .advocacy-card-dynamic-icon svg {
    width: 160px;
    height: 160px;
}

.card-featured.card-advocacy-new.card-featured-home {
    overflow: visible !important;
    border: none;
    background: transparent;
}

.card-featured.card-advocacy-new.card-featured-home:hover {
    transform: none;
}

.advocacy-bg-shadow {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 100%;
    height: 100%;
    border: 1px solid var(--black_energy);
    background-color: var(--black_energy);
    opacity: 0.15;
    z-index: 0;
}

.card-advocacy-new.card-featured-home .full-card-link-wrapper {
    position: relative;
    display: block;
    height: 100%;
    width: 100%;
    background-color: var(--Background_Energy);
    z-index: 2;
    transition: transform 0.3s ease;
    overflow: hidden;
}

.card-advocacy-new .card-content-wrap {
    position: relative;
    z-index: 2;
}

.card-advocacy-new.card-featured-home:hover .full-card-link-wrapper {
    transform: translate(-4px, -4px);
}

.advocacy-icon-wrapper {
    position: absolute;
    bottom: -30px;
    right: -30px;
    z-index: 1;
    color: var(--Primary_Energy);
    pointer-events: none;
}

.advocacy-icon-wrapper svg {
    width: 160px;
    height: 160px;
    stroke-width: 1.5;
}

/* RESPONSIVE */

@media screen and (max-width: 1024px) {
    .featured-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media screen and (max-width: 768px) {
    .hub-featured-section {
        padding: var(--space-2xl) 0;
    }

    .featured-grid {
        grid-template-columns: 1fr;
        gap: var(--space-xl);
    }

    .card-featured {
        aspect-ratio: auto;
        min-height: 320px;
    }
}

.no-featured-content {
    text-align: center;
    color: var(--gris_clair);
    font-size: var(--paragraph);
}

.grid-2-cols {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-base);
    transition: opacity 0.3s ease;
}

.hub-all-content-section {
    margin-top: var(--space-2xl);
    padding: var(--space-sm) 0;
}

.all-content-header {
    margin-bottom: var(--space-2xl);
}

.content-layout-grid {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: var(--space-lg);
    align-items: start;
}

/* RESPONSIVE HUB ALL CONTENT SECTION */

@media screen and (max-width: 1024px) {

    .content-layout-grid {
        grid-template-columns: 1fr;
        gap: var(--space-2xl);
    }

    .grid-2-cols {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .template-projet-sidebar {
        position: static !important;
    }

    .projects-filters-hubs {
        margin: 0px;
    }
}

@media screen and (max-width: 768px) {

    .hub-all-content-section {
        margin-top: var(--space-2xl);
    }

    .grid-2-cols {
        grid-template-columns: 1fr;
    }

    .all-content-header {
        margin-bottom: var(--space-lg);
        text-align: center;
    }
}

.cards-filters-wrapper {
    display: flex;
    gap: 1rem;
    margin-bottom: 2rem;
}

.custom-title-wrapper h2.title-of-section {
    background-image: linear-gradient(to bottom, transparent 55%, var(--dynamic-highlight) 55%) !important;
    display: inline;
    padding: 0 var(--space-2xs);
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    margin-bottom: var(--space-lg);
}

.custom-title-placeholder {
    color: #999;
}


/* template-maps.php : member cards & load-more button visibility */
.member-card.is-initially-hidden {
    display: none;
}

.btn-load-more.is-hidden {
    display: none;
}

/* new */
.card-featured.card-event-new.card-featured-home {
    overflow: visible !important;
    border: none;
    background: transparent;
}

.card-featured.card-event-new.card-featured-home:hover {
    transform: none;
}

.event-bg-shadow {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 100%;
    height: 100%;
    border: 1px solid var(--black_energy);
    background-color: var(--black_energy);
    opacity: 0.15;
    z-index: 0;
}

.card-event-new.card-featured-home .full-card-link-wrapper {
    position: relative;
    display: block;
    height: 100%;
    width: 100%;
    background-color: var(--Primary_Energy);
    color: var(--white_energy);
    z-index: 2;
    transition: transform 0.3s ease;
    overflow: hidden;
}

.card-event-new .card-content-wrap {
    position: relative;
    z-index: 2;
}

.card-event-new.card-featured-home:hover .full-card-link-wrapper {
    transform: translate(-4px, -4px);
}

.event-icon-wrapper {
    position: absolute;
    bottom: -40px;
    right: -40px;
    z-index: 1;
    color: var(--white_energy);
    pointer-events: none;
}

.event-icon-wrapper svg {
    width: 160px;
    height: 160px;
}

/* template-maps-eu.php */
.card-page {
    display: flex;
}

.text-capitalize {
    text-transform: capitalize !important;
}

.font-bold-custom {
    font-weight: bold;
}

.custom-w-full {
    width: 100%;
}

.intro-section {
    margin-bottom: var(--space-2xl);
}

.intro-title-map {
    margin-top: var(--space-2xl);
}

.intro-bold-text {
    font-weight: bold;
}

.map-section-spacing {
    margin-top: var(--space-2xl);
}

.filter-list-spacing {
    margin-top: var(--space-lg);
}

.tracker-spacing {
    margin-top: var(--space-4xl);
}

.accordions-heading-section {
    margin-top: var(--space-5xl);
}

.custom-accordion-title {
    margin: 0;
    padding: 0;
    border: none;
}

.faq-grid-margin {
    margin-top: var(--space-2xl);
}

.faq-card-info {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--space-base);
}

.faq-card-img {
    width: 50px;
    height: auto;
}

.faq-card-title {
    font-weight: bold;
    color: var(--black_energy);
}

.faq-buttons-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-base);
    margin-top: var(--space-lg);
}

.category_button {
    display: block;
    width: 100%;
    border: none;
    background: transparent;
    padding: 0;
    margin-bottom: var(--space-base);
    cursor: pointer;
    text-align: left;
}

.category_button .hub-checkbox-inner {
    background-color: transparent;
    color: var(--white_energy);
    transition: all 0.3s ease;
}

.category_button .hub-icon {
    filter: brightness(0) invert(1);
    transition: all 0.3s ease;
}

.category_button.selected .hub-checkbox-inner {
    background-color: var(--Tertiary_Energy);
    color: var(--Font);
    box-shadow: 6px 6px 0px var(--black_energy);
    transform: translate(-4px, -4px);
}

.category_button.selected .hub-icon {
    filter: brightness(0);
}

.category_button:focus-visible .hub-checkbox-inner {
    outline: 2px solid var(--Primary_Energy);
    outline-offset: 2px;
}

.project-sidebar .filters-container {
    background-color: var(--black_energy);
    padding: var(--space-2xl);
}

.legal-framework-gauge-container {
    padding: 0;
}

.legal-framework-gauge-container .filter-label {
    font-size: var(--text-small);
    font-weight: 800;
    margin-bottom: var(--space-md);
    display: block;
    text-transform: none;
}

.gauge-container {
    height: 35px;
    background-color: var(--Background_Energy);
    border: 2px solid var(--black_energy);
    position: relative;
    overflow: hidden;
}

.gauge-progress {
    height: 100%;
    background: var(--Tertiary_Energy);
    color: var(--black_energy);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: var(--text-smaller);
    transition: width 1s ease;
}

.gauge-labels {
    display: flex;
    justify-content: space-between;
    padding: var(--space-xs) 0;
    font-size: var(--text-micro);
    color: var(--Font);
}

.map-scroll-wrapper {
    width: 100%;
    overflow-x: auto;
    text-align: center;
}

.map_area {
    position: relative;
    display: inline-block;
    margin: 0 auto;
}

.map_area area {
    cursor: pointer;
    outline: none;
}

.legend-container {
    gap: var(--space-base);
    width: max-content;
    margin: var(--space-sm) auto 0 auto;
}

.legend-container img {
    max-width: 100%;
    height: auto;
}

.text-legend {
    display: flex;
    gap: var(--space-xl);
    font-weight: bold;
    justify-content: space-between;
}

.text-legend p {
    margin: 0;
    text-align: left;
    color: var(--black_energy);
    font-size: var(--text-small);
    max-width: 150px;
}

.city-pin {
    position: absolute;
    transform: translate(-50%, -50%);
    background: transparent;
    border: none;
    padding: var(--space-2xs);
    cursor: pointer;
    z-index: 10;
    transition: transform 0.2s ease;
}

.city-pin:hover {
    transform: translate(-50%, -50%) scale(1.3);
}

.city-dot {
    display: block;
    width: 14px;
    height: 14px;
    background-color: var(--Primary_Energy);
    border: 2px solid var(--white_energy);
    border-radius: 50%;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
}

.modal-city-repeater {
    padding: var(--space-base) var(--space-lg);
    background-color: var(--white_energy);
}

.eco-select-custom {
    padding: var(--space-md) var(--space-base);
    border: 2px solid var(--border-grey);
    border-radius: 0px;
    background-color: var(--white_energy);
    color: var(--black_energy);
    font-size: var(--text-medium);
    font-weight: 700;
    cursor: pointer;
}

.select-wrapper {
    margin: 0 auto;
    max-width: 300px;
    text-align: left;
}

.dropdown-title {
    margin-bottom: var(--space-base);
    text-align: center;
}

.dropdown-title-city {
    margin-top: var(--space-2xl);
    margin-bottom: var(--space-base);
    text-align: center;
}

@media (min-width: 1151px) {
    .mobile-only-section {
        display: none !important;
    }
}

.mapModal {
    display: none;
    position: fixed;
    z-index: 10;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.modal-dialog-custom {
    position: relative;
    width: 90%;
    max-width: 500px;
    margin: 5vh auto;
}

.custom-design-modal {
    background-color: var(--white_energy);
    border: 1px solid var(--border-grey);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
}

.modal-header-custom {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-lg) var(--space-xl);
}

.modal-header-custom .modal-title {
    color: var(--Primary_Energy);
    font-size: var(--h3_tablet);
    letter-spacing: 1px;
    margin: 0;
    font-weight: 800;
    text-transform: uppercase;
}

.close-btn {
    background: none;
    border: none;
    font-size: 2rem;
    color: var(--Primary_Energy);
    cursor: pointer;
    line-height: 1;
    padding: 0;
    transition: transform 0.2s ease;
}

.close-btn:hover {
    transform: scale(1.1);
}

.modal-divider {
    margin: 0;
    border-top: 1px solid var(--border-grey);
    opacity: 0.5;
}

.modal-body-custom {
    padding: var(--space-xl);
}

.flag-gauge-container {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--space-xl);
    gap: var(--space-base);
}

.flag-gauge-container .image-wrapper {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

.flag-gauge-container .image-wrapper img {
    width: 100%;
    max-width: 180px;
    height: auto;
    object-fit: contain;
}

.vertical-divider {
    width: 1px;
    height: 80px;
    background-color: var(--border-grey);
}

.modal-field {
    margin-bottom: var(--space-lg);
    padding: var(--space-base) var(--space-lg);
}

.field-text {
    color: var(--Font);
    font-size: var(--text-smaller);
    line-height: 1.5;
    margin: 0;
    text-align: left;
}

.field-box-bg {
    background-color: var(--green-soft-bg);
}

.field-yellow-bar {
    border-left: 4px solid var(--Yellow_energy);
    padding-left: var(--space-base);
    padding-top: 0;
    padding-bottom: 0;
}

.field-yellow-bar #modalText2 {
    color: var(--Primary_Energy);
    font-size: var(--text-medium);
}

.field-box-border {
    border: 1px solid var(--Tertiary_Energy);
    background-color: var(--white_energy);
}

.modal-footer-custom {
    display: flex;
    justify-content: center;
    padding: 0 var(--space-xl) var(--space-xl) var(--space-xl);
}

.modal-link-custom {
    width: 100%;
    text-decoration: none;
}

.btn-pill-dark {
    background-color: var(--Primary_Energy);
    color: var(--white_energy);
    border: none;
    border-radius: 50px;
    padding: 14px 24px;
    font-size: var(--text-medium);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: var(--space-md);
    cursor: pointer;
    width: 100%;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.btn-pill-dark:hover {
    background-color: var(--gris-fonce, #232f2a);
    transform: translateY(-2px);
}

@media (max-width: 1024px) {
    .project-layout {
        grid-template-columns: 1fr;
    }

    .legend-container {
        margin-left: 0;
        width: 100%;
        justify-content: center;
        flex-direction: column;
    }
}

@media (max-width: 1150px) {

    .map-scroll-wrapper,
    .legend-container {
        display: none !important;
    }

    .mobile-only-section {
        display: block;
        margin-top: var(--space-3xl);
    }
}

/* PAGE ADVOCACY  */

.advocacy-priorities-section {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-4xl) var(--space-base);
}

.advocacy-priorities-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--space-2xl);
    margin-top: var(--space-3xl);
}

.priority-card {
    position: relative;
    /* overflow: hidden; */
    background-color: var(--white_energy);
    height: 100%;
    min-height: 320px;
    transition: transform 0.3s ease;
}

.priority-card:hover,
.priority-card:focus-within {
    transform: translateY(-4px);
}

.priority-card-link {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    height: 100%;
    padding: var(--space-xl);
    color: inherit;
    text-decoration: none;
}

.priority-card:hover .news-corner-arrow,
.priority-card:focus-within .news-corner-arrow {
    background-color: var(--black_energy, #222);
}

.priority-card:hover .news-corner-arrow .custom-arrow,
.priority-card:focus-within .news-corner-arrow .custom-arrow {
    transform: translateX(4px);
}

.priority-icon-box {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--Tertiary_Energy);
}

.priority-icon-box img {
    width: 36px;
    height: 36px;
    object-fit: contain;
}

.priority-title {
    text-transform: uppercase;
    margin: 0;
}

.priority-text {
    flex-grow: 1;
}

.advocacy-featured-layout {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: var(--space-2xl);
    align-items: stretch;
}

.featured-main-col .card-featured,
.featured-main-col .card-news,
.featured-main-col .project-card-wrapper {
    height: 100%;
}

.featured-secondary-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-base);
}

.featured-secondary-grid .card-featured {
    min-height: 300px;
}

.featured-secondary-grid .card-news .card-content-wrap {
    min-height: 300px;
}

@media (max-width: 991px) {
    .advocacy-featured-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .featured-secondary-grid {
        grid-template-columns: 1fr;
    }
}

.featured-main-col .card-editorial {
    height: 100%;
    display: flex;
}

.card-editorial::before {
    background-color: var(--Background_Energy);
}

.editorial-card-link {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-top: var(--space-4xl);
    text-decoration: none;
}

.editorial-card-title {
    font-size: var(--h2);
    color: var(--Primary_Energy) !important;
    margin: 0 0 var(--space-lg);
}

.editorial-card-excerpt {
    line-height: 1.55;
    margin: 0 0 var(--space-2xl);
}

.editorial-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-lg);
    margin-top: auto;
    flex-wrap: wrap;
}

.editorial-card-date {
    font-size: var(--paragraph);
    color: var(--gris_clair);
}

.editorial-card-author {
    display: flex;
    align-items: center;
    gap: var(--space-md);
}

.editorial-author-photo {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.editorial-author-meta {
    display: flex;
    flex-direction: column;
}

.editorial-author-name {
    color: var(--Primary_Energy);
    font-size: var(--paragraph);
}

.editorial-author-role {
    font-size: var(--paragraph);
    color: var(--gris_clair);
}

@media (max-width: 768px) {
    .editorial-card-title {
        font-size: var(--h2_tablet);
    }

    .editorial-card-link {
        padding-top: var(--space-3xl);
    }
}

.card-resource {
    background-color: var(--Background_Energy);
    height: 100%;
    display: flex;
    position: relative;
}

.card-resource .resource-card-link {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: var(--space-lg);
    padding-top: calc(var(--space-4xl) + var(--space-lg));
    padding-bottom: var(--space-6xl);
    text-decoration: none;
    color: var(--Primary_Energy);
    box-sizing: border-box;
    height: 100%;
}

.card-resource .resource-badge {
    background-color: var(--resource-accent, var(--Tertiary_Energy));
    color: var(--black_energy);
}

.resource-card-title {
    line-height: 1.3;
    margin: 0 0 var(--space-md);
}

.resource-card-desc {
    font-size: var(--paragraph_petit);
    line-height: 1.5;
    margin: 0;
}

.resource-icon-wrapper {
    position: absolute;
    left: 5px;
    bottom: 5px;
    z-index: 1;
    color: currentColor;
    pointer-events: none;
}

.resource-icon-wrapper svg {
    width: auto;
    height: 76px;
    max-width: 150px;
}

.card-resource .news-corner-arrow {
    background-color: var(--Primary_Energy);
    color: var(--white_energy);
}

.card-resource:hover .news-corner-arrow,
.card-resource:focus-within .news-corner-arrow {
    background-color: var(--black_energy);
    color: var(--white_energy);
}

.card-resource:hover .news-corner-arrow .custom-arrow,
.card-resource:focus-within .news-corner-arrow .custom-arrow {
    transform: translateX(4px);
}

.eu-file-tag {
    display: inline-block;
    align-self: flex-start;
    background-color: var(--Tertiary_Energy);
    color: var(--black_energy);
    border: 1px solid var(--black_energy);
    padding: 2px var(--space-sm);
    font-size: var(--text-micro);
    font-weight: 800;
    text-transform: uppercase;
    position: relative;
    z-index: 3;
    margin-bottom: var(--space-sm);
}

.card-news .eu-file-tag {
    margin-top: auto;
}

.card-news .eu-file-tag+.news-card-title {
    margin-top: var(--space-sm);
}

.project-card-info-original .eu-file-tag {
    margin-bottom: var(--space-xs);
}

@media (max-width: 767px) {
    .advocacy-priorities-grid {
        grid-template-columns: 1fr;
    }
}

.card-ressource-index {
    z-index: 6;
}

.card-featured.card-resource.card-featured-home {
    overflow: visible;
    border: none;
    background: transparent;
}

.card-resource.card-featured-home:hover {
    transform: none;
}

.card-resource.card-featured-home .resource-card-link {
    position: relative;
    z-index: 2;
    height: 100%;
    background-color: var(--Background_Energy);
    border: 1px solid var(--black_energy);
    overflow: hidden;
    transition: transform 0.3s ease;
}

.card-press.card-featured-home .resource-card-link {
    background-color: var(--Primary_Energy);
}

.card-resource.card-featured-home:hover .resource-card-link,
.card-resource.card-featured-home:focus-within .resource-card-link {
    transform: translate(-4px, -4px);
}

/* CARD PRESS */
.card-press {
    background-color: var(--Primary_Energy);
}

.card-press .resource-card-link {
    color: var(--white_energy);
}

.card-press .card-ressource-index {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
}

.card-press .press-content-bottom {
    margin-top: auto;
}

.card-press .resource-card-title {
    color: var(--white_energy);
    margin-bottom: 0;
}

.card-press .press-logo-corner {
    position: absolute;
    top: 10px;
    right: 10px;
    color: var(--white_energy);
    z-index: 2;
    pointer-events: none;
}

.card-press .press-logo-corner svg {
    width: 85px;
    height: 85px;
}

.card-press .news-gradient-overlay {
    background: linear-gradient(180deg,
            rgba(57, 74, 68, 0) 0%,
            var(--Primary_Energy) 75%,
            var(--Primary_Energy) 100%);
}

.card-press .news-corner-arrow {
    background-color: var(--white_energy);
    color: var(--Primary_Energy);
}

.card-press:hover .news-corner-arrow,
.card-press:focus-within .news-corner-arrow {
    background-color: var(--black_energy);
    color: var(--white_energy);
}

/* TABLEAUX */
.wp-block-table table,
table.has-fixed-layout,
table.wp-block-advgb-table {
    width: 100%;
    border-collapse: collapse;
    margin: var(--space-3xl) 0;
    background-color: var(--white_energy);
    border: 1px solid var(--black_energy);
}

figure.wp-block-table {
    margin: var(--space-3xl) 0;
    overflow-x: auto;
}

figure.wp-block-table table {
    margin: 0;
}

.wp-block-table table td,
table.has-fixed-layout td,
table.wp-block-advgb-table td {
    padding: var(--space-lg);
    vertical-align: top;
    color: var(--Font);
    font-size: var(--paragraph_petit);
    line-height: 1.6;
}

.wp-block-table table tr,
table.has-fixed-layout tr,
table.wp-block-advgb-table tr {
    border-bottom: 1px solid var(--black_energy);
}

.wp-block-table table tr:last-child,
table.has-fixed-layout tr:last-child,
table.wp-block-advgb-table tr:last-child {
    border-bottom: none;
}

.wp-block-table table td:first-child,
table.has-fixed-layout td:first-child,
table.wp-block-advgb-table td:first-child {
    width: 25%;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--Primary_Energy);
    background-color: var(--Secondary_Energy);
    border-right: 1px solid var(--black_energy);
}

.wp-block-table table td strong,
table.has-fixed-layout td strong,
table.wp-block-advgb-table td strong {
    font-weight: 800;
    color: var(--black_energy);
}

.wp-block-table table tbody tr:nth-child(even) td:not(:first-child),
table.has-fixed-layout tbody tr:nth-child(even) td:not(:first-child),
table.wp-block-advgb-table tbody tr:nth-child(even) td:not(:first-child) {
    background-color: var(--Background_white);
}

@media screen and (max-width: 768px) {

    .wp-block-table table,
    .wp-block-table table tbody,
    .wp-block-table table tr,
    .wp-block-table table td,
    table.has-fixed-layout,
    table.has-fixed-layout tbody,
    table.has-fixed-layout tr,
    table.has-fixed-layout td,
    table.wp-block-advgb-table,
    table.wp-block-advgb-table tbody,
    table.wp-block-advgb-table tr,
    table.wp-block-advgb-table td {
        display: block;
        width: 100%;
    }

    .wp-block-table table tr,
    table.has-fixed-layout tr,
    table.wp-block-advgb-table tr {
        border-bottom: 2px solid var(--black_energy);
    }

    .wp-block-table table tr:last-child,
    table.has-fixed-layout tr:last-child,
    table.wp-block-advgb-table tr:last-child {
        border-bottom: none;
    }

    /* La première colonne devient un en-tête horizontal */
    .wp-block-table table td:first-child,
    table.has-fixed-layout td:first-child,
    table.wp-block-advgb-table td:first-child {
        width: 100%;
        border-right: none;
        border-bottom: 1px dashed var(--black_energy);
        padding: var(--space-md) var(--space-lg);
    }

    .wp-block-table table td:not(:first-child),
    table.has-fixed-layout td:not(:first-child),
    table.wp-block-advgb-table td:not(:first-child) {
        padding: var(--space-lg);
    }
}

/* page.php */
.page-title {
    margin-bottom: var(--space-lg);
}