/* Police chargée via <link preconnect+stylesheet> dans le <head> de chaque page (plus rapide qu'un @import CSS). */
:root{
  --noir:#000000; --charb:#0D0D0D; --carte:#141414; --ligne:#242424;
  --rouge:#ED0000; --rouge2:#B80000; --blanc:#FFFFFF; --gris:#9AA0A6; --clair:#D8D8D8;
  --rayon:12px; --maxw:1140px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--noir);color:var(--clair);
  font-family:'Inter',Arial,sans-serif;font-size:16px;line-height:1.65}
h1,h2,h3{font-family:'Barlow Condensed',Impact,sans-serif;font-weight:700;
  line-height:1.05;margin:0 0 .5em;letter-spacing:.01em;text-transform:uppercase;color:var(--blanc)}
p{margin:0 0 1em;color:var(--gris)}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 26px}

/* barre */
.nav{position:sticky;top:0;z-index:60;background:rgba(0,0,0,.93);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--ligne)}
.nav .in{max-width:var(--maxw);margin:0 auto;padding:0 26px;display:flex;
  align-items:center;justify-content:space-between;height:78px}
.nav .marque img{height:46px;width:auto}
.liens{display:flex;gap:26px}
.liens a{font-size:14px;font-weight:600;color:var(--gris);letter-spacing:.04em;
  text-transform:uppercase;transition:color .15s}
.liens a:hover,.liens a.on{color:var(--rouge)}
.tel-cta{background:var(--rouge);color:#fff;font-weight:700;font-size:14.5px;
  padding:12px 22px;border-radius:999px;letter-spacing:.02em;white-space:nowrap}
.tel-cta:hover{background:var(--rouge2)}
.burger{display:none;background:none;border:0;color:#fff;font-size:26px;cursor:pointer}
@media(max-width:940px){
  .liens{position:fixed;top:78px;left:0;right:0;background:var(--noir);flex-direction:column;
    padding:22px 26px;gap:18px;display:none;border-bottom:1px solid var(--ligne)}
  .liens.open{display:flex}
  .tel-cta{display:none}.burger{display:block}
}

/* heros */
.hero{position:relative;padding:96px 0 84px;overflow:hidden;
  background:radial-gradient(760px 340px at 74% -8%, rgba(237,0,0,.16), transparent 62%), var(--noir);
  border-bottom:1px solid var(--ligne)}
.hero h1{font-size:clamp(40px,6.4vw,74px);max-width:900px}
.hero h1 em{font-style:normal;color:var(--rouge)}
.hero .accroche{color:var(--clair);font-size:19px;max-width:620px;margin-top:6px}
.ctas{display:flex;gap:14px;margin-top:32px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:9px;padding:15px 28px;border-radius:999px;
  font-weight:700;font-size:15.5px;border:2px solid transparent;transition:transform .12s}
.btn:hover{transform:translateY(-2px)}
.btn-r{background:var(--rouge);color:#fff}
.btn-o{border-color:var(--ligne);color:var(--blanc)}
.btn-o:hover{border-color:var(--rouge)}

.page-hero{background:var(--charb);border-bottom:1px solid var(--ligne);padding:60px 0 48px}
.page-hero h1{font-size:clamp(32px,4.6vw,50px)}
.page-hero p{max-width:640px;color:var(--gris)}
.sur{color:var(--rouge);font-weight:700;font-size:12.5px;letter-spacing:.18em;
  text-transform:uppercase;margin-bottom:14px;display:block}

.bandeau{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--ligne);
  border-top:1px solid var(--ligne);border-bottom:1px solid var(--ligne)}
.bandeau div{background:var(--charb);padding:26px 24px;text-align:center}
.bandeau .n{font-family:'Barlow Condensed',sans-serif;font-size:30px;font-weight:700;color:var(--rouge)}
.bandeau .l{color:var(--gris);font-size:13.5px;margin-top:2px}
@media(max-width:760px){.bandeau{grid-template-columns:1fr}}

.sect{padding:76px 0}
.sect-alt{background:var(--charb)}
.sect h2{font-size:clamp(28px,3.8vw,40px);max-width:700px}
.intro{max-width:640px;font-size:17px}

.g3{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px;margin-top:42px}
.g2{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:26px;margin-top:42px}
.carte{background:var(--carte);border:1px solid var(--ligne);border-radius:var(--rayon);padding:30px;
  transition:border-color .18s}
.carte:hover{border-color:var(--rouge)}
.carte .num{font-family:'Barlow Condensed',sans-serif;color:var(--rouge);font-size:15px;
  font-weight:700;letter-spacing:.1em;margin-bottom:12px}
.carte h3{font-size:21px;margin-bottom:9px}
.carte p{font-size:14.8px;margin-bottom:0}

.etapes{counter-reset:e;display:grid;gap:2px;margin-top:40px;background:var(--ligne);
  border:1px solid var(--ligne);border-radius:var(--rayon);overflow:hidden}
.etape{background:var(--carte);padding:26px 30px;display:flex;gap:22px;align-items:flex-start}
.etape .c{font-family:'Barlow Condensed',sans-serif;font-size:34px;font-weight:700;
  color:var(--rouge);line-height:1;flex:0 0 42px}
.etape h3{font-size:19px;margin-bottom:6px}
.etape p{margin-bottom:0;font-size:14.8px}

.pastille{display:inline-block;background:var(--carte);border:1px solid var(--ligne);
  color:var(--clair);font-size:13.5px;font-weight:600;padding:8px 16px;border-radius:999px;margin:0 8px 9px 0}
.pastille.on{border-color:var(--rouge);color:var(--blanc)}

.bande{background:linear-gradient(120deg,#160000,var(--noir));border:1px solid var(--ligne);
  border-radius:16px;padding:46px 40px;text-align:center;margin-top:20px}
.bande h2{margin-bottom:10px}

.faq-i{border-bottom:1px solid var(--ligne);padding:22px 0}
.faq-i summary{cursor:pointer;font-family:'Barlow Condensed',sans-serif;font-weight:700;
  font-size:20px;color:var(--blanc);text-transform:uppercase;list-style:none;
  display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq-i summary::-webkit-details-marker{display:none}
.faq-i summary::after{content:'+';font-size:26px;color:var(--rouge);line-height:1}
.faq-i[open] summary::after{content:'\2212'}
.faq-i p{margin-top:12px;margin-bottom:0}

/* formulaire */
.form{display:grid;gap:16px;max-width:580px}
.form label{display:block;font-size:13px;font-weight:700;color:var(--rouge);
  letter-spacing:.06em;text-transform:uppercase;margin-bottom:7px}
.form input,.form select,.form textarea{width:100%;padding:13px 15px;border-radius:10px;
  border:1px solid var(--ligne);background:#0A0A0A;color:var(--clair);
  font-family:inherit;font-size:15px}
.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid var(--rouge);border-color:var(--rouge)}
.form .fac{font-weight:500;color:var(--gris);text-transform:none;letter-spacing:0}
.form button{justify-self:start;cursor:pointer;font-family:inherit}
.retour{display:none;margin:0;font-size:14.5px;font-weight:700}
.infos{background:var(--carte);border:1px solid var(--ligne);border-radius:var(--rayon);padding:30px}
.infos .r{margin-bottom:20px}
.infos .r:last-child{margin-bottom:0}
.infos b{display:block;font-family:'Barlow Condensed',sans-serif;font-size:14px;
  color:var(--rouge);letter-spacing:.1em;text-transform:uppercase;margin-bottom:4px}
.infos a{color:var(--blanc)}
.infos .gros{font-size:26px;font-weight:700;color:var(--blanc);font-family:'Barlow Condensed',sans-serif}

/* pied */
footer{background:#050505;border-top:1px solid var(--ligne);padding:54px 0 24px;margin-top:10px}
footer .cols{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:38px}
@media(max-width:820px){footer .cols{grid-template-columns:1fr}}
footer h4{font-family:'Barlow Condensed',sans-serif;color:var(--blanc);font-size:15px;
  letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}
footer a{color:var(--gris);display:block;margin-bottom:8px;font-size:14px}
footer a:hover{color:var(--rouge)}
footer .bas{border-top:1px solid var(--ligne);margin-top:34px;padding-top:18px;font-size:12.5px;
  color:var(--gris);display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
.legal h2{font-size:24px;margin-top:34px}
.legal p,.legal li{font-size:14.6px}