/* Protec Energy theme - protec.css v3 propre */

/* === preview-homepage.html === */

/* ===========================================================
   CHARTE PROTEC STRICTE : Lato + Raleway + couleurs Divi
   =========================================================== */
:root {
  --indigo: #4854f5; --indigo-dark: #3a44d4; --indigo-pale: #eff0ff;
  --rouge: #e62d33; --rouge-dark: #c22128;
  --jaune: #fcc930;
  --txt: #444444; --txt-soft: #6b6b6b;
  --gray-border: #e5e7eb; --gray-soft: #f9f9fb;
  --blanc: #ffffff;
  --f-body: 'Raleway', Helvetica, Arial, Lucida, sans-serif;
  --f-h: 'Lato', Helvetica, Arial, Lucida, sans-serif;
  --ease: cubic-bezier(0.32, 0.72, 0, 1);
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: var(--f-body); font-size: 15px; line-height: 1.7; color: var(--txt); background: var(--blanc); -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; display: block; }
h1, h2, h3, h4 { font-family: var(--f-h); color: var(--txt); font-weight: 700; line-height: 1.25; margin: 0 0 0.5em; }
h1 { font-size: clamp(36px, 4.8vw, 54px); }
h2 { font-size: clamp(28px, 3vw, 38px); text-align: center; }
h3 { font-size: 22px; }
p { margin: 0 0 1em; }
a { color: var(--indigo); text-decoration: none; transition: color 220ms var(--ease); }
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }

/* Top bar (Divi) */
.top-bar { background: var(--indigo); color: var(--blanc); font-size: 13px; padding: 10px 0; }
.top-bar a { color: var(--blanc); }
.top-bar__inner { display: flex; justify-content: flex-end; align-items: center; gap: 24px; }
.top-bar__phone { display: inline-flex; align-items: center; gap: 8px; font-weight: 500; }
.top-bar__socials { display: flex; gap: 8px; list-style: none; padding: 0; margin: 0; }
.top-bar__socials a { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; transition: background 220ms var(--ease); }
.top-bar__socials a:hover { background: rgba(255,255,255,0.18); }
.top-bar__cta { background: var(--rouge); padding: 8px 22px; border-radius: 6px; font-weight: 700; transition: all 220ms var(--ease); }
.top-bar__cta:hover { background: var(--rouge-dark); transform: translateY(-1px); }
.top-bar__avis { background: rgba(255,255,255,0.18); padding: 8px 18px; border-radius: 6px; font-weight: 500; }

/* Header */
.header { background: var(--blanc); padding: 14px 0; border-bottom: 1px solid rgba(0,0,0,0.05); position: sticky; top: 0; z-index: 100; transition: box-shadow 220ms var(--ease); }
.header__inner { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.header__logo img { height: 64px; width: auto; transition: height 220ms; }
.nav > ul { list-style: none; padding: 0; margin: 0; display: flex; gap: 4px; }
.nav > ul > li { position: relative; }
.nav > ul > li > a { display: block; padding: 12px 14px; color: var(--txt); font-size: 15px; font-weight: 500; transition: color 220ms var(--ease); }
.nav > ul > li > a:hover { color: var(--indigo); }
.nav__submenu { list-style: none; padding: 8px; margin: 0; position: absolute; top: 100%; left: 0; min-width: 230px; background: var(--blanc); box-shadow: 0 8px 24px rgba(0,0,0,0.12); border-radius: 8px; opacity: 0; visibility: hidden; transform: translateY(8px); transition: all 220ms var(--ease); display: flex; flex-direction: column; }
.nav > ul > li:hover > .nav__submenu { opacity: 1; visibility: visible; transform: translateY(0); }
.nav__submenu li a { display: block; padding: 10px 14px; color: var(--txt); font-size: 14px; border-radius: 4px; white-space: nowrap; }
.nav__submenu li a:hover { background: var(--indigo-pale); color: var(--indigo); }

/* ===========================================================
   SECTION 1 : HERO (mot-clé H1 + sub-answer + 2 CTAs + photo)
   =========================================================== */
.hero { padding: 60px 0 80px; background: var(--blanc); position: relative; overflow: hidden; }
.hero__grid { display: grid; grid-template-columns: 1.25fr 1fr; gap: 48px; align-items: center; }
.hero__pretitle { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 18px; padding: 8px 14px; background: var(--indigo-pale); border-radius: 999px; }
.hero__pretitle::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--indigo); }
.hero__title { font-size: clamp(36px, 4.8vw, 54px); line-height: 1.1; margin: 0 0 18px; color: var(--txt); }
.hero__title strong { color: var(--indigo); font-weight: 900; }
.hero__sub { font-size: 17px; color: var(--txt-soft); margin-bottom: 28px; max-width: 56ch; line-height: 1.6; }
.hero__sub strong { color: var(--txt); font-weight: 700; }
.hero__ctas { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 28px; }
.btn-primary { display: inline-flex; align-items: center; gap: 10px; background: var(--rouge); color: var(--blanc); padding: 16px 28px; border-radius: 8px; font-weight: 700; font-size: 15px; transition: all 280ms var(--ease); font-family: var(--f-body); border: 0; cursor: pointer; }
.btn-primary:hover { background: var(--rouge-dark); color: var(--blanc); transform: translateY(-2px); box-shadow: 0 10px 24px -10px rgba(230,45,51,0.5); }
.btn-secondary { display: inline-flex; align-items: center; gap: 10px; background: var(--blanc); color: var(--indigo); padding: 16px 28px; border-radius: 8px; font-weight: 700; font-size: 15px; border: 2px solid var(--indigo); transition: all 280ms var(--ease); }
.btn-secondary:hover { background: var(--indigo); color: var(--blanc); transform: translateY(-2px); }
.btn-indigo { display: inline-block; background: var(--indigo); color: var(--blanc); padding: 14px 28px; border-radius: 6px; font-weight: 700; font-size: 14px; transition: all 280ms var(--ease); border: 0; cursor: pointer; font-family: var(--f-body); }
.btn-indigo:hover { background: var(--indigo-dark); color: var(--blanc); transform: translateY(-2px); box-shadow: 0 10px 24px -10px rgba(72,84,245,0.5); }
.hero__quick { display: flex; align-items: center; gap: 16px; font-size: 13px; color: var(--txt-soft); }
.hero__quick a { color: var(--indigo); font-weight: 700; display: inline-flex; align-items: center; gap: 6px; }
.hero__quick a:hover { color: var(--indigo-dark); }
.hero__visual { position: relative; }
.hero__visual-img { border-radius: 20px; overflow: hidden; aspect-ratio: 5/6; box-shadow: 0 24px 60px -20px rgba(0,0,0,0.18); }
.hero__visual-img img { width: 100%; height: 100%; object-fit: cover; }
.hero__rating-float { position: absolute; bottom: -24px; left: -24px; background: var(--blanc); border-radius: 16px; box-shadow: 0 12px 32px rgba(0,0,0,0.12); padding: 18px 22px; display: flex; align-items: center; gap: 14px; }
.hero__rating-float-stars { color: var(--jaune); font-size: 18px; letter-spacing: 2px; line-height: 1; }
.hero__rating-float-text { font-size: 13px; color: var(--txt); line-height: 1.3; }
.hero__rating-float-text strong { display: block; font-family: var(--f-h); font-size: 18px; font-weight: 900; color: var(--txt); }
.hero__rating-float img { height: 16px; width: auto; opacity: 0.9; margin-top: 4px; }
.hero__cert-float { position: absolute; top: -16px; right: -16px; background: var(--blanc); border-radius: 16px; box-shadow: 0 12px 32px rgba(0,0,0,0.12); padding: 14px 18px; display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; color: var(--txt); }
.hero__cert-float-icon { width: 32px; height: 32px; background: var(--indigo); color: var(--blanc); border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 900; font-family: var(--f-h); }

/* ===========================================================
   SECTION 2 : TRUST STRIP (badges RGE + chiffres + garantie)
   =========================================================== */
.trust-strip { background: var(--indigo-pale); padding: 28px 0; border-top: 1px solid var(--gray-border); border-bottom: 1px solid var(--gray-border); }
.trust-strip__inner { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; align-items: center; }
.trust-item { display: flex; align-items: center; gap: 14px; }
.trust-item__icon { flex-shrink: 0; width: 48px; height: 48px; background: var(--blanc); border-radius: 12px; display: flex; align-items: center; justify-content: center; color: var(--indigo); }
.trust-item__icon svg { width: 26px; height: 26px; }
.trust-item__text { font-size: 13px; line-height: 1.4; color: var(--txt); }
.trust-item__text strong { display: block; font-family: var(--f-h); font-size: 16px; font-weight: 900; color: var(--txt); }

/* ===========================================================
   SECTION 3 : AEO DIRECT ANSWERS (3 questions / 3 réponses)
   =========================================================== */
.aeo-block { padding: 80px 0; background: var(--blanc); }
.aeo-block__header { text-align: center; max-width: 700px; margin: 0 auto 48px; }
.aeo-block__label { display: inline-block; font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 12px; }
.aeo-block__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.aeo-card { background: var(--blanc); border: 2px solid var(--indigo-pale); border-radius: 20px; padding: 32px 28px; transition: all 320ms var(--ease); position: relative; }
.aeo-card:hover { border-color: var(--indigo); transform: translateY(-4px); box-shadow: 0 20px 40px -16px rgba(72,84,245,0.18); }
.aeo-card__num { position: absolute; top: 24px; right: 28px; font-family: var(--f-h); font-size: 48px; font-weight: 900; color: var(--indigo-pale); line-height: 1; }
.aeo-card__icon { width: 48px; height: 48px; background: var(--indigo); color: var(--blanc); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; }
.aeo-card__icon svg { width: 24px; height: 24px; }
.aeo-card__q { font-family: var(--f-h); font-weight: 700; font-size: 17px; color: var(--txt); margin-bottom: 12px; line-height: 1.35; }
.aeo-card__a { font-size: 14px; color: var(--txt-soft); line-height: 1.7; }
.aeo-card__a strong { color: var(--txt); }

/* ===========================================================
   SECTION 4 : SERVICES PAR INTENTION CLIENT (4 cards)
   =========================================================== */
.services-intent { padding: 80px 0; background: var(--indigo-pale); }
.services-intent__header { text-align: center; max-width: 700px; margin: 0 auto 48px; }
.services-intent__lead { color: var(--txt-soft); font-size: 16px; }
.services-intent__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.service-intent { background: var(--blanc); border-radius: 20px; overflow: hidden; transition: all 400ms var(--ease); display: flex; flex-direction: column; }
.service-intent:hover { transform: translateY(-6px); box-shadow: 0 24px 50px -20px rgba(72,84,245,0.25); }
.service-intent__img { aspect-ratio: 16/9; overflow: hidden; }
.service-intent__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 600ms var(--ease); }
.service-intent:hover .service-intent__img img { transform: scale(1.05); }
.service-intent__body { padding: 28px 28px 24px; flex: 1; display: flex; flex-direction: column; }
.service-intent__intent { font-size: 12px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.12em; margin-bottom: 10px; }
.service-intent__title { font-family: var(--f-h); font-weight: 700; font-size: 22px; color: var(--txt); margin-bottom: 12px; line-height: 1.25; }
.service-intent__desc { font-size: 14px; color: var(--txt-soft); margin-bottom: 16px; line-height: 1.6; flex: 1; }
.service-intent__list { list-style: none; padding: 0; margin: 0 0 20px; display: flex; flex-wrap: wrap; gap: 6px; }
.service-intent__list li { font-size: 12px; padding: 4px 10px; background: var(--indigo-pale); color: var(--indigo); border-radius: 999px; font-weight: 600; }
.service-intent__link { color: var(--indigo); font-weight: 700; font-size: 14px; display: inline-flex; align-items: center; gap: 6px; transition: gap 220ms var(--ease); }
.service-intent__link:hover { gap: 10px; }

/* ===========================================================
   SECTION 5 : CAS CLIENT STORYTELLING (preuve sociale forte)
   =========================================================== */
.case-study { padding: 80px 0; background: var(--blanc); }
.case-study__inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; }
.case-study__media { position: relative; }
.case-study__img { border-radius: 20px; overflow: hidden; aspect-ratio: 4/3; }
.case-study__img img { width: 100%; height: 100%; object-fit: cover; }
.case-study__chip { position: absolute; top: 18px; left: 18px; background: var(--rouge); color: var(--blanc); padding: 6px 14px; border-radius: 999px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; }
.case-study__label { font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 14px; }
.case-study__title { text-align: left; margin-bottom: 18px; }
.case-study__quote { font-size: 17px; color: var(--txt); font-style: italic; line-height: 1.6; margin-bottom: 20px; padding-left: 20px; border-left: 3px solid var(--indigo); }
.case-study__author { font-size: 14px; color: var(--txt-soft); margin-bottom: 28px; }
.case-study__author strong { color: var(--txt); }
.case-study__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 28px; }
.case-stat { background: var(--indigo-pale); border-radius: 12px; padding: 18px 16px; text-align: center; }
.case-stat__value { font-family: var(--f-h); font-weight: 900; font-size: 28px; color: var(--indigo); line-height: 1; }
.case-stat__label { font-size: 11px; color: var(--txt-soft); text-transform: uppercase; letter-spacing: 0.1em; font-weight: 600; margin-top: 8px; }

/* ===========================================================
   SECTION 6 : POURQUOI PROTEC (4 différentiateurs)
   =========================================================== */
.why { padding: 80px 0; background: var(--indigo-pale); }
.why__header { text-align: center; max-width: 700px; margin: 0 auto 48px; }
.why__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.why-pillar { background: var(--blanc); border-radius: 20px; padding: 32px 24px; text-align: center; transition: all 320ms var(--ease); }
.why-pillar:hover { transform: translateY(-6px); box-shadow: 0 24px 50px -20px rgba(72,84,245,0.18); }
.why-pillar__icon { width: 64px; height: 64px; background: var(--indigo); color: var(--blanc); border-radius: 50%; margin: 0 auto 20px; display: flex; align-items: center; justify-content: center; transition: background 320ms var(--ease); }
.why-pillar:hover .why-pillar__icon { background: var(--rouge); }
.why-pillar__icon svg { width: 30px; height: 30px; }
.why-pillar__title { font-family: var(--f-h); font-weight: 700; font-size: 18px; color: var(--txt); margin-bottom: 10px; }
.why-pillar__desc { font-size: 13.5px; color: var(--txt-soft); line-height: 1.6; }

/* ===========================================================
   SECTION 7 : NOTRE ÉQUIPE (face humaine EEAT)
   =========================================================== */
.team { padding: 80px 0; background: var(--blanc); }
.team__header { text-align: center; max-width: 700px; margin: 0 auto 48px; }
.team__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; max-width: 1000px; margin: 0 auto; }
.team-card { background: var(--gray-soft); border-radius: 20px; padding: 28px 24px; text-align: center; transition: all 320ms var(--ease); }
.team-card:hover { background: var(--indigo-pale); transform: translateY(-4px); }
.team-card__avatar { width: 100px; height: 100px; border-radius: 50%; background: var(--indigo); margin: 0 auto 18px; display: flex; align-items: center; justify-content: center; color: var(--blanc); font-family: var(--f-h); font-weight: 900; font-size: 36px; overflow: hidden; }
.team-card__avatar img { width: 100%; height: 100%; object-fit: cover; }
.team-card__name { font-family: var(--f-h); font-weight: 700; font-size: 18px; color: var(--txt); margin-bottom: 4px; }
.team-card__role { font-size: 13px; color: var(--indigo); font-weight: 600; margin-bottom: 14px; }
.team-card__exp { font-size: 12px; color: var(--txt-soft); margin-bottom: 6px; }
.team-card__cert { font-size: 11px; padding: 4px 10px; background: var(--blanc); color: var(--indigo); border-radius: 999px; font-weight: 600; display: inline-block; }

/* ===========================================================
   SECTION 8 : ZONE D'INTERVENTION GEO
   =========================================================== */
.geo-zone { padding: 80px 0; background: var(--indigo-pale); }
.geo-zone__inner { display: grid; grid-template-columns: 1fr 1.2fr; gap: 48px; align-items: center; }
.geo-zone__label { font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 14px; }
.geo-zone__title { text-align: left; margin-bottom: 18px; }
.geo-zone__desc { color: var(--txt); margin-bottom: 24px; font-size: 15px; }
.geo-zone__map { background: var(--blanc); border-radius: 20px; padding: 32px; box-shadow: 0 8px 24px -12px rgba(0,0,0,0.08); }
.geo-zone__map h3 { font-size: 16px; margin-bottom: 16px; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.1em; font-weight: 700; }
.geo-zone__cities { display: flex; flex-wrap: wrap; gap: 8px; }
.geo-city { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; background: var(--indigo-pale); color: var(--indigo); border-radius: 999px; font-size: 13px; font-weight: 600; transition: all 220ms var(--ease); }
.geo-city:hover { background: var(--indigo); color: var(--blanc); transform: translateY(-2px); }
.geo-city::before { content: "📍"; font-size: 11px; }

/* ===========================================================
   SECTION 9 : ÉTAPES PROJET (charte Divi conservée)
   =========================================================== */
.steps-section { background: var(--blanc); padding: 80px 0; }
.section-label { text-align: center; font-size: 13px; font-weight: 700; color: var(--indigo); letter-spacing: 2px; text-transform: uppercase; margin-bottom: 12px; }
.steps-section h2 { margin-bottom: 16px; }
.steps-section__intro { text-align: center; max-width: 700px; margin: 0 auto 56px; color: var(--txt); font-size: 15px; }
.steps-section__intro strong { color: var(--indigo); }
.steps-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px; max-width: 1100px; margin: 0 auto; }
.step { text-align: center; transition: transform 320ms var(--ease); }
.step:hover { transform: translateY(-4px); }
.step__icon { width: 80px; height: 80px; border-radius: 50%; background: var(--indigo); color: var(--blanc); display: flex; align-items: center; justify-content: center; margin: 0 auto 20px; transition: all 320ms var(--ease); }
.step:hover .step__icon { background: var(--indigo-dark); box-shadow: 0 12px 28px -10px rgba(72,84,245,0.5); }
.step__icon svg { width: 36px; height: 36px; }
.step__title { font-size: 14px; font-weight: 600; color: var(--txt); line-height: 1.45; }

/* ===========================================================
   SECTION 10 : KPI + RGE (refonte premium 2026-06-26)
   =========================================================== */
.counters-section { padding: 80px 0; background: var(--indigo-pale); }
.counters-section h2 { font-size: clamp(28px, 3.4vw, 40px); text-align: center; margin-bottom: 12px; font-family: var(--f-h); font-weight: 900; color: var(--indigo); }
.counters-section__intro { text-align: center; color: var(--txt-soft); font-size: 16px; max-width: 640px; margin: 0 auto 48px; }
.kpi-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-bottom: 56px; }
.kpi-card { background: var(--blanc); border: 1px solid var(--gray-border); border-radius: 16px; padding: 36px 28px; text-align: center; transition: all 280ms var(--ease); box-shadow: 0 2px 8px rgba(0,0,0,0.04); }
.kpi-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px -8px rgba(72,84,245,0.18); border-color: var(--indigo); }
.kpi-card__icon { width: 56px; height: 56px; border-radius: 14px; background: var(--indigo-pale); color: var(--indigo); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 18px; }
.kpi-card__icon svg { width: 28px; height: 28px; }
.kpi-card__value { font-family: var(--f-h); font-weight: 900; font-size: clamp(40px, 5vw, 56px); color: var(--indigo); line-height: 1; margin-bottom: 8px; letter-spacing: -1px; }
.kpi-card__label { font-size: 12px; font-weight: 700; color: var(--txt-soft); letter-spacing: 1.4px; text-transform: uppercase; }
.rge-heading { text-align: center; font-family: var(--f-h); font-weight: 900; font-size: 18px; color: var(--indigo); text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 24px; }
.rge-heading::before, .rge-heading::after { content: ""; display: inline-block; width: 40px; height: 2px; background: var(--indigo); vertical-align: middle; margin: 0 16px; opacity: 0.4; }
.rge-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; max-width: 920px; margin: 0 auto; }
.rge-card { background: var(--blanc); border: 1px solid var(--gray-border); border-radius: 12px; padding: 24px 16px; display: flex; align-items: center; justify-content: center; min-height: 130px; transition: all 220ms var(--ease); }
.rge-card:hover { border-color: var(--indigo); box-shadow: 0 8px 24px -6px rgba(72,84,245,0.20); transform: translateY(-2px); }
.rge-card img { max-height: 80px; width: auto; object-fit: contain; }
.rge-card--text { flex-direction: column; gap: 4px; font-family: var(--f-h); font-weight: 900; font-size: 18px; color: var(--indigo); text-align: center; line-height: 1.1; }
.rge-card--text span { font-size: 11px; font-weight: 600; color: var(--txt-soft); letter-spacing: 0.5px; text-transform: uppercase; }

/* ===========================================================
   SECTION 11 : FAQ AEO (6 questions intentionnelles)
   =========================================================== */
.faq { padding: 80px 0; background: var(--blanc); }
.faq h2 { margin-bottom: 16px; }
.faq__intro { text-align: center; max-width: 700px; margin: 0 auto 48px; color: var(--txt); font-size: 15px; }
.faq__list { max-width: 1000px; margin: 0 auto; display: flex; flex-direction: column; gap: 12px; }
.faq__item { background: var(--indigo); color: var(--blanc); border-radius: 8px; overflow: hidden; transition: box-shadow 320ms var(--ease); }
.faq__item:hover { box-shadow: 0 12px 28px -12px rgba(72,84,245,0.4); }
.faq__item strong { color: var(--blanc); }
.faq__trigger { width: 100%; background: none; border: 0; text-align: left; padding: 20px 28px; font-family: inherit; font-size: 16px; font-weight: 700; color: var(--blanc); display: flex; justify-content: space-between; align-items: center; cursor: pointer; gap: 16px; }
.faq__trigger::after { content: ''; width: 24px; height: 24px; flex-shrink: 0; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fcc930'><path d='M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z'/></svg>"); background-repeat: no-repeat; background-position: center; transition: transform 220ms var(--ease); }
.faq__trigger[aria-expanded="true"]::after { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fcc930'><path d='M19 13H5v-2h14v2z'/></svg>"); }
.faq__panel { padding: 0 28px 22px; color: var(--blanc); display: none; line-height: 1.7; font-size: 14px; }
.faq__panel.is-open { display: block; }
.faq__panel p { margin-bottom: 10px; }

/* ===========================================================
   SECTION 12 : CTA FINAL MASSIF (conversion CRO)
   =========================================================== */
.cta-final { padding: 80px 0; background: var(--blanc); }
.cta-final__card { background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); border-radius: 24px; padding: 56px 48px; color: var(--blanc); display: grid; grid-template-columns: 1.4fr 1fr; gap: 48px; align-items: center; position: relative; overflow: hidden; }
.cta-final__card::before { content: ""; position: absolute; top: -100px; right: -100px; width: 300px; height: 300px; background: rgba(252,201,48,0.15); border-radius: 50%; }
.cta-final__card::after { content: ""; position: absolute; bottom: -80px; left: -80px; width: 250px; height: 250px; background: rgba(230,45,51,0.15); border-radius: 50%; }
.cta-final__content { position: relative; z-index: 2; }
.cta-final__label { display: inline-block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--jaune); margin-bottom: 14px; padding: 6px 14px; background: rgba(252,201,48,0.15); border-radius: 999px; }
.cta-final h2 { color: var(--blanc); text-align: left; font-size: 36px; margin-bottom: 16px; }
.cta-final__sub { font-size: 16px; opacity: 0.92; margin-bottom: 28px; max-width: 50ch; }
.cta-final__actions { display: flex; gap: 12px; flex-wrap: wrap; }
.cta-final__actions .btn-primary { background: var(--jaune); color: var(--txt); }
.cta-final__actions .btn-primary:hover { background: var(--blanc); color: var(--indigo); }
.cta-final__actions .btn-secondary { background: transparent; color: var(--blanc); border-color: var(--blanc); }
.cta-final__actions .btn-secondary:hover { background: var(--blanc); color: var(--indigo); }
.cta-final__contact { background: rgba(255,255,255,0.1); backdrop-filter: blur(10px); border-radius: 18px; padding: 28px; position: relative; z-index: 2; border: 1px solid rgba(255,255,255,0.18); }
.cta-final__contact h3 { color: var(--blanc); font-size: 16px; margin-bottom: 18px; }
.cta-final-nap { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.cta-final-nap li { display: flex; gap: 12px; align-items: flex-start; font-size: 13.5px; line-height: 1.4; }
.cta-final-nap li svg { width: 18px; height: 18px; flex-shrink: 0; color: var(--jaune); margin-top: 1px; }
.cta-final-nap strong { display: block; font-weight: 700; }

/* Footer (charte Divi) */
.footer { background: var(--blanc); padding: 60px 0 32px; text-align: center; }
.footer__logo img { height: 64px; margin-bottom: 20px; display: inline-block; }
.footer__newsletter-intro { color: var(--txt); font-size: 14px; max-width: 600px; margin: 0 auto 20px; }
.newsletter-form { max-width: 500px; margin: 0 auto; }
.newsletter-form__input { width: 100%; padding: 14px 18px; border: 1px solid var(--gray-border); border-radius: 8px; font-size: 14px; font-family: inherit; color: var(--txt); margin-bottom: 12px; }
.newsletter-form__btn { width: 100%; background: var(--indigo); color: var(--blanc); padding: 14px 20px; border-radius: 8px; font-weight: 700; font-size: 14px; border: 0; cursor: pointer; font-family: inherit; }
.footer__socials { display: flex; justify-content: center; gap: 20px; margin: 24px 0 0; padding: 0; list-style: none; }
.footer__socials a { color: var(--indigo); transition: transform 220ms var(--ease); }
.footer__socials a:hover { transform: translateY(-2px); }
.subfooter { background: var(--txt-soft); color: var(--blanc); padding: 16px 0; text-align: center; font-size: 13px; }
.subfooter a { color: var(--blanc); }
.subfooter p { margin: 4px 0; }

/* Sticky mobile CTA (tel = vert WhatsApp règle flotte) */
.sticky-mobile { display: none; position: fixed; bottom: 0; left: 0; right: 0; background: var(--blanc); padding: 10px; gap: 8px; z-index: 99; box-shadow: 0 -4px 16px rgba(0,0,0,0.1); }
.sticky-mobile a { flex: 1; text-align: center; padding: 10px 8px; border-radius: 6px; font-weight: 700; font-size: 13px; line-height: 1.2; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.sticky-mobile a small { font-size: 10px; font-weight: 500; opacity: 0.95; text-transform: uppercase; letter-spacing: 0.04em; }
.sticky-mobile__tel { background: #25D366; color: var(--blanc); }
.sticky-mobile__devis { background: var(--rouge); color: var(--blanc); }

/* ===========================================================
   MEGA MENU + BURGER (header partial)
   =========================================================== */
.top-bar__hours { display: inline-flex; align-items: center; gap: 5px; color: rgba(255,255,255,0.85); font-size: 12px; }
.top-bar__rating { display: inline-flex; align-items: center; gap: 5px; color: var(--blanc); font-size: 12px; font-weight: 600; margin-left: auto; }
.nav__cta { background: var(--rouge) !important; color: var(--blanc) !important; padding: 10px 18px !important; border-radius: 6px; }
.nav__cta:hover { background: var(--rouge-dark) !important; color: var(--blanc) !important; }

.nav__has-mega .mega { position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(8px); min-width: 1080px; background: var(--blanc); box-shadow: 0 24px 60px -16px rgba(0,0,0,0.18); border-radius: 16px; padding: 28px; opacity: 0; visibility: hidden; transition: all 280ms var(--ease); z-index: 200; border: 1px solid var(--gray-border); }
.nav__has-mega:hover .mega,
.nav__has-mega:focus-within .mega { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.mega__inner { display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px; }
.mega-col { display: flex; flex-direction: column; gap: 10px; }
.mega-col__hub { display: flex; align-items: center; gap: 10px; font-family: var(--f-h); font-weight: 700; font-size: 14.5px; color: var(--txt); padding: 8px 10px; border-radius: 8px; transition: all 220ms var(--ease); border-bottom: 2px solid var(--indigo-pale); padding-bottom: 12px; margin-bottom: 4px; }
.mega-col__hub:hover { color: var(--indigo); background: var(--indigo-pale); }
.mega-col__icon { flex-shrink: 0; width: 32px; height: 32px; border-radius: 8px; display: flex; align-items: center; justify-content: center; }
.mega-col__icon svg { width: 18px; height: 18px; }
.mega-col__icon--yellow { background: rgba(252,201,48,0.18); color: #d4a01a; }
.mega-col__icon--red { background: rgba(230,45,51,0.12); color: var(--rouge); }
.mega-col__icon--blue { background: rgba(72,84,245,0.12); color: var(--indigo); }
.mega-col__icon--cyan { background: rgba(56,189,248,0.15); color: #0c8aab; }
.mega-col__icon--green { background: rgba(34,197,94,0.15); color: #1ca64c; }
.mega-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 2px; }
.mega-col ul a { display: block; padding: 7px 10px; font-size: 13px; color: var(--txt-soft); border-radius: 6px; transition: all 180ms var(--ease); line-height: 1.4; }
.mega-col ul a:hover { color: var(--indigo); background: var(--gray-soft); padding-left: 14px; }
.mega--small { min-width: 240px !important; padding: 12px !important; }
.mega__inner--small { display: block !important; grid-template-columns: none !important; }
.mega-simple { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 1px; }
.mega-simple li a { display: block; padding: 9px 12px; font-size: 14px; font-weight: 500; color: var(--txt); border-radius: 6px; transition: all 180ms var(--ease); }
.mega-simple li a:hover { color: var(--indigo); background: var(--indigo-pale); padding-left: 16px; }

.burger { display: none; background: transparent; border: 0; width: 36px; height: 36px; flex-direction: column; justify-content: center; align-items: center; gap: 5px; cursor: pointer; padding: 0; z-index: 1002; }
.burger span { display: block; width: 24px; height: 2px; background: var(--indigo); border-radius: 2px; transition: all 320ms var(--ease); }
body.is-menu-open .burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
body.is-menu-open .burger span:nth-child(2) { opacity: 0; }
body.is-menu-open .burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ===========================================================
   MINI FORM HERO (3 champs, scroll vers form complet)
   =========================================================== */
.mini-form { background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); padding: 56px 0; color: var(--blanc); position: relative; overflow: hidden; }
.mini-form::before { content: ""; position: absolute; top: -80px; right: -80px; width: 280px; height: 280px; background: rgba(252,201,48,0.12); border-radius: 50%; }
.mini-form::after { content: ""; position: absolute; bottom: -100px; left: -100px; width: 320px; height: 320px; background: rgba(230,45,51,0.08); border-radius: 50%; }
.mini-form__inner { position: relative; z-index: 2; max-width: 900px; margin: 0 auto; text-align: center; }
.mini-form__pretitle { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; color: var(--jaune); text-transform: uppercase; letter-spacing: 0.18em; margin-bottom: 14px; padding: 6px 16px; background: rgba(252,201,48,0.15); border-radius: 999px; }
.mini-form__title { font-family: var(--f-h); font-weight: 900; font-size: clamp(26px, 3.2vw, 34px); margin: 0 0 10px; line-height: 1.2; color: var(--blanc); }
.mini-form__subtitle { font-size: 16px; opacity: 0.92; margin: 0 auto 28px; max-width: 600px; line-height: 1.5; }
.mini-form__subtitle strong { font-weight: 700; color: var(--jaune); }
.mini-form__form { display: grid; grid-template-columns: 1fr 1.2fr 1.1fr auto; gap: 10px; max-width: 820px; margin: 0 auto; background: rgba(255,255,255,0.08); padding: 12px; border-radius: 16px; border: 1px solid rgba(255,255,255,0.18); backdrop-filter: blur(10px); }
.mini-form__form input, .mini-form__form select { padding: 16px 18px; border: 0; background: var(--blanc); color: var(--txt); border-radius: 10px; font-family: inherit; font-size: 15px; font-weight: 500; outline: 0; min-width: 0; }
.mini-form__form input::placeholder { color: var(--txt-soft); }
.mini-form__form input:focus, .mini-form__form select:focus { box-shadow: 0 0 0 3px rgba(252,201,48,0.5); }
.mini-form__form button { background: var(--rouge); color: var(--blanc); padding: 16px 28px; border-radius: 10px; font-family: inherit; font-weight: 800; font-size: 15px; border: 0; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px; transition: all 280ms var(--ease); white-space: nowrap; box-shadow: 0 4px 16px rgba(0,0,0,0.15); }
.mini-form__form button:hover { background: var(--rouge-dark); transform: translateY(-2px); box-shadow: 0 12px 28px -8px rgba(230,45,51,0.7); }
.mini-form__trust { display: flex; gap: 28px; flex-wrap: wrap; justify-content: center; margin-top: 22px; font-size: 13px; opacity: 0.92; font-weight: 500; }
.mini-form__trust span { display: inline-flex; align-items: center; gap: 6px; }
.mini-form__trust span::before { content: "✓"; color: var(--jaune); font-weight: 900; }

/* ===========================================================
   FINAL CTA : Formulaire devis complet (CRO)
   =========================================================== */
.final-cta { padding: 80px 0; background: var(--blanc); }
.final-cta__inner { display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); border-radius: 24px; padding: 48px; color: var(--blanc); position: relative; overflow: hidden; align-items: center; }
.final-cta__inner::before { content: ""; position: absolute; top: -100px; right: -100px; width: 300px; height: 300px; background: rgba(252,201,48,0.15); border-radius: 50%; }
.final-cta__inner::after { content: ""; position: absolute; bottom: -80px; left: -80px; width: 250px; height: 250px; background: rgba(230,45,51,0.15); border-radius: 50%; }
.final-cta__content { position: relative; z-index: 2; }
.final-cta__label { display: inline-block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--jaune); margin-bottom: 14px; padding: 6px 14px; background: rgba(252,201,48,0.15); border-radius: 999px; }
.final-cta h2 { color: var(--blanc); text-align: left; margin-bottom: 16px; }
.final-cta__sub { font-size: 16px; opacity: 0.92; margin-bottom: 24px; }
.final-cta__contact { display: flex; flex-direction: column; gap: 14px; font-size: 14px; }
.final-cta__contact-item { display: flex; gap: 12px; align-items: flex-start; }
.final-cta__contact-item svg { width: 20px; height: 20px; flex-shrink: 0; color: var(--jaune); margin-top: 2px; }
.final-cta__contact-item strong { display: block; font-weight: 700; }
.devis-form { position: relative; z-index: 2; background: var(--blanc); border-radius: 18px; padding: 28px; color: var(--txt); box-shadow: 0 20px 50px rgba(0,0,0,0.2); }
.devis-form h3 { font-family: var(--f-h); font-weight: 900; font-size: 20px; color: var(--txt); margin-bottom: 6px; text-align: left; }
.devis-form__intro { font-size: 13px; color: var(--txt-soft); margin-bottom: 18px; }
.devis-form__field { margin-bottom: 12px; }
.devis-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.devis-form input, .devis-form select, .devis-form textarea { width: 100%; padding: 12px 14px; border: 1px solid var(--gray-border); border-radius: 8px; font-family: inherit; font-size: 14px; color: var(--txt); background: var(--blanc); transition: border-color 220ms var(--ease); }
.devis-form input:focus, .devis-form select:focus, .devis-form textarea:focus { outline: 0; border-color: var(--indigo); }
.devis-form textarea { min-height: 80px; resize: vertical; }
.devis-form__rgpd-text { font-size: 11px; color: var(--txt-soft); margin: 12px 0 0; line-height: 1.45; text-align: center; }
.devis-form__rgpd-text a { color: var(--indigo); text-decoration: underline; }
.devis-form__btn { width: 100%; background: var(--rouge); color: var(--blanc); padding: 14px 20px; border-radius: 8px; font-family: inherit; font-weight: 700; font-size: 15px; border: 0; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 10px; transition: all 280ms var(--ease); }
.devis-form__btn:hover { background: var(--rouge-dark); transform: translateY(-2px); box-shadow: 0 10px 24px -10px rgba(230,45,51,0.5); }
.devis-form__trust { margin: 16px 0 0; padding-top: 14px; border-top: 1px solid var(--gray-border); }
.devis-form__trust-badges { display: flex; gap: 6px; justify-content: center; margin-bottom: 8px; }
.devis-form__trust-badges img { height: 28px; width: auto; object-fit: contain; }
.devis-form__trust-text { text-align: center; font-size: 11px; color: var(--txt-soft); font-weight: 600; line-height: 1.4; }

/* ===========================================================
   FOOTER PRO (4 colonnes + RGE + newsletter)
   =========================================================== */
.footer { background: var(--blanc); padding: 0; text-align: left; }
.footer-newsletter { background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); padding: 48px 0; color: var(--blanc); position: relative; overflow: hidden; }
.footer-newsletter::before { content: ""; position: absolute; top: -80px; right: -80px; width: 250px; height: 250px; background: rgba(252,201,48,0.12); border-radius: 50%; }
.footer-newsletter__inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; position: relative; z-index: 2; }
.footer-newsletter h3 { color: var(--blanc); font-size: 26px; margin-bottom: 8px; text-align: left; }
.footer-newsletter p { opacity: 0.9; font-size: 15px; margin: 0; }
.footer-newsletter__form { display: flex; gap: 8px; background: var(--blanc); padding: 6px; border-radius: 999px; }
.footer-newsletter__form input { flex: 1; border: 0; background: transparent; padding: 12px 18px; font-family: inherit; font-size: 14px; color: var(--txt); outline: none; }
.footer-newsletter__form button { background: var(--rouge); color: var(--blanc); padding: 12px 24px; border: 0; border-radius: 999px; font-family: inherit; font-weight: 700; font-size: 14px; cursor: pointer; transition: background 220ms var(--ease); display: inline-flex; align-items: center; gap: 8px; }
.footer-newsletter__form button:hover { background: var(--rouge-dark); }
.footer-main { padding: 64px 0 32px; }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: 56px; padding-bottom: 40px; border-bottom: 1px solid var(--gray-border); }
.footer-col h4 { font-family: var(--f-h); font-size: 13px; font-weight: 700; color: var(--txt); margin-bottom: 18px; text-transform: uppercase; letter-spacing: 0.12em; padding-bottom: 10px; border-bottom: 2px solid var(--indigo); display: inline-block; }
.footer-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.footer-col ul a { font-size: 14px; color: var(--txt-soft); transition: all 220ms var(--ease); display: inline-flex; align-items: center; gap: 6px; }
.footer-col ul a:hover { color: var(--indigo); transform: translateX(4px); }
.footer-col ul a::before { content: "›"; color: var(--indigo); font-weight: 900; }
.footer-brand__logo img { height: 72px; margin-bottom: 16px; }
.footer-brand__tagline { color: var(--txt-soft); font-size: 14px; line-height: 1.6; margin-bottom: 20px; max-width: 32ch; }
.footer-nap { font-style: normal; font-size: 14px; color: var(--txt); margin-bottom: 18px; }
.footer-nap p { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 8px; line-height: 1.5; }
.footer-nap p svg { width: 16px; height: 16px; color: var(--indigo); flex-shrink: 0; margin-top: 2px; }
.footer-nap strong { display: block; font-weight: 700; color: var(--txt); }
.footer-nap a { color: var(--txt); font-weight: 600; }
.footer-nap a:hover { color: var(--indigo); }
.footer-rge { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.footer-rge img { width: 100%; height: auto; max-height: 70px; object-fit: contain; background: var(--blanc); border-radius: 8px; padding: 8px; border: 1px solid var(--gray-border); }
.footer-rge__note { grid-column: 1 / -1; font-size: 11px; color: var(--txt-soft); margin-top: 6px; text-align: center; line-height: 1.4; }
.footer-bottom { padding-top: 24px; display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; }
.footer-bottom__socials { display: flex; gap: 12px; list-style: none; padding: 0; margin: 0; }
.footer-bottom__socials a { width: 36px; height: 36px; border-radius: 50%; background: var(--gray-soft); display: inline-flex; align-items: center; justify-content: center; color: var(--indigo); transition: all 220ms var(--ease); border: 1px solid var(--gray-border); }
.footer-bottom__socials a:hover { background: var(--indigo); color: var(--blanc); transform: translateY(-2px); border-color: var(--indigo); }
.footer-bottom__socials svg { width: 16px; height: 16px; }
.footer-bottom__hours { font-size: 13px; color: var(--txt-soft); display: inline-flex; align-items: center; gap: 8px; }
.footer-bottom__hours svg { width: 14px; height: 14px; color: var(--indigo); }
.subfooter { background: #1a1a1a; color: var(--blanc); padding: 18px 0; font-size: 12.5px; }
.subfooter__inner { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.subfooter__legal { display: flex; gap: 16px; flex-wrap: wrap; }
.subfooter a { color: rgba(255,255,255,0.85); transition: color 220ms; }
.subfooter a:hover { color: var(--jaune); }
.subfooter__rankit { color: rgba(255,255,255,0.85); }
.subfooter__rankit strong { color: var(--jaune); }

/* Scroll reveal */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 600ms var(--ease), transform 600ms var(--ease); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 1080px) {
  .hero__grid, .case-study__inner, .geo-zone__inner, .cta-final__card, .final-cta__inner { grid-template-columns: 1fr; gap: 32px; }
  .trust-strip__inner { grid-template-columns: repeat(2, 1fr); gap: 18px; }
  .aeo-block__grid, .why__grid { grid-template-columns: repeat(2, 1fr); }
  .services-intent__grid, .case-study__stats { grid-template-columns: 1fr 1fr; }
  .team__grid { grid-template-columns: 1fr; max-width: 400px; }
  .counters-section { padding: 60px 0; }
  .kpi-grid { grid-template-columns: 1fr; gap: 16px; margin-bottom: 40px; }
  .kpi-card { padding: 28px 20px; }
  .rge-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .rge-card { min-height: 100px; padding: 18px 12px; }
  .rge-card img { max-height: 64px; }
  .rge-heading::before, .rge-heading::after { width: 24px; margin: 0 10px; }
  .steps-grid { grid-template-columns: repeat(2, 1fr); }
  .mini-form__form { grid-template-columns: 1fr 1fr; }
  .mini-form__form button { grid-column: 1 / -1; justify-content: center; }
  /* Mega menu mobile */
  .top-bar__hours, .top-bar__socials, .top-bar__rating { display: none; }
  .top-bar__inner { gap: 12px; }
  .burger { display: inline-flex; }
  .nav { position: fixed; inset: 0; background: rgba(255,255,255,0.97); backdrop-filter: blur(12px); z-index: 1000; padding: 120px 24px 32px; overflow-y: auto; opacity: 0; visibility: hidden; transition: all 320ms var(--ease); }
  body.is-menu-open .nav { opacity: 1; visibility: visible; }
  .nav > ul { flex-direction: column; gap: 4px; }
  .nav > ul > li { width: 100%; }
  .nav > ul > li > a { font-size: 18px; padding: 14px 16px; width: 100%; justify-content: space-between; }
  .nav__has-mega .mega { position: static; transform: none; min-width: 0; box-shadow: none; border: 0; background: var(--gray-soft); padding: 14px; opacity: 1; visibility: inherit; margin: 6px 0; }
  .mega__inner { grid-template-columns: 1fr !important; gap: 16px; }
  .mega-col__hub { font-size: 16px; }
  .mega-col ul a { padding: 8px 12px; font-size: 14px; }
  .header__logo img { height: 48px; }
  .header { padding: 10px 0; }
  .footer-newsletter__inner { grid-template-columns: 1fr; gap: 20px; text-align: center; }
  .footer-newsletter h3 { text-align: center; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .final-cta__inner { padding: 32px 24px; }
}
@media (max-width: 700px) {
  .top-bar__inner { flex-wrap: wrap; gap: 10px; justify-content: center; }
  .aeo-block__grid, .why__grid, .services-intent__grid, .case-study__stats { grid-template-columns: 1fr; }
  .cta-final__card { padding: 32px 24px; }
  .sticky-mobile { display: flex; }
  body { padding-bottom: 72px; }
  .mini-form__form { grid-template-columns: 1fr; }
  .mini-form__form select, .mini-form__form input { font-size: 16px; }
  .mini-form__trust { gap: 8px 14px; }
  .devis-form__row { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: 32px; }
  .footer-bottom { flex-direction: column; gap: 16px; text-align: center; }
  .subfooter__inner { flex-direction: column; gap: 8px; text-align: center; }
  .subfooter__legal { justify-content: center; }
}

/* ============ CRO HELPERS (eyebrow + container) ============ */
.cro-eyebrow { display: inline-block; font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 12px; }
.cro-container-narrow { max-width: 1100px; margin: 0 auto; padding: 0 24px; }

/* ============ LEVIER 1 ; DOULEUR EN CHIFFRES FROIDS ============ */
.pain-numbers { padding: 80px 0; background: var(--indigo-pale); }
.pain-numbers__head { text-align: center; max-width: 760px; margin: 0 auto 32px; }
.pain-numbers__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 32px 0; }
.pain-numbers__card { background: var(--blanc); padding: 32px 20px; border-radius: 16px; text-align: center; border: 1px solid var(--gray-border); box-shadow: 0 8px 24px -16px rgba(0,0,0,0.08); }
.pain-numbers__amount { font-family: var(--f-h); font-weight: 900; font-size: 48px; line-height: 1; color: var(--rouge); margin-bottom: 10px; letter-spacing: -0.02em; }
.pain-numbers__label { font-family: var(--f-body); font-weight: 500; font-size: 14px; line-height: 1.5; color: var(--txt-soft); }
.pain-numbers__conclusion { font-family: var(--f-body); font-weight: 500; font-size: 17px; line-height: 1.7; color: var(--txt); text-align: center; max-width: 760px; margin: 16px auto 0; }
.pain-numbers__conclusion strong { color: var(--indigo); font-weight: 900; }
@media (max-width: 700px) {
  .pain-numbers__grid { grid-template-columns: 1fr; }
  .pain-numbers__amount { font-size: 40px; }
  .pain-numbers { padding: 56px 0; }
}

/* ============ LEVIER 2 ; GARANTIES EN ENCART ============ */
.guarantees { padding: 80px 0; background: var(--blanc); }
.guarantees__head { text-align: center; max-width: 760px; margin: 0 auto 32px; }
.guarantees__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; margin-top: 32px; }
.guarantees__card { background: var(--indigo-pale); border-radius: 14px; padding: 24px 16px; text-align: center; transition: transform 320ms var(--ease), box-shadow 320ms var(--ease); border: 1px solid var(--gray-border); }
.guarantees__card:hover { transform: translateY(-4px); box-shadow: 0 16px 32px -16px rgba(72,84,245,0.25); border-color: var(--indigo); }
.guarantees__icon { font-size: 32px; line-height: 1; margin-bottom: 14px; }
.guarantees__title { font-family: var(--f-h); font-weight: 800; font-size: 15px; color: var(--indigo); margin-bottom: 8px; line-height: 1.3; }
.guarantees__detail { font-family: var(--f-body); font-weight: 400; font-size: 13px; line-height: 1.5; color: var(--txt); }
@media (max-width: 1080px) { .guarantees__grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 700px) {
  .guarantees__grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .guarantees { padding: 56px 0; }
}
@media (max-width: 480px) { .guarantees__grid { grid-template-columns: 1fr; } }

/* ============ LEVIER 4 ; STACK OFFER EMPILÉ ============ */
.stack-offer { padding: 80px 0; background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); color: var(--blanc); position: relative; overflow: hidden; }
.stack-offer::before { content: ""; position: absolute; top: -80px; right: -80px; width: 280px; height: 280px; background: rgba(252,201,48,0.12); border-radius: 50%; }
.stack-offer::after { content: ""; position: absolute; bottom: -100px; left: -100px; width: 320px; height: 320px; background: rgba(230,45,51,0.08); border-radius: 50%; }
.stack-offer__head { text-align: center; max-width: 760px; margin: 0 auto 32px; position: relative; z-index: 2; }
.stack-offer__head .cro-eyebrow { color: var(--jaune); }
.stack-offer__head h2 { color: var(--blanc); }
.stack-offer__list { list-style: none; padding: 0; max-width: 760px; margin: 32px auto 0; position: relative; z-index: 2; background: rgba(255,255,255,0.06); border-radius: 16px; padding: 24px 28px; border: 1px solid rgba(255,255,255,0.12); backdrop-filter: blur(6px); }
.stack-offer__item { display: flex; gap: 16px; align-items: flex-start; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,0.14); }
.stack-offer__item:last-child { border-bottom: 0; }
.stack-offer__check { background: var(--jaune); color: var(--indigo); width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 900; font-family: var(--f-h); flex-shrink: 0; margin-top: 2px; font-size: 15px; }
.stack-offer__item-body strong { font-family: var(--f-h); font-weight: 700; font-size: 16px; color: var(--blanc); display: block; line-height: 1.4; }
.stack-offer__value { font-family: var(--f-body); font-weight: 400; font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,0.78); display: block; margin-top: 2px; }
.stack-offer__cta-text { text-align: center; margin-top: 28px; font-family: var(--f-body); font-weight: 600; font-size: 17px; line-height: 1.55; color: var(--jaune); position: relative; z-index: 2; }
.stack-offer__cta-text strong { font-weight: 900; }
@media (max-width: 700px) {
  .stack-offer { padding: 56px 0; }
  .stack-offer__list { padding: 16px 18px; }
  .stack-offer__item-body strong { font-size: 15px; }
}

/* ===== CROSS-SELL (intra-linking 5 piliers + études + transversales) ===== */
.cross-sell { padding: 80px 0; background: var(--gray-soft); }
.cross-sell__header { text-align: center; max-width: 720px; margin: 0 auto 40px; }
.cross-sell__lead { font-size: 15px; color: var(--txt-soft); line-height: 1.6; margin-top: 12px; }
.cross-sell__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.cross-card { background: var(--blanc); border: 2px solid var(--gray-border); border-radius: 16px; padding: 22px 18px; text-decoration: none; color: var(--txt); transition: all 320ms var(--ease); display: flex; flex-direction: column; min-width: 0; }
.cross-card:hover { border-color: var(--indigo); transform: translateY(-4px); box-shadow: 0 20px 40px -16px rgba(72,84,245,0.2); }
.cross-card__title { font-family: var(--f-h); font-weight: 700; font-size: 15px; color: var(--txt); margin-bottom: 6px; }
.cross-card__desc { font-size: 12.5px; color: var(--txt-soft); line-height: 1.5; flex: 1; margin-bottom: 12px; }
.cross-card__desc strong { color: var(--rouge); font-weight: 700; }
.cross-card__link { display: inline-flex; align-items: center; gap: 4px; color: var(--indigo); font-weight: 700; font-size: 12.5px; transition: gap 220ms var(--ease); }
.cross-card:hover .cross-card__link { gap: 8px; }
@media (max-width: 1080px) { .cross-sell__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 700px) { .cross-sell { padding: 56px 0; } .cross-sell__grid { grid-template-columns: 1fr; } }


/* === preview-photovoltaique.html === */

:root {
  --indigo: #4854f5; --indigo-dark: #3a44d4; --indigo-pale: #eff0ff;
  --rouge: #e62d33; --rouge-dark: #c22128; --jaune: #fcc930;
  --txt: #444444; --txt-soft: #6b6b6b;
  --gray-border: #e5e7eb; --gray-soft: #f9f9fb;
  --blanc: #ffffff;
  --f-body: 'Raleway', Helvetica, Arial, Lucida, sans-serif;
  --f-h: 'Lato', Helvetica, Arial, Lucida, sans-serif;
  --ease: cubic-bezier(0.32, 0.72, 0, 1);
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: var(--f-body); font-size: 15px; line-height: 1.7; color: var(--txt); background: var(--blanc); -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; display: block; }
h1, h2, h3, h4 { font-family: var(--f-h); color: var(--txt); font-weight: 700; line-height: 1.25; margin: 0 0 0.5em; }
h1 { font-size: clamp(34px, 4.5vw, 50px); }
h2 { font-size: clamp(26px, 3vw, 36px); text-align: center; }
h3 { font-size: 20px; }
p { margin: 0 0 1em; }
a { color: var(--indigo); text-decoration: none; transition: color 220ms var(--ease); }
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }

/* Top-bar enrichie */
.top-bar { background: var(--indigo); color: var(--blanc); font-size: 12.5px; padding: 9px 0; }
.top-bar__inner { display: flex; justify-content: flex-start; align-items: center; gap: 18px; }
.top-bar__phone { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: var(--blanc); }
.top-bar__hours { display: inline-flex; align-items: center; gap: 5px; color: rgba(255,255,255,0.85); font-size: 12px; }
.top-bar__rating { display: inline-flex; align-items: center; gap: 5px; color: var(--blanc); font-size: 12px; font-weight: 600; margin-left: auto; }
.top-bar__socials { display: flex; gap: 4px; list-style: none; padding: 0; margin: 0; }
.top-bar__socials a { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; transition: background 220ms var(--ease); color: var(--blanc); }
.top-bar__socials a:hover { background: rgba(255,255,255,0.18); }
.top-bar__cta { background: var(--rouge); padding: 6px 14px; border-radius: 6px; font-weight: 700; transition: all 220ms var(--ease); font-size: 12.5px; color: var(--blanc); }
.top-bar__cta:hover { background: var(--rouge-dark); transform: translateY(-1px); }
.top-bar__avis { background: rgba(255,255,255,0.15); padding: 6px 12px; border-radius: 6px; font-weight: 500; font-size: 12.5px; color: var(--blanc); }

/* Header sticky */
.header { background: var(--blanc); padding: 14px 0; border-bottom: 1px solid rgba(0,0,0,0.05); position: sticky; top: 0; z-index: 100; transition: box-shadow 220ms var(--ease); }
.header__inner { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.header__logo img { height: 64px; transition: height 220ms; }

/* Nav primaire */
.nav > ul { list-style: none; padding: 0; margin: 0; display: flex; gap: 2px; align-items: center; }
.nav > ul > li { position: relative; }
.nav > ul > li > a { display: inline-flex; align-items: center; padding: 10px 14px; color: var(--txt); font-size: 14.5px; font-weight: 600; transition: all 220ms var(--ease); border-radius: 6px; }
.nav > ul > li > a:hover { color: var(--indigo); background: var(--indigo-pale); }
.nav__cta { background: var(--rouge) !important; color: var(--blanc) !important; padding: 10px 18px !important; }
.nav__cta:hover { background: var(--rouge-dark) !important; color: var(--blanc) !important; }

/* MEGA MENU 5 COLONNES : Service vers Sous-services (cocon SEO) */
.nav__has-mega .mega { position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(8px); min-width: 1080px; background: var(--blanc); box-shadow: 0 24px 60px -16px rgba(0,0,0,0.18); border-radius: 16px; padding: 28px; opacity: 0; visibility: hidden; transition: all 280ms var(--ease); z-index: 200; border: 1px solid var(--gray-border); }
.nav__has-mega:hover .mega,
.nav__has-mega:focus-within .mega { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }

.mega__inner { display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px; }

.mega-col { display: flex; flex-direction: column; gap: 10px; }
.mega-col__hub { display: flex; align-items: center; gap: 10px; font-family: var(--f-h); font-weight: 700; font-size: 14.5px; color: var(--txt); padding: 8px 10px; border-radius: 8px; transition: all 220ms var(--ease); border-bottom: 2px solid var(--indigo-pale); padding-bottom: 12px; margin-bottom: 4px; }
.mega-col__hub:hover { color: var(--indigo); background: var(--indigo-pale); }
.mega-col__icon { flex-shrink: 0; width: 32px; height: 32px; border-radius: 8px; display: flex; align-items: center; justify-content: center; }
.mega-col__icon svg { width: 18px; height: 18px; }
.mega-col__icon--yellow { background: rgba(252,201,48,0.18); color: #d4a01a; }
.mega-col__icon--red { background: rgba(230,45,51,0.12); color: var(--rouge); }
.mega-col__icon--blue { background: rgba(72,84,245,0.12); color: var(--indigo); }
.mega-col__icon--cyan { background: rgba(56,189,248,0.15); color: #0c8aab; }
.mega-col__icon--green { background: rgba(34,197,94,0.15); color: #1ca64c; }

.mega-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 2px; }
.mega-col ul a { display: block; padding: 7px 10px; font-size: 13px; color: var(--txt-soft); border-radius: 6px; transition: all 180ms var(--ease); line-height: 1.4; }
.mega-col ul a:hover { color: var(--indigo); background: var(--gray-soft); padding-left: 14px; }

/* Mega small épuré (Aides + À propos) */
.mega--small { min-width: 240px !important; padding: 12px !important; }
.mega__inner--small { display: block !important; grid-template-columns: none !important; }
.mega-simple { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 1px; }
.mega-simple li a { display: block; padding: 9px 12px; font-size: 14px; font-weight: 500; color: var(--txt); border-radius: 6px; transition: all 180ms var(--ease); }
.mega-simple li a:hover { color: var(--indigo); background: var(--indigo-pale); padding-left: 16px; }

/* Arrow indicator au hover */
.nav__has-mega::after { content: ""; position: absolute; bottom: -8px; left: 50%; transform: translateX(-50%); width: 12px; height: 12px; background: var(--blanc); border-left: 1px solid var(--gray-border); border-top: 1px solid var(--gray-border); rotate: 45deg; opacity: 0; transition: opacity 220ms; z-index: 201; }
.nav__has-mega:hover::after,
.nav__has-mega:focus-within::after { opacity: 1; }

/* Burger mobile */
.burger { display: none; background: transparent; border: 0; width: 36px; height: 36px; flex-direction: column; justify-content: center; align-items: center; gap: 5px; cursor: pointer; padding: 0; z-index: 1002; }
.burger span { display: block; width: 24px; height: 2px; background: var(--indigo); border-radius: 2px; transition: all 320ms var(--ease); }
body.is-menu-open .burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
body.is-menu-open .burger span:nth-child(2) { opacity: 0; }
body.is-menu-open .burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
body.is-menu-open { overflow: hidden; }

/* Mobile - hide mega, show burger */
@media (max-width: 1080px) {
  .top-bar__hours, .top-bar__socials, .top-bar__rating { display: none; }
  .top-bar__inner { gap: 12px; }
  .burger { display: inline-flex; }
  .nav { position: fixed; inset: 0; background: rgba(255,255,255,0.97); backdrop-filter: blur(12px); z-index: 1000; padding: 120px 24px 32px; overflow-y: auto; opacity: 0; visibility: hidden; transition: all 320ms var(--ease); }
  body.is-menu-open .nav { opacity: 1; visibility: visible; }
  .nav > ul { flex-direction: column; gap: 4px; }
  .nav > ul > li { width: 100%; }
  .nav > ul > li > a { font-size: 18px; padding: 14px 16px; width: 100%; justify-content: space-between; }
  .nav__has-mega .mega { position: static; transform: none; min-width: 0; box-shadow: none; border: 0; background: var(--gray-soft); padding: 14px; opacity: 1; visibility: inherit; margin: 6px 0; }
  .mega__inner { grid-template-columns: 1fr !important; gap: 16px; }
  .mega-col__hub { font-size: 16px; }
  .mega-col ul a { padding: 8px 12px; font-size: 14px; }
  .nav__has-mega::after { display: none; }
  .header__logo img { height: 48px; }
  .header { padding: 10px 0; }
}

/* Breadcrumb */
.breadcrumb { background: var(--gray-soft); padding: 14px 0; font-size: 13px; color: var(--txt-soft); }
.breadcrumb a { color: var(--txt-soft); }
.breadcrumb a:hover { color: var(--indigo); }
.breadcrumb__sep { margin: 0 8px; opacity: 0.4; }

/* ============ HERO ============ */
.hero { padding: 50px 0 80px; background: var(--blanc); }
.hero__grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 48px; align-items: center; }
.hero__pretitle { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 16px; padding: 8px 14px; background: var(--indigo-pale); border-radius: 999px; }
.hero__pretitle::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--indigo); }
.hero__title { margin: 0 0 18px; }
.hero__title strong { color: var(--indigo); font-weight: 900; }
.hero__sub { font-size: 17px; color: var(--txt-soft); margin-bottom: 24px; max-width: 56ch; line-height: 1.55; }
.hero__sub strong { color: var(--txt); font-weight: 700; }
.hero__ctas { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 24px; }
.btn-primary { display: inline-flex; align-items: center; gap: 10px; background: var(--rouge); color: var(--blanc); padding: 16px 28px; border-radius: 8px; font-weight: 700; font-size: 15px; transition: all 280ms var(--ease); font-family: var(--f-body); border: 0; cursor: pointer; }
.btn-primary:hover { background: var(--rouge-dark); color: var(--blanc); transform: translateY(-2px); box-shadow: 0 10px 24px -10px rgba(230,45,51,0.5); }
.btn-secondary { display: inline-flex; align-items: center; gap: 10px; background: var(--blanc); color: var(--indigo); padding: 16px 28px; border-radius: 8px; font-weight: 700; font-size: 15px; border: 2px solid var(--indigo); transition: all 280ms var(--ease); }
.btn-secondary:hover { background: var(--indigo); color: var(--blanc); transform: translateY(-2px); }
.btn-indigo { display: inline-flex; align-items: center; gap: 8px; background: var(--indigo); color: var(--blanc); padding: 12px 22px; border-radius: 6px; font-weight: 700; font-size: 14px; transition: all 280ms var(--ease); border: 0; cursor: pointer; font-family: var(--f-body); }
.btn-indigo:hover { background: var(--indigo-dark); color: var(--blanc); transform: translateY(-2px); }
.btn-tel-strong { display: inline-flex; align-items: center; gap: 12px; background: var(--indigo); color: var(--blanc); padding: 12px 22px; border-radius: 8px; font-weight: 700; transition: all 280ms var(--ease); }
.btn-tel-strong:hover { background: var(--indigo-dark); color: var(--blanc); transform: translateY(-2px); box-shadow: 0 10px 24px -10px rgba(72,84,245,0.5); }
.btn-tel-strong svg { width: 22px; height: 22px; flex-shrink: 0; color: var(--jaune); }
.btn-tel-strong > div { display: flex; flex-direction: column; line-height: 1.15; text-align: left; }
.btn-tel-strong strong { font-size: 17px; font-weight: 900; font-family: var(--f-h); letter-spacing: 0.02em; }
.btn-tel-strong small { font-size: 10px; font-weight: 600; opacity: 0.85; text-transform: uppercase; letter-spacing: 0.06em; margin-top: 2px; }

/* MINI-FORM HERO */
.mini-form { background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); padding: 56px 0; color: var(--blanc); position: relative; overflow: hidden; }
.mini-form::before { content: ""; position: absolute; top: -80px; right: -80px; width: 280px; height: 280px; background: rgba(252,201,48,0.12); border-radius: 50%; }
.mini-form::after { content: ""; position: absolute; bottom: -100px; left: -100px; width: 320px; height: 320px; background: rgba(230,45,51,0.08); border-radius: 50%; }
.mini-form__inner { position: relative; z-index: 2; max-width: 900px; margin: 0 auto; text-align: center; }
.mini-form__pretitle { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; color: var(--jaune); text-transform: uppercase; letter-spacing: 0.18em; margin-bottom: 14px; padding: 6px 16px; background: rgba(252,201,48,0.15); border-radius: 999px; }
.mini-form__title { font-family: var(--f-h); font-weight: 900; font-size: clamp(26px, 3.2vw, 34px); margin: 0 0 10px; line-height: 1.2; color: var(--blanc); }
.mini-form__subtitle { font-size: 16px; opacity: 0.92; margin: 0 auto 28px; max-width: 600px; line-height: 1.5; }
.mini-form__subtitle strong { font-weight: 700; color: var(--jaune); }
.mini-form__form { display: grid; grid-template-columns: 1fr 1.2fr 1.1fr auto; gap: 10px; max-width: 820px; margin: 0 auto; background: rgba(255,255,255,0.08); padding: 12px; border-radius: 16px; border: 1px solid rgba(255,255,255,0.18); backdrop-filter: blur(10px); }
.mini-form__form input, .mini-form__form select { padding: 16px 18px; border: 0; background: var(--blanc); color: var(--txt); border-radius: 10px; font-family: inherit; font-size: 15px; font-weight: 500; outline: 0; min-width: 0; }
.mini-form__form input::placeholder { color: var(--txt-soft); }
.mini-form__form input:focus, .mini-form__form select:focus { box-shadow: 0 0 0 3px rgba(252,201,48,0.5); }
.mini-form__form button { background: var(--rouge); color: var(--blanc); padding: 16px 28px; border-radius: 10px; font-family: inherit; font-weight: 800; font-size: 15px; border: 0; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px; transition: all 280ms var(--ease); white-space: nowrap; box-shadow: 0 4px 16px rgba(0,0,0,0.15); }
.mini-form__form button:hover { background: var(--rouge-dark); transform: translateY(-2px); box-shadow: 0 12px 28px -8px rgba(230,45,51,0.7); }
.mini-form__trust { display: flex; gap: 28px; flex-wrap: wrap; justify-content: center; margin-top: 22px; font-size: 13px; opacity: 0.92; font-weight: 500; }
.mini-form__trust span { display: inline-flex; align-items: center; gap: 6px; }
.mini-form__trust span::before { content: "✓"; color: var(--jaune); font-weight: 900; }

.devis-form__trust { margin: 16px 0 0; padding-top: 14px; border-top: 1px solid var(--gray-border); }
.devis-form__trust-badges { display: flex; gap: 6px; justify-content: center; margin-bottom: 8px; }
.devis-form__trust-badges img { height: 28px; width: auto; object-fit: contain; }
.devis-form__trust-text { text-align: center; font-size: 11px; color: var(--txt-soft); font-weight: 600; line-height: 1.4; }

.hero__quick { display: flex; align-items: center; gap: 16px; font-size: 13px; color: var(--txt-soft); flex-wrap: wrap; }
.hero__quick-item { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.hero__quick-item svg { width: 16px; height: 16px; color: var(--indigo); }
.hero__visual { position: relative; }
.hero__img { border-radius: 20px; overflow: hidden; aspect-ratio: 5/6; box-shadow: 0 24px 60px -20px rgba(0,0,0,0.18); }
.hero__img img { width: 100%; height: 100%; object-fit: cover; }
.hero__badge { position: absolute; top: -16px; right: -16px; background: var(--jaune); color: var(--txt); padding: 14px 20px; border-radius: 14px; box-shadow: 0 12px 30px rgba(0,0,0,0.15); font-family: var(--f-h); font-weight: 900; text-align: center; line-height: 1.2; }
.hero__badge small { display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; opacity: 0.85; margin-bottom: 2px; }
.hero__badge strong { display: block; font-size: 22px; }
.hero__rating { position: absolute; bottom: -20px; left: -20px; background: var(--blanc); border-radius: 14px; box-shadow: 0 12px 30px rgba(0,0,0,0.12); padding: 14px 18px; display: flex; align-items: center; gap: 12px; }
.hero__rating-stars { color: var(--jaune); font-size: 16px; letter-spacing: 2px; }
.hero__rating-text { font-size: 12px; color: var(--txt-soft); line-height: 1.3; }
.hero__rating-text strong { display: block; font-family: var(--f-h); font-weight: 900; color: var(--txt); font-size: 16px; }

/* ============ TRUST STRIP ============ */
.trust-strip { background: var(--indigo-pale); padding: 28px 0; }
.trust-strip__inner { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; align-items: center; }
.trust-item { display: flex; align-items: center; gap: 14px; }
.trust-item__icon { flex-shrink: 0; width: 48px; height: 48px; background: var(--blanc); border-radius: 12px; display: flex; align-items: center; justify-content: center; color: var(--indigo); }
.trust-item__icon svg { width: 26px; height: 26px; }
.trust-item__text { font-size: 13px; line-height: 1.4; color: var(--txt); }
.trust-item__text strong { display: block; font-family: var(--f-h); font-size: 16px; font-weight: 900; color: var(--txt); }

/* ============ 3 CARDS CONVERSION ============ */
.conv-cards { padding: 80px 0; background: var(--blanc); }
.conv-cards__header { text-align: center; max-width: 700px; margin: 0 auto 48px; }
.conv-cards__label { display: inline-block; font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 12px; }
.conv-cards__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.conv-card { background: var(--blanc); border: 2px solid var(--indigo-pale); border-radius: 20px; padding: 32px 28px; transition: all 320ms var(--ease); position: relative; display: flex; flex-direction: column; }
.conv-card:hover { border-color: var(--indigo); transform: translateY(-4px); box-shadow: 0 20px 40px -16px rgba(72,84,245,0.18); }
.conv-card__icon { width: 48px; height: 48px; background: var(--indigo); color: var(--blanc); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; }
.conv-card__icon svg { width: 24px; height: 24px; }
.conv-card__q { font-family: var(--f-h); font-weight: 700; font-size: 18px; color: var(--txt); margin-bottom: 12px; line-height: 1.3; }
.conv-card__a { font-size: 14px; color: var(--txt-soft); line-height: 1.7; flex: 1; margin-bottom: 18px; }
.conv-card__a strong { color: var(--txt); }
.conv-card__link { color: var(--indigo); font-weight: 700; font-size: 14px; display: inline-flex; align-items: center; gap: 6px; transition: gap 220ms var(--ease); }
.conv-card__link:hover { gap: 10px; }

/* ============ SECTION INFO (fonctionnement / autoconso / batterie) ============ */
.info { padding: 70px 0; background: var(--blanc); }
.info--alt { background: var(--indigo-pale); }
.info__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; max-width: 1100px; margin: 0 auto; }
.info__inner--reverse { direction: rtl; }
.info__inner--reverse > * { direction: ltr; }
.info__label { font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 14px; }
.info__title { text-align: left; margin-bottom: 16px; }
.info__lead { font-size: 16px; color: var(--txt); margin-bottom: 18px; line-height: 1.6; }
.info__lead strong { color: var(--indigo); font-weight: 700; }
.info__list { list-style: none; padding: 0; margin: 0 0 20px; display: flex; flex-direction: column; gap: 10px; }
.info__list li { display: flex; gap: 10px; font-size: 14.5px; line-height: 1.55; }
.info__list li::before { content: ""; flex-shrink: 0; width: 8px; height: 8px; border-radius: 50%; background: var(--indigo); margin-top: 8px; }
.info__list strong { color: var(--txt); font-weight: 700; }
.info__img { border-radius: 18px; overflow: hidden; aspect-ratio: 4/3; box-shadow: 0 16px 40px -16px rgba(0,0,0,0.16); }
.info__img img { width: 100%; height: 100%; object-fit: cover; }
.info__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 18px; }
.info-stat { background: var(--blanc); border-radius: 12px; padding: 16px 12px; text-align: center; border: 1px solid var(--gray-border); }
.info-stat__value { font-family: var(--f-h); font-weight: 900; font-size: 22px; color: var(--indigo); line-height: 1.1; }
.info-stat__label { font-size: 11px; color: var(--txt-soft); text-transform: uppercase; letter-spacing: 0.08em; font-weight: 600; margin-top: 6px; }

/* Comparatif tableau 2 colonnes (autoconso vs surimposition) */
.compare { padding: 80px 0; background: var(--indigo-pale); }
.compare__header { text-align: center; max-width: 700px; margin: 0 auto 40px; }
.compare__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; max-width: 1000px; margin: 0 auto; }
.compare-card { background: var(--blanc); border-radius: 18px; padding: 32px 28px; box-shadow: 0 8px 24px rgba(0,0,0,0.05); }
.compare-card--featured { border: 2px solid var(--indigo); position: relative; }
.compare-card__badge { position: absolute; top: -12px; left: 24px; background: var(--indigo); color: var(--blanc); font-size: 11px; font-weight: 700; padding: 4px 12px; border-radius: 999px; text-transform: uppercase; letter-spacing: 0.08em; }
.compare-card__title { font-family: var(--f-h); font-weight: 900; font-size: 20px; color: var(--txt); margin-bottom: 6px; }
.compare-card__sub { font-size: 13px; color: var(--txt-soft); margin-bottom: 18px; text-transform: uppercase; letter-spacing: 0.08em; font-weight: 600; }
.compare-card__desc { font-size: 14.5px; color: var(--txt); line-height: 1.6; margin-bottom: 16px; }
.compare-card__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; font-size: 14px; }
.compare-card__list li { display: flex; gap: 10px; align-items: flex-start; }
.compare-card__list li::before { content: "✓"; color: var(--indigo); font-weight: 900; flex-shrink: 0; margin-top: 1px; }

/* ============ PRIX TABLE ============ */
.models { padding: 80px 0; background: var(--blanc); }
.models__header { text-align: center; max-width: 700px; margin: 0 auto 40px; }
.models__intro { color: var(--txt-soft); font-size: 16px; }
.models__table { background: var(--blanc); border-radius: 20px; overflow: hidden; box-shadow: 0 8px 24px rgba(0,0,0,0.06); margin-bottom: 24px; border: 1px solid var(--gray-border); }
.models__row { display: grid; grid-template-columns: 1fr 1.1fr 1fr 1.1fr 1.1fr; gap: 0; padding: 20px 24px; border-bottom: 1px solid var(--gray-border); align-items: center; }
.models__row:last-child { border-bottom: 0; }
.models__row--head { background: var(--gray-soft); font-family: var(--f-h); font-weight: 700; font-size: 13px; color: var(--txt-soft); text-transform: uppercase; letter-spacing: 0.1em; }
.models__row--head > div { padding-right: 8px; }
.models__model { font-family: var(--f-h); font-weight: 700; color: var(--txt); }
.models__model small { display: block; font-size: 12px; color: var(--txt-soft); font-weight: 500; margin-top: 2px; }
.models__capacity { font-weight: 600; color: var(--txt); }
.models__people { font-size: 13px; color: var(--txt-soft); }
.models__price { font-family: var(--f-h); font-weight: 900; color: var(--indigo); font-size: 18px; }
.models__price small { display: block; font-size: 11px; color: var(--txt-soft); font-weight: 500; margin-top: 2px; letter-spacing: 0; }
.models__price-final { font-family: var(--f-h); font-weight: 900; color: var(--rouge); font-size: 20px; }
.models__price-final small { display: block; font-size: 11px; color: var(--txt-soft); font-weight: 500; margin-top: 2px; }
.models__note { text-align: center; font-size: 13px; color: var(--txt-soft); font-style: italic; margin-bottom: 32px; }
.models__cta { text-align: center; }

/* ============ CALCULATEUR AIDES ============ */
.calc { padding: 80px 0; background: var(--indigo-pale); }
.calc__inner { max-width: 900px; margin: 0 auto; background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); border-radius: 24px; padding: 48px; color: var(--blanc); position: relative; overflow: hidden; }
.calc__inner::before { content: ""; position: absolute; top: -100px; right: -100px; width: 280px; height: 280px; background: rgba(252,201,48,0.15); border-radius: 50%; }
.calc__header { text-align: center; margin-bottom: 32px; position: relative; }
.calc__label { display: inline-block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--jaune); margin-bottom: 12px; padding: 6px 14px; background: rgba(252,201,48,0.15); border-radius: 999px; }
.calc__header h2 { color: var(--blanc); margin-bottom: 8px; }
.calc__header p { opacity: 0.92; }
.calc__form { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; margin-bottom: 24px; position: relative; }
.calc__field label { display: block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 8px; opacity: 0.9; }
.calc__field select { width: 100%; padding: 14px 16px; background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.25); color: var(--blanc); border-radius: 10px; font-family: inherit; font-size: 14px; backdrop-filter: blur(8px); appearance: none; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fcc930'><path d='M7 10l5 5 5-5z'/></svg>"); background-repeat: no-repeat; background-position: right 12px center; background-size: 20px; padding-right: 40px; cursor: pointer; }
.calc__field select option { color: var(--txt); background: var(--blanc); }
.calc__result { background: rgba(255,255,255,0.15); backdrop-filter: blur(12px); border-radius: 16px; padding: 24px 28px; display: grid; grid-template-columns: 1fr auto; gap: 20px; align-items: center; position: relative; border: 1px solid rgba(255,255,255,0.2); }
.calc__result--double { display: grid; grid-template-columns: 1fr auto 1fr; gap: 24px; padding: 28px 32px; }
.calc__result-block { display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: center; }
.calc__result-divider { width: 1px; background: rgba(255,255,255,0.25); align-self: stretch; }
.calc__result-text { font-size: 14px; opacity: 0.95; line-height: 1.45; }
.calc__result-text strong { display: block; font-weight: 700; margin-bottom: 4px; color: var(--blanc); }
.calc__result-amount { font-family: var(--f-h); font-weight: 900; font-size: 32px; color: var(--jaune); line-height: 1; letter-spacing: -0.02em; white-space: nowrap; }
.calc__result-amount small { display: block; font-size: 11px; font-weight: 600; opacity: 0.7; text-transform: uppercase; letter-spacing: 0.1em; margin-top: 4px; color: var(--blanc); }
.calc__cta { text-align: center; margin-top: 24px; position: relative; }
.calc__cta .btn-primary { background: var(--jaune); color: var(--txt); }
.calc__cta .btn-primary:hover { background: var(--blanc); color: var(--indigo); }
.calc__note { position: relative; margin-top: 18px; font-size: 12.5px; opacity: 0.9; text-align: center; line-height: 1.5; padding: 12px 16px; background: rgba(0,0,0,0.15); border-radius: 10px; border-left: 3px solid var(--jaune); }
.calc__note strong { color: var(--jaune); font-weight: 700; }

/* ============ MARQUES (4 cards) ============ */
.brands { padding: 80px 0; background: var(--blanc); }
.brands__header { text-align: center; max-width: 700px; margin: 0 auto 40px; }
.brands__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.brand-card { background: var(--blanc); border: 2px solid var(--indigo-pale); border-radius: 18px; padding: 28px 22px; transition: all 320ms var(--ease); display: flex; flex-direction: column; }
.brand-card:hover { border-color: var(--indigo); transform: translateY(-4px); box-shadow: 0 20px 40px -16px rgba(72,84,245,0.18); }
.brand-card__flag { display: inline-block; font-size: 11px; font-weight: 700; color: var(--blanc); background: var(--indigo); padding: 4px 10px; border-radius: 999px; margin-bottom: 12px; text-transform: uppercase; letter-spacing: 0.08em; align-self: flex-start; }
.brand-card__flag--fr { background: var(--rouge); }
.brand-card__name { font-family: var(--f-h); font-weight: 900; font-size: 18px; color: var(--txt); margin-bottom: 4px; }
.brand-card__model { font-size: 13px; color: var(--txt-soft); margin-bottom: 14px; font-weight: 600; }
.brand-card__desc { font-size: 13.5px; color: var(--txt); line-height: 1.55; margin-bottom: 14px; flex: 1; }
.brand-card__specs { font-size: 12px; color: var(--txt-soft); border-top: 1px solid var(--gray-border); padding-top: 12px; line-height: 1.6; }
.brand-card__specs strong { color: var(--indigo); font-weight: 700; }

/* ============ CAS CLIENT ============ */
.case { padding: 80px 0; background: var(--indigo-pale); }

/* ============ CROSS-SELL : Cumul solutions énergétiques (3 cards horizontales) ============ */
.cross-sell { padding: 80px 0; background: var(--gray-soft); }
.cross-sell__header { text-align: center; max-width: 720px; margin: 0 auto 40px; }
.cross-sell__lead { font-size: 15px; color: var(--txt-soft); line-height: 1.6; margin-top: 12px; }
.cross-sell__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.cross-card { background: var(--blanc); border: 2px solid var(--gray-border); border-radius: 18px; padding: 28px 24px; text-decoration: none; color: var(--txt); transition: all 320ms var(--ease); display: flex; flex-direction: column; }
.cross-card:hover { border-color: var(--indigo); transform: translateY(-4px); box-shadow: 0 20px 40px -16px rgba(72,84,245,0.2); }
.cross-card__icon { width: 52px; height: 52px; background: var(--indigo-pale); color: var(--indigo); border-radius: 14px; display: flex; align-items: center; justify-content: center; margin-bottom: 16px; transition: all 320ms var(--ease); }
.cross-card:hover .cross-card__icon { background: var(--indigo); color: var(--blanc); }
.cross-card__icon svg { width: 28px; height: 28px; }
.cross-card__title { font-family: var(--f-h); font-weight: 700; font-size: 17px; color: var(--txt); margin-bottom: 8px; }
.cross-card__desc { font-size: 14px; color: var(--txt-soft); line-height: 1.6; flex: 1; margin-bottom: 16px; }
.cross-card__desc strong { color: var(--rouge); font-weight: 700; }
.cross-card__link { display: inline-flex; align-items: center; gap: 6px; color: var(--indigo); font-weight: 700; font-size: 14px; transition: gap 220ms var(--ease); }
.cross-card:hover .cross-card__link { gap: 10px; }
.cross-sell__note { text-align: center; margin-top: 32px; font-size: 14px; color: var(--txt-soft); padding: 14px 22px; background: var(--blanc); border-radius: 999px; max-width: 640px; margin-left: auto; margin-right: auto; border: 1px solid var(--gray-border); }
.cross-sell__note strong { color: var(--rouge); font-weight: 800; }

/* ============ STORAGE : Layout dashboard différencié (batterie visuelle gauche / contenu droite) ============ */
.storage { padding: 80px 0; background: var(--blanc); }
.storage__grid { display: grid; grid-template-columns: 380px 1fr; gap: 64px; align-items: center; }
.storage__viz { position: relative; background: var(--gray-soft); border-radius: 24px; padding: 48px 32px; box-shadow: 0 16px 40px -16px rgba(0,0,0,0.12); border: 1px solid var(--gray-border); }
.storage__battery { position: relative; width: 200px; height: 320px; margin: 0 auto; border: 6px solid var(--indigo); border-radius: 18px; overflow: hidden; background: var(--blanc); }
.storage__battery::before { content: ""; position: absolute; top: -16px; left: 50%; transform: translateX(-50%); width: 64px; height: 12px; background: var(--indigo); border-radius: 6px 6px 0 0; }
.storage__charge { position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(180deg, var(--jaune), var(--indigo)); transition: height 800ms var(--ease); display: flex; align-items: center; justify-content: center; color: var(--blanc); font-family: var(--f-h); font-weight: 900; font-size: 36px; letter-spacing: -0.02em; }
.storage__legend { margin-top: 28px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; text-align: center; }
.storage__legend div { padding: 10px 8px; background: var(--blanc); border-radius: 10px; border: 1px solid var(--gray-border); }
.storage__legend strong { display: block; font-family: var(--f-h); font-size: 13px; color: var(--indigo); font-weight: 900; margin-bottom: 2px; }
.storage__legend span { font-size: 11px; color: var(--txt-soft); font-weight: 600; }
.storage__title { text-align: left; }
.storage__brands { list-style: none; padding: 0; margin: 20px 0 24px; display: grid; gap: 10px; }
.storage__brands li { padding: 12px 16px; background: var(--gray-soft); border-radius: 10px; border-left: 3px solid var(--indigo); }
.storage__brands strong { display: block; font-family: var(--f-h); font-weight: 700; color: var(--txt); margin-bottom: 2px; font-size: 14.5px; }
.storage__brands small { font-size: 12.5px; color: var(--txt-soft); line-height: 1.45; }
.storage__cta { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.storage__note { font-size: 12.5px; color: var(--txt-soft); font-weight: 600; }

/* ============ CASE-V2 : Layout immersif hero plein écran + timeline numérotée ============ */
.case-v2 { padding: 0 0 80px; background: var(--indigo-pale); }
.case-v2__hero { position: relative; height: 540px; overflow: hidden; }
.case-v2__hero img { width: 100%; height: 100%; object-fit: cover; display: block; }
.case-v2__overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0.4) 50%, rgba(15,16,46,0.92) 100%); color: var(--blanc); display: flex; flex-direction: column; justify-content: flex-end; padding: 48px 0; }
.case-v2__chip { display: inline-block; background: var(--rouge); padding: 7px 16px; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; align-self: flex-start; margin-bottom: 16px; }
.case-v2__title { color: var(--blanc) !important; text-align: left !important; font-size: clamp(26px, 3.4vw, 40px) !important; margin: 0 0 14px !important; max-width: 760px; line-height: 1.2; }
.case-v2__sub { font-size: 15px; opacity: 0.92; margin: 0 0 26px; max-width: 680px; line-height: 1.5; }
.case-v2__stats { display: flex; gap: 56px; flex-wrap: wrap; }
.case-v2__stats div { display: flex; flex-direction: column; min-width: 100px; }
.case-v2__stats strong { font-family: var(--f-h); font-size: 44px; font-weight: 900; color: var(--jaune); line-height: 1; letter-spacing: -0.02em; }
.case-v2__stats span { font-size: 12px; opacity: 0.88; text-transform: uppercase; letter-spacing: 0.1em; margin-top: 6px; }
.case-v2__body { padding-top: 56px; max-width: 980px; }
.case-v2__quote { background: var(--blanc); border-radius: 20px; padding: 36px 40px; box-shadow: 0 12px 32px -16px rgba(0,0,0,0.12); margin-bottom: 48px; position: relative; }
.case-v2__quote svg { color: var(--indigo-pale); position: absolute; top: 20px; left: 24px; }
.case-v2__quote p { font-size: 17px; line-height: 1.7; color: var(--txt); margin: 0 0 16px; font-style: italic; padding-left: 48px; }
.case-v2__quote cite { font-style: normal; font-size: 14px; color: var(--txt-soft); padding-left: 48px; display: block; }
.case-v2__quote cite strong { color: var(--txt); }
.case-v2__timeline { list-style: none; padding: 0; margin: 0 0 32px; position: relative; }
.case-v2__timeline::before { content: ""; position: absolute; left: 24px; top: 8px; bottom: 8px; width: 3px; background: linear-gradient(180deg, var(--indigo), var(--indigo-pale)); border-radius: 2px; }
.case-v2__timeline li { position: relative; padding: 14px 0 14px 78px; min-height: 64px; display: flex; align-items: center; gap: 0; }
.case-v2__step { position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 56px; height: 56px; background: var(--blanc); color: var(--indigo); border: 3px solid var(--indigo); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: var(--f-h); font-weight: 900; font-size: 13px; box-shadow: 0 6px 16px rgba(72,84,245,0.18); z-index: 2; }
.case-v2__timeline li div { font-size: 14.5px; line-height: 1.55; color: var(--txt-soft); }
.case-v2__timeline li b { display: block; font-family: var(--f-h); font-weight: 700; color: var(--txt); font-size: 15.5px; margin-bottom: 2px; }
.case-v2__more { text-align: center; margin-top: 24px; }
.case-v2__more a { display: inline-flex; align-items: center; gap: 8px; color: var(--indigo); font-weight: 700; font-size: 14.5px; }

@media (max-width:900px) {
  .storage__grid { grid-template-columns: 1fr; gap: 32px; }
  .storage__viz { padding: 32px 20px; }
  .storage__cta { flex-direction: column; align-items: stretch; }
  .case-v2__hero { height: 460px; }
  .case-v2__overlay { padding: 24px 0; }
  .case-v2__stats { gap: 24px; }
  .case-v2__stats strong { font-size: 32px; }
  .case-v2__quote { padding: 28px 22px; }
  .case-v2__quote p, .case-v2__quote cite { padding-left: 0; }
  .case-v2__quote svg { display: none; }
  .case-v2__step { width: 44px; height: 44px; font-size: 11px; }
  .case-v2__timeline li { padding-left: 60px; }
  .case-v2__timeline::before { left: 20px; }
}
.case__inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; }
.case__media { position: relative; }
.case__img { border-radius: 20px; overflow: hidden; aspect-ratio: 4/3; box-shadow: 0 16px 40px -16px rgba(0,0,0,0.18); }
.case__img img { width: 100%; height: 100%; object-fit: cover; }
.case__chip { position: absolute; top: 20px; left: 20px; background: var(--rouge); color: var(--blanc); padding: 6px 14px; border-radius: 999px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; }
.case__label { font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 14px; }
.case__title { text-align: left; margin-bottom: 18px; }
.case__quote { font-size: 17px; color: var(--txt); font-style: italic; line-height: 1.6; margin-bottom: 20px; padding-left: 20px; border-left: 3px solid var(--indigo); }
.case__author { font-size: 14px; color: var(--txt-soft); margin-bottom: 28px; }
.case__author strong { color: var(--txt); }
.case__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.case-stat { background: var(--blanc); border-radius: 12px; padding: 18px 16px; text-align: center; }
.case-stat__value { font-family: var(--f-h); font-weight: 900; font-size: 26px; color: var(--indigo); line-height: 1; }
.case-stat__label { font-size: 11px; color: var(--txt-soft); text-transform: uppercase; letter-spacing: 0.1em; font-weight: 600; margin-top: 8px; }

/* ============ POURQUOI NOUS ============ */
.why { padding: 80px 0; background: var(--blanc); }
.why__header { text-align: center; max-width: 700px; margin: 0 auto 48px; }
.why__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.why-pillar { background: var(--blanc); border: 1px solid var(--gray-border); border-radius: 20px; padding: 28px 24px; text-align: center; transition: all 320ms var(--ease); }
.why-pillar:hover { border-color: var(--indigo); transform: translateY(-4px); box-shadow: 0 20px 40px -16px rgba(72,84,245,0.15); }
.why-pillar__icon { width: 56px; height: 56px; background: var(--indigo); color: var(--blanc); border-radius: 50%; margin: 0 auto 16px; display: flex; align-items: center; justify-content: center; transition: background 320ms var(--ease); }
.why-pillar:hover .why-pillar__icon { background: var(--rouge); }
.why-pillar__icon svg { width: 26px; height: 26px; }
.why-pillar__title { font-family: var(--f-h); font-weight: 700; font-size: 16px; color: var(--txt); margin-bottom: 8px; }
.why-pillar__desc { font-size: 13px; color: var(--txt-soft); line-height: 1.55; }

/* ============ TÉMOIGNAGES ============ */
.testimonials { padding: 80px 0; background: var(--indigo-pale); }
.testimonials__header { text-align: center; margin-bottom: 32px; }
.testimonials__rating-bar { display: inline-flex; align-items: center; gap: 14px; background: var(--blanc); padding: 12px 22px; border-radius: 999px; box-shadow: 0 6px 20px rgba(0,0,0,0.06); margin-bottom: 18px; }
.testimonials__rating-bar img { height: 22px; width: auto; }
.testimonials__rating-stars { color: var(--jaune); font-size: 18px; letter-spacing: 2px; }
.testimonials__rating-val { font-family: var(--f-h); font-weight: 900; font-size: 18px; color: var(--txt); }
.testimonials__rating-count { font-size: 13px; color: var(--txt-soft); font-weight: 600; }
.trustindex-widget { background: var(--blanc); border-radius: 20px; padding: 32px; box-shadow: 0 8px 24px rgba(0,0,0,0.06); margin-bottom: 24px; min-height: 280px; display: flex; align-items: center; justify-content: center; text-align: center; color: var(--txt-soft); font-size: 14px; }
.trustindex-widget__placeholder { padding: 40px 20px; border: 2px dashed var(--gray-border); border-radius: 12px; }
.trustindex-widget__placeholder strong { display: block; font-family: var(--f-h); font-weight: 700; color: var(--txt); margin-bottom: 6px; }

/* ============ ZONE GEO ============ */
.geo { padding: 80px 0; background: var(--blanc); }
.geo__inner { display: grid; grid-template-columns: 1fr 1.2fr; gap: 48px; align-items: center; }
.geo__label { font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 14px; }
.geo__title { text-align: left; margin-bottom: 18px; }
.geo__desc { color: var(--txt); font-size: 15px; margin-bottom: 24px; }
.geo__map { background: var(--gray-soft); border-radius: 20px; padding: 32px; }
.geo__map h3 { font-size: 14px; margin-bottom: 16px; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.1em; font-weight: 700; }
.geo__cities { display: flex; flex-wrap: wrap; gap: 8px; }
.geo-city { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; background: var(--blanc); color: var(--indigo); border-radius: 999px; font-size: 13px; font-weight: 600; transition: all 220ms var(--ease); border: 1px solid var(--gray-border); }
.geo-city:hover { background: var(--indigo); color: var(--blanc); transform: translateY(-2px); border-color: var(--indigo); }
.geo-city::before { content: "📍"; font-size: 11px; }

/* ============ TIMELINE ============ */
.timeline { padding: 80px 0; background: var(--indigo-pale); }
.timeline__header { text-align: center; margin-bottom: 48px; }
.timeline__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; max-width: 1100px; margin: 0 auto; position: relative; }
.timeline__grid::before { content: ""; position: absolute; top: 38px; left: 10%; right: 10%; height: 2px; background: repeating-linear-gradient(90deg, var(--indigo) 0 8px, transparent 8px 16px); z-index: 0; }
.timeline-step { text-align: center; position: relative; z-index: 1; }
.timeline-step__day { display: inline-block; font-family: var(--f-h); font-weight: 900; font-size: 13px; color: var(--blanc); background: var(--indigo); padding: 5px 12px; border-radius: 999px; margin-bottom: 12px; letter-spacing: 0.05em; }
.timeline-step__icon { width: 76px; height: 76px; border-radius: 50%; background: var(--blanc); display: flex; align-items: center; justify-content: center; margin: 0 auto 14px; color: var(--indigo); box-shadow: 0 6px 16px rgba(72,84,245,0.15); }
.timeline-step__icon svg { width: 32px; height: 32px; }
.timeline-step__title { font-family: var(--f-h); font-weight: 700; font-size: 15px; color: var(--txt); margin-bottom: 4px; }
.timeline-step__desc { font-size: 13px; color: var(--txt-soft); line-height: 1.5; }

/* ============ FAQ ============ */
.faq { padding: 80px 0; background: var(--blanc); }
.faq__header { text-align: center; max-width: 700px; margin: 0 auto 48px; }
.faq__list { max-width: 1000px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items: start; }
.faq__item { background: var(--blanc); border: 1px solid var(--gray-border); border-radius: 12px; overflow: hidden; transition: all 280ms var(--ease); }
.faq__item:hover { border-color: var(--indigo); box-shadow: 0 8px 20px -10px rgba(72,84,245,0.25); }
.faq__item[data-open] { border-color: var(--indigo); background: var(--indigo-pale); }
.faq__trigger { width: 100%; background: none; border: 0; text-align: left; padding: 18px 22px; font-family: inherit; font-size: 15px; font-weight: 700; color: var(--txt); display: flex; justify-content: space-between; align-items: center; cursor: pointer; gap: 14px; line-height: 1.35; }
.faq__item[data-open] .faq__trigger { color: var(--indigo); }
.faq__trigger::after { content: ''; width: 26px; height: 26px; flex-shrink: 0; background: var(--indigo-pale); border-radius: 50%; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%234854f5'><path d='M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z'/></svg>"); background-repeat: no-repeat; background-position: center; background-size: 16px; transition: all 220ms var(--ease); }
.faq__trigger[aria-expanded="true"]::after { background-color: var(--indigo); background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fcc930'><path d='M19 13H5v-2h14v2z'/></svg>"); }
.faq__panel { padding: 0 22px 18px; color: var(--txt-soft); display: none; line-height: 1.65; font-size: 13.5px; }
.faq__panel.is-open { display: block; }
.faq__panel p { margin-bottom: 8px; }
.faq__panel strong { color: var(--txt); }

/* ============ CTA FINAL ============ */
.final-cta { padding: 80px 0; background: var(--blanc); }
.final-cta__inner { display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); border-radius: 24px; padding: 48px; color: var(--blanc); position: relative; overflow: hidden; align-items: center; }
.final-cta__inner::before { content: ""; position: absolute; top: -100px; right: -100px; width: 300px; height: 300px; background: rgba(252,201,48,0.15); border-radius: 50%; }
.final-cta__inner::after { content: ""; position: absolute; bottom: -80px; left: -80px; width: 250px; height: 250px; background: rgba(230,45,51,0.15); border-radius: 50%; }
.final-cta__content { position: relative; z-index: 2; }
.final-cta__label { display: inline-block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--jaune); margin-bottom: 14px; padding: 6px 14px; background: rgba(252,201,48,0.15); border-radius: 999px; }
.final-cta h2 { color: var(--blanc); text-align: left; margin-bottom: 16px; }
.final-cta__sub { font-size: 16px; opacity: 0.92; margin-bottom: 24px; }
.final-cta__contact { display: flex; flex-direction: column; gap: 14px; font-size: 14px; }
.final-cta__contact-item { display: flex; gap: 12px; align-items: flex-start; }
.final-cta__contact-item svg { width: 20px; height: 20px; flex-shrink: 0; color: var(--jaune); margin-top: 2px; }
.final-cta__contact-item strong { display: block; font-weight: 700; }
.devis-form { position: relative; z-index: 2; background: var(--blanc); border-radius: 18px; padding: 28px; color: var(--txt); box-shadow: 0 20px 50px rgba(0,0,0,0.2); }
.devis-form h3 { font-family: var(--f-h); font-weight: 900; font-size: 20px; color: var(--txt); margin-bottom: 6px; text-align: left; }
.devis-form__intro { font-size: 13px; color: var(--txt-soft); margin-bottom: 18px; }
.devis-form__field { margin-bottom: 12px; }
.devis-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.devis-form input, .devis-form select, .devis-form textarea { width: 100%; padding: 12px 14px; border: 1px solid var(--gray-border); border-radius: 8px; font-family: inherit; font-size: 14px; color: var(--txt); background: var(--blanc); transition: border-color 220ms var(--ease); }
.devis-form input:focus, .devis-form select:focus, .devis-form textarea:focus { outline: 0; border-color: var(--indigo); }
.devis-form textarea { min-height: 80px; resize: vertical; }
.devis-form__rgpd-text { font-size: 11px; color: var(--txt-soft); margin: 12px 0 0; line-height: 1.45; text-align: center; }
.devis-form__rgpd-text a { color: var(--indigo); text-decoration: underline; }
.devis-form__btn { width: 100%; background: var(--rouge); color: var(--blanc); padding: 14px 20px; border-radius: 8px; font-family: inherit; font-weight: 700; font-size: 15px; border: 0; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 10px; transition: all 280ms var(--ease); }
.devis-form__btn:hover { background: var(--rouge-dark); transform: translateY(-2px); box-shadow: 0 10px 24px -10px rgba(230,45,51,0.5); }

/* ============ FOOTER ============ */
.footer { background: var(--blanc); padding: 0; border-top: 1px solid var(--gray-border); }
.footer-newsletter { background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); padding: 48px 0; color: var(--blanc); position: relative; overflow: hidden; }
.footer-newsletter::before { content: ""; position: absolute; top: -80px; right: -80px; width: 250px; height: 250px; background: rgba(252,201,48,0.12); border-radius: 50%; }
.footer-newsletter__inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; position: relative; z-index: 2; }
.footer-newsletter h3 { color: var(--blanc); font-size: 26px; margin-bottom: 8px; }
.footer-newsletter p { opacity: 0.9; font-size: 15px; margin: 0; }
.footer-newsletter__form { display: flex; gap: 8px; background: var(--blanc); padding: 6px; border-radius: 999px; }
.footer-newsletter__form input { flex: 1; border: 0; background: transparent; padding: 12px 18px; font-family: inherit; font-size: 14px; color: var(--txt); outline: none; }
.footer-newsletter__form button { background: var(--rouge); color: var(--blanc); padding: 12px 24px; border: 0; border-radius: 999px; font-family: inherit; font-weight: 700; font-size: 14px; cursor: pointer; transition: background 220ms var(--ease); display: inline-flex; align-items: center; gap: 8px; }
.footer-newsletter__form button:hover { background: var(--rouge-dark); }

.footer-main { padding: 64px 0 32px; }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: 56px; padding-bottom: 40px; border-bottom: 1px solid var(--gray-border); }
.footer-col h4 { font-family: var(--f-h); font-size: 13px; font-weight: 700; color: var(--txt); margin-bottom: 18px; text-transform: uppercase; letter-spacing: 0.12em; padding-bottom: 10px; border-bottom: 2px solid var(--indigo); display: inline-block; }
.footer-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.footer-col ul a { font-size: 14px; color: var(--txt-soft); transition: all 220ms var(--ease); display: inline-flex; align-items: center; gap: 6px; }
.footer-col ul a:hover { color: var(--indigo); transform: translateX(4px); }
.footer-col ul a::before { content: "›"; color: var(--indigo); font-weight: 900; }

.footer-brand__logo img { height: 72px; margin-bottom: 16px; }
.footer-brand__tagline { color: var(--txt-soft); font-size: 14px; line-height: 1.6; margin-bottom: 20px; max-width: 32ch; }
.footer-nap { font-style: normal; font-size: 14px; color: var(--txt); margin-bottom: 18px; }
.footer-nap p { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 8px; line-height: 1.5; }
.footer-nap p svg { width: 16px; height: 16px; color: var(--indigo); flex-shrink: 0; margin-top: 2px; }
.footer-nap strong { display: block; font-weight: 700; color: var(--txt); }
.footer-nap a { color: var(--txt); font-weight: 600; }
.footer-nap a:hover { color: var(--indigo); }

.footer-rge { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.footer-rge img { width: 100%; height: auto; max-height: 70px; object-fit: contain; background: var(--blanc); border-radius: 8px; padding: 8px; border: 1px solid var(--gray-border); }
.footer-rge__note { grid-column: 1 / -1; font-size: 11px; color: var(--txt-soft); margin-top: 6px; text-align: center; line-height: 1.4; }

.footer-bottom { padding-top: 24px; display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; }
.footer-bottom__socials { display: flex; gap: 12px; list-style: none; padding: 0; margin: 0; }
.footer-bottom__socials a { width: 36px; height: 36px; border-radius: 50%; background: var(--gray-soft); display: inline-flex; align-items: center; justify-content: center; color: var(--indigo); transition: all 220ms var(--ease); border: 1px solid var(--gray-border); }
.footer-bottom__socials a:hover { background: var(--indigo); color: var(--blanc); transform: translateY(-2px); border-color: var(--indigo); }
.footer-bottom__socials svg { width: 16px; height: 16px; }
.footer-bottom__hours { font-size: 13px; color: var(--txt-soft); display: inline-flex; align-items: center; gap: 8px; }
.footer-bottom__hours svg { width: 14px; height: 14px; color: var(--indigo); }

.subfooter { background: #1a1a1a; color: var(--blanc); padding: 18px 0; font-size: 12.5px; }
.subfooter__inner { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.subfooter__legal { display: flex; gap: 16px; flex-wrap: wrap; }
.subfooter a { color: rgba(255,255,255,0.85); transition: color 220ms; }
.subfooter a:hover { color: var(--jaune); }
.subfooter__rankit { color: rgba(255,255,255,0.85); }
.subfooter__rankit strong { color: var(--jaune); }

/* Sticky mobile */
.sticky-mobile { display: none; position: fixed; bottom: 0; left: 0; right: 0; background: var(--blanc); padding: 10px; gap: 8px; z-index: 99; box-shadow: 0 -4px 16px rgba(0,0,0,0.1); }
.sticky-mobile a { flex: 1; text-align: center; padding: 10px 8px; border-radius: 6px; font-weight: 700; font-size: 13px; line-height: 1.2; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.sticky-mobile a small { font-size: 10px; font-weight: 500; opacity: 0.95; text-transform: uppercase; letter-spacing: 0.04em; }
.sticky-mobile__tel { background: #25D366; color: var(--blanc); }
.sticky-mobile__devis { background: var(--rouge); color: var(--blanc); }

.reveal { opacity: 0; transform: translateY(24px); transition: opacity 600ms var(--ease), transform 600ms var(--ease); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 1080px) {
  .hero__grid, .case__inner, .geo__inner, .final-cta__inner, .info__inner { grid-template-columns: 1fr; gap: 32px; }
  .info__inner--reverse { direction: ltr; }
  .trust-strip__inner { grid-template-columns: repeat(2, 1fr); gap: 18px; }
  .conv-cards__grid, .why__grid, .case__stats, .brands__grid, .compare__grid { grid-template-columns: 1fr 1fr; }
  .mini-form__inner { grid-template-columns: 1fr; gap: 16px; text-align: center; }
  .mini-form__form { grid-template-columns: 1fr 1fr; }
  .mini-form__form button { grid-column: 1 / -1; justify-content: center; }
  .hero__ctas { flex-direction: column; align-items: stretch; }
  .hero__ctas .btn-primary, .hero__ctas .btn-tel-strong { justify-content: center; }
  .timeline__grid { grid-template-columns: repeat(2, 1fr); }
  .timeline__grid::before { display: none; }
  .calc__form { grid-template-columns: 1fr; }
  .models__table { background: transparent; box-shadow: none; border: 0; }
  .models__row { display: block; background: var(--blanc); border-radius: 16px; padding: 20px; margin-bottom: 12px; box-shadow: 0 4px 16px rgba(0,0,0,0.06); border-bottom: 0; border: 1px solid var(--gray-border); }
  .models__row.models__row--head { display: none !important; }
  .models__row .models__model { font-size: 16px; margin-bottom: 4px; padding-bottom: 8px; border-bottom: 1px solid var(--gray-border); }
  .models__row .models__model small { font-size: 11px; }
  .models__row .models__capacity { display: inline-block; margin-top: 12px; padding: 4px 10px; background: var(--indigo); color: var(--blanc); border-radius: 999px; font-size: 12px; font-weight: 700; }
  .models__row .models__people { display: inline-block; margin: 12px 0 12px 8px; color: var(--txt-soft); font-size: 13px; }
  .models__row .models__price, .models__row .models__price-final { display: block; margin-top: 6px; padding-top: 12px; border-top: 1px dashed var(--gray-border); font-size: 15px; }
  .models__row .models__price-final { padding-top: 6px; border-top: 0; }
  .models__row .models__price::before { content: "Prix TTC posé : "; font-size: 11px; color: var(--txt-soft); font-weight: 500; text-transform: uppercase; letter-spacing: 0.05em; display: block; margin-bottom: 2px; }
  .models__row .models__price-final::before { content: "Reste à charge après aides : "; font-size: 11px; color: var(--txt-soft); font-weight: 500; text-transform: uppercase; letter-spacing: 0.05em; display: block; margin-bottom: 2px; }
  .models__row .models__price small, .models__row .models__price-final small { display: none; }
  .faq__list { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .top-bar__phone { font-size: 14px; }
  .header { padding: 12px 0; }
}
@media (max-width: 700px) {
  .top-bar__inner { flex-wrap: wrap; gap: 10px; justify-content: center; }
  .conv-cards__grid, .why__grid, .case__stats, .brands__grid, .compare__grid { grid-template-columns: 1fr; }
  .mini-form__form { grid-template-columns: 1fr; }
  .mini-form__form select, .mini-form__form input { font-size: 16px; }
  .mini-form__trust { gap: 8px 14px; }
  .devis-form__row { grid-template-columns: 1fr; }
  .calc__inner, .final-cta__inner { padding: 32px 24px; }
  .calc__result, .calc__result--double { grid-template-columns: 1fr; text-align: center; gap: 16px; }
  .calc__result-block { grid-template-columns: 1fr; }
  .calc__result-divider { width: 100%; height: 1px; }
  .cross-sell__grid { grid-template-columns: 1fr; }
  .sticky-mobile { display: flex; }
  body { padding-bottom: 72px; }
  .footer-newsletter__inner { grid-template-columns: 1fr; gap: 20px; text-align: center; }
  .footer-grid { grid-template-columns: 1fr; gap: 32px; }
  .footer-bottom { flex-direction: column; gap: 16px; text-align: center; }
  .subfooter__inner { flex-direction: column; gap: 8px; text-align: center; }
  .timeline__grid { grid-template-columns: 1fr; gap: 12px; }
  .timeline-step { display: grid; grid-template-columns: auto 1fr; gap: 16px; text-align: left; background: var(--blanc); border-radius: 14px; padding: 14px 16px; align-items: center; }
  .timeline-step__day { grid-column: 1; grid-row: 1 / 3; align-self: center; margin: 0; width: 56px; text-align: center; padding: 8px 4px; font-size: 12px; }
  .timeline-step__icon { display: none; }
  .timeline-step__title { grid-column: 2; grid-row: 1; margin: 0; font-size: 14px; }
  .timeline-step__desc { grid-column: 2; grid-row: 2; font-size: 12.5px; }
}

/* ============ CRO LEVIERS (eyebrow partagé) ============ */
.cro-eyebrow { display: inline-block; font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 12px; }
.cro-container-narrow { max-width: 1100px; margin: 0 auto; padding: 0 24px; }

/* ============ LEVIER 1 ; DOULEUR EN CHIFFRES FROIDS ============ */
.pain-numbers { padding: 80px 0; background: var(--indigo-pale); }
.pain-numbers__head { text-align: center; max-width: 760px; margin: 0 auto 32px; }
.pain-numbers__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 32px 0; }
.pain-numbers__card { background: var(--blanc); padding: 32px 20px; border-radius: 16px; text-align: center; border: 1px solid var(--gray-border); box-shadow: 0 8px 24px -16px rgba(0,0,0,0.08); }
.pain-numbers__amount { font-family: var(--f-h); font-weight: 900; font-size: 48px; line-height: 1; color: var(--rouge); margin-bottom: 10px; letter-spacing: -0.02em; }
.pain-numbers__label { font-family: var(--f-body); font-weight: 500; font-size: 14px; line-height: 1.5; color: var(--txt-soft); }
.pain-numbers__conclusion { font-family: var(--f-body); font-weight: 500; font-size: 17px; line-height: 1.7; color: var(--txt); text-align: center; max-width: 760px; margin: 16px auto 0; }
.pain-numbers__conclusion strong { color: var(--indigo); font-weight: 900; }
@media (max-width: 700px) {
  .pain-numbers__grid { grid-template-columns: 1fr; }
  .pain-numbers__amount { font-size: 40px; }
  .pain-numbers { padding: 56px 0; }
}

/* ============ LEVIER 2 ; GARANTIES EN ENCART ============ */
.guarantees { padding: 80px 0; background: var(--blanc); }
.guarantees__head { text-align: center; max-width: 760px; margin: 0 auto 32px; }
.guarantees__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; margin-top: 32px; }
.guarantees__card { background: var(--indigo-pale); border-radius: 14px; padding: 24px 16px; text-align: center; transition: transform 320ms var(--ease), box-shadow 320ms var(--ease); border: 1px solid var(--gray-border); }
.guarantees__card:hover { transform: translateY(-4px); box-shadow: 0 16px 32px -16px rgba(72,84,245,0.25); border-color: var(--indigo); }
.guarantees__icon { font-size: 32px; line-height: 1; margin-bottom: 14px; }
.guarantees__title { font-family: var(--f-h); font-weight: 800; font-size: 15px; color: var(--indigo); margin-bottom: 8px; line-height: 1.3; }
.guarantees__detail { font-family: var(--f-body); font-weight: 400; font-size: 13px; line-height: 1.5; color: var(--txt); }
@media (max-width: 1080px) { .guarantees__grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 700px) {
  .guarantees__grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .guarantees { padding: 56px 0; }
}
@media (max-width: 480px) { .guarantees__grid { grid-template-columns: 1fr; } }

/* ============ LEVIER 4 ; STACK OFFER EMPILÉ ============ */
.stack-offer { padding: 80px 0; background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); color: var(--blanc); position: relative; overflow: hidden; }
.stack-offer::before { content: ""; position: absolute; top: -80px; right: -80px; width: 280px; height: 280px; background: rgba(252,201,48,0.12); border-radius: 50%; }
.stack-offer::after { content: ""; position: absolute; bottom: -100px; left: -100px; width: 320px; height: 320px; background: rgba(230,45,51,0.08); border-radius: 50%; }
.stack-offer__head { text-align: center; max-width: 760px; margin: 0 auto 32px; position: relative; z-index: 2; }
.stack-offer__head .cro-eyebrow { color: var(--jaune); }
.stack-offer__head h2 { color: var(--blanc); }
.stack-offer__list { list-style: none; padding: 0; max-width: 760px; margin: 32px auto 0; position: relative; z-index: 2; background: rgba(255,255,255,0.06); border-radius: 16px; padding: 24px 28px; border: 1px solid rgba(255,255,255,0.12); backdrop-filter: blur(6px); }
.stack-offer__item { display: flex; gap: 16px; align-items: flex-start; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,0.14); }
.stack-offer__item:last-child { border-bottom: 0; }
.stack-offer__check { background: var(--jaune); color: var(--indigo); width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 900; font-family: var(--f-h); flex-shrink: 0; margin-top: 2px; font-size: 15px; }
.stack-offer__item-body strong { font-family: var(--f-h); font-weight: 700; font-size: 16px; color: var(--blanc); display: block; line-height: 1.4; }
.stack-offer__value { font-family: var(--f-body); font-weight: 400; font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,0.78); display: block; margin-top: 2px; }
.stack-offer__cta-text { text-align: center; margin-top: 28px; font-family: var(--f-body); font-weight: 600; font-size: 17px; line-height: 1.55; color: var(--jaune); position: relative; z-index: 2; }
.stack-offer__cta-text strong { font-weight: 900; }
@media (max-width: 700px) {
  .stack-offer { padding: 56px 0; }
  .stack-offer__list { padding: 16px 18px; }
  .stack-offer__item-body strong { font-size: 15px; }
}

/* ============ AEO direct-answer + listes + tableaux comparatifs éditoriaux ============ */
.aeo-answer { font-size: 16.5px; font-weight: 600; color: var(--txt); background: var(--indigo-pale); border-left: 4px solid var(--indigo); padding: 14px 18px; border-radius: 10px; margin: 0 auto 22px; max-width: 760px; line-height: 1.55; text-align: left; }
.aeo-answer strong { color: var(--indigo); font-weight: 800; }
.service-list { list-style: none; padding: 0; margin: 14px 0 18px; display: grid; gap: 10px; }
.service-list li { display: flex; gap: 12px; align-items: flex-start; padding: 10px 14px; background: var(--gray-soft); border-left: 3px solid var(--indigo); border-radius: 8px; font-size: 14.5px; line-height: 1.55; }
.service-list li::before { content: "✓"; color: var(--indigo); font-weight: 900; flex-shrink: 0; margin-top: 1px; }
.service-list strong { color: var(--txt); font-weight: 700; }
.compare-table { width: 100%; border-collapse: separate; border-spacing: 0; margin: 18px auto; background: var(--blanc); border-radius: 14px; overflow: hidden; box-shadow: 0 6px 20px -10px rgba(0,0,0,0.10); border: 1px solid var(--gray-border); font-size: 14px; }
.compare-table caption { font-family: var(--f-h); font-weight: 700; font-size: 15px; color: var(--txt-soft); margin-bottom: 10px; text-align: left; caption-side: top; }
.compare-table th, .compare-table td { padding: 14px 16px; text-align: left; border-bottom: 1px solid var(--gray-border); vertical-align: top; line-height: 1.5; }
.compare-table thead th { background: var(--indigo); color: var(--blanc); font-family: var(--f-h); font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: 0.06em; }
.compare-table tbody tr:last-child td { border-bottom: 0; }
.compare-table tbody tr:nth-child(even) td { background: var(--gray-soft); }
.compare-table tbody th { font-family: var(--f-h); font-weight: 700; color: var(--indigo); background: var(--indigo-pale); }
.compare-table strong { color: var(--indigo); font-weight: 700; }
@media (max-width: 700px) {
  .compare-table, .compare-table tbody, .compare-table tr, .compare-table td, .compare-table th { display: block; width: 100%; }
  .compare-table thead { display: none; }
  .compare-table tr { margin-bottom: 14px; border-radius: 10px; border: 1px solid var(--gray-border); overflow: hidden; }
  .compare-table td { border-bottom: 1px dashed var(--gray-border); padding: 10px 14px; }
  .compare-table td::before { content: attr(data-label); display: block; font-size: 11px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 4px; }
  .compare-table tbody th { padding: 12px 14px; font-size: 15px; }
}


/* === preview-pompe-a-chaleur-air-eau.html === */

:root {
  --indigo: #4854f5; --indigo-dark: #3a44d4; --indigo-pale: #eff0ff;
  --rouge: #e62d33; --rouge-dark: #c22128; --jaune: #fcc930;
  --txt: #444444; --txt-soft: #6b6b6b;
  --gray-border: #e5e7eb; --gray-soft: #f9f9fb;
  --blanc: #ffffff;
  --f-body: 'Raleway', Helvetica, Arial, Lucida, sans-serif;
  --f-h: 'Lato', Helvetica, Arial, Lucida, sans-serif;
  --ease: cubic-bezier(0.32, 0.72, 0, 1);
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: var(--f-body); font-size: 15px; line-height: 1.7; color: var(--txt); background: var(--blanc); -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; display: block; }
h1, h2, h3, h4 { font-family: var(--f-h); color: var(--txt); font-weight: 700; line-height: 1.25; margin: 0 0 0.5em; }
h1 { font-size: clamp(34px, 4.5vw, 50px); }
h2 { font-size: clamp(26px, 3vw, 36px); text-align: center; }
h3 { font-size: 20px; }
p { margin: 0 0 1em; }
a { color: var(--indigo); text-decoration: none; transition: color 220ms var(--ease); }
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }

.top-bar { background: var(--indigo); color: var(--blanc); font-size: 12.5px; padding: 9px 0; }
.top-bar__inner { display: flex; justify-content: flex-start; align-items: center; gap: 18px; }
.top-bar__phone { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: var(--blanc); }
.top-bar__hours { display: inline-flex; align-items: center; gap: 5px; color: rgba(255,255,255,0.85); font-size: 12px; }
.top-bar__rating { display: inline-flex; align-items: center; gap: 5px; color: var(--blanc); font-size: 12px; font-weight: 600; margin-left: auto; }
.top-bar__socials { display: flex; gap: 4px; list-style: none; padding: 0; margin: 0; }
.top-bar__socials a { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; transition: background 220ms var(--ease); color: var(--blanc); }
.top-bar__socials a:hover { background: rgba(255,255,255,0.18); }
.top-bar__cta { background: var(--rouge); padding: 6px 14px; border-radius: 6px; font-weight: 700; transition: all 220ms var(--ease); font-size: 12.5px; color: var(--blanc); }
.top-bar__cta:hover { background: var(--rouge-dark); transform: translateY(-1px); }
.top-bar__avis { background: rgba(255,255,255,0.15); padding: 6px 12px; border-radius: 6px; font-weight: 500; font-size: 12.5px; color: var(--blanc); }

.header { background: var(--blanc); padding: 14px 0; border-bottom: 1px solid rgba(0,0,0,0.05); position: sticky; top: 0; z-index: 100; transition: box-shadow 220ms var(--ease); }
.header__inner { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.header__logo img { height: 64px; transition: height 220ms; }

.nav > ul { list-style: none; padding: 0; margin: 0; display: flex; gap: 2px; align-items: center; }
.nav > ul > li { position: relative; }
.nav > ul > li > a { display: inline-flex; align-items: center; padding: 10px 14px; color: var(--txt); font-size: 14.5px; font-weight: 600; transition: all 220ms var(--ease); border-radius: 6px; }
.nav > ul > li > a:hover { color: var(--indigo); background: var(--indigo-pale); }
.nav__cta { background: var(--rouge) !important; color: var(--blanc) !important; padding: 10px 18px !important; }
.nav__cta:hover { background: var(--rouge-dark) !important; color: var(--blanc) !important; }

.nav__has-mega .mega { position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(8px); min-width: 1080px; background: var(--blanc); box-shadow: 0 24px 60px -16px rgba(0,0,0,0.18); border-radius: 16px; padding: 28px; opacity: 0; visibility: hidden; transition: all 280ms var(--ease); z-index: 200; border: 1px solid var(--gray-border); }
.nav__has-mega:hover .mega,
.nav__has-mega:focus-within .mega { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.mega__inner { display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px; }
.mega-col { display: flex; flex-direction: column; gap: 10px; }
.mega-col__hub { display: flex; align-items: center; gap: 10px; font-family: var(--f-h); font-weight: 700; font-size: 14.5px; color: var(--txt); padding: 8px 10px; border-radius: 8px; transition: all 220ms var(--ease); border-bottom: 2px solid var(--indigo-pale); padding-bottom: 12px; margin-bottom: 4px; }
.mega-col__hub:hover { color: var(--indigo); background: var(--indigo-pale); }
.mega-col__icon { flex-shrink: 0; width: 32px; height: 32px; border-radius: 8px; display: flex; align-items: center; justify-content: center; }
.mega-col__icon svg { width: 18px; height: 18px; }
.mega-col__icon--yellow { background: rgba(252,201,48,0.18); color: #d4a01a; }
.mega-col__icon--red { background: rgba(230,45,51,0.12); color: var(--rouge); }
.mega-col__icon--blue { background: rgba(72,84,245,0.12); color: var(--indigo); }
.mega-col__icon--cyan { background: rgba(56,189,248,0.15); color: #0c8aab; }
.mega-col__icon--green { background: rgba(34,197,94,0.15); color: #1ca64c; }
.mega-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 2px; }
.mega-col ul a { display: block; padding: 7px 10px; font-size: 13px; color: var(--txt-soft); border-radius: 6px; transition: all 180ms var(--ease); line-height: 1.4; }
.mega-col ul a:hover { color: var(--indigo); background: var(--gray-soft); padding-left: 14px; }
.mega--small { min-width: 240px !important; padding: 12px !important; }
.mega__inner--small { display: block !important; grid-template-columns: none !important; }
.mega-simple { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 1px; }
.mega-simple li a { display: block; padding: 9px 12px; font-size: 14px; font-weight: 500; color: var(--txt); border-radius: 6px; transition: all 180ms var(--ease); }
.mega-simple li a:hover { color: var(--indigo); background: var(--indigo-pale); padding-left: 16px; }
.nav__has-mega::after { content: ""; position: absolute; bottom: -8px; left: 50%; transform: translateX(-50%); width: 12px; height: 12px; background: var(--blanc); border-left: 1px solid var(--gray-border); border-top: 1px solid var(--gray-border); rotate: 45deg; opacity: 0; transition: opacity 220ms; z-index: 201; }
.nav__has-mega:hover::after,
.nav__has-mega:focus-within::after { opacity: 1; }

.burger { display: none; background: transparent; border: 0; width: 36px; height: 36px; flex-direction: column; justify-content: center; align-items: center; gap: 5px; cursor: pointer; padding: 0; z-index: 1002; }
.burger span { display: block; width: 24px; height: 2px; background: var(--indigo); border-radius: 2px; transition: all 320ms var(--ease); }
body.is-menu-open .burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
body.is-menu-open .burger span:nth-child(2) { opacity: 0; }
body.is-menu-open .burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 1080px) {
  .top-bar__hours, .top-bar__socials, .top-bar__rating { display: none; }
  .top-bar__inner { gap: 12px; }
  .burger { display: inline-flex; }
  .nav { position: fixed; inset: 0; background: rgba(255,255,255,0.97); backdrop-filter: blur(12px); z-index: 1000; padding: 120px 24px 32px; overflow-y: auto; opacity: 0; visibility: hidden; transition: all 320ms var(--ease); }
  body.is-menu-open .nav { opacity: 1; visibility: visible; }
  .nav > ul { flex-direction: column; gap: 4px; }
  .nav > ul > li { width: 100%; }
  .nav > ul > li > a { font-size: 18px; padding: 14px 16px; width: 100%; justify-content: space-between; }
  .nav__has-mega .mega { position: static; transform: none; min-width: 0; box-shadow: none; border: 0; background: var(--gray-soft); padding: 14px; opacity: 1; visibility: inherit; margin: 6px 0; }
  .mega__inner { grid-template-columns: 1fr !important; gap: 16px; }
  .mega-col__hub { font-size: 16px; }
  .mega-col ul a { padding: 8px 12px; font-size: 14px; }
  .nav__has-mega::after { display: none; }
  .header__logo img { height: 48px; }
  .header { padding: 10px 0; }
}

.breadcrumb { background: var(--gray-soft); padding: 14px 0; font-size: 13px; color: var(--txt-soft); }
.breadcrumb a { color: var(--txt-soft); }
.breadcrumb a:hover { color: var(--indigo); }
.breadcrumb__sep { margin: 0 8px; opacity: 0.4; }

.hero { padding: 50px 0 80px; background: var(--blanc); }
.hero__grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 48px; align-items: center; }
.hero__pretitle { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 16px; padding: 8px 14px; background: var(--indigo-pale); border-radius: 999px; }
.hero__pretitle::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--indigo); }
.hero__title { margin: 0 0 18px; }
.hero__title strong { color: var(--indigo); font-weight: 900; }
.hero__sub { font-size: 17px; color: var(--txt-soft); margin-bottom: 24px; max-width: 56ch; line-height: 1.55; }
.hero__sub strong { color: var(--txt); font-weight: 700; }
.hero__ctas { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 24px; }
.btn-primary { display: inline-flex; align-items: center; gap: 10px; background: var(--rouge); color: var(--blanc); padding: 16px 28px; border-radius: 8px; font-weight: 700; font-size: 15px; transition: all 280ms var(--ease); font-family: var(--f-body); border: 0; cursor: pointer; }
.btn-primary:hover { background: var(--rouge-dark); color: var(--blanc); transform: translateY(-2px); box-shadow: 0 10px 24px -10px rgba(230,45,51,0.5); }
.btn-secondary { display: inline-flex; align-items: center; gap: 10px; background: var(--blanc); color: var(--indigo); padding: 16px 28px; border-radius: 8px; font-weight: 700; font-size: 15px; border: 2px solid var(--indigo); transition: all 280ms var(--ease); }
.btn-secondary:hover { background: var(--indigo); color: var(--blanc); transform: translateY(-2px); }
.btn-indigo { display: inline-flex; align-items: center; gap: 8px; background: var(--indigo); color: var(--blanc); padding: 12px 22px; border-radius: 6px; font-weight: 700; font-size: 14px; transition: all 280ms var(--ease); border: 0; cursor: pointer; font-family: var(--f-body); }
.btn-indigo:hover { background: var(--indigo-dark); color: var(--blanc); transform: translateY(-2px); }
.btn-tel-strong { display: inline-flex; align-items: center; gap: 12px; background: var(--indigo); color: var(--blanc); padding: 12px 22px; border-radius: 8px; font-weight: 700; transition: all 280ms var(--ease); }
.btn-tel-strong:hover { background: var(--indigo-dark); color: var(--blanc); transform: translateY(-2px); box-shadow: 0 10px 24px -10px rgba(72,84,245,0.5); }
.btn-tel-strong svg { width: 22px; height: 22px; flex-shrink: 0; color: var(--jaune); }
.btn-tel-strong > div { display: flex; flex-direction: column; line-height: 1.15; text-align: left; }
.btn-tel-strong strong { font-size: 17px; font-weight: 900; font-family: var(--f-h); letter-spacing: 0.02em; }
.btn-tel-strong small { font-size: 10px; font-weight: 600; opacity: 0.85; text-transform: uppercase; letter-spacing: 0.06em; margin-top: 2px; }

.mini-form { background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); padding: 56px 0; color: var(--blanc); position: relative; overflow: hidden; }
.mini-form::before { content: ""; position: absolute; top: -80px; right: -80px; width: 280px; height: 280px; background: rgba(252,201,48,0.12); border-radius: 50%; }
.mini-form::after { content: ""; position: absolute; bottom: -100px; left: -100px; width: 320px; height: 320px; background: rgba(230,45,51,0.08); border-radius: 50%; }
.mini-form__inner { position: relative; z-index: 2; max-width: 900px; margin: 0 auto; text-align: center; }
.mini-form__pretitle { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; color: var(--jaune); text-transform: uppercase; letter-spacing: 0.18em; margin-bottom: 14px; padding: 6px 16px; background: rgba(252,201,48,0.15); border-radius: 999px; }
.mini-form__title { font-family: var(--f-h); font-weight: 900; font-size: clamp(26px, 3.2vw, 34px); margin: 0 0 10px; line-height: 1.2; color: var(--blanc); }
.mini-form__subtitle { font-size: 16px; opacity: 0.92; margin: 0 auto 28px; max-width: 600px; line-height: 1.5; }
.mini-form__subtitle strong { font-weight: 700; color: var(--jaune); }
.mini-form__form { display: grid; grid-template-columns: 1fr 1.2fr 1.1fr auto; gap: 10px; max-width: 820px; margin: 0 auto; background: rgba(255,255,255,0.08); padding: 12px; border-radius: 16px; border: 1px solid rgba(255,255,255,0.18); backdrop-filter: blur(10px); }
.mini-form__form input, .mini-form__form select { padding: 16px 18px; border: 0; background: var(--blanc); color: var(--txt); border-radius: 10px; font-family: inherit; font-size: 15px; font-weight: 500; outline: 0; min-width: 0; }
.mini-form__form input::placeholder { color: var(--txt-soft); }
.mini-form__form input:focus, .mini-form__form select:focus { box-shadow: 0 0 0 3px rgba(252,201,48,0.5); }
.mini-form__form button { background: var(--rouge); color: var(--blanc); padding: 16px 28px; border-radius: 10px; font-family: inherit; font-weight: 800; font-size: 15px; border: 0; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px; transition: all 280ms var(--ease); white-space: nowrap; box-shadow: 0 4px 16px rgba(0,0,0,0.15); }
.mini-form__form button:hover { background: var(--rouge-dark); transform: translateY(-2px); box-shadow: 0 12px 28px -8px rgba(230,45,51,0.7); }
.mini-form__trust { display: flex; gap: 28px; flex-wrap: wrap; justify-content: center; margin-top: 22px; font-size: 13px; opacity: 0.92; font-weight: 500; }
.mini-form__trust span { display: inline-flex; align-items: center; gap: 6px; }
.mini-form__trust span::before { content: "✓"; color: var(--jaune); font-weight: 900; }

.devis-form__trust { margin: 16px 0 0; padding-top: 14px; border-top: 1px solid var(--gray-border); }
.devis-form__trust-badges { display: flex; gap: 6px; justify-content: center; margin-bottom: 8px; }
.devis-form__trust-badges img { height: 28px; width: auto; object-fit: contain; }
.devis-form__trust-text { text-align: center; font-size: 11px; color: var(--txt-soft); font-weight: 600; line-height: 1.4; }

.hero__quick { display: flex; align-items: center; gap: 16px; font-size: 13px; color: var(--txt-soft); flex-wrap: wrap; }
.hero__quick-item { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.hero__quick-item svg { width: 16px; height: 16px; color: var(--indigo); }
.hero__visual { position: relative; }
.hero__img { border-radius: 20px; overflow: hidden; aspect-ratio: 5/6; box-shadow: 0 24px 60px -20px rgba(0,0,0,0.18); }
.hero__img img { width: 100%; height: 100%; object-fit: cover; }
.hero__badge { position: absolute; top: -16px; right: -16px; background: var(--jaune); color: var(--txt); padding: 14px 20px; border-radius: 14px; box-shadow: 0 12px 30px rgba(0,0,0,0.15); font-family: var(--f-h); font-weight: 900; text-align: center; line-height: 1.2; }
.hero__badge small { display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; opacity: 0.85; margin-bottom: 2px; }
.hero__badge strong { display: block; font-size: 22px; }
.hero__rating { position: absolute; bottom: -20px; left: -20px; background: var(--blanc); border-radius: 14px; box-shadow: 0 12px 30px rgba(0,0,0,0.12); padding: 14px 18px; display: flex; align-items: center; gap: 12px; }
.hero__rating-stars { color: var(--jaune); font-size: 16px; letter-spacing: 2px; }
.hero__rating-text { font-size: 12px; color: var(--txt-soft); line-height: 1.3; }
.hero__rating-text strong { display: block; font-family: var(--f-h); font-weight: 900; color: var(--txt); font-size: 16px; }

.trust-strip { background: var(--indigo-pale); padding: 28px 0; }
.trust-strip__inner { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; align-items: center; }
.trust-item { display: flex; align-items: center; gap: 14px; }
.trust-item__icon { flex-shrink: 0; width: 48px; height: 48px; background: var(--blanc); border-radius: 12px; display: flex; align-items: center; justify-content: center; color: var(--indigo); }
.trust-item__icon svg { width: 26px; height: 26px; }
.trust-item__text { font-size: 13px; line-height: 1.4; color: var(--txt); }
.trust-item__text strong { display: block; font-family: var(--f-h); font-size: 16px; font-weight: 900; color: var(--txt); }

.conv-cards { padding: 80px 0; background: var(--blanc); }
.conv-cards__header { text-align: center; max-width: 700px; margin: 0 auto 48px; }
.conv-cards__label { display: inline-block; font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 12px; }
.conv-cards__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.conv-card { background: var(--blanc); border: 2px solid var(--indigo-pale); border-radius: 20px; padding: 32px 28px; transition: all 320ms var(--ease); position: relative; display: flex; flex-direction: column; }
.conv-card:hover { border-color: var(--indigo); transform: translateY(-4px); box-shadow: 0 20px 40px -16px rgba(72,84,245,0.18); }
.conv-card__icon { width: 48px; height: 48px; background: var(--indigo); color: var(--blanc); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; }
.conv-card__icon svg { width: 24px; height: 24px; }
.conv-card__q { font-family: var(--f-h); font-weight: 700; font-size: 18px; color: var(--txt); margin-bottom: 12px; line-height: 1.3; }
.conv-card__a { font-size: 14px; color: var(--txt-soft); line-height: 1.7; flex: 1; margin-bottom: 18px; }
.conv-card__a strong { color: var(--txt); }
.conv-card__link { color: var(--indigo); font-weight: 700; font-size: 14px; display: inline-flex; align-items: center; gap: 6px; transition: gap 220ms var(--ease); }
.conv-card__link:hover { gap: 10px; }

.info { padding: 80px 0; background: var(--gray-soft); }
.info__inner { max-width: 980px; margin: 0 auto; }
.info__header { text-align: center; margin-bottom: 36px; }
.info__lead { font-size: 17px; color: var(--txt); line-height: 1.7; max-width: 760px; margin: 0 auto 32px; text-align: center; }
.info__lead strong { color: var(--indigo); }
.info__grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 36px; align-items: center; }
.info__steps { display: flex; flex-direction: column; gap: 14px; }
.info__step { display: grid; grid-template-columns: 44px 1fr; gap: 16px; padding: 16px; background: var(--blanc); border-radius: 14px; border: 1px solid var(--gray-border); }
.info__step b { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; background: var(--indigo); color: var(--blanc); font-family: var(--f-h); font-weight: 900; font-size: 18px; border-radius: 50%; }
.info__step p { margin: 0; font-size: 14px; line-height: 1.55; color: var(--txt); }
.info__step p strong { color: var(--txt); font-family: var(--f-h); display: block; margin-bottom: 4px; }
.info__schema { background: var(--blanc); border-radius: 20px; padding: 24px; box-shadow: 0 8px 24px rgba(0,0,0,0.06); }
.info__schema img { width: 100%; height: auto; border-radius: 12px; }
.info__schema-caption { text-align: center; font-size: 12.5px; color: var(--txt-soft); margin-top: 12px; font-style: italic; }

.models { padding: 80px 0; background: var(--indigo-pale); }
.models__header { text-align: center; max-width: 700px; margin: 0 auto 40px; }
.models__intro { color: var(--txt-soft); font-size: 16px; }
.models__table { background: var(--blanc); border-radius: 20px; overflow: hidden; box-shadow: 0 8px 24px rgba(0,0,0,0.06); margin-bottom: 24px; }
.models__row { display: grid; grid-template-columns: 1.1fr 1fr 1.2fr 1fr 1.2fr; gap: 0; padding: 20px 24px; border-bottom: 1px solid var(--gray-border); align-items: center; }
.models__row:last-child { border-bottom: 0; }
.models__row--head { background: var(--gray-soft); font-family: var(--f-h); font-weight: 700; font-size: 13px; color: var(--txt-soft); text-transform: uppercase; letter-spacing: 0.1em; }
.models__row--head > div { padding-right: 8px; }
.models__model { font-family: var(--f-h); font-weight: 700; color: var(--txt); }
.models__model small { display: block; font-size: 12px; color: var(--txt-soft); font-weight: 500; margin-top: 2px; }
.models__capacity { font-weight: 600; color: var(--txt); }
.models__people { font-size: 13px; color: var(--txt-soft); }
.models__price { font-family: var(--f-h); font-weight: 900; color: var(--indigo); font-size: 18px; }
.models__price small { display: block; font-size: 11px; color: var(--txt-soft); font-weight: 500; margin-top: 2px; letter-spacing: 0; }
.models__price-final { font-family: var(--f-h); font-weight: 900; color: var(--rouge); font-size: 20px; }
.models__price-final small { display: block; font-size: 11px; color: var(--txt-soft); font-weight: 500; margin-top: 2px; }
.models__note { text-align: center; font-size: 13px; color: var(--txt-soft); font-style: italic; margin-bottom: 32px; }
.models__cta { text-align: center; }

.calc { padding: 80px 0; background: var(--blanc); }
.calc__inner { max-width: 900px; margin: 0 auto; background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); border-radius: 24px; padding: 48px; color: var(--blanc); position: relative; overflow: hidden; }
.calc__inner::before { content: ""; position: absolute; top: -100px; right: -100px; width: 280px; height: 280px; background: rgba(252,201,48,0.15); border-radius: 50%; }
.calc__header { text-align: center; margin-bottom: 32px; position: relative; }
.calc__label { display: inline-block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--jaune); margin-bottom: 12px; padding: 6px 14px; background: rgba(252,201,48,0.15); border-radius: 999px; }
.calc__header h2 { color: var(--blanc); margin-bottom: 8px; }
.calc__header p { opacity: 0.92; }
.calc__form { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; margin-bottom: 24px; position: relative; }
.calc__field label { display: block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 8px; opacity: 0.9; }
.calc__field select { width: 100%; padding: 14px 16px; background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.25); color: var(--blanc); border-radius: 10px; font-family: inherit; font-size: 14px; backdrop-filter: blur(8px); appearance: none; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fcc930'><path d='M7 10l5 5 5-5z'/></svg>"); background-repeat: no-repeat; background-position: right 12px center; background-size: 20px; padding-right: 40px; cursor: pointer; }
.calc__field select option { color: var(--txt); background: var(--blanc); }
.calc__result { background: rgba(255,255,255,0.15); backdrop-filter: blur(12px); border-radius: 16px; padding: 24px 28px; display: grid; grid-template-columns: 1fr auto; gap: 20px; align-items: center; position: relative; border: 1px solid rgba(255,255,255,0.2); }
.calc__result-text { font-size: 14px; opacity: 0.9; }
.calc__result-amount { font-family: var(--f-h); font-weight: 900; font-size: 36px; color: var(--jaune); line-height: 1; letter-spacing: -0.02em; }
.calc__result-amount small { display: block; font-size: 11px; font-weight: 600; opacity: 0.7; text-transform: uppercase; letter-spacing: 0.1em; margin-top: 4px; color: var(--blanc); }
.calc__cta { text-align: center; margin-top: 24px; position: relative; }
.calc__cta .btn-primary { background: var(--jaune); color: var(--txt); }
.calc__cta .btn-primary:hover { background: var(--blanc); color: var(--indigo); }

.brands { padding: 80px 0; background: var(--blanc); }
.brands__header { text-align: center; max-width: 760px; margin: 0 auto 40px; }
.brands__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.brand-card { background: var(--blanc); border: 1px solid var(--gray-border); border-radius: 18px; padding: 28px 22px; display: flex; flex-direction: column; transition: all 320ms var(--ease); }
.brand-card:hover { border-color: var(--indigo); transform: translateY(-4px); box-shadow: 0 20px 40px -16px rgba(72,84,245,0.18); }
.brand-card__name { font-family: var(--f-h); font-weight: 900; font-size: 19px; color: var(--indigo); margin-bottom: 4px; }
.brand-card__model { font-family: var(--f-h); font-weight: 700; font-size: 14px; color: var(--txt); margin-bottom: 14px; }
.brand-card__desc { font-size: 13.5px; color: var(--txt-soft); line-height: 1.6; flex: 1; margin-bottom: 14px; }
.brand-card__desc strong { color: var(--txt); }
.brand-card__specs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.brand-card__specs span { font-size: 11px; font-weight: 700; padding: 4px 10px; background: var(--indigo-pale); color: var(--indigo); border-radius: 999px; }
.brand-card__pick { font-size: 12px; color: var(--rouge); font-weight: 700; padding: 8px 12px; background: rgba(230,45,51,0.08); border-radius: 8px; line-height: 1.4; }

.swap { padding: 80px 0; background: var(--indigo-pale); }
.swap__header { text-align: center; max-width: 760px; margin: 0 auto 36px; }
.swap__compare { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; max-width: 980px; margin: 0 auto 32px; }
.swap-col { background: var(--blanc); border-radius: 18px; padding: 28px; border: 1px solid var(--gray-border); }
.swap-col--old { border-left: 4px solid var(--rouge); }
.swap-col--new { border-left: 4px solid var(--indigo); }
.swap-col h3 { font-family: var(--f-h); font-weight: 900; font-size: 18px; color: var(--txt); margin-bottom: 14px; }
.swap-col ul { list-style: none; padding: 0; margin: 0; }
.swap-col li { padding: 10px 0 10px 26px; position: relative; font-size: 14px; color: var(--txt); border-bottom: 1px dashed var(--gray-border); line-height: 1.5; }
.swap-col li:last-child { border-bottom: 0; }
.swap-col li::before { position: absolute; left: 0; top: 10px; font-weight: 900; font-size: 14px; }
.swap-col--old li::before { content: "✗"; color: var(--rouge); }
.swap-col--new li::before { content: "✓"; color: #1ca64c; }
.swap-col li strong { color: var(--txt); font-family: var(--f-h); }
.swap__note { text-align: center; font-size: 14px; color: var(--txt); max-width: 760px; margin: 0 auto 24px; background: var(--blanc); padding: 16px 22px; border-radius: 12px; border: 1px solid var(--gray-border); }
.swap__note strong { color: var(--rouge); }
.swap__cta { text-align: center; }

.climate { padding: 80px 0; background: var(--blanc); }
.climate__inner { max-width: 980px; margin: 0 auto; }
.climate__header { text-align: center; margin-bottom: 36px; }
.climate__lead { font-size: 16px; color: var(--txt); max-width: 760px; margin: 0 auto 32px; text-align: center; line-height: 1.65; }
.climate__lead strong { color: var(--indigo); }
.climate__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.climate-card { background: var(--gray-soft); border-radius: 16px; padding: 24px 22px; border-top: 4px solid var(--indigo); }
.climate-card h3 { font-family: var(--f-h); font-weight: 800; font-size: 16px; color: var(--txt); margin-bottom: 10px; }
.climate-card p { font-size: 13.5px; color: var(--txt-soft); line-height: 1.6; margin: 0; }
.climate-card p strong { color: var(--txt); }
.climate__note { margin-top: 28px; padding: 18px 22px; background: var(--indigo-pale); border-radius: 12px; text-align: center; font-size: 14px; color: var(--txt); }
.climate__note strong { color: var(--indigo); }

.case-v2 { padding: 0 0 80px; background: var(--indigo-pale); }
.case-v2__hero { position: relative; height: 540px; overflow: hidden; }
.case-v2__hero img { width: 100%; height: 100%; object-fit: cover; display: block; }
.case-v2__overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0.4) 50%, rgba(15,16,46,0.92) 100%); color: var(--blanc); display: flex; flex-direction: column; justify-content: flex-end; padding: 48px 0; }
.case-v2__chip { display: inline-block; background: var(--rouge); padding: 7px 16px; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; align-self: flex-start; margin-bottom: 16px; }
.case-v2__title { color: var(--blanc) !important; text-align: left !important; font-size: clamp(26px, 3.4vw, 40px) !important; margin: 0 0 14px !important; max-width: 760px; line-height: 1.2; }
.case-v2__sub { font-size: 15px; opacity: 0.92; margin: 0 0 26px; max-width: 680px; line-height: 1.5; }
.case-v2__stats { display: flex; gap: 56px; flex-wrap: wrap; }
.case-v2__stats div { display: flex; flex-direction: column; min-width: 100px; }
.case-v2__stats strong { font-family: var(--f-h); font-size: 44px; font-weight: 900; color: var(--jaune); line-height: 1; letter-spacing: -0.02em; }
.case-v2__stats span { font-size: 12px; opacity: 0.88; text-transform: uppercase; letter-spacing: 0.1em; margin-top: 6px; }
.case-v2__body { padding-top: 56px; max-width: 980px; }
.case-v2__quote { background: var(--blanc); border-radius: 20px; padding: 36px 40px; box-shadow: 0 12px 32px -16px rgba(0,0,0,0.12); margin-bottom: 48px; position: relative; }
.case-v2__quote svg { color: var(--indigo-pale); position: absolute; top: 20px; left: 24px; }
.case-v2__quote p { font-size: 17px; line-height: 1.7; color: var(--txt); margin: 0 0 16px; font-style: italic; padding-left: 48px; }
.case-v2__quote cite { font-style: normal; font-size: 14px; color: var(--txt-soft); padding-left: 48px; display: block; }
.case-v2__quote cite strong { color: var(--txt); }
.case-v2__timeline { list-style: none; padding: 0; margin: 0 0 32px; position: relative; }
.case-v2__timeline::before { content: ""; position: absolute; left: 24px; top: 8px; bottom: 8px; width: 3px; background: linear-gradient(180deg, var(--indigo), var(--indigo-pale)); border-radius: 2px; }
.case-v2__timeline li { position: relative; padding: 14px 0 14px 78px; min-height: 64px; display: flex; align-items: center; gap: 0; }
.case-v2__step { position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 56px; height: 56px; background: var(--blanc); color: var(--indigo); border: 3px solid var(--indigo); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: var(--f-h); font-weight: 900; font-size: 13px; box-shadow: 0 6px 16px rgba(72,84,245,0.18); z-index: 2; }
.case-v2__timeline li div { font-size: 14.5px; line-height: 1.55; color: var(--txt-soft); }
.case-v2__timeline li b { display: block; font-family: var(--f-h); font-weight: 700; color: var(--txt); font-size: 15.5px; margin-bottom: 2px; }
.case-v2__more { text-align: center; margin-top: 24px; }
.case-v2__more a { display: inline-flex; align-items: center; gap: 8px; color: var(--indigo); font-weight: 700; font-size: 14.5px; }
@media (max-width: 700px) {
  .case-v2__hero { height: 460px; }
  .case-v2__overlay { padding: 24px 0; }
  .case-v2__stats { gap: 24px; }
  .case-v2__stats strong { font-size: 32px; }
  .case-v2__quote { padding: 28px 22px; }
  .case-v2__quote p, .case-v2__quote cite { padding-left: 0; }
  .case-v2__quote svg { display: none; }
  .case-v2__step { width: 44px; height: 44px; font-size: 11px; }
  .case-v2__timeline li { padding-left: 60px; }
  .case-v2__timeline::before { left: 20px; }
}

.cross-sell { padding: 80px 0; background: var(--gray-soft); }
.cross-sell__header { text-align: center; max-width: 720px; margin: 0 auto 40px; }
.cross-sell__lead { font-size: 15px; color: var(--txt-soft); line-height: 1.6; margin-top: 12px; }
.cross-sell__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.cross-card { background: var(--blanc); border: 2px solid var(--gray-border); border-radius: 18px; padding: 28px 24px; text-decoration: none; color: var(--txt); transition: all 320ms var(--ease); display: flex; flex-direction: column; }
.cross-card:hover { border-color: var(--indigo); transform: translateY(-4px); box-shadow: 0 20px 40px -16px rgba(72,84,245,0.2); }
.cross-card__icon { width: 52px; height: 52px; background: var(--indigo-pale); color: var(--indigo); border-radius: 14px; display: flex; align-items: center; justify-content: center; margin-bottom: 16px; transition: all 320ms var(--ease); }
.cross-card:hover .cross-card__icon { background: var(--indigo); color: var(--blanc); }
.cross-card__icon svg { width: 28px; height: 28px; }
.cross-card__title { font-family: var(--f-h); font-weight: 700; font-size: 17px; color: var(--txt); margin-bottom: 8px; }
.cross-card__desc { font-size: 14px; color: var(--txt-soft); line-height: 1.6; flex: 1; margin-bottom: 16px; }
.cross-card__desc strong { color: var(--rouge); font-weight: 700; }
.cross-card__link { display: inline-flex; align-items: center; gap: 6px; color: var(--indigo); font-weight: 700; font-size: 14px; transition: gap 220ms var(--ease); }
.cross-card:hover .cross-card__link { gap: 10px; }
.cross-sell__note { text-align: center; margin-top: 32px; font-size: 14px; color: var(--txt-soft); padding: 14px 22px; background: var(--blanc); border-radius: 999px; max-width: 640px; margin-left: auto; margin-right: auto; border: 1px solid var(--gray-border); }
.cross-sell__note strong { color: var(--rouge); font-weight: 800; }
@media (max-width: 700px) {
  .cross-sell__grid { grid-template-columns: 1fr; }
}

.why { padding: 80px 0; background: var(--blanc); }
.why__header { text-align: center; max-width: 700px; margin: 0 auto 48px; }
.why__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.why-pillar { background: var(--blanc); border: 1px solid var(--gray-border); border-radius: 20px; padding: 28px 24px; text-align: center; transition: all 320ms var(--ease); }
.why-pillar:hover { border-color: var(--indigo); transform: translateY(-4px); box-shadow: 0 20px 40px -16px rgba(72,84,245,0.15); }
.why-pillar__icon { width: 56px; height: 56px; background: var(--indigo); color: var(--blanc); border-radius: 50%; margin: 0 auto 16px; display: flex; align-items: center; justify-content: center; transition: background 320ms var(--ease); }
.why-pillar:hover .why-pillar__icon { background: var(--rouge); }
.why-pillar__icon svg { width: 26px; height: 26px; }
.why-pillar__title { font-family: var(--f-h); font-weight: 700; font-size: 16px; color: var(--txt); margin-bottom: 8px; }
.why-pillar__desc { font-size: 13px; color: var(--txt-soft); line-height: 1.55; }

.testimonials { padding: 80px 0; background: var(--indigo-pale); }
.testimonials__header { text-align: center; margin-bottom: 32px; }
.testimonials__rating-bar { display: inline-flex; align-items: center; gap: 14px; background: var(--blanc); padding: 12px 22px; border-radius: 999px; box-shadow: 0 6px 20px rgba(0,0,0,0.06); margin-bottom: 18px; }
.testimonials__rating-bar img { height: 22px; width: auto; }
.testimonials__rating-stars { color: var(--jaune); font-size: 18px; letter-spacing: 2px; }
.testimonials__rating-val { font-family: var(--f-h); font-weight: 900; font-size: 18px; color: var(--txt); }
.testimonials__rating-count { font-size: 13px; color: var(--txt-soft); font-weight: 600; }
.trustindex-widget { background: var(--blanc); border-radius: 20px; padding: 32px; box-shadow: 0 8px 24px rgba(0,0,0,0.06); margin-bottom: 24px; min-height: 280px; display: flex; align-items: center; justify-content: center; text-align: center; color: var(--txt-soft); font-size: 14px; }
.trustindex-widget__placeholder { padding: 40px 20px; border: 2px dashed var(--gray-border); border-radius: 12px; }
.trustindex-widget__placeholder strong { display: block; font-family: var(--f-h); font-weight: 700; color: var(--txt); margin-bottom: 6px; }

.geo { padding: 80px 0; background: var(--blanc); }
.geo__inner { display: grid; grid-template-columns: 1fr 1.2fr; gap: 48px; align-items: center; }
.geo__label { font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 14px; }
.geo__title { text-align: left; margin-bottom: 18px; }
.geo__desc { color: var(--txt); font-size: 15px; margin-bottom: 24px; }
.geo__map { background: var(--gray-soft); border-radius: 20px; padding: 32px; }
.geo__map h3 { font-size: 14px; margin-bottom: 16px; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.1em; font-weight: 700; }
.geo__cities { display: flex; flex-wrap: wrap; gap: 8px; }
.geo-city { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; background: var(--blanc); color: var(--indigo); border-radius: 999px; font-size: 13px; font-weight: 600; transition: all 220ms var(--ease); border: 1px solid var(--gray-border); }
.geo-city:hover { background: var(--indigo); color: var(--blanc); transform: translateY(-2px); border-color: var(--indigo); }
.geo-city::before { content: "📍"; font-size: 11px; }

.timeline { padding: 80px 0; background: var(--indigo-pale); }
.timeline__header { text-align: center; margin-bottom: 48px; }
.timeline__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; max-width: 1100px; margin: 0 auto; position: relative; }
.timeline__grid::before { content: ""; position: absolute; top: 38px; left: 10%; right: 10%; height: 2px; background: repeating-linear-gradient(90deg, var(--indigo) 0 8px, transparent 8px 16px); z-index: 0; }
.timeline-step { text-align: center; position: relative; z-index: 1; }
.timeline-step__day { display: inline-block; font-family: var(--f-h); font-weight: 900; font-size: 13px; color: var(--blanc); background: var(--indigo); padding: 5px 12px; border-radius: 999px; margin-bottom: 12px; letter-spacing: 0.05em; }
.timeline-step__icon { width: 76px; height: 76px; border-radius: 50%; background: var(--blanc); display: flex; align-items: center; justify-content: center; margin: 0 auto 14px; color: var(--indigo); box-shadow: 0 6px 16px rgba(72,84,245,0.15); }
.timeline-step__icon svg { width: 32px; height: 32px; }
.timeline-step__title { font-family: var(--f-h); font-weight: 700; font-size: 15px; color: var(--txt); margin-bottom: 4px; }
.timeline-step__desc { font-size: 13px; color: var(--txt-soft); line-height: 1.5; }

.faq { padding: 80px 0; background: var(--blanc); }
.faq__header { text-align: center; max-width: 700px; margin: 0 auto 48px; }
.faq__list { max-width: 900px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items: start; }
.faq__item { background: var(--blanc); border: 1px solid var(--gray-border); border-radius: 12px; overflow: hidden; transition: all 280ms var(--ease); }
.faq__item:hover { border-color: var(--indigo); box-shadow: 0 8px 20px -10px rgba(72,84,245,0.25); }
.faq__item[data-open] { border-color: var(--indigo); background: var(--indigo-pale); }
.faq__trigger { width: 100%; background: none; border: 0; text-align: left; padding: 18px 22px; font-family: inherit; font-size: 15px; font-weight: 700; color: var(--txt); display: flex; justify-content: space-between; align-items: center; cursor: pointer; gap: 14px; line-height: 1.35; }
.faq__item[data-open] .faq__trigger { color: var(--indigo); }
.faq__trigger::after { content: ''; width: 26px; height: 26px; flex-shrink: 0; background: var(--indigo-pale); border-radius: 50%; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%234854f5'><path d='M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z'/></svg>"); background-repeat: no-repeat; background-position: center; background-size: 16px; transition: all 220ms var(--ease); }
.faq__trigger[aria-expanded="true"]::after { background-color: var(--indigo); background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fcc930'><path d='M19 13H5v-2h14v2z'/></svg>"); }
.faq__panel { padding: 0 22px 18px; color: var(--txt-soft); display: none; line-height: 1.65; font-size: 13.5px; }
.faq__panel.is-open { display: block; }
.faq__panel p { margin-bottom: 8px; }
.faq__panel strong { color: var(--txt); }

.final-cta { padding: 80px 0; background: var(--blanc); }
.final-cta__inner { display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); border-radius: 24px; padding: 48px; color: var(--blanc); position: relative; overflow: hidden; align-items: center; }
.final-cta__inner::before { content: ""; position: absolute; top: -100px; right: -100px; width: 300px; height: 300px; background: rgba(252,201,48,0.15); border-radius: 50%; }
.final-cta__inner::after { content: ""; position: absolute; bottom: -80px; left: -80px; width: 250px; height: 250px; background: rgba(230,45,51,0.15); border-radius: 50%; }
.final-cta__content { position: relative; z-index: 2; }
.final-cta__label { display: inline-block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; color: var(--jaune); margin-bottom: 14px; padding: 6px 14px; background: rgba(252,201,48,0.15); border-radius: 999px; }
.final-cta h2 { color: var(--blanc); text-align: left; margin-bottom: 16px; }
.final-cta__sub { font-size: 16px; opacity: 0.92; margin-bottom: 24px; }
.final-cta__contact { display: flex; flex-direction: column; gap: 14px; font-size: 14px; }
.final-cta__contact-item { display: flex; gap: 12px; align-items: flex-start; }
.final-cta__contact-item svg { width: 20px; height: 20px; flex-shrink: 0; color: var(--jaune); margin-top: 2px; }
.final-cta__contact-item strong { display: block; font-weight: 700; }
.devis-form { position: relative; z-index: 2; background: var(--blanc); border-radius: 18px; padding: 28px; color: var(--txt); box-shadow: 0 20px 50px rgba(0,0,0,0.2); }
.devis-form h3 { font-family: var(--f-h); font-weight: 900; font-size: 20px; color: var(--txt); margin-bottom: 6px; text-align: left; }
.devis-form__intro { font-size: 13px; color: var(--txt-soft); margin-bottom: 18px; }
.devis-form__field { margin-bottom: 12px; }
.devis-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.devis-form input, .devis-form select, .devis-form textarea { width: 100%; padding: 12px 14px; border: 1px solid var(--gray-border); border-radius: 8px; font-family: inherit; font-size: 14px; color: var(--txt); background: var(--blanc); transition: border-color 220ms var(--ease); }
.devis-form input:focus, .devis-form select:focus, .devis-form textarea:focus { outline: 0; border-color: var(--indigo); }
.devis-form textarea { min-height: 80px; resize: vertical; }
.devis-form__rgpd-text { font-size: 11px; color: var(--txt-soft); margin: 12px 0 0; line-height: 1.45; text-align: center; }
.devis-form__rgpd-text a { color: var(--indigo); text-decoration: underline; }
.devis-form__btn { width: 100%; background: var(--rouge); color: var(--blanc); padding: 14px 20px; border-radius: 8px; font-family: inherit; font-weight: 700; font-size: 15px; border: 0; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 10px; transition: all 280ms var(--ease); }
.devis-form__btn:hover { background: var(--rouge-dark); transform: translateY(-2px); box-shadow: 0 10px 24px -10px rgba(230,45,51,0.5); }

.footer { background: var(--blanc); padding: 0; border-top: 1px solid var(--gray-border); }
.footer-newsletter { background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); padding: 48px 0; color: var(--blanc); position: relative; overflow: hidden; }
.footer-newsletter::before { content: ""; position: absolute; top: -80px; right: -80px; width: 250px; height: 250px; background: rgba(252,201,48,0.12); border-radius: 50%; }
.footer-newsletter__inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; position: relative; z-index: 2; }
.footer-newsletter h3 { color: var(--blanc); font-size: 26px; margin-bottom: 8px; }
.footer-newsletter p { opacity: 0.9; font-size: 15px; margin: 0; }
.footer-newsletter__form { display: flex; gap: 8px; background: var(--blanc); padding: 6px; border-radius: 999px; }
.footer-newsletter__form input { flex: 1; border: 0; background: transparent; padding: 12px 18px; font-family: inherit; font-size: 14px; color: var(--txt); outline: none; }
.footer-newsletter__form button { background: var(--rouge); color: var(--blanc); padding: 12px 24px; border: 0; border-radius: 999px; font-family: inherit; font-weight: 700; font-size: 14px; cursor: pointer; transition: background 220ms var(--ease); display: inline-flex; align-items: center; gap: 8px; }
.footer-newsletter__form button:hover { background: var(--rouge-dark); }
.footer-main { padding: 64px 0 32px; }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: 56px; padding-bottom: 40px; border-bottom: 1px solid var(--gray-border); }
.footer-col h4 { font-family: var(--f-h); font-size: 13px; font-weight: 700; color: var(--txt); margin-bottom: 18px; text-transform: uppercase; letter-spacing: 0.12em; padding-bottom: 10px; border-bottom: 2px solid var(--indigo); display: inline-block; }
.footer-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.footer-col ul a { font-size: 14px; color: var(--txt-soft); transition: all 220ms var(--ease); display: inline-flex; align-items: center; gap: 6px; }
.footer-col ul a:hover { color: var(--indigo); transform: translateX(4px); }
.footer-col ul a::before { content: "›"; color: var(--indigo); font-weight: 900; }
.footer-brand__logo img { height: 72px; margin-bottom: 16px; }
.footer-brand__tagline { color: var(--txt-soft); font-size: 14px; line-height: 1.6; margin-bottom: 20px; max-width: 32ch; }
.footer-nap { font-style: normal; font-size: 14px; color: var(--txt); margin-bottom: 18px; }
.footer-nap p { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 8px; line-height: 1.5; }
.footer-nap p svg { width: 16px; height: 16px; color: var(--indigo); flex-shrink: 0; margin-top: 2px; }
.footer-nap strong { display: block; font-weight: 700; color: var(--txt); }
.footer-nap a { color: var(--txt); font-weight: 600; }
.footer-nap a:hover { color: var(--indigo); }
.footer-rge { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.footer-rge img { width: 100%; height: auto; max-height: 70px; object-fit: contain; background: var(--blanc); border-radius: 8px; padding: 8px; border: 1px solid var(--gray-border); }
.footer-rge__note { grid-column: 1 / -1; font-size: 11px; color: var(--txt-soft); margin-top: 6px; text-align: center; line-height: 1.4; }
.footer-bottom { padding-top: 24px; display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; }
.footer-bottom__socials { display: flex; gap: 12px; list-style: none; padding: 0; margin: 0; }
.footer-bottom__socials a { width: 36px; height: 36px; border-radius: 50%; background: var(--gray-soft); display: inline-flex; align-items: center; justify-content: center; color: var(--indigo); transition: all 220ms var(--ease); border: 1px solid var(--gray-border); }
.footer-bottom__socials a:hover { background: var(--indigo); color: var(--blanc); transform: translateY(-2px); border-color: var(--indigo); }
.footer-bottom__socials svg { width: 16px; height: 16px; }
.footer-bottom__hours { font-size: 13px; color: var(--txt-soft); display: inline-flex; align-items: center; gap: 8px; }
.footer-bottom__hours svg { width: 14px; height: 14px; color: var(--indigo); }

.subfooter { background: #1a1a1a; color: var(--blanc); padding: 18px 0; font-size: 12.5px; }
.subfooter__inner { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.subfooter__legal { display: flex; gap: 16px; flex-wrap: wrap; }
.subfooter a { color: rgba(255,255,255,0.85); transition: color 220ms; }
.subfooter a:hover { color: var(--jaune); }
.subfooter__rankit { color: rgba(255,255,255,0.85); }
.subfooter__rankit strong { color: var(--jaune); }

.sticky-mobile { display: none; position: fixed; bottom: 0; left: 0; right: 0; background: var(--blanc); padding: 10px; gap: 8px; z-index: 99; box-shadow: 0 -4px 16px rgba(0,0,0,0.1); }
.sticky-mobile a { flex: 1; text-align: center; padding: 10px 8px; border-radius: 6px; font-weight: 700; font-size: 13px; line-height: 1.2; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.sticky-mobile a small { font-size: 10px; font-weight: 500; opacity: 0.95; text-transform: uppercase; letter-spacing: 0.04em; }
.sticky-mobile__tel { background: #25D366; color: var(--blanc); }
.sticky-mobile__devis { background: var(--rouge); color: var(--blanc); }

.reveal { opacity: 0; transform: translateY(24px); transition: opacity 600ms var(--ease), transform 600ms var(--ease); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 1080px) {
  .hero__grid, .case__inner, .geo__inner, .final-cta__inner, .info__grid, .swap__compare { grid-template-columns: 1fr; gap: 32px; }
  .trust-strip__inner { grid-template-columns: repeat(2, 1fr); gap: 18px; }
  .conv-cards__grid, .why__grid, .testimonials__grid, .case__stats, .brands__grid, .climate__grid { grid-template-columns: 1fr 1fr; }
  .mini-form__inner { grid-template-columns: 1fr; gap: 16px; text-align: center; }
  .mini-form__form { grid-template-columns: 1fr 1fr; }
  .mini-form__form button { grid-column: 1 / -1; justify-content: center; }
  .hero__ctas { flex-direction: column; align-items: stretch; }
  .hero__ctas .btn-primary, .hero__ctas .btn-tel-strong { justify-content: center; }
  .timeline__grid { grid-template-columns: repeat(2, 1fr); }
  .timeline__grid::before { display: none; }
  .calc__form { grid-template-columns: 1fr; }
  .models__table { background: transparent; box-shadow: none; }
  .models__row { display: block; background: var(--blanc); border-radius: 16px; padding: 20px; margin-bottom: 12px; box-shadow: 0 4px 16px rgba(0,0,0,0.06); border-bottom: 0; }
  .models__row.models__row--head { display: none !important; }
  .models__row .models__model { font-size: 16px; margin-bottom: 4px; padding-bottom: 8px; border-bottom: 1px solid var(--gray-border); }
  .models__row .models__model small { font-size: 11px; }
  .models__row .models__capacity { display: inline-block; margin-top: 12px; padding: 4px 10px; background: var(--indigo); color: var(--blanc); border-radius: 999px; font-size: 12px; font-weight: 700; }
  .models__row .models__people { display: inline-block; margin: 12px 0 12px 8px; color: var(--txt-soft); font-size: 13px; }
  .models__row .models__price, .models__row .models__price-final { display: block; margin-top: 6px; padding-top: 12px; border-top: 1px dashed var(--gray-border); font-size: 15px; }
  .models__row .models__price-final { padding-top: 6px; border-top: 0; }
  .models__row .models__price::before { content: "Prix TTC posé : "; font-size: 11px; color: var(--txt-soft); font-weight: 500; text-transform: uppercase; letter-spacing: 0.05em; display: block; margin-bottom: 2px; }
  .models__row .models__price-final::before { content: "Reste à charge après aides : "; font-size: 11px; color: var(--txt-soft); font-weight: 500; text-transform: uppercase; letter-spacing: 0.05em; display: block; margin-bottom: 2px; }
  .models__row .models__price small, .models__row .models__price-final small { display: none; }
  .faq__list { grid-template-columns: 1fr; }
  .brands__grid, .climate__grid { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .conv-cards__grid, .why__grid, .testimonials__grid, .case__stats { grid-template-columns: 1fr; }
  .mini-form__form { grid-template-columns: 1fr; }
  .mini-form__form select, .mini-form__form input { font-size: 16px; }
  .mini-form__trust { gap: 8px 14px; }
  .devis-form__row { grid-template-columns: 1fr; }
  .calc__inner, .final-cta__inner { padding: 32px 24px; }
  .calc__result { grid-template-columns: 1fr; text-align: center; }
  .sticky-mobile { display: flex; }
  body { padding-bottom: 72px; }
  .footer-newsletter__inner { grid-template-columns: 1fr; gap: 20px; text-align: center; }
  .footer-grid { grid-template-columns: 1fr; gap: 32px; }
  .footer-bottom { flex-direction: column; gap: 16px; text-align: center; }
  .subfooter__inner { flex-direction: column; gap: 8px; text-align: center; }
  .subfooter__legal { justify-content: center; }
  .timeline__grid { grid-template-columns: 1fr; gap: 12px; }
  .timeline-step { display: grid; grid-template-columns: auto 1fr; gap: 16px; text-align: left; background: var(--blanc); border-radius: 14px; padding: 14px 16px; align-items: center; }
  .timeline-step__day { grid-column: 1; grid-row: 1 / 3; align-self: center; margin: 0; width: 56px; text-align: center; padding: 8px 4px; font-size: 12px; }
  .timeline-step__icon { display: none; }
  .timeline-step__title { grid-column: 2; grid-row: 1; margin: 0; font-size: 14px; }
  .timeline-step__desc { grid-column: 2; grid-row: 2; font-size: 12.5px; }
}

/* ============ AEO / EDITORIAL ENHANCERS ============ */
.aeo-answer { font-size: 17px; font-weight: 700; color: var(--txt); background: var(--indigo-pale); border-left: 4px solid var(--indigo); padding: 14px 20px; border-radius: 0 10px 10px 0; margin: 0 auto 22px; max-width: 820px; line-height: 1.55; }
.aeo-answer strong { color: var(--indigo); font-weight: 900; }
.service-list { list-style: none; padding: 0; margin: 14px auto 22px; max-width: 820px; display: grid; gap: 8px; }
.service-list li { position: relative; padding: 10px 14px 10px 36px; background: var(--blanc); border: 1px solid var(--gray-border); border-radius: 8px; font-size: 14.5px; line-height: 1.55; color: var(--txt); }
.service-list li::before { content: "✓"; position: absolute; left: 12px; top: 10px; width: 18px; height: 18px; background: var(--indigo); color: var(--blanc); border-radius: 50%; font-size: 11px; font-weight: 900; display: flex; align-items: center; justify-content: center; line-height: 1; }
.service-list li strong { color: var(--indigo); font-weight: 700; }
.compare-table { width: 100%; max-width: 820px; margin: 18px auto 24px; border-collapse: collapse; background: var(--blanc); border-radius: 12px; overflow: hidden; box-shadow: 0 6px 20px -12px rgba(0,0,0,0.1); font-size: 14px; }
.compare-table thead { background: var(--indigo); color: var(--blanc); }
.compare-table th { padding: 12px 14px; text-align: left; font-family: var(--f-h); font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: 0.05em; }
.compare-table td { padding: 12px 14px; border-top: 1px solid var(--gray-border); vertical-align: top; line-height: 1.5; }
.compare-table tbody tr:nth-child(even) { background: var(--gray-soft); }
.compare-table tbody tr:hover { background: var(--indigo-pale); }
.compare-table strong { color: var(--indigo); }
@media (max-width: 700px) {
  .compare-table { font-size: 13px; }
  .compare-table th, .compare-table td { padding: 10px 8px; }
  .aeo-answer { font-size: 15.5px; padding: 12px 16px; }
}

/* ============ CRO LEVIERS (eyebrow partagé) ============ */
.cro-eyebrow { display: inline-block; font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 12px; }
.cro-container-narrow { max-width: 1100px; margin: 0 auto; padding: 0 24px; }

/* ============ LEVIER 1 ; DOULEUR EN CHIFFRES FROIDS ============ */
.pain-numbers { padding: 80px 0; background: var(--indigo-pale); }
.pain-numbers__head { text-align: center; max-width: 760px; margin: 0 auto 32px; }
.pain-numbers__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 32px 0; }
.pain-numbers__card { background: var(--blanc); padding: 32px 20px; border-radius: 16px; text-align: center; border: 1px solid var(--gray-border); box-shadow: 0 8px 24px -16px rgba(0,0,0,0.08); }
.pain-numbers__amount { font-family: var(--f-h); font-weight: 900; font-size: 48px; line-height: 1; color: var(--rouge); margin-bottom: 10px; letter-spacing: -0.02em; }
.pain-numbers__label { font-family: var(--f-body); font-weight: 500; font-size: 14px; line-height: 1.5; color: var(--txt-soft); }
.pain-numbers__conclusion { font-family: var(--f-body); font-weight: 500; font-size: 17px; line-height: 1.7; color: var(--txt); text-align: center; max-width: 760px; margin: 16px auto 0; }
.pain-numbers__conclusion strong { color: var(--indigo); font-weight: 900; }
@media (max-width: 700px) {
  .pain-numbers__grid { grid-template-columns: 1fr; }
  .pain-numbers__amount { font-size: 40px; }
  .pain-numbers { padding: 56px 0; }
}

/* ============ LEVIER 2 ; GARANTIES EN ENCART ============ */
.guarantees { padding: 80px 0; background: var(--blanc); }
.guarantees__head { text-align: center; max-width: 760px; margin: 0 auto 32px; }
.guarantees__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; margin-top: 32px; }
.guarantees__card { background: var(--indigo-pale); border-radius: 14px; padding: 24px 16px; text-align: center; transition: transform 320ms var(--ease), box-shadow 320ms var(--ease); border: 1px solid var(--gray-border); }
.guarantees__card:hover { transform: translateY(-4px); box-shadow: 0 16px 32px -16px rgba(72,84,245,0.25); border-color: var(--indigo); }
.guarantees__icon { font-size: 32px; line-height: 1; margin-bottom: 14px; }
.guarantees__title { font-family: var(--f-h); font-weight: 800; font-size: 15px; color: var(--indigo); margin-bottom: 8px; line-height: 1.3; }
.guarantees__detail { font-family: var(--f-body); font-weight: 400; font-size: 13px; line-height: 1.5; color: var(--txt); }
@media (max-width: 1080px) { .guarantees__grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 700px) {
  .guarantees__grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .guarantees { padding: 56px 0; }
}
@media (max-width: 480px) { .guarantees__grid { grid-template-columns: 1fr; } }

/* ============ LEVIER 4 ; STACK OFFER EMPILÉ ============ */
.stack-offer { padding: 80px 0; background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); color: var(--blanc); position: relative; overflow: hidden; }
.stack-offer::before { content: ""; position: absolute; top: -80px; right: -80px; width: 280px; height: 280px; background: rgba(252,201,48,0.12); border-radius: 50%; }
.stack-offer::after { content: ""; position: absolute; bottom: -100px; left: -100px; width: 320px; height: 320px; background: rgba(230,45,51,0.08); border-radius: 50%; }
.stack-offer__head { text-align: center; max-width: 760px; margin: 0 auto 32px; position: relative; z-index: 2; }
.stack-offer__head .cro-eyebrow { color: var(--jaune); }
.stack-offer__head h2 { color: var(--blanc); }
.stack-offer__list { list-style: none; padding: 0; max-width: 760px; margin: 32px auto 0; position: relative; z-index: 2; background: rgba(255,255,255,0.06); border-radius: 16px; padding: 24px 28px; border: 1px solid rgba(255,255,255,0.12); backdrop-filter: blur(6px); }
.stack-offer__item { display: flex; gap: 16px; align-items: flex-start; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,0.14); }
.stack-offer__item:last-child { border-bottom: 0; }
.stack-offer__check { background: var(--jaune); color: var(--indigo); width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 900; font-family: var(--f-h); flex-shrink: 0; margin-top: 2px; font-size: 15px; }
.stack-offer__item-body strong { font-family: var(--f-h); font-weight: 700; font-size: 16px; color: var(--blanc); display: block; line-height: 1.4; }
.stack-offer__value { font-family: var(--f-body); font-weight: 400; font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,0.78); display: block; margin-top: 2px; }
.stack-offer__cta-text { text-align: center; margin-top: 28px; font-family: var(--f-body); font-weight: 600; font-size: 17px; line-height: 1.55; color: var(--jaune); position: relative; z-index: 2; }
.stack-offer__cta-text strong { font-weight: 900; }
@media (max-width: 700px) {
  .stack-offer { padding: 56px 0; }
  .stack-offer__list { padding: 16px 18px; }
  .stack-offer__item-body strong { font-size: 15px; }
}

/* === preview-installateur-pompe-a-chaleur-villefranche.html === */

:root {
  --indigo: #4854f5; --indigo-dark: #3a44d4; --indigo-pale: #eff0ff;
  --rouge: #e62d33; --rouge-dark: #c22128; --jaune: #fcc930;
  --vert: #25D366; --vert-dark: #1ca64c;
  --txt: #444444; --txt-soft: #6b6b6b;
  --gray-border: #e5e7eb; --gray-soft: #f9f9fb;
  --blanc: #ffffff;
  --f-body: 'Raleway', Helvetica, Arial, Lucida, sans-serif;
  --f-h: 'Lato', Helvetica, Arial, Lucida, sans-serif;
  --ease: cubic-bezier(0.32, 0.72, 0, 1);
}
*, *::before, *::after { box-sizing: border-box; min-width: 0; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: var(--f-body); font-size: 15px; line-height: 1.7; color: var(--txt); background: var(--blanc); -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; display: block; }
h1, h2, h3, h4 { font-family: var(--f-h); color: var(--txt); font-weight: 700; line-height: 1.25; margin: 0 0 0.5em; }
h1 { font-size: clamp(34px, 4.5vw, 50px); }
h2 { font-size: clamp(26px, 3vw, 36px); text-align: center; }
h3 { font-size: 20px; }
p { margin: 0 0 1em; }
a { color: var(--indigo); text-decoration: none; transition: color 220ms var(--ease); }
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }

.top-bar { background: var(--indigo); color: var(--blanc); font-size: 12.5px; padding: 9px 0; }
.top-bar__inner { display: flex; justify-content: flex-start; align-items: center; gap: 18px; }
.top-bar__phone { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: var(--blanc); }
.top-bar__hours { display: inline-flex; align-items: center; gap: 5px; color: rgba(255,255,255,0.85); font-size: 12px; }
.top-bar__rating { display: inline-flex; align-items: center; gap: 5px; color: var(--blanc); font-size: 12px; font-weight: 600; margin-left: auto; }
.top-bar__socials { display: flex; gap: 4px; list-style: none; padding: 0; margin: 0; }
.top-bar__socials a { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; transition: background 220ms var(--ease); color: var(--blanc); }
.top-bar__socials a:hover { background: rgba(255,255,255,0.18); }
.top-bar__cta { background: var(--rouge); padding: 6px 14px; border-radius: 6px; font-weight: 700; transition: all 220ms var(--ease); font-size: 12.5px; color: var(--blanc); }
.top-bar__cta:hover { background: var(--rouge-dark); transform: translateY(-1px); }
.top-bar__avis { background: rgba(255,255,255,0.15); padding: 6px 12px; border-radius: 6px; font-weight: 500; font-size: 12.5px; color: var(--blanc); }

.header { background: var(--blanc); padding: 14px 0; border-bottom: 1px solid rgba(0,0,0,0.05); position: sticky; top: 0; z-index: 100; transition: box-shadow 220ms var(--ease); }
.header__inner { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.header__logo img { height: 64px; transition: height 220ms; }

.nav > ul { list-style: none; padding: 0; margin: 0; display: flex; gap: 2px; align-items: center; }
.nav > ul > li { position: relative; }
.nav > ul > li > a { display: inline-flex; align-items: center; padding: 10px 14px; color: var(--txt); font-size: 14.5px; font-weight: 600; transition: all 220ms var(--ease); border-radius: 6px; }
.nav > ul > li > a:hover { color: var(--indigo); background: var(--indigo-pale); }
.nav__cta { background: var(--rouge) !important; color: var(--blanc) !important; padding: 10px 18px !important; }
.nav__cta:hover { background: var(--rouge-dark) !important; color: var(--blanc) !important; }

.nav__has-mega .mega { position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(8px); min-width: 1080px; background: var(--blanc); box-shadow: 0 24px 60px -16px rgba(0,0,0,0.18); border-radius: 16px; padding: 28px; opacity: 0; visibility: hidden; transition: all 280ms var(--ease); z-index: 200; border: 1px solid var(--gray-border); }
.nav__has-mega:hover .mega, .nav__has-mega:focus-within .mega { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.mega__inner { display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px; }
.mega-col { display: flex; flex-direction: column; gap: 10px; }
.mega-col__hub { display: flex; align-items: center; gap: 10px; font-family: var(--f-h); font-weight: 700; font-size: 14.5px; color: var(--txt); padding: 8px 10px; border-radius: 8px; transition: all 220ms var(--ease); border-bottom: 2px solid var(--indigo-pale); padding-bottom: 12px; margin-bottom: 4px; }
.mega-col__hub:hover { color: var(--indigo); background: var(--indigo-pale); }
.mega-col__icon { flex-shrink: 0; width: 32px; height: 32px; border-radius: 8px; display: flex; align-items: center; justify-content: center; }
.mega-col__icon svg { width: 18px; height: 18px; }
.mega-col__icon--yellow { background: rgba(252,201,48,0.18); color: #d4a01a; }
.mega-col__icon--red { background: rgba(230,45,51,0.12); color: var(--rouge); }
.mega-col__icon--blue { background: rgba(72,84,245,0.12); color: var(--indigo); }
.mega-col__icon--cyan { background: rgba(56,189,248,0.15); color: #0c8aab; }
.mega-col__icon--green { background: rgba(34,197,94,0.15); color: #1ca64c; }
.mega-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 2px; }
.mega-col ul a { display: block; padding: 7px 10px; font-size: 13px; color: var(--txt-soft); border-radius: 6px; transition: all 180ms var(--ease); line-height: 1.4; }
.mega-col ul a:hover { color: var(--indigo); background: var(--gray-soft); padding-left: 14px; }
.mega--small { min-width: 240px !important; padding: 12px !important; }
.mega__inner--small { display: block !important; grid-template-columns: none !important; }
.mega-simple { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 1px; }
.mega-simple li a { display: block; padding: 9px 12px; font-size: 14px; font-weight: 500; color: var(--txt); border-radius: 6px; transition: all 180ms var(--ease); }
.mega-simple li a:hover { color: var(--indigo); background: var(--indigo-pale); padding-left: 16px; }

.burger { display: none; background: transparent; border: 0; width: 36px; height: 36px; flex-direction: column; justify-content: center; align-items: center; gap: 5px; cursor: pointer; padding: 0; z-index: 1002; }
.burger span { display: block; width: 24px; height: 2px; background: var(--indigo); border-radius: 2px; transition: all 320ms var(--ease); }
body.is-menu-open .burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
body.is-menu-open .burger span:nth-child(2) { opacity: 0; }
body.is-menu-open .burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
body.is-menu-open { overflow: hidden; }
@media (max-width: 1080px) {
  .top-bar__hours, .top-bar__socials, .top-bar__rating { display: none; }
  .top-bar__inner { gap: 12px; }
  .burger { display: inline-flex; }
  .nav { position: fixed; inset: 0; background: rgba(255,255,255,0.97); backdrop-filter: blur(12px); z-index: 1000; padding: 120px 24px 32px; overflow-y: auto; opacity: 0; visibility: hidden; transition: all 320ms var(--ease); }
  body.is-menu-open .nav { opacity: 1; visibility: visible; }
  .nav > ul { flex-direction: column; gap: 4px; }
  .nav > ul > li { width: 100%; }
  .nav > ul > li > a { font-size: 18px; padding: 14px 16px; width: 100%; justify-content: space-between; }
  .nav__has-mega .mega { position: static; transform: none; min-width: 0; box-shadow: none; border: 0; background: var(--gray-soft); padding: 14px; opacity: 1; visibility: inherit; margin: 6px 0; }
  .mega__inner { grid-template-columns: 1fr !important; gap: 16px; }
  .header__logo img { height: 48px; }
  .header { padding: 10px 0; }
}

.breadcrumb { background: var(--gray-soft); padding: 14px 0; font-size: 13px; color: var(--txt-soft); }
.breadcrumb a { color: var(--txt-soft); }
.breadcrumb a:hover { color: var(--indigo); }
.breadcrumb__sep { margin: 0 8px; opacity: 0.4; }

.hero { padding: 50px 0 70px; background: var(--blanc); }
.hero__grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 48px; align-items: center; }
.hero__pretitle { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 16px; padding: 8px 14px; background: var(--indigo-pale); border-radius: 999px; }
.hero__pretitle::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--indigo); }
.hero__title { margin: 0 0 18px; }
.hero__title strong { color: var(--indigo); font-weight: 900; }
.hero__sub { font-size: 17px; color: var(--txt-soft); margin-bottom: 24px; max-width: 56ch; line-height: 1.55; }
.hero__sub strong { color: var(--txt); font-weight: 700; }
.hero__ctas { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 24px; }
.btn-primary { display: inline-flex; align-items: center; gap: 10px; background: var(--rouge); color: var(--blanc); padding: 16px 28px; border-radius: 8px; font-weight: 700; font-size: 15px; transition: all 280ms var(--ease); font-family: var(--f-body); border: 0; cursor: pointer; }
.btn-primary:hover { background: var(--rouge-dark); color: var(--blanc); transform: translateY(-2px); box-shadow: 0 10px 24px -10px rgba(230,45,51,0.5); }
.btn-indigo { display: inline-flex; align-items: center; gap: 8px; background: var(--indigo); color: var(--blanc); padding: 12px 22px; border-radius: 6px; font-weight: 700; font-size: 14px; transition: all 280ms var(--ease); border: 0; cursor: pointer; font-family: var(--f-body); }
.btn-indigo:hover { background: var(--indigo-dark); color: var(--blanc); transform: translateY(-2px); }
.btn-tel-strong { display: inline-flex; align-items: center; gap: 12px; background: var(--indigo); color: var(--blanc); padding: 12px 22px; border-radius: 8px; font-weight: 700; transition: all 280ms var(--ease); }
.btn-tel-strong:hover { background: var(--indigo-dark); color: var(--blanc); transform: translateY(-2px); box-shadow: 0 10px 24px -10px rgba(72,84,245,0.5); }
.btn-tel-strong svg { width: 22px; height: 22px; flex-shrink: 0; color: var(--jaune); }
.btn-tel-strong > div { display: flex; flex-direction: column; line-height: 1.15; text-align: left; }
.btn-tel-strong strong { font-size: 17px; font-weight: 900; font-family: var(--f-h); letter-spacing: 0.02em; }
.btn-tel-strong small { font-size: 10px; font-weight: 600; opacity: 0.85; text-transform: uppercase; letter-spacing: 0.06em; margin-top: 2px; }

.hero__badges { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 22px; }
.hero__badge-item { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; background: var(--gray-soft); border: 1px solid var(--gray-border); border-radius: 999px; font-size: 12.5px; font-weight: 600; color: var(--txt); }
.hero__badge-item svg { width: 14px; height: 14px; color: var(--indigo); }
.hero__visual { position: relative; }
.hero__img { border-radius: 20px; overflow: hidden; aspect-ratio: 5/6; box-shadow: 0 24px 60px -20px rgba(0,0,0,0.18); }
.hero__img img { width: 100%; height: 100%; object-fit: cover; }
.hero__badge { position: absolute; top: -16px; right: -16px; background: var(--jaune); color: var(--txt); padding: 14px 20px; border-radius: 14px; box-shadow: 0 12px 30px rgba(0,0,0,0.15); font-family: var(--f-h); font-weight: 900; text-align: center; line-height: 1.2; }
.hero__badge small { display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; opacity: 0.85; margin-bottom: 2px; }
.hero__badge strong { display: block; font-size: 22px; }
.hero__rating { position: absolute; bottom: -20px; left: -20px; background: var(--blanc); border-radius: 14px; box-shadow: 0 12px 30px rgba(0,0,0,0.12); padding: 14px 18px; display: flex; align-items: center; gap: 12px; }
.hero__rating-stars { color: var(--jaune); font-size: 16px; letter-spacing: 2px; }
.hero__rating-text { font-size: 12px; color: var(--txt-soft); line-height: 1.3; }
.hero__rating-text strong { display: block; font-family: var(--f-h); font-weight: 900; color: var(--txt); font-size: 16px; }

.mini-form { background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); padding: 56px 0; color: var(--blanc); position: relative; overflow: hidden; }
.mini-form::before { content: ""; position: absolute; top: -80px; right: -80px; width: 280px; height: 280px; background: rgba(252,201,48,0.12); border-radius: 50%; }
.mini-form::after { content: ""; position: absolute; bottom: -100px; left: -100px; width: 320px; height: 320px; background: rgba(230,45,51,0.08); border-radius: 50%; }
.mini-form__inner { position: relative; z-index: 2; max-width: 900px; margin: 0 auto; text-align: center; }
.mini-form__pretitle { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; color: var(--jaune); text-transform: uppercase; letter-spacing: 0.18em; margin-bottom: 14px; padding: 6px 16px; background: rgba(252,201,48,0.15); border-radius: 999px; }
.mini-form__title { font-family: var(--f-h); font-weight: 900; font-size: clamp(26px, 3.2vw, 34px); margin: 0 0 10px; line-height: 1.2; color: var(--blanc); }
.mini-form__subtitle { font-size: 16px; opacity: 0.92; margin: 0 auto 28px; max-width: 600px; line-height: 1.5; }
.mini-form__subtitle strong { font-weight: 700; color: var(--jaune); }
.mini-form__form { display: grid; grid-template-columns: 1fr 1.2fr 1.1fr auto; gap: 10px; max-width: 820px; margin: 0 auto; background: rgba(255,255,255,0.08); padding: 12px; border-radius: 16px; border: 1px solid rgba(255,255,255,0.18); backdrop-filter: blur(10px); }
.mini-form__form input, .mini-form__form select { padding: 16px 18px; border: 0; background: var(--blanc); color: var(--txt); border-radius: 10px; font-family: inherit; font-size: 15px; font-weight: 500; outline: 0; min-width: 0; }
.mini-form__form input::placeholder { color: var(--txt-soft); }
.mini-form__form button { background: var(--rouge); color: var(--blanc); padding: 16px 28px; border-radius: 10px; font-family: inherit; font-weight: 800; font-size: 15px; border: 0; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px; transition: all 280ms var(--ease); white-space: nowrap; box-shadow: 0 4px 16px rgba(0,0,0,0.15); }
.mini-form__form button:hover { background: var(--rouge-dark); transform: translateY(-2px); box-shadow: 0 12px 28px -8px rgba(230,45,51,0.7); }
.mini-form__trust { display: flex; gap: 28px; flex-wrap: wrap; justify-content: center; margin-top: 22px; font-size: 13px; opacity: 0.92; font-weight: 500; }
.mini-form__trust span { display: inline-flex; align-items: center; gap: 6px; }
.mini-form__trust span::before { content: "✓"; color: var(--jaune); font-weight: 900; }

.trust-strip { background: var(--indigo-pale); padding: 28px 0; }
.trust-strip__inner { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; align-items: center; }
.trust-item { display: flex; align-items: center; gap: 14px; }
.trust-item__icon { flex-shrink: 0; width: 48px; height: 48px; background: var(--blanc); border-radius: 12px; display: flex; align-items: center; justify-content: center; color: var(--indigo); }
.trust-item__icon svg { width: 26px; height: 26px; }
.trust-item__text { font-size: 13px; line-height: 1.4; color: var(--txt); }
.trust-item__text strong { display: block; font-family: var(--f-h); font-size: 16px; font-weight: 900; color: var(--txt); }

.aeo-answer { font-size: 16.5px; font-weight: 600; color: var(--txt); background: var(--indigo-pale); border-left: 4px solid var(--indigo); padding: 14px 18px; border-radius: 10px; margin: 0 auto 22px; max-width: 760px; line-height: 1.55; text-align: left; }
.aeo-answer strong { color: var(--indigo); font-weight: 800; }

.conv-cards { padding: 80px 0; background: var(--blanc); }
.conv-cards__header { text-align: center; max-width: 760px; margin: 0 auto 48px; }
.conv-cards__label { display: inline-block; font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 12px; }
.conv-cards__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.conv-card { background: var(--blanc); border: 2px solid var(--indigo-pale); border-radius: 20px; padding: 32px 28px; transition: all 320ms var(--ease); position: relative; display: flex; flex-direction: column; }
.conv-card:hover { border-color: var(--indigo); transform: translateY(-4px); box-shadow: 0 20px 40px -16px rgba(72,84,245,0.18); }
.conv-card__icon { width: 48px; height: 48px; background: var(--indigo); color: var(--blanc); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; }
.conv-card__icon svg { width: 24px; height: 24px; }
.conv-card__q { font-family: var(--f-h); font-weight: 700; font-size: 18px; color: var(--txt); margin-bottom: 12px; line-height: 1.3; }
.conv-card__a { font-size: 14px; color: var(--txt-soft); line-height: 1.7; flex: 1; margin-bottom: 18px; }
.conv-card__a strong { color: var(--txt); }
.conv-card__link { color: var(--indigo); font-weight: 700; font-size: 14px; display: inline-flex; align-items: center; gap: 6px; transition: gap 220ms var(--ease); }
.conv-card__link:hover { gap: 10px; }

.cro-eyebrow { display: inline-block; font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 12px; }

.pain-numbers { padding: 80px 0; background: var(--indigo-pale); }
.pain-numbers__head { text-align: center; max-width: 760px; margin: 0 auto 32px; }
.pain-numbers__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 32px 0; }
.pain-numbers__card { background: var(--blanc); padding: 32px 20px; border-radius: 16px; text-align: center; border: 1px solid var(--gray-border); box-shadow: 0 8px 24px -16px rgba(0,0,0,0.08); }
.pain-numbers__amount { font-family: var(--f-h); font-weight: 900; font-size: 48px; line-height: 1; color: var(--rouge); margin-bottom: 10px; letter-spacing: -0.02em; }
.pain-numbers__label { font-family: var(--f-body); font-weight: 500; font-size: 14px; line-height: 1.5; color: var(--txt-soft); }
.pain-numbers__conclusion { font-family: var(--f-body); font-weight: 500; font-size: 17px; line-height: 1.7; color: var(--txt); text-align: center; max-width: 760px; margin: 16px auto 0; }
.pain-numbers__conclusion strong { color: var(--indigo); font-weight: 900; }

.fonctionnement { padding: 80px 0; background: var(--blanc); }
.fonctionnement__inner { max-width: 1000px; margin: 0 auto; }
.fonctionnement__header { text-align: center; max-width: 760px; margin: 0 auto 36px; }
.fonctionnement__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; align-items: center; }
.fonctionnement__steps { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 14px; }
.fonctionnement__steps li { display: flex; gap: 14px; align-items: flex-start; }
.fonctionnement__step-num { flex-shrink: 0; width: 32px; height: 32px; background: var(--indigo); color: var(--blanc); border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-family: var(--f-h); font-weight: 900; font-size: 15px; }
.fonctionnement__step-body strong { font-family: var(--f-h); font-weight: 700; font-size: 15.5px; color: var(--txt); display: block; }
.fonctionnement__step-body span { font-size: 14px; color: var(--txt-soft); line-height: 1.55; }
.fonctionnement__visual { border-radius: 18px; overflow: hidden; aspect-ratio: 4/3; box-shadow: 0 20px 50px -20px rgba(0,0,0,0.2); }
.fonctionnement__visual img { width: 100%; height: 100%; object-fit: cover; }

.guarantees { padding: 80px 0; background: var(--gray-soft); }
.guarantees__head { text-align: center; max-width: 760px; margin: 0 auto 32px; }
.guarantees__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; margin-top: 32px; }
.guarantees__card { background: var(--blanc); border-radius: 14px; padding: 24px 16px; text-align: center; transition: transform 320ms var(--ease), box-shadow 320ms var(--ease); border: 1px solid var(--gray-border); }
.guarantees__card:hover { transform: translateY(-4px); box-shadow: 0 16px 32px -16px rgba(72,84,245,0.25); border-color: var(--indigo); }
.guarantees__icon { font-size: 32px; line-height: 1; margin-bottom: 14px; }
.guarantees__title { font-family: var(--f-h); font-weight: 800; font-size: 15px; color: var(--indigo); margin-bottom: 8px; line-height: 1.3; }
.guarantees__detail { font-family: var(--f-body); font-weight: 400; font-size: 13px; line-height: 1.5; color: var(--txt); }

.models { padding: 80px 0; background: var(--blanc); }
.models__header { text-align: center; max-width: 760px; margin: 0 auto 40px; }
.models__intro { color: var(--txt-soft); font-size: 16px; }
.models__table { background: var(--blanc); border-radius: 20px; overflow: hidden; box-shadow: 0 8px 24px rgba(0,0,0,0.06); margin-bottom: 24px; border: 1px solid var(--gray-border); }
.models__row { display: grid; grid-template-columns: 1fr 1.1fr 1fr 1.1fr 1.1fr; gap: 0; padding: 20px 24px; border-bottom: 1px solid var(--gray-border); align-items: center; }
.models__row:last-child { border-bottom: 0; }
.models__row--head { background: var(--gray-soft); font-family: var(--f-h); font-weight: 700; font-size: 13px; color: var(--txt-soft); text-transform: uppercase; letter-spacing: 0.1em; }
.models__model { font-family: var(--f-h); font-weight: 700; color: var(--txt); }
.models__model small { display: block; font-size: 12px; color: var(--txt-soft); font-weight: 500; margin-top: 2px; }
.models__capacity { font-weight: 600; color: var(--txt); }
.models__people { font-size: 13px; color: var(--txt-soft); }
.models__price { font-family: var(--f-h); font-weight: 900; color: var(--indigo); font-size: 18px; }
.models__price small { display: block; font-size: 11px; color: var(--txt-soft); font-weight: 500; margin-top: 2px; letter-spacing: 0; }
.models__price-final { font-family: var(--f-h); font-weight: 900; color: var(--rouge); font-size: 20px; }
.models__price-final small { display: block; font-size: 11px; color: var(--txt-soft); font-weight: 500; margin-top: 2px; }
.models__note { text-align: center; font-size: 13px; color: var(--txt-soft); font-style: italic; margin-bottom: 32px; }
.models__cta { text-align: center; }

.aides { padding: 80px 0; background: var(--indigo-pale); }
.aides__inner { max-width: 1100px; margin: 0 auto; }
.aides__head { text-align: center; max-width: 760px; margin: 0 auto 36px; }
.aides__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.aides__card { background: var(--blanc); border-radius: 16px; padding: 26px 24px; border: 1px solid var(--gray-border); }
.aides__card-tag { display: inline-block; font-size: 11px; font-weight: 800; color: var(--blanc); background: var(--indigo); padding: 3px 10px; border-radius: 999px; text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 10px; }
.aides__card-tag--cdp { background: var(--rouge); }
.aides__card-tag--mpr { background: #1ca64c; }
.aides__card-tag--cee { background: var(--jaune); color: var(--txt); }
.aides__card-tag--tva { background: #0c8aab; }
.aides__card-title { font-family: var(--f-h); font-weight: 800; font-size: 17px; color: var(--txt); margin-bottom: 8px; }
.aides__card-amount { font-family: var(--f-h); font-weight: 900; font-size: 28px; color: var(--indigo); margin-bottom: 8px; line-height: 1; }
.aides__card-desc { font-size: 13.5px; color: var(--txt-soft); line-height: 1.55; }
.aides__card-desc strong { color: var(--txt); }
.aides__total { background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); color: var(--blanc); border-radius: 16px; padding: 24px 28px; margin-top: 18px; text-align: center; }
.aides__total strong { font-family: var(--f-h); font-weight: 900; font-size: 32px; color: var(--jaune); display: block; line-height: 1.2; }
.aides__total span { font-size: 14px; opacity: 0.92; }

.brands { padding: 80px 0; background: var(--blanc); }
.brands__head { text-align: center; max-width: 760px; margin: 0 auto 36px; }
.brands__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.brand-card { background: var(--gray-soft); border: 1px solid var(--gray-border); border-radius: 16px; padding: 24px 20px; transition: all 280ms var(--ease); }
.brand-card:hover { transform: translateY(-4px); box-shadow: 0 16px 32px -16px rgba(72,84,245,0.25); border-color: var(--indigo); }
.brand-card__name { font-family: var(--f-h); font-weight: 900; font-size: 18px; color: var(--indigo); margin-bottom: 4px; }
.brand-card__model { font-family: var(--f-h); font-weight: 700; font-size: 14px; color: var(--txt); margin-bottom: 12px; }
.brand-card__detail { font-size: 13px; color: var(--txt-soft); line-height: 1.55; margin-bottom: 12px; }
.brand-card__detail strong { color: var(--txt); }
.brand-card__pro { font-size: 12.5px; color: var(--indigo); font-weight: 600; }

.case-local { padding: 80px 0; background: var(--indigo-pale); }
.case-local__inner { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1.2fr; gap: 40px; align-items: center; }
.case-local__visual { border-radius: 18px; overflow: hidden; aspect-ratio: 4/3; box-shadow: 0 20px 50px -20px rgba(0,0,0,0.2); }
.case-local__visual img { width: 100%; height: 100%; object-fit: cover; }
.case-local__label { display: inline-block; font-size: 12px; font-weight: 700; color: var(--rouge); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 12px; padding: 6px 14px; background: rgba(230,45,51,0.1); border-radius: 999px; }
.case-local__title { text-align: left; font-size: clamp(22px, 2.4vw, 28px); margin-bottom: 12px; }
.case-local__sub { font-size: 15px; color: var(--txt-soft); margin-bottom: 18px; line-height: 1.55; }
.case-local__stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin: 20px 0; }
.case-local__stat { background: var(--blanc); border-radius: 12px; padding: 16px; text-align: center; border: 1px solid var(--gray-border); }
.case-local__stat-value { font-family: var(--f-h); font-weight: 900; font-size: 24px; color: var(--indigo); line-height: 1.1; }
.case-local__stat-label { font-size: 11px; color: var(--txt-soft); text-transform: uppercase; letter-spacing: 0.06em; font-weight: 600; margin-top: 4px; }
.case-local__quote { background: var(--blanc); border-left: 3px solid var(--jaune); border-radius: 10px; padding: 16px 18px; font-style: italic; color: var(--txt); font-size: 14.5px; line-height: 1.6; margin: 18px 0; }
.case-local__quote cite { display: block; font-style: normal; font-weight: 700; font-size: 13px; color: var(--indigo); margin-top: 8px; }

.stack-offer { padding: 80px 0; background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); color: var(--blanc); position: relative; overflow: hidden; }
.stack-offer::before { content: ""; position: absolute; top: -80px; right: -80px; width: 280px; height: 280px; background: rgba(252,201,48,0.12); border-radius: 50%; }
.stack-offer::after { content: ""; position: absolute; bottom: -100px; left: -100px; width: 320px; height: 320px; background: rgba(230,45,51,0.08); border-radius: 50%; }
.stack-offer__head { text-align: center; max-width: 760px; margin: 0 auto 32px; position: relative; z-index: 2; }
.stack-offer__head .cro-eyebrow { color: var(--jaune); }
.stack-offer__head h2 { color: var(--blanc); }
.stack-offer__list { list-style: none; padding: 0; max-width: 800px; margin: 32px auto 0; position: relative; z-index: 2; background: rgba(255,255,255,0.06); border-radius: 16px; padding: 24px 28px; border: 1px solid rgba(255,255,255,0.12); }
.stack-offer__item { display: flex; gap: 16px; align-items: flex-start; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,0.14); }
.stack-offer__item:last-child { border-bottom: 0; }
.stack-offer__check { background: var(--jaune); color: var(--indigo); width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 900; font-family: var(--f-h); flex-shrink: 0; margin-top: 2px; font-size: 15px; }
.stack-offer__item-body strong { font-family: var(--f-h); font-weight: 700; font-size: 16px; color: var(--blanc); display: block; line-height: 1.4; }
.stack-offer__value { font-family: var(--f-body); font-weight: 400; font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,0.78); display: block; margin-top: 2px; }
.stack-offer__cta-text { text-align: center; margin-top: 28px; font-family: var(--f-body); font-weight: 600; font-size: 17px; line-height: 1.55; color: var(--jaune); position: relative; z-index: 2; }
.stack-offer__cta-text strong { font-weight: 900; }

.timeline { padding: 80px 0; background: var(--blanc); }
.timeline__header { text-align: center; max-width: 760px; margin: 0 auto 48px; }
.timeline__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; position: relative; }
.timeline-step { background: var(--gray-soft); border-radius: 14px; padding: 24px 18px; text-align: center; transition: all 280ms var(--ease); border: 1px solid var(--gray-border); }
.timeline-step:hover { transform: translateY(-4px); box-shadow: 0 16px 32px -16px rgba(72,84,245,0.25); }
.timeline-step__day { display: inline-block; background: var(--indigo); color: var(--blanc); padding: 4px 12px; border-radius: 999px; font-size: 12px; font-weight: 700; margin-bottom: 12px; font-family: var(--f-h); letter-spacing: 0.04em; }
.timeline-step__title { font-family: var(--f-h); font-weight: 800; font-size: 15px; color: var(--txt); margin-bottom: 8px; line-height: 1.3; }
.timeline-step__desc { font-size: 13px; color: var(--txt-soft); line-height: 1.5; }

.geo { padding: 80px 0; background: var(--gray-soft); }
.geo__inner { display: grid; grid-template-columns: 1fr 1.2fr; gap: 48px; align-items: center; max-width: 1100px; margin: 0 auto; }
.geo__label { display: inline-block; font-size: 13px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 14px; }
.geo__title { text-align: left; margin-bottom: 16px; }
.geo__desc { font-size: 15px; color: var(--txt-soft); margin-bottom: 14px; line-height: 1.6; }
.geo__desc strong { color: var(--txt); }
.geo__map h3 { font-family: var(--f-h); font-size: 16px; color: var(--txt); margin-bottom: 14px; }
.geo__cities { display: flex; flex-wrap: wrap; gap: 8px; }
.geo-city { display: inline-block; background: var(--blanc); border: 1px solid var(--gray-border); border-radius: 999px; padding: 8px 14px; font-size: 13px; font-weight: 600; color: var(--txt); transition: all 220ms var(--ease); }
.geo-city:hover { border-color: var(--indigo); color: var(--indigo); background: var(--indigo-pale); }

.faq { padding: 80px 0; background: var(--blanc); }
.faq__header { text-align: center; max-width: 760px; margin: 0 auto 48px; }
.faq__list { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; max-width: 1100px; margin: 0 auto; }
.faq__item { background: var(--gray-soft); border: 1px solid var(--gray-border); border-radius: 12px; overflow: hidden; }
.faq__trigger { width: 100%; text-align: left; background: transparent; border: 0; padding: 18px 22px; font-family: var(--f-h); font-weight: 700; font-size: 15px; color: var(--txt); cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 12px; line-height: 1.35; }
.faq__trigger::after { content: "+"; font-family: var(--f-h); font-size: 22px; color: var(--indigo); flex-shrink: 0; transition: transform 220ms var(--ease); }
.faq__trigger[aria-expanded="true"]::after { transform: rotate(45deg); }
.faq__panel { padding: 0 22px; max-height: 0; overflow: hidden; transition: all 320ms var(--ease); }
.faq__panel.is-open { padding: 0 22px 20px; max-height: 600px; }
.faq__panel p { font-size: 14px; color: var(--txt-soft); line-height: 1.7; margin-bottom: 10px; }
.faq__panel p:last-child { margin-bottom: 0; }
.faq__panel strong { color: var(--txt); font-weight: 700; }

.cross-sell { padding: 72px 0; background: #f8f9fc; }
.cross-sell__header { text-align: center; max-width: 720px; margin: 0 auto 40px; }
.cross-sell__header .conv-cards__label { display: inline-block; font-size: 12px; letter-spacing: 0.15em; text-transform: uppercase; color: var(--indigo); font-weight: 700; margin-bottom: 12px; }
.cross-sell__header h2 { font: 900 clamp(26px, 4vw, 38px)/1.15 var(--f-h); color: var(--txt); margin: 0 0 14px; }
.cross-sell__lead { font: 400 17px/1.6 var(--f-body); color: #4a4a4a; margin: 0; }
.cross-sell__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.cross-card { background: var(--blanc); border-radius: 18px; padding: 28px 24px; display: flex; flex-direction: column; gap: 12px; border: 1px solid rgba(0,0,0,0.04); text-decoration: none; color: inherit; transition: transform .3s cubic-bezier(0.32,0.72,0,1), box-shadow .3s; min-width: 0; }
.cross-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(72,84,245,0.10); }
.cross-card__icon { width: 48px; height: 48px; border-radius: 12px; background: rgba(72,84,245,0.1); color: var(--indigo); display: inline-flex; align-items: center; justify-content: center; flex: 0 0 48px; }
.cross-card__icon svg { width: 24px !important; height: 24px !important; }
.cross-card__title { font: 700 18px/1.3 var(--f-h); color: var(--txt); margin: 0; }
.cross-card__desc { font: 400 14px/1.55 var(--f-body); color: #4a4a4a; margin: 0; flex: 1; }
.cross-card__desc strong { color: var(--txt); font-weight: 700; }
.cross-card__link { font: 600 14px/1.4 var(--f-body); color: var(--indigo); display: inline-flex; align-items: center; gap: 6px; }
@media (max-width: 900px) { .cross-sell__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .cross-sell { padding: 56px 0; } .cross-sell__grid { grid-template-columns: 1fr; } }

.final-cta { padding: 80px 0; background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-dark) 100%); color: var(--blanc); }
.final-cta__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; max-width: 1100px; margin: 0 auto; }
.final-cta__label { display: inline-block; font-size: 12px; font-weight: 700; color: var(--jaune); text-transform: uppercase; letter-spacing: 0.15em; margin-bottom: 12px; padding: 6px 14px; background: rgba(252,201,48,0.15); border-radius: 999px; }
.final-cta__content h2 { color: var(--blanc); text-align: left; margin-bottom: 16px; }
.final-cta__sub { font-size: 16px; opacity: 0.92; line-height: 1.6; margin-bottom: 12px; }
.final-cta__contact { display: flex; flex-direction: column; gap: 14px; margin-top: 28px; }
.final-cta__contact-item { display: flex; gap: 14px; align-items: flex-start; }
.final-cta__contact-item svg { width: 22px; height: 22px; color: var(--jaune); flex-shrink: 0; margin-top: 2px; }
.final-cta__contact-item div { font-size: 14px; line-height: 1.4; opacity: 0.95; }
.final-cta__contact-item strong { display: block; font-family: var(--f-h); font-weight: 800; font-size: 16px; margin-bottom: 2px; color: var(--blanc); }
.devis-form { background: var(--blanc); border-radius: 18px; padding: 32px 28px; box-shadow: 0 20px 50px -20px rgba(0,0,0,0.25); color: var(--txt); }
.devis-form h3 { font-family: var(--f-h); font-weight: 800; font-size: 22px; color: var(--txt); margin-bottom: 6px; }
.devis-form__intro { font-size: 13px; color: var(--txt-soft); margin-bottom: 18px; }
.devis-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }
.devis-form__field { margin-bottom: 12px; }
.devis-form__field input, .devis-form__field select, .devis-form__field textarea { width: 100%; padding: 12px 14px; border: 1px solid var(--gray-border); border-radius: 8px; font-family: inherit; font-size: 14px; color: var(--txt); background: var(--blanc); outline: 0; transition: all 180ms var(--ease); }
.devis-form__field input:focus, .devis-form__field select:focus, .devis-form__field textarea:focus { border-color: var(--indigo); box-shadow: 0 0 0 3px rgba(72,84,245,0.15); }
.devis-form__field textarea { min-height: 90px; resize: vertical; font-family: inherit; }
.devis-form__trust { margin: 16px 0; padding-top: 14px; border-top: 1px solid var(--gray-border); }
.devis-form__trust-badges { display: flex; gap: 6px; justify-content: center; margin-bottom: 8px; }
.devis-form__trust-badges img { height: 28px; width: auto; object-fit: contain; }
.devis-form__trust-text { text-align: center; font-size: 11px; color: var(--txt-soft); font-weight: 600; line-height: 1.4; }
.devis-form__btn { width: 100%; background: var(--rouge); color: var(--blanc); padding: 16px 24px; border: 0; border-radius: 10px; font-family: inherit; font-weight: 800; font-size: 15px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px; transition: all 280ms var(--ease); }
.devis-form__btn:hover { background: var(--rouge-dark); transform: translateY(-2px); }
.devis-form__rgpd-text { font-size: 11px; color: var(--txt-soft); text-align: center; margin-top: 12px; line-height: 1.5; }
.devis-form__rgpd-text a { color: var(--indigo); }

.footer { background: var(--gray-soft); padding: 60px 0 0; }
.footer-newsletter { background: var(--indigo); color: var(--blanc); padding: 32px 0; margin-bottom: 50px; }
.footer-newsletter__inner { display: grid; grid-template-columns: 1.4fr 1fr; gap: 24px; align-items: center; }
.footer-newsletter h3 { font-family: var(--f-h); font-weight: 800; font-size: 22px; color: var(--blanc); margin-bottom: 6px; }
.footer-newsletter p { font-size: 14px; opacity: 0.92; margin: 0; }
.footer-newsletter__form { display: flex; gap: 8px; }
.footer-newsletter__form input { flex: 1; padding: 12px 16px; border: 0; border-radius: 8px; font-family: inherit; font-size: 14px; outline: 0; min-width: 0; }
.footer-newsletter__form button { background: var(--jaune); color: var(--txt); padding: 12px 22px; border: 0; border-radius: 8px; font-family: inherit; font-weight: 800; font-size: 14px; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; transition: all 220ms var(--ease); }
.footer-newsletter__form button:hover { background: var(--blanc); transform: translateY(-1px); }
.footer-main { padding-bottom: 32px; }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 36px; }
.footer-col h4 { font-family: var(--f-h); font-weight: 800; font-size: 14px; color: var(--txt); text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 16px; }
.footer-col ul { list-style: none; padding: 0; margin: 0; }
.footer-col ul li { margin-bottom: 8px; }
.footer-col ul a { font-size: 13.5px; color: var(--txt-soft); }
.footer-col ul a:hover { color: var(--indigo); }
.footer-brand__logo img { height: 56px; margin-bottom: 16px; }
.footer-brand__tagline { font-size: 13.5px; color: var(--txt-soft); margin-bottom: 16px; line-height: 1.55; }
.footer-nap { font-style: normal; }
.footer-nap p { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; color: var(--txt); margin-bottom: 10px; line-height: 1.5; }
.footer-nap svg { width: 16px; height: 16px; color: var(--indigo); flex-shrink: 0; margin-top: 2px; }
.footer-nap strong { display: block; font-weight: 700; }
.footer-nap a { color: var(--indigo); font-weight: 700; }
.footer-rge { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 12px; }
.footer-rge img { height: 38px; width: auto; object-fit: contain; background: var(--blanc); border: 1px solid var(--gray-border); border-radius: 6px; padding: 4px; }
.footer-rge__note { grid-column: 1 / -1; font-size: 11px; color: var(--txt-soft); margin: 0; line-height: 1.5; }
.footer-bottom { padding-top: 24px; border-top: 1px solid var(--gray-border); display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; }
.footer-bottom__hours { font-size: 13px; color: var(--txt-soft); display: inline-flex; align-items: center; gap: 8px; }
.footer-bottom__hours svg { width: 14px; height: 14px; color: var(--indigo); }
.footer-bottom__socials { display: flex; gap: 12px; list-style: none; padding: 0; margin: 0; }
.footer-bottom__socials a { width: 36px; height: 36px; border-radius: 50%; background: var(--blanc); display: inline-flex; align-items: center; justify-content: center; color: var(--indigo); transition: all 220ms var(--ease); border: 1px solid var(--gray-border); }
.footer-bottom__socials a:hover { background: var(--indigo); color: var(--blanc); transform: translateY(-2px); border-color: var(--indigo); }
.footer-bottom__socials svg { width: 16px; height: 16px; }

.subfooter { background: #1a1a1a; color: var(--blanc); padding: 18px 0; font-size: 12.5px; }
.subfooter__inner { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.subfooter__legal { display: flex; gap: 16px; flex-wrap: wrap; }
.subfooter a { color: rgba(255,255,255,0.85); transition: color 220ms; }
.subfooter a:hover { color: var(--jaune); }
.subfooter__rankit { color: rgba(255,255,255,0.85); }
.subfooter__rankit strong { color: var(--jaune); }

.sticky-mobile { display: none; position: fixed; bottom: 0; left: 0; right: 0; background: var(--blanc); padding: 10px; gap: 8px; z-index: 99; box-shadow: 0 -4px 16px rgba(0,0,0,0.1); }
.sticky-mobile a { flex: 1; text-align: center; padding: 10px 8px; border-radius: 6px; font-weight: 700; font-size: 13px; line-height: 1.2; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.sticky-mobile a small { font-size: 10px; font-weight: 500; opacity: 0.95; text-transform: uppercase; letter-spacing: 0.04em; }
.sticky-mobile__tel { background: #25D366; color: var(--blanc); }
.sticky-mobile__devis { background: var(--rouge); color: var(--blanc); }

.reveal { opacity: 0; transform: translateY(24px); transition: opacity 600ms var(--ease), transform 600ms var(--ease); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 1080px) {
  .hero__grid, .geo__inner, .final-cta__inner, .case-local__inner, .fonctionnement__grid { grid-template-columns: 1fr; gap: 32px; }
  .trust-strip__inner { grid-template-columns: repeat(2, 1fr); gap: 18px; }
  .conv-cards__grid, .aides__grid, .brands__grid { grid-template-columns: 1fr 1fr; }
  .mini-form__form { grid-template-columns: 1fr 1fr; }
  .mini-form__form button { grid-column: 1 / -1; justify-content: center; }
  .hero__ctas { flex-direction: column; align-items: stretch; }
  .hero__ctas .btn-primary, .hero__ctas .btn-tel-strong { justify-content: center; }
  .timeline__grid { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .footer-newsletter__inner { grid-template-columns: 1fr; gap: 18px; text-align: center; }
  .models__table { background: transparent; box-shadow: none; border: 0; }
  .models__row { display: block; background: var(--blanc); border-radius: 16px; padding: 20px; margin-bottom: 12px; box-shadow: 0 4px 16px rgba(0,0,0,0.06); border-bottom: 0; border: 1px solid var(--gray-border); }
  .models__row.models__row--head { display: none !important; }
  .models__row .models__model { font-size: 16px; margin-bottom: 4px; padding-bottom: 8px; border-bottom: 1px solid var(--gray-border); }
  .models__row .models__capacity { display: inline-block; margin-top: 12px; padding: 4px 10px; background: var(--indigo); color: var(--blanc); border-radius: 999px; font-size: 12px; font-weight: 700; }
  .models__row .models__people { display: inline-block; margin: 12px 0 12px 8px; color: var(--txt-soft); font-size: 13px; }
  .models__row .models__price, .models__row .models__price-final { display: block; margin-top: 6px; padding-top: 12px; border-top: 1px dashed var(--gray-border); font-size: 15px; }
  .models__row .models__price-final { padding-top: 6px; border-top: 0; }
  .models__row .models__price::before { content: "Prix TTC posé : "; font-size: 11px; color: var(--txt-soft); font-weight: 500; text-transform: uppercase; letter-spacing: 0.05em; display: block; margin-bottom: 2px; }
  .models__row .models__price-final::before { content: "Reste après aides : "; font-size: 11px; color: var(--txt-soft); font-weight: 500; text-transform: uppercase; letter-spacing: 0.05em; display: block; margin-bottom: 2px; }
  .models__row .models__price small, .models__row .models__price-final small { display: none; }
  .faq__list { grid-template-columns: 1fr; }
  .guarantees__grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
  .top-bar__phone { font-size: 14px; }
  .header { padding: 12px 0; }
  .brands__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 700px) {
  .top-bar__inner { flex-wrap: wrap; gap: 10px; justify-content: center; }
  .conv-cards__grid, .pain-numbers__grid, .aides__grid, .brands__grid { grid-template-columns: 1fr; }
  .mini-form__form { grid-template-columns: 1fr; }
  .mini-form__form select, .mini-form__form input { font-size: 16px; }
  .mini-form__trust { gap: 8px 14px; }
  .devis-form__row { grid-template-columns: 1fr; }
  .sticky-mobile { display: flex; }
  body { padding-bottom: 72px; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; gap: 14px; text-align: center; }
  .subfooter__inner { flex-direction: column; gap: 8px; text-align: center; }
  .timeline__grid { grid-template-columns: 1fr; gap: 12px; }
  .pain-numbers__amount { font-size: 40px; }
  .case-local__stats { grid-template-columns: 1fr 1fr; }
  .guarantees__grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .pain-numbers, .guarantees, .stack-offer { padding: 56px 0; }
}
@media (max-width: 480px) {
  .guarantees__grid { grid-template-columns: 1fr; }
}

.story-bento-v3 { padding: 80px 0; background: white; }
.story-bento-v3--alt { background: var(--indigo-pale); }
.story-bento-v3__eyebrow { display: inline-block; font-size: 12px; letter-spacing: 0.15em; text-transform: uppercase; color: var(--indigo); font-weight: 700; margin-bottom: 12px; }
.story-bento-v3__title { font: 900 clamp(28px, 4vw, 42px)/1.15 var(--f-h); color: var(--txt); margin: 0 0 16px; max-width: 800px; text-align: left; }
.story-bento-v3__lead { font: 400 18px/1.6 var(--f-body); color: #4a4a4a; max-width: 720px; margin: 0 0 40px; }
.story-bento-v3__lead strong { color: var(--indigo); font-weight: 700; }
.story-bento-v3__grid { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: auto auto; gap: 20px; }
.story-card-v3 { background: #f8f9fc; border-radius: 20px; padding: 32px 28px; display: flex; flex-direction: column; gap: 12px; border: 1px solid rgba(0,0,0,0.04); transition: transform .3s cubic-bezier(0.32, 0.72, 0, 1); min-width: 0; }
.story-bento-v3--alt .story-card-v3 { background: var(--blanc); }
.story-card-v3:hover { transform: translateY(-4px); }
.story-card-v3--lg { grid-column: span 2; }
.story-card-v3--xl { grid-column: span 4; }
.story-card-v3--alert { background: #fff5f5 !important; border-left: 4px solid var(--rouge); }
.story-card-v3--accent { background: linear-gradient(135deg, var(--indigo) 0%, #3a44e8 100%) !important; color: white; }
.story-card-v3--accent .story-card-v3__title,
.story-card-v3--accent .story-card-v3__quote,
.story-card-v3--accent .story-card-v3__detail,
.story-card-v3--accent .story-card-v3__stat,
.story-card-v3--accent .story-card-v3__stat strong { color: white !important; }
.story-card-v3--accent .story-card-v3__list li { color: rgba(255,255,255,0.92); border-bottom-color: rgba(255,255,255,0.15); }
.story-card-v3--accent .story-card-v3__list li strong { color: white; }
.story-card-v3__icon { width: 48px; height: 48px; display: inline-flex; align-items: center; justify-content: center; background: rgba(72, 84, 245, 0.1); border-radius: 12px; color: var(--indigo); flex: 0 0 48px; }
.story-card-v3--accent .story-card-v3__icon { background: rgba(255,255,255,0.18); color: white; }
.story-card-v3--alert .story-card-v3__icon { background: rgba(230, 45, 51, 0.1); color: var(--rouge); }
.story-card-v3__title { font: 700 19px/1.3 var(--f-h); color: var(--txt); margin: 0; }
.story-card-v3__stat { font: 900 36px/1 var(--f-h); color: var(--indigo); margin: 8px 0 4px; }
.story-card-v3--alert .story-card-v3__stat { color: var(--rouge); }
.story-card-v3__detail { font: 400 14px/1.5 var(--f-body); color: #4a4a4a; margin: 0; }
.story-card-v3__quote { font: italic 600 17px/1.5 var(--f-body); color: var(--txt); margin: 0; padding: 4px 0 8px 16px; border-left: 3px solid var(--jaune); }
.story-card-v3__list { list-style: none; padding: 0; margin: 0; }
.story-card-v3__list li { font: 400 15px/1.6 var(--f-body); color: #4a4a4a; padding: 6px 0; border-bottom: 1px solid rgba(0,0,0,0.04); }
.story-card-v3__list li:last-child { border-bottom: 0; }
.story-card-v3__list li strong { color: var(--txt); font-weight: 700; }
.story-card-v3 a { color: var(--indigo); text-decoration: underline; }
.story-card-v3--accent a { color: var(--jaune); }
@media (max-width: 900px) {
  .story-bento-v3__grid { grid-template-columns: repeat(2, 1fr); }
  .story-card-v3--lg { grid-column: span 2; }
  .story-card-v3--xl { grid-column: span 2; }
}
@media (max-width: 600px) {
  .story-bento-v3 { padding: 56px 0; }
  .story-bento-v3__grid { grid-template-columns: 1fr; min-width: 0; }
  .story-bento-v3__grid > * { min-width: 0; }
  .story-card-v3--lg { grid-column: span 1; }
  .story-card-v3--xl { grid-column: span 1; }
  .story-card-v3__stat { font-size: 32px; }
}


/* === CF7 ciblé (cascade par contexte) === */
form.wpcf7-form{font:400 15px/1.5 'Lato',sans-serif}
form.wpcf7-form p{margin:0 0 14px}
form.wpcf7-form label{display:block;font:600 13px/1.4 'Lato',sans-serif;margin-bottom:0}

[class*="mini-form"] form.wpcf7-form label,
[class*="devis-form"] form.wpcf7-form label,
.sticky-form form.wpcf7-form label,
.final-cta form.wpcf7-form label,
.devis-form form.wpcf7-form label{color:#fff}

[class*="mini-form"] form.wpcf7-form input[type="text"],
[class*="mini-form"] form.wpcf7-form input[type="email"],
[class*="mini-form"] form.wpcf7-form input[type="tel"],
[class*="mini-form"] form.wpcf7-form select,
[class*="mini-form"] form.wpcf7-form textarea,
[class*="devis-form"] form.wpcf7-form input[type="text"],
[class*="devis-form"] form.wpcf7-form input[type="email"],
[class*="devis-form"] form.wpcf7-form input[type="tel"],
[class*="devis-form"] form.wpcf7-form select,
[class*="devis-form"] form.wpcf7-form textarea,
.sticky-form form.wpcf7-form input,
.sticky-form form.wpcf7-form select,
.sticky-form form.wpcf7-form textarea,
.final-cta form.wpcf7-form input,
.final-cta form.wpcf7-form select,
.final-cta form.wpcf7-form textarea,
.devis-form form.wpcf7-form input,
.devis-form form.wpcf7-form select,
.devis-form form.wpcf7-form textarea{
  width:100%;padding:13px 16px;border:1.5px solid rgba(255,255,255,.3);
  background:rgba(255,255,255,.1);color:#fff;border-radius:9px;
  font:400 15px/1.4 'Lato',sans-serif;box-sizing:border-box;margin-top:6px;
  -webkit-appearance:none;appearance:none
}
[class*="mini-form"] form.wpcf7-form input::placeholder,
[class*="mini-form"] form.wpcf7-form textarea::placeholder,
[class*="devis-form"] form.wpcf7-form input::placeholder,
.sticky-form form.wpcf7-form input::placeholder,
.final-cta form.wpcf7-form input::placeholder,
.devis-form form.wpcf7-form input::placeholder{color:rgba(255,255,255,.6)}
[class*="mini-form"] form.wpcf7-form select option,
[class*="devis-form"] form.wpcf7-form select option,
.sticky-form form.wpcf7-form select option,
.final-cta form.wpcf7-form select option,
.devis-form form.wpcf7-form select option{color:#222;background:#fff}
[class*="mini-form"] form.wpcf7-form .wpcf7-submit,
[class*="devis-form"] form.wpcf7-form .wpcf7-submit,
.sticky-form form.wpcf7-form .wpcf7-submit,
.final-cta form.wpcf7-form .wpcf7-submit,
.devis-form form.wpcf7-form .wpcf7-submit{
  background:#fcc930;color:#0a1c5e;font:900 16px/1.2 'Raleway',sans-serif;
  padding:15px 28px;border:0;border-radius:9px;cursor:pointer;
  text-transform:uppercase;letter-spacing:.04em;width:100%;margin-top:6px;
  transition:.2s;box-shadow:0 8px 20px rgba(252,201,48,.25)
}
[class*="mini-form"] form.wpcf7-form .wpcf7-submit:hover,
[class*="devis-form"] form.wpcf7-form .wpcf7-submit:hover,
.sticky-form form.wpcf7-form .wpcf7-submit:hover,
.final-cta form.wpcf7-form .wpcf7-submit:hover,
.devis-form form.wpcf7-form .wpcf7-submit:hover{background:#fff;color:#4854f5;transform:translateY(-1px)}

.dform form.wpcf7-form input[type="text"],
.dform form.wpcf7-form input[type="email"],
.dform form.wpcf7-form input[type="tel"],
.dform form.wpcf7-form select,
.dform form.wpcf7-form textarea{
  width:100%;padding:13px 16px;border:1.5px solid #e5e7eb;background:#f7f7fb;
  color:#222;border-radius:9px;font:400 15px/1.4 'Lato',sans-serif;
  box-sizing:border-box;margin-top:6px;-webkit-appearance:none;appearance:none
}
.dform form.wpcf7-form input::placeholder,.dform form.wpcf7-form textarea::placeholder{color:#9ca3af}
.dform form.wpcf7-form label{color:#222}
.dform form.wpcf7-form .wpcf7-submit{background:#4854f5;color:#fff;font:900 16px/1.2 'Raleway',sans-serif;padding:15px 28px;border:0;border-radius:9px;cursor:pointer;text-transform:uppercase;letter-spacing:.04em;width:100%;margin-top:6px;transition:.2s}
.dform form.wpcf7-form .wpcf7-submit:hover{background:#3a44d4;transform:translateY(-1px);box-shadow:0 8px 20px rgba(72,84,245,.3)}

/* Reveal fallback */
.reveal{opacity:1;transform:none}
.reveal.in{opacity:1;transform:none}

/* Layouts spécifiques sections services */
.fonctionnement,.fonctionnement-section{padding:60px 24px}
.fonctionnement>.container,.fonctionnement-section>.container{max-width:1200px;margin:0 auto}
.fonctionnement__inner,.fonctionnement-grid,.fonctionnement__split{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start}
.fonctionnement__steps{display:flex;flex-direction:column;gap:18px}
@media(max-width:880px){.fonctionnement__inner,.fonctionnement-grid,.fonctionnement__split{grid-template-columns:1fr}}


/* === Section .info (Comment ca marche) === */
.info{padding:60px 24px;background:#fff}
.info__inner{max-width:1200px;margin:0 auto}
.info__header{text-align:center;max-width:760px;margin:0 auto 16px}
.info__header h2{font:900 clamp(26px,4vw,38px)/1.15 'Raleway',sans-serif;color:#222;margin:8px 0 0}
.info__lead{text-align:center;max-width:820px;margin:0 auto 40px;color:#4a4a4a;font:400 16px/1.55 'Lato',sans-serif}
.info__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:start}
.info__steps{display:flex;flex-direction:column;gap:14px}
.info__step{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:18px;display:flex;gap:14px;align-items:flex-start;transition:.2s}
.info__step:hover{border-color:#4854f5;transform:translateX(4px);box-shadow:0 8px 20px rgba(0,0,0,.05)}
.info__step b{flex-shrink:0;width:36px;height:36px;border-radius:50%;background:#4854f5;color:#fff;display:inline-flex;align-items:center;justify-content:center;font:900 16px/1 'Raleway',sans-serif}
.info__step p{margin:0;color:#444;font-size:14px;line-height:1.55}
.info__step strong{display:block;color:#222;margin-bottom:6px;font:700 15px/1.3 'Lato',sans-serif}
.info__schema{position:sticky;top:90px}
.info__schema img{width:100%;max-width:560px;height:auto;border-radius:14px;box-shadow:0 12px 32px rgba(0,0,0,.08);display:block;margin:0 auto}
.info__schema-caption{margin-top:14px;text-align:center;font-style:italic;color:#666;font-size:13px;line-height:1.5;max-width:520px;margin-left:auto;margin-right:auto}
@media(max-width:900px){.info__grid{grid-template-columns:1fr;gap:30px}.info__schema{position:static}}

/* WP Rocket lazy load fix - force img display */
img[data-lazy-src]{opacity:0;transition:opacity .3s}
img.lazyloaded,img[data-lazy-src].entered,img.litespeed-loaded{opacity:1}


/* === FIX containers parent grid qui squeeze enfants === */
.info__inner.container,.container.info__inner,.info > .container{display:block;width:100%;max-width:1200px;margin:0 auto;padding:0 24px;box-sizing:border-box}
.info{padding:60px 0}
.info__grid{width:100%;display:grid;grid-template-columns:1.1fr 1fr;gap:50px;align-items:start;margin:30px 0 0}
.info__steps{display:flex;flex-direction:column;gap:14px;min-width:0}
.info__schema{min-width:0}
.info__schema img{width:100%;max-width:560px;height:auto;border-radius:14px;display:block;margin:0 auto}
@media(max-width:900px){.info__grid{grid-template-columns:1fr;gap:30px}}

/* Pareil pour autres conteneurs principaux qui peuvent squeezer */
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 24px;box-sizing:border-box;display:block}
.conv-cards__inner.container,.guarantees__inner.container,.pain-numbers__inner.container,.stack-offer__inner.container{display:block}


/* === Z9 FORCE reveal visible (spécificité haute) === */
html body .reveal, html body .reveal.in, html body div.reveal, html body section .reveal{opacity:1;transform:none;filter:none}


/* Z9 BATCH FIXES (FAQ + CF7 labels + centrage) */
.faq__item .faq__a, .faq__item .faq__panel, .faq__item > div:not(:first-child),
.faq__item p:not(:first-child), .faq-item .faq-answer{
  max-height:0;overflow:hidden;transition:max-height .4s ease;padding:0 18px;opacity:.85
}
.faq__item.open .faq__a, .faq__item.open .faq__panel, .faq__item.open > div:not(:first-child),
.faq__item.open p:not(:first-child){max-height:800px;padding:14px 18px 18px;opacity:1}
.faq__item .faq__q, .faq__item .faq__head, .faq__item h3, .faq__item h4{cursor:pointer;user-select:none}
.faq__item .faq__icon{transition:transform .3s}
.faq__item.open .faq__icon{transform:rotate(45deg)}

/* CF7 labels visibles sur fond bleu - force contraste */
html body .mini-form form.wpcf7-form label,
html body .final-cta form.wpcf7-form label,
html body .devis-form form.wpcf7-form label,
html body [class*="mini-form"] form.wpcf7-form label{color:#fff;font-weight:600}
html body .mini-form form.wpcf7-form input::placeholder,
html body .final-cta form.wpcf7-form input::placeholder,
html body .devis-form form.wpcf7-form input::placeholder,
html body [class*="mini-form"] form.wpcf7-form input::placeholder,
html body [class*="mini-form"] form.wpcf7-form textarea::placeholder{color:rgba(255,255,255,.75)}

/* Inner containers : reset block pour eviter squeeze */
.guarantees__inner, .pain-numbers__inner, .conv-cards__inner, .stack-offer__inner,
.case-v2__inner, .models__inner, .climate__inner, .brands__inner, .testimonials__inner,
.compare__inner, .why__inner, .cross-sell__inner{display:block;width:100%;max-width:1200px;margin:0 auto;padding:0 24px;box-sizing:border-box}

/* Centrer cross-sell + compare grids */
.cross-sell__grid, .compare__grid{justify-content:center;text-align:left;justify-items:center}




/* Z9 V5 — FAQ design ORIGINAL preview-homepage.html (indigo card + texte blanc + 1000px column) === */
.faq__list{max-width:1000px;margin:0 auto;display:flex;flex-direction:column;gap:12px;width:100%}
.faq__item{background:#4854f5;color:#fff;border-radius:8px;overflow:hidden;transition:box-shadow 320ms cubic-bezier(.16,1,.3,1);width:100%;display:block}
.faq__item:hover{box-shadow:0 12px 28px -12px rgba(72,84,245,.4)}
.faq__item strong{color:#fff}
.faq__trigger{width:100%;background:none;border:0;text-align:left;padding:20px 28px;font-family:inherit;font-size:16px;font-weight:700;color:#fff;display:flex;justify-content:space-between;align-items:center;cursor:pointer;gap:16px}
.faq__trigger::after{content:'';width:24px;height:24px;flex-shrink:0;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fcc930'><path d='M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z'/></svg>");background-repeat:no-repeat;background-position:center;transition:transform 220ms cubic-bezier(.16,1,.3,1)}
.faq__trigger[aria-expanded="true"]::after{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fcc930'><path d='M19 13H5v-2h14v2z'/></svg>")}
.faq__panel{padding:0 28px;color:#fff;line-height:1.7;font-size:14px;max-height:0;overflow:hidden;transition:max-height .4s ease,padding .4s ease}
.faq__panel.is-open,.faq__item.open .faq__panel,.faq__item.is-open .faq__panel{max-height:2000px;padding:0 28px 22px}
.faq__panel p{margin-bottom:10px;color:#fff}
.faq__panel p strong{color:#fcc930}
.faq__panel a{color:#fcc930;text-decoration:underline}

/* CF7 bouton devis = JAUNE + RGPD = blanc lisible */
html body [class*="mini-form"] form.wpcf7-form .wpcf7-submit,
html body [class*="mini-form"] form.wpcf7-form input[type="submit"],
html body .devis-form form.wpcf7-form .wpcf7-submit,
html body .devis-form form.wpcf7-form input[type="submit"],
html body .final-cta form.wpcf7-form .wpcf7-submit,
html body .final-cta form.wpcf7-form input[type="submit"]{background:#fcc930;color:#0a1c5e;font:900 16px/1.2 'Raleway',sans-serif;padding:18px 32px;border:0;border-radius:10px;cursor:pointer;text-transform:uppercase;letter-spacing:.04em;width:100%;margin-top:10px;box-shadow:0 8px 22px rgba(252,201,48,.35)}
html body [class*="mini-form"] form.wpcf7-form input[type="text"],
html body [class*="mini-form"] form.wpcf7-form input[type="email"],
html body [class*="mini-form"] form.wpcf7-form input[type="tel"],
html body [class*="mini-form"] form.wpcf7-form select,
html body [class*="mini-form"] form.wpcf7-form textarea,
html body .devis-form form.wpcf7-form input,html body .devis-form form.wpcf7-form select,html body .devis-form form.wpcf7-form textarea,
html body .final-cta form.wpcf7-form input,html body .final-cta form.wpcf7-form select,html body .final-cta form.wpcf7-form textarea{background:#fff;color:#222;border:1.5px solid rgba(255,255,255,.5)}
html body p.form-rgpd-notice{color:rgba(255,255,255,.9);font-size:12px;line-height:1.5;margin-top:14px;text-align:left}
html body p.form-rgpd-notice a{color:#fcc930;text-decoration:underline}


/* Z9 V6 BATCH FIX ALL : a11y + sticky tel + responsive + touch targets */

/* Skip link */
.skip-link{position:absolute;left:-9999px;top:0;background:#fcc930;color:#0a1c5e;padding:10px 20px;font-weight:700;border-radius:0 0 8px 0;z-index:99999;text-decoration:none;font-size:14px}
.skip-link:focus{left:0;outline:2px solid #0a1c5e}

/* Sticky tel CTA mobile (P0 — confirmé Agent CRO+Header+Mobile) */
.sticky-tel-mobile{display:none}
@media (max-width:768px){
  .sticky-tel-mobile{display:block;position:fixed;bottom:0;left:0;right:0;z-index:998;background:linear-gradient(135deg,#fcc930 0%,#f7b41a 100%);padding:10px 12px;box-shadow:0 -4px 14px rgba(0,0,0,.15);border-top:2px solid #fff}
  .sticky-tel-mobile__btn{display:block;text-align:center;background:#0a1c5e;color:#fff;font:900 16px/1.2 'Raleway',sans-serif;padding:14px;border-radius:8px;text-decoration:none;letter-spacing:.03em}
  body{padding-bottom:80px}
  /* footer & body padding fix */
  .footer{padding-bottom:90px}
}

/* Burger touch target WCAG 2.5.5 — size only, display géré par media queries originales */
@media (max-width:1080px){.burger{width:44px;height:44px}}

/* CTA min-height mobile (P1) */
@media (max-width:768px){
  .btn-primary,.btn-secondary,.btn-indigo,.wpcf7-submit{min-height:44px}
}

/* Focus visible global (P1 — WCAG 2.4.7) */
*:focus-visible{outline:2px solid #fcc930;outline-offset:2px;border-radius:2px}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid #fcc930;outline-offset:2px}

/* Filet overflow-x clip preventif */
html,body{overflow-x:clip}

/* RESPONSIVE FIX — /etudes-de-cas/ + /contact/ (P0 confirmé Agent Mobile + Pages spéciales) */
@media (max-width:768px){
  /* Grids génériques en colonne mobile */
  .case-grid,.contact-grid,.cases__grid,.cases-list,
  [class*="-grid"]:not(.aides__grid):not(.geo__grid):not(.brands__grid):not(.conv-cards__grid){
    grid-template-columns:1fr !important
  }
  /* Iframe Maps full-width mobile */
  iframe[src*="google.com/maps"],iframe[src*="maps"]{width:100% !important;max-width:100% !important}
  /* Pages cas client : container padding */
  .case-local__inner,.cases__inner{padding:0 16px !important}
  /* Tables responsive */
  table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
}

/* Newsletter email input a11y */
.footer__newsletter input[type="email"]{font-size:14px}

/* SVG décoratifs */
svg[aria-hidden="true"]{pointer-events:none}

/* Liens "Découvrir le" min touch target */
@media (max-width:768px){
  .service-intent__link,.conv-cards__card a,a.btn{min-height:44px;display:inline-flex;align-items:center}
}


/* Z9 V7 FIXES — form CF7 fond blanc visible + burger desktop hidden */

/* Burger HIDDEN desktop, visible mobile uniquement (override sécurité) */
@media (min-width:1081px){
  .burger{display:none !important}
}

/* Form CF7 dans context BLANC (page contact card blanche) — texte sombre + bg gris très clair pour visibilité */
html body .contact-form-card form.wpcf7-form input[type="text"],
html body .contact-form-card form.wpcf7-form input[type="email"],
html body .contact-form-card form.wpcf7-form input[type="tel"],
html body .contact-form-card form.wpcf7-form input[type="number"],
html body .contact-form-card form.wpcf7-form select,
html body .contact-form-card form.wpcf7-form textarea,
html body main form.wpcf7-form input[type="text"],
html body main form.wpcf7-form input[type="email"],
html body main form.wpcf7-form input[type="tel"],
html body main form.wpcf7-form input[type="number"],
html body main form.wpcf7-form select,
html body main form.wpcf7-form textarea,
html body section[style*="background:#fff"] form.wpcf7-form input,
html body section[style*="background:#fff"] form.wpcf7-form select,
html body section[style*="background:#fff"] form.wpcf7-form textarea,
html body section[style*="background:#ffffff"] form.wpcf7-form input,
html body section[style*="background:#ffffff"] form.wpcf7-form select,
html body section[style*="background:#ffffff"] form.wpcf7-form textarea,
html body div[style*="background:#fff"] form.wpcf7-form input,
html body div[style*="background:#fff"] form.wpcf7-form select,
html body div[style*="background:#fff"] form.wpcf7-form textarea{
  background:#f9f9fb !important;color:#222 !important;border:1.5px solid #e5e7eb !important;
  padding:12px 14px !important;border-radius:8px !important;width:100% !important;
  font:400 15px/1.4 'Raleway',sans-serif !important;
}
html body .contact-form-card form.wpcf7-form input::placeholder,
html body .contact-form-card form.wpcf7-form textarea::placeholder,
html body main form.wpcf7-form input::placeholder,
html body main form.wpcf7-form textarea::placeholder{color:#aaa !important}

/* Labels visibles fond blanc */
html body .contact-form-card form.wpcf7-form label,
html body main form.wpcf7-form label{
  color:#0a1c5e !important;font-weight:700 !important;display:block !important;margin-bottom:6px !important;font-size:14px !important
}

/* Submit button page contact (fond blanc) : INDIGO/BLEU plein visible */
html body .contact-form-card form.wpcf7-form .wpcf7-submit,
html body .contact-form-card form.wpcf7-form input[type="submit"],
html body main form.wpcf7-form .wpcf7-submit,
html body main form.wpcf7-form input[type="submit"]{
  background:#4854f5 !important;color:#fff !important;
  font:900 16px/1.2 'Raleway',sans-serif !important;
  padding:18px 32px !important;border:0 !important;border-radius:10px !important;cursor:pointer !important;
  text-transform:uppercase !important;letter-spacing:.04em !important;width:100% !important;margin-top:10px !important;
  box-shadow:0 8px 22px rgba(72,84,245,.3) !important
}

/* RGPD notice fond blanc */
html body .contact-form-card p.form-rgpd-notice,
html body main p.form-rgpd-notice{
  color:#666 !important;font-size:12px !important;line-height:1.5 !important;margin-top:14px !important;text-align:center !important
}
html body main p.form-rgpd-notice a,
html body .contact-form-card p.form-rgpd-notice a{color:#4854f5 !important;text-decoration:underline !important}




/* ============================================================
   OVERRIDES CANON DS — 2026-07-01 v2 (autorité finale)
   Chargés dans le thème (head) en !important => battent l'inline de page.
   UNE modif ici = tout le site. L'inline reste (rend header/layout), on
   surcouche seulement les composants canon.
   ============================================================ */

/* --- FAQ CANON : cards claires 1 colonne + icône ronde indigo --- */
.faq { background: var(--blanc) !important; }
.faq__item { box-shadow: 0 2px 8px -4px rgba(72,84,245,.14); }
.faq__list { max-width: 860px !important; margin: 0 auto !important; display: flex !important; flex-direction: column !important; grid-template-columns: none !important; gap: 12px !important; }
.faq__item { background: var(--blanc) !important; color: var(--txt) !important; border: 1px solid var(--gray-border) !important; border-radius: 12px !important; overflow: hidden; }
.faq__item:hover { border-color: var(--indigo) !important; box-shadow: 0 8px 20px -10px rgba(72,84,245,.25) !important; }
.faq__item.open { border-color: var(--indigo) !important; }
.faq__item strong { color: var(--txt) !important; }
.faq__trigger { color: var(--txt) !important; font-family: var(--f-h) !important; font-size: 16px !important; font-weight: 700 !important; padding: 18px 22px !important; line-height: 1.35 !important; }
.faq__item.open .faq__trigger { color: var(--indigo) !important; }
.faq__trigger::after { content: '' !important; width: 30px !important; height: 30px !important; flex-shrink: 0 !important; border-radius: 50% !important; background-color: var(--indigo-pale) !important; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='%234854f5'><path d='M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z'/></svg>") !important; background-repeat: no-repeat !important; background-position: center !important; background-size: 18px 18px !important; transform: rotate(0deg) !important; transition: background-color .22s var(--ease), transform .22s var(--ease) !important; }
/* ouvert : le "+" (blanc) tourne à 45° => croix "×" propre sur cercle indigo */
.faq__trigger[aria-expanded="true"]::after { background-color: var(--indigo) !important; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='%23ffffff'><path d='M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z'/></svg>") !important; transform: rotate(45deg) !important; }
.faq__panel { color: var(--txt-soft) !important; padding: 0 22px 20px !important; }
.faq__panel p { color: var(--txt-soft) !important; }
.faq__panel strong { color: var(--txt) !important; }
.faq__panel a { color: var(--indigo) !important; }

/* --- FOOTER LOGO : anti-étirement --- */
.footer-brand__logo img, .footer__logo img { width: auto !important; max-width: 100% !important; height: 72px !important; object-fit: contain !important; }

/* --- H1 hero : poids 800 (DS) --- */
.hero__title { font-weight: 800 !important; }

/* --- SECTION FORM : aligner la colonne gauche en HAUT (avec le début du form) --- */
.final-cta__inner { align-items: flex-start !important; }
@media (max-width: 900px){ .final-cta__inner { align-items: stretch !important; } }

/* --- FORMULAIRES sur fond indigo : lisibilité --- */
.final-cta label, .mini-form label,
.final-cta .wpcf7-form label, .mini-form .wpcf7-form label { color: #fff !important; }
html body .contact-form-card p.form-rgpd-notice,
html body .final-cta p.form-rgpd-notice,
html body .mini-form p.form-rgpd-notice,
html body p.form-rgpd-notice,
.final-cta .wpcf7-list-item-label, .mini-form .wpcf7-list-item-label,
.final-cta small, .mini-form small, .devis-form__rgpd-text { color: rgba(255,255,255,.88) !important; }
html body .contact-form-card p.form-rgpd-notice a,
html body .final-cta p.form-rgpd-notice a,
html body p.form-rgpd-notice a,
.devis-form__rgpd-text a { color: #fcc930 !important; text-decoration: underline !important; }
/* champs : texte sombre sur fond blanc */
.final-cta input, .final-cta select, .final-cta textarea,
.mini-form input, .mini-form select, .mini-form textarea { color: var(--txt) !important; }
.final-cta input::placeholder, .mini-form input::placeholder,
.final-cta textarea::placeholder, .mini-form textarea::placeholder { color: var(--txt-soft) !important; }

/* --- BLOBS décoratifs : plus subtils (étaient trop prononcés) --- */
.final-cta__inner::before, .final-cta__inner::after,
.mini-form::before, .mini-form::after,
.stack-offer::before, .stack-offer::after,
.cta-final__card::before, .cta-final__card::after,
.final-cta__inner::before, .footer-newsletter::before,
.calc__inner::before { opacity: .45 !important; }

/* --- ESPACEMENTS SECTIONS : régularité (combler les trop petits) --- */
.avis-google { padding: 80px 0 !important; }
.counters-section { padding: 80px 0 !important; }
@media (max-width: 768px) {
  .avis-google, .counters-section { padding: 56px 0 !important; }
}

/* --- HONEYPOT anti-spam CF7 : masquer les champs leurres (website/firstname/lastname/email + hashés) --- */
/* Ils doivent rester dans le DOM (piège à bots) mais hors écran pour les humains. */
.wpcf7-form div:has(> input[autocomplete="disable"]),
.wpcf7-form p:has(> input[autocomplete="disable"]),
.wpcf7-form label:has(> input[autocomplete="disable"]),
.wpcf7-form span:has(> input[autocomplete="disable"]) {
  position: absolute !important; left: -9999px !important; top: auto !important;
  width: 1px !important; height: 1px !important; overflow: hidden !important;
}
.wpcf7-form input[autocomplete="disable"],
.wpcf7-form input[name="website"], .wpcf7-form input[name="firstname"],
.wpcf7-form input[name="lastname"], .wpcf7-form input[name="email"] {
  position: absolute !important; left: -9999px !important;
  width: 1px !important; height: 1px !important; overflow: hidden !important; opacity: 0 !important;
}

/* --- ALTERNANCE DES FONDS : blanc <-> indigo-pale, jamais 2 collés --- */
/* Fond blanc */
.why, .geo-zone, .faq { background: var(--blanc) !important; }
/* Fond indigo-pale (tint de marque) */
.team, .avis-google { background: var(--indigo-pale) !important; }
/* 2e section cross-sell adjacente : casser le doublon */
.cross-sell + .cross-sell { background: var(--indigo-pale) !important; }

/* --- SUBMIT du formulaire = JAUNE (ressort sur fond indigo) --- */
html body main form.wpcf7-form .wpcf7-submit,
html body main form.wpcf7-form input[type="submit"],
html body .final-cta form.wpcf7-form .wpcf7-submit,
html body .final-cta form.wpcf7-form input[type="submit"],
html body .mini-form form.wpcf7-form .wpcf7-submit,
html body .contact-form-card form.wpcf7-form .wpcf7-submit {
  background: #fcc930 !important; color: #0a1c5e !important;
  text-transform: uppercase !important; font-weight: 900 !important;
  border: 0 !important; border-radius: 10px !important; padding: 18px 32px !important;
  box-shadow: 0 8px 22px rgba(252,201,48,.35) !important; min-height: 48px !important;
}
html body main form.wpcf7-form .wpcf7-submit:hover,
html body .final-cta form.wpcf7-form .wpcf7-submit:hover,
html body .mini-form form.wpcf7-form .wpcf7-submit:hover { filter: brightness(.95) !important; }


/* ============================================================
   HEADER CONVERSION — 2026-07-02 (tél cliquable + Devis + Zone)
   Chargé en fin de thème. UNE modif = tout le site.
   ============================================================ */
.header__cta-group { display:flex; align-items:center; gap:14px; flex-shrink:0; }
.header__phone { display:inline-flex; align-items:center; gap:8px; color:var(--txt); font-weight:700; font-size:15px; white-space:nowrap; line-height:1; }
.header__phone svg { width:19px; height:19px; fill:var(--indigo); flex-shrink:0; }
.header__phone:hover { color:var(--indigo); }
.header__devis { display:inline-flex; align-items:center; justify-content:center; background:#fcc930; color:#0a1c5e; font-weight:800; font-size:14.5px; padding:11px 20px; border-radius:9px; white-space:nowrap; box-shadow:0 6px 16px rgba(252,201,48,.32); transition:filter .2s var(--ease), transform .2s var(--ease); }
.header__devis:hover { filter:brightness(.96); color:#0a1c5e; transform:translateY(-1px); }
.nav__mobile-cta { display:none; }

/* Zone d'intervention : mega 2 colonnes */
.mega--zone { min-width:440px !important; }
.mega-simple--2col { display:grid !important; grid-template-columns:1fr 1fr; gap:1px 10px; }
.mega-simple__all { display:block; margin-top:8px; padding:10px 12px 4px; font-size:13.5px; font-weight:700; color:var(--indigo); border-top:1px solid var(--gray-border, rgba(0,0,0,.08)); }
.mega-simple__all:hover { color:var(--indigo); text-decoration:underline; }

/* Mobile (<=1080) : tél icône dans la barre, Devis + tél pleine largeur dans l'overlay */
@media (max-width:1080px){
  .header__cta-group { gap:8px; margin-left:auto; margin-right:6px; }
  .header__phone-label { display:none; }
  .header__cta-group > .header__phone { padding:9px; background:var(--indigo-pale); border-radius:9px; }
  .header__cta-group > .header__phone svg { width:21px; height:21px; }
  .header__devis--desktop { display:none; }
  .nav__mobile-cta { display:flex !important; flex-direction:column; gap:10px; width:100%; margin-bottom:14px; }
  .nav__mobile-cta .header__phone { justify-content:center; background:var(--indigo-pale); color:var(--indigo); padding:14px; font-size:17px; border-radius:10px; width:100%; }
  .nav__mobile-cta .header__devis { padding:15px; font-size:17px; width:100%; }
  .mega--zone { min-width:0 !important; }
  .mega-simple--2col { grid-template-columns:1fr; }
}


/* ============================================================
   STICKY CTA MOBILE (2 actions) + MÉGA ACCORDÉON MOBILE — 2026-07-02
   ============================================================ */
.sticky-tel-mobile { display:none; }
@media (max-width:1080px){
  .sticky-tel-mobile { display:flex !important; gap:10px; align-items:stretch; position:fixed; bottom:0; left:0; right:0; z-index:998; background:#fff !important; background-image:none !important; padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px)); box-shadow:0 -6px 22px rgba(10,28,94,.14) !important; border-top:1px solid rgba(10,28,94,.08) !important; }
  .sticky-cta { flex:1; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:14px 8px; border-radius:11px; font:800 15px/1 'Raleway',sans-serif; text-decoration:none; letter-spacing:.01em; }
  .sticky-cta svg { width:18px; height:18px; fill:currentColor; flex-shrink:0; }
  .sticky-cta--call { background:#0a1c5e; color:#fff; }
  .sticky-cta--devis { background:#fcc930; color:#0a1c5e; box-shadow:0 4px 14px rgba(252,201,48,.4); }

  /* Méga-menu mobile = accordéon : sous-menus fermés par défaut */
  .nav__has-mega > a svg { transition:transform .25s var(--ease); }
  .nav__has-mega.open > a svg { transform:rotate(180deg); }
  .nav__has-mega .mega { display:none; }
  .nav__has-mega.open .mega { display:block; }
}


/* --- Correctif accordéon mobile v2 : chevron visible + alignement propre (2026-07-02) --- */
@media (max-width:1080px){
  .nav__has-mega > a { justify-content:space-between !important; align-items:center; }
  .nav__has-mega > a svg { width:18px !important; height:18px !important; opacity:1 !important; fill:var(--indigo) !important; margin-left:auto !important; flex-shrink:0; transition:transform .25s var(--ease); }
  .nav__has-mega.open > a svg { transform:rotate(180deg) !important; }
  .nav__has-mega .mega__inner.container,
  .nav__has-mega .mega__inner { max-width:none !important; padding:0 !important; margin:0 !important; }
  .nav__has-mega .mega { padding:12px 14px !important; }
}


/* --- BULLETPROOF méga mobile : force le flux normal (anti position:absolute décalée) 2026-07-02 --- */
@media (max-width:1080px){
  .nav .nav__has-mega .mega,
  .nav .nav__has-mega.open .mega {
    position: static !important;
    left: auto !important; right: auto !important; top: auto !important;
    transform: none !important;
    width: auto !important; min-width: 0 !important; max-width: 100% !important;
    margin: 6px 0 !important;
  }
}


/* --- FIX HEADER LAYOUT : .container{display:block} (pos 1787) écrasait .header__inner{flex}. Force flex partout (pages sans bloc CSS inline ex: contact) 2026-07-02 --- */
.header .header__inner.container,
.header .container.header__inner,
.header__inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px;
  flex-wrap: nowrap;
}