/* Page /newsletter/ : styles repris de diagnostic.css (mêmes classes dg-*), pour une page autonome */
.dg { background: var(--color-off-white); padding: var(--space-16) 0 var(--space-24); min-height: 70vh; }
.dg .container { max-width: 760px; }
.dg [hidden] { display: none !important; }
.dg-accueil { text-align: center; padding: var(--space-12) 0; }
.dg-etiquette { margin-bottom: var(--space-4); }
.dg-chapo { font-size: var(--text-lead-size); line-height: var(--text-lead-line); color: var(--color-gray-700); max-width: 560px; margin: 0 auto var(--space-8); }
.dg-marque { margin-top: var(--space-8); font-family: var(--font-display); font-weight: 700; font-size: 17px; color: var(--color-gray-700); }
.dg-actions { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); margin-top: var(--space-8); flex-wrap: wrap; }
.dg .btn[disabled] { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
.dg-champ { display: block; margin-top: var(--space-6); }
.dg-champ span { display: block; font-size: var(--text-small-size); color: var(--color-gray-700); margin-bottom: var(--space-2); }
.dg-champ input:focus { outline: 2px solid var(--color-mustard); outline-offset: 1px; border-color: var(--color-mustard); }
.dg-cadre { background: var(--color-white); border: 2px solid var(--color-ink); border-radius: 20px; padding: var(--space-8); }
.dg-piege { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.dg-mention { font-size: 13px; color: var(--color-gray-500); margin-top: var(--space-4); line-height: 1.5; }
.dg-mention a { color: var(--color-gray-700); text-decoration: underline; }
.dg-statut { margin-top: var(--space-4); font-size: 15px; }
.dg-statut.is-ok { color: var(--color-success); }
.dg-statut.is-erreur { color: var(--color-error); }
.dg-h1 {
  font-family: var(--font-display); font-weight: 900;
  font-size: clamp(36px, 6vw, 56px); line-height: 1.05; letter-spacing: -0.02em;
  margin: 0 0 var(--space-6);
}
.dg-champ input[type="text"], .dg-champ input[type="email"] {
  width: 100%; font: inherit; font-size: 16px; padding: 12px 14px;
  border: 1px solid var(--color-gray-300); border-radius: var(--radius-md); background: var(--color-white);
}
.nl-cadre { max-width: 560px; margin: 0 auto; }
.nl-diag { text-align: center; margin-top: var(--space-8); color: var(--color-gray-700); }
.nl-diag a { color: var(--color-ink); text-decoration: underline; }
@media screen and (max-width: 640px) { .dg-cadre { padding: var(--space-6); } }