/* Newsletter sign-up block and its small pages (src/newsletter.js, public/newsletter.js). Works inside an Inca stone (.stone .c) and in the classic
   design (.nl-classic). Colours come from the page where it has them (--ink, --focus) and fall back to the site's navy and sun. No motion. */
.nl { --nl-navy: #0f2747; --nl-sun: #f39a1e; --nl-bad: #8a1c1c; }
@media (prefers-color-scheme: dark) { .nl { --nl-bad: #ffb4a8; } }
.nl h1, .nl h2 { margin: 0 0 .3em; }
.nl .sub { max-width: 62ch; margin: 0 0 4px; }
.nlform { display: grid; gap: 16px; max-width: 640px; margin-top: 16px; }
.nl-row { display: grid; gap: 6px; }
.nl label, .nl legend { font-weight: 600; }
.nl input[type="email"], .nl select {
  width: 100%; min-height: 48px; padding: 10px 14px; box-sizing: border-box;
  border: 2px solid var(--nl-navy); border-radius: 10px; background: #fff; color: var(--nl-navy); font: inherit;
}
.nl input[type="email"]::placeholder { color: #4a5873; opacity: 1; }
.nl select { appearance: auto; }
.nl input:focus-visible, .nl select:focus-visible, .nl-submit:focus-visible, .nl-chip input:focus-visible + span, .nl-consent input:focus-visible {
  outline: 3px solid var(--focus, var(--nl-navy)); outline-offset: 3px;
}
.nl-int { border: 0; padding: 0; margin: 0; min-width: 0; }
.nl-int legend { padding: 0; margin: 0 0 8px; }
.nl-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.nl-chip { position: relative; display: inline-flex; font-weight: 500; }
.nl-chip input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.nl-chip span { display: inline-block; padding: 8px 16px; min-height: 40px; box-sizing: border-box; border: 2px solid currentColor; border-radius: 999px; line-height: 1.5; }
.nl-chip input:checked + span { background: var(--nl-sun); border-color: var(--nl-sun); color: var(--nl-navy); font-weight: 600; }
.nl-chip input:checked + span::before { content: "\2713\00a0"; }
.nl-consent { display: flex; align-items: flex-start; gap: 12px; font-weight: 400; }
.nl-consent input { flex: none; width: 24px; height: 24px; margin: 1px 0 0; accent-color: var(--nl-navy); }
.nl-act { display: flex; }
.nl-submit {
  min-height: 48px; padding: 10px 28px; border: 0; border-radius: 999px; background: var(--nl-sun); color: var(--nl-navy);
  font: inherit; font-weight: 700; cursor: pointer;
}
.nl-submit:hover { background: #e48a0e; }
.nl-submit:disabled { opacity: .65; cursor: progress; }
.nl-say { min-height: 1.4em; margin: 0; }
.nl-say.bad { color: var(--nl-bad); font-weight: 600; }
.nl-say.bad::before { content: "! "; }
.nl-done { max-width: 640px; margin-top: 16px; }
.nl-done h3 { margin: 0 0 .3em; }
.nl-done:focus { outline: none; }
.nl-fine { max-width: 62ch; margin-top: 14px; }
.nl .hp { position: absolute; inset-inline-start: -9999px; width: 1px; height: 1px; overflow: hidden; }
.nl-classic { padding: 36px 0 44px; }
.nl-doc .nl, .nl-doc.nl { max-width: 720px; margin: 0 auto; padding: 24px 0 48px; }
.nl-note p { max-width: 62ch; }
