@font-face { font-family: "Cinzel"; src: url("/polices/cinzel-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Alegreya Sans"; src: url("/polices/alegreya-sans-500.woff2") format("woff2"); font-weight: 400 600; font-display: swap; }
/* repli ajusté : le titre ne change pas de lignes quand la vraie police arrive */
@font-face { font-family: "Repli titre"; src: local("Georgia"); size-adjust: 112%; ascent-override: 88%; }
@font-face { font-family: "Repli texte"; src: local("Helvetica Neue"), local("Arial"); size-adjust: 92%; }

:root { color-scheme: dark; --or: #e8a448; --or-clair: #ffc94a; --texte: #ece4d6; --doux: #a89a86; --fond: #120d0a; --carte: #1d1510; --trait: #e8a44833; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--fond); color: var(--texte); font: 19px/1.6 "Alegreya Sans", "Repli texte", system-ui, sans-serif; }
a { color: var(--or-clair); }
img, video { max-width: 100%; height: auto; display: block; }
h1, h2, h3 { font-family: "Cinzel", "Repli titre", Georgia, serif; color: var(--or); line-height: 1.2; letter-spacing: .02em; }
h2 { font-size: clamp(1.6rem, 3.2vw, 2.2rem); margin: 0 0 .7em; }
h3 { font-size: 1.15rem; margin: .8em 0 .3em; }
.doux { color: var(--doux); font-size: .9rem; }

.barre { position: sticky; top: 0; z-index: 5; display: flex; align-items: center; gap: 16px; padding: 10px max(16px, env(safe-area-inset-left));
         background: #120d0ae6; backdrop-filter: blur(8px); border-bottom: 1px solid var(--trait); }
.marque { display: flex; align-items: center; gap: 10px; font-family: "Cinzel", "Repli titre", serif; font-weight: 700; color: var(--or); text-decoration: none; font-size: 1.2rem; }
.marque img { border-radius: 9px; }
.barre nav { display: flex; gap: 18px; margin-left: auto; font-size: .95rem; }
.barre nav a { color: var(--texte); text-decoration: none; }
.barre nav a:hover { color: var(--or-clair); }

.bouton { display: inline-block; padding: 14px 26px; border-radius: 12px; background: linear-gradient(#f2b45a, #c97c2a); color: #1a0f06;
          font-weight: 700; text-decoration: none; box-shadow: 0 6px 24px #c97c2a55, inset 0 1px 0 #ffe2a8; }
.bouton:hover { filter: brightness(1.08); }
.bouton.petit { padding: 8px 14px; font-size: .9rem; white-space: nowrap; }

.hero { position: relative; min-height: min(86vh, 860px); display: grid; place-items: center; overflow: hidden; }
.hero .fond { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero::after { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at center, #120d0a99 0%, #120d0ad9 60%, var(--fond) 100%); }
.hero-texte { position: relative; z-index: 1; text-align: center; max-width: 760px; padding: 48px 20px; }
.hero .logo { width: min(440px, 80vw); margin: 0 auto 8px; filter: drop-shadow(0 10px 30px #000c); }
.hero h1 { font-size: clamp(1.5rem, 3.6vw, 2.4rem); margin: .2em 0 .4em; }
.accroche { font-size: 1.2rem; margin: 0 0 1.2em; }

.bloc { max-width: 1080px; margin: 0 auto; padding: 72px 20px 0; }
.deux { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; }
figure { margin: 0; }
figure img, .bloc > img { border-radius: 14px; border: 1px solid var(--trait); box-shadow: 0 12px 40px #000a; }
figcaption { color: var(--doux); font-size: .9rem; margin-top: 8px; }
.video { margin-top: 40px; text-align: center; }
.video video { width: 100%; aspect-ratio: 1280 / 590; border-radius: 14px; border: 1px solid var(--trait); background: #000; }

.heros { list-style: none; padding: 0; margin: 0 0 1em; display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.heros li { background: var(--carte); border: 1px solid var(--trait); border-radius: 14px; padding: 16px 12px; text-align: center; }
.heros img { width: 96px; height: 96px; border-radius: 50%; margin: 0 auto 10px; border: 2px solid var(--or); }
.heros strong { display: block; color: var(--or-clair); }
.heros span { font-size: .9rem; color: var(--doux); }

.donjons { list-style: none; padding: 0; margin: 0 0 1em; display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.donjons li { background: var(--carte); border: 1px solid var(--trait); border-radius: 14px; overflow: hidden; }
.donjons img { border-radius: 0; border: 0; box-shadow: none; aspect-ratio: 1600 / 738; object-fit: cover; }
.donjons h3, .donjons p { padding: 0 18px; }
.donjons p { margin: 0 0 18px; color: var(--doux); }

.appel { text-align: center; }
details { background: var(--carte); border: 1px solid var(--trait); border-radius: 12px; padding: 14px 18px; margin: 10px 0; }
summary { cursor: pointer; font-weight: 600; color: var(--or-clair); }
details p { margin: .6em 0 0; }

.texte { max-width: 760px; margin: 0 auto; padding: 48px 20px 0; }
.texte h1 { font-size: clamp(1.8rem, 4vw, 2.6rem); }
.texte h2 { font-size: 1.4rem; margin-top: 1.6em; }

footer { max-width: 1080px; margin: 96px auto 0; padding: 28px 20px 48px; border-top: 1px solid var(--trait); text-align: center; }

@media (max-width: 860px) {
  .barre nav a:not([hreflang]) { display: none; }
  .deux, .donjons { grid-template-columns: 1fr; }
  .heros { grid-template-columns: repeat(2, 1fr); }
  .heros li:last-child { grid-column: span 2; }
  .bloc { padding-top: 56px; }
}