/* =========================================================
   AdminToolz : pages statiques / d'autorité (about, legal…)
   Chargé par PageController : 'styles' => ['page.css']
   ========================================================= */

/* ---------- Bandeau de titre ---------- */
.page-head{
  background:#fff;
  border-bottom:1px solid var(--line);
  padding:34px 26px 32px;
}
.page-head-inner{max-width:940px;margin:0 auto;}

.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;}
.crumbs li{
  font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted);
}
.crumbs li + li::before{content:"/";margin-right:8px;color:#C8C8C8;}
.crumbs a{color:var(--blue);}
.crumbs a:hover{text-decoration:underline;}

.page-title{
  font-family:var(--heavy);
  font-size:44px;line-height:1.08;letter-spacing:-.6px;
  margin-top:18px;
}
.page-lead{
  margin-top:16px;font-size:18px;line-height:1.55;color:#4A4A4A;max-width:70ch;
}
.page-dates{
  margin-top:20px;display:flex;flex-wrap:wrap;gap:18px;
  font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted);
}
.page-updated{color:#3F3F3F;}

/* ---------- Corps + sommaire ---------- */
.page-wrap{
  max-width:1160px;margin:0 auto;padding:40px 26px 64px;
  display:grid;grid-template-columns:260px minmax(0,1fr);gap:48px;align-items:start;
}
.page-wrap > .page-body--wide{grid-column:1/-1;max-width:820px;margin:0 auto;}

.page-toc{
  position:sticky;top:96px;
  background:#fff;border:1px solid #E6E6E6;border-radius:8px;
  padding:20px 22px 22px;
}
.page-toc-title{
  font-family:var(--mono);font-size:12px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted);margin-bottom:14px;
}
.page-toc ol{counter-reset:toc;list-style:none;}
.page-toc li{counter-increment:toc;}
.page-toc li + li{margin-top:10px;}
.page-toc a{
  display:block;font-size:15.5px;line-height:1.35;color:#3F3F3F;
  padding-left:22px;position:relative;
}
.page-toc a::before{
  content:counter(toc) ".";
  position:absolute;left:0;
  font-family:var(--mono);font-size:12px;color:var(--red);top:2px;
}
.page-toc a:hover{color:var(--red);}

/* ---------- Prose ---------- */
.page-body{
  background:#fff;border:1px solid #E6E6E6;border-radius:8px;
  padding:36px 40px 40px;
  font-size:17px;line-height:1.65;color:#333;
}
.page-body > * + *{margin-top:18px;}
.page-body h2{
  font-family:var(--heavy);font-size:26px;line-height:1.2;
  margin-top:42px;padding-top:6px;scroll-margin-top:100px;
}
.page-body h2:first-child{margin-top:0;}
.page-body h3{
  font-size:20px;font-weight:600;line-height:1.3;margin-top:28px;scroll-margin-top:100px;
}
.page-body p{max-width:72ch;}
.page-body a{color:var(--blue);text-decoration:underline;}
.page-body a:hover{color:#0F64D6;}
.page-body ul,.page-body ol{padding-left:22px;max-width:72ch;}
.page-body ul li{list-style:disc;}
.page-body ol li{list-style:decimal;}
.page-body li + li{margin-top:8px;}
.page-body strong{font-weight:600;color:#1F1F1F;}
.page-body blockquote{
  border-left:3px solid var(--red);
  background:var(--bg-soft);
  padding:16px 20px;margin-left:0;margin-right:0;
  font-size:16.5px;color:#3F3F3F;
}
.page-body table{
  width:100%;border-collapse:collapse;font-size:15.5px;
  display:block;overflow-x:auto;
}
.page-body th,.page-body td{
  border:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top;
}
.page-body th{background:var(--bg-soft);font-weight:600;}
.page-body code{
  font-family:var(--mono);font-size:14px;background:var(--bg-soft);
  padding:2px 6px;border-radius:3px;
}
.page-body img{border-radius:4px;border:1px solid var(--line);}

/* ---------- Maillage interne + contact ---------- */
.page-related{
  margin-top:44px;padding-top:26px;border-top:1px solid var(--line);
}
.page-related h2{
  font-family:var(--heavy);font-size:20px;letter-spacing:0;
  text-transform:none;color:#1F1F1F;margin:0 0 16px;
}
.page-related ul{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;padding-left:0;margin:0;
}
.page-related li{list-style:none;margin:0;}
.page-related a{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  text-decoration:none;
  border:1px solid #E6E6E6;border-radius:6px;background:#fff;
  padding:14px 16px;font-size:16px;color:#2B2B2B;
  transition:border-color .15s,color .15s;
}
.page-related a::after{
  content:"\203A";
  font-size:20px;line-height:1;color:#C8C8C8;
}
.page-related a:hover{border-color:var(--red);color:var(--red);}
.page-related a:hover::after{color:var(--red);}
.page-contact-note{
  margin-top:26px;font-size:15.5px;color:var(--muted);
}

/* ---------- Responsive ---------- */
@media (max-width:1000px){
  .page-title{font-size:34px;}
  .page-wrap{grid-template-columns:1fr;gap:28px;padding-top:28px;}
  .page-toc{position:static;}
  .page-wrap > .page-body--wide{max-width:none;}
}

@media (max-width:640px){
  .page-related ul{grid-template-columns:1fr;}
  .page-head{padding:24px 18px 24px;}
  .page-title{font-size:27px;}
  .page-lead{font-size:16.5px;}
  .page-wrap{padding:22px 18px 48px;}
  .page-body{padding:24px 20px 28px;font-size:16.5px;border-radius:6px;}
  .page-body h2{font-size:22px;margin-top:32px;}
}