/* Lettre d'information : bloc d'inscription de la page d'accueil et pages
   publiques (confirmation, gestion de l'abonnement). */

/* ---------- Bloc d'inscription (page d'accueil) ---------- */
.nl-signup { padding: var(--sp-24) 0; }
.nl-signup__card {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  gap: var(--sp-12);
  align-items: center;
  padding: var(--sp-16) var(--sp-12);
  background: linear-gradient(135deg, var(--color-bg-dark) 0%, #1E293B 100%);
  border-radius: var(--radius-xl);
  color: white;
}
.nl-signup__card::before {
  content: '';
  position: absolute;
  top: -40%;
  left: -15%;
  width: 560px;
  height: 560px;
  background: radial-gradient(circle, rgba(200, 16, 46, 0.18) 0%, transparent 70%);
  pointer-events: none;
}
.nl-signup__pitch, .nl-signup__panel { position: relative; }
.nl-signup__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  margin: 0 0 var(--sp-4);
  color: #FCA5B4;
  font-size: var(--fs-sm);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.nl-signup__title {
  margin: 0 0 var(--sp-4);
  color: white;
  font-size: var(--fs-3xl);
  line-height: 1.15;
  text-wrap: balance;
}
.nl-signup__text { margin: 0 0 var(--sp-6); max-width: 52ch; color: #CBD5E1; font-size: var(--fs-lg); line-height: 1.6; }
.nl-signup__topics { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-3); }
.nl-signup__topics li { display: flex; align-items: center; gap: var(--sp-3); color: #E2E8F0; font-size: var(--fs-sm); }
.nl-signup__topics svg { flex: none; color: #FCA5B4; }

.nl-signup__panel {
  padding: var(--sp-8);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: var(--radius-lg);
}
.nl-signup__form { display: grid; gap: var(--sp-4); }
.nl-signup__label { font-size: var(--fs-sm); font-weight: 600; color: white; }
.nl-signup__row { display: flex; gap: var(--sp-3); }
.nl-signup__row input[type="email"] { flex: 1; min-width: 0; background: white; }
.nl-signup__row .btn { flex: none; }
.nl-signup__error { margin: calc(-1 * var(--sp-1)) 0 0; color: #FCA5B4; font-size: var(--fs-sm); font-weight: 600; }
.nl-signup__check { display: flex; align-items: flex-start; gap: var(--sp-3); color: #CBD5E1; font-size: var(--fs-sm); line-height: 1.5; cursor: pointer; }
.nl-signup__check input { flex: none; width: 18px; height: 18px; margin-top: 0.15rem; accent-color: var(--color-primary); }
.nl-signup__check em { color: #94A3B8; font-style: normal; }
.nl-signup__legal { margin: 0; color: #94A3B8; font-size: var(--fs-xs); line-height: 1.55; }
.nl-signup__legal a { color: #CBD5E1; text-decoration: underline; text-underline-offset: 2px; }
.nl-signup__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.nl-signup__done { display: flex; gap: var(--sp-4); align-items: flex-start; color: #CBD5E1; line-height: 1.6; }
.nl-signup__done p { margin: 0; }
.nl-signup__done-icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(200, 16, 46, 0.18);
  color: #FCA5B4;
}
.nl-signup__done-title { color: white; font-size: var(--fs-xl); font-weight: 700; margin-bottom: var(--sp-1) !important; }

@media (max-width: 960px) {
  .nl-signup__card { grid-template-columns: 1fr; gap: var(--sp-8); padding: var(--sp-12) var(--sp-8); }
}
@media (max-width: 560px) {
  .nl-signup { padding: var(--sp-16) 0; }
  .nl-signup__card { padding: var(--sp-10) var(--sp-5); border-radius: var(--radius-lg); }
  .nl-signup__panel { padding: var(--sp-5); }
  .nl-signup__row { flex-direction: column; }
  .nl-signup__row .btn { width: 100%; justify-content: center; }
}

/* ---------- Pages publiques ---------- */
.nl-page { padding: var(--sp-16) 0 var(--sp-24); background: var(--color-bg-alt); min-height: 60vh; }
.nl-page__card {
  max-width: 620px;
  margin: 0 auto;
  padding: var(--sp-10);
  background: white;
  border: 1px solid var(--color-border);
  border-top: 4px solid var(--color-primary);
  border-radius: var(--radius-lg);
  text-align: center;
}
.nl-page__card--left { text-align: left; }
.nl-page__icon { display: inline-grid; place-items: center; width: 72px; height: 72px; margin-bottom: var(--sp-4); border-radius: 50%; background: #ECFDF5; color: var(--color-success); }
.nl-page__eyebrow { margin: 0 0 var(--sp-2); color: var(--color-primary); font-size: var(--fs-sm); font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
.nl-page__title { margin: 0 0 var(--sp-4); font-size: var(--fs-2xl); text-wrap: balance; }
.nl-page__lead { margin: 0 0 var(--sp-6); color: var(--color-text-muted); line-height: 1.65; }
.nl-page__actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); justify-content: center; }
.nl-page__status { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3); margin: 0 0 var(--sp-6); color: var(--color-text-muted); word-break: break-all; }
.nl-page__form { margin-bottom: var(--sp-8); }
.nl-page__leave { padding-top: var(--sp-6); border-top: 1px solid var(--color-border); }
.nl-page__leave h2 { margin: 0 0 var(--sp-4); font-size: var(--fs-lg); }
.nl-page__legal { margin: var(--sp-8) 0 0; color: var(--color-text-soft); font-size: var(--fs-xs); }
.nl-page__legal a { color: var(--color-text-muted); }
.nl-muted { color: var(--color-text-soft); font-weight: 400; }

.nl-status { display: inline-block; padding: 2px 10px; border-radius: var(--radius-full); font-size: var(--fs-xs); font-weight: 700; white-space: nowrap; }
.nl-status--inscrit { background: #ECFDF5; color: #047857; }
.nl-status--en_attente { background: #FFFBEB; color: #B45309; }
.nl-status--desinscrit { background: #F1F5F9; color: #475569; }
.nl-status--en_erreur { background: #FEF2F2; color: #B91C1C; }

@media (max-width: 560px) {
  .nl-page { padding-top: var(--sp-8); }
  .nl-page__card { padding: var(--sp-6) var(--sp-5); }
  .nl-page__actions .btn { width: 100%; justify-content: center; }
}
