/* ===== Le Donjon V2 - charte issue des cartes imprimees ===== */
:root{
  --dj-noir:#0d0c0a;
  --dj-noir-2:#141210;
  --dj-or:#e9a63b;
  --dj-or-clair:#f4cd78;
  --dj-creme:#f7f1e5;
  --dj-creme-2:#cfc5b4;
  --dj-creme-3:#9b9182;
  --dj-brique:#b8442a;
  --dj-clair:#f7f1e5;
  --dj-clair-2:#efe4d2;
  --dj-clair-carte:#fffaf1;
  --dj-encre:#2a231c;
  --dj-encre-2:#584c41;
  --dj-trait:rgba(233,166,59,.28);
  --dj-trait-doux:rgba(247,241,229,.12);
  --dj-titre:"Fraunces",Georgia,serif;
  --dj-corps:"Karla",Helvetica,Arial,sans-serif;
  --dj-label:"Oswald","Arial Narrow",Arial,sans-serif;
  --dj-script:"Yellowtail",cursive;
}
.dj-sombre{background:var(--dj-noir-2);color:var(--dj-creme)}
.dj-clair{background:var(--dj-clair);color:var(--dj-encre)}
.dj-clair-2{background:var(--dj-clair-2);color:var(--dj-encre)}
.dj-sombre h1,.dj-sombre h2,.dj-sombre h3{color:var(--dj-creme)}
.dj-clair h2,.dj-clair h3,.dj-clair-2 h2,.dj-clair-2 h3{color:#1d1813}
.dj-sombre h1,.dj-sombre h2,.dj-clair h2,.dj-clair-2 h2{font-family:var(--dj-titre);font-weight:600;line-height:1.1}
.dj-eyebrow{font-family:var(--dj-label);font-size:12.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--dj-or)}
.dj-clair .dj-eyebrow,.dj-clair-2 .dj-eyebrow{color:var(--dj-brique)}
.dj-script{font-family:var(--dj-script);color:var(--dj-or);font-size:1.35em;line-height:1}
.dj-clair .dj-script,.dj-clair-2 .dj-script{color:var(--dj-brique)}
/* --- ruban de titre, facon carte imprimee --- */
.dj-ruban{display:inline-block;background:var(--dj-or);color:#17130c;font-family:var(--dj-label);font-weight:600;letter-spacing:.06em;text-transform:uppercase;font-size:clamp(20px,3vw,30px);line-height:1;padding:14px 38px;clip-path:polygon(0 0,100% 0,calc(100% - 18px) 50%,100% 100%,0 100%,18px 50%)}
/* --- ticket prix --- */
.dj-ticket{display:inline-flex;flex-direction:column;align-items:center;background:var(--dj-or);color:#17130c;padding:12px 30px;transform:rotate(-2.5deg);border-radius:4px}
.dj-ticket b{font-family:var(--dj-titre);font-size:27px;line-height:1}
.dj-ticket span{font-family:var(--dj-label);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;margin-top:3px;opacity:.75}
/* --- pastille --- */
.dj-pastille{display:inline-block;background:var(--dj-brique);color:#fff;font-family:var(--dj-label);font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding:8px 18px;border-radius:999px;transform:rotate(-4deg)}
.dj-pastille.dj-or{background:var(--dj-or);color:#17130c}
/* --- note manuscrite --- */
.dj-note{font-family:var(--dj-script);font-size:23px;line-height:1.2;color:var(--dj-or-clair)}
.dj-clair .dj-note,.dj-clair-2 .dj-note{color:var(--dj-brique)}
/* --- bloc carte et lignes de plats --- */
.dj-carte{border:1px solid var(--dj-trait);border-radius:18px;background:var(--dj-noir-2);padding:clamp(22px,3.2vw,40px)}
.dj-clair .dj-carte,.dj-clair-2 .dj-carte{background:var(--dj-clair-carte);border-color:rgba(42,35,28,.14)}
.dj-plat{display:flex;align-items:baseline;gap:10px;padding:9px 0;border-bottom:1px dotted rgba(247,241,229,.16)}
.dj-clair .dj-plat,.dj-clair-2 .dj-plat{border-bottom-color:rgba(42,35,28,.16)}
.dj-plat .nom{font-family:var(--dj-label);font-size:15.5px;letter-spacing:.045em;text-transform:uppercase}
.dj-plat .det{font-size:13.5px;color:var(--dj-or);font-style:italic}
.dj-clair .dj-plat .det,.dj-clair-2 .dj-plat .det{color:var(--dj-brique)}
.dj-plat .points{flex:1;border-bottom:1px dotted rgba(247,241,229,.22);transform:translateY(-4px);min-width:14px}
.dj-clair .dj-plat .points,.dj-clair-2 .dj-plat .points{border-bottom-color:rgba(42,35,28,.25)}
.dj-plat .prix{font-family:var(--dj-titre);font-size:16.5px;color:var(--dj-or-clair);white-space:nowrap;font-variant-numeric:tabular-nums}
.dj-clair .dj-plat .prix,.dj-clair-2 .dj-plat .prix{color:#8f3a20}
.dj-sous-titre{font-family:var(--dj-label);font-size:12.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--dj-creme-3);display:flex;align-items:center;gap:14px;margin:34px 0 4px}
.dj-sous-titre:before,.dj-sous-titre:after{content:"";height:1px;flex:1;background:var(--dj-trait-doux)}
.dj-clair .dj-sous-titre:before,.dj-clair .dj-sous-titre:after,.dj-clair-2 .dj-sous-titre:before,.dj-clair-2 .dj-sous-titre:after{background:rgba(42,35,28,.18)}
@media (max-width:720px){
  .dj-plat{flex-wrap:wrap}
  .dj-plat .points{display:none}
}
@media (prefers-reduced-motion:reduce){
  .dj-pastille,.dj-ticket{transform:none}
}
.dj-grille{display:grid;gap:18px}
.dj-g2{grid-template-columns:repeat(2,1fr)}
.dj-g3{grid-template-columns:repeat(3,1fr)}
.dj-g4{grid-template-columns:repeat(4,1fr)}
.dj-visuel{border-radius:16px;overflow:hidden;border:1px solid var(--dj-trait-doux)}
.dj-visuel img{width:100%;height:100%;object-fit:cover;display:block}
.dj-clair .dj-visuel,.dj-clair-2 .dj-visuel{border-color:rgba(42,35,28,.14)}
.dj-btn{display:inline-flex;align-items:center;text-decoration:none;font-family:var(--dj-label);letter-spacing:.07em;font-size:15px;padding:14px 26px;border-radius:999px;margin:6px 8px 6px 0}
.dj-btn-or{background:var(--dj-or);color:#17130c}
.dj-btn-or:hover{background:var(--dj-or-clair);color:#17130c}
.dj-btn-ligne{border:1px solid var(--dj-trait);color:var(--dj-creme)}
.dj-clair .dj-btn-ligne,.dj-clair-2 .dj-btn-ligne{border-color:rgba(42,35,28,.3);color:var(--dj-encre)}
.dj-check{list-style:none;padding:0;margin:22px 0 0}
.dj-check li{position:relative;padding-left:28px;margin-bottom:10px}
.dj-check li:before{content:"\2713";position:absolute;left:0;top:0;color:var(--dj-or);font-weight:700}
.dj-clair .dj-check li:before,.dj-clair-2 .dj-check li:before{color:var(--dj-brique)}
@media (max-width:900px){.dj-g3,.dj-g4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.dj-g2,.dj-g3,.dj-g4{grid-template-columns:1fr}}
.dj-reperes{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;text-align:center}
.dj-reperes > div{border-right:1px solid var(--dj-trait-doux);padding:6px 10px}
.dj-reperes > div:last-child{border-right:0}
.dj-reperes b{display:block;font-family:var(--dj-titre);font-size:19px;color:var(--dj-or-clair)}
.dj-reperes span{display:block;font-family:var(--dj-label);font-size:11.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--dj-creme-3);margin-top:5px}
@media (max-width:900px){.dj-reperes{grid-template-columns:repeat(2,1fr)}.dj-reperes > div{border-right:0;border-bottom:1px solid var(--dj-trait-doux);padding:12px 6px}}
.dj-badge{display:inline-block;background:var(--dj-brique);color:#fff;font-family:var(--dj-label);font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:6px 14px;border-radius:999px;margin-bottom:12px}
.dj-legende{display:block;font-family:var(--dj-label);font-size:11.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--dj-creme-3);margin-top:8px}
.dj-clair .dj-legende,.dj-clair-2 .dj-legende{color:var(--dj-encre-2)}
.dj-hero{position:relative;overflow:hidden;padding-block:clamp(60px,9vw,120px)}
.dj-hero-img{position:absolute;inset:0;overflow:hidden}
.dj-hero-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.1s ease}
.dj-hero-img img.actif{opacity:1}
.dj-hero-voile{position:absolute;inset:0;background:linear-gradient(100deg,rgba(9,8,7,.95) 0%,rgba(9,8,7,.86) 38%,rgba(9,8,7,.42) 66%,rgba(9,8,7,.62) 100%),linear-gradient(to top,rgba(9,8,7,.9),transparent 45%)}
.dj-hero-txt{position:relative;z-index:2;max-width:860px}
.dj-hero h1{font-family:var(--dj-titre);font-size:clamp(34px,5vw,58px);line-height:1.08;color:var(--dj-creme);max-width:660px;margin:0}
.dj-hero h1 em{font-style:normal;color:var(--dj-or-clair)}
.dj-hero .dj-chapeau{margin-top:22px;font-size:clamp(16px,1.4vw,18px);color:var(--dj-creme-2);max-width:56ch}
.dj-points{position:absolute;right:clamp(20px,4vw,48px);bottom:clamp(18px,3vw,34px);z-index:3;display:flex;gap:9px}
.dj-points button{width:9px;height:9px;padding:0;border-radius:50%;cursor:pointer;border:1px solid rgba(247,241,229,.7);background:transparent;transition:.25s}
.dj-points button[aria-current="true"]{background:var(--dj-or);border-color:var(--dj-or);width:26px;border-radius:999px}
.dj-vignettes{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:44px;max-width:840px}
.dj-vignette{position:relative;border-radius:10px;overflow:hidden;border:1px solid var(--dj-trait-doux)}
.dj-vignette img{aspect-ratio:4/3;width:100%;object-fit:cover;display:block}
.dj-vignette span{position:absolute;left:0;right:0;bottom:0;padding:26px 10px 10px;background:linear-gradient(to top,rgba(9,8,7,.92),transparent);font-family:var(--dj-label);font-size:13px;letter-spacing:.11em;text-transform:uppercase;text-align:center;color:var(--dj-creme)}
.dj-zone-fb{position:relative;border:1px dashed rgba(233,166,59,.55);border-radius:18px;padding:clamp(22px,3vw,34px)}
.dj-tag-fb{position:absolute;top:-13px;left:24px;display:inline-flex;align-items:center;gap:8px;background:var(--dj-brique);color:#fff;font-family:var(--dj-label);font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:5px 15px;border-radius:999px}
.dj-note-fb{margin-top:24px;padding-top:18px;border-top:1px dashed rgba(233,166,59,.35);font-size:13px;color:var(--dj-creme-3);font-style:italic;max-width:78ch}
.dj-mets{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.dj-met{border-radius:14px;overflow:hidden;border:1px solid var(--dj-trait-doux);background:var(--dj-noir-2)}
.dj-met img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.dj-met h3{font-family:var(--dj-label);font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--dj-creme);margin:0;padding:14px 16px 4px}
.dj-met p{font-size:14px;color:var(--dj-or);font-style:italic;margin:0;padding:0 16px 16px}
@media (max-width:900px){.dj-mets{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.dj-mets{grid-template-columns:1fr}}