/* ==========================================================================
   Site vitrine T2A — surcouche moderne (chargée après style.css, hors espace membre)
   Charte : bleu #242B63, bleu clair #00669F, Futura ; base 1rem = 10px.
   ========================================================================== */

:root {
    --t2a-bleu: #242B63;
    --t2a-bleu-l: #00669F;
    --t2a-bleu-p: #eaf3fa;
    --t2a-gris: #f5f7fa;
    --t2a-texte: #2b3140;
    --t2a-rayon: 1.6rem;
    --t2a-ombre: 0 1.2rem 3.2rem rgba(36, 43, 99, .10);
}

body { color: var(--t2a-texte); }

/* --- Navigation ----------------------------------------------------------- */
nav.flex { backdrop-filter: blur(1rem); -webkit-backdrop-filter: blur(1rem); background-color: rgba(255,255,255,.85); box-shadow: 0 .1rem 0 rgba(36,43,99,.06); }
nav.flex .menu > li > a { position: relative; padding: .4rem 0; }
nav.flex .menu > li > a::after { content: ''; position: absolute; left: 0; right: 0; bottom: -.2rem; height: .2rem; background: var(--t2a-bleu-l); transform: scaleX(0); transition: transform .2s; }
nav.flex .menu > li > a:hover::after { transform: scaleX(1); }
nav.flex .btn { border-radius: 3rem; box-shadow: 0 .4rem 1.2rem rgba(0,102,159,.25); }

/* --- Boutons -------------------------------------------------------------- */
.btn, a.button, input[type=submit] { border-radius: 3rem !important; padding: 1.1rem 2.2rem; transition: transform .15s, box-shadow .15s, background .15s; }
.btn:hover, a.button:hover, input[type=submit]:hover { transform: translateY(-.1rem); box-shadow: 0 .6rem 1.6rem rgba(0,102,159,.25); }

/* --- Hero ----------------------------------------------------------------- */
header.hero { position: relative; margin: 0 0 8rem; padding: 14rem 0 0; color: #fff; background: var(--t2a-bleu); }
header.hero::before { content: ''; position: absolute; inset: 0; overflow: hidden; background-image: var(--hero-image); background-size: cover; background-position: center 40%; opacity: .55; }
header.hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(115deg, rgba(36,43,99,.96) 0%, rgba(36,43,99,.82) 45%, rgba(0,102,159,.45) 100%); }
header.hero .container { position: relative; z-index: 1; height: auto; padding-top: 0; background: none; }
header.hero .container .hero__contenu { display: block; max-width: 68rem; padding: 2rem 0 6rem; text-align: left; }
header.hero .hero__surtitre { margin: 0 0 1.2rem; font-size: 1.3rem; letter-spacing: .14em; text-transform: uppercase; opacity: .85; }
header.hero h1 { margin: 0 0 2rem; font-size: 3.2rem; line-height: 1.12; color: #fff; }
header.hero h1 em { font-style: normal; color: #9fd3ff; }
header.hero .hero__texte { margin: 0 0 2.8rem; font-size: 1.6rem; line-height: 1.6; max-width: 60rem; opacity: .95; }
header.hero .container .hero__actions { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 1.2rem; row-gap: 1.2rem; }
header.hero .hero__actions .btn { width: auto; border-color: #fff; }
header.hero .hero__actions .btn:not(.transparent) { background: #fff; color: var(--t2a-bleu); }
header.hero .hero__actions .btn.transparent { background: transparent; color: #fff; }
header.hero .hero__actions .btn.transparent:hover { background: rgba(255,255,255,.12); color: #fff; }
@media (min-width: 768px) { header.hero { padding-top: 17rem; } header.hero h1 { font-size: 4.4rem; } }
@media (min-width: 1200px) { header.hero h1 { font-size: 5.2rem; } header.hero .hero__contenu { padding-bottom: 8rem; } }

/* Chiffres clés : bandeau qui déborde sous le hero */
.lrs-chiffres { list-style: none; margin: 0 0 -4rem; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: .1rem; border-radius: var(--t2a-rayon); overflow: hidden; box-shadow: var(--t2a-ombre); background: #e3e8ef; transform: translateY(4rem); position: relative; z-index: 2; }
.lrs-chiffres li { display: flex; flex-direction: column; gap: .2rem; padding: 2rem 2.2rem; background: #fff; color: var(--t2a-texte); text-align: left; }
.lrs-chiffres strong { font-family: 'Futura-bold', sans-serif; font-size: 3.2rem; line-height: 1; color: var(--t2a-bleu-l); }
.lrs-chiffres span { font-family: 'Futura-bold', sans-serif; font-size: 1.4rem; color: var(--t2a-bleu); }
.lrs-chiffres small { font-size: 1.2rem; color: #6b7280; }
@media (min-width: 768px) { .lrs-chiffres { grid-template-columns: repeat(4, 1fr); } .lrs-chiffres li:only-child, .lrs-chiffres li:nth-child(5) { grid-column: span 4; } }
header.hero + .container, header.hero ~ main > .container { padding-top: 6rem; }

/* --- Sections ------------------------------------------------------------- */
/* Sections de l'accueil en pleine largeur : fond bord à bord, contenu aligné sur le conteneur */
body.home main.container > .container > section { width: 100vw; margin-left: calc(50% - 50vw); padding: 6rem max(2rem, calc(50vw - 58rem)); border-radius: 0; }
@media (min-width: 1441px) { body.home main.container > .container > section { padding-left: max(2rem, calc(50vw - 70rem)); padding-right: max(2rem, calc(50vw - 70rem)); } }
body:not(.home) main .container > section { padding: 6rem 2rem; }
h2 { font-size: 2.4rem; line-height: 1.2; }
h2 + p { max-width: 64rem; margin: -1rem auto 3.2rem; color: #6b7280; }
@media (min-width: 768px) { h2 { font-size: 3.2rem; } }

/* Valeurs : cartes */
#nos-valeurs { padding-top: 8rem; background: #fff; }
#nos-valeurs .valeurs { display: grid !important; grid-template-columns: 1fr; gap: 2rem; width: 100%; }
@media (min-width: 600px) { #nos-valeurs .valeurs { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 992px) { #nos-valeurs .valeurs { grid-template-columns: repeat(4, 1fr); } }
#nos-valeurs .valeurs li { max-width: none; display: flex; flex-direction: column; align-items: flex-start; gap: 1rem; padding: 2.8rem 2.6rem; background: #fff; border: .1rem solid #e3e8ef; border-radius: var(--t2a-rayon); text-align: left; transition: transform .2s, box-shadow .2s; }
#nos-valeurs .valeurs li:hover { transform: translateY(-.4rem); box-shadow: var(--t2a-ombre); }
#nos-valeurs .valeurs li img { width: 3rem; height: 3rem; padding: 1.4rem; box-sizing: content-box; border-radius: 1.4rem; background: var(--t2a-bleu-p); }
#nos-valeurs .valeurs li h3 { margin: .6rem 0 0; font-size: 1.9rem; color: var(--t2a-bleu); }
#nos-valeurs .valeurs li p { margin: 0; text-align: left; line-height: 1.55; color: #4a5160; }

/* Comment ça fonctionne */
#nos-valeurs-bis { background: var(--t2a-gris); }
#nos-valeurs-bis .container-image img { border-radius: var(--t2a-rayon); box-shadow: var(--t2a-ombre); }
#nos-valeurs-bis > div > div p { line-height: 1.65; }
#nos-valeurs-bis .btn { width: auto; align-self: flex-start; }
.rythme { list-style: none; margin: 0 0 .4rem; padding: 0; display: flex; flex-wrap: wrap; gap: 1rem; }
.rythme li { display: flex; flex-direction: column; padding: 1rem 1.4rem; border-radius: 1.2rem; background: #fff; border: .1rem solid #e3e8ef; min-width: 12rem; }
.rythme strong { font-size: 1.2rem; color: var(--t2a-bleu-l); }
.rythme span { font-family: 'Futura-bold', sans-serif; font-size: 1.5rem; color: var(--t2a-bleu); }

/* Membres */
#nos-membres { padding-top: 7rem; background: #fff; }
#nos-membres .lrs-annuaire { margin-top: 0; }

/* Contact : formulaire en carte */
#nous-contacter { padding-bottom: 8rem; background: var(--t2a-gris); }
#nous-contacter .gform_wrapper, #nous-contacter form, main .gform_wrapper { max-width: 76rem; margin: 0 auto; padding: 3.2rem; background: #fff; border: .1rem solid #e3e8ef; border-radius: var(--t2a-rayon); box-shadow: var(--t2a-ombre); text-align: left; }
#nous-contacter .gform_wrapper .gform_title { display: none; }
main .gform_wrapper .gfield_label { display: block; margin-bottom: .6rem; font-family: 'Futura-bold', sans-serif; font-size: 1.4rem; color: var(--t2a-bleu); }
main .gform_wrapper .gfield { margin-bottom: 1.8rem; }
#nous-contacter input:not([type=submit]):not([type=checkbox]), #nous-contacter textarea, #nous-contacter select, main .gform_wrapper input:not([type=submit]):not([type=checkbox]):not([type=radio]), main .gform_wrapper textarea, main .gform_wrapper select { width: 100%; padding: 0 1.4rem; border: .1rem solid #cfd6e0; border-radius: 1rem; background: #fff; }
#nous-contacter textarea, main .gform_wrapper textarea { padding: 1.2rem 1.4rem; min-height: 14rem; }
main .gform_wrapper input[type=radio], main .gform_wrapper input[type=checkbox] { width: 2rem; height: 2rem; margin: 0 .8rem 0 0; vertical-align: middle; }
main .gform_wrapper .gfield_radio .gchoice { display: flex; align-items: center; gap: .6rem; margin: .4rem 0; }
main .gform_wrapper .gfield_radio label, main .gform_wrapper .gfield_consent_label { display: inline; font-family: inherit; font-size: 1.4rem; color: var(--t2a-texte); }
#nous-contacter input:focus, #nous-contacter textarea:focus { outline: .2rem solid var(--t2a-bleu-l); outline-offset: .1rem; border-color: transparent; }
#nous-contacter .gform_footer input[type=submit], #nous-contacter input[type=submit], main .gform_wrapper input[type=submit] { width: auto; min-width: 22rem; }
main .gform_wrapper .gform_required_legend { display: none; }


/* Pages internes (membres, mentions…) */
body:not(.home) main > .container:first-of-type, body:not(.home) main .container { padding-top: 11rem; }
@media (min-width: 768px) { body:not(.home) main > .container:first-of-type, body:not(.home) main .container { padding-top: 14rem; } }
body:not(.home) main h1 { font-size: 3.2rem; color: var(--t2a-bleu); }

/* Pied de page : bandeau bleu */
footer { margin-top: 0; background: var(--t2a-bleu); background-image: none; color: #fff; }
footer .container { padding-top: 1rem; }
footer section.flex { border-top: 0; padding: 4rem 2rem; }
footer a, footer p { color: #fff; }
footer a:hover { color: #9fd3ff; }
footer section.flex img { filter: brightness(0) invert(1); opacity: .95; }
footer .socials a svg path { fill: #fff; }
footer .socials a { border-color: rgba(255,255,255,.4); }
#nous-contacter input[type=checkbox] { width: 2rem; height: 2rem; margin: 0 .8rem 0 0; vertical-align: middle; }
#nous-contacter .gfield_consent_label, #nous-contacter .ginput_container_consent label { display: inline; }

/* Pied de page : menu sur deux colonnes lisibles, pages légales */
footer section.flex .menu { max-height: none; width: auto; display: grid !important; grid-template-columns: repeat(2, auto); gap: .8rem 3rem; }
footer section.flex .menu li a { font-size: 1.3rem; }
.mentions .contenu, body.page-template-page-mentions-legales main, body.page-template-page-politique-confidentialite main { line-height: 1.6; }
.mentions h2, .mentions h3 { text-align: left; margin-top: 3rem; }

nav.flex .menu > li > a { white-space: nowrap; }

/* Logo de navigation : taille fixe (les feuilles de style tierces mettent max-width 100% sur les images) */
nav.flex .container.flex > a img { max-width: none; width: 8.1rem; }
main .gform_wrapper .ginput_container input:not([type=radio]):not([type=checkbox]), main .gform_wrapper .ginput_container textarea, main .gform_wrapper .ginput_container select { width: 100% !important; max-width: none !important; box-sizing: border-box; }
main .gform_wrapper .ginput_container input:not([type=radio]):not([type=checkbox]) { height: 4.4rem !important; }
main .gform_wrapper.gravity-theme .gform_fields { column-gap: 2rem; row-gap: 1.6rem; }

/* Pages légales : lecture confortable */
body.page-template-page-politique-confidentialite main section, body.page-template-page-mentions-legales main section { padding-top: 0; }
body.page-template-page-politique-confidentialite main .container > div, body.page-template-page-mentions-legales main .container > div, .mentions { max-width: 80rem; margin: 0 auto; text-align: left; line-height: 1.65; }
body.page-template-page-politique-confidentialite main h2, body.page-template-page-mentions-legales main h2, .mentions h2 { text-align: left; font-size: 2rem; margin: 3.2rem 0 1rem; color: var(--t2a-bleu); }
body.page-template-page-politique-confidentialite main p, body.page-template-page-mentions-legales main p, .mentions p { text-align: left; margin-bottom: 1.2rem; }
body.page-template-page-politique-confidentialite main .container > div::before { content: 'Données personnelles'; display: block; font-family: 'Futura-bold', sans-serif; font-size: 3.2rem; color: var(--t2a-bleu); margin-bottom: 2rem; }
body.page-template-page-mentions-legales main .container > div::before { content: 'Mentions légales'; display: block; font-family: 'Futura-bold', sans-serif; font-size: 3.2rem; color: var(--t2a-bleu); margin-bottom: 2rem; }
nav.flex .btn { white-space: nowrap; padding: .9rem 1.6rem; width: auto; }
html:has(body.home), body.home { overflow-x: clip; }
#nos-membres .lrs-annuaire__grille { grid-template-columns: repeat(auto-fill, minmax(24rem, 1fr)); }
@media (min-width: 992px) { #nos-membres .lrs-annuaire__grille { grid-template-columns: repeat(4, 1fr); } }

/* --- Mobile --------------------------------------------------------------- */
@media (max-width: 767px) {
    header.hero { padding-top: 11rem; margin-bottom: 0; }
    header.hero .container .hero__contenu { padding: 0 0 3rem; }
    header.hero h1 { font-size: 3rem; }
    header.hero .hero__texte { font-size: 1.5rem; }
    header.hero .hero__actions .btn { width: 100%; justify-content: center; }
    .lrs-chiffres { transform: none; margin: 0; border-radius: var(--t2a-rayon) var(--t2a-rayon) 0 0; box-shadow: none; }
    .lrs-chiffres li { padding: 1.6rem 1.6rem; }
    .lrs-chiffres strong { font-size: 2.6rem; }
    body.home main.container > .container > section { padding-top: 4.4rem; padding-bottom: 4.4rem; }
    #nos-valeurs { padding-top: 4.4rem; }
    #nos-valeurs .valeurs li { width: auto; max-width: none; padding: 2rem 2rem; }
    header.hero ~ main > .container, body.home main.container, body.home main > .container { padding-top: 0; }
    #nos-valeurs .valeurs li img { width: 2.4rem; height: 2.4rem; padding: 1.1rem; }
    #nos-valeurs .valeurs li h3 { font-size: 1.7rem; margin-top: .2rem; }
    h2 { font-size: 2.2rem; }
    h2 + p { margin: -.4rem auto 2.4rem; }
    #nos-valeurs-bis .container-image { margin-bottom: 1.6rem; }
    #nos-valeurs-bis > div > div p { font-size: 1.4rem; }
    #nos-valeurs-bis .btn { width: 100%; justify-content: center; }
    .rythme li { flex: 1 1 calc(50% - .5rem); min-width: 0; }
    #nos-membres .lrs-annuaire__tous .btn { width: 100%; justify-content: center; }
    #nous-contacter .gform_wrapper, #nous-contacter form, main .gform_wrapper { padding: 2rem 1.6rem; }
    footer section.flex .menu { grid-template-columns: 1fr; text-align: center; }
}
main .gform_wrapper textarea, #nous-contacter textarea { border: .1rem solid #cfd6e0 !important; border-radius: 1rem !important; }