/* ============================================
   MCKIDS UNIVERSE — styles narratifs
   Cohérent avec la palette existante (css/s1.css) :
   noir #000, cyan néon var(--mck-accent,#00fff7), magenta #ff14ff / #ff1493,
   or #ffd700, dégradés teal #106a6d / #189aab
   ============================================ */

body.universe-page { background:#000; color:#fff; font-family:'Montserrat', sans-serif; }

/* --- Sous-navigation Univers --- */
.universe-subnav {
  display:flex; flex-wrap:wrap; gap:0.6rem; justify-content:center;
  padding:1.2rem 1rem; background:linear-gradient(90deg,#000,#0c1f20,#000);
  border-bottom:1px solid #0f4a4d;
}
.universe-subnav a {
  color:#fff; text-decoration:none; font-weight:600; font-size:0.85rem;
  padding:0.5rem 1.1rem; border-radius:30px; border:1px solid color-mix(in srgb,var(--mck-accent,#00fff7) 33%,transparent);
  transition:0.3s;
}
.universe-subnav a:hover, .universe-subnav a.active {
  color:#000; background:var(--mck-accent,#00fff7); box-shadow:0 0 15px color-mix(in srgb,var(--mck-accent,#00fff7) 67%,transparent);
}

/* --- Hero de section --- */
.universe-hero {
  text-align:center; padding:4rem 1.5rem 2.5rem; background:radial-gradient(circle at 50% 0%, #106a6d33, #000 70%);
}
.universe-hero .kicker {
  display:inline-block; color:#ffd700; letter-spacing:0.15em; font-size:0.75rem;
  text-transform:uppercase; margin-bottom:0.8rem;
}
.universe-hero h1 {
  font-size:clamp(2rem,6vw,3.5rem); margin:0 0 0.6rem;
  text-shadow:0 0 15px #ff69b4,0 0 30px #ff1493,0 0 45px var(--mck-accent2,#ff00ff);
}
.universe-hero p.lede { max-width:640px; margin:0 auto; color:#ccc; font-size:1.05rem; line-height:1.7; }

/* --- Distinction réel / fiction (encart) --- */
.reality-note {
  max-width:680px; margin:2rem auto; padding:1.2rem 1.4rem; border-radius:12px;
  background:#69108355; border:1px solid #a40eb8aa; font-size:0.92rem; line-height:1.6;
}
.reality-note strong { color:#ffd700; }

/* --- Blocs de contenu narratif --- */
.lore-block { max-width:760px; margin:2.2rem auto; padding:0 1.5rem; }
.lore-block h2 {
  color:var(--mck-accent,#00fff7); text-shadow:0 0 10px color-mix(in srgb,var(--mck-accent,#00fff7) 67%,transparent); font-size:1.4rem; margin-bottom:0.8rem;
  border-left:4px solid #ff14ff; padding-left:0.8rem;
}
.lore-block p { color:#ddd; line-height:1.75; margin-bottom:1rem; }
.lore-quote {
  font-style:italic; color:#ffd700; border-left:3px solid #ffd700; padding-left:1rem; margin:1.2rem 0;
}

/* --- Grille de piliers / cartes --- */
.lore-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1.2rem; max-width:900px; margin:2rem auto; padding:0 1.5rem; }
.lore-card {
  background:linear-gradient(#000000da,#106a6d33); border:1px solid color-mix(in srgb,var(--mck-accent,#00fff7) 20%,transparent); border-radius:14px;
  padding:1.3rem; text-align:center; transition:0.3s;
}
.lore-card:hover { transform:translateY(-4px); box-shadow:0 0 20px color-mix(in srgb,var(--mck-accent,#00fff7) 33%,transparent); }
.lore-card h3 { color:#fff; margin-bottom:0.5rem; }
.lore-card p { color:#bbb; font-size:0.9rem; }

/* --- Fixe vs Évolutif (tableau) --- */
.canon-table { width:100%; max-width:760px; margin:2rem auto; border-collapse:collapse; }
.canon-table th, .canon-table td {
  border:1px solid #0f4a4d; padding:0.7rem 0.9rem; text-align:left; font-size:0.88rem; color:#ddd;
}
.canon-table th { background:#106a6d55; color:var(--mck-accent,#00fff7); }

/* --- Strip BD --- */
.strip-panel {
  max-width:700px; margin:2rem auto; padding:1.4rem 1.6rem; border-radius:14px;
  background:#0a0a0a; border:1px solid #ff14ff33;
}
.strip-panel .panel-label { color:#ff14ff; font-size:0.75rem; text-transform:uppercase; letter-spacing:0.1em; margin-bottom:0.5rem; }
.strip-panel .panel-desc { color:#aaa; font-size:0.9rem; font-style:italic; margin-bottom:0.8rem; }
.strip-panel .panel-dialogue { color:#fff; font-size:1rem; margin:0.4rem 0; }
.strip-panel .panel-dialogue b { color:var(--mck-accent,#00fff7); }

/* --- Graines d'histoires --- */
.seed-list { max-width:760px; margin:1.5rem auto; padding:0 1.5rem; }
.seed-list li { color:#ccc; margin-bottom:0.7rem; line-height:1.6; }
.seed-list li b { color:#ffd700; }

/* --- CTA final --- */
.universe-cta { text-align:center; padding:3rem 1.5rem; }
.universe-cta a {
  display:inline-block; background:#ff14ff; color:#fff; padding:0.9rem 2rem; border-radius:50px;
  text-decoration:none; font-weight:700; text-transform:uppercase; box-shadow:0 0 20px #ff69b4;
  margin:0.4rem;
}
.universe-cta a.secondary { background:transparent; border:1px solid var(--mck-accent,#00fff7); box-shadow:none; }

/* --- Pages légales --- */
.legal-page { max-width:760px; margin:3rem auto; padding:0 1.5rem 4rem; color:#ddd; line-height:1.75; }
.legal-page h1 { color:var(--mck-accent,#00fff7); margin-bottom:1rem; }
.legal-page h2 { color:#ffd700; margin-top:2rem; margin-bottom:0.6rem; font-size:1.2rem; }
.legal-page p, .legal-page li { color:#ccc; }
.legal-page .updated { color:#777; font-size:0.85rem; margin-bottom:2rem; }