/* ============================================================
   MYTHÉO — Kailash · écran PARCOURS (les quêtes).
   Mur d'affiches-quêtes (catégorie `grid`), aligné sur « histoires ».
   La LECTURE d'une quête est déléguée au lecteur d'aventure partagé
   (route « aventure » → K.carteVoyage) : la constellation d'étapes, le
   focus-sur-étape (halo/pulse + atténuation) et le panneau rétractable
   sont stylés par carte-voyage.css. Ici : seulement le fond + la grille.
   ============================================================ */

/* ---- fond ---- */
.kailash-parcours .kailash-screen-bg { background: radial-gradient(120% 60% at 50% 0%, #1a1608, #0e0b05 46%, #080a06 100%); }
.kailash-parcours-amb { position: absolute; left: 0; right: 0; bottom: 0; height: 70%; z-index: 0; background-position: center bottom; background-size: cover; background-repeat: no-repeat; opacity: .16; filter: blur(2px); }
.kailash-parcours .kailash-screen-title h1 { font-size: 40px; }

/* ---- grille de cartes-quêtes ---- */
.kailash-parcours-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin: 0 auto; max-width: 1100px; }
@media (min-width: 760px)  { .kailash-parcours-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1080px) { .kailash-parcours-grid { grid-template-columns: repeat(4, 1fr); } }

/* La carte-quête = carte-affiche PARTAGÉE (.kailash-poster-card : cadre,
   image, scrim, hover). Parcours n'ajoute que le titre EN HAUT (le scrim
   partagé assombrit déjà le haut) + le pied de progression. */
.kailash-parcours-meta { position: absolute; top: 13px; left: 14px; right: 14px; z-index: 2; }
.kailash-parcours-src { font-family: var(--disp); font-style: italic; font-size: 11px; letter-spacing: .06em; color: var(--or); opacity: .92; text-shadow: 0 1px 5px #000; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.kailash-parcours-ti { font-family: var(--disp); font-weight: 700; font-size: 16px; line-height: 1.1; color: #fdf6e2; margin-top: 3px; text-shadow: 0 2px 8px rgba(0,0,0,.9); }

.kailash-parcours-foot { position: absolute; left: 14px; right: 14px; bottom: 13px; z-index: 2; }
.kailash-parcours-bar { height: 5px; border-radius: 5px; background: rgba(240,224,178,.22); overflow: hidden; }
.kailash-parcours-fill { display: block; height: 100%; border-radius: 5px; background: linear-gradient(90deg, #caa451, var(--or-clair,#f6e4a9)); box-shadow: 0 0 8px rgba(var(--lueur,231,197,110),.7); }
.kailash-parcours-frow { display: flex; align-items: center; justify-content: space-between; margin-top: 7px; gap: 8px; }
.kailash-parcours-steps { font-family: var(--disp); font-weight: 700; font-size: 11px; letter-spacing: .04em; color: #efe4c6; text-shadow: 0 1px 4px #000; }
.kailash-parcours-state { display: inline-flex; align-items: center; gap: 4px; font-family: var(--disp); font-weight: 700; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--or-clair); text-shadow: 0 1px 4px #000; white-space: nowrap; }
.kailash-parcours-state svg { width: 13px; height: 13px; }

/* verrouillé */
.kailash-parcours-card.is-locked { cursor: default; }
.kailash-parcours-card.is-locked:hover { transform: none; box-shadow: 0 12px 28px rgba(0,0,0,.55), inset 0 0 0 1px rgba(var(--lueur,231,197,110),.08); }
.kailash-parcours-lay { position: absolute; inset: 0; z-index: 1; background: rgba(8,7,4,.5); -webkit-backdrop-filter: grayscale(.55) brightness(.72); backdrop-filter: grayscale(.55) brightness(.72); }
.kailash-parcours-card.is-locked .kailash-parcours-state { color: var(--texte-doux); }
.kailash-parcours-lockbadge { position: absolute; left: 50%; top: 47%; transform: translate(-50%, -50%); z-index: 2; width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: rgba(15,12,7,.55); border: 1.5px solid rgba(234,220,190,.4); box-shadow: 0 6px 16px rgba(0,0,0,.5); }
.kailash-parcours-lockbadge svg { width: 24px; height: 24px; color: var(--or-clair); opacity: .9; }

/* pastille « terminé » */
.kailash-parcours-done { position: absolute; top: 12px; right: 12px; z-index: 3; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at 40% 34%, #fff3cf, var(--or,#e7c56e) 70%, #caa451); box-shadow: 0 0 14px rgba(var(--lueur,231,197,110),.55); }
.kailash-parcours-done svg { width: 15px; height: 15px; color: #241a08; }