/* Legacy Automobiles — feuille de style commune */
:root {
  --ink: #0b0b0c;
  --ink-2: #151517;
  --ink-3: #232326;
  --paper: #f6f6f4;
  --paper-2: #ffffff;
  --text: #1b1b1d;
  --text-muted: #5d5d63;
  --on-ink: #f4f4f2;
  --on-ink-muted: #a3a3a8;
  --line-dark: rgba(255, 255, 255, 0.12);
  --line-light: #dcdcd8;
  --radius: 3px;
  --wrap: 1080px;
  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.6;
  color: var(--text);
  background: var(--ink);
  -webkit-font-smoothing: antialiased;
}

img, svg { display: block; max-width: 100%; height: auto; }

a { color: inherit; }

.wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 20px; }

.skip {
  position: absolute; left: -9999px; top: 0;
  background: #fff; color: #000; padding: 8px 12px; z-index: 10;
}
.skip:focus { left: 12px; top: 12px; }

:focus-visible { outline: 2px solid #ffffff; outline-offset: 3px; }
.legal :focus-visible { outline-color: var(--ink); }

/* ---------- Accueil ---------- */

.home {
  min-height: 100vh;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  color: var(--on-ink);
  background:
    radial-gradient(ellipse 80% 55% at 50% 38%, #1d1d20 0%, rgba(11, 11, 12, 0) 70%),
    var(--ink);
}

.hero {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding-top: 72px;
  padding-bottom: 56px;
}

.hero__logo { width: min(560px, 88vw); margin: 0 auto; }

.hero__tagline {
  margin: 28px 0 0;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--on-ink-muted);
}
.hero__tagline .sep { color: var(--on-ink); padding: 0 .35em; }

.hero__rule {
  width: 56px; height: 1px; border: 0;
  background: var(--line-dark);
  margin: 36px auto;
}

.cta { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 52px;
  padding: 14px 28px;
  border-radius: var(--radius);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}
.btn svg { width: 16px; height: 16px; flex: none; }

.btn--primary { background: #ffffff; color: var(--ink); border: 1px solid #ffffff; }
.btn--primary:hover { background: #e4e4e1; border-color: #e4e4e1; }

.btn--ghost { background: transparent; color: var(--on-ink); border: 1px solid rgba(255,255,255,.35); }
.btn--ghost:hover { border-color: #ffffff; background: rgba(255,255,255,.06); }

/* Contact */
.contact { border-top: 1px solid var(--line-dark); padding: 40px 0 44px; }

.contact__grid {
  display: grid;
  grid-template-columns: 1fr 0.8fr 1.15fr 1.25fr;
  gap: 28px;
}

.contact__label {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--on-ink-muted);
}

.contact__value { margin: 0; font-size: 15px; line-height: 1.55; color: var(--on-ink); font-style: normal; }
.contact__value a { text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.25); }
.contact__value a:hover { border-bottom-color: #fff; }

.hours { margin: 0; border-collapse: collapse; font-size: 14px; color: var(--on-ink); }
.hours th { text-align: left; font-weight: 400; color: var(--on-ink-muted); padding: 0 14px 2px 0; white-space: nowrap; vertical-align: top; }
.hours td { padding: 0 0 2px; white-space: nowrap; }

/* ---------- Pied de page ---------- */

.footer {
  background: var(--ink);
  color: var(--on-ink-muted);
  border-top: 1px solid var(--line-dark);
  padding: 22px 0 26px;
  font-size: 12.5px;
  line-height: 1.7;
}
.footer__inner { display: flex; flex-wrap: wrap; gap: 8px 24px; justify-content: space-between; align-items: center; }
.footer__nav { display: flex; flex-wrap: wrap; gap: 6px 20px; }
.footer a { color: var(--on-ink); text-decoration: none; }
.footer a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Pages juridiques ---------- */

.topbar { background: var(--ink); border-bottom: 1px solid var(--line-dark); }
.topbar__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 76px; }
.topbar__logo { width: 150px; }
.topbar__back {
  color: var(--on-ink); text-decoration: none;
  font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
  border: 1px solid rgba(255,255,255,.3); border-radius: var(--radius);
  padding: 9px 14px;
}
.topbar__back:hover { border-color: #fff; }

.legal { background: var(--paper); color: var(--text); padding: 56px 0 80px; }

.doc { max-width: 780px; margin: 0 auto; }

.doc__eyebrow {
  margin: 0 0 10px; font-size: 12px; font-weight: 700;
  letter-spacing: .2em; text-transform: uppercase; color: var(--text-muted);
}

.doc h1 {
  margin: 0 0 12px;
  font-size: clamp(26px, 4.4vw, 36px);
  line-height: 1.15;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.doc__meta { margin: 0 0 36px; color: var(--text-muted); font-size: 14px; }

.toc {
  background: var(--paper-2);
  border: 1px solid var(--line-light);
  border-radius: var(--radius);
  padding: 20px 24px;
  margin: 0 0 44px;
}
.toc p { margin: 0 0 10px; font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--text-muted); }
.toc ol { margin: 0; padding-left: 22px; columns: 2; column-gap: 32px; font-size: 14.5px; }
.toc li { break-inside: avoid; padding: 1px 0; }
.toc a { text-decoration: none; }
.toc a:hover { text-decoration: underline; text-underline-offset: 3px; }

.doc section { padding-top: 8px; margin-top: 36px; border-top: 1px solid var(--line-light); scroll-margin-top: 16px; }
.doc section:first-of-type { border-top: 0; margin-top: 0; }

.doc h2 {
  margin: 20px 0 12px;
  font-size: 17px;
  line-height: 1.35;
  letter-spacing: .02em;
}
.doc h2 .num {
  display: block;
  font-size: 11.5px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase;
  color: var(--text-muted); margin-bottom: 4px;
}
.doc h3 { margin: 22px 0 8px; font-size: 15px; }

.doc p, .doc li { font-size: 15.5px; }
.doc p { margin: 0 0 12px; }
.doc ul, .doc ol.list { margin: 0 0 14px; padding-left: 22px; }
.doc li { margin: 0 0 6px; }
.doc a { text-underline-offset: 3px; overflow-wrap: anywhere; }

.box {
  background: var(--paper-2);
  border: 1px solid #c9c9c4;
  border-left: 4px solid var(--ink);
  border-radius: var(--radius);
  padding: 20px 22px 10px;
  margin: 18px 0 18px;
}
.box p, .box li { font-size: 14.5px; }

.form-box {
  background: var(--paper-2);
  border: 1px dashed #a9a9a3;
  border-radius: var(--radius);
  padding: 22px 24px 12px;
}

.kv { width: 100%; border-collapse: collapse; margin: 0 0 8px; font-size: 15px; }
.kv th, .kv td { text-align: left; vertical-align: top; padding: 9px 0; border-bottom: 1px solid var(--line-light); }
.kv th { width: 42%; padding-right: 16px; font-weight: 600; color: var(--text-muted); }

/* Élément à compléter avant mise en ligne */
.todo {
  background: #fff1a8;
  outline: 1px dashed #b38f00;
  padding: 0 4px;
  border-radius: 2px;
}

/* ---------- Responsive ---------- */

@media (max-width: 860px) {
  .contact__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .wrap { padding: 0 16px; }
  .hero { padding-top: 56px; padding-bottom: 44px; }
  .hero__tagline { font-size: 11.5px; letter-spacing: .18em; line-height: 2; }
  .hero__tagline .sep { display: none; }
  .hero__tagline .part { display: block; }
  .cta { flex-direction: column; align-items: stretch; width: 100%; }
  .btn { width: 100%; padding: 14px 18px; font-size: 12.5px; letter-spacing: .08em; }
  .contact__grid { grid-template-columns: 1fr; gap: 22px; }
  .toc ol { columns: 1; }
  .topbar__logo { width: 120px; }
  .legal { padding: 36px 0 56px; }
  .kv th, .kv td { display: block; width: 100%; padding: 0; border: 0; }
  .kv th { padding-top: 10px; }
  .kv td { padding-bottom: 10px; border-bottom: 1px solid var(--line-light); }
  .footer__inner { flex-direction: column; align-items: flex-start; }
}

@media print {
  .topbar, .footer, .toc, .skip { display: none; }
  .legal { background: #fff; padding: 0; }
  .box, .form-box { break-inside: avoid; }
}