/* Prop E — header / footer / contact / devis / société
   Style sac-de-ciment (Chivo, grille, numéros). Charte 30/10.
   Ne remplace pas cbs-hf ni charte-3010 : renforce seulement. */

@font-face{
  font-family:"Chivo";
  src:url(/assets/fonts/chivo-latin-wght-normal.woff2) format("woff2");
  font-weight:100 900;
  font-display:swap;
}
@font-face{
  font-family:"Chivo Mono";
  src:url(/assets/fonts/chivo-mono-latin-400-normal.woff2) format("woff2");
  font-weight:400;
  font-display:swap;
}
@font-face{
  font-family:"Chivo Mono";
  src:url(/assets/fonts/chivo-mono-latin-500-normal.woff2) format("woff2");
  font-weight:500;
  font-display:swap;
}

:root{
  --ec-n:#003366;
  --ec-foot:#092142;
  --ec-g:#1C8048;
  --ec-gh:#166A3B;
  --ec-gl:#5BC889;
  --ec-ink:#0F1F33;
  --ec-mute:#5A6B7D;
  --ec-intro:#6B7280;
  --ec-line:#E2E8F0;
  --ec-bg:#FFFFFF;
  --ec-paper:#FAFBFC;
  --ec-grid:rgba(0,51,102,.06);
  --ec-sans:"Chivo",Barlow,system-ui,sans-serif;
  --ec-mono:"Chivo Mono",ui-monospace,monospace;
  --ec-max:1160px;
}

/* ——— Header : charte (renfort) ——— */
.cbs-top{display:none!important}

a.btn-rdv-hd,
a.btn-devis-hd,
.ea-panel-cta a.btn-rdv-hd,
.ea-panel-cta a.btn-devis-hd{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  height:40px;
  min-height:40px!important;
  max-height:40px;
  padding:0 18px!important;
  border-radius:999px!important;
  font-family:var(--ec-sans)!important;
  font-size:14.5px!important;
  font-weight:600!important;
  line-height:1.2!important;
  text-decoration:none!important;
  white-space:nowrap;
  box-shadow:none!important;
  transform:none!important;
}
a.btn-rdv-hd{
  background:#fff!important;
  color:#003366!important;
  border:1.5px solid #003366!important;
}
a.btn-rdv-hd:hover,
a.btn-rdv-hd:focus-visible{
  background:#003366!important;
  color:#fff!important;
  border-color:#003366!important;
}
a.btn-devis-hd{
  background:#1C8048!important;
  color:#fff!important;
  border:0!important;
}
a.btn-devis-hd:hover,
a.btn-devis-hd:focus-visible{
  background:#166A3B!important;
  color:#fff!important;
}

@media (max-width:1024px){
  .hd-right>a.btn-rdv-hd,
  .hd-right>a.btn-devis-hd{display:none!important}
  .ea-panel-cta a.btn-rdv-hd,
  .ea-panel-cta a.btn-devis-hd{display:inline-flex!important;width:100%}
}
@media (min-width:1025px){
  .hd-right>a.btn-rdv-hd,
  .hd-right>a.btn-devis-hd{display:inline-flex!important}
}

/* ——— Footer : charte (renfort) ——— */
footer.cbs-foot{
  background:#092142!important;
  color:rgba(255,255,255,.75)!important;
  font-size:15px!important;
  line-height:1.6!important;
}
footer.cbs-foot .brand .name{
  display:table;
  color:#fff!important;
  font-weight:700;
  font-size:22px;
}
html:not([lang="zh"]):not([lang="ja"]) footer.cbs-foot .brand .name{text-transform:uppercase}
footer.cbs-foot .brand .name::after{
  content:"";
  display:block;
  height:2px;
  margin-top:8px;
  background:#1C8048; /* vert boutons, comme logo header */
  width:100%;
}
footer.cbs-foot .main{
  display:grid!important;
  grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr)!important;
  gap:48px 56px!important;
  align-items:start;
}
footer.cbs-foot .brand p{
  font-size:14px!important;
  line-height:1.55!important;
  max-width:36em;
}
@media (max-width:640px){
  footer.cbs-foot .main{grid-template-columns:1fr 1fr!important;gap:40px 24px!important}
  footer.cbs-foot .brand{grid-column:1/-1}
}
footer.cbs-foot .contact a.btn-rdv,
footer.cbs-foot .contact a.btn-rdv:visited{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  background:transparent!important;
  color:#fff!important;
  border:2px solid #fff!important;
  border-radius:5px!important;
  padding:11px 22px!important;
  font-size:15px!important;
  font-weight:600!important;
  text-decoration:none!important;
}
footer.cbs-foot .contact a.btn-rdv:hover,
footer.cbs-foot .contact a.btn-rdv:focus-visible{
  background:rgba(255,255,255,.12)!important;
  color:#fff!important;
}
footer.cbs-foot .group .label{
  display:table;
  margin:0 auto 10px;
  color:#fff!important;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  text-align:center;
}
footer.cbs-foot .group .label::after{
  content:"";
  display:block;
  width:100%;
  height:2px;
  margin:8px auto 0;
  background:#5BC889;
}
footer.cbs-foot .group .label::before{content:none!important;display:none!important}

/* ——— Pages contact / devis / société ——— */
html:has(body.ec-body){overflow-x:clip;max-width:100%}
body.ec-body{
  font-family:var(--ec-sans);
  color:var(--ec-ink);
  background:var(--ec-bg);
  overflow-x:clip;
  max-width:100%;
}
body.ec-body ::selection{background:rgba(28,128,72,.22);color:var(--ec-n)}
body.ec-body :focus-visible{outline:2px solid var(--ec-g);outline-offset:3px}

body.ec-body main{
  background:
    linear-gradient(var(--ec-grid) 1px,transparent 1px),
    linear-gradient(90deg,var(--ec-grid) 1px,transparent 1px);
  background-size:48px 48px;
  background-color:var(--ec-bg);
  overflow-x:clip;
}

.ec-wrap{
  width:min(100% - 40px,var(--ec-max));
  margin-inline:auto;
  padding:40px 0 88px;
}
@media (min-width:900px){
  .ec-wrap{width:min(100% - 64px,var(--ec-max));padding:48px 0 104px}
}

.ec-crumbs{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  margin:0 0 28px;
  font:400 12px/1.3 var(--ec-mono);
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--ec-mute);
}
.ec-crumbs a{color:var(--ec-g);text-decoration:none}
.ec-crumbs a:hover{color:var(--ec-gh);text-decoration:underline;text-underline-offset:3px}
.ec-crumbs [aria-current="page"]{color:var(--ec-ink);font-weight:500}

.ec-lot{
  display:inline-flex;align-items:center;gap:8px;
  margin:0 0 14px;
  font:500 12px/1 var(--ec-mono);
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--ec-mute);
}
.ec-lot::after{
  content:"";
  display:block;
  width:28px;height:2px;
  background:var(--ec-gl);
}

.ec-page-head{margin:0 0 36px;max-width:52rem}
/* Sans sur-titre ec-lot (page Contact 0250) : espace haut propre */
.ec-page-head:not(:has(.ec-lot)){padding-top:4px}
.ec-page-head h1{
  margin:0 0 14px;
  font:800 clamp(32px,4.6vw,56px)/1.02 var(--ec-sans);
  letter-spacing:-.03em;
  color:var(--ec-n);
  border:0!important;
}
.ec-page-head h1::before,
.ec-page-head h1::after{content:none!important;display:none!important}
.ec-page-head .ec-lead{
  margin:0;
  max-width:46ch;
  font:400 17px/1.55 var(--ec-sans);
  color:var(--ec-intro);
}

/* Contact / devis : 4 bis fond blanc */
.ec-contact{
  display:grid;
  grid-template-columns:minmax(260px,.85fr) minmax(0,1.25fr);
  gap:40px;
  align-items:start;
  background:#fff;
  border:1px solid var(--ec-line);
  padding:32px;
  color:var(--ec-ink);
}
@media (max-width:860px){
  .ec-contact{grid-template-columns:1fr;gap:28px;padding:22px 18px}
}

.ec-4bis h1{
  margin:0 0 14px;
  font:800 clamp(26px,3vw,36px)/1.08 var(--ec-sans);
  letter-spacing:-.02em;
  color:#003366;
}
.ec-4bis h1::before,
.ec-4bis h1::after{content:none!important;display:none!important}

.ec-4bis .ec-intro{
  margin:0 0 28px;
  max-width:36ch;
  font-size:15px;
  line-height:1.55;
  color:#6B7280;
}

.ec-4bis .ec-joindre{
  margin:0 0 18px;
  font:700 20px/1.25 var(--ec-sans);
  color:#003366;
  border:0!important;
}
.ec-4bis .ec-joindre::before,
.ec-4bis .ec-joindre::after{content:none!important;display:none!important}

.ec-coords{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.ec-coords li{
  margin:0;
  font-size:15px;
  line-height:1.5;
  color:#003366;
}
.ec-coords strong{
  display:block;
  margin-bottom:4px;
  font:600 13px/1.2 var(--ec-sans);
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#1C8048;
}
.ec-coords a,
.ec-coords a:link,
.ec-coords a:visited{
  color:#003366;
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
  word-break:break-word;
}
.ec-coords a:hover{color:#1C8048}

.ec-4bis .btn-rdv-page,
.ec-4bis a.btn-rdv-page{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  width:auto!important;
  max-width:100%;
  margin-top:24px;
  background:#1C8048!important;
  color:#fff!important;
  border:0!important;
  border-radius:6px!important;
  padding:12px 22px!important;
  font:600 16px/1.2 var(--ec-sans)!important;
  text-decoration:none!important;
  min-height:46px;
  box-shadow:none!important;
  transition:background .2s ease;
}
.ec-4bis .btn-rdv-page:hover,
.ec-4bis a.btn-rdv-page:hover{background:#166A3B!important;color:#fff!important}

.ec-contact .cp-form,
.ec-contact form.cp-form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin:0;
  padding:0;
  background:transparent;
  border:0;
}
@media (max-width:640px){
  .ec-contact .cp-form,
  .ec-contact form.cp-form{grid-template-columns:1fr!important}
}
.ec-contact .cp-form label{
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:13px;
  font-weight:700;
  color:var(--ec-n);
}
.ec-contact .cp-form .full,
.ec-contact .cp-form .consent-wrap,
.ec-contact .cp-form .form-note,
.ec-contact .cp-form .form-status,
.ec-contact .cp-form .btn{grid-column:1/-1}
.ec-contact .cp-form input,
.ec-contact .cp-form textarea,
.ec-contact .cp-form select{
  font:400 15px/1.4 var(--ec-sans);
  color:var(--ec-ink);
  background:#fff;
  border:1px solid var(--ec-line);
  border-radius:6px;
  padding:12px 14px;
  caret-color:var(--ec-g);
}
.ec-contact .cp-form textarea{min-height:120px;resize:vertical}
.ec-contact .cp-form input:focus,
.ec-contact .cp-form textarea:focus,
.ec-contact .cp-form select:focus{
  outline:2px solid var(--ec-g);
  outline-offset:0;
  border-color:var(--ec-g);
}
.ec-contact .cp-form .btn,
.ec-contact .cp-form button.btn{
  justify-self:start;
  margin-top:4px;
  background:#1C8048!important;
  color:#fff!important;
  border:0!important;
  border-radius:6px!important;
  padding:14px 28px!important;
  font-size:16px!important;
  font-weight:600!important;
  min-height:48px;
  cursor:pointer;
  transition:background .2s ease;
}
.ec-contact .cp-form .btn:hover{background:#166A3B!important}
.ec-contact .cp-form .form-note{
  margin:0;
  font-size:13px;
  line-height:1.45;
  font-weight:400;
  color:var(--ec-mute);
}
.ec-contact .cp-form .consent-wrap{margin:4px 0}
.ec-contact .cp-form label.consent{
  display:flex;
  flex-direction:row;
  gap:10px;
  align-items:flex-start;
  font-size:13px;
  font-weight:500;
  line-height:1.45;
  color:var(--ec-mute);
  cursor:pointer;
}
.ec-contact .cp-form .consent input{
  flex:none;
  width:18px;height:18px;
  margin-top:2px;padding:0;
  accent-color:#1C8048;
}
.ec-contact .cp-form .consent a{color:var(--ec-n);text-decoration:underline;text-underline-offset:3px}
.ec-contact .cp-form .consent a:hover{color:var(--ec-g)}
.ec-contact .cp-form .hpf{
  position:absolute!important;
  left:-9999px!important;
  width:1px;height:1px;overflow:hidden;
}
.ec-contact .cp-form .form-status{min-height:1.2em;font-size:14px;color:var(--ec-g)}

/* ——— Société ——— */
.ec-soc .ec-card{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:28px;
  margin:0 0 40px;
  align-items:start;
}
@media (max-width:860px){
  .ec-soc .ec-card{grid-template-columns:1fr}
}

.ec-sec{
  margin:0 0 56px;
  padding:36px 0 0;
  border-top:1px solid var(--ec-line);
}
.ec-sec:first-of-type{border-top:0;padding-top:0}
.ec-sec-head{margin:0 0 24px;max-width:44rem}
.ec-sec-head .num{
  display:block;
  font:500 13px/1 var(--ec-mono);
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ec-g);
  margin-bottom:10px;
}
.ec-sec-head h2{
  margin:0 0 10px;
  font:800 clamp(26px,3.2vw,40px)/1.1 var(--ec-sans);
  letter-spacing:-.025em;
  color:var(--ec-n);
}
.ec-sec-head h2::before,
.ec-sec-head h2::after{content:none!important;display:none!important}
.ec-sec-head p{
  margin:0;
  font-size:16px;
  line-height:1.55;
  color:var(--ec-mute);
  max-width:48ch;
}

.ec-facts{
  margin:0;
  padding:0;
  list-style:none;
  border:1px solid var(--ec-line);
  background:#fff;
}
.ec-facts li{
  display:grid;
  grid-template-columns:120px 1fr;
  gap:12px;
  padding:14px 16px;
  border-bottom:1px solid var(--ec-line);
  font-size:15px;
  line-height:1.45;
}
.ec-facts li:last-child{border-bottom:0}
.ec-facts span{
  font:500 12px/1.3 var(--ec-mono);
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--ec-g);
}
.ec-facts b,
.ec-facts a{color:var(--ec-n);font-weight:700;text-decoration:none}
.ec-facts a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.ec-facts a:hover{color:var(--ec-g)}
@media (max-width:560px){
  .ec-facts li{grid-template-columns:1fr}
}

.ec-grid-4{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  margin:0;
  padding:0;
  list-style:none;
  background:var(--ec-line);
  border:1px solid var(--ec-line);
}
.ec-grid-4 li{
  background:#fff;
  padding:18px 16px;
}
.ec-grid-4 strong{
  display:block;
  margin-bottom:6px;
  font:700 16px/1.2 var(--ec-sans);
  color:var(--ec-n);
}
.ec-grid-4 span{
  font-size:14px;
  line-height:1.45;
  color:var(--ec-mute);
}
@media (max-width:560px){
  .ec-grid-4{grid-template-columns:1fr}
}

.ec-steps{
  counter-reset:st;
  list-style:none;
  margin:0;
  padding:0;
  border:1px solid var(--ec-line);
  background:#fff;
}
.ec-steps li{
  counter-increment:st;
  display:grid;
  grid-template-columns:48px 1fr;
  gap:14px;
  padding:16px 18px;
  border-bottom:1px solid var(--ec-line);
  font-size:15px;
  line-height:1.5;
  color:var(--ec-mute);
}
.ec-steps li:last-child{border-bottom:0}
.ec-steps li::before{
  content:counter(st,decimal-leading-zero);
  font:500 14px/1 var(--ec-mono);
  color:var(--ec-g);
  padding-top:3px;
}
.ec-steps strong{display:block;color:var(--ec-n);margin-bottom:2px}

.ec-models{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:0;
  border:1px solid var(--ec-line);
  background:#fff;
  margin:0 0 24px;
}
.ec-models article{
  padding:22px 24px;
  border-right:1px solid var(--ec-line);
}
.ec-models article:last-child{border-right:0}
.ec-models h3{
  margin:0 0 8px;
  font:800 20px/1.2 var(--ec-sans);
  color:var(--ec-n);
}
.ec-models p{
  margin:0 0 14px;
  color:var(--ec-mute);
  font-size:15px;
  line-height:1.5;
}
@media (max-width:860px){
  .ec-models{grid-template-columns:1fr}
  .ec-models article{border-right:0;border-bottom:1px solid var(--ec-line)}
  .ec-models article:last-child{border-bottom:0}
}

.ec-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:12px 22px;
  background:var(--ec-g);
  color:#fff!important;
  font:600 15px/1 var(--ec-sans);
  text-decoration:none!important;
  border:0;
  border-radius:6px;
}
.ec-cta:hover{background:var(--ec-gh)}
.ec-cta-ghost{
  display:inline-flex;
  align-items:center;
  font:600 14px/1 var(--ec-sans);
  color:var(--ec-n);
  text-decoration:none;
  border-bottom:2px solid var(--ec-gl);
  padding-bottom:2px;
}
.ec-cta-ghost:hover{color:var(--ec-g)}

/* Contenu toujours lisible ; motion en plus, jamais d’opacity 0. */
.ec-reveal{opacity:1;transform:none}
@media (prefers-reduced-motion:no-preference){
  body.ec-motion .ec-reveal.is-in{
    animation:ec-fade-up .65s cubic-bezier(.16,1,.3,1) both;
  }
}
@keyframes ec-fade-up{
  from{opacity:1;transform:translateY(12px)}
  to{opacity:1;transform:none}
}
