/* ============================================================
   TRIVALCO — CSS GLOBAL STABLE
   Refonte complète à partir du index.html actuellement en ligne.
   Aucune hauteur fixe sur les rubriques : modifier une page ne décale
   plus les suivantes. L'accueil seul est compacté pour tenir à l'écran.
   ============================================================ */

:root{
  --forest:#123f2b;
  --forest2:#1f5a3c;
  --green:#2f8f3a;
  --lime:#b9df45;
  --lime-soft:#eff7d0;
  --ivory:#fffdf7;
  --paper:#ffffff;
  --muted:#5d7065;
  --line:#dce6dc;
  --shadow:0 12px 30px rgba(18,63,43,.08);
  --radius:18px;
  --trees:url("assets/arbres-aquarelle-hero.png?v=stable20260829");
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  overflow-x:hidden;
  color:var(--forest);
  background:var(--ivory);
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.5;
}
img{display:block;max-width:100%;height:auto}
a{text-decoration:none;color:inherit}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
.wrap{width:min(1480px,90%);margin-inline:auto}

/* ---------- HEADER ---------- */
.site-header{
  position:sticky;
  top:0;
  z-index:1000;
  background:rgba(255,255,255,.985);
  border-top:4px solid var(--lime);
  border-bottom:1px solid var(--line);
}
.site-header .nav{
  width:min(1760px,96%);
  min-height:92px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}
.brand-official{
  width:250px;
  flex:0 0 250px;
  display:flex;
  align-items:center;
}
.brand-official img{
  width:100%;
  max-width:250px;
  max-height:70px;
  object-fit:contain;
  object-position:left center;
}
.menu-toggle{
  display:none;
  border:0;
  background:transparent;
  color:var(--forest);
  font-size:28px;
}
#mainMenu{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:nowrap;
  white-space:nowrap;
  gap:2px;
}
#mainMenu a{
  padding:9px 8px;
  border-radius:10px;
  font-size:13px;
  font-weight:800;
  transition:.15s ease;
}
#mainMenu a:hover,
#mainMenu a.active{
  background:var(--lime-soft);
}
#mainMenu .admin-nav{
  margin-left:4px;
  border:1px solid #9fb4a6;
  background:#fff;
}

/* ---------- TYPO ---------- */
h1,h2,h3,p{margin-top:0}
h1,h2,h3{line-height:1.08;color:var(--forest)}
h1{font-size:clamp(38px,3.45vw,54px);margin-bottom:14px}
h2{font-size:clamp(30px,2.5vw,44px);margin-bottom:12px}
h3{font-size:21px;margin-bottom:8px}
.tag{
  display:inline-block;
  margin-bottom:10px;
  color:#6c9300;
  font-size:13px;
  font-weight:900;
  letter-spacing:.13em;
}
.lead,.large-text{font-size:17px;color:#2d4f3b}

/* ---------- BUTTONS ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:10px 18px;
  border:1px solid var(--green);
  border-radius:12px;
  background:var(--green);
  color:#fff;
  font-weight:900;
}
.btn:hover{background:#277b31}
.btn.ghost,.ghost{
  background:#fff;
  color:var(--forest);
  border-color:#9fb5a5;
}
.btn.ghost:hover,.ghost:hover{background:var(--lime-soft)}
.light-btn{background:var(--green)!important;color:#fff!important}

/* ============================================================
   ACCUEIL — SEULE SECTION AVEC HAUTEUR CALÉE SUR L'ÉCRAN
   ============================================================ */
#accueil.hero{
  min-height:calc(100vh - 96px);
  padding:20px 0 14px;
  background-color:var(--ivory);
  background-image:
    linear-gradient(90deg,rgba(255,253,247,.88) 0%,rgba(255,253,247,.82) 38%,rgba(255,253,247,.46) 62%,rgba(255,253,247,.16) 100%),
    var(--trees);
  background-repeat:no-repeat,no-repeat;
  background-position:center,center bottom;
  background-size:cover,100% 220px;
  scroll-margin-top:96px;
}
.hero-grid{
  min-height:calc(100vh - 135px);
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(440px,.9fr);
  gap:28px;
  align-items:center;
}
.hero-copy{max-width:680px}
.hero-copy p{font-size:17px;line-height:1.42;margin-bottom:10px}
.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:15px}
.trust-row{display:flex;flex-wrap:wrap;gap:13px;margin-top:12px;font-size:14px;font-weight:800}
.hero-visual{max-width:590px;justify-self:end;position:relative}
.hero-visual>img{
  width:100%;
  max-height:390px;
  object-fit:contain;
  border-radius:20px;
  box-shadow:var(--shadow);
}
.hero-card{
  position:absolute;
  right:12px;
  bottom:10px;
  padding:10px 13px;
  border-radius:13px;
  background:rgba(255,255,255,.97);
  box-shadow:var(--shadow);
}
.hero-card strong,.hero-card span{display:block}
.hero-card strong{font-size:16px}
.hero-card span{font-size:11px;color:var(--muted)}

/* ---------- STATS ---------- */
.stats-strip{background:#fff;border-block:1px solid var(--line)}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);min-height:70px}
.stats-grid div{display:grid;place-items:center;text-align:center;padding:8px;position:relative}
.stats-grid div:not(:last-child)::after{
  content:"";position:absolute;right:0;top:20%;height:60%;width:1px;background:var(--line)
}
.stats-grid strong{display:block;font-size:21px}
.stats-grid span{display:block;font-size:12px;color:var(--muted)}

/* ============================================================
   TOUTES LES RUBRIQUES APRÈS L'ACCUEIL
   Même rythme vertical, aucune hauteur fixe, aucun translate.
   Les arbres sont un décor de bandeau en haut de chaque rubrique.
   ============================================================ */
.section{
  position:relative;
  margin:0;
  padding:42px 0 52px;
  min-height:0;
  scroll-margin-top:96px;
  color:var(--forest);
  border-top:1px solid rgba(220,230,220,.75);
  background-color:var(--ivory)!important;
  background-image:
    linear-gradient(90deg,
      rgba(255,253,247,.12) 0%,
      rgba(255,253,247,.42) 18%,
      rgba(255,253,247,.93) 34%,
      rgba(255,253,247,.99) 50%,
      rgba(255,253,247,.93) 66%,
      rgba(255,253,247,.42) 82%,
      rgba(255,253,247,.12) 100%),
    var(--trees)!important;
  background-repeat:no-repeat,no-repeat!important;
  background-position:center top,center top!important;
  background-size:cover,100% 205px!important;
}
.section.soft,.section.dark,.reviews-section,.directory-section{
  color:var(--forest)!important;
  background-color:var(--ivory)!important;
}
.section.dark h2,.section.dark p,.section.dark li{color:var(--forest)!important}
.section>.wrap{position:relative;z-index:1}

/* pas de pseudo décor hérité */
.section::before,.section::after,.hero::before,.hero::after,footer::before,footer::after{
  content:none!important;display:none!important
}

.section-head{
  max-width:860px;
  margin:0 auto 24px;
  padding:10px 20px;
  text-align:center;
  border-radius:16px;
  background:rgba(255,253,247,.86);
}
.section-head p{margin-bottom:0;font-size:16px;color:#486053}

/* ---------- CONCEPT ---------- */
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.feature-grid article{
  min-height:0;
  padding:18px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:rgba(255,255,255,.985);
  box-shadow:0 7px 20px rgba(18,63,43,.04);
}
.feature-icon{display:block;font-size:30px;margin-bottom:10px}
.feature-grid article p{margin-bottom:0;font-size:15px;color:#52675b}

/* ---------- FONCTIONNEMENT ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.steps article{
  min-height:0;
  padding:18px;
  text-align:center;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:rgba(255,255,255,.985);
}
.steps b{
  width:46px;height:46px;margin:0 auto 12px;
  display:grid;place-items:center;border-radius:50%;
  background:var(--forest2);color:#fff;font-size:18px
}
.steps p{margin-bottom:0;font-size:15px;color:#566a5e}

/* ---------- BOITE ---------- */
.box-section{
  display:grid;
  grid-template-columns:minmax(340px,.82fr) minmax(0,1.18fr);
  gap:40px;
  align-items:center;
}
.box-image img{
  width:100%;max-height:420px;object-fit:contain;
  border-radius:20px;box-shadow:var(--shadow)
}
.specs{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:16px 0}
.specs div{
  padding:12px;border:1px solid var(--line);border-radius:13px;
  background:rgba(255,255,255,.985)
}
.specs b,.specs span{display:block}
.specs b{font-size:18px}.specs span{font-size:12px;color:var(--muted)}
.technical-note{padding:14px 16px;border-left:4px solid var(--lime);background:#fafcea;border-radius:10px}

/* ---------- PARTENAIRE PRESENTATION ---------- */
.partner-presentation{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
  gap:40px;
  align-items:center
}
.benefits{list-style:none;padding:0;margin:18px 0}
.benefits li{padding:6px 0 6px 29px;position:relative;font-size:16px}
.benefits li::before{content:"✓";position:absolute;left:0;color:#93bd14;font-weight:900}
.partner-side-card{
  padding:22px;border:1px solid var(--line);border-radius:20px;
  background:rgba(255,255,255,.985);box-shadow:var(--shadow)
}
.partner-tags{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 18px}
.partner-tags span{padding:6px 10px;border-radius:999px;background:var(--lime-soft);font-weight:800}

/* ---------- AVIS ---------- */
.reviews-summary{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.rating-pill{min-width:96px;padding:10px 13px;text-align:center;border:1px solid var(--line);border-radius:12px;background:#fff}
.rating-pill strong,.rating-pill small{display:block}
.rating-pill small{font-size:11px;color:var(--muted)}
.reviews-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.review-card{padding:17px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.985)}
.review-top{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center}
.review-avatar{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:#eef6db;font-weight:900}
.review-top strong,.review-top small{display:block}.review-top small{font-size:11px;color:var(--muted)}
.stars{white-space:nowrap;color:#6f9b00}
.review-card p{margin:12px 0 0;font-size:14px;color:#4f6558}
.reviews-cta{margin-top:18px;padding:17px;border:1px solid #dce9be;background:#f7fae9;border-radius:14px;display:flex;justify-content:space-between;gap:15px;align-items:center}

/* ---------- ZONES ---------- */
.zone-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.panel{
  padding:20px;border:1px solid var(--line);border-radius:16px;
  background:rgba(255,255,255,.985);box-shadow:var(--shadow)
}
.zone-panel label{display:block;font-weight:800}
.result{margin-top:10px;color:var(--muted);font-weight:800}

/* ---------- PARTNER FORM ---------- */
.partner-form-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:40px;align-items:start}
.partner-process{display:grid;gap:10px;margin-top:20px}
.partner-process span{display:flex;align-items:center;gap:10px}
.partner-process b{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:var(--forest2);color:#fff}
.partner-form label,.directory-tools label,.proximity-tools label{display:block;font-weight:900}
input,textarea,select{
  width:100%;margin-top:5px;padding:11px 12px;border:1px solid #cad8cd;border-radius:10px;background:#fff;color:var(--forest)
}
.form-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.partner-form .btn{margin-top:10px}
.form-message{font-weight:800}

/* ---------- ANNUAIRE ---------- */
.directory-head{display:flex;justify-content:space-between;gap:25px;align-items:flex-end;margin-bottom:18px}
.directory-head>div:first-child{max-width:780px}
.directory-count{min-width:130px;padding:12px;text-align:center;border:1px solid var(--line);border-radius:13px;background:#fff}
.directory-count b,.directory-count span{display:block}.directory-count b{font-size:25px}.directory-count span{font-size:11px;color:var(--muted)}
.directory-tools{display:grid;grid-template-columns:1.3fr .7fr auto;gap:10px;align-items:end;margin-bottom:16px;padding:15px;border:1px solid var(--line);border-radius:15px;background:#fff}
.proximity-tools{grid-column:1/-1;display:flex;align-items:end;gap:10px;flex-wrap:wrap}
.proximity-tools label{min-width:120px}.proximity-tools span{font-size:11px;color:var(--muted);padding-bottom:8px}
.directory-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(390px,.86fr);gap:18px;align-items:start}
.public-points{display:grid;gap:10px}
.directory-empty{padding:16px;border:1px solid var(--line);border-radius:12px;background:#fff}
.hidden{display:none!important}
.map-panel{position:sticky;top:112px;overflow:hidden;border:1px solid var(--line);border-radius:17px;background:#fff;box-shadow:var(--shadow)}
.map-panel-head{display:flex;justify-content:space-between;gap:12px;padding:14px 16px 10px}
.map-panel-head strong,.map-panel-head small{display:block}.map-panel-head small{font-size:11px;color:var(--muted)}
.map-toolbar{display:flex;gap:6px;flex-wrap:wrap;padding:0 16px 10px}
.map-tool-btn{padding:7px 9px;border:1px solid #b9cbbd;border-radius:8px;background:#fff;color:var(--forest);font-weight:800}
.real-map{height:390px;width:100%}
.map-status{padding:9px 14px;font-size:11px;color:var(--muted)}

/* ---------- FAQ ---------- */
.faq{max-width:840px;margin-inline:auto}
.faq details{margin:8px 0;padding:13px 15px;border:1px solid var(--line);border-radius:12px;background:#fff}
.faq summary{font-size:16px;font-weight:900;cursor:pointer}.faq p{margin:9px 0 0;font-size:14px;color:#51675a}

/* ---------- CONTACT ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.contact-card{padding:17px;border-left:4px solid var(--lime);border-radius:13px;background:#f8faee}
.contact-cta{padding:22px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:var(--shadow)}

/* ---------- FOOTER ---------- */
footer{
  padding:24px 0;
  border-top:1px solid var(--line);
  color:var(--forest);
  background-color:#f8f9ef;
  background-image:
    linear-gradient(90deg,rgba(248,249,239,.16),rgba(248,249,239,.93) 34%,rgba(248,249,239,.93) 66%,rgba(248,249,239,.16)),
    var(--trees);
  background-repeat:no-repeat,no-repeat;
  background-position:center,center bottom;
  background-size:cover,100% 140px;
}
.footer-grid{display:grid;grid-template-columns:1fr 1.25fr .55fr;gap:16px;align-items:center}
.footer-grid a{text-decoration:underline;font-weight:800}.footer-grid small{display:block;margin-top:3px}

/* ---------- RESPONSIVE ---------- */
@media(max-width:1180px){
  .site-header .nav{min-height:86px}
  .brand-official{width:230px;flex-basis:230px}
  .brand-official img{max-width:230px;max-height:65px}
  .menu-toggle{display:block}
  #mainMenu{
    display:none;
    position:absolute;top:86px;left:0;right:0;
    padding:16px;
    flex-direction:column;
    align-items:stretch;
    background:#fff;
    border-bottom:1px solid var(--line)
  }
  #mainMenu.open{display:flex}
  #mainMenu .admin-nav{margin-left:0}
  #accueil.hero{min-height:0;padding:34px 0 28px}
  .hero-grid{min-height:0;grid-template-columns:1fr;gap:25px}
  .hero-visual{justify-self:center;max-width:650px}
  .feature-grid,.steps{grid-template-columns:repeat(2,1fr)}
  .box-section,.partner-presentation,.zone-grid,.partner-form-grid,.directory-layout,.contact-grid{grid-template-columns:1fr;gap:28px}
  .map-panel{position:relative;top:auto}
  .footer-grid{grid-template-columns:1fr}
}
@media(max-width:640px){
  .wrap{width:92%}
  h1{font-size:39px}
  h2{font-size:31px}
  .section{padding:32px 0 40px;background-size:cover,auto 180px!important}
  .feature-grid,.steps,.reviews-grid,.form-two,.stats-grid,.directory-tools{grid-template-columns:1fr}
  .hero-actions,.reviews-cta{flex-direction:column;align-items:stretch}
  .btn{width:100%}
  .hero-card{position:static;margin-top:8px}
  .review-top{grid-template-columns:auto 1fr}.stars{grid-column:2}
  .directory-head{flex-direction:column;align-items:flex-start}
  .real-map{height:350px}
}


/* ============================================================
   TRIVALCO — TEST PAGES COURTES + TRAITS NOIRS
   Chaque rubrique prend seulement la hauteur de son contenu.
   Aucun min-height écran après l'accueil.
   ============================================================ */

/* Accueil plus court pour commencer à voir la page 2 */
#accueil.hero{
  min-height:0 !important;
  padding:14px 0 10px !important;
}
#accueil .hero-grid{
  min-height:0 !important;
  gap:22px !important;
}
#accueil h1{
  font-size:clamp(34px,3vw,48px) !important;
  margin-bottom:10px !important;
}
#accueil .hero-copy p{
  font-size:15px !important;
  line-height:1.35 !important;
}
#accueil .hero-actions{margin-top:10px !important}
#accueil .trust-row{margin-top:8px !important}
#accueil .hero-visual{max-width:520px !important}
#accueil .hero-visual>img{max-height:330px !important}
#accueil .hero-card{padding:8px 10px !important}

/* Toutes les autres rubriques très compactes, mais naturelles */
#concept,
#fonctionnement,
#boite,
#partenaire-presentation,
#avis,
#partner,
#annuaire,
#faq,
#contact{
  min-height:0 !important;
  height:auto !important;
  padding-top:24px !important;
  padding-bottom:28px !important;
  margin:0 !important;
}

#concept .section-head,
#fonctionnement .section-head,
#avis .section-head,
#faq .section-head{
  margin-bottom:14px !important;
  padding:6px 14px !important;
}

.feature-grid,
.steps,
.reviews-grid{
  gap:10px !important;
}
.feature-grid article,
.steps article,
.review-card{
  padding:14px !important;
}
.steps b{
  width:40px !important;
  height:40px !important;
  margin-bottom:8px !important;
}

#boite .box-section,
#partenaire-presentation .partner-presentation,
#partner .partner-form-grid,
#annuaire .directory-layout,
#contact .contact-grid{
  gap:28px !important;
}

#boite .box-image img{max-height:350px !important}
#annuaire .real-map{height:340px !important}
footer{padding:18px 0 !important}

/* TRAITS NOIRS : fin réelle de CHAQUE grande rubrique */
#accueil,
#concept,
#fonctionnement,
#boite,
#partenaire-presentation,
#avis,
#partner,
#annuaire,
#faq,
#contact{
  border-bottom:4px solid #000 !important;
}

/* Pas de séparation interne parasite */
.stats-strip{
  border-bottom:1px solid var(--line) !important;
}

@media(max-width:1180px){
  #accueil.hero{padding:20px 0 !important}
  #concept,
  #fonctionnement,
  #boite,
  #partenaire-presentation,
  #avis,
  #partner,
  #annuaire,
  #faq,
  #contact{
    padding:22px 0 26px !important;
  }
}

/* ============================================================
   TRIVALCO — AJUSTEMENT PAGE 1 UNIQUEMENT
   Objectif : sur un écran complet, la page 1 (accueil + bandeau
   statistiques) occupe exactement la fenêtre. La page 2 ne doit
   pas apparaître avant le premier défilement.
   ============================================================ */
#accueil.hero{
  min-height:calc(100vh - 160px) !important;
  box-sizing:border-box !important;
  border-bottom:0 !important;
}
.stats-strip{
  border-bottom:4px solid #000 !important;
}


/* ============================================================
   TRIVALCO — AJUSTEMENT PAGE 2 UNIQUEMENT : LE CONCEPT
   La page 1 reste strictement inchangée.
   Objectif : le trait noir de fin de la page 2 arrive en bas
   de l'écran et la page 3 ne soit pas visible.
   ============================================================ */
#concept{
  min-height:calc(100vh - 130px) !important;
  height:auto !important;
  display:flex !important;
  align-items:center !important;
  padding-top:34px !important;
  padding-bottom:34px !important;
  box-sizing:border-box !important;
  border-bottom:4px solid #000 !important;
}

#concept > .wrap{
  width:min(1480px,90%) !important;
  margin:auto !important;
}

#concept .section-head{
  margin-bottom:22px !important;
}

/* Les cartes restent compactes : on augmente uniquement
   l'espace de la page, pas la taille du contenu. */
#concept .feature-grid{
  gap:12px !important;
}

@media(max-width:1180px){
  #concept{
    min-height:auto !important;
    display:block !important;
    padding:28px 0 34px !important;
  }
}


/* ============================================================
   TRIVALCO — PAGE 2 : TRAIT NOIR DESCENDU HORS DE L'ÉCRAN
   Page 1 inchangée.
   ============================================================ */
#concept{
  min-height:100vh !important;
  padding-bottom:48px !important;
}


/* TRIVALCO — PAGE 2 : descente supplémentaire du trait noir (~120 px)
   Aucun changement sur la page 1 ni sur le contenu de la page 2. */
#concept{
  min-height:calc(100vh + 120px) !important;
}

/* TRIVALCO — PAGE LE CONCEPT : trait noir encore plus bas
   Modification ciblée : uniquement la hauteur de #concept.
   Aucun autre élément / aucune autre page n'est modifié. */
#concept{
  min-height:calc(100vh + 220px) !important;
}

/* ============================================================
   TRIVALCO — PAGE 2 « LE CONCEPT » — VERSION VISUELLE VALIDÉE
   Référence : grand bandeau plein écran, paysage en bas,
   aucun trait noir visible. Les autres rubriques restent inchangées.
   ============================================================ */
#concept{
  min-height:calc(100vh - 92px) !important;
  height:auto !important;
  display:flex !important;
  align-items:flex-start !important;
  padding-top:72px !important;
  padding-bottom:210px !important;
  box-sizing:border-box !important;
  border-bottom:0 !important;
  background-color:var(--ivory) !important;
  background-image:
    linear-gradient(90deg,rgba(255,253,247,.10) 0%,rgba(255,253,247,.44) 18%,rgba(255,253,247,.94) 34%,rgba(255,253,247,.99) 50%,rgba(255,253,247,.94) 66%,rgba(255,253,247,.44) 82%,rgba(255,253,247,.10) 100%),
    var(--trees),
    url("assets/arbres-aquarelle-footer.png?v=concept-validee-20260829") !important;
  background-repeat:no-repeat,no-repeat,no-repeat !important;
  background-position:center top,center top,center bottom !important;
  background-size:cover,100% 390px,100% auto !important;
}
#concept > .wrap{
  width:min(1480px,90%) !important;
  margin:0 auto !important;
}
#concept .section-head{margin-bottom:28px !important;}
#concept .feature-grid{gap:16px !important;}
@media(max-width:1180px){
  #concept{
    min-height:auto !important;
    display:block !important;
    padding:36px 0 180px !important;
    background-size:cover,100% 260px,auto 150px !important;
  }
}

/* ============================================================
   TRIVALCO — PAGE 2 « LE CONCEPT » — CORRECTION DÉFINITIVE
   Référence visuelle validée le 29/08/2026.
   - aucun trait noir visible dans la fenêtre
   - bandeau prolongé sous l'écran
   - paysage végétal visible en bas de la fenêtre
   - aucun changement sur le contenu des cartes
   ============================================================ */
#concept{
  min-height:calc(100vh + 280px) !important;
  height:auto !important;
  position:relative !important;
  overflow:hidden !important;
  border-top:1px solid rgba(220,230,220,.75) !important;
  border-bottom:0 !important;
  padding-top:72px !important;
  padding-bottom:360px !important;
  background-color:var(--ivory) !important;
  background-image:
    linear-gradient(90deg,rgba(255,253,247,.10) 0%,rgba(255,253,247,.44) 18%,rgba(255,253,247,.94) 34%,rgba(255,253,247,.99) 50%,rgba(255,253,247,.94) 66%,rgba(255,253,247,.44) 82%,rgba(255,253,247,.10) 100%),
    var(--trees) !important;
  background-repeat:no-repeat,no-repeat !important;
  background-position:center top,center top !important;
  background-size:cover,100% 390px !important;
}
#concept::after{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  z-index:0 !important;
  left:0 !important;
  right:0 !important;
  top:max(650px, calc(100vh - 225px)) !important;
  height:224px !important;
  background:url("assets/concept-paysage-bas-valide.png?v=final-20260829") center bottom / 100% 224px no-repeat !important;
  pointer-events:none !important;
}
#concept > .wrap{
  position:relative !important;
  z-index:1 !important;
}
@media(max-width:1180px){
  #concept{
    min-height:calc(100vh + 220px) !important;
    padding:36px 0 300px !important;
  }
  #concept::after{
    top:max(620px, calc(100vh - 210px)) !important;
    height:210px !important;
    background-size:auto 210px !important;
  }
}

/* ============================================================
   TRIVALCO — PAGE 2 « LE CONCEPT » — VERSION FINALE SANS
   APERÇU DES CARTES DE LA RUBRIQUE SUIVANTE
   Référence visuelle validée par l'utilisateur le 29/08/2026.
   ============================================================ */
#concept{
  min-height:calc(100vh + 520px) !important;
  padding-bottom:520px !important;
  overflow:hidden !important;
  border-bottom:0 !important;
}
#concept::after{
  top:auto !important;
  bottom:0 !important;
  height:320px !important;
  background:url("assets/concept-paysage-bas-valide.png?v=concept-final-sans-carres") center bottom / 100% 320px no-repeat !important;
}
#fonctionnement{
  position:relative !important;
}
@media(max-width:1180px){
  #concept{
    min-height:calc(100vh + 420px) !important;
    padding-bottom:420px !important;
  }
  #concept::after{
    height:260px !important;
    background-size:auto 260px !important;
  }
}

/* ============================================================
   PAGE CONCEPT — PAYSAGE BAS VISIBLE DANS LE PREMIER ÉCRAN
   Le paysage est ancré au bas de la fenêtre visible, tandis que
   la section reste assez haute pour empêcher la section suivante
   d'apparaître sous les quatre cartes.
   ============================================================ */
#concept{
  min-height:calc(100vh + 360px) !important;
  padding-bottom:420px !important;
  overflow:hidden !important;
}
#concept::after{
  top:calc(100vh - 300px) !important;
  bottom:auto !important;
  height:300px !important;
  background:url("assets/concept-paysage-bas-valide.png?v=concept-paysage-visible-final") center bottom / 100% 300px no-repeat !important;
}
@media(max-width:1180px){
  #concept::after{
    top:calc(100vh - 250px) !important;
    height:250px !important;
    background-size:auto 250px !important;
  }
}


/* ============================================================
   PAGE FONCTIONNEMENT — VERSION VALIDÉE PLEIN ÉCRAN
   Ne modifie pas la page Concept. Les 4 étapes restent dans le
   premier écran, paysage en bas, aucune page suivante visible.
   ============================================================ */
#fonctionnement{
  position:relative !important;
  min-height:calc(100vh + 360px) !important;
  height:auto !important;
  padding-top:42px !important;
  padding-bottom:420px !important;
  margin:0 !important;
  overflow:hidden !important;
  border-bottom:0 !important;
  background:#fffdf8 !important;
}
#fonctionnement::after{
  content:"" !important;
  display:block !important;
  position:absolute;
  z-index:0;
  left:0;
  right:0;
  top:calc(100vh - 300px);
  height:300px;
  pointer-events:none;
  background:url("assets/concept-paysage-bas-valide.png?v=fonctionnement-final") center bottom / 100% 300px no-repeat;
}
#fonctionnement::before{
  content:"" !important;
  display:block !important;
  position:absolute;
  z-index:0;
  inset:0 0 auto 0;
  height:280px;
  pointer-events:none;
  background:url("assets/arbres-aquarelle-hero.png") center top / cover no-repeat;
  opacity:.88;
}
#fonctionnement > .wrap{
  position:relative;
  z-index:2;
}
#fonctionnement .section-head{
  margin-bottom:28px !important;
  padding:0 14px !important;
}
#fonctionnement .steps{
  gap:18px !important;
}
#fonctionnement .steps article{
  min-height:300px;
  padding:18px 22px 24px !important;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  text-align:center;
  background:rgba(255,255,255,.96) !important;
  border-radius:22px !important;
}
#fonctionnement .steps b{
  flex:0 0 auto;
  width:54px !important;
  height:54px !important;
  display:grid;
  place-items:center;
  margin:0 auto 12px !important;
}
#fonctionnement .step-icon{
  display:block;
  font-size:46px;
  line-height:1;
  margin:2px 0 12px;
}
#fonctionnement .steps h3{
  margin:0 0 10px !important;
}
#fonctionnement .steps p{
  margin:0 !important;
}
@media(max-width:1180px){
  #fonctionnement{
    min-height:calc(100vh + 420px) !important;
    padding-bottom:420px !important;
  }
  #fonctionnement::after{
    top:calc(100vh - 250px);
    height:250px;
    background-size:auto 250px;
  }
  #fonctionnement .steps article{min-height:260px;}
}

/* ============================================================
   PAGE 4 « LA BOÎTE » — ESQUISSE VALIDÉE 29/08/2026
   Ajout isolé : ne modifie ni Concept ni Fonctionnement.
   Plein écran, paysage bas, aucune rubrique suivante visible.
   ============================================================ */
#boite{
  position:relative !important;
  min-height:calc(100vh + 360px) !important;
  height:auto !important;
  padding:42px 0 420px !important;
  margin:0 !important;
  overflow:hidden !important;
  border-bottom:0 !important;
  background:#fffdf8 !important;
}
#boite::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  z-index:0 !important;
  inset:0 0 auto 0 !important;
  height:300px !important;
  pointer-events:none !important;
  background:url("assets/arbres-aquarelle-hero.png") center top / cover no-repeat !important;
  opacity:.88 !important;
}
#boite::after{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  z-index:0 !important;
  left:0 !important;
  right:0 !important;
  top:calc(100vh - 300px) !important;
  height:300px !important;
  pointer-events:none !important;
  background:url("assets/concept-paysage-bas-valide.png?v=boite-final") center bottom / 100% 300px no-repeat !important;
}
#boite > .wrap{
  position:relative !important;
  z-index:2 !important;
}
#boite .box-section{
  grid-template-columns:minmax(430px,.92fr) minmax(560px,1.08fr) !important;
  gap:34px !important;
  align-items:center !important;
}
#boite .box-image{
  background:rgba(255,255,255,.96) !important;
  border:1px solid var(--line) !important;
  border-radius:20px !important;
  padding:10px !important;
  box-shadow:0 12px 30px rgba(25,70,45,.08) !important;
}
#boite .box-image img{
  width:100% !important;
  max-height:560px !important;
  object-fit:contain !important;
}
#boite h2{margin-top:8px !important;}
#boite .large-text{margin-bottom:24px !important;}
#boite .specs-pro{gap:14px !important;}
#boite .specs-pro > div{
  min-height:94px !important;
  padding:18px 20px !important;
  background:rgba(255,255,255,.96) !important;
  border-radius:16px !important;
}
#boite .technical-note{
  margin-top:18px !important;
  background:rgba(248,252,229,.96) !important;
  border-radius:14px !important;
}
@media(max-width:1180px){
  #boite{
    min-height:calc(100vh + 420px) !important;
    padding-bottom:420px !important;
  }
  #boite::after{
    top:calc(100vh - 250px) !important;
    height:250px !important;
    background-size:auto 250px !important;
  }
  #boite .box-section{grid-template-columns:1fr 1fr !important;gap:22px !important;}
  #boite .box-image img{max-height:430px !important;}
}

/* ============================================================
   PAGE FAQ — VERSION PLEIN ÉCRAN HARMONISÉE
   5 questions conservées, paysage visible en bas, aucun trait
   noir et aucune apparition de la rubrique Contact.
   ============================================================ */
#faq{
  position:relative !important;
  min-height:calc(100vh + 360px) !important;
  height:auto !important;
  padding-top:42px !important;
  padding-bottom:420px !important;
  margin:0 !important;
  overflow:hidden !important;
  border-bottom:0 !important;
  background:#fffdf8 !important;
}
#faq::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  z-index:0 !important;
  inset:0 0 auto 0 !important;
  height:280px !important;
  pointer-events:none !important;
  background:url("assets/arbres-aquarelle-hero.png") center top / cover no-repeat !important;
  opacity:.88 !important;
}
#faq::after{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  z-index:0 !important;
  left:0 !important;
  right:0 !important;
  top:calc(100vh - 300px) !important;
  height:300px !important;
  pointer-events:none !important;
  background:url("assets/concept-paysage-bas-valide.png?v=faq-final") center bottom / 100% 300px no-repeat !important;
}
#faq > .wrap{
  position:relative !important;
  z-index:2 !important;
}
#faq .section-head{
  margin-bottom:28px !important;
  padding:0 14px !important;
}
#faq .faq{
  max-width:1160px !important;
}
#faq .faq details{
  background:rgba(255,255,255,.96) !important;
}
@media(max-width:1180px){
  #faq{
    min-height:calc(100vh + 420px) !important;
    padding-bottom:420px !important;
  }
  #faq::after{
    top:calc(100vh - 250px) !important;
    height:250px !important;
    background-size:auto 250px !important;
  }
}
\n\n/* ============================================================\n   CORRECTION FINALE FAQ + CONTACT — 29/08/2026\n   - supprime l'espace blanc excessif de la FAQ\n   - Contact plein écran sans trait noir ni footer visible\n   ============================================================ */\n#faq{\n  min-height:calc(100vh - 96px) !important;\n  padding:42px 0 70px !important;\n  border-bottom:0 !important;\n}\n#faq::after{\n  top:auto !important;\n  bottom:0 !important;\n  height:180px !important;\n  background-size:100% 180px !important;\n}\n#contact{\n  position:relative !important;\n  min-height:calc(100vh - 96px) !important;\n  box-sizing:border-box !important;\n  padding:38px 0 210px !important;\n  margin:0 !important;\n  overflow:hidden !important;\n  border-bottom:0 !important;\n  background:#fffdf8 !important;\n}\n#contact::before{\n  content:"" !important;\n  display:block !important;\n  position:absolute !important;\n  z-index:0 !important;\n  inset:0 0 auto 0 !important;\n  height:280px !important;\n  pointer-events:none !important;\n  background:url("assets/arbres-aquarelle-hero.png") center top / cover no-repeat !important;\n  opacity:.88 !important;\n}\n#contact::after{\n  content:"" !important;\n  display:block !important;\n  position:absolute !important;\n  z-index:0 !important;\n  left:0 !important; right:0 !important; bottom:0 !important;\n  height:210px !important;\n  pointer-events:none !important;\n  background:url("assets/concept-paysage-bas-valide.png?v=contact-final") center bottom / 100% 210px no-repeat !important;\n}\n#contact > .wrap{position:relative !important;z-index:2 !important;}\n#contact .contact-card{background:rgba(248,250,238,.96) !important;}\n#contact .contact-cta{background:rgba(255,255,255,.96) !important;}\nfooter{border-top:0 !important;}\n@media(max-width:1180px){\n  #faq{min-height:calc(100vh - 90px) !important;padding:32px 0 60px !important;}\n  #contact{min-height:calc(100vh - 90px) !important;padding:32px 0 180px !important;}\n  #contact::after{height:180px !important;background-size:auto 180px !important;}\n}\n
/* ============================================================
   PAGE « DEVENIR PARTENAIRE » — PLEIN ÉCRAN SANS TRAIT NOIR
   30/08/2026 — correction isolée, autres pages inchangées
   ============================================================ */
#partenaire-presentation{
  position:relative !important;
  min-height:calc(100vh - 96px) !important;
  height:auto !important;
  box-sizing:border-box !important;
  padding:38px 0 220px !important;
  margin:0 !important;
  overflow:hidden !important;
  border-bottom:0 !important;
  background:#fffdf8 !important;
}
#partenaire-presentation::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  z-index:0 !important;
  inset:0 0 auto 0 !important;
  height:280px !important;
  pointer-events:none !important;
  background:url("assets/arbres-aquarelle-hero.png?v=partenaire-final") center top / cover no-repeat !important;
  opacity:.88 !important;
}
#partenaire-presentation::after{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  z-index:0 !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  height:220px !important;
  pointer-events:none !important;
  background:url("assets/concept-paysage-bas-valide.png?v=partenaire-final") center bottom / 100% 220px no-repeat !important;
}
#partenaire-presentation > .wrap{
  position:relative !important;
  z-index:2 !important;
}
#partenaire-presentation .partner-side-card{
  background:rgba(255,255,255,.96) !important;
}
@media(max-width:1180px){
  #partenaire-presentation{
    min-height:calc(100vh - 90px) !important;
    padding:32px 0 190px !important;
  }
  #partenaire-presentation::after{
    height:190px !important;
    background-size:auto 190px !important;
  }
}

/* ============================================================
   DEVENIR PARTENAIRE — CORRECTION TRAIT BAS V2 — 30/08/2026
   Repousse la fin de section sous la fenêtre et neutralise toute
   séparation résiduelle. Correction limitée à cette rubrique.
   ============================================================ */
#partenaire-presentation{
  min-height:calc(100vh - 55px) !important;
  padding-bottom:250px !important;
  border-bottom:none !important;
  box-shadow:none !important;
  outline:none !important;
}
#partenaire-presentation + #avis{
  border-top:0 !important;
}
#partenaire-presentation::after{
  bottom:0 !important;
  height:250px !important;
  background-size:100% 250px !important;
}
@media(max-width:1180px){
  #partenaire-presentation{
    min-height:calc(100vh - 50px) !important;
    padding-bottom:220px !important;
  }
  #partenaire-presentation::after{
    height:220px !important;
    background-size:auto 220px !important;
  }
}

/* ============================================================
   DEVENIR PARTENAIRE — VERSION PLEIN ECRAN VALIDEE V3
   Référence visuelle validée : paysage jusqu'en bas, aucun trait,
   aucune apparition de la section Avis dans le même écran.
   ============================================================ */
#partenaire-presentation{
  position:relative !important;
  min-height:100vh !important;
  height:auto !important;
  box-sizing:border-box !important;
  padding:42px 0 300px !important;
  margin:0 !important;
  overflow:hidden !important;
  border-top:1px solid rgba(220,230,220,.55) !important;
  border-bottom:0 !important;
  box-shadow:none !important;
  outline:0 !important;
  background:#fffdf8 !important;
}
#partenaire-presentation::before{
  content:"" !important;
  position:absolute !important;
  z-index:0 !important;
  inset:0 0 auto 0 !important;
  height:310px !important;
  pointer-events:none !important;
  background:url("assets/arbres-aquarelle-hero.png?v=partenaire-v3") center top / cover no-repeat !important;
  opacity:.90 !important;
}
#partenaire-presentation::after{
  content:"" !important;
  position:absolute !important;
  z-index:0 !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  height:310px !important;
  pointer-events:none !important;
  background:url("assets/concept-paysage-bas-valide.png?v=partenaire-v3") center bottom / 100% 310px no-repeat !important;
}
#partenaire-presentation > .wrap{
  position:relative !important;
  z-index:2 !important;
}
#partenaire-presentation .partner-presentation{
  align-items:center !important;
}
#partenaire-presentation .partner-side-card{
  background:rgba(255,255,255,.97) !important;
}
#partenaire-presentation + #avis{
  border-top:0 !important;
  margin-top:0 !important;
}
@media(max-width:1180px){
  #partenaire-presentation{
    min-height:100vh !important;
    padding:34px 0 250px !important;
  }
  #partenaire-presentation::after{
    height:250px !important;
    background-size:auto 250px !important;
  }
}

/* ============================================================
   DEVENIR PARTENAIRE — VERSION PAYSAGE VALIDEE 30/08/2026
   Maquette validée : paysage continu, contenu plus haut,
   carte blanche à droite et aucun aperçu de la page suivante.
   ============================================================ */
#partenaire-presentation{
  position:relative !important;
  min-height:calc(100vh - 118px) !important;
  height:calc(100vh - 118px) !important;
  box-sizing:border-box !important;
  padding:82px 0 58px !important;
  margin:0 !important;
  overflow:hidden !important;
  border:0 !important;
  background:#fffdf8 !important;
}
#partenaire-presentation::before{
  content:"" !important;
  position:absolute !important;
  z-index:0 !important;
  inset:0 !important;
  height:auto !important;
  pointer-events:none !important;
  background:
    url("assets/arbres-aquarelle-hero.png?v=partner-landscape") center top / 100% 48% no-repeat,
    url("assets/concept-paysage-bas-valide.png?v=partner-landscape") center bottom / 100% 62% no-repeat !important;
  opacity:1 !important;
}
#partenaire-presentation::after{display:none !important;content:none !important;}
#partenaire-presentation > .wrap{
  position:relative !important;
  z-index:2 !important;
  width:min(1500px,88%) !important;
  max-width:1500px !important;
  margin:0 auto !important;
}
#partenaire-presentation .partner-presentation{
  grid-template-columns:minmax(0,.98fr) minmax(520px,1.02fr) !important;
  gap:72px !important;
  align-items:center !important;
}
#partenaire-presentation h2{
  max-width:650px !important;
  font-size:clamp(38px,3.15vw,58px) !important;
  line-height:1.04 !important;
  margin:10px 0 22px !important;
}
#partenaire-presentation .large-text{
  max-width:700px !important;
  font-size:18px !important;
  line-height:1.55 !important;
}
#partenaire-presentation .benefits{margin:24px 0 26px !important;}
#partenaire-presentation .benefits li{
  padding:8px 0 8px 44px !important;
  font-size:17px !important;
}
#partenaire-presentation .benefits li::before{
  width:28px !important;height:28px !important;
  display:grid !important;place-items:center !important;
  top:4px !important;
  border-radius:50% !important;
  background:#86bd2c !important;color:#fff !important;
  font-size:17px !important;
}
#partenaire-presentation .light-btn{
  padding:16px 26px !important;
  border-radius:10px !important;
  font-size:17px !important;
}
#partenaire-presentation .partner-side-card{
  padding:30px 34px 34px !important;
  border:1px solid rgba(26,86,58,.18) !important;
  border-radius:24px !important;
  background:rgba(255,255,255,.95) !important;
  box-shadow:0 18px 45px rgba(30,70,45,.10) !important;
}
#partenaire-presentation .partner-side-card h3{font-size:25px !important;margin-bottom:14px !important;}
#partenaire-presentation .partner-tags{gap:10px !important;margin:14px 0 30px !important;}
#partenaire-presentation .partner-tags span{padding:9px 15px !important;font-size:16px !important;}
#partenaire-presentation .partner-side-card p{font-size:17px !important;line-height:1.55 !important;}
#partenaire-presentation + #avis{border-top:0 !important;margin-top:0 !important;}
@media(max-width:1180px){
  #partenaire-presentation{height:auto !important;min-height:100vh !important;padding:50px 0 210px !important;}
  #partenaire-presentation > .wrap{width:min(92%,900px) !important;}
  #partenaire-presentation .partner-presentation{grid-template-columns:1fr !important;gap:30px !important;}
  #partenaire-presentation::before{background-size:auto 46%,auto 58% !important;}
}

/* ============================================================
   DEVENIR PARTENAIRE — PAYSAGE PLEIN ECRAN V4 — 30/08/2026
   Fond paysage réellement visible sur toute la partie basse.
   La section suivante reste hors écran au chargement.
   ============================================================ */
#partenaire-presentation{
  position:relative !important;
  height:calc(100vh - 120px) !important;
  min-height:700px !important;
  max-height:none !important;
  padding:42px 0 300px !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
  border-bottom:0 !important;
  background:#fffdf8 !important;
}
#partenaire-presentation::before{
  height:360px !important;
  background:url("assets/arbres-aquarelle-hero.png?v=partenaire-v4") center top / cover no-repeat !important;
  opacity:.86 !important;
}
#partenaire-presentation::after{
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  height:48% !important;
  background:url("assets/concept-paysage-bas-valide.png?v=partenaire-v4") center bottom / 100% 100% no-repeat !important;
  opacity:1 !important;
}
#partenaire-presentation > .wrap{
  position:relative !important;
  z-index:2 !important;
}
#partenaire-presentation .partner-side-card{
  background:rgba(255,255,255,.94) !important;
}
#partenaire-presentation + #avis{
  margin-top:0 !important;
  border-top:0 !important;
}
@media(max-width:1180px){
  #partenaire-presentation{
    height:auto !important;
    min-height:100vh !important;
    padding:34px 0 260px !important;
  }
  #partenaire-presentation::after{
    height:260px !important;
    background-size:auto 260px !important;
  }
}


/* ============================================================
   DEVENIR AGENT TRIVALCO — 31/08/2026
   Nouvelle page dédiée + formulaire modal de candidature.
   ============================================================ */
#agent{
  position:relative;
  min-height:calc(100vh - 96px);
  box-sizing:border-box;
  padding:64px 0 210px;
  overflow:hidden;
  border:0!important;
  background:#fffdf8;
  scroll-margin-top:96px;
}
#agent::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(255,253,248,.82) 0%,rgba(255,253,248,.94) 46%,rgba(255,253,248,.28) 100%),
    url("assets/arbres-aquarelle-hero.png?v=agent-v1") center top / cover no-repeat;
}
#agent::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:250px;
  z-index:1;
  pointer-events:none;
  background:url("assets/concept-paysage-bas-valide.png?v=agent-v1") center bottom / 100% 250px no-repeat;
}
#agent>.wrap{position:relative;z-index:2}
.agent-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:58px;align-items:center}
.agent-copy{max-width:760px}
.agent-copy h2{max-width:720px}
.agent-benefits{margin:22px 0 24px}
.agent-cta{font-size:16px;padding-inline:24px}
.agent-note{margin:12px 0 0;color:#5b6d61;font-size:13px;font-weight:700}
.agent-side-card{
  padding:30px;
  border:1px solid rgba(47,143,58,.26);
  border-radius:22px;
  background:rgba(255,255,255,.93);
  box-shadow:var(--shadow);
}
.agent-side-card h3{font-size:28px;margin:14px 0 18px}
.agent-badge{display:inline-block;padding:7px 10px;border-radius:999px;background:var(--lime-soft);color:#507300;font-size:11px;font-weight:900;letter-spacing:.08em}
.agent-mission-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0 20px}
.agent-mission-grid div{display:flex;align-items:center;gap:10px;padding:13px;border-radius:14px;background:#f7faef;font-weight:800}
.agent-mission-grid b{font-size:22px}
.agent-modal{position:fixed;inset:0;z-index:3000;display:none;align-items:center;justify-content:center;padding:20px}
.agent-modal.open{display:flex}
.agent-modal-backdrop{position:absolute;inset:0;background:rgba(9,35,23,.64);backdrop-filter:blur(3px)}
.agent-modal-card{position:relative;z-index:1;width:min(720px,96vw);max-height:92vh;overflow:auto;padding:28px;border-radius:22px;background:#fff;box-shadow:0 28px 80px rgba(0,0,0,.28)}
.agent-modal-card h2{font-size:30px;margin-bottom:18px}
.agent-modal-close{position:absolute;right:14px;top:10px;width:40px;height:40px;border:0;background:transparent;color:var(--forest);font-size:32px;line-height:1}
.agent-form{display:grid;gap:13px}
.agent-form label{display:block;font-weight:900;color:var(--forest)}
.agent-form input,.agent-form select,.agent-form textarea{width:100%;margin-top:5px;padding:11px 12px;border:1px solid #bdcbc1;border-radius:10px;background:#fff;color:#173e2c}
.agent-consent{display:flex!important;align-items:flex-start;gap:9px;font-size:13px;line-height:1.35}
.agent-consent input{width:auto!important;margin-top:2px!important;flex:0 0 auto}
body.agent-modal-open{overflow:hidden}
@media(max-width:1180px){
  #agent{min-height:calc(100vh - 90px);padding:44px 0 190px;scroll-margin-top:90px}
  .agent-layout{grid-template-columns:1fr;gap:28px}
  .agent-side-card{max-width:760px}
  #agent::after{height:190px;background-size:auto 190px}
}
@media(max-width:700px){
  #agent{padding:34px 0 150px}
  .agent-mission-grid,.agent-form .form-two{grid-template-columns:1fr}
  #agent::after{height:150px;background-size:auto 150px}
  .agent-modal-card{padding:24px 18px}
}

/* Menu Devenir agent — version 2 */
#mainMenu .agent-nav{display:inline-flex;align-items:center;}

/* V4 HARD FIX — Devenir agent visible sur desktop */
@media (min-width:1181px){
  #mainMenu > .agent-nav{
    display:inline-flex !important;
    visibility:visible !important;
    opacity:1 !important;
    position:static !important;
    flex:0 0 auto !important;
  }
}