/* Guides — mise en page d'article */
.guide { padding: 110px 0 60px; }
.guide article { max-width: 46em; margin: 0 auto; }
.ariane ol { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; padding: 0; margin: 0 auto 26px; max-width: 46em; font-size: .85rem; color: var(--parchemin-2); }
.ariane li + li::before { content: "›"; margin-right: 6px; color: var(--or); }
.ariane a { color: var(--parchemin-2); }
.g-entete h1 { font-size: clamp(2.3rem, 6vw, 3.6rem); }
.g-meta { color: var(--parchemin-2); font-size: .9rem; margin: 14px 0 0; }
.chapo { font-size: 1.18rem; color: #efe6de; margin: 30px 0 18px; }
.guide p { color: #e6ddd6; }
.guide article h2 { font-size: clamp(1.7rem, 4vw, 2.2rem); margin: 2em 0 .5em; scroll-margin-top: 24px; }
.transparence { font-size: .9rem; border: 1px solid var(--trait); border-radius: 12px; padding: 12px 16px; background: rgba(22,18,16,.7); }
.sommaire { border-left: 3px solid var(--braise); background: rgba(224,90,27,.06); border-radius: 0 12px 12px 0; padding: 16px 22px; margin: 26px 0; }
.sommaire p { margin: 0 0 6px; font: 700 1.2rem/1 var(--f-titre); color: var(--or-pale); }
.sommaire ol { margin: 0; padding-left: 1.2em; display: grid; gap: 4px; }
.reco { margin: 34px 0; padding: 24px; border-radius: 16px; border: 1px solid var(--braise); background: radial-gradient(circle at 0 0, rgba(224,90,27,.18), transparent 60%), var(--obsidienne); box-shadow: 0 24px 60px -34px var(--braise); }
.reco-titre { display: flex; align-items: center; gap: 10px; font: 700 1.35rem/1.1 var(--f-titre); color: var(--or-pale) !important; margin: 0 0 8px; }
.reco-titre svg { width: 34px; height: 30px; }
.reco-liens { display: grid; gap: 10px; margin: 16px 0 10px; }
.reco-liens .btn { justify-content: center; }
.formats { margin: 0; font-size: .9rem; text-align: center; color: var(--parchemin-2) !important; }
.reco-mention { font-size: .8rem; color: var(--parchemin-2) !important; margin: 0; }
svg.mini { width: 22px; height: 22px; }
.banniere-cfg { margin: 34px 0; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 22px 24px; border-radius: 16px; border: 1px solid var(--trait); background: linear-gradient(120deg, rgba(212,175,55,.1), rgba(224,90,27,.12)); }
.banniere-cfg .surtitre { margin-bottom: 6px; }
.banniere-cfg .b-titre { font: 700 1.5rem/1.1 var(--f-titre); color: var(--parchemin) !important; margin: 0 0 4px; }
.banniere-cfg p { margin: 0; }
.banniere-cfg .btn { flex: none; }
.faq { display: grid; gap: 10px; }
.faq details { border: 1px solid var(--trait-doux); border-radius: 12px; background: var(--obsidienne); padding: 0 18px; }
.faq summary { cursor: pointer; padding: 15px 0; font: 700 1.15rem/1.25 var(--f-titre); list-style: none; display: flex; justify-content: space-between; gap: 12px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; color: var(--or); font-size: 1.5rem; line-height: .8; transition: transform .3s; }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { margin: 0 0 16px; }
.a-lire ul { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.a-lire a { display: block; height: 100%; padding: 16px 18px; border-radius: 12px; border: 1px solid var(--trait-doux); background: var(--obsidienne); text-decoration: none; color: var(--parchemin); font: 600 1.15rem/1.25 var(--f-titre); transition: border-color .2s, transform .2s; }
.a-lire a:hover { border-color: var(--or); transform: translateY(-2px); }
.a-lire a span { display: block; font: 600 .7rem/1 var(--f-texte); letter-spacing: .2em; text-transform: uppercase; color: var(--braise-vive); margin-bottom: 8px; }
.liste-guides { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; max-width: 980px; margin: 30px auto 0; }
.liste-guides a { display: block; height: 100%; padding: 20px; border-radius: 14px; border: 1px solid var(--trait-doux); background: var(--obsidienne); text-decoration: none; color: var(--parchemin); transition: border-color .2s, transform .2s; }
.liste-guides a:hover { border-color: var(--or); transform: translateY(-2px); }
.liste-guides b { display: block; font: 700 1.3rem/1.2 var(--f-titre); margin-bottom: 6px; }
.liste-guides small { color: var(--parchemin-2); font-size: .88rem; line-height: 1.5; display: block; }
.perdu { text-align: center; padding: 140px 0 80px; }
.perdu h1 { font-size: clamp(2.6rem, 7vw, 4.4rem); }
.perdu .actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: 28px; }
@media (max-width: 700px) {
  .guide { padding-top: 84px; }
  .banniere-cfg { flex-direction: column; align-items: stretch; text-align: center; }
  .a-lire ul, .liste-guides { grid-template-columns: 1fr; }
  .reco-liens .btn { font-size: .9rem; }
}
