.elementor-369 .elementor-element.elementor-element-56f6c7c{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-79d0a16 */.p{
  --p-green:#115A65;
  --p-dark:#0B3C45;
  --p-light:#EAF1F2;
  --p-gray:#F5F4F1;
  --p-border:#E2E2DD;
  --p-text:#3D3D3D;
  --p-muted:#888;

  width:100% !important;
  max-width:100% !important;
  overflow-x:hidden !important;
  font-family:'Jost',sans-serif !important;
  color:#0E1C1F !important;
  line-height:1.6 !important;
}
.p *{ box-sizing:border-box !important }
.p img{ display:block !important; max-width:100% !important; height:auto }
.p a{ text-decoration:none !important }
.pw,.pwx{
  width:100% !important;
  max-width:1200px !important;
  margin:0 auto !important;
  padding-left:48px !important;
  padding-right:48px !important;
}
.pwx{ max-width:1400px !important }

/* Animations */
.pf { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease }
.pf.on { opacity: 1 !important; transform: none !important }
.pfl { opacity: 0; transform: translateX(-32px); transition: opacity .8s ease, transform .8s ease }
.pfl.on { opacity: 1 !important; transform: none !important }
.pfr { opacity: 0; transform: translateX(32px); transition: opacity .8s ease, transform .8s ease }
.pfr.on { opacity: 1 !important; transform: none !important }
.pd1 { transition-delay: .1s } .pd2 { transition-delay: .2s }
.pd3 { transition-delay: .3s } .pd4 { transition-delay: .4s }

/* Boutons */
.pbtn {
  display: inline-flex !important; align-items: center !important; gap: 9px !important;
  padding: 14px 32px !important; font-family: 'Jost', sans-serif !important;
  font-size: 11px !important; font-weight: 700 !important; letter-spacing: 2px !important;
  text-transform: uppercase !important; border: none !important; border-radius: 4px !important;
  cursor: pointer !important; transition: all .25s !important; line-height: 1 !important;
}
.pbtn-g  { background: #115A65 !important; color: #fff !important }
.pbtn-g:hover { background: #0B3C45 !important }
.pbtn-g svg { stroke: #fff !important }
.pbtn-dk { background: #0B3C45 !important; color: #fff !important }
.pbtn-dk:hover { background: #072830 !important }
.pbtn-dk svg { stroke: #fff !important }
.pbtn-w  { background: #fff !important; color: #0B3C45 !important }
.pbtn-w:hover { background: #EAF1F2 !important }
.pbtn-ow { background: transparent !important; color: #fff !important; border: 1.5px solid rgba(255,255,255,.5) !important }
.pbtn-ow:hover { background: rgba(255,255,255,.1) !important }
.pbtn-ol { background: transparent !important; color: #115A65 !important; border: 1.5px solid #115A65 !important }
.pbtn-ol:hover { background: #115A65 !important; color: #fff !important }
.pbtn svg { width: 14px !important; height: 14px !important; fill: none !important; stroke: currentColor !important; flex-shrink: 0 !important; transition: transform .2s !important }
.pbtn:hover svg { transform: translateX(3px) !important }

/* ══════════════════════════════════════════════════
   §1. HERO — image plein fond + formulaire overlay
══════════════════════════════════════════════════ */
.p-hero {
  position: relative !important; min-height: 100vh !important;
  display: flex !important; align-items: center !important; overflow: hidden !important;
}
.p-hero__bg { position: absolute !important; inset: 0 !important; z-index: 0 !important }
.p-hero__bg img { width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center !important }
.p-hero__bg::after {
  content: '' !important; position: absolute !important; inset: 0 !important;
  background: linear-gradient(105deg, rgba(7,40,48,.96) 0%, rgba(7,40,48,.88) 40%, rgba(7,40,48,.6) 70%, rgba(7,40,48,.45) 100%) !important;
}
/* Fil d'Ariane */
.p-hero__bc {
  position: absolute !important; top: 28px !important; left: 48px !important; z-index: 4 !important;
  display: flex !important; align-items: center !important; gap: 8px !important;
  font-size: 11px !important; color: rgba(255,255,255,.45) !important;
}
.p-hero__bc a { color: rgba(255,255,255,.65) !important; transition: color .2s !important }
.p-hero__bc a:hover { color: #A8CDD3 !important }
/* Contenu intérieur */
.p-hero__inner {
  position: relative !important; z-index: 2 !important;
  width: 100% !important; padding: 110px 48px 80px !important;
  display: grid !important; grid-template-columns: 1fr 420px !important;
  gap: 64px !important; align-items: center !important;
  max-width: 1400px !important; margin: 0 auto !important;
}
/* Texte */
.p-hero__eyebrow {
  font-size: 10px !important; font-weight: 700 !important; letter-spacing: 3px !important;
  text-transform: uppercase !important; color: #A8CDD3 !important;
  display: flex !important; align-items: center !important; gap: 12px !important; margin-bottom: 20px !important;
}
.p-hero__eyebrow::before { content: '' !important; width: 32px !important; height: 1px !important; background: #A8CDD3 !important }
.p-hero__h1 {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: clamp(40px, 6.2vw, 53px) !important;
  font-weight: 700 !important; line-height: 1.3 !important;
  color: #fff !important; letter-spacing: -1px !important; margin-bottom: 20px !important;
}
.p-hero__h1 em { font-style: italic !important; color: #A8CDD3 !important }
.p-hero__sub {
  font-size: 16px !important; color: rgba(255,255,255,.68) !important;
  line-height: 1.72 !important; max-width: 460px !important; margin-bottom: 36px !important;
}
/* Stats ligne */
.p-hero__stats {
  display: flex !important; gap: 32px !important; margin-bottom: 36px !important;
  padding-bottom: 32px !important; border-bottom: 1px solid rgba(255,255,255,.12) !important;
}
.p-hero__stat-n {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 36px !important; font-weight: 700 !important; color: #fff !important;
  line-height: 1 !important; display: block !important;
}
.p-hero__stat-l {
  font-size: 10px !important; color: rgba(255,255,255,.45) !important;
  letter-spacing: 1px !important; text-transform: uppercase !important; margin-top: 4px !important;
}
.p-hero__btns { display: flex !important; gap: 12px !important; flex-wrap: wrap !important }

/* ── Formulaire hero ── */
.p-form {
  background: #fff !important; border-radius: 3px !important;
  box-shadow: 0 32px 80px rgba(0,0,0,.35) !important;
  overflow: hidden !important;
}
.p-form__head {
  background: #0B3C45 !important; padding: 24px 28px !important;
}
.p-form__head h3 {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 22px !important; font-weight: 700 !important; color: #fff !important; margin-bottom: 3px !important;
}
.p-form__head p { font-size: 12px !important; color: rgba(255,255,255,.5) !important }
.p-form__body { padding: 24px 28px !important }
.p-form { display: flex !important; flex-direction: column !important }
.p-form__fields { display: flex !important; flex-direction: column !important; gap: 12px !important }
.p-form__row { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 12px !important }
.p-form__field { display: flex !important; flex-direction: column !important; gap: 4px !important }
.p-form__label {
  font-size: 10px !important; font-weight: 700 !important; letter-spacing: 1.2px !important;
  text-transform: uppercase !important; color: #555 !important;
}
.p-form__inp,
.p-form__sel,
.p-form__ta {
  width: 100% !important; padding: 10px 14px !important;
  font-family: 'Jost', sans-serif !important; font-size: 13.5px !important; color: #0E1C1F !important;
  background: #F9F9F8 !important; border: 1px solid #E2E2DD !important;
  border-radius: 3px !important; outline: none !important;
  transition: border-color .2s, box-shadow .2s !important; -webkit-appearance: none !important;
}
.p-form__inp:focus, .p-form__sel:focus, .p-form__ta:focus {
  border-color: #115A65 !important; box-shadow: 0 0 0 3px rgba(17,90,101,.1) !important;
  background: #fff !important;
}
.p-form__inp::placeholder, .p-form__ta::placeholder { color: #aaa !important }
.p-form__ta { resize: vertical !important; min-height: 80px !important; line-height: 1.6 !important }
.p-form__submit {
  width: 100% !important; padding: 14px !important; background: #115A65 !important; color: #fff !important;
  font-family: 'Jost', sans-serif !important; font-size: 11px !important; font-weight: 700 !important;
  letter-spacing: 2px !important; text-transform: uppercase !important;
  border: none !important; border-radius: 3px !important; cursor: pointer !important;
  transition: background .22s !important; margin-top: 6px !important;
  display: flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
}
.p-form__submit:hover { background: #0B3C45 !important }
.p-form__submit svg { width: 14px !important; height: 14px !important; stroke: #fff !important; fill: none !important }
.p-form__note {
  font-size: 11px !important; color: #999 !important; text-align: center !important;
  margin-top: 10px !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 5px !important;
}

/* ══════════════════════════════════════════════════
   §2. VALEURS — fond beige-gris luxe, 4 points
══════════════════════════════════════════════════ */
.p-vals { padding: 80px 0 !important; background: #F5F4F1 !important; border-bottom: 1px solid #E2E2DD !important }
.p-vals__head { text-align: center !important; max-width: 540px !important; margin: 0 auto 52px !important }
.p-vals__head h2 {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: clamp(28px, 3vw, 40px) !important; font-weight: 700 !important; color: #0E1C1F !important;
}
.p-vals__head p { font-size: 17px !important; color: #666 !important; margin-top: 10px !important }
.p-vals__grid { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 2px !important }
.p-val {
  background: #fff !important; padding: 36px 30px !important;
  border-bottom: 3px solid transparent !important;
  transition: border-color .25s, box-shadow .25s !important;
}
.p-val:hover { border-color: #115A65 !important; box-shadow: 0 6px 24px rgba(17,90,101,.07) !important }
.p-val__icon { width: 48px !important; height: 48px !important; object-fit: contain !important; margin-bottom: 18px !important }
.p-val h3 { font-size: 15px !important; font-weight: 700 !important; color: #0E1C1F !important; margin-bottom: 8px !important }
.p-val p { font-size: 13.5px !important; color: #666 !important; line-height: 1.7 !important }

/* ══════════════════════════════════════════════════
   §3. TYPES — fond blanc, 3 cartes grandes
══════════════════════════════════════════════════ */
.p-types { padding: 80px 0 !important; background: #fff !important }
.p-types__head { margin-bottom: 48px !important }
.p-types__head h2 {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: clamp(28px, 3vw, 44px) !important; font-weight: 700 !important; color: #0E1C1F !important;
  margin-bottom: 8px !important;
}
.p-types__head p { font-size: 15px !important; color: #666 !important; max-width: 560px !important }
.p-types__grid { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 2px !important }
.p-type {
  position: relative !important; overflow: hidden !important;
  cursor: pointer !important; display: block !important;
}
.p-type__imgw { height: 340px !important; overflow: hidden !important }
.p-type__img { width: 100% !important; height: 100% !important; object-fit: cover !important; transition: transform .7s ease !important; display: block !important }
.p-type:hover .p-type__img { transform: scale(1.06) !important }
.p-type__overlay {
  position: absolute !important; inset: 0 !important;
  background: linear-gradient(to top, rgba(7,40,48,.92) 0%, rgba(7,40,48,.35) 55%, transparent 80%) !important;
}
.p-type__content {
  position: absolute !important; bottom: 0 !important; left: 0 !important; right: 0 !important;
  padding: 32px 28px !important;
}
.p-type__num {
  font-family: 'Cormorant Garamond', serif !important; font-size: 64px !important;
  font-weight: 700 !important; color: rgba(255,255,255,.1) !important; line-height: 1 !important;
  margin-bottom: 6px !important;
}
.p-type h3 {
  font-family: 'Cormorant Garamond', serif !important; font-size: 26px !important;
  font-weight: 700 !important; color: #fff !important; margin-bottom: 8px !important;
}
.p-type p { font-size: 13.5px !important; color: rgba(255,255,255,.68) !important; line-height: 1.65 !important; margin-bottom: 18px !important }
.p-type__cta {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  font-size: 10px !important; font-weight: 700 !important; letter-spacing: 2px !important;
  text-transform: uppercase !important; color: #A8CDD3 !important;
  transition: gap .2s !important;
}
.p-type:hover .p-type__cta { gap: 10px !important }
.p-type__cta::after { content: '→' !important }

/* ══════════════════════════════════════════════════
   §4. PROCESSUS — fond beige, timeline horizontale
══════════════════════════════════════════════════ */
.p-proc { padding: 80px 0 !important; background: #F5F4F1 !important; border-top: 1px solid #E2E2DD !important }
.p-proc__head { text-align: center !important; margin-bottom: 56px !important }
.p-proc__head h2 {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: clamp(28px, 3vw, 44px) !important; font-weight: 700 !important; color: #0E1C1F !important;
}
.p-proc__head p { font-size: 15px !important; color: #666 !important; margin-top: 10px !important }
.p-proc__steps { display: grid !important; grid-template-columns: repeat(6, 1fr) !important; position: relative !important }
.p-proc__steps::before {
  content: '' !important; position: absolute !important; top: 20px !important;
  left: calc(100% / 12) !important; right: calc(100% / 12) !important;
  height: 1px !important; background: #D8E3E5 !important; z-index: 0 !important;
}
.p-pstep {
  display: flex !important; flex-direction: column !important;
  align-items: center !important; text-align: center !important;
  padding: 0 10px !important; position: relative !important; z-index: 1 !important;
}
.p-pstep__dot {
  width: 40px !important; height: 40px !important; background: #fff !important;
  border: 2px solid #115A65 !important; border-radius: 50% !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-size: 13px !important; font-weight: 700 !important; color: #115A65 !important;
  margin-bottom: 16px !important; flex-shrink: 0 !important;
  transition: background .25s !important;
}
.p-pstep:hover .p-pstep__dot { background: #115A65 !important; color: #fff !important }
.p-pstep h3 { font-size: 13px !important; font-weight: 700 !important; color: #0E1C1F !important; margin-bottom: 6px !important }
.p-pstep p { font-size: 12px !important; color: #888 !important; line-height: 1.55 !important }

/* ══════════════════════════════════════════════════
   §7. QUALITÉ & TECHNIQUE — split image/texte
══════════════════════════════════════════════════ */
.p-qual { padding: 80px 0 !important; background: #fff !important }
.p-qual__grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 80px !important; align-items: center !important }
/* Côté image avec badge */
.p-qual__vis { position: relative !important }
.p-qual__img { width: 100% !important; height: 540px !important; object-fit: cover !important; border-radius: 2px !important }
.p-qual__badge {
  position: absolute !important; bottom: -20px !important; right: -20px !important;
  background: #115A65 !important; color: #fff !important; padding: 24px 28px !important;
  border-radius: 2px !important; box-shadow: 0 8px 32px rgba(17,90,101,.25) !important;
  text-align: center !important;
}
.p-qual__badge b {
  font-family: 'Cormorant Garamond', serif !important; font-size: 44px !important;
  font-weight: 700 !important; color: #A8CDD3 !important; display: block !important; line-height: 1 !important;
}
.p-qual__badge span { font-size: 10px !important; font-weight: 700 !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; color: rgba(255,255,255,.55) !important; margin-top: 4px !important; display: block !important }
/* Côté texte */
.p-qual__eyebrow {
  font-size: 10px !important; font-weight: 700 !important; letter-spacing: 2.5px !important;
  text-transform: uppercase !important; color: #115A65 !important;
  display: flex !important; align-items: center !important; gap: 10px !important; margin-bottom: 14px !important;
}
.p-qual__eyebrow::before { content: '' !important; width: 24px !important; height: 1px !important; background: #115A65 !important }
.p-qual__h2 {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: clamp(26px, 3vw, 42px) !important; font-weight: 700 !important; color: #0E1C1F !important;
  line-height: 1.1 !important; margin-bottom: 16px !important;
}
.p-qual__h2 em { font-style: italic !important; color: #115A65 !important }
.p-qual__div { width: 36px !important; height: 2px !important; background: #115A65 !important; margin-bottom: 20px !important }
.p-qual__body { font-size: 15px !important; color: #555 !important; line-height: 1.85 !important; margin-bottom: 28px !important }
.p-qual__items { display: flex !important; flex-direction: column !important; gap: 0 !important }
.p-qual__item {
  display: flex !important; align-items: center !important; gap: 14px !important;
  padding: 14px 0 !important; border-bottom: 1px solid #E2E2DD !important;
}
.p-qual__item:last-child { border-bottom: none !important }
.p-qual__item-dot { width: 8px !important; height: 8px !important; border-radius: 50% !important; background: #115A65 !important; flex-shrink: 0 !important }
.p-qual__item span { font-size: 14px !important; font-weight: 600 !important; color: #0E1C1F !important }
.p-qual__item small { font-size: 12px !important; color: #888 !important; margin-left: 4px !important }


/* ══════════════════════════════════════════════════
   §6. INCLUS — grille claire des prestations
══════════════════════════════════════════════════ */
.p-inclus{ padding:80px 0 !important; background:#F5F4F1 !important; border-top:1px solid #E2E2DD !important }
.p-inclus__head{ max-width:650px !important; margin-bottom:42px !important }
.p-inclus__head h2,
.p-guar__head h2,
.p-zone__text h2,
.p-avoid__head h2{
  font-family:'Cormorant Garamond',serif !important;
  font-size:clamp(28px,3vw,44px) !important;
  font-weight:700 !important;
  color:#0E1C1F !important;
  line-height:1.1 !important;
  margin-bottom:12px !important;
}
.p-inclus__head p,
.p-guar__head p,
.p-zone__text p,
.p-avoid__head p{ font-size:15px !important; color:#666 !important; line-height:1.75 !important }
.p-inclus__grid{ display:grid !important; grid-template-columns:repeat(4,1fr) !important; gap:2px !important }
.p-inc{ background:#fff !important; padding:28px 24px !important; border:1px solid #E2E2DD !important; min-height:150px !important }
.p-inc__n{ font-family:'Cormorant Garamond',serif !important; font-size:32px !important; color:#115A65 !important; line-height:1 !important; margin-bottom:14px !important; font-weight:700 !important }
.p-inc h3{ font-size:14px !important; font-weight:700 !important; color:#0E1C1F !important; margin-bottom:6px !important }
.p-inc p{ font-size:13px !important; color:#666 !important; line-height:1.65 !important }

/* ══════════════════════════════════════════════════
   §7. GARANTIES — rassurance
══════════════════════════════════════════════════ */
.p-guar{ padding:80px 0 !important; background:#fff !important; border-top:1px solid #E2E2DD !important }
.p-guar__head{ text-align:center !important; max-width:680px !important; margin:0 auto 44px !important }
.p-guar__grid{ display:grid !important; grid-template-columns:repeat(3,1fr) !important; gap:18px !important }
.p-guar-card{ background:#F5F4F1 !important; border:1px solid #E2E2DD !important; padding:30px 28px !important; border-radius:3px !important }
.p-guar-card__icon{ width:42px !important; height:42px !important; border-radius:50% !important; background:#115A65 !important; color:#fff !important; display:flex !important; align-items:center !important; justify-content:center !important; font-size:18px !important; margin-bottom:16px !important }
.p-guar-card h3{ font-size:15px !important; font-weight:700 !important; color:#0E1C1F !important; margin-bottom:8px !important }
.p-guar-card p{ font-size:13.5px !important; color:#666 !important; line-height:1.7 !important }

/* ══════════════════════════════════════════════════
   §9. ZONES — SEO local
══════════════════════════════════════════════════ */
.p-zone{ padding:80px 0 !important; background:#F5F4F1 !important; border-top:1px solid #E2E2DD !important }
.p-zone__grid{ display:grid !important; grid-template-columns:.9fr 1.1fr !important; gap:60px !important; align-items:center !important }
.p-zone__tags{ display:flex !important; flex-wrap:wrap !important; gap:10px !important; margin-top:26px !important }
.p-zone__tags span{ background:#fff !important; border:1px solid #E2E2DD !important; color:#0E1C1F !important; padding:10px 15px !important; font-size:12px !important; font-weight:600 !important; border-radius:30px !important }
.p-zone__box{ background:#0B3C45 !important; color:#fff !important; padding:42px !important; border-radius:3px !important; box-shadow:0 18px 45px rgba(11,60,69,.18) !important }
.p-zone__box h3{ font-family:'Cormorant Garamond',serif !important; font-size:30px !important; color:#fff !important; margin-bottom:12px !important }
.p-zone__box p{ color:rgba(255,255,255,.62) !important; font-size:14px !important; line-height:1.75 !important; margin-bottom:22px !important }
.p-zone__list{ display:grid !important; grid-template-columns:1fr 1fr !important; gap:10px 20px !important }
.p-zone__list span{ font-size:13px !important; color:#A8CDD3 !important; display:flex !important; gap:8px !important }
.p-zone__list span::before{ content:'•' !important; color:#fff !important }


/* ════════════════════════════════════════════════════
   5. RÉALISATIONS — grille 2x2 portrait + 1 large
   Nouvelle mise en page originale
════════════════════════════════════════════════════ */

/* ── RÉALISATIONS — CSS autonome ── */
.cn-reals { padding: 72px 0 !important; background: #0B3C45 !important }
.cn-reals__inner { max-width: 1400px !important; margin: 0 auto !important; padding: 0 48px !important }
.cn-reals__head {
  display: flex !important; align-items: flex-end !important;
  justify-content: space-between !important; margin-bottom: 36px !important;
  flex-wrap: wrap !important; gap: 16px !important;
}
.cn-reals__head h2 {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: clamp(26px, 3vw, 42px) !important; font-weight: 700 !important; color: #fff !important;
  margin-bottom: 6px !important;
}
.cn-reals__head p { font-size: 14px !important; color: rgba(255,255,255,.6) !important }
.cn-reals__link {
  display: inline-flex !important; align-items: center !important; gap: 8px !important;
  padding: 12px 26px !important; background: #fff !important; color: #0B3C45 !important;
  font-family: 'Jost', sans-serif !important; font-size: 11px !important; font-weight: 700 !important;
  letter-spacing: 2px !important; text-transform: uppercase !important;
  border-radius: 4px !important; text-decoration: none !important;
  transition: background .22s !important; white-space: nowrap !important; flex-shrink: 0 !important;
}
.cn-reals__link:hover { background: #EAF1F2 !important }
.cn-reals__link svg { width: 14px !important; height: 14px !important; stroke: #0B3C45 !important; fill: none !important; transition: transform .2s !important }
.cn-reals__link:hover svg { transform: translateX(3px) !important }
 
/* Grille : 1 grande + 4 petites */
.cn-reals__grid {
  display: grid !important;
  grid-template-columns: 1.4fr 1fr 1fr !important;
  grid-template-rows: 280px 220px !important;
  gap: 4px !important;
}
.cn-card { overflow: hidden !important; position: relative !important; cursor: pointer !important; border-radius: 10px !important }
.cn-card:first-child { grid-row: span 2 !important }
.cn-card__img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; transition: transform .6s ease !important }
.cn-card:hover .cn-card__img { transform: scale(1.05) !important }
.cn-card__overlay {
  position: absolute !important; inset: 0 !important;
  background: linear-gradient(to top, rgba(7,40,48,.88) 0%, transparent 55%) !important;
  opacity: 0 !important; transition: opacity .3s !important;
}
.cn-card:hover .cn-card__overlay { opacity: 1 !important }
.cn-card__info {
  position: absolute !important; bottom: 0 !important; left: 0 !important; right: 0 !important;
  padding: 18px 20px !important; transform: translateY(8px) !important;
  transition: transform .3s, opacity .3s !important; opacity: 0 !important;
}
.cn-card:hover .cn-card__info { transform: translateY(0) !important; opacity: 1 !important }
.cn-card__name {
  font-family: 'Cormorant Garamond', serif !important; font-size: 18px !important;
  font-weight: 700 !important; color: #fff !important; display: block !important; margin-bottom: 3px !important;
}
.cn-card__cat { font-size: 11px !important; color: #A8CDD3 !important; letter-spacing: 1px !important; text-transform: uppercase !important }
 
@media(max-width:900px){
  .cn-reals__inner { padding: 0 24px !important }
  .cn-reals__grid {
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: auto !important;
    gap: 8px !important;
  }
  .cn-card:first-child { grid-row: auto !important }
  .cn-card { height: 220px !important }
  .cn-card__overlay { opacity: 1 !important }
  .cn-card__info { opacity: 1 !important; transform: translateY(0) !important }
}
@media(max-width:600px){
  .cn-reals__grid { grid-template-columns: 1fr !important }
  .cn-card { height: 220px !important }
  .cn-reals__head { flex-direction: column !important; align-items: flex-start !important }
}
/* ══════════════════════════════════════════════════
   §12. FAQ — fond beige, accordéon
══════════════════════════════════════════════════ */
.p-faq { padding: 80px 0 !important; background: #F5F4F1 !important; border-top: 1px solid #E2E2DD !important }
.p-faq__grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 80px !important; align-items: start !important }
.p-faq__left h2 {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: clamp(28px, 3vw, 44px) !important; font-weight: 700 !important; color: #0E1C1F !important;
  line-height: 1.1 !important; margin-bottom: 14px !important;
}
.p-faq__left p { font-size: 15px !important; color: #666 !important; line-height: 1.75 !important; margin-bottom: 28px !important }
.p-faqs { display: flex !important; flex-direction: column !important; gap: 2px !important }
.p-faq-item {
  background: #fff !important; border: 1px solid #E2E2DD !important; border-radius: 2px !important; overflow: hidden !important;
}
.p-faq-item__q {
  width: 100% !important; padding: 18px 22px !important; background: none !important; border: none !important;
  display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important;
  font-family: 'Jost', sans-serif !important; font-size: 14px !important; font-weight: 700 !important;
  color: #0E1C1F !important; cursor: pointer !important; text-align: left !important;
  transition: color .2s !important;
}
.p-faq-item__q:hover { color: #115A65 !important }
.p-faq-item__q svg { width: 16px !important; height: 16px !important; stroke: #115A65 !important; fill: none !important; flex-shrink: 0 !important; transition: transform .25s !important }
.p-faq-item.open .p-faq-item__q svg { transform: rotate(45deg) !important }
.p-faq-item__a {
  max-height: 0 !important; overflow: hidden !important; transition: max-height .35s ease !important;
}
.p-faq-item.open .p-faq-item__a { max-height: 300px !important }
.p-faq-item__a-inner { padding: 0 22px 18px !important; font-size: 14px !important; color: #555 !important; line-height: 1.75 !important }


/* ── RESPONSIVE ─────────────────────────────────── */
@media(max-width:1100px){
  .p-hero{ min-height:auto !important }
  .p-hero__inner{ grid-template-columns:1fr !important; gap:40px !important; padding:120px 48px 70px !important }
  .p-form{ width:100% !important; max-width:620px !important }
  .p-vals__grid{ grid-template-columns:repeat(2,1fr) !important }
  .p-types__grid{ grid-template-columns:1fr !important }
  .p-inclus__grid{ grid-template-columns:repeat(2,1fr) !important }
  .p-proc__steps{ grid-template-columns:repeat(3,1fr) !important; gap:28px !important }
  .p-proc__steps::before{ display:none !important }
  .p-guar__grid{ grid-template-columns:1fr 1fr !important }
  .p-qual__grid,.p-faq__grid,.p-zone__grid{ grid-template-columns:1fr !important; gap:48px !important }
  .p-qual__badge{ position:static !important; margin-top:20px !important; display:inline-block !important }
  .p-avoid__grid{ grid-template-columns:1fr 1fr !important }
  .p-reals__grid{ grid-template-columns:1fr 1fr !important; grid-template-rows:auto !important }
  .p-real,.p-real:first-child{ height:260px !important; grid-row:auto !important }
}
@media(max-width:767px){
  .pw,.pwx,.p-cta__inner{ padding-left:20px !important; padding-right:20px !important }
  .p-hero__bc{ display:none !important }
  .p-hero__inner{ padding:90px 20px 50px !important; gap:30px !important }
  .p-hero__h1{ font-size:clamp(34px,10vw,46px) !important; line-height:1.02 !important }
  .p-hero__sub{ font-size:14px !important; max-width:100% !important }
  .p-hero__stats{ display:grid !important; grid-template-columns:repeat(3,1fr) !important; gap:10px !important; margin-bottom:26px !important; padding-bottom:24px !important }
  .p-hero__stat-n{ font-size:28px !important }
  .p-hero__stat-l{ font-size:9px !important }
  .p-hero__btns{ flex-direction:column !important }
  .p-hero__btns .pbtn{ width:100% !important; justify-content:center !important }
  .p-form{ width:100% !important; max-width:100% !important }
  .p-form__head,.p-form__body{ padding:22px 20px !important }
  .p-form__row{ grid-template-columns:1fr !important }
  .p-vals,.p-types,.p-inclus,.p-proc,.p-guar,.p-qual,.p-zone,.p-avoid,.p-reals,.p-faq{ padding:58px 0 !important }
  .p-vals__grid,.p-types__grid,.p-inclus__grid,.p-proc__steps,.p-guar__grid,.p-avoid__grid,.p-reals__grid{ grid-template-columns:1fr !important }
  .p-type__imgw{ height:300px !important }
  .p-qual__img{ height:340px !important }
  .p-qual__badge{ position:static !important; margin-top:16px !important; width:100% !important }
  .p-zone__box{ padding:30px 24px !important }
  .p-zone__list{ grid-template-columns:1fr !important }
  .p-real,.p-real:first-child{ height:230px !important }
  .p-faq-item__q{ font-size:13px !important; padding:16px 18px !important }
  .p-cta{ padding:70px 0 !important }
  .p-cta__btns{ flex-direction:column !important }
  .p-cta__btns .pbtn{ width:100% !important; justify-content:center !important }
}
@media(max-width:420px){
  .p-hero__stats{ grid-template-columns:1fr !important }
  .p-hero__stat-n{ font-size:32px !important }
  .p-type__imgw,.p-qual__img{ height:280px !important }
}
/* ═════════════════════════════
   PEPS CONSTRUCTION NEUVE — CSS FINAL À AJOUTER
═════════════════════════════ */

/* Radius global cohérent */
.pbtn,
.p-form__submit,
.p-form__inp,
.p-form__sel,
.p-form__ta{
  border-radius:5px !important;
}

.p-form,
.p-val,
.p-type,
.p-inc,
.p-guar-card,
.p-zone__box,
.p-faq-item,
.p-real{
  border-radius:14px !important;
  overflow:hidden !important;
}

/* Boutons shine */
.pbtn,
.p-form__submit{
  position:relative !important;
  overflow:hidden !important;
}

.pbtn::after,
.p-form__submit::after{
  content:'' !important;
  position:absolute !important;
  inset:0 !important;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.18),transparent) !important;
  transform:translateX(-120%) !important;
  transition:transform .55s ease !important;
  pointer-events:none !important;
}

.pbtn:hover::after,
.p-form__submit:hover::after{
  transform:translateX(120%) !important;
}

/* Titres : accent Villa Mediterra */
.p-vals__head h2::after,
.p-types__head h2::after,
.p-inclus__head h2::after,
.p-guar__head h2::after,
.p-proc__head h2::after,
.p-zone__text h2::after,
.p-faq__left h2::after{
  content:'' !important;
  display:block !important;
  width:54px !important;
  height:3px !important;
  background:linear-gradient(90deg,#115A65,#6AAAB4) !important;
  border-radius:3px !important;
  margin-top:16px !important;
}

.p-vals__head h2::after,
.p-guar__head h2::after,
.p-proc__head h2::after{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Valeurs */
.p-val{
  position:relative !important;
  box-shadow:0 12px 30px rgba(17,90,101,.06) !important;
  border:1px solid #E2E2DD !important;
}

.p-val::after{
  content:'' !important;
  position:absolute !important;
  width:110px !important;
  height:110px !important;
  right:-54px !important;
  bottom:-58px !important;
  border-radius:50% !important;
  background:rgba(168,205,211,.14) !important;
}

.p-val > *{
  position:relative !important;
  z-index:1 !important;
}

/* Types */
.p-types__grid{
  gap:14px !important;
}

.p-type{
  box-shadow:0 16px 38px rgba(17,90,101,.12) !important;
}

.p-type__content{
  z-index:2 !important;
}

.p-type__overlay{
  background:linear-gradient(to top,rgba(7,40,48,.92) 0%,rgba(7,40,48,.42) 58%,transparent 86%) !important;
}

/* Bloc inclus : cartes claires avec image en haut */
.p-inclus{
  background:
    radial-gradient(circle at 95% 0%,rgba(168,205,211,.22),transparent 28%),
    #F5F4F1 !important;
}

.p-inclus__grid{
  gap:18px !important;
}

.p-inc{
  min-height:220px !important;
  padding:30px 26px !important;
  background:#fff !important;
  border:1px solid #E2E2DD !important;
  position:relative !important;
  box-shadow:0 14px 36px rgba(17,90,101,.08) !important;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease !important;
}

.p-inc::before{
  content:'' !important;
  position:absolute !important;
  top:0 !important;
  left:18px !important;
  right:18px !important;
  height:3px !important;
  background:linear-gradient(90deg,#115A65,#6AAAB4) !important;
  border-radius:0 0 10px 10px !important;
}

.p-inc::after{
  content:'' !important;
  position:absolute !important;
  width:120px !important;
  height:120px !important;
  right:-58px !important;
  bottom:-60px !important;
  border-radius:50% !important;
  background:rgba(168,205,211,.18) !important;
  z-index:0 !important;
}

.p-inc:hover{
  transform:translateY(-4px) !important;
  box-shadow:0 22px 48px rgba(17,90,101,.14) !important;
  border-color:#6AAAB4 !important;
}

.p-inc > *{
  position:relative !important;
  z-index:1 !important;
}

.p-inc__img{
  width:62px !important;
  height:62px !important;
  object-fit:contain !important;
  margin-bottom:20px !important;
}

.p-inc h3{
  color:#0B3C45 !important;
  font-size:15px !important;
  margin-bottom:8px !important;
}

/* Bloc garanties : style différent, plus sombre et rassurance */
.p-guar{
  background:
    radial-gradient(circle at 10% 0%,rgba(168,205,211,.16),transparent 32%),
    linear-gradient(135deg,#0B3C45,#072830) !important;
  border-top:none !important;
}

.p-guar__head h2{
  color:#fff !important;
}

.p-guar__head p{
  color:rgba(255,255,255,.68) !important;
}

.p-guar__grid{
  gap:18px !important;
}

.p-guar-card{
  min-height:210px !important;
  padding:30px 26px !important;
  background:rgba(255,255,255,.94) !important;
  border:1px solid rgba(255,255,255,.22) !important;
  position:relative !important;
  box-shadow:0 18px 42px rgba(0,0,0,.16) !important;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease !important;
}

.p-guar-card::before{
  content:'' !important;
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  width:5px !important;
  height:100% !important;
  background:linear-gradient(#115A65,#6AAAB4) !important;
}

.p-guar-card::after{
  content:'' !important;
  position:absolute !important;
  width:120px !important;
  height:120px !important;
  right:-56px !important;
  bottom:-60px !important;
  border-radius:50% !important;
  background:rgba(168,205,211,.22) !important;
  z-index:0 !important;
}

.p-guar-card:hover{
  transform:translateY(-4px) !important;
  box-shadow:0 24px 52px rgba(0,0,0,.22) !important;
  border-color:rgba(168,205,211,.6) !important;
}

.p-guar-card > *{
  position:relative !important;
  z-index:1 !important;
}

.p-guar-card__img{
  width:58px !important;
  height:58px !important;
  object-fit:contain !important;
  margin-bottom:18px !important;
}

.p-guar-card h3{
  color:#0B3C45 !important;
  font-size:15px !important;
  margin-bottom:8px !important;
}

.p-guar-card p{
  color:#3D5558 !important;
}

/* Process plus propre */
.p-proc{
  background:
    radial-gradient(circle at 15% 10%,rgba(168,205,211,.28),transparent 30%),
    #F5F4F1 !important;
}

.p-pstep__dot{
  border-radius:5px !important;
  background:#fff !important;
  box-shadow:0 8px 20px rgba(17,90,101,.08) !important;
}

.p-pstep:hover .p-pstep__dot{
  background:#115A65 !important;
  color:#fff !important;
}

/* Qualité */
.p-qual__img,
.p-qual__badge,
.p-zone__box{
  border-radius:14px !important;
}

.p-qual__badge{
  box-shadow:0 18px 42px rgba(17,90,101,.22) !important;
}

.p-qual__item-dot{
  box-shadow:0 0 0 5px rgba(17,90,101,.08) !important;
}

/* Zone */
.p-zone{
  background:linear-gradient(135deg,#F5F4F1,#EAF1F2) !important;
}

.p-zone__tags span{
  border-radius:5px !important;
  background:#fff !important;
  box-shadow:0 8px 22px rgba(17,90,101,.05) !important;
}

.p-zone__box{
  position:relative !important;
  overflow:hidden !important;
}

.p-zone__box::after{
  content:'' !important;
  position:absolute !important;
  width:150px !important;
  height:150px !important;
  right:-70px !important;
  bottom:-75px !important;
  border-radius:50% !important;
  background:rgba(168,205,211,.14) !important;
}

/* Réalisations */
.p-reals{
  background:
    radial-gradient(circle at 10% 0%,rgba(168,205,211,.16),transparent 34%),
    linear-gradient(135deg,#0B3C45,#072830) !important;
}

.p-reals__grid{
  gap:10px !important;
}

.p-real{
  border-radius:14px !important;
  box-shadow:0 18px 42px rgba(0,0,0,.14) !important;
}

/* FAQ */
.p-faq-item{
  border-radius:10px !important;
  margin-bottom:8px !important;
  box-shadow:0 12px 30px rgba(17,90,101,.06) !important;
}

/* Responsive */
@media(max-width:767px){
  .p-inc,
  .p-guar-card,
  .p-val,
  .p-type,
  .p-real,
  .p-zone__box,
  .p-faq-item{
    border-radius:12px !important;
  }

  .p-inc__img,
  .p-guar-card__img{
    width:52px !important;
    height:52px !important;
  }

  .p-inc,
  .p-guar-card{
    min-height:auto !important;
  }

  .p-guar{
    padding:58px 0 !important;
  }
}/* End custom CSS */