/* ═══════════════════════════════════════════════════════════════
   pages.css — Pages légales et informatives de rallyo.fr
   Reprend les jetons de la page d'accueil : même palette, mêmes
   polices, mise en page de lecture plutôt que de vitrine.
   ═══════════════════════════════════════════════════════════════ */
:root {
  --brand:#2563eb; --brand-dark:#1d4ed8; --accent:#0ea5e9;
  --ink:#0f172a; --body:#334155; --muted:#64748b;
  --border:#e2e8f0; --surface:#ffffff; --cream:#f8fafc;
  --radius:12px;
}
* { box-sizing:border-box; }
body {
  margin:0; background:var(--cream); color:var(--body);
  font-family:'Inter', system-ui, sans-serif; line-height:1.7; font-size:16px;
}
.p-header {
  background:linear-gradient(135deg, #0f172a 0%, #1e3a8a 100%);
  color:#fff; padding:28px 20px;
}
.p-header-inner, .p-main, .p-footer-inner { max-width:760px; margin:0 auto; }
.p-brand {
  display:inline-flex; align-items:center; gap:10px;
  color:#fff; text-decoration:none; font-weight:800; font-size:1.1rem;
  font-family:'Plus Jakarta Sans', system-ui, sans-serif;
}
.p-brand span {
  width:32px; height:32px; border-radius:9px;
  background:linear-gradient(135deg, var(--brand), var(--accent));
  display:flex; align-items:center; justify-content:center; font-size:.95rem;
}
.p-header h1 {
  font-family:'Plus Jakarta Sans', system-ui, sans-serif;
  font-size:clamp(1.5rem, 3.5vw, 2.1rem); margin:18px 0 4px; line-height:1.25;
}
.p-header p { margin:0; color:rgba(255,255,255,.6); font-size:.9rem; }
.p-main {
  background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius); padding:36px 32px; margin:-18px auto 48px;
  position:relative;
}
.p-main h2 {
  font-family:'Plus Jakarta Sans', system-ui, sans-serif; color:var(--ink);
  font-size:1.15rem; margin:34px 0 10px; padding-top:14px;
  border-top:1px solid var(--border);
}
.p-main h2:first-of-type { margin-top:0; border-top:none; padding-top:0; }
.p-main h3 { font-size:1rem; color:var(--ink); margin:22px 0 6px; }
.p-main a { color:var(--brand); }
.p-main ul { padding-left:20px; }
.p-main li { margin-bottom:6px; }
table { width:100%; border-collapse:collapse; margin:14px 0; font-size:.92rem; }
th, td { text-align:left; padding:9px 10px; border-bottom:1px solid var(--border); vertical-align:top; }
th { color:var(--ink); font-weight:600; background:var(--cream); }
.p-note {
  background:#eff6ff; border-left:3px solid var(--brand);
  padding:12px 16px; border-radius:0 8px 8px 0; margin:18px 0; font-size:.92rem;
}
.p-todo {
  background:#fef3c7; border-left:3px solid #d97706;
  padding:12px 16px; border-radius:0 8px 8px 0; margin:18px 0; font-size:.92rem;
}
.p-maj { color:var(--muted); font-size:.85rem; margin-top:32px; }
.p-footer { background:#0f172a; color:rgba(255,255,255,.5); padding:24px 20px; font-size:.85rem; }
.p-footer a { color:rgba(255,255,255,.75); text-decoration:none; margin-right:16px; }
.p-footer a:hover { color:#fff; }
@media (max-width:640px) {
  .p-main { padding:26px 20px; margin:-12px 12px 32px; }
  table, thead, tbody, th, td, tr { display:block; }
  th { display:none; }
  td { border:none; padding:4px 0; }
  tr { border-bottom:1px solid var(--border); padding:10px 0; }
}