/* Page de présentation. Reprend les variables de app.css. */

.lp-hero {
  max-width: 780px;
  margin: 0 auto;
  padding: 3.5rem 1.25rem 2.5rem;
  text-align: center;
}
.lp-eyebrow {
  font-size: .78rem; text-transform: uppercase; letter-spacing: .12em;
  color: var(--saffron-600); font-weight: 700; margin-bottom: .8rem;
}
.lp-hero h1 {
  font-size: clamp(1.9rem, 5.5vw, 3.1rem);
  line-height: 1.12; letter-spacing: -.03em; margin-bottom: 1rem;
}
.lp-lead {
  font-size: clamp(1rem, 2.2vw, 1.15rem);
  color: var(--ink-500); max-width: 620px; margin: 0 auto 1.8rem;
}

.lp-section { max-width: 1080px; margin: 0 auto; padding: 3rem 1.25rem; }
.lp-h2 {
  font-size: clamp(1.4rem, 3.4vw, 2rem);
  letter-spacing: -.02em; text-align: center; margin-bottom: .7rem;
}
.lp-sub {
  text-align: center; color: var(--ink-500);
  max-width: 640px; margin: 0 auto 2.2rem;
}

.lp-grid { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 640px) { .lp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 980px) { .lp-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.lp-grid-3 { gap: 1.6rem; }

.lp-card {
  background: var(--paper);
  border: 1px solid var(--ink-200);
  border-radius: var(--radius-lg);
  padding: 1.3rem;
}
.lp-card h3 { font-size: 1.02rem; margin-bottom: .4rem; }
.lp-card p { font-size: .9rem; color: var(--ink-500); margin: 0; }

.lp-icon {
  width: 42px; height: 42px; border-radius: 10px;
  background: var(--saffron-100); color: var(--saffron-600);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: .8rem;
}
.lp-icon svg { width: 21px; height: 21px; }

.lp-band {
  background: var(--paper);
  border-top: 1px solid var(--ink-200);
  border-bottom: 1px solid var(--ink-200);
  max-width: none;
}
.lp-band > * { max-width: 1080px; margin-left: auto; margin-right: auto; }
.lp-band h3 { font-size: 1rem; margin-bottom: .35rem; }
.lp-band p { color: var(--ink-500); }

.lp-cta { text-align: center; padding-bottom: 4rem; }

.lp-footer {
  text-align: center; padding: 2rem 1.25rem 3rem;
  border-top: 1px solid var(--ink-200);
}