/* ==========================================================================
   ALLO811 — V3 · Couche de compatibilité des pages reprises
   Restyle le vocabulaire de classes des 60 fiches santé et des 10 pages
   légales (héritées de la V2) avec les tokens de la charte V3.
   À charger APRÈS allo811.css et allo811-components.css.
   ========================================================================== */

/* Alias de tokens V2 encore référencés en style inline dans le contenu repris */
:root{ --text-soft:var(--fg2); --text-main:var(--fg1); --text-tertiary:var(--fg3); --text-strong:var(--allo-blue); }

/* ---------- Sur-titre à filet ---------- */
.eyebrow.with-line{ display:flex; align-items:center; gap:14px; }
.eyebrow.with-line::after{ content:""; flex:1; height:1px; background:var(--border); max-width:120px; }

/* ---------- Boutons hérités ---------- */
.btn-light{ background:#fff; color:var(--allo-blue); }
.btn-light:hover{ background:#fff; color:var(--allo-red); transform:translateY(-2px); box-shadow:var(--shadow-pop); }
.btn-tertiary{ display:inline-flex; align-items:center; gap:8px; font-family:var(--sans);
  font-size:15px; font-weight:600; color:var(--allo-blue); text-decoration:none; }
.btn-tertiary:hover{ color:var(--allo-red); }
.btn-tertiary::after{ content:"→"; transition:transform var(--dur) var(--ease); }
.btn-tertiary:hover::after{ transform:translateX(4px); }

/* ==========================================================================
   FICHES SANTÉ
   ========================================================================== */

.fiche-hero{ background:var(--allo-blue); color:#fff; padding-block:clamp(44px,5vw,72px); position:relative; }
.fiche-hero h1{ color:#fff; font-size:var(--t-h1); margin-bottom:18px; }
.fiche-hero .eyebrow{ color:rgba(255,255,255,.6); }
.fiche-hero .eyebrow.with-line::after{ background:rgba(255,255,255,.22); }
.fiche-hero-inner{ display:grid; gap:clamp(28px,4vw,56px); grid-template-columns:1fr 320px; align-items:start; }
@media (max-width:900px){ .fiche-hero-inner{ grid-template-columns:1fr; } }
.fiche-summary{ font-size:var(--t-lede); line-height:1.55; color:rgba(255,255,255,.82); max-width:52ch; margin:0; }

/* Niveau d'attention */
.fiche-attention{ display:inline-flex; align-items:center; gap:10px; margin-top:26px;
  padding:9px 18px; border-radius:var(--r-pill); background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18); font-size:13.5px; font-weight:600; color:#fff; }
.fiche-attention .att-dot{ width:8px; height:8px; border-radius:50%; background:var(--allo-red); flex:none; }
.fiche-attention[data-att="surveillance"] .att-dot{ background:#F0B429; }
.fiche-attention[data-att="information"] .att-dot{ background:var(--allo-bluegrey); }

/* Tags de profil */
.fiche-tags{ display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
.fiche-tag{ padding:6px 14px; border-radius:var(--r-pill); background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.16); font-size:12.5px; font-weight:600; color:rgba(255,255,255,.8); }

/* Sommaire */
.fiche-side{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r-xl); padding:26px 28px; }
.fiche-side h4{ font-family:var(--sans); font-size:11px; font-weight:700;
  letter-spacing:var(--tracking-eyebrow); text-transform:uppercase;
  color:rgba(255,255,255,.55); margin:0 0 16px; }
.fiche-side ol{ counter-reset:toc; list-style:none; margin:0; padding:0; }
.fiche-side li{ counter-increment:toc; margin:0; }
.fiche-side a{ display:flex; gap:12px; padding:8px 0; font-size:14.5px; font-weight:500;
  color:rgba(255,255,255,.78); text-decoration:none; }
.fiche-side a::before{ content:counter(toc,decimal-leading-zero); flex:none;
  font-family:var(--serif); color:var(--allo-red); font-size:13px; }
.fiche-side a:hover{ color:#fff; }

/* Corps de fiche */
.fiche-main{ padding-block:clamp(40px,5vw,72px); }
.fiche-grid{ display:grid; }
.fiche-content{ max-width:76ch; }
.fiche-content>section+section{ margin-top:clamp(40px,4vw,60px); }
.fiche-content h2{ font-size:var(--t-h3); margin-bottom:16px; padding-bottom:14px;
  border-bottom:1px solid var(--border); }
.fiche-content h3{ font-family:var(--sans); font-weight:700; font-size:17px;
  letter-spacing:0; margin-bottom:10px; }
.fiche-content p{ color:var(--fg2); }
.fiche-content section{ scroll-margin-top:100px; }

/* Listes de signes */
.signs-list{ list-style:none; margin:0; padding:0; }
.signs-list li{ position:relative; padding-inline-start:26px; padding-block:7px;
  font-size:16px; color:var(--fg2); }
.signs-list li::before{ content:""; position:absolute; inset-inline-start:0; top:15px;
  width:7px; height:7px; border-radius:50%; background:var(--allo-bluegrey); }
.signs-list.alert li::before{ background:var(--allo-red); }
.signs-list.alert{ background:#fff; border:1px solid var(--border);
  border-inline-start:3px solid var(--allo-red); border-radius:var(--r-lg); padding:20px 24px; }

/* Cartes de contexte */
.context-grid{ display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); }
.context-card{ background:var(--allo-light); border-radius:var(--r-lg); padding:24px 26px; }
.context-card p{ font-size:15.5px; margin:0; }

/* Ce qu'Allo811 fait / ne remplace pas */
.coord-grid{ display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); }
.coord-block{ border-radius:var(--r-lg); padding:26px 28px; border:1px solid var(--border); background:#fff; }
.coord-block h3{ margin-bottom:14px; }
.coord-block ul{ list-style:none; margin:0; padding:0; }
.coord-block li{ position:relative; padding-inline-start:24px; padding-block:6px;
  font-size:15.5px; color:var(--fg2); }
.coord-block li::before{ position:absolute; inset-inline-start:0; font-weight:700; }
.coord-block.helps{ border-inline-start:3px solid var(--allo-blue); }
.coord-block.helps li::before{ content:"+"; color:var(--allo-blue); }
.coord-block.not{ background:var(--allo-light); border-color:transparent;
  border-inline-start:3px solid var(--allo-red); }
.coord-block.not li::before{ content:"–"; color:var(--allo-red); }

/* FAQ de fiche */
.faq-list{ border-top:1px solid var(--border); }
.faq-item{ padding-block:22px; border-bottom:1px solid var(--border); }
.faq-item h3{ margin-bottom:8px; color:var(--allo-blue); }
.faq-item p{ font-size:15.5px; margin:0; }

/* Contenus liés */
.related-grid{ display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); }
.related-card{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px;
  background:#fff; border:1px solid var(--border); border-radius:var(--r-lg);
  padding:22px 24px; text-decoration:none; transition:all var(--dur) var(--ease); }
.related-card:hover{ border-color:var(--allo-blue); transform:translateY(-3px); box-shadow:var(--shadow-lg); }
.related-card strong{ display:block; font-size:16px; color:var(--allo-blue); margin-bottom:6px; }
.related-card span span{ font-size:14.5px; color:var(--fg2); line-height:1.5; }
.related-card .arrow{ flex:none; color:var(--allo-red); font-size:18px;
  transition:transform var(--dur) var(--ease); }
.related-card:hover .arrow{ transform:translateX(4px); }

/* Bandeau de conversion de fiche */
.fiche-cta{ background:var(--allo-blue); color:#fff; padding-block:clamp(48px,6vw,80px); }
.fiche-cta-inner{ max-width:640px; }
.fiche-cta h2{ color:#fff; margin-bottom:14px; }
.fiche-cta p{ color:rgba(255,255,255,.74); }
.fiche-cta .btn{ margin-top:12px; }
.fiche-cta-mention{ font-size:13px; color:rgba(255,255,255,.5); margin:22px 0 0; max-width:56ch; }

/* ==========================================================================
   PAGES LÉGALES
   ========================================================================== */

.legal-hero{ background:var(--allo-blue); color:#fff; padding-block:clamp(44px,5vw,76px); }
.legal-hero h1{ color:#fff; }
.legal-hero .eyebrow{ color:rgba(255,255,255,.6); }
.legal-hero .eyebrow.with-line::after{ background:rgba(255,255,255,.22); }
.legal-hero .lede{ color:rgba(255,255,255,.82); }

.legal-meta{ display:flex; flex-wrap:wrap; gap:14px 40px; margin-top:32px;
  padding-top:24px; border-top:1px solid rgba(255,255,255,.16); }
.legal-meta-item{ display:grid; gap:3px; }
.legal-meta-label{ font-size:11px; font-weight:700; letter-spacing:var(--tracking-eyebrow);
  text-transform:uppercase; color:rgba(255,255,255,.5); }
.legal-meta-value{ font-size:14.5px; color:#fff; font-weight:500; }

.legal-main{ padding-block:clamp(40px,5vw,72px); }
.legal-grid{ display:grid; gap:clamp(28px,4vw,56px); grid-template-columns:280px 1fr; align-items:start; }
@media (max-width:940px){ .legal-grid{ grid-template-columns:1fr; } }

.legal-toc{ position:sticky; top:100px; background:var(--allo-light);
  border-radius:var(--r-xl); padding:26px 28px; }
.legal-toc h2,.legal-toc h4{ font-family:var(--sans); font-size:11px; font-weight:700;
  letter-spacing:var(--tracking-eyebrow); text-transform:uppercase; color:var(--fg3); margin:0 0 16px; }
.legal-toc ol,.legal-toc ul{ list-style:none; margin:0; padding:0; }
.legal-toc li{ margin:0; }
.legal-toc a{ display:block; padding:8px 0; font-size:14.5px; font-weight:500;
  color:var(--allo-blue); text-decoration:none; }
.legal-toc a:hover{ color:var(--allo-red); }
@media (max-width:940px){ .legal-toc{ position:static; } }

.legal-content{ max-width:76ch; }
.legal-article{ scroll-margin-top:100px; }
.legal-article+.legal-article{ margin-top:clamp(36px,4vw,56px); padding-top:clamp(36px,4vw,56px);
  border-top:1px solid var(--border); }
.legal-article h2{ font-size:var(--t-h3); margin-bottom:18px; display:flex; gap:14px; align-items:baseline; }
.art-num{ flex:none; font-family:var(--serif); font-size:15px; color:var(--allo-red); }
.legal-article p,.legal-article li{ color:var(--fg2); }
.legal-subsection{ margin-top:26px; }
.legal-subsection h3{ font-family:var(--sans); font-weight:700; font-size:16.5px;
  letter-spacing:0; margin-bottom:10px; }

.legal-callout{ background:var(--allo-light); border-radius:var(--r-lg);
  border-inline-start:3px solid var(--allo-red); padding:22px 26px; margin-block:26px; }
.legal-callout p:last-child{ margin-bottom:0; }
.callout-label{ display:block; font-size:11px; font-weight:700;
  letter-spacing:var(--tracking-eyebrow); text-transform:uppercase;
  color:var(--allo-red); margin-bottom:10px; }

.legal-cta{ background:var(--allo-blue); color:#fff; padding-block:clamp(44px,5vw,72px); }
.legal-cta-inner{ max-width:640px; }
.legal-cta h2{ color:#fff; margin-bottom:14px; }
.legal-cta p{ color:rgba(255,255,255,.74); }
.legal-cta .btn{ margin-top:12px; }
.legal-cta-mention{ font-size:13px; color:rgba(255,255,255,.5); margin:22px 0 0; max-width:56ch; }