﻿/*

Theme Name: Bouchons Eureliens - Style Bouchons Franciliens

Theme URI: https://www.bouchonseureliens.fr

Description: Theme enfant GeneratePress pour l'association Bouchons Eureliens

Author: Bouchons Eureliens

Template: generatepress

Version: 2.1.5

Text Domain: bouchons-eureliens

*/



/* ============================================================

   VARIABLES & RESET

   ============================================================ */

:root {

  --bf-blue: #1769aa;
  --bf-blue-dark: #123b66;
  --bf-green: #2f9b63;
  --bf-red: #dc3f3a;
  --bf-ink: #142033;
  --bf-muted: #5c697a;
  --bf-soft: #f4f7fb;
  --bf-white: #ffffff;
  --bf-border: #dfe7f0;
  --bf-radius: 8px;

  --green-50:   #f0f7e8;

  --green-100:  #d6ecb8;

  --green-300:  #8fca3a;

  --green-500:  #4e8c10;

  --green-700:  #2d5908;

  --green-900:  #162e02;

  --sand-50:    #faf8f2;

  --sand-100:   #f1ede0;

  --sand-300:   #d9cfa8;

  --charcoal:   #1e2219;

  --muted:      #5a6355;

  --accent:     #e8630a;

  --white:      #ffffff;

  --radius:     12px;

  --radius-lg:  20px;

  --shadow-sm:  0 1px 3px rgba(30,34,25,0.08);

  --shadow-md:  0 4px 16px rgba(30,34,25,0.10);

}



*, *::before, *::after { box-sizing: border-box; }



body {

  font-family: 'DM Sans', sans-serif !important;

  background: var(--sand-50) !important;

  color: var(--charcoal) !important;

  line-height: 1.6;

  overflow-x: hidden;

}



/* ============================================================

   GENERATEPRESS OVERRIDES

   ============================================================ */

.site-header,

.site-header .header-inner {

  background: rgba(250,248,242,0.97) !important;

  backdrop-filter: blur(12px);

  border-bottom: 1px solid var(--sand-300) !important;

  box-shadow: none !important;

}

.site-header {

  position: fixed !important;

  top: 0; left: 0; right: 0;

  z-index: 999;

}

.site-content { padding-top: 64px !important; }



/* Logo */

.site-branding .site-title a {

  font-family: 'DM Serif Display', serif !important;

  font-size: 20px !important;

  color: var(--charcoal) !important;

  text-decoration: none;

}

.site-branding .site-description {

  font-size: 10px !important;

  letter-spacing: 0.12em;

  text-transform: uppercase;

  color: var(--muted) !important;

}



/* Nav */

.main-navigation a {

  font-family: 'DM Sans', sans-serif !important;

  font-size: 14px !important;

  color: var(--muted) !important;

  font-weight: 400 !important;

  transition: color 0.2s;

}

.main-navigation a:hover,

.main-navigation .current-menu-item > a {

  color: var(--charcoal) !important;

}

.main-navigation .nav-cta > a {

  background: var(--green-500) !important;

  color: var(--white) !important;

  padding: 8px 20px !important;

  border-radius: 100px !important;

  font-weight: 500 !important;

}

.main-navigation .nav-cta > a:hover {

  background: var(--green-700) !important;

}



/* Footer GP */

.site-footer {

  background: var(--charcoal) !important;

  color: rgba(255,255,255,0.5) !important;

  padding: 0 !important;

}

.site-footer a { color: rgba(255,255,255,0.5) !important; }

.site-footer a:hover { color: var(--white) !important; }



/* ============================================================

   UTILITAIRES GLOBAUX

   ============================================================ */

.be-container {

  max-width: 1100px;

  margin: 0 auto;

  padding: 0 2rem;

}



.be-section { padding: 80px 0; }

.be-section--white { background: var(--white); }

.be-section--dark  { background: var(--green-900); }

.be-section--tinted { background: var(--green-50); border-top: 1px solid var(--green-100); border-bottom: 1px solid var(--green-100); }



.be-tag {

  display: inline-flex; align-items: center; gap: 8px;

  background: var(--green-50);

  border: 1px solid var(--green-100);

  color: var(--green-500);

  font-size: 12px; font-weight: 500;

  letter-spacing: 0.1em; text-transform: uppercase;

  padding: 6px 14px; border-radius: 100px;

  margin-bottom: 1.5rem;

}

.be-tag::before {

  content: '';

  width: 6px; height: 6px;

  background: var(--green-300);

  border-radius: 50%;

}



.be-label {

  font-size: 11px; font-weight: 500;

  letter-spacing: 0.15em; text-transform: uppercase;

  color: var(--green-500);

  margin-bottom: 0.75rem;

  display: block;

}



.be-title {

  font-family: 'DM Serif Display', serif;

  font-size: clamp(1.8rem, 3.5vw, 2.8rem);

  line-height: 1.15;

  color: var(--charcoal);

  margin-bottom: 1rem;

}

.be-title em { font-style: italic; color: var(--green-500); }

.be-title--white { color: var(--white); }



.be-subtitle {

  font-size: 17px; font-weight: 300;

  color: var(--muted); line-height: 1.7;

  max-width: 560px;

  margin-bottom: 0;

}

.be-subtitle--white { color: rgba(255,255,255,0.6); }



/* Boutons */

.be-btn {

  display: inline-flex; align-items: center; gap: 8px;

  padding: 14px 28px; border-radius: 100px;

  text-decoration: none; font-weight: 500; font-size: 15px;

  transition: background 0.2s, transform 0.15s, border-color 0.2s;

  cursor: pointer; border: none; font-family: 'DM Sans', sans-serif;

}

.be-btn--primary { background: var(--green-500); color: var(--white) !important; }

.be-btn--primary:hover { background: var(--green-700); transform: translateY(-1px); }

.be-btn--secondary { background: transparent; color: var(--charcoal) !important; border: 1.5px solid var(--sand-300); }

.be-btn--secondary:hover { border-color: var(--charcoal); transform: translateY(-1px); }

.be-btn--white { background: var(--white); color: var(--green-900) !important; }

.be-btn--white:hover { opacity: 0.9; }



/* Cards */

.be-card {

  background: var(--white);

  border: 1px solid var(--sand-300);

  border-radius: var(--radius-lg);

  padding: 1.75rem;

  transition: border-color 0.2s, transform 0.2s;

}

.be-card:hover { border-color: var(--green-300); transform: translateY(-2px); }



/* ============================================================

   PAGE HEADER

   ============================================================ */

.be-page-header {

  padding: 80px 0 60px;

  background: linear-gradient(135deg, var(--sand-50) 60%, var(--green-50));

  border-bottom: 1px solid var(--sand-300);

}

.be-page-header h1 {

  font-family: 'DM Serif Display', serif;

  font-size: clamp(2rem, 4vw, 3.2rem);

  line-height: 1.1;

  margin-bottom: 1rem;

  color: var(--charcoal);

}

.be-page-header p {

  font-size: 18px; font-weight: 300;

  color: var(--muted); max-width: 560px; line-height: 1.7;

}



/* ============================================================

   HERO (front-page)

   ============================================================ */

.be-hero {

  min-height: calc(100vh - 64px);

  display: flex; align-items: center;

  padding: 80px 0;

  position: relative; overflow: hidden;

  background: linear-gradient(135deg, var(--sand-50) 50%, var(--green-50) 100%);

}

.be-hero__circle {

  position: absolute; border-radius: 50%;

  background: var(--green-100); opacity: 0.5;

  pointer-events: none;

}

.be-hero__circle--1 { width: 600px; height: 600px; top: -200px; right: -200px; }

.be-hero__circle--2 { width: 300px; height: 300px; bottom: -100px; left: 10%; opacity: 0.3; }

.be-hero__inner {

  display: grid; grid-template-columns: 1fr 1fr;

  gap: 4rem; align-items: center;

  position: relative; z-index: 1;

}

.be-hero__content h1 {

  font-family: 'DM Serif Display', serif;

  font-size: clamp(2.5rem, 5vw, 4rem);

  line-height: 1.1; margin-bottom: 1.5rem;

  color: var(--charcoal);

}

.be-hero__content p {

  font-size: 18px; font-weight: 300;

  color: var(--muted); max-width: 440px;

  margin-bottom: 2.5rem; line-height: 1.7;

}

.be-hero__actions { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; }

.be-hero__visual { display: flex; flex-direction: column; gap: 1.5rem; }

.be-hero__stat-row { display: flex; gap: 1rem; }

.be-hero__stat {

  flex: 1; background: var(--white);

  border: 1px solid var(--sand-300);

  border-radius: var(--radius-lg); padding: 1.5rem;

}

.be-hero__stat--green {

  background: var(--green-500); border: none;

  display: flex; align-items: center; gap: 1rem;

}

.be-hero__stat-number {

  font-family: 'DM Serif Display', serif;

  font-size: 2.2rem; line-height: 1; margin-bottom: 4px;

  color: var(--charcoal);

}

.be-hero__stat--green .be-hero__stat-number { color: var(--white); }

.be-hero__stat-number span { color: var(--green-500); }

.be-hero__stat--green .be-hero__stat-number span { color: var(--white); }

.be-hero__stat-label { font-size: 13px; color: var(--muted); font-weight: 300; }

.be-hero__stat--green .be-hero__stat-label { color: rgba(255,255,255,0.75); }

.be-hero__quote-card {

  background: var(--white);

  border: 1px solid var(--sand-300);

  border-radius: var(--radius-lg); padding: 1.5rem;

  display: flex; align-items: center; gap: 1rem;

}

.be-hero__avatar {

  width: 48px; height: 48px; border-radius: 50%;

  background: var(--green-50); border: 2px solid var(--green-100);

  display: flex; align-items: center; justify-content: center;

  font-size: 22px; flex-shrink: 0;

}

.be-hero__quote {

  font-size: 14px; color: var(--muted);

  font-style: italic; line-height: 1.5;

}

.be-hero__quote strong {

  font-style: normal; color: var(--charcoal); font-size: 13px;

}



/* Animations hero */

@keyframes be-fadeUp {

  from { opacity: 0; transform: translateY(24px); }

  to   { opacity: 1; transform: translateY(0); }

}

.be-hero__content { animation: be-fadeUp 0.7s ease both; }

.be-hero__visual  { animation: be-fadeUp 0.7s 0.2s ease both; }



/* ============================================================

   STEPS (comment Ã§a marche)

   ============================================================ */

.be-steps { display: flex; flex-direction: column; gap: 0; margin-top: 3rem; }

.be-step {

  display: grid; grid-template-columns: 80px 1fr;

  gap: 2rem; padding: 2.5rem 0;

  border-bottom: 1px solid var(--sand-300); align-items: start;

}

.be-step:last-child { border-bottom: none; }

.be-step__num {

  font-family: 'DM Serif Display', serif;

  font-size: 4rem; color: var(--green-100);

  -webkit-text-stroke: 1.5px var(--green-300);

  line-height: 1; text-align: right; padding-top: 4px;

}

.be-step h3 { font-size: 22px; font-weight: 500; margin-bottom: 0.75rem; }

.be-step p {

  font-size: 16px; color: var(--muted); font-weight: 300;

  line-height: 1.7; max-width: 640px;

}

.be-step p strong { color: var(--charcoal); font-weight: 500; }

.be-step__tag {

  display: inline-block; margin-top: 1rem;

  background: var(--green-50); color: var(--green-500);

  font-size: 12px; padding: 4px 12px; border-radius: 100px;

  border: 1px solid var(--green-100); font-weight: 500;

}



/* Steps carrÃ©s (accueil) */

.be-steps-grid {

  display: grid; grid-template-columns: repeat(4, 1fr);

  gap: 0; margin-top: 3rem;

  border: 1px solid var(--sand-300);

  border-radius: var(--radius-lg); overflow: hidden;

}

.be-step-sq {

  padding: 2rem 1.75rem; background: var(--white);

  border-right: 1px solid var(--sand-300);

}

.be-step-sq:last-child { border-right: none; }

.be-step-sq__num {

  font-family: 'DM Serif Display', serif;

  font-size: 4rem; line-height: 1;

  color: var(--green-50); margin-bottom: 1rem;

  -webkit-text-stroke: 1px var(--green-100);

}

.be-step-sq__icon { font-size: 2rem; margin-bottom: 1rem; display: block; }

.be-step-sq h3 { font-size: 16px; font-weight: 500; margin-bottom: 0.5rem; }

.be-step-sq p { font-size: 14px; color: var(--muted); line-height: 1.6; }



/* ============================================================

   IMPACT

   ============================================================ */

.be-impact-grid {

  display: grid; grid-template-columns: repeat(3, 1fr);

  gap: 1.5rem; margin-top: 3rem;

}

.be-impact-card {

  background: rgba(255,255,255,0.05);

  border: 1px solid rgba(255,255,255,0.1);

  border-radius: var(--radius-lg); padding: 2rem;

}

.be-impact-number {

  font-family: 'DM Serif Display', serif;

  font-size: 3.5rem; color: var(--green-300);

  line-height: 1; margin-bottom: 0.5rem;

}

.be-impact-label {

  font-size: 15px; color: rgba(255,255,255,0.5);

  font-weight: 300; line-height: 1.5;

}

.be-impact-label strong { color: rgba(255,255,255,0.85); font-weight: 400; }



/* ============================================================

   COLLECTE CARDS

   ============================================================ */

.be-collecte-grid {

  display: grid; grid-template-columns: repeat(3, 1fr);

  gap: 1.5rem; margin-top: 3rem;

}

.be-collecte-card {

  background: var(--white); border: 1px solid var(--sand-300);

  border-radius: var(--radius-lg); padding: 1.75rem;

  transition: border-color 0.2s, transform 0.2s;

  display: flex; flex-direction: column;

}

.be-collecte-card:hover { border-color: var(--green-300); transform: translateY(-2px); }

.be-collecte-card__top {

  display: flex; justify-content: space-between;

  align-items: flex-start; margin-bottom: 1.25rem;

}

.be-collecte-card__icon {

  width: 48px; height: 48px; background: var(--green-50);

  border-radius: var(--radius); display: flex;

  align-items: center; justify-content: center; font-size: 24px;

}

.be-badge {

  font-size: 11px; padding: 4px 10px;

  border-radius: 100px; font-weight: 500;

}

.be-badge--open   { background: var(--green-50); color: var(--green-700); border: 1px solid var(--green-100); }

.be-badge--new    { background: #fff3e0; color: #8a5200; border: 1px solid #ffd99a; }

.be-badge--siege  { background: var(--sand-100); color: var(--muted); border: 1px solid var(--sand-300); }

.be-collecte-card h3 { font-size: 16px; font-weight: 500; margin-bottom: 4px; }

.be-collecte-card__zone {

  font-size: 12px; color: var(--green-500); font-weight: 500;

  letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 0.75rem;

}

.be-collecte-card p { font-size: 13px; color: var(--muted); line-height: 1.6; flex: 1; }

.be-collecte-card__footer {

  margin-top: 1.25rem; padding-top: 1rem;

  border-top: 1px solid var(--sand-100);

  display: flex; align-items: center; gap: 8px;

}

.be-collecte-card__address { font-size: 12px; color: var(--muted); }

.be-collecte-card__link {

  font-size: 13px; color: var(--green-500);

  text-decoration: none; font-weight: 500; margin-left: auto;

}

.be-collecte-card__link:hover { text-decoration: underline; }



/* Filter bar */

.be-filter-bar { display: flex; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 2rem; }

.be-filter-btn {

  padding: 8px 18px; border-radius: 100px;

  border: 1px solid var(--sand-300);

  background: var(--white); color: var(--muted);

  font-size: 13px; cursor: pointer;

  font-family: 'DM Sans', sans-serif; transition: all 0.2s;

}

.be-filter-btn:hover, .be-filter-btn.active {

  background: var(--green-500); color: var(--white); border-color: var(--green-500);

}



/* ============================================================

   ACCEPT (oui/non bouchons)

   ============================================================ */

.be-accept-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin-top: 3rem; }

.be-accept-col { border-radius: var(--radius-lg); padding: 2rem; }

.be-accept-col--yes { background: var(--green-50); border: 1px solid var(--green-100); }

.be-accept-col--no  { background: #fff8f5; border: 1px solid #f5d5c0; }

.be-accept-col h3 { font-size: 17px; font-weight: 500; margin-bottom: 1.25rem; }

.be-accept-col--yes h3 { color: var(--green-700); }

.be-accept-col--no  h3 { color: #8a3a1a; }

.be-accept-list { list-style: none; display: flex; flex-direction: column; gap: 0.6rem; padding: 0; }

.be-accept-list li {

  font-size: 14px; color: var(--muted);

  display: flex; align-items: flex-start; gap: 10px;

}

.be-accept-col--yes .be-accept-list li::before { content: 'âœ“'; color: var(--green-500); font-weight: 700; flex-shrink: 0; }

.be-accept-col--no  .be-accept-list li::before { content: 'âœ—'; color: #c0522a; font-weight: 700; flex-shrink: 0; }



/* ============================================================

   FAQ

   ============================================================ */

.be-faq { margin-top: 3rem; display: flex; flex-direction: column; gap: 1px; border: 1px solid var(--sand-300); border-radius: var(--radius-lg); overflow: hidden; }

.be-faq-item { background: var(--white); border-top: 1px solid var(--sand-300); }

.be-faq-item:first-child { border-top: none; }

.be-faq-q {

  padding: 1.25rem 1.5rem; cursor: pointer;

  font-size: 16px; font-weight: 500;

  display: flex; justify-content: space-between; align-items: center;

  user-select: none; list-style: none;

}

.be-faq-q:hover { background: var(--sand-50); }

.be-faq-icon { color: var(--green-500); font-size: 20px; transition: transform 0.2s; flex-shrink: 0; }

.be-faq-item.open .be-faq-icon { transform: rotate(45deg); }

.be-faq-a {

  display: none; padding: 0 1.5rem 1.25rem;

  font-size: 15px; font-weight: 300; color: var(--muted); line-height: 1.7;

}

.be-faq-item.open .be-faq-a { display: block; }



/* ============================================================

   QUI SOMMES NOUS

   ============================================================ */

.be-story-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: start; }

.be-story-content h2 { font-family: 'DM Serif Display', serif; font-size: 2rem; margin-bottom: 1.5rem; line-height: 1.2; }

.be-story-content p { font-size: 16px; color: var(--muted); line-height: 1.8; margin-bottom: 1.25rem; font-weight: 300; }

.be-story-content p strong { color: var(--charcoal); font-weight: 500; }

.be-story-sidebar { display: flex; flex-direction: column; gap: 1rem; }

.be-info-card { background: var(--white); border: 1px solid var(--sand-300); border-radius: var(--radius-lg); padding: 1.5rem; }

.be-info-card__label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.12em; color: var(--green-500); font-weight: 500; margin-bottom: 4px; }

.be-info-card__value { font-size: 15px; color: var(--charcoal); }

.be-info-card__value a { color: var(--green-500); text-decoration: none; }



.be-values-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin-top: 3rem; }

.be-value-card { padding: 2rem; border: 1px solid var(--sand-300); border-radius: var(--radius-lg); }

.be-value-icon { font-size: 2rem; margin-bottom: 1rem; display: block; }

.be-value-card h3 { font-size: 17px; font-weight: 500; margin-bottom: 0.5rem; }

.be-value-card p { font-size: 14px; color: var(--muted); line-height: 1.6; }



.be-reseau-flow {

  display: grid; grid-template-columns: repeat(5, 1fr);

  margin-top: 3rem;

  background: rgba(255,255,255,0.05);

  border: 1px solid rgba(255,255,255,0.1);

  border-radius: var(--radius-lg); overflow: hidden;

}

.be-reseau-step { padding: 1.5rem 1.25rem; }

.be-reseau-step:not(:last-child) { border-right: 1px solid rgba(255,255,255,0.1); }

.be-reseau-step__num { font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--green-300); margin-bottom: 0.75rem; font-weight: 500; }

.be-reseau-step h4 { font-size: 14px; color: var(--white); font-weight: 500; margin-bottom: 0.5rem; }

.be-reseau-step p { font-size: 12px; color: rgba(255,255,255,0.5); }



/* ============================================================

   CONTACT

   ============================================================ */

.be-contact-layout { display: grid; grid-template-columns: 1fr 1.4fr; gap: 4rem; align-items: start; }

.be-contact-cards { display: flex; flex-direction: column; gap: 1.25rem; }

.be-contact-card {

  background: var(--white); border: 1px solid var(--sand-300);

  border-radius: var(--radius-lg); padding: 1.5rem;

  display: flex; align-items: flex-start; gap: 1rem;

}

.be-contact-card__icon {

  width: 44px; height: 44px; border-radius: var(--radius);

  background: var(--green-50); display: flex;

  align-items: center; justify-content: center;

  font-size: 20px; flex-shrink: 0;

}

.be-contact-card__label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.12em; color: var(--green-500); font-weight: 500; margin-bottom: 4px; }

.be-contact-card__value { font-size: 15px; color: var(--charcoal); }

.be-contact-card__value a { color: var(--charcoal); text-decoration: none; }

.be-contact-card__value a:hover { color: var(--green-500); }

.be-contact-card__note { font-size: 12px; color: var(--muted); margin-top: 2px; }



.be-form-card {

  background: var(--white); border: 1px solid var(--sand-300);

  border-radius: var(--radius-lg); padding: 2.5rem;

}

.be-form-card h2 { font-family: 'DM Serif Display', serif; font-size: 1.6rem; margin-bottom: 0.5rem; }

.be-form-card .be-form-subtitle { font-size: 14px; color: var(--muted); font-weight: 300; margin-bottom: 2rem; }

.be-subject-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 1.5rem; }

.be-subject-chip {

  padding: 7px 14px; border-radius: 100px;

  border: 1px solid var(--sand-300); background: var(--white);

  color: var(--muted); font-size: 13px; cursor: pointer;

  font-family: 'DM Sans', sans-serif; transition: all 0.2s;

}

.be-subject-chip:hover, .be-subject-chip.selected {

  background: var(--green-500); color: var(--white); border-color: var(--green-500);

}

.be-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1rem; }

.be-form-group { display: flex; flex-direction: column; gap: 6px; margin-bottom: 1rem; }

.be-form-group label { font-size: 13px; font-weight: 500; color: var(--charcoal); }

.be-form-group input,

.be-form-group textarea,

.be-form-group select {

  width: 100%; padding: 12px 14px;

  border: 1px solid var(--sand-300); border-radius: var(--radius);

  font-family: 'DM Sans', sans-serif; font-size: 14px;

  color: var(--charcoal); background: var(--sand-50);

  transition: border-color 0.2s; appearance: none;

}

.be-form-group input:focus,

.be-form-group textarea:focus {

  outline: none; border-color: var(--green-500); background: var(--white);

}

.be-form-group textarea { min-height: 140px; resize: vertical; }

.be-form-note { font-size: 12px; color: var(--muted); }

.be-btn-submit {

  width: 100%; margin-top: 1.5rem;

  padding: 15px 28px; border-radius: 100px;

  background: var(--green-500); color: var(--white);

  border: none; font-family: 'DM Sans', sans-serif;

  font-size: 15px; font-weight: 500; cursor: pointer;

  transition: background 0.2s, transform 0.15s;

}

.be-btn-submit:hover { background: var(--green-700); transform: translateY(-1px); }

.be-success-msg { display: none; text-align: center; padding: 2rem; }

.be-success-msg .be-success-icon { font-size: 3rem; margin-bottom: 1rem; }

.be-success-msg h3 { font-family: 'DM Serif Display', serif; font-size: 1.4rem; margin-bottom: 0.5rem; }

.be-success-msg p { font-size: 14px; color: var(--muted); }



/* ============================================================

   BAND PARTNER / BENEVOLE / CTA

   ============================================================ */

.be-band {

  border-radius: var(--radius-lg); padding: 3rem;

  display: grid; grid-template-columns: 1fr auto;

  gap: 2rem; align-items: center; margin-top: 3rem;

}

.be-band--light  { background: var(--green-50); border: 1px solid var(--green-100); }

.be-band--dark   { background: var(--green-900); }

.be-band h3 { font-family: 'DM Serif Display', serif; font-size: 1.6rem; margin-bottom: 0.5rem; }

.be-band--light h3 { color: var(--charcoal); }

.be-band--dark  h3 { color: var(--white); }

.be-band p { font-size: 15px; font-weight: 300; max-width: 480px; line-height: 1.6; }

.be-band--light p { color: var(--muted); }

.be-band--dark  p { color: rgba(255,255,255,0.6); }



/* CTA centrÃ© */

.be-cta-center { text-align: center; padding: 64px 0; }

.be-cta-center .be-title { margin: 0 auto 1rem; }

.be-cta-center .be-subtitle { margin: 0 auto 2rem; }

.be-cta-center-actions { display: flex; justify-content: center; gap: 1rem; flex-wrap: wrap; }



/* Zone notice */

.be-zone-notice {

  background: var(--white); border: 1px solid var(--sand-300);

  border-radius: var(--radius-lg); padding: 2rem;

  display: flex; gap: 1.5rem; align-items: flex-start; margin-bottom: 1.5rem;

}

.be-zone-notice__icon { font-size: 2rem; flex-shrink: 0; }

.be-zone-notice h4 { font-size: 16px; font-weight: 500; margin-bottom: 0.4rem; }

.be-zone-notice p { font-size: 14px; color: var(--muted); font-weight: 300; line-height: 1.6; }

.be-zone-notice a { color: var(--green-500); font-weight: 500; }



/* ============================================================

   FOOTER CUSTOM

   ============================================================ */

.be-footer-inner {

  max-width: 1100px; margin: 0 auto;

  padding: 3rem 2rem;

  display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 3rem;

}

.be-footer-brand h4 {

  font-family: 'DM Serif Display', serif;

  color: var(--white); font-size: 20px; margin-bottom: 0.75rem;

}

.be-footer-brand p { font-size: 13px; line-height: 1.6; max-width: 280px; color: rgba(255,255,255,0.5); }

.be-footer-col h5 {

  color: var(--white); font-size: 12px;

  letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 1rem;

}

.be-footer-col a {

  display: block; color: rgba(255,255,255,0.5) !important;

  text-decoration: none; font-size: 14px; margin-bottom: 0.5rem; transition: color 0.2s;

}

.be-footer-col a:hover { color: var(--white) !important; }

.be-footer-bottom {

  max-width: 1100px; margin: 0 auto;

  padding: 1.5rem 2rem;

  border-top: 1px solid rgba(255,255,255,0.1);

  display: flex; justify-content: space-between; align-items: center; font-size: 12px;

  color: rgba(255,255,255,0.4);

}

.be-footer-badge {

  display: inline-flex; align-items: center; gap: 6px;

  background: rgba(255,255,255,0.08);

  padding: 6px 12px; border-radius: 100px;

  font-size: 12px; color: rgba(255,255,255,0.4);

}



/* ============================================================

   RESPONSIVE

   ============================================================ */

@media (max-width: 1024px) {

  .be-reseau-flow { grid-template-columns: repeat(3, 1fr); }

}



@media (max-width: 900px) {

  .be-hero__inner     { grid-template-columns: 1fr; }

  .be-hero__visual    { display: none; }

  .be-steps-grid      { grid-template-columns: repeat(2, 1fr); }

  .be-step-sq:nth-child(2) { border-right: none; }

  .be-step-sq:nth-child(1),

  .be-step-sq:nth-child(2) { border-bottom: 1px solid var(--sand-300); }

  .be-impact-grid     { grid-template-columns: 1fr 1fr; }

  .be-collecte-grid   { grid-template-columns: 1fr 1fr; }

  .be-accept-grid     { grid-template-columns: 1fr; }

  .be-story-grid      { grid-template-columns: 1fr; gap: 2.5rem; }

  .be-values-grid     { grid-template-columns: 1fr 1fr; }

  .be-reseau-flow     { grid-template-columns: 1fr; }

  .be-reseau-step     { border-right: none !important; border-bottom: 1px solid rgba(255,255,255,0.1); }

  .be-contact-layout  { grid-template-columns: 1fr; }

  .be-band            { grid-template-columns: 1fr; }

  .be-footer-inner    { grid-template-columns: 1fr; gap: 2rem; }

  .be-footer-bottom   { flex-direction: column; gap: 1rem; text-align: center; }

}



@media (max-width: 600px) {

  .be-steps-grid      { grid-template-columns: 1fr; }

  .be-step-sq         { border-right: none !important; border-bottom: 1px solid var(--sand-300); }

  .be-impact-grid     { grid-template-columns: 1fr; }

  .be-collecte-grid   { grid-template-columns: 1fr; }

  .be-values-grid     { grid-template-columns: 1fr; }

  .be-step            { grid-template-columns: 50px 1fr; gap: 1rem; }

  .be-step__num       { font-size: 2.5rem; }

  .be-form-row        { grid-template-columns: 1fr; }

  .be-hero__content h1 { font-size: 2.2rem; }

}

/* ============================================================

   BOUCHONS EURELIENS - NETTOYAGE PIED DE PAGE (FOOTER)

   ============================================================ */



/* 1. FORCE LA COULEUR BLANCHE (TEXTES, LIENS, TITRES) */

.site-footer, 

.site-footer p, 

.site-footer span, 

.site-footer li, 

.site-footer a,

.site-footer .widget-title,

.site-footer .textwidget,

.inside-footer-widgets .widget-title,

.footer-widgets .widget {

    color: #ffffff !important;

}



/* Force les liens en blanc pur */

.site-footer a, 

.footer-widgets a, 

.site-info a {

    color: #ffffff !important;

    text-decoration: underline !important;

}



/* 2. RÃ‰DUCTION DRASTIQUE DE LA HAUTEUR DU BANDEAU NOIR */

/* On cible le conteneur principal de GeneratePress */

.site-footer .footer-widgets-container {

    padding-top: 25px !important;    /* RÃ©duit le vide en haut */

    padding-bottom: 0px !important;  /* Supprime le vide en bas avant le copyright */

}



/* On supprime les marges internes des colonnes de widgets */

.site-footer .inside-footer-widgets {

    margin-bottom: 0px !important;

}



/* On rÃ©duit l'espace sous chaque widget individuel */

.site-footer .footer-widgets .widget {

    padding-bottom: 5px !important;

    margin-bottom: 10px !important;

}



/* 3. RÃ‰DUCTION DE LA BARRE DE COPYRIGHT TOUT EN BAS */

.site-info {

    padding-top: 10px !important;

    padding-bottom: 10px !important;

    margin-top: 5px !important; /* Rapproche la barre des widgets */

    background-color: rgba(255,255,255,0.03) !important;

}



/* 4. TAILLE DES TITRES DU FOOTER */

.site-footer .widget-title {

    margin-bottom: 10px !important;

    font-size: 17px !important;

    text-transform: uppercase;

    letter-spacing: 1px;

}

/* ============================================================
   BOUCHONS EURELIENS - STYLE RESEAU COEUR2
   ============================================================ */

:root {
  --green-50: #eef8ed;
  --green-100: #d6ecd2;
  --green-300: #7ac66f;
  --green-500: #2f8f46;
  --green-700: #17612f;
  --green-900: #102a1a;
  --sand-50: #fbfaf6;
  --sand-100: #f1ede4;
  --sand-300: #ddd4c5;
  --charcoal: #162018;
  --muted: #5c675f;
  --accent: #e36b2c;
  --blue: #245f9f;
  --radius: 8px;
  --radius-lg: 8px;
  --shadow-md: 0 18px 48px rgba(22,32,24,0.11);
}

body {
  background: var(--sand-50) !important;
}

.site-header,
.site-header .header-inner {
  background: rgba(255,255,255,0.92) !important;
  border-bottom: 1px solid rgba(22,32,24,0.08) !important;
}

.be-container {
  max-width: 1180px;
}

.be-network h1,
.be-network h2,
.be-network h3 {
  letter-spacing: 0;
}

.be-network-pill {
  display: inline-flex;
  width: fit-content;
  margin-bottom: 1.25rem;
  padding: 7px 14px;
  border: 1px solid rgba(255,255,255,0.32);
  border-radius: 999px;
  background: rgba(255,255,255,0.13);
  color: inherit;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.be-network-hero {
  padding: 116px 0 76px;
  background:
    linear-gradient(115deg, rgba(16,42,26,0.96) 0%, rgba(23,97,47,0.9) 48%, rgba(238,248,237,0.92) 48%, rgba(251,250,246,0.98) 100%);
  color: var(--white);
}

.be-network-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 0.88fr);
  gap: 4rem;
  align-items: center;
}

.be-network-hero h1,
.be-page-hero h1,
.be-final-network h2 {
  margin: 0 0 1.25rem;
  font-family: 'DM Serif Display', serif;
  font-size: clamp(3rem, 6vw, 5.8rem);
  line-height: 0.98;
  color: inherit;
}

.be-network-hero__content p {
  max-width: 680px;
  margin: 0 0 2.2rem;
  padding: 1.15rem 1.25rem;
  border-left: 4px solid var(--green-300);
  border-radius: 8px;
  background: rgba(16,42,26,0.74);
  color: rgba(255,255,255,0.96);
  font-size: 19px;
  font-weight: 300;
  line-height: 1.7;
}

.be-network-actions {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  align-items: center;
}

.be-network-hero__card {
  position: relative;
}

.be-network-hero__card img {
  width: 100%;
  min-height: 430px;
  display: block;
  object-fit: cover;
  border: 1px solid rgba(255,255,255,0.38);
  border-radius: 8px;
  box-shadow: 0 24px 80px rgba(0,0,0,0.26);
}

.be-network-hero__badge {
  position: absolute;
  right: 18px;
  bottom: 18px;
  left: 18px;
  display: grid;
  gap: 4px;
  padding: 15px 17px;
  border-radius: 8px;
  background: rgba(255,255,255,0.94);
  color: var(--charcoal);
  box-shadow: 0 18px 38px rgba(0,0,0,0.18);
}

.be-network-hero__badge span {
  color: var(--muted);
  font-size: 14px;
}

.be-network-stats {
  background: var(--green-900);
  color: var(--white);
}

.be-network-stats__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-left: 1px solid rgba(255,255,255,0.14);
}

.be-network-stats__grid div {
  padding: 24px;
  border-right: 1px solid rgba(255,255,255,0.14);
}

.be-network-stats__grid strong {
  display: block;
  color: var(--green-300);
  font-family: 'DM Serif Display', serif;
  font-size: 2.35rem;
  line-height: 1;
}

.be-network-stats__grid span {
  color: rgba(255,255,255,0.66);
  font-size: 13px;
}

.be-network-heading {
  max-width: 720px;
  margin-bottom: 2.5rem;
}

.be-network-heading--center {
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}

.be-network-heading--center .be-subtitle {
  margin-right: auto;
  margin-left: auto;
}

.be-material-grid,
.be-process-grid,
.be-help-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}

.be-material-card,
.be-process-grid article,
.be-c2b-module,
.be-info-stack > div,
.be-volunteer,
.be-local-card,
.be-poster-callout,
.be-accept-modern > div {
  border: 1px solid rgba(22,32,24,0.10);
  border-radius: 8px;
  background: var(--white);
  box-shadow: none;
}

.be-material-card {
  min-height: 260px;
  padding: 1.75rem;
  border-top: 5px solid var(--green-500);
}

.be-material-card--cork { border-top-color: #a86f3c; }
.be-material-card--metal { border-top-color: var(--blue); }

.be-material-card span,
.be-process-grid article span {
  display: inline-flex;
  margin-bottom: 1.3rem;
  color: var(--green-700);
  font-weight: 900;
  letter-spacing: 0.14em;
}

.be-material-card h3,
.be-process-grid h3 {
  margin: 0 0 0.7rem;
  color: var(--charcoal);
  font-size: 22px;
  line-height: 1.2;
}

.be-material-card p,
.be-process-grid p,
.be-local-card p,
.be-accept-modern li {
  color: var(--muted);
  font-size: 15px;
  line-height: 1.65;
}

.be-material-card small,
.be-process-grid small {
  display: inline-flex;
  margin-top: 1rem;
  color: var(--green-700);
  font-weight: 800;
}

.be-reflex {
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
  align-items: center;
  margin-top: 1rem;
  padding: 1.25rem 1.5rem;
  border: 1px solid var(--green-100);
  border-radius: 8px;
  background: var(--green-50);
}

.be-reflex strong {
  color: var(--green-900);
  white-space: nowrap;
}

.be-reflex p {
  margin: 0;
  color: var(--green-900);
}

.be-process-grid {
  grid-template-columns: repeat(4, 1fr);
}

.be-process-grid--large {
  grid-template-columns: repeat(2, 1fr);
}

.be-process-grid article {
  padding: 1.6rem;
}

.be-network-split {
  display: grid;
  grid-template-columns: 0.9fr 1fr;
  gap: 3rem;
  align-items: end;
  margin-bottom: 2.5rem;
}

.be-network-split > p {
  margin: 0;
  color: rgba(255,255,255,0.72);
  font-size: 18px;
  font-weight: 300;
  line-height: 1.7;
}

.be-network-split--light {
  align-items: center;
  margin-bottom: 0;
  padding: 2rem;
  border: 1px solid rgba(22,32,24,0.10);
  border-radius: 8px;
  background: var(--white);
}

.be-network-flow {
  display: grid;
  gap: 0.75rem;
}

.be-network-flow div {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 0.9rem;
  align-items: center;
  padding: 1rem;
  border-radius: 8px;
  background: var(--green-50);
}

.be-network-flow strong {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border-radius: 50%;
  background: var(--green-700);
  color: var(--white);
}

.be-local-card {
  display: grid;
  grid-template-columns: 0.32fr 1fr;
  gap: 2rem;
  padding: 2rem;
}

.be-local-card__number {
  color: var(--green-700);
  font-family: 'DM Serif Display', serif;
  font-size: clamp(3rem, 7vw, 6rem);
  line-height: 0.9;
}

.be-local-card h3,
.be-poster-callout h2 {
  margin-top: 0;
}

.be-local-card ul {
  margin: 1rem 0 0;
  color: var(--muted);
}

.be-poster-callout {
  display: grid;
  grid-template-columns: minmax(260px, 0.7fr) 1fr;
  gap: 2.5rem;
  align-items: center;
  padding: 2rem;
}

.be-poster-callout__visual {
  aspect-ratio: 0.75;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 1.7rem;
  border-radius: 8px;
  background: linear-gradient(150deg, var(--green-700), var(--green-900));
  color: var(--white);
}

.be-poster-callout__visual span {
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.be-poster-callout__visual strong {
  font-family: 'DM Serif Display', serif;
  font-size: clamp(2rem, 5vw, 4rem);
  line-height: 0.95;
}

.be-final-network {
  padding: 78px 0;
  background: var(--accent);
  color: var(--white);
  text-align: center;
}

.be-final-network h2 {
  max-width: 840px;
  margin: 0 auto 1rem;
}

.be-final-network p {
  max-width: 620px;
  margin: 0 auto 1.8rem;
  color: rgba(255,255,255,0.82);
  font-size: 18px;
}

.be-final-network .be-network-actions {
  justify-content: center;
}

.be-btn--white {
  background: var(--white);
  color: var(--green-900) !important;
}

.be-page-hero {
  padding: 138px 0 70px;
  background: linear-gradient(120deg, var(--green-900), var(--green-700));
  color: var(--white);
}

.be-page-hero p {
  max-width: 680px;
  color: rgba(255,255,255,0.78);
  font-size: 19px;
}

.be-c2b-module {
  max-width: 980px;
  margin: 0 auto;
  padding: 2rem;
}

.be-c2b-brand {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  margin-bottom: 1rem;
  color: var(--muted);
}

.be-c2b-brand span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--blue);
}

.be-c2b-brand span:nth-child(2) { background: var(--green-500); }
.be-c2b-brand span:nth-child(3) { background: var(--accent); }

.be-c2b-module h2 {
  margin: 0 0 0.5rem;
  font-family: 'DM Serif Display', serif;
  font-size: clamp(2rem, 4vw, 3rem);
}

.be-c2b-searchbar {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 0.75rem;
  margin: 1.5rem 0;
}

.be-c2b-searchbar input {
  min-width: 0;
  padding: 13px 15px;
  border: 1px solid var(--sand-300);
  border-radius: 999px;
  background: var(--sand-50);
  font: inherit;
}

.be-c2b-results {
  margin-top: 1rem;
}

.be-c2b-card,
.be-c2b-empty {
  padding: 1.5rem;
  border: 1px solid var(--green-100);
  border-radius: 8px;
  background: var(--green-50);
}

.be-c2b-card h3 {
  margin-top: 0;
}

.be-c2b-meta {
  display: grid;
  gap: 0.75rem;
}

.be-c2b-meta div {
  display: grid;
  grid-template-columns: 170px 1fr;
  gap: 1rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(22,32,24,0.10);
}

.be-c2b-meta strong {
  color: var(--green-700);
}

.be-c2b-partners {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(22,32,24,0.10);
}

.be-c2b-partners h4 {
  margin: 0 0 0.75rem;
  color: var(--green-700);
}

.be-c2b-partners ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.55rem 1rem;
  margin: 0;
  padding-left: 1.1rem;
  color: var(--muted);
  font-size: 14px;
}

.be-c2b-partners article {
  margin-top: 0.75rem;
  padding: 1rem;
  border: 1px solid rgba(22,32,24,0.10);
  border-radius: 8px;
  background: var(--white);
}

.be-c2b-partners h5 {
  margin: 0 0 0.5rem;
  color: var(--charcoal);
}

.be-c2b-empty {
  display: grid;
  gap: 0.5rem;
  background: #fff7f2;
  border-color: #efccb8;
}

.be-c2b-small,
.be-collecte-note {
  color: var(--muted);
  font-size: 14px;
}

.be-collecte-note {
  max-width: 980px;
  margin: 1.25rem auto 0;
  text-align: center;
}

.be-info-stack {
  display: grid;
  gap: 0.75rem;
}

.be-info-stack > div {
  display: grid;
  gap: 0.35rem;
  padding: 1.1rem;
}

.be-info-stack strong {
  color: var(--green-700);
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.be-benevole-img-container {
  position: relative;
  width: 80px;
  height: 80px;
  flex: 0 0 80px;
  overflow: hidden;
  border-radius: 50%;
  box-shadow: 0 0 0 4px var(--white), 0 10px 24px rgba(22,32,24,0.14);
  background: var(--green-50);
}

.be-benevole-img-container img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform 0.22s ease, filter 0.22s ease;
}

.be-benevole-img-container::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: rgba(16,42,26,0.58);
  opacity: 0;
  transition: opacity 0.2s ease;
}

.be-benevole-img-container::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 2;
  width: 30px;
  height: 30px;
  border: 3px solid var(--white);
  border-radius: 50%;
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.8);
  transition: opacity 0.2s ease, transform 0.2s ease;
  box-shadow: 12px 12px 0 -9px var(--white);
}

.be-benevole-img-container:hover::before,
.be-benevole-img-container:hover::after {
  opacity: 1;
}

.be-benevole-img-container:hover::after {
  transform: translate(-50%, -50%) scale(1);
}

.be-benevole-img-container:hover img {
  transform: scale(1.14);
  filter: saturate(1.08);
}

.be-leads-grid,
.be-volunteer-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}

.be-volunteer-grid {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.be-volunteer {
  padding: 1.2rem;
  text-align: center;
}

.be-volunteer--lead {
  display: flex;
  gap: 1.2rem;
  align-items: center;
  text-align: left;
}

.be-volunteer-photo {
  position: relative;
  width: 96px;
  height: 96px;
  margin: 0 auto 1rem;
  overflow: hidden;
  border-radius: 50%;
  box-shadow: 0 0 0 4px var(--white), 0 12px 30px rgba(22,32,24,0.14);
}

.be-volunteer--lead .be-volunteer-photo {
  flex: 0 0 104px;
  width: 104px;
  height: 104px;
  margin: 0;
}

.be-volunteer-photo img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform 0.22s ease, filter 0.22s ease;
}

.be-volunteer-photo::after {
  content: "Loupe";
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: rgba(16,42,26,0.62);
  color: var(--white);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.be-volunteer-photo:hover::after {
  opacity: 1;
}

.be-volunteer-photo:hover img {
  transform: scale(1.14);
  filter: saturate(1.08);
}

.be-team-photo {
  margin: 2rem 0 2.5rem;
  overflow: hidden;
  border-radius: 8px;
  background: var(--white);
}

.be-team-photo img {
  width: 100%;
  display: block;
}

.be-team-photo p {
  margin: 0;
  padding: 1rem;
  color: var(--green-700);
  font-weight: 800;
  text-align: center;
}

.be-team-title {
  margin: 2.2rem 0 1.2rem;
  color: var(--green-700);
  text-align: center;
}

.be-accept-modern {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

.be-accept-modern > div {
  padding: 1.5rem;
}

.be-accept-modern h3 {
  color: var(--green-700);
}

.be-contact-layout--network {
  grid-template-columns: 0.75fr 1fr;
}

.be-form-card select {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--sand-300);
  border-radius: var(--radius);
  background: var(--sand-50);
  font: inherit;
}

@media (max-width: 1000px) {
  .be-network-hero {
    background: linear-gradient(120deg, var(--green-900), var(--green-700));
  }

  .be-network-hero__grid,
  .be-network-split,
  .be-local-card,
  .be-poster-callout,
  .be-contact-layout--network {
    grid-template-columns: 1fr;
  }

  .be-network-stats__grid,
  .be-process-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 700px) {
  .be-material-grid,
  .be-process-grid,
  .be-process-grid--large,
  .be-accept-modern,
  .be-leads-grid {
    grid-template-columns: 1fr;
  }

  .be-network-stats__grid {
    grid-template-columns: 1fr;
    border-left: none;
  }

  .be-network-stats__grid div {
    border-right: none;
    border-bottom: 1px solid rgba(255,255,255,0.14);
  }

  .be-network-hero__card img {
    min-height: 290px;
  }

  .be-reflex,
  .be-volunteer--lead {
    align-items: flex-start;
    flex-direction: column;
  }

  .be-c2b-searchbar {
    grid-template-columns: 1fr;
  }

  .be-c2b-meta div {
    grid-template-columns: 1fr;
    gap: 0.25rem;
  }

  .be-c2b-partners ul {
    grid-template-columns: 1fr;
  }
}
/* Correction lisibilitÃ© pavÃ© intro accueil */
.be-network-hero__content p,
.be-network-hero p {
  background: rgba(16, 42, 26, 0.92) !important;
  color: #ffffff !important;
  border-left: 4px solid var(--green-300) !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.35);
}

.be-network-hero__content p strong,
.be-network-hero p strong {
  color: #ffffff !important;
}
.be-material-card small a {
  color: var(--green-700);
  font-weight: 800;
  text-decoration: none;
}

.be-material-card small a:hover {
  text-decoration: underline;
}

/* ============================================================
   HABILLAGE BOUCHONS FRANCILIENS
   ============================================================ */

:root {
  --green-50: var(--bf-soft);
  --green-100: var(--bf-border);
  --green-300: var(--bf-green);
  --green-500: var(--bf-blue);
  --green-700: var(--bf-blue-dark);
  --green-900: var(--bf-ink);
  --sand-50: var(--bf-soft);
  --sand-100: #edf5ff;
  --sand-300: var(--bf-border);
  --charcoal: var(--bf-ink);
  --muted: var(--bf-muted);
  --accent: var(--bf-red);
  --radius: 8px;
  --radius-lg: 8px;
  --shadow-sm: 0 4px 12px rgba(20, 32, 51, .06);
  --shadow-md: 0 14px 34px rgba(20, 32, 51, .08);
}

body {
  margin: 0;
  font-family: Nunito, Arial, sans-serif !important;
  background: var(--bf-soft) !important;
  color: var(--bf-ink) !important;
  font-size: 17px;
  line-height: 1.65;
}

a {
  color: var(--bf-blue);
  text-decoration-thickness: .08em;
  text-underline-offset: .18em;
}

a:hover {
  color: var(--bf-red);
}

.site-header,
.site-header .header-inner {
  background: rgba(255, 255, 255, .96) !important;
  border-bottom: 1px solid rgba(223, 231, 240, .9) !important;
  backdrop-filter: blur(14px);
}

.site-header {
  position: sticky !important;
}

.site-content {
  padding-top: 0 !important;
}

.site-branding {
  position: relative;
  padding-left: 60px;
}

.site-branding::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--bf-blue);
  transform: translateY(-50%);
  box-shadow: 20px 0 0 var(--bf-green), 40px 0 0 var(--bf-red);
}

.site-branding .site-title a,
.be-network h1,
.be-network h2,
.be-network h3,
.be-title,
.be-page-header h1,
.be-form-card h2,
.be-story-content h2,
.be-final-network h2 {
  font-family: "Baloo 2", Nunito, Arial, sans-serif !important;
  letter-spacing: 0 !important;
}

.site-branding .site-title a {
  color: var(--bf-ink) !important;
  font-size: 1.18rem !important;
  font-weight: 900 !important;
}

.site-branding .site-description {
  color: var(--bf-muted) !important;
  font-size: .8rem !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  text-transform: none;
}

.main-navigation a {
  color: #27364a !important;
  font-family: Nunito, Arial, sans-serif !important;
  font-size: .91rem !important;
  font-weight: 850 !important;
  border-radius: var(--bf-radius, 8px);
  text-decoration: none;
}

.main-navigation a:hover,
.main-navigation .current-menu-item > a {
  background: #edf5ff !important;
  color: var(--bf-blue) !important;
}

.main-navigation .nav-cta > a {
  background: var(--bf-red) !important;
  color: var(--white) !important;
  border-radius: 8px !important;
  font-weight: 900 !important;
}

.main-navigation .nav-cta > a:hover {
  background: #b9302d !important;
  color: var(--white) !important;
}

.be-container {
  width: min(1160px, calc(100% - 40px));
}

.be-section {
  padding: 84px 0;
}

.be-section--white {
  background: var(--bf-white, #fff);
}

.be-section--tinted {
  background: var(--bf-soft);
  border-color: var(--bf-border);
}

.be-network-hero {
  background:
    radial-gradient(circle at 78% 16%, rgba(47, 155, 99, .16), transparent 30%),
    linear-gradient(135deg, #ffffff 0%, #f4f7fb 58%, #edf5ff 100%) !important;
  color: var(--bf-ink);
  padding: 92px 0 80px;
}

.be-network-hero__grid {
  gap: clamp(2rem, 5vw, 5rem);
}

.be-network-pill,
.be-label,
.be-tag {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  color: var(--bf-blue) !important;
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.be-network-pill::before,
.be-label::before,
.be-tag::before {
  content: "";
  width: 34px;
  height: 6px;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--bf-blue) 0 34%, var(--bf-green) 34% 68%, var(--bf-red) 68%);
}

.be-network-hero h1,
.be-title,
.be-page-header h1 {
  color: var(--bf-ink) !important;
  font-weight: 800;
  line-height: .98;
}

.be-network-hero h1 {
  font-size: clamp(3.1rem, 7vw, 5.5rem);
  max-width: 820px;
}

.be-network-hero__content p,
.be-network-hero p {
  max-width: 720px;
  padding: 0 !important;
  background: transparent !important;
  border-left: 0 !important;
  color: var(--bf-muted) !important;
  font-size: 1.12rem;
  font-weight: 700;
  text-shadow: none !important;
}

.be-network-actions,
.be-hero__actions,
.be-cta-center-actions {
  gap: .75rem;
}

.be-btn,
.be-btn-submit {
  min-height: 46px;
  padding: .75rem 1.05rem;
  border-radius: 8px !important;
  font-family: Nunito, Arial, sans-serif !important;
  font-weight: 900 !important;
  box-shadow: none;
}

.be-btn--primary,
.be-btn-submit {
  background: var(--bf-blue) !important;
  color: #fff !important;
}

.be-btn--primary:hover,
.be-btn-submit:hover {
  background: var(--bf-blue-dark) !important;
  transform: translateY(-1px);
}

.be-btn--secondary {
  background: #fff !important;
  border: 2px solid var(--bf-border) !important;
  color: var(--bf-blue-dark) !important;
}

.be-btn--secondary:hover {
  border-color: var(--bf-blue) !important;
  color: var(--bf-blue) !important;
}

.be-btn--white {
  background: #fff !important;
  color: var(--bf-blue-dark) !important;
}

.be-network-hero__card,
.be-card,
.be-material-card,
.be-process-grid article,
.be-local-card,
.be-poster-callout,
.be-contact-card,
.be-form-card,
.be-info-card,
.be-value-card,
.be-collecte-card,
.be-zone-notice,
.be-accept-col {
  border: 1px solid var(--bf-border) !important;
  border-radius: 8px !important;
  box-shadow: var(--shadow-md) !important;
}

.be-network-hero__card {
  background: #fff;
  padding: .75rem;
}

.be-network-hero__card img {
  border-radius: 6px;
}

.be-network-hero__badge {
  left: 1.5rem;
  right: 1.5rem;
  bottom: 1.5rem;
  background: rgba(255, 255, 255, .94);
  color: var(--bf-ink);
  border: 1px solid var(--bf-border);
  border-radius: 8px;
}

.be-network-hero__badge span {
  color: var(--bf-muted);
}

.be-network-stats,
.be-final-network {
  background: var(--bf-blue-dark) !important;
}

.be-network-stats__grid {
  border-color: rgba(255, 255, 255, .18);
}

.be-network-stats__grid div {
  border-color: rgba(255, 255, 255, .18);
}

.be-network-stats__grid strong {
  color: #fff;
  font-family: "Baloo 2", Nunito, Arial, sans-serif;
}

.be-network-stats__grid span {
  color: rgba(255, 255, 255, .78);
  font-weight: 800;
}

.be-material-card,
.be-process-grid article {
  background: #fff;
}

.be-material-card {
  border-top: 7px solid var(--bf-blue) !important;
}

.be-material-card--cork {
  border-top-color: var(--bf-green) !important;
}

.be-material-card--metal {
  border-top-color: var(--bf-red) !important;
}

.be-material-card span,
.be-process-grid article span,
.be-local-card__number {
  color: var(--bf-blue);
  font-family: "Baloo 2", Nunito, Arial, sans-serif;
  font-weight: 800;
}

.be-material-card p,
.be-process-grid p,
.be-local-card p,
.be-subtitle,
.be-story-content p,
.be-value-card p,
.be-contact-card__note {
  color: var(--bf-muted) !important;
}

.be-reflex,
.be-network-split--light {
  background: linear-gradient(135deg, #edf5ff, #ffffff);
  border: 1px solid var(--bf-border);
  border-radius: 8px;
}

.be-reflex strong,
.be-local-card h3,
.be-poster-callout h2,
.be-team-title,
.be-accept-modern h3 {
  color: var(--bf-blue-dark) !important;
}

.be-network-flow strong {
  background: var(--bf-blue);
}

.be-poster-callout__visual {
  background: linear-gradient(135deg, var(--bf-blue), var(--bf-green)) !important;
  border-radius: 8px;
}

.be-final-network {
  background:
    radial-gradient(circle at 15% 20%, rgba(47, 155, 99, .24), transparent 28%),
    linear-gradient(135deg, var(--bf-blue-dark), var(--bf-blue)) !important;
}

.be-final-network h2,
.be-final-network p {
  color: #fff !important;
}

.site-footer {
  background: var(--bf-ink) !important;
}

.site-footer h4,
.site-footer h5 {
  font-family: "Baloo 2", Nunito, Arial, sans-serif !important;
}

.site-info {
  display: none !important;
}

table th {
  color: var(--bf-blue) !important;
}

table tr {
  border-color: var(--bf-border) !important;
}

@media (max-width: 1000px) {
  .be-network-hero {
    background: linear-gradient(135deg, #ffffff, #edf5ff) !important;
  }
}

@media (max-width: 700px) {
  .be-container {
    width: min(100% - 24px, 1160px);
  }

  .site-branding {
    padding-left: 54px;
  }

  .be-network-hero {
    padding: 64px 0 56px;
  }

  .be-network-hero h1 {
    font-size: clamp(2.45rem, 14vw, 3.4rem);
  }

  .be-network-actions .be-btn,
  .be-cta-center-actions .be-btn {
    width: 100%;
  }
}

/* ============================================================
   CORRECTIONS MOBILE FINALES
   ============================================================ */

@media (max-width: 768px) {
  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  body {
    font-size: 16px;
  }

  .site-header {
    position: sticky !important;
    top: 0;
  }

  .inside-header,
  .site-header .header-inner {
    min-height: auto !important;
    padding: 10px 14px !important;
    gap: 10px;
  }

  .site-branding {
    max-width: calc(100vw - 92px);
    min-width: 0;
    padding-left: 48px !important;
  }

  .site-branding::before {
    width: 13px;
    height: 13px;
    box-shadow: 17px 0 0 var(--bf-green), 34px 0 0 var(--bf-red);
  }

  .site-branding .site-title,
  .site-branding .site-title a {
    max-width: 100%;
    overflow-wrap: anywhere;
    font-size: 1rem !important;
    line-height: 1.05 !important;
  }

  .site-branding .site-description {
    display: none !important;
  }

  .menu-toggle,
  .main-navigation .menu-toggle {
    border-radius: 8px !important;
    background: #edf5ff !important;
    color: var(--bf-blue-dark) !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    padding: 11px 12px !important;
  }

  .main-navigation {
    width: auto !important;
  }

  .main-navigation.toggled,
  .main-navigation.has-inline-mobile-toggle.toggled {
    width: 100% !important;
    clear: both;
  }

  .main-navigation.toggled .main-nav,
  .main-navigation.toggled .main-nav > ul,
  .main-navigation.toggled ul {
    width: 100% !important;
  }

  .main-navigation.toggled .main-nav ul {
    display: grid !important;
    gap: 6px;
    padding: 10px 0 4px !important;
    background: #fff !important;
  }

  .main-navigation.toggled .main-nav ul li {
    width: 100% !important;
  }

  .main-navigation.toggled .main-nav ul li a {
    width: 100%;
    padding: 12px 14px !important;
    border-radius: 8px !important;
  }

  .be-container {
    width: min(100% - 24px, 1160px) !important;
  }

  .be-section {
    padding: 48px 0 !important;
  }

  .be-network-hero {
    padding: 44px 0 38px !important;
  }

  .be-network-hero__grid,
  .be-network-split,
  .be-local-card,
  .be-poster-callout,
  .be-contact-layout,
  .be-contact-layout--network,
  .be-story-grid,
  .be-band {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 22px !important;
  }

  .be-network-hero h1,
  .be-page-header h1 {
    font-size: clamp(2.15rem, 11vw, 2.85rem) !important;
    line-height: 1.02 !important;
  }

  .be-title,
  .be-final-network h2 {
    font-size: clamp(1.85rem, 9vw, 2.35rem) !important;
    line-height: 1.06 !important;
  }

  .be-network-hero__content p,
  .be-network-hero p,
  .be-subtitle,
  .be-page-header p {
    max-width: 100% !important;
    font-size: 1rem !important;
    line-height: 1.58 !important;
  }

  .be-network-pill,
  .be-label,
  .be-tag {
    align-items: flex-start;
    max-width: 100%;
    font-size: .7rem !important;
    line-height: 1.25;
    overflow-wrap: anywhere;
  }

  .be-network-pill::before,
  .be-label::before,
  .be-tag::before {
    flex: 0 0 28px;
    width: 28px;
    margin-top: .28rem;
  }

  .be-network-actions,
  .be-hero__actions,
  .be-cta-center-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100%;
  }

  .be-btn,
  .be-btn-submit {
    width: 100% !important;
    justify-content: center;
    text-align: center;
    white-space: normal;
  }

  .be-network-hero__card {
    padding: 8px !important;
  }

  .be-network-hero__card img {
    min-height: 240px !important;
    max-height: 360px;
    object-fit: cover;
  }

  .be-network-hero__badge {
    position: static !important;
    margin-top: 8px;
  }

  .be-network-stats__grid,
  .be-material-grid,
  .be-process-grid,
  .be-process-grid--large,
  .be-values-grid,
  .be-leads-grid,
  .be-accept-modern,
  .be-accept-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .be-network-stats__grid {
    border-left: 0 !important;
    border-top: 1px solid rgba(255, 255, 255, .18);
  }

  .be-network-stats__grid div {
    border-right: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, .18) !important;
    padding: 22px 12px !important;
  }

  .be-card,
  .be-material-card,
  .be-process-grid article,
  .be-local-card,
  .be-poster-callout,
  .be-contact-card,
  .be-form-card,
  .be-info-card,
  .be-value-card,
  .be-collecte-card,
  .be-zone-notice,
  .be-accept-col,
  .be-reflex,
  .be-network-split--light {
    padding: 18px !important;
  }

  .be-card[style*="display: flex"],
  .be-reflex,
  .be-volunteer--lead {
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  .be-local-card__number {
    font-size: clamp(2.4rem, 18vw, 4rem) !important;
  }

  .be-network-flow {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .be-network-flow div {
    grid-template-columns: 38px 1fr !important;
  }

  .be-poster-callout__visual {
    min-height: 0 !important;
  }

  .be-contact-card {
    display: grid !important;
    grid-template-columns: 44px 1fr !important;
    gap: 12px !important;
  }

  .be-contact-card__value,
  .be-contact-card__note,
  .be-contact-card__label {
    overflow-wrap: anywhere;
  }

  .be-form-row {
    grid-template-columns: 1fr !important;
  }

  .be-form-group input,
  .be-form-group textarea,
  .be-form-group select {
    font-size: 16px !important;
  }

  .be-team-photo,
  .be-benevole-img-container,
  .be-volunteer-photo {
    max-width: 100%;
  }

  .be-volunteer--lead .be-volunteer-photo {
    flex-basis: auto !important;
  }

  .be-footer-inner {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    padding: 0 18px !important;
  }

  .be-footer-brand p {
    max-width: none !important;
  }

  .be-footer-bottom {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    justify-items: start !important;
    text-align: left !important;
    padding-inline: 18px !important;
  }

  table {
    font-size: .92rem;
  }
}

@media (max-width: 420px) {
  .be-network-hero h1,
  .be-page-header h1 {
    font-size: 2rem !important;
  }

  .be-title,
  .be-final-network h2 {
    font-size: 1.75rem !important;
  }

  .be-card,
  .be-material-card,
  .be-process-grid article,
  .be-local-card,
  .be-poster-callout,
  .be-contact-card,
  .be-form-card {
    padding: 16px !important;
  }
}
