/* ====== Charte de guilde (Invicta) — style MMO/fantasy lisible ====== */

/* --- Hero --- */
.card-hero{
  border:1px solid var(--border);
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
  position:relative;
}
.ix-hero::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(900px 600px at 15% 0%, rgba(196,22,28,.18), transparent 70%),
    radial-gradient(800px 600px at 100% 100%, rgba(196,22,28,.08), transparent 70%);
  pointer-events:none;
  filter: blur(.2px);
}
.icon-wrap{
  width:52px; height:52px; border-radius:12px; background:linear-gradient(180deg, var(--brand), var(--brand-dark));
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 16px rgba(196,22,28,.35), inset 0 0 0 1px rgba(255,255,255,.08);
}
.icon-wrap i{ color:#fff; font-size:1.4rem; }
.ix-title{ letter-spacing:.2px; }
.ix-brand{ color:var(--brand); }

/* Ornements runiques (subtil) */
.ix-ornament{
  display:flex; align-items:center; gap:.5rem; justify-content:center;
  opacity:.9;
}
.ix-ornament .rune{
  width:18px; height:18px; border:1px solid rgba(196,22,28,.45);
  background: radial-gradient(circle at 50% 40%, rgba(196,22,28,.25), transparent 60%);
  transform: rotate(45deg);
  display:inline-block; border-radius:3px;
  box-shadow: 0 0 0 3px rgba(196,22,28,.10);
}
.ix-ornament .rune.large{ width:24px; height:24px; }

/* --- Cartes sections --- */
.section-card{ border:1px solid var(--border); background: var(--card); }
.section-card h2{ color:#fff; }
.section-card p{ color:#e9ebef; }
.text-secondary{ color:#cfd4dd !important; }

/* Numéros de section */
.ix-num{
  display:inline-flex; align-items:center; justify-content:center;
  width:1.6rem; height:1.6rem; border-radius:6px;
  background: rgba(196,22,28,.18);
  border:1px solid rgba(196,22,28,.35);
  color:#fff; font-weight:700; margin-right:.4rem;
}

/* Listes lisibles */
.ix-list{ padding-left:1.2rem; }
.ix-list li{ margin-bottom:.4rem; color:#f1f3f6; }
.ix-list li::marker{ color: var(--brand); }

/* Table rôles */
.ix-table{
  --bs-table-bg: transparent;
  --bs-table-color: #e9ebef;
  --bs-table-striped-bg: rgba(255,255,255,.04);
  border-color: var(--border);
}
.ix-table th{ color:#ffffff; }
.ix-table td, .ix-table th{ border-color: var(--border); }

/* TOC latéral */
.toc{ background: var(--card); border:1px solid var(--border); }
.toc .nav-link{
  color:#dfe3ea; padding:.35rem .25rem; border-radius:.35rem;
}
.toc .nav-link:hover{ color:#fff; background: rgba(196,22,28,.15); }

/* Liens & boutons */
a{ color: var(--brand); }
a:hover{ color:#ff4d53; }
.btn-outline-light{
  color:#f8f9fb; border-color: rgba(255,255,255,.35);
}
.btn-outline-light:hover{
  background: var(--brand); border-color: var(--brand); color:#fff;
}

/* Badges alternatifs fantasy */
.chip, .chip-alt{
  display:inline-block; padding:.15rem .5rem; border-radius:.5rem; font-size:.8rem;
  border:1px solid rgba(255,255,255,.12);
  color:#cfd4dd; background: rgba(255,255,255,.06);
}
.chip-alt{
  background: rgba(196,22,28,.15);
  border-color: rgba(196,22,28,.35);
  color:#ff9aa0;
}

/* --- Schéma d’organisation (flow) --- */
.ix-flow{
  margin-top:.5rem; border:1px dashed rgba(255,255,255,.10); border-radius:.8rem;
  padding:1rem; background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
}
.ix-flow .node{
  position:relative; text-align:center; color:#f1f3f6; font-weight:600;
  background: rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08);
  padding:.75rem; border-radius:.6rem; margin:.5rem 0;
}
.ix-flow .node span{
  display:block; font-weight:400; color:#cfd4dd; font-size:.9rem; margin-top:.15rem;
}
.ix-flow .node.head{
  background: linear-gradient(180deg, rgba(196,22,28,.15), rgba(255,255,255,.03));
  border:1px solid rgba(196,22,28,.35);
  box-shadow:0 4px 16px rgba(196,22,28,.15);
}
.ix-flow .divider{
  display:flex; align-items:center; justify-content:center; margin:.75rem 0;
}
.ix-flow .specs{
  display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center;
}
.ix-flow .spec{
  border:1px solid rgba(196,22,28,.35);
  background: rgba(196,22,28,.12);
  padding:.25rem .5rem; border-radius:.45rem; color:#ffd5d7; font-size:.9rem;
}

/* --- Mentorat timeline --- */
.mentorship{ position:relative; padding-left:1.4rem; margin-top:.5rem; }
.mentorship::before{
  content:""; position:absolute; left:.55rem; top:.25rem; bottom:.25rem; width:2px; background:rgba(255,255,255,.08);
}
.mentorship .step{ position:relative; margin-bottom:1rem; }
.mentorship .step .dot{
  position:absolute; left:-.25rem; top:.2rem; width:.8rem; height:.8rem; border-radius:50%;
  background:var(--brand); box-shadow:0 0 0 4px rgba(196,22,28,.2);
}
.mentorship h6{ margin-bottom:.2rem; color:#fff; }

/* --- Règles : cartes compactes --- */
.ix-rule{
  display:flex; gap:.6rem; align-items:flex-start;
  background: rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
  border-radius:.6rem; padding:.65rem .7rem;
}
.ix-rule i{ font-size:1.2rem; color: var(--brand); margin-top:.1rem; }
.ix-rule h6{ margin:0; color:#fff; }

/* Petits plus d’ergonomie */
section{ scroll-margin-top: 6rem; }
.container-narrow{ max-width: 920px; }

/* Responsive douce pour le schéma */
@media (min-width: 768px){
  .ix-flow{
    display:grid;
    grid-template-columns: repeat(2, 1fr);
    gap:.6rem 1rem;
  }
  .ix-flow .head{ grid-column: 1 / -1; }
  .ix-flow .divider{ grid-column: 1 / -1; }
  .ix-flow .specs{ grid-column: 1 / -1; }
}
.ix-title {
  letter-spacing: .2px;
  color: #fff;
  text-shadow: 0 0 6px rgba(196,22,28,.35), 0 0 12px rgba(196,22,28,.15);
}