/* =========================================================
   AJOUTS LP à la page d'origine (site.css reste identique à bordeauxborne.fr)
   - police Inter auto-hébergée (la CSP commune bloque Google Fonts)
   - formulaire dans le hero (géré par lp.js)
   - section finale sans formulaire (photo du hero d'origine + bouton)
   - logo visible sur mobile, bannière cookies
   ========================================================= */

@font-face{font-family:'Inter';font-style:normal;font-weight:300 800;font-display:swap;
  src:url(../fonts/inter-var-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* ---------- En-tête : le logo ne doit pas s'écraser sur mobile (le bouton du header est masqué, le formulaire est juste en dessous) ---------- */
.logo{flex-shrink:0}
@media(max-width:540px){.hd-cta{display:none}}

/* ---------- Hero : texte à gauche, formulaire à droite ---------- */
.hero{padding:132px 0 90px}
.hero .sub{margin-bottom:30px}
.hero .badges{margin-top:0}
.hero-form{padding:34px 34px 28px;scroll-margin-top:90px}
.hero-form .hf-title{font-size:28px;color:var(--blanc);margin-bottom:6px}
.hero-form .fsub{margin-bottom:22px}
.hero-form .field{margin-bottom:14px}
.hero-form .field textarea{min-height:84px}
.hf-resp{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:12px;font-size:14px;font-weight:600;color:var(--bordeaux-blue)}
.hf-resp svg{color:var(--charge)}
.hero-form .form-legal{text-align:center;margin-top:10px}

/* Formulaire lp.js : une seule étape (la classe .step de lp.js ne doit pas prendre le style des étapes « Comment ça se passe ») */
#leadForm .step{display:block;gap:0;padding:0;margin:0;border:0;min-width:0}
.field [aria-invalid=true]{border-color:#ff6b6b;box-shadow:0 0 0 3px rgba(255,107,107,.14)}
.field [aria-invalid=true]~.msg{display:block}
.btn.is-loading{opacity:.7;pointer-events:none}
.form-msg{display:none;margin-top:12px;padding:11px 14px;border-radius:11px;font-size:14px;line-height:1.45}
.form-msg.is-error{display:block;background:rgba(255,107,107,.1);color:#c43c3c}

@media(max-width:900px){
  .hero{padding:104px 0 64px}
  .hero .sub{margin-bottom:22px}
}
@media(max-width:540px){
  .hero-form{padding:26px 20px 22px}
  .hero-form .hf-title{font-size:24px}
}

/* ---------- Section finale : bouton vers le formulaire + photo du hero d'origine ---------- */
.final .wrap{align-items:center}
.final-cta{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:-8px 0 30px}
.final-cta .resp{font-size:14px;color:var(--txt-dim)}
@media(max-width:900px){.final .final-visual{order:0}}

/* ---------- Bannière cookies (lp.js) ---------- */
.cookie{position:fixed;left:12px;right:12px;bottom:12px;z-index:90;display:none;max-width:440px;background:var(--bg-2);
  border:1px solid var(--line-2);border-radius:16px;box-shadow:0 24px 60px -20px rgba(11,27,46,.35);padding:16px 18px;font-size:13.5px;line-height:1.5;color:var(--txt-mut)}
.cookie.is-visible{display:block}
.cookie p{margin-bottom:12px}
.cookie a{color:var(--bordeaux-blue);text-decoration:underline}
.cookie-btns{display:flex;gap:10px}
.cookie-btns .btn{flex:1;justify-content:center;padding:10px 14px;font-size:14px}
@media(min-width:541px){.cookie{left:20px;bottom:20px}}