/* =========================================================
   ORPI CPIMMO — main.css
   DA ORPI : rouge #E30613 dominant, blanc, #001825 réservé au texte.
   Montserrat partout, l'épaisseur porte la hiérarchie.
   Arrondis généralisés.
   Toutes les classes sont préfixées cp- pour éviter les conflits.
   ========================================================= */

:root{
  --cp-red:#E30613;
  --cp-red-dark:#B70510;
  --cp-red-soft:#FDEFF0;
  --cp-text:#001825;
  --cp-text-soft:#5A686F;
  --cp-white:#FFFFFF;
  --cp-grey:#F5F6F6;
  --cp-line:#E6E9EA;

  --cp-font:'Montserrat',system-ui,-apple-system,'Segoe UI',sans-serif;

  --cp-container:1240px;
  --cp-gutter:clamp(20px,5vw,40px);
  --cp-section:clamp(68px,8vw,112px);

  --cp-r-sm:8px;
  --cp-r:12px;
  --cp-r-lg:20px;
  --cp-r-btn:8px;
  --cp-r-pill:999px;

  --cp-header-h:78px;
}

/* ---------- Reset léger ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--cp-header-h) + 16px)}
body{
  margin:0;
  font-family:var(--cp-font);
  font-size:16px;
  font-weight:400;
  line-height:1.7;
  color:var(--cp-text);
  background:var(--cp-white);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
figure{margin:0}
/* Les éléments de formulaire n'héritent pas de la police par défaut */
button,input,select,textarea{font-family:inherit;font-size:inherit}

h1,h2,h3,h4{
  font-family:var(--cp-font);
  font-weight:800;
  letter-spacing:-.02em;
  line-height:1.15;
  color:var(--cp-text);
  margin:0 0 .5em;
  text-wrap:balance;
}
h1{font-size:clamp(2.25rem,4.4vw,3.5rem);line-height:1.1}
h2{font-size:clamp(1.75rem,3vw,2.5rem)}
h3{font-size:clamp(1.05rem,1.3vw,1.2rem);font-weight:700;line-height:1.35;letter-spacing:-.01em}
h4{font-size:.95rem;font-weight:700}
p{margin:0 0 1.1em}
p:last-child{margin-bottom:0}

/* ---------- Layout ---------- */
.wp-block-group.alignfull{width:100%;max-width:none}

.cp-shell{
  width:100%;
  max-width:var(--cp-container);
  margin-inline:auto;
  padding-inline:var(--cp-gutter);
}

/* Une section = un groupe alignfull + .cp-section.
   Le centrage sur 1240px vient du layout "constrained" de theme.json. */
.cp-section{padding-block:var(--cp-section);padding-inline:var(--cp-gutter)}
.cp-section > .wp-block-group__inner-container{
  width:100%;max-width:var(--cp-container);margin-inline:auto;
}
.cp-section.cp-bg-grey{background:var(--cp-grey)}
.cp-section.cp-bg-red{background:var(--cp-red);color:var(--cp-white)}
.cp-section.cp-bg-red h2,
.cp-section.cp-bg-red h3{color:var(--cp-white)}

/* ---------- En-tête de section ----------
   Indispensable : le sur-titre est en inline-block, donc si on le laisse en
   enfant direct de la section il se cale sur le bord de la fenêtre au lieu du
   bord du conteneur. Ce wrapper le remet dans l'axe du titre. */
.cp-section-head{max-width:var(--cp-container);margin-inline:auto}
.cp-section-head.cp-center{text-align:center}
/* Les titres ont un max-width : sans marges auto, le bloc reste collé à gauche
   même si son texte est centré. */
.cp-section-head.cp-center h2,
.cp-section-head.cp-center .cp-lead{margin-inline:auto}
.cp-section-head h2{margin-bottom:.35em}

/* ---------- Sur-titre ---------- */
.cp-eyebrow{
  display:inline-block;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--cp-red);
  background:var(--cp-red-soft);
  padding:7px 16px;
  border-radius:var(--cp-r-pill);
  margin:0 0 20px;
}
.cp-bg-red .cp-eyebrow{color:var(--cp-white);background:rgba(255,255,255,.2)}

.cp-lead{
  font-size:clamp(1rem,1.15vw,1.1rem);
  color:var(--cp-text-soft);
  max-width:64ch;
}
.cp-bg-red .cp-lead{color:rgba(255,255,255,.9)}
.cp-bg-red p{color:rgba(255,255,255,.9)}

/* ---------- Boutons ---------- */
.wp-block-button__link,
.cp-btn{
  font-family:var(--cp-font);
  font-weight:700;
  font-size:.92rem;
  line-height:1.2;
  border-radius:var(--cp-r-btn);
  padding:15px 26px;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
.cp-btn svg{width:15px;height:15px;fill:currentColor;flex:none}

/* Rouge sur fond clair */
.wp-block-button:not(.is-style-outline) .wp-block-button__link,
.cp-btn--primary{
  background:var(--cp-red);
  color:var(--cp-white);
  border:2px solid var(--cp-red);
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.cp-btn--primary:hover{
  background:var(--cp-red-dark);border-color:var(--cp-red-dark);
  transform:translateY(-2px);box-shadow:0 8px 20px rgba(227,6,19,.24);
}

.wp-block-button.is-style-outline .wp-block-button__link,
.cp-btn--ghost{
  background:transparent;
  border:2px solid var(--cp-line);
  color:var(--cp-text);
}
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.cp-btn--ghost:hover{border-color:var(--cp-red);color:var(--cp-red)}

/* Inversion sur les bandes rouges */
.cp-bg-red .wp-block-button:not(.is-style-outline) .wp-block-button__link,
.cp-hero .wp-block-button:not(.is-style-outline) .wp-block-button__link{
  background:var(--cp-white);color:var(--cp-red);border-color:var(--cp-white);
}
.cp-bg-red .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.cp-hero .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover{
  background:var(--cp-text);color:var(--cp-white);border-color:var(--cp-text);box-shadow:none;
}
.cp-bg-red .wp-block-button.is-style-outline .wp-block-button__link,
.cp-hero .wp-block-button.is-style-outline .wp-block-button__link{
  border-color:rgba(255,255,255,.65);color:var(--cp-white);
}
.cp-bg-red .wp-block-button.is-style-outline .wp-block-button__link:hover,
.cp-hero .wp-block-button.is-style-outline .wp-block-button__link:hover{
  border-color:var(--cp-white);background:var(--cp-white);color:var(--cp-red);
}

:where(a,button,input,textarea,select):focus-visible{
  outline:3px solid var(--cp-red);
  outline-offset:3px;
  border-radius:var(--cp-r-sm);
}

/* =========================================================
   HEADER
   ========================================================= */
.cp-header{
  position:sticky;top:0;z-index:60;
  background:rgba(255,255,255,.94);
  backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid var(--cp-line);
}
.cp-header__inner{height:var(--cp-header-h);display:flex;align-items:center;gap:28px}
.cp-header__logo{flex:none;display:flex;align-items:center;gap:14px;text-decoration:none}
.cp-header__logo img{height:30px;width:auto}
.cp-header__logo span{
  font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--cp-text);padding-left:14px;border-left:1px solid var(--cp-line);
}
.cp-nav{margin-left:auto;display:flex;align-items:center;gap:30px}
.cp-nav ul{list-style:none;display:flex;align-items:center;gap:30px;margin:0;padding:0}
.cp-nav ul a{
  font-size:.9rem;font-weight:600;text-decoration:none;color:var(--cp-text);
  position:relative;padding-block:5px;transition:color .18s ease;
}
.cp-nav ul a::after{
  content:"";position:absolute;left:0;bottom:0;width:0;height:2px;
  background:var(--cp-red);border-radius:var(--cp-r-pill);transition:width .22s ease;
}
.cp-nav ul a:hover{color:var(--cp-red)}
.cp-nav ul a:hover::after,
.cp-nav .current-anchor a::after{width:100%}
.cp-nav .current-anchor a{color:var(--cp-red)}
.cp-header__cta{flex:none}
.cp-header__cta .cp-btn{padding:11px 20px;font-size:.88rem}
.cp-nav__phone{display:none}

.cp-header__call{
  display:none;margin-left:auto;align-items:center;gap:8px;
  background:var(--cp-red);color:var(--cp-white);text-decoration:none;
  font-weight:700;font-size:.85rem;padding:11px 15px;border-radius:var(--cp-r-btn);
}
.cp-header__call svg{width:14px;height:14px;fill:currentColor;flex:none}
.cp-header__call:hover{background:var(--cp-red-dark)}

.cp-burger{
  display:none;width:46px;height:46px;
  border:1px solid var(--cp-line);border-radius:var(--cp-r-btn);
  background:transparent;cursor:pointer;
  align-items:center;justify-content:center;flex-direction:column;gap:5px;
}
.cp-burger span{display:block;width:18px;height:2px;border-radius:2px;background:var(--cp-red);transition:transform .2s ease,opacity .2s ease}
.cp-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.cp-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.cp-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media(max-width:1023px){
  .cp-header__call{display:inline-flex}
  .cp-burger{display:flex;margin-left:0}
  .cp-nav{
    position:fixed;inset:var(--cp-header-h) 0 auto 0;
    background:var(--cp-white);border-bottom:1px solid var(--cp-line);
    border-radius:0 0 var(--cp-r-lg) var(--cp-r-lg);
    flex-direction:column;align-items:stretch;gap:0;
    padding:12px var(--cp-gutter) 22px;margin:0;display:none;
    box-shadow:0 20px 40px rgba(0,24,37,.08);
  }
  .cp-nav.is-open{display:flex}
  .cp-nav ul{flex-direction:column;align-items:stretch;gap:0;width:100%}
  .cp-nav li{border-bottom:1px solid var(--cp-line)}
  .cp-nav ul a{display:block;padding:16px 0;font-size:1rem}
  .cp-header__cta{display:none}
  .cp-nav__phone{display:block;margin-top:18px}
  .cp-nav__phone .cp-btn{width:100%;justify-content:center}
}

/* =========================================================
   HERO — texte à gauche, photo sur la moitié droite
   Grille à deux colonnes : robuste, la photo ne peut pas retomber
   sous le texte comme le faisait l'ancienne version en position:absolute.
   ========================================================= */
.cp-hero{
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:stretch;
  height:80vh;
  min-height:520px;
  background:var(--cp-red);
  color:var(--cp-white);
  overflow:hidden;
}

/* Colonne gauche : le texte, dans un demi-conteneur aligné sur la grille du site */
.cp-hero__inner{
  display:flex;
  align-items:center;
  min-height:0;
  padding-block:clamp(36px,4vw,60px);
  /* aligne le texte sur le bord gauche du conteneur 1240px centré */
  padding-left:max(var(--cp-gutter), calc((100vw - var(--cp-container)) / 2 + var(--cp-gutter)));
  padding-right:clamp(28px,4vw,56px);
  overflow:auto;
}
.cp-hero__text{width:100%;max-width:none}

.cp-hero h1{color:var(--cp-white);max-width:15ch}
.cp-hero h1 mark{
  background:none;color:var(--cp-white);
  text-decoration:underline;text-decoration-thickness:4px;
  text-underline-offset:7px;text-decoration-color:rgba(255,255,255,.5);
}
.cp-hero .cp-lead{color:rgba(255,255,255,.92);max-width:44ch;font-size:1.08rem}
.cp-hero .wp-block-buttons{margin-top:32px;gap:12px}

/* Colonne droite : la photo, pleine hauteur, collée au bord droit.
   Le conteneur doit remplir sa cellule de grille en largeur ET en hauteur,
   sinon l'image size-full garde sa taille intrinsèque et ne fait que ~200px. */
.cp-hero__media{
  margin:0;position:relative;
  width:100%;height:100%;
  display:flex;
}
.cp-hero__media figure,
.cp-hero__media .wp-block-image{margin:0;width:100%;height:100%}
.cp-hero__media img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
}
/* Dégradé rouge sur le bord gauche de la photo, pour la souder à l'aplat */
.cp-hero__media::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,var(--cp-red) 0%,rgba(227,6,19,.28) 16%,rgba(227,6,19,0) 42%);
}

@media(max-width:860px){
  /* Sous 860px : une seule colonne, la photo passe en bandeau au-dessus du texte */
  .cp-hero{grid-template-columns:1fr;height:auto;min-height:0}
  .cp-hero__media{order:-1;height:clamp(220px,46vw,320px)}
  .cp-hero__media::before{background:linear-gradient(0deg,var(--cp-red) 0%,rgba(227,6,19,0) 45%)}
  .cp-hero__inner{
    min-height:0;
    padding:clamp(32px,7vw,52px) var(--cp-gutter);
  }
}

/* =========================================================
   AGENCE
   ========================================================= */
.cp-agence .wp-block-columns{gap:clamp(32px,6vw,72px);align-items:center}
.cp-agence h2{max-width:15ch}
/* Mosaïque de photos de l'agence : 1 grande + 3 petites.
   Ajouter/retirer une image .cp-mosaic__item adapte la grille automatiquement. */
.cp-mosaic{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.cp-mosaic__item{margin:0!important}
.cp-mosaic__item img{
  width:100%;height:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  border-radius:var(--cp-r);
  box-shadow:0 10px 28px rgba(0,24,37,.1);
}
/* La première photo occupe les deux colonnes du haut */
.cp-mosaic__item--big{grid-column:1 / -1}
.cp-mosaic__item--big img{aspect-ratio:16/10}

.cp-facts-list{
  list-style:none;margin:0;padding:22px 26px;
  background:var(--cp-grey);
  border-radius:var(--cp-r);
}
.cp-facts-list li{
  display:flex;justify-content:space-between;align-items:baseline;gap:20px;
  padding:13px 0;border-bottom:1px solid var(--cp-line);font-size:.9rem;
}
.cp-facts-list li:last-child{border-bottom:0;padding-bottom:0}
.cp-facts-list li:first-child{padding-top:0}
.cp-facts-list li strong{
  font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--cp-red);flex:none;
}
.cp-facts-list li span{text-align:right;font-weight:500;color:var(--cp-text)}

.cp-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.cp-chip{
  font-size:.75rem;font-weight:600;padding:8px 14px;
  border-radius:var(--cp-r-pill);
  color:var(--cp-text);background:var(--cp-white);
  border:1px solid var(--cp-line);
}

/* =========================================================
   OFFRE — grille de cartes
   ========================================================= */
.cp-offre-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  margin-top:52px;
}
.cp-offre-grid > .wp-block-group{margin:0}
.cp-offre-card{
  background:var(--cp-white);
  border:1px solid var(--cp-line);
  border-radius:var(--cp-r-lg);
  box-shadow:0 4px 20px rgba(0,24,37,.05);
  padding:30px 28px;
  display:flex;flex-direction:column;
  transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
.cp-offre-card:hover{
  border-color:var(--cp-red);transform:translateY(-4px);
  box-shadow:0 16px 34px rgba(0,24,37,.09);
}
.cp-offre-card__icon{
  width:54px;height:54px;flex:none;
  border-radius:16px;
  background:var(--cp-red-soft);
  display:grid;place-items:center;
  margin-bottom:20px;
}
.cp-offre-card__icon svg{
  width:25px;height:25px;
  fill:none;stroke:var(--cp-red);stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round;
}
.cp-offre-card h3{margin:0 0 9px;font-size:1.12rem;font-weight:800;color:var(--cp-text)}
.cp-offre-card > p{margin:0;font-size:.9rem;color:var(--cp-text-soft);line-height:1.65;flex:1}

.cp-offre-card__relief{
  margin-top:22px;padding-top:18px;
  border-top:1px solid var(--cp-line);
}
.cp-offre-card__relief-label{
  display:flex;align-items:center;gap:8px;
  font-size:.64rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;
  color:var(--cp-red);margin:0 0 6px;
}
.cp-offre-card__relief-label::before{
  content:"=";
  font-weight:800;font-size:1.1rem;line-height:1;
  color:var(--cp-red);flex:none;
  /* recale l'égal sur la ligne de base du label */
  position:relative;top:.02em;
}
.cp-offre-card__relief p{margin:0;font-size:.88rem;font-weight:600;color:var(--cp-text);line-height:1.55}

@media(max-width:960px){.cp-offre-grid{grid-template-columns:repeat(2,1fr);gap:18px}}
@media(max-width:620px){.cp-offre-grid{grid-template-columns:1fr}}

/* Encart GLI, mis en avant */
.cp-gli{
  margin-top:24px;
  background:var(--cp-red);
  color:var(--cp-white);
  border-radius:var(--cp-r-lg);
  padding:clamp(28px,3vw,40px);
  box-shadow:0 18px 44px rgba(227,6,19,.2);
}
.cp-gli .wp-block-columns{gap:clamp(24px,4vw,52px);align-items:center;margin:0}
.cp-gli h3{color:var(--cp-white);font-size:1.4rem;font-weight:800;margin:0 0 10px}
.cp-gli p{color:rgba(255,255,255,.92);margin:0;font-size:.95rem;line-height:1.65}
.cp-gli__badge{
  display:inline-block;font-size:.64rem;font-weight:700;letter-spacing:.13em;
  text-transform:uppercase;color:var(--cp-red);background:var(--cp-white);
  padding:6px 14px;border-radius:var(--cp-r-pill);margin:0 0 14px;
}
.cp-gli__list{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.cp-gli__list li{
  position:relative;padding-left:28px;
  font-size:.92rem;font-weight:600;color:var(--cp-white);line-height:1.5;
}
.cp-gli__list li::before{
  content:"";position:absolute;left:0;top:.35em;
  width:16px;height:16px;border-radius:50%;
  background:rgba(255,255,255,.22);
  border:2px solid var(--cp-white);
}

/* =========================================================
   ESTIMATION — bande rouge
   ========================================================= */
.cp-estimation .wp-block-columns{align-items:center;gap:clamp(28px,5vw,60px)}
.cp-estimation h2{max-width:18ch}
.cp-phone{display:inline-flex;align-items:center;gap:14px;text-decoration:none;margin-top:20px}
.cp-phone__icon{
  width:46px;height:46px;border-radius:50%;
  background:rgba(255,255,255,.18);
  display:grid;place-items:center;flex:none;
  transition:background .18s ease;
}
.cp-phone__icon svg{width:18px;height:18px;fill:var(--cp-white);transition:fill .18s ease}
.cp-phone:hover .cp-phone__icon{background:var(--cp-white)}
.cp-phone:hover .cp-phone__icon svg{fill:var(--cp-red)}
.cp-phone__label{
  font-size:.68rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(255,255,255,.78);display:block;margin-bottom:2px;
}
.cp-phone__number{font-size:1.3rem;font-weight:800;letter-spacing:-.02em;color:var(--cp-white)}

/* =========================================================
   ÉQUIPE — 2 lignes de 3
   ========================================================= */
.cp-team-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  margin-top:48px;
}
.cp-team-grid > .wp-block-group{margin:0}
.cp-team-card{
  border:1px solid var(--cp-line);
  border-radius:var(--cp-r-lg);
  overflow:hidden;
  background:var(--cp-white);
  box-shadow:0 4px 20px rgba(0,24,37,.05);
  transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease;
  display:flex;flex-direction:column;
}
.cp-team-card:hover{
  border-color:var(--cp-red);transform:translateY(-4px);
  box-shadow:0 16px 34px rgba(0,24,37,.09);
}
.cp-team-card figure,.cp-team-card .wp-block-image{margin:0}
.cp-team-card img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:0}
.cp-team-card__body{padding:22px 24px 24px}
.cp-team-card h3{font-size:1.05rem;font-weight:800;margin:0 0 4px}
.cp-team-card__role{font-size:.78rem;font-weight:600;color:var(--cp-text-soft);margin:0 0 14px}
.cp-team-card__tel{
  font-size:.9rem;font-weight:700;color:var(--cp-red);text-decoration:none;
  display:inline-flex;align-items:center;gap:8px;
  background:var(--cp-red-soft);padding:9px 16px;border-radius:var(--cp-r-pill);
  transition:background .18s ease,color .18s ease;
}
.cp-team-card__tel:hover{background:var(--cp-red);color:var(--cp-white)}

@media(max-width:900px){.cp-team-grid{grid-template-columns:repeat(2,1fr);gap:18px}}
@media(max-width:560px){.cp-team-grid{grid-template-columns:1fr}}

/* Variante à 2 collaborateurs : deux cartes centrées, sans étirement */
.cp-team-grid--2{
  grid-template-columns:repeat(2,minmax(0,340px));
  justify-content:center;
}
@media(max-width:560px){.cp-team-grid--2{grid-template-columns:minmax(0,360px)}}

/* =========================================================
   AVIS — carrousel
   ========================================================= */
.cp-carousel{position:relative;margin-top:42px}
.cp-carousel__viewport{overflow:hidden;padding:6px 0}
.cp-carousel__track{display:flex;align-items:stretch;gap:20px;transition:transform .45s cubic-bezier(.4,0,.2,1);will-change:transform}
.cp-carousel__track > *{flex:0 0 calc((100% - 40px)/3);margin:0}
@media(max-width:1023px){.cp-carousel__track > *{flex-basis:calc((100% - 20px)/2)}}
@media(max-width:640px){.cp-carousel__track > *{flex-basis:100%}}

.cp-avis-card{
  border:1px solid var(--cp-line);
  border-radius:var(--cp-r-lg);
  background:var(--cp-white);
  box-shadow:0 4px 20px rgba(0,24,37,.05);
  padding:30px 28px;
  display:flex;flex-direction:column;gap:14px;
  position:relative;
}
.cp-avis-card::before{
  content:"\201C";
  position:absolute;top:14px;right:26px;
  font-size:4.5rem;font-weight:800;line-height:1;
  color:var(--cp-red-soft);
}
.cp-avis-card__stars{
  color:#FBBC04;
  font-size:1.05rem;
  letter-spacing:2px;
  line-height:1;
  margin:0;
  position:relative;
}
.cp-avis-card__text{font-size:.95rem;line-height:1.7;color:var(--cp-text);margin:0;flex:1;position:relative}
.cp-avis-card__author{
  font-size:.78rem;font-weight:700;color:var(--cp-text-soft);margin:0;
  padding-top:14px;border-top:1px solid var(--cp-line);
}
.cp-carousel__nav{display:flex;gap:10px;margin-top:26px}
.cp-avis__all{margin-top:40px;justify-content:center}
.cp-carousel__btn{
  width:46px;height:46px;border:1px solid var(--cp-line);background:var(--cp-white);
  border-radius:50%;cursor:pointer;display:grid;place-items:center;color:var(--cp-text);
  transition:border-color .18s ease,background .18s ease,color .18s ease;
}
.cp-carousel__btn:hover:not(:disabled){border-color:var(--cp-red);background:var(--cp-red);color:var(--cp-white)}
.cp-carousel__btn:disabled{opacity:.35;cursor:not-allowed}
.cp-carousel__btn svg{width:16px;height:16px;fill:currentColor}

/* =========================================================
   ACTUS — query loop
   ========================================================= */
.cp-actus h2{max-width:18ch}
.cp-actus .wp-block-post-template{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:24px;margin-top:44px;list-style:none;padding:0;
}
.cp-actus .wp-block-post-template > li{
  border:1px solid var(--cp-line);border-radius:var(--cp-r-lg);overflow:hidden;
  background:var(--cp-white);display:flex;flex-direction:column;
  box-shadow:0 4px 20px rgba(0,24,37,.05);
  transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
.cp-actus .wp-block-post-template > li:hover{
  border-color:var(--cp-red);transform:translateY(-4px);box-shadow:0 16px 34px rgba(0,24,37,.09);
}
.cp-actus .wp-block-post-featured-image{margin:0}
.cp-actus .wp-block-post-featured-image img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:0}
.cp-actus .wp-block-post-date{
  font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--cp-red);margin:22px 24px 8px;
}
.cp-actus .wp-block-post-title{
  font-size:1.08rem;font-weight:800;letter-spacing:-.01em;line-height:1.35;margin:0 24px 10px;
}
.cp-actus .wp-block-post-title a{text-decoration:none}
.cp-actus .wp-block-post-title a:hover{color:var(--cp-red)}
.cp-actus .wp-block-post-excerpt{margin:0 24px 24px}
.cp-actus .wp-block-post-excerpt__excerpt{font-size:.9rem;color:var(--cp-text-soft);line-height:1.65}
.cp-actus .wp-block-post-excerpt__more-link{font-size:.85rem;font-weight:700;color:var(--cp-red);text-decoration:none}

/* Bouton « Voir nos articles » et arrivée des cartes */
.cp-actus__more{margin-top:44px;justify-content:center}
.cp-actus__more[hidden]{display:none}
.cp-actus .wp-block-post-template > li.is-hidden{display:none}
.cp-actus .wp-block-post-template > li.is-loaded,
.cp-actus .wp-block-post-template > li.is-hidden{opacity:0;transform:translateY(14px)}
.cp-actus .wp-block-post-template > li.is-in{
  opacity:1;transform:none;
  transition:opacity .45s ease,transform .45s ease;
}
.cp-actus__external{
  margin:18px 0 0;
}
.cp-actus__external a{
  font-size:.9rem;
  font-weight:700;
  color:var(--cp-red);
  text-decoration:none;
}
.cp-actus__external a:hover{text-decoration:underline}
.cp-actus__end{
  text-align:center;margin:44px 0 0;
  font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--cp-text-soft);
}
@media(prefers-reduced-motion:reduce){
  .cp-actus .wp-block-post-template > li.is-loaded{opacity:1;transform:none}
}

/* =========================================================
   CONTACT
   ========================================================= */
.cp-contact .wp-block-columns{gap:clamp(24px,4vw,40px);align-items:stretch}
.cp-contact__form{
  background:var(--cp-white);border:1px solid var(--cp-line);
  border-radius:var(--cp-r-lg);padding:clamp(26px,3vw,40px);
  box-shadow:0 4px 20px rgba(0,24,37,.05);
}
.cp-contact__aside{
  background:var(--cp-red);color:var(--cp-white);
  border-radius:var(--cp-r-lg);padding:clamp(26px,3vw,38px);
}
.cp-contact__aside h3{color:var(--cp-white);font-size:1.1rem;font-weight:800;margin:0 0 6px}
.cp-info-block{padding:20px 0;border-bottom:1px solid rgba(255,255,255,.24)}
.cp-info-block:first-of-type{padding-top:0}
.cp-info-block:last-of-type{border-bottom:0;padding-bottom:0}
.cp-info-block__label{
  font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:rgba(255,255,255,.75);margin:0 0 8px;
}
.cp-info-block p{margin:0;color:rgba(255,255,255,.95);font-size:.92rem;line-height:1.75}
.cp-info-block a{color:var(--cp-white);text-decoration:none;font-weight:700}
.cp-info-block a:hover{text-decoration:underline}

/* =========================================================
   FORMINATOR — aligné sur la charte
   On cible large : la section contact entière ET la classe du form,
   pour que le style s'applique même si le motif a été inséré sans
   la classe .cp-contact__form (spécificité renforcée + !important). */
.cp-contact .forminator-ui.forminator-custom-form input[type=text],
.cp-contact .forminator-ui.forminator-custom-form input[type=email],
.cp-contact .forminator-ui.forminator-custom-form input[type=tel],
.cp-contact .forminator-ui.forminator-custom-form input[type=number],
.cp-contact .forminator-ui.forminator-custom-form select,
.cp-contact .forminator-ui.forminator-custom-form textarea{
  border-radius:var(--cp-r-sm)!important;
  border:1px solid var(--cp-line)!important;
  font-family:var(--cp-font)!important;
  font-size:.95rem!important;
}
.cp-contact .forminator-ui.forminator-custom-form input:focus,
.cp-contact .forminator-ui.forminator-custom-form select:focus,
.cp-contact .forminator-ui.forminator-custom-form textarea:focus{
  border-color:var(--cp-red)!important;
  box-shadow:0 0 0 3px rgba(227,6,19,.15)!important;
}
.cp-contact .forminator-ui.forminator-custom-form .forminator-label,
.cp-contact .forminator-ui.forminator-custom-form label{
  font-family:var(--cp-font)!important;
  font-weight:600!important;
  color:var(--cp-text)!important;
}

/* Le bouton d'envoi : ciblé de plusieurs manières pour être sûr de l'atteindre,
   et calé exactement sur .cp-btn--primary (rouge, arrondi 8px, hover foncé). */
.cp-contact .forminator-ui.forminator-custom-form button.forminator-button-submit,
.cp-contact .forminator-ui.forminator-custom-form .forminator-button.forminator-button-submit,
.cp-contact .forminator-ui .forminator-button-submit,
.cp-contact button.forminator-button-submit,
.cp-contact .forminator-button-submit{
  background:var(--cp-red)!important;
  background-image:none!important;
  color:var(--cp-white)!important;
  border:2px solid var(--cp-red)!important;
  border-radius:var(--cp-r-btn)!important;
  font-family:var(--cp-font)!important;
  font-weight:700!important;
  font-size:.92rem!important;
  letter-spacing:0!important;
  padding:15px 30px!important;
  text-transform:none!important;
  box-shadow:none!important;
  transition:background .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease!important;
}
.cp-contact .forminator-ui.forminator-custom-form button.forminator-button-submit:hover,
.cp-contact .forminator-ui .forminator-button-submit:hover,
.cp-contact button.forminator-button-submit:hover,
.cp-contact .forminator-button-submit:hover{
  background:var(--cp-red-dark)!important;
  border-color:var(--cp-red-dark)!important;
  transform:translateY(-2px)!important;
  box-shadow:0 8px 20px rgba(227,6,19,.24)!important;
}

/* =========================================================
   FOOTER — rouge
   ========================================================= */
.cp-footer{background:var(--cp-red);color:rgba(255,255,255,.9);padding-block:64px 26px}
.cp-footer__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
@media(max-width:900px){.cp-footer__grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.cp-footer__grid{grid-template-columns:1fr}}
.cp-footer img.cp-footer__logo{height:30px;width:auto;filter:brightness(0) invert(1)}
.cp-footer h4{
  font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:rgba(255,255,255,.75);margin:0 0 14px;
}
.cp-footer p,.cp-footer li{font-size:.9rem;line-height:1.8;margin:0}
.cp-footer ul{list-style:none;margin:0;padding:0}
.cp-footer a{color:var(--cp-white);text-decoration:none;font-weight:600}
.cp-footer a:hover{text-decoration:underline}
.cp-footer__bottom{
  margin-top:48px;padding-top:22px;border-top:1px solid rgba(255,255,255,.26);
  display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
  font-size:.8rem;color:rgba(255,255,255,.82);
}
.cp-footer__legal{display:flex;gap:22px;flex-wrap:wrap}
.cp-footer__jade{text-decoration:none}

/* =========================================================
   PAGES INTERNES / BLOG
   ========================================================= */
.cp-page-header{background:var(--cp-grey);padding-block:clamp(52px,6vw,84px) clamp(38px,4vw,56px);border-bottom:1px solid var(--cp-line)}
.cp-page-header h1{font-size:clamp(1.9rem,3.6vw,2.9rem);margin:0}
.cp-entry{padding-block:var(--cp-section)}
.cp-entry__content{max-width:74ch;margin-inline:auto}
.cp-entry__content h2{margin-top:1.8em}
.cp-entry__content img{border-radius:var(--cp-r);margin-block:2em}
.cp-archive-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:24px}
.cp-archive-card{
  border:1px solid var(--cp-line);border-radius:var(--cp-r-lg);overflow:hidden;
  display:flex;flex-direction:column;
  transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
.cp-archive-card:hover{border-color:var(--cp-red);transform:translateY(-4px);box-shadow:0 16px 34px rgba(0,24,37,.09)}
.cp-archive-card img{width:100%;aspect-ratio:16/10;object-fit:cover}
.cp-archive-card__body{padding:24px}
.cp-archive-card h2{font-size:1.12rem;font-weight:800;margin:0 0 8px}
.cp-archive-card h2 a{text-decoration:none}
.cp-archive-card__date{
  font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--cp-red);margin:0 0 10px;
}
.cp-pagination{margin-top:48px;display:flex;gap:8px;flex-wrap:wrap}
.cp-pagination .page-numbers{
  padding:11px 17px;border:1px solid var(--cp-line);border-radius:var(--cp-r-btn);
  text-decoration:none;font-weight:700;font-size:.88rem;
}
.cp-pagination .page-numbers.current{background:var(--cp-red);color:var(--cp-white);border-color:var(--cp-red)}
.cp-back-link{
  font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--cp-red);text-decoration:none;display:inline-block;margin-bottom:18px;
}

/* =========================================================
   BOUTON FLOTTANT D'APPEL — vertical, bord droit
   ========================================================= */
.cp-float-call{
  position:fixed;
  top:50%;
  right:0;
  transform:translateY(-50%);
  z-index:80;
  display:flex;
  align-items:center;
  gap:9px;
  /* texte vertical : le bouton se dresse le long du bord droit,
     sans les débordements imprévisibles d'une rotation. */
  writing-mode:vertical-rl;
  background:var(--cp-red);
  color:var(--cp-white);
  text-decoration:none;
  font-family:var(--cp-font);
  font-weight:700;
  font-size:.92rem;
  letter-spacing:.02em;
  padding:18px 12px;
  border-radius:var(--cp-r-btn) 0 0 var(--cp-r-btn);
  box-shadow:0 6px 22px rgba(0,24,37,.18);
  transition:background .18s ease,padding .18s ease;
}
.cp-float-call svg{width:16px;height:16px;fill:currentColor;flex:none;transform:rotate(90deg)}
.cp-float-call:hover{background:var(--cp-red-dark);padding-block:26px}

@media(max-width:860px){
  /* Sur mobile : bouton rond compact en bas à droite, plus ergonomique au pouce */
  .cp-float-call{
    writing-mode:horizontal-tb;
    top:auto;bottom:22px;right:18px;
    transform:none;
    border-radius:var(--cp-r-pill);
    padding:14px 18px;
    box-shadow:0 8px 24px rgba(227,6,19,.35);
  }
  .cp-float-call svg{transform:none;width:18px;height:18px}
  .cp-float-call span{display:none}
}

/* =========================================================
   RÉVÉLATION AU SCROLL
   ========================================================= */
.cp-reveal{opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s ease}
.cp-reveal.is-in{opacity:1;transform:none}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
  .cp-reveal{opacity:1;transform:none}
}

/* Utilitaires */
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.cp-skip-link{position:absolute;left:-9999px;top:0;background:var(--cp-red);color:#fff;padding:12px 18px;border-radius:var(--cp-r-sm);z-index:100}
.cp-skip-link:focus{left:8px;top:8px}
