/* TERRA'PIET — lot commun.
   Surcharge tardive du thème eco, adaptée du commun.css V3 de Nemelec.
   Aucun composant de barre mobile : une seule bulle d'appel ronde est conservée.
   30/10/2026 : site FULL BLACK (fond #000, comme la V1 d'origine). La palette du thème Eco (mode sombre)
   est surchargée ici, ce fichier étant chargé en dernier ; les autres feuilles ne redéfinissent plus de couleurs. */

:root{
  /* Palette noire : sections alternées #000 / #0a0a0a, cartes #111, bords discrets. */
  --fond:#000;
  --fond-2:#0a0a0a;
  --carte:#111;
  --bord:#262626;
  --overlay-rgb:0,0,0;
  --bandeau:#000;
  /* Texte : #fff / 82 % / 64 % sur #000 = 21:1 / 14:1 / 9:1 (AA large). */
  --titre:#fff;
  --texte:rgba(255,255,255,.84);
  --texte-doux:rgba(255,255,255,.68);
  /* Orange lisible sur noir : #f28a3c sur #000 = 8,3:1 ; sur #111 = 7,5:1. */
  --accent-texte:#f28a3c;
  --accent-texte-fonce:#ffa968;
  /* Texte posé sur un aplat orange (boutons) : #1d0d02 sur #e8741e = 6,2:1 (le blanc ne faisait que 2,9:1). */
  --sur-accent:#1d0d02;
  /* #ffd2b0 sur #000 : 15:1. */
  --accent-sur-sombre:#ffd2b0;
  /* Bords de champs de formulaire : #6a6a6a sur #000 = 3,7:1 (3:1 exigé pour les composants). */
  --champ-bord:#6a6a6a;
  color-scheme:dark;
}

/* Les gabarits eco posent souvent la couleur en style inline : la surcharge commune
   doit donc être plus forte dans les zones sombres. Les boutons, qui ont leur propre
   fond, conservent leur couple de couleurs. */
:is(footer,.fond-sombre,section[style*="background:rgb(var(--overlay-rgb))"],[data-reveal="zoom"])
  :is([style*="color:var(--accent"],[style*="color: var(--accent"]):not([style*="background"]){
  color:var(--accent-sur-sombre)!important;
}
.topbar a:hover,.topbar a:hover svg,
footer .hvpied:hover,footer .hv14:hover,footer .hv14:hover svg,footer .hv15:hover,
section[style*="background:rgb(var(--overlay-rgb))"] .hv15:hover{
  color:var(--accent-sur-sombre)!important;
}
footer span[style*="rgba(255,255,255,.07)"][style*="color:var(--accent"]{
  color:var(--accent-sur-sombre)!important;
}
footer .hvpied:hover span{color:var(--sur-accent)!important}

/* Bulle unique. commun.js réutilise la bulle eco lorsqu'elle existe et n'en crée
   une que sur les pages qui n'en possèdent pas. */
.ttm-appel{
  position:fixed!important;
  right:clamp(14px,2.2vw,22px)!important;
  bottom:clamp(14px,2.2vw,22px)!important;
  width:56px!important;
  height:56px!important;
  box-sizing:border-box;
  border-radius:50%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:var(--accent)!important;
  color:#24150c!important;
  border:1px solid color-mix(in srgb,var(--accent-fonce) 65%,transparent)!important;
  box-shadow:0 13px 30px -10px rgba(232,116,30,.45),0 0 0 1px rgba(255,255,255,.08)!important;
  z-index:90!important;
  text-decoration:none!important;
  isolation:isolate;
  transition:transform .35s cubic-bezier(.34,1.56,.64,1),box-shadow .25s,background .2s!important;
}
.ttm-appel::before{
  content:"";
  position:absolute;
  inset:-5px;
  z-index:-1;
  border:1px solid rgba(232,116,30,.35);
  border-radius:inherit;
  animation:ttm-pulse 2.4s ease-out infinite;
}
.ttm-appel>span{display:none!important}
.ttm-appel svg{position:relative!important;width:21px!important;height:21px!important;fill:currentColor!important}
.ttm-appel:hover{transform:translateY(-4px) scale(1.06);background:#f0832f!important;box-shadow:0 17px 34px -10px rgba(232,116,30,.6)!important}
.ttm-appel:focus-visible{outline:3px solid var(--accent-sur-sombre);outline-offset:4px}

/* Pied : le contenu V1 est conservé, avec une protection explicite à 390 px. */
footer{overflow-x:clip}
footer a[href^="mailto:"]{white-space:normal!important;overflow-wrap:anywhere;min-width:0}
footer .hv21b{display:inline-flex;align-items:center;gap:8px}
footer svg.ttm-ui-icon{width:14px;height:14px;display:block;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
footer a[data-retour-haut] span{flex:none}

/* Le Q de Bricolage Grotesque a une queue très longue. Comme chez Nemelec,
   seul U+0051 est remplacé par le glyphe de Plus Jakarta Sans. */
@font-face{
  font-family:'Bricolage Grotesque';
  font-style:normal;
  font-weight:200 800;
  font-display:swap;
  src:url(../eco/fonts/plus-jakarta-sans-latin.woff2) format('woff2-variations'),url(../eco/fonts/plus-jakarta-sans-latin.woff2) format('woff2');
  unicode-range:U+0051;
}
.de-title[tabindex="-1"]:focus,.de-title[tabindex="-1"]:focus-visible{outline:none}

@keyframes ttm-pulse{
  0%{opacity:.6;transform:scale(.82)}
  70%,100%{opacity:0;transform:scale(1.28)}
}

@media (max-width:420px){
  footer>div[style*="padding:0 24px"]{padding-left:16px!important;padding-right:16px!important}
  footer a[data-retour-haut]{margin-right:58px!important}
  .ttm-appel{right:14px!important;bottom:14px!important;width:52px!important;height:52px!important}
}

@media (prefers-reduced-motion:reduce){
  .ttm-appel,.ttm-appel::before{animation:none!important;transition:none!important}
  .ttm-appel:hover{transform:none}
}

/* Blocs d'appel « Parlons de votre projet » : sur le fond full black, la carte doit se détacher (Wakny, 30/10 : « noir sur noir, on voit pas ») */
.tta-callout,.ttp-cta,.tts-cta,.ttr-cta,.ttm-cta{--overlay-rgb:20,20,20;border:1px solid #2e2e2e;box-shadow:0 0 0 1px rgba(232,116,30,.14),0 30px 60px -32px rgba(232,116,30,.28)}
.tta-callout,.tta-callout-panel,.ttm-cta{background:#141414!important}

/* Cartes de services (accueil + /services) : empilées sur mobile, pas de rail horizontal (standard V3, 30/10) */
@media (max-width:767px){
  .grille-services-accueil{display:grid!important;grid-template-columns:minmax(0,1fr)!important;overflow:visible!important;gap:16px!important;padding:0!important;margin:0!important;scroll-snap-type:none!important}
  .grille-services-accueil>div{flex:none!important;width:auto!important}
}