/* accueil.css — page d'accueil publique (vitrine) de Lorewarden.
   100 % tokens → flippe Obsidian ↔ Vélin via les fichiers de thème. Réutilise about.css pour le
   body, les boutons (.ab-btn/.ab-cta), le badge (.ab-alpha), la note (.ab-note) et la bascule de
   thème (.ab-theme-toggle) — ne PAS redéfinir ces classes ici. Cinzel (--font-display) assumé sur
   les titres (page de marque). */

.lw-land { max-width: 1000px; margin: 0 auto; padding: clamp(1rem, 3vw, 2rem) 1.25rem 4rem; }

/* ── Hero ── */
.lw-hero { text-align: center; padding: .5rem 0 1rem; }
.lw-hero-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: .5rem; min-height: 38px; }
.lw-hero .lw-lockup { justify-content: center; }
.lw-kicker {
  display: inline-flex; align-items: center; justify-content: center; gap: .65rem; flex-wrap: wrap;
  font-size: .92rem; color: var(--ink-mid); margin: .9rem 0 0;
}
.lw-lede {
  font-family: var(--font-display), serif; font-weight: 700; letter-spacing: .01em;
  font-size: clamp(1.55rem, 4.6vw, 2.5rem); line-height: 1.22; color: var(--gold);
  margin: 1.3rem auto .7rem; max-width: 17ch;
}
.lw-sub { font-size: 1.06rem; color: var(--ink-high); max-width: 56ch; margin: 0 auto 1.7rem; }

/* ── Grille de fonctionnalités ── */
.lw-features {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(248px, 1fr));
  gap: 1rem; margin: 2.8rem 0;
}
.lw-feat {
  background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 1.35rem 1.25rem; text-align: left;
  transition: border-color .18s ease, transform .18s ease;
}
.lw-feat:hover { border-color: var(--gold-deco); transform: translateY(-2px); }
.lw-feat-ico {
  display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px;
  border-radius: 12px; font-size: 1.35rem; line-height: 1; margin-bottom: .7rem;
  background: color-mix(in srgb, var(--gold) 12%, var(--bg-card)); border: 1px solid var(--gold-deco);
}
.lw-feat h2 {
  font-family: var(--font-display), serif; font-weight: 700; letter-spacing: .02em;
  font-size: 1.14rem; color: var(--gold); margin: .2rem 0 .4rem;
}
.lw-feat p { color: var(--ink-mid); font-size: .95rem; margin: 0; }

/* ── Pourquoi + note alpha ── */
.lw-why { text-align: center; margin: 3rem auto; max-width: 66ch; }
.lw-why h2 {
  font-family: var(--font-display), serif; font-weight: 700; letter-spacing: .02em;
  font-size: clamp(1.3rem, 3.6vw, 1.7rem); color: var(--gold); margin: 0 0 .7rem;
}
.lw-why p { color: var(--ink-mid); }
.lw-note { max-width: 66ch; margin: 1.4rem auto; }

/* ── CTA final ── */
.lw-final { text-align: center; margin-top: 3rem; }
.lw-closer {
  font-family: var(--font-display), serif; font-weight: 700; line-height: 1.4;
  font-size: clamp(1.3rem, 4vw, 1.9rem); color: var(--gold); margin: 0 0 1.1rem;
}