/* Articles généraux (article, article_appellation, article_cepage) : s'appuie sur la page de lecture de la géologie (fidelity-geology.css). */
@layer pages {
  /* Chapeau migré, en tête du corps */
  .prose .art-chapeau{margin:0 0 var(--space-6);font-size:var(--text-l);line-height:1.5}
  .prose .art-chapeau>:last-child{margin-bottom:0}

  /* Étape 15 : thème de l'article, pastille discrète sous l'étiquette de rubrique */
  .article-theme{margin:-8px 0 var(--space-4)}
  .article-theme a{display:inline-block;font-size:var(--text-xs);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--c-ink-soft);border:1px solid var(--c-taupe-light);border-radius:999px;padding:3px 12px;text-decoration:none;background:transparent}
  .article-theme a:hover{color:var(--c-brand-strong);border-color:var(--c-brand)}

  /* Débordements : le corps migré ne doit jamais élargir la page */
  .article-layout,.prose{min-width:0}
  .prose{overflow-wrap:anywhere}
  .prose img{max-width:100%;height:auto}
  .prose iframe,.prose video{max-width:100%}
  .prose pre{overflow-x:auto;max-width:100%}

  /* Suite de l'article */
  .art-after{padding-block:var(--space-7)}
  .art-after .wrap>*+*{margin-top:var(--space-7)}
  .art-after__title{font-size:var(--text-l);font-weight:600;line-height:1.3;margin:0 0 var(--space-4);padding-bottom:var(--space-3);border-bottom:1px solid var(--c-taupe)}
  .art-back{display:flex;flex-wrap:wrap;gap:var(--space-3) var(--space-6);font-size:var(--text-m)}
  .art-back a,.art-list a,.art-tags a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--c-taupe)}
  .art-back a:hover,.art-list a:hover,.art-tags a:hover{text-decoration-color:currentColor}
  .art-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--gutter)}
  .art-list li{padding:var(--space-3) 0;border-bottom:1px solid var(--c-line);font-size:var(--text-m);line-height:1.4}
  .art-tags li{padding:0}
  .art-tags a{display:block;padding:8px 14px;text-decoration:none}
  .art-tags a:hover{text-decoration:underline;text-underline-offset:3px}
  @media (max-width:700px){.art-list{grid-template-columns:1fr}}
}