.histoires-page{max-width:1200px;margin:auto;padding:0 1rem;color:var(--color2,#26362b)}
.histoires-entete{padding:2.5rem 0;text-align:center;max-width:780px;margin:auto}
.histoires-signature,.histoires-repere{letter-spacing:.08em;font-size:.8rem;font-weight:700;color:#456c52}
.histoires-entete h1{font-size:clamp(2.1rem,6vw,3.6rem);line-height:1.15;margin:.8rem 0 1.2rem}
.histoires-entete p{line-height:1.7}.histoires-precision{font-size:.9rem;color:#536357}
.histoires-grille{display:grid;gap:1.5rem}.histoires-carte{border:1px solid #dfe5df;border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 5px 20px #26362b08}
.histoires-media{position:relative;background:#18271c;aspect-ratio:16/9}.histoires-media video{display:block;width:100%;height:100%;object-fit:contain}
.histoires-media img{display:block;width:100%;height:100%;object-fit:cover}.histoires-media [hidden]{display:none}
.histoires-lecture{position:absolute;inset:0;width:100%;height:100%;border:0;background:linear-gradient(transparent 50%,#0008);color:#fff;display:flex;align-items:center;justify-content:center;gap:.6rem;font-size:1rem;font-weight:700;cursor:pointer}
.histoires-lecture span{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:#264f3c}
.histoires-texte{padding:1.3rem}.histoires-texte h2{font-size:1.3rem;line-height:1.35;margin:.6rem 0}.histoires-texte p{line-height:1.65}.histoires-duree{font-size:.85rem;color:#536357}
.histoires-lien{display:inline-block;padding:.6rem 0;color:#24513b;text-decoration:underline;text-underline-offset:4px}
.histoires-suivre,.histoires-invitation,.histoires-bref{padding:2rem 1.3rem;margin:2rem 0;border-radius:18px;text-align:center;background:#f0f4ed}
.histoires-reseaux{display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center;margin:1.3rem 0}.histoires-reseaux a{padding:.85rem 1.1rem;background:white;border:1px solid #b9cbbb;border-radius:30px;color:#24513b;font-weight:600}
.histoires-bref{background:transparent;text-align:start;border-top:1px solid #dfe5df;border-radius:0;margin-bottom:0}
.histoires-page button:focus-visible,.histoires-page a:focus-visible{outline:3px solid #c39029;outline-offset:4px}
@media(min-width:720px){.histoires-page{padding:0 2rem}.histoires-grille{grid-template-columns:repeat(2,minmax(0,1fr))}.histoires-entete{padding:4rem 0}.histoires-texte{padding:1.7rem}}