

.page-hero{ background:var(--bg-soft); padding:64px 0 56px; }
.page-hero h1{ font-size:40px; max-width:20ch; margin:0 0 18px; }
.legal-title-nowrap .page-hero h1{ max-width:none; white-space:nowrap; font-size:clamp(16px,5vw,40px); }
.page-hero .lead{ color:var(--text-muted); font-size:18px; max-width:60ch; margin:0; }

.page-hero .lead + .lead{ margin-top:14px; }

.hero-deck{ color:var(--text); font-size:20px; font-weight:600; line-height:1.45; max-width:44ch; margin:0 0 20px; }
@media (max-width:900px){
  .hero-deck{ font-size:18px; }
}

.breadcrumb{ font-size:13px; color:var(--text-muted); padding:18px 0 0; }
.breadcrumb a{ color:var(--text-muted); text-decoration:none; }
.breadcrumb a:hover{ color:var(--accent); }

.prose{ max-width:68ch; }
.prose h2{ font-size:26px; margin:0 0 14px; }
.prose h3{ font-size:19px; font-weight:700; margin:32px 0 10px; }
.prose p{ margin:0 0 20px; }
.prose ul{ padding-left:22px; margin:0 0 20px; }
.prose li{ margin-bottom:8px; }

.two-col{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px; align-items:start; }

.field{ margin-bottom:18px; }
.field label{ display:block; font-size:13px; font-weight:600; margin-bottom:6px; }
.field input, .field textarea{
  width:100%; font-family:var(--font); font-size:15px; padding:12px 14px;
  border:1px solid var(--border); border-radius:10px; background:#fff; color:var(--text);
}
.field input:focus, .field textarea:focus{ outline:3px solid var(--accent-light); border-color:var(--accent); }
.field textarea{ resize:vertical; min-height:130px; }
.field-hint{ font-size:12.5px; color:var(--text-muted); margin:6px 0 0; }
.field-honeypot{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

.field-error{ margin:6px 0 0; font-size:13px; color:#B42318; }
.has-error input, .has-error textarea{ border-color:#B42318; }

.form-alert:empty{ display:none; }
.form-alert{ margin:0 0 22px; padding:13px 16px; border-radius:12px; font-size:14px; line-height:1.5; }
.two-col > .form-alert{ grid-column:1 / -1; }
.form-alert-error{ background:#FEF3F2; border:1px solid #FDA29B; color:#B42318; }
.form-alert-ok{ background:var(--accent-light); border:1px solid var(--accent); color:var(--accent-dark); }

.field-compteur{ margin:6px 0 0; font-size:12.5px; color:var(--text-muted); text-align:right; }
.field-compteur-limite{ color:#B42318; font-weight:600; }

.cf-turnstile{ margin:0 0 20px; min-height:65px; }

.field-consent{ display:flex; gap:10px; align-items:flex-start; font-size:13.5px; color:var(--text-muted); margin:18px 0 22px; }
.field-consent input{ margin-top:3px; flex:none; }
.field-consent a{ color:var(--accent); }

.info-panel{ border:1px solid var(--border); border-radius:var(--radius); padding:26px; background:#fff; box-shadow:var(--shadow); }
.info-panel .row{ display:flex; justify-content:space-between; gap:16px; padding:12px 0; border-bottom:1px solid var(--border); font-size:14px; }
.info-panel .row:last-child{ border-bottom:none; }
.info-panel .row span:first-child{ color:var(--text-muted); }
.info-panel a{ color:var(--accent); text-decoration:none; font-weight:600; }

.note{ font-size:12.5px; color:var(--text-muted); max-width:60ch; margin:24px 0 0; }
.note code{ background:var(--bg-soft); border:1px solid var(--border); border-radius:5px; padding:1px 6px; font-size:.95em; }

.post-list{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }

.error-wrap{ max-width:620px; margin:0 auto; padding:110px 24px 120px; text-align:center; }
.error-code{ font-size:64px; font-weight:800; color:var(--accent); opacity:.35; line-height:1; margin-bottom:12px; }
.error-wrap h1{ font-size:32px; margin-bottom:14px; }
.error-wrap p{ color:var(--text-muted); margin:0 auto 32px; max-width:44ch; }
.error-wrap .btn-row{ justify-content:center; }

.hero-centre{ text-align:center; }
.hero-centre h1, .hero-centre .lead{ margin-left:auto; margin-right:auto; }
.note-centre{ text-align:center; margin-left:auto; margin-right:auto; }

@media (max-width:900px){
  .two-col{ grid-template-columns:1fr; gap:32px; }
  .post-list{ grid-template-columns:1fr; }
  .page-hero{ padding:44px 0 40px; }
  .page-hero h1{ font-size:30px; }
  .legal-title-nowrap .page-hero h1{ font-size:clamp(16px,5vw,40px); }
}
