/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Oct 02 2026 | 09:38:51 */
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@400;500;700;800&family=Poppins:wght@300;400;500;600&display=swap');

/* ============================================================
   COVAL, fiche réalisation (case study)
   Feuille de style SCOPÉE sous .coval-realisation : aucune règle
   globale, rien ne déborde sur le reste de la page WordPress.
   Les composants du site (01 avis, 06 garanties, 07b zone, 08 CTA)
   sont stylés par le CSS du thème, PAS par ce fichier.
   Variables locales (pas de :root global).
   ============================================================ */

.coval-realisation{
  --orange:#F08700; --orange-hover:#D97700; --orange-light:#FFF3E0;
  --blue:#2B2E80; --blue-mid:#3D4199; --blue-dark:#1a1d5e; --blue-light:#F0F1FA;
  --white:#FFFFFF; --bg-light:#F8F8FC;
  --text:#2D2D2D; --text-light:#666666; --border:#E8E8F0;
  --shadow:0 4px 24px rgba(43,46,128,0.10);
  --radius:12px; --radius-sm:6px; --transition:0.25s ease;
  --font-head:'M PLUS Rounded 1c',sans-serif; --font-body:'Poppins',sans-serif;

  --bg-grey:#F1F2F8;
  width:100%;
  font-family:var(--font-body); color:var(--text); background:var(--white);
  line-height:1.65;
}
/* Bandes pleine largeur + conteneur intérieur centré (large, comme une page principale) */
.coval-realisation .cs-in{max-width:1160px;margin:0 auto;padding:0 32px;}
.coval-realisation .cs-band{width:100vw;margin-left:calc(50% - 50vw);padding:48px 0;}
.coval-realisation .cs-band:first-child{padding-top:28px;}
.coval-realisation .cs-band--grey{background:var(--bg-grey);}

/* Bloc avis (composant 01 hero-trust) adapté au fond clair des pages réalisation */
.coval-realisation .hero-trust{margin:0;padding:0;border-top:none;justify-content:flex-start;gap:16px;flex-wrap:wrap;}
.coval-realisation .trust-detail{color:var(--text-light);}
.coval-realisation .trust-detail strong{color:var(--blue);}
.coval-realisation *,.coval-realisation *::before,.coval-realisation *::after{box-sizing:border-box;}
.coval-realisation h1,.coval-realisation h2,.coval-realisation h3{font-family:var(--font-head);color:var(--blue);line-height:1.25;margin:0;}
.coval-realisation a:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:2px;}

/* Fil d'Ariane */
.coval-realisation .cs-crumb{font-size:.8rem;color:var(--text-light);padding:22px 0 24px;}
.coval-realisation .cs-crumb a{color:var(--text-light);text-decoration:none;}
.coval-realisation .cs-crumb a:hover{color:var(--orange);}
.coval-realisation .cs-crumb span{color:var(--blue);font-weight:500;}

/* En-tête, calé à gauche */
.coval-realisation .cs-head{max-width:760px;}
.coval-realisation .cs-tags{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-wrap:wrap;gap:6px 0;
  font-family:var(--font-head);font-weight:700;font-size:.9rem;color:var(--blue-mid);}
.coval-realisation .cs-tags li:not(:last-child){margin-right:14px;padding-right:14px;border-right:1px solid var(--border);}
.coval-realisation .cs-head h1{font-weight:800;font-size:clamp(2rem,5vw,3rem);margin:0 0 18px;}
.coval-realisation .cs-lead{font-size:1.15rem;color:var(--text-light);max-width:58ch;margin:0;}

/* Zones photo */
.coval-realisation .cs-photo{position:relative;background:var(--blue-light);border:2px dashed #C3C6E8;border-radius:var(--radius);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--blue-mid);
  text-align:center;padding:20px;min-height:100%;}
.coval-realisation .cs-photo{overflow:hidden;}
.coval-realisation .cs-photo:has(img){padding:0;border:none;background:none;}
.coval-realisation .cs-photo img{width:100%;height:100%;object-fit:cover;display:block;}
.coval-realisation .cs-photo svg{width:32px;height:32px;opacity:.6;}
.coval-realisation .cs-photo .cap{font-family:var(--font-head);font-weight:700;font-size:.8rem;}
.coval-realisation .cs-photo .hint{font-size:.72rem;color:var(--text-light);}
.coval-realisation .cs-hero-photo{aspect-ratio:21/9;margin-bottom:-44px;}

/* Bandeau de tuiles stats, posé sur la photo */
.coval-realisation .cs-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;position:relative;z-index:2;
  max-width:760px;margin:0 auto;}
.coval-realisation .cs-stat{background:var(--white);border-radius:var(--radius);padding:16px 12px;box-shadow:var(--shadow);text-align:center;}
.coval-realisation .cs-stat .n{font-family:var(--font-head);font-weight:800;font-size:1.35rem;color:var(--blue);white-space:nowrap;}
.coval-realisation .cs-stat .n small{font-size:.85rem;font-weight:700;}
.coval-realisation .cs-stat .l{font-size:.66rem;color:var(--text-light);text-transform:uppercase;letter-spacing:.06em;margin-top:3px;}

/* Fiche d'identité, grille compacte */
.coval-realisation .cs-panel{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px 28px;margin:0;}
.coval-realisation .cs-panel h2{font-size:.9rem;text-transform:uppercase;letter-spacing:.08em;font-weight:800;color:var(--blue);
  padding-bottom:12px;border-bottom:2px solid var(--orange);margin:0 0 18px;}
.coval-realisation .cs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px 28px;margin:0;}
.coval-realisation .cs-grid .c{margin:0;}
.coval-realisation .cs-grid .c .k{font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-light);margin:0;}
.coval-realisation .cs-grid .c .v{font-family:var(--font-head);font-weight:700;color:var(--blue);font-size:.98rem;margin:2px 0 0;}

/* Sections récit */
.coval-realisation .cs-section{margin:0;}
.coval-realisation .cs-section .kicker{font-family:var(--font-head);font-weight:800;font-size:.7rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--orange);margin-bottom:8px;}
.coval-realisation .cs-section h2{font-size:1.5rem;margin:0 0 14px;}
.coval-realisation .cs-section p{margin:0 0 14px;font-size:1.02rem;}
.coval-realisation .cs-section p strong{color:var(--blue);}

.coval-realisation .cs-chips{list-style:none;margin:12px 0;padding:0;display:flex;flex-wrap:wrap;gap:10px;}
.coval-realisation .cs-chip{background:var(--white);border:1px solid var(--border);border-radius:100px;padding:8px 15px;
  font-size:.84rem;color:var(--text);box-shadow:var(--shadow);display:inline-flex;align-items:center;gap:8px;}
.coval-realisation .cs-chip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--orange);}

.coval-realisation .cs-quote{background:var(--blue-light);border-radius:0 var(--radius) var(--radius) 0;
  padding:18px 22px;font-style:italic;color:var(--blue-dark);margin:16px 0;font-size:1.05rem;}

/* Galerie, 3 photos (défaut) : grande à gauche + deux empilées à droite */
.coval-realisation .cs-gallery{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:170px 170px;gap:14px;margin:18px 0;}
.coval-realisation .cs-gallery .cs-photo:first-child{grid-row:span 2;}

/* Galerie adaptative : 1 ou 2 photos (la template affiche moins sans trou) */
.coval-realisation .cs-gallery:has(.cs-photo:only-child){grid-template-columns:1fr;grid-template-rows:auto;}
.coval-realisation .cs-gallery:has(.cs-photo:only-child) .cs-photo{grid-row:auto;aspect-ratio:16/9;}
.coval-realisation .cs-gallery:has(.cs-photo:nth-child(2):last-child){grid-template-columns:1fr 1fr;grid-template-rows:auto;}
.coval-realisation .cs-gallery:has(.cs-photo:nth-child(2):last-child) .cs-photo{grid-row:auto;aspect-ratio:4/3;}

/* Budget */
.coval-realisation .cs-budget{background:var(--orange-light);border-radius:var(--radius);padding:28px 24px;text-align:center;margin:0;}
.coval-realisation .cs-budget .l{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--orange-hover);font-weight:600;}
.coval-realisation .cs-budget .n{font-family:var(--font-head);font-weight:800;font-size:2rem;color:var(--orange-hover);margin:4px 0;}
.coval-realisation .cs-budget .sub{font-size:.78rem;color:var(--text-light);}

@media(max-width:760px){
  .coval-realisation .cs-grid{grid-template-columns:repeat(2,1fr);}
  .coval-realisation .cs-hero-photo{aspect-ratio:16/9;margin-bottom:-36px;}
}
@media(max-width:560px){
  .coval-realisation .cs-head h1{font-size:1.8rem;}
  .coval-realisation .cs-stats{grid-template-columns:1fr 1fr;}
  .coval-realisation .cs-gallery{grid-template-columns:1fr;grid-template-rows:auto;}
  .coval-realisation .cs-gallery .cs-photo{aspect-ratio:16/9;grid-row:auto!important;}
  .coval-realisation .cs-grid{grid-template-columns:1fr;}
}