/* (NEWSLETTER) block and the footer mini-form. */
@layer components {
  .newsletter {
    display: grid;
    justify-items: center;
    gap: 1.125rem;
    padding: var(--noria-section-gap) var(--noria-gutter) 5.5rem;
    text-align: center;
  }

  .newsletter__title { font-size: var(--noria-text-newsletter); }

  .newsletter__lead {
    margin: 0;
    font-size: var(--noria-text-small);
    letter-spacing: 0.07em;
  }

  .newsletter-form { margin: 0; }

  .newsletter-form__row { display: flex; }

  .newsletter-form__input {
    flex: 1 1 auto;
    min-width: 0;
    height: 3.25rem;
    padding-inline: 1.25rem;
    font-size: var(--noria-text-small);
  }

  .newsletter-form__input:disabled {
    background: transparent;
    color: inherit;
    cursor: not-allowed;
  }

  .newsletter-form__input::placeholder { color: inherit; opacity: 0.85; }

  .newsletter-form__note {
    margin: 0.625rem 0 0;
    font-size: var(--noria-text-form-label);
    font-style: italic;
  }

  /* Band: a bordered box joined to the gold button. */
  .newsletter-form--band .newsletter-form__row { width: min(27.25rem, 100%); }
  .newsletter-form--band .newsletter-form__input { width: 16rem; border: 1px solid var(--noria-ink); }
  .newsletter-form--band .newsletter-form__submit { flex: 0 0 11rem; min-height: 3.25rem; border-radius: 0; }

  /* Footer: an outlined pill and the gold button under it, aligned right. */
  .newsletter-form--footer {
    display: grid;
    justify-items: end;
    gap: 1rem;
    width: min(14.25rem, 100%);
  }

  .newsletter-form__title {
    justify-self: center;
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    letter-spacing: 0.08em;
  }

  .newsletter-form--footer .newsletter-form__row { flex-direction: column; align-items: flex-end; gap: 1rem; width: 100%; }

  .newsletter-form--footer .newsletter-form__input {
    width: 100%;
    border: 2px solid var(--noria-sand);
    border-radius: var(--radius-pill);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  .newsletter-form--footer .newsletter-form__submit { min-height: 2.5rem; padding-inline: 2rem; font-size: 1rem; }
  .newsletter-form--footer .newsletter-form__note { justify-self: center; }

  @media (max-width: 63.99rem) {
    .newsletter-form--footer { justify-items: center; margin-inline: auto; }
    .newsletter-form--footer .newsletter-form__row { align-items: center; }
  }

  @media (max-width: 47.99rem) {
    .newsletter-form--band .newsletter-form__row { flex-direction: column; align-items: center; gap: 1.25rem; }
    .newsletter-form--band .newsletter-form__input { width: min(15rem, 100%); height: 2.75rem; }
    .newsletter-form--band .newsletter-form__submit { flex: none; min-height: 2.75rem; padding-inline: 2rem; }
  }
}