:root{
  --ink:#14212b; --road:#1d4e89; --line:#f2b705; --paper:#f5f6f7; --white:#fff; --muted:#566573; --err:#b3261e;
  --head:"Barlow Condensed","Arial Narrow",Arial,sans-serif; --body:"Barlow",Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--body);color:var(--ink);background:var(--white);line-height:1.6;font-size:17px}
a{color:inherit}
.wrap{max-width:1040px;margin:0 auto;padding:0 20px}
h1,h2,h3{font-family:var(--head);line-height:1.05;margin:0;letter-spacing:.01em}
:focus-visible{outline:3px solid var(--line);outline-offset:2px}

header.top{background:var(--white);color:var(--ink);border-bottom:1px solid #dde3e8}
header.top .wrap{display:flex;justify-content:space-between;align-items:center;padding-top:8px;padding-bottom:8px}
.logo{display:block;line-height:0}
.logo img{height:64px;width:auto;display:block}
.btn{display:inline-block;background:var(--line);color:var(--ink);font-weight:600;text-decoration:none;padding:12px 22px;border:0;border-radius:4px;font:600 1rem var(--body);cursor:pointer}
.btn:hover{background:#ffc82e}

.hero{--photo:url(camion.jpg);color:var(--white);padding:84px 0 0;position:relative;overflow:hidden;
  background:linear-gradient(90deg,rgba(14,24,33,.93) 0%,rgba(14,24,33,.8) 40%,rgba(14,24,33,.12) 72%,rgba(14,24,33,0) 100%),var(--photo) 72% center/cover no-repeat,var(--ink)}
.hero h1,.hero p{text-shadow:0 2px 12px rgba(0,0,0,.55)}
@media(max-width:700px){.hero{padding-top:56px;background:linear-gradient(rgba(14,24,33,.82),rgba(14,24,33,.7)),var(--photo) 72% center/cover no-repeat,var(--ink)}}
.hero h1{font-size:clamp(2.8rem,9vw,5.5rem);font-weight:700;max-width:12ch}
.hero p{max-width:50ch;color:#eef1f4;font-size:1.15rem;margin:22px 0 28px}
.road{height:46px;margin-top:56px;background:#0c141b;position:relative}
.road::after{content:"";position:absolute;left:0;right:0;top:50%;height:4px;transform:translateY(-50%);
  background:repeating-linear-gradient(90deg,var(--line) 0 46px,transparent 46px 92px)}

section{padding:64px 0}
section.alt{background:var(--paper)}
h2{font-size:clamp(2rem,5vw,2.8rem);margin-bottom:12px}
.lead{color:var(--muted);max-width:60ch;margin:0 0 32px}
.grid{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.box{border-left:5px solid var(--road);padding:4px 0 4px 16px}
.box h3{font-size:1.5rem;margin-bottom:6px}
.box p{margin:0;color:var(--muted)}
.sites{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.site{background:var(--white);border:2px solid var(--ink);border-radius:6px;padding:22px}
.site h3{font-size:1.9rem}
.site p{margin:6px 0 0;color:var(--muted)}

form{background:var(--white);border:2px solid var(--ink);border-radius:6px;padding:28px;max-width:760px}
fieldset{border:0;margin:0 0 22px;padding:0}
legend{font-family:var(--head);font-size:1.5rem;font-weight:700;margin-bottom:10px;padding:0}
.row{display:grid;gap:16px;grid-template-columns:1fr 1fr}
@media(max-width:640px){.row{grid-template-columns:1fr}form{padding:20px}}
.field{margin-bottom:16px}
label,.lbl{display:block;font-weight:600;margin-bottom:6px}
.opt{font-weight:400;color:var(--muted)}
input[type=text],input[type=tel],input[type=email],input[type=number],input[type=date],textarea{
  width:100%;font:inherit;padding:11px 12px;border:1.5px solid #8795a1;border-radius:4px;background:var(--white);color:var(--ink)}
textarea{min-height:120px;resize:vertical}
input:focus,textarea:focus{border-color:var(--road)}
.choices{display:flex;gap:12px;flex-wrap:wrap}
.choice{display:flex;align-items:center;gap:8px;border:1.5px solid #8795a1;border-radius:4px;padding:10px 16px;cursor:pointer;font-weight:500;margin:0}
.choice:has(input:checked){border-color:var(--road);background:#e8f0f9}
.choice input{accent-color:var(--road);width:18px;height:18px}
.hint{font-size:.9rem;color:var(--muted);margin:4px 0 0}
.consent{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:.95rem}
.consent input{margin-top:5px;accent-color:var(--road)}
.hp{position:absolute;left:-9999px}
#status{margin-top:16px;font-weight:600}
#status.ok{color:#146c2e}
#status.ko{color:var(--err)}
[hidden]{display:none!important}

footer{background:var(--ink);color:#d5dbe1;padding:32px 0;font-size:.95rem}
footer a{color:var(--line)}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.nav{display:flex;align-items:center;gap:18px}
.nav a.link{font-weight:600;text-decoration:none;font-size:.95rem}
.nav a.link:hover{text-decoration:underline}
@media(max-width:560px){.nav{gap:10px}.nav .btn{padding:10px 14px;font-size:.9rem}.nav a.link{font-size:.85rem}.logo img{height:52px}}
.hero.pro h1{max-width:15ch}
.checks{display:flex;gap:12px;flex-wrap:wrap}
.row3{display:grid;gap:16px;grid-template-columns:1fr 1fr 1fr}
@media(max-width:640px){.row3{grid-template-columns:1fr}}
select{width:100%;font:inherit;padding:11px 12px;border:1.5px solid #8795a1;border-radius:4px;background:#fff;color:var(--ink)}
.linkfoot{display:block;margin-top:6px}