/* guides.css — rubrique Guides (17/10/2026) */
*, *::before, *::after { box-sizing: border-box; }
:root {
  --sapin:#1C3D2A; --sapin-dark:#112417; --creme:#F5EFE0; --creme-muted:rgba(245,239,224,.72);
  --or:#C9A84C; --or-light:#E2C57A; --or-dark:#9E7A2E; --navbar-h:72px;
}
html { scroll-behavior:smooth; }
body { margin:0; font-family:'DM Sans',sans-serif; background:var(--sapin-dark); color:var(--creme); }

/* Hero */
.g-hero { background:var(--sapin-dark); padding:calc(var(--navbar-h) + 4.5rem) 1.5rem 3.5rem; position:relative; }
.g-hero::after { content:''; position:absolute; left:0; right:0; bottom:0; height:1px; background:linear-gradient(90deg,transparent,rgba(201,168,76,.35),transparent); }
.g-hero-inner { max-width:820px; margin:0 auto; }
.g-eyebrow { font-size:.7rem; font-weight:500; letter-spacing:.22em; text-transform:uppercase; color:var(--or); margin-bottom:1.25rem; }
.g-eyebrow a { color:inherit; text-decoration:none; }
.g-title { font-family:'Cormorant Garamond',serif; font-weight:600; font-size:clamp(2.1rem,5vw,3.4rem); line-height:1.1; margin:0 0 1.25rem; color:var(--creme); }
.g-meta { font-size:.82rem; color:rgba(245,239,224,.55); margin-bottom:1.5rem; }
.g-chapeau { font-size:1.12rem; line-height:1.7; color:var(--creme-muted); margin:0; }

/* Corps clair */
.g-main { background:var(--creme); color:#22352A; padding:3.5rem 1.5rem 4rem; }
.g-wrap { max-width:760px; margin:0 auto; }
.g-toc { background:#fff; border:1px solid rgba(28,61,42,.12); border-left:3px solid var(--or); border-radius:4px; padding:1.1rem 1.4rem; margin-bottom:2.5rem; }
.g-toc strong { display:block; font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--or-dark); margin-bottom:.6rem; }
.g-toc ol { margin:0; padding-left:1.2rem; line-height:1.9; }
.g-toc a { color:var(--sapin); text-decoration:none; border-bottom:1px solid rgba(28,61,42,.25); }
.g-toc a:hover { border-color:var(--or-dark); }

.g-body h2 { font-family:'Cormorant Garamond',serif; font-size:clamp(1.65rem,3.2vw,2.15rem); font-weight:600; color:var(--sapin); line-height:1.2; margin:2.6rem 0 1rem; scroll-margin-top:calc(var(--navbar-h) + 1rem); }
.g-body p, .g-body li { font-size:1.04rem; line-height:1.8; }
.g-body p { margin:0 0 1.15rem; }
.g-body ul, .g-body ol { margin:0 0 1.4rem; padding-left:1.4rem; }
.g-body li { margin-bottom:.55rem; }
.g-body a { color:var(--sapin); font-weight:500; text-decoration:underline; text-decoration-color:var(--or); text-underline-offset:3px; }
.g-body a:hover { color:var(--or-dark); }
.g-body strong { color:var(--sapin); }
.g-body .note { font-size:.88rem; color:rgba(34,53,42,.7); font-style:italic; }
.table-wrap { overflow-x:auto; margin:1.2rem 0 1rem; border:1px solid rgba(28,61,42,.15); border-radius:4px; background:#fff; }
.g-body table { border-collapse:collapse; width:100%; min-width:640px; font-size:.92rem; }
.g-body th, .g-body td { padding:.75rem .9rem; text-align:left; vertical-align:top; border-bottom:1px solid rgba(28,61,42,.1); line-height:1.5; }
.g-body thead th { background:var(--sapin); color:var(--creme); font-weight:500; }
.g-body tbody th { background:rgba(201,168,76,.12); color:var(--sapin); font-weight:600; width:15%; }

/* FAQ */
.g-faq { margin-top:3rem; }
.g-faq h2 { font-family:'Cormorant Garamond',serif; font-size:clamp(1.65rem,3.2vw,2.15rem); font-weight:600; color:var(--sapin); margin:0 0 1rem; }
.g-faq details { background:#fff; border:1px solid rgba(28,61,42,.12); border-radius:4px; margin-bottom:.7rem; }
.g-faq summary { cursor:pointer; padding:1rem 1.2rem; font-weight:500; color:var(--sapin); list-style:none; }
.g-faq summary::-webkit-details-marker { display:none; }
.g-faq summary::after { content:'+'; float:right; color:var(--or-dark); font-size:1.3rem; line-height:1; }
.g-faq details[open] summary::after { content:'–'; }
.g-faq details p { margin:0; padding:0 1.2rem 1.1rem; line-height:1.75; font-size:1rem; }

/* CTA */
.g-cta { background:var(--sapin); color:var(--creme); border-radius:6px; padding:2rem 1.8rem; margin-top:3rem; text-align:center; }
.g-cta h2 { font-family:'Cormorant Garamond',serif; font-size:1.9rem; font-weight:600; margin:0 0 .6rem; color:var(--creme); }
.g-cta p { color:var(--creme-muted); margin:0 0 1.4rem; line-height:1.7; }
.g-btn { display:inline-block; background:var(--or); color:var(--sapin); font-size:.85rem; font-weight:500; letter-spacing:.08em; text-transform:uppercase; padding:.9rem 1.8rem; border-radius:3px; text-decoration:none; margin:.3rem; transition:background .25s; }
.g-btn:hover { background:var(--or-light); }
.g-btn--ghost { background:transparent; color:var(--creme); border:1px solid rgba(245,239,224,.4); }
.g-btn--ghost:hover { background:rgba(245,239,224,.1); }

/* Cartes (liste et guides liés) */
.g-list { background:var(--creme); padding:3.5rem 1.5rem 4rem; }
.g-grid { max-width:1000px; margin:0 auto; display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:1.4rem; }
.g-card { background:#fff; border:1px solid rgba(28,61,42,.12); border-radius:6px; padding:1.6rem; text-decoration:none; color:#22352A; display:flex; flex-direction:column; transition:transform .2s, box-shadow .2s; }
.g-card:hover { transform:translateY(-3px); box-shadow:0 14px 34px rgba(17,36,23,.12); }
.g-card .g-tag { font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; color:var(--or-dark); margin-bottom:.7rem; }
.g-card h3 { font-family:'Cormorant Garamond',serif; font-size:1.55rem; font-weight:600; line-height:1.2; color:var(--sapin); margin:0 0 .7rem; }
.g-card p { font-size:.95rem; line-height:1.65; margin:0 0 1rem; flex:1; }
.g-card .g-more { font-size:.8rem; font-weight:500; letter-spacing:.08em; text-transform:uppercase; color:var(--sapin); }
.g-related { max-width:1000px; margin:3rem auto 0; }
.g-related h2 { font-family:'Cormorant Garamond',serif; font-size:1.7rem; color:var(--sapin); margin:0 0 1rem; text-align:center; }

@media (max-width:640px) {
  .g-hero { padding:calc(var(--navbar-h) + 2.5rem) 1.25rem 2.5rem; }
  .g-main, .g-list { padding:2.5rem 1.25rem 3rem; }
}
.g-body blockquote { margin:1.4rem 0; padding:1rem 1.4rem; background:#fff; border-left:3px solid var(--or); border-radius:4px; color:#22352A; }
.g-body blockquote p { margin:0; }
