/* Approved 2026-08-28 exact Military Universe newsletter artwork alignment. */

.newsletter-popup__card {
  width: min(98vw, 1280px);
  max-width: calc((100vh - 24px) * 1.25);
  aspect-ratio: 5 / 4;
}

.newsletter-popup__card::after {
  inset: 1.2%;
}

.newsletter-popup__close {
  top: 0.35%;
  right: 0.45%;
  width: clamp(44px, 5.5%, 70px);
  height: clamp(44px, 5.5%, 70px);
  aspect-ratio: auto;
}

.newsletter-popup__field {
  top: 70.75%;
  left: 71.35%;
  width: 24.25%;
  height: 6.8%;
  padding: 0 1.1%;
  border-radius: 0;
  background: rgba(7, 7, 6, 0.98);
  color: #f5ead7;
  font-size: clamp(8px, 1.75vw, 21px);
}

.newsletter-popup__field::placeholder {
  color: #a99f91;
}

.newsletter-popup__submit {
  top: 80.45%;
  left: 64.45%;
  width: 32.35%;
  height: 11.65%;
  border-radius: 10px;
}

.newsletter-popup__message {
  top: 92.7%;
  left: 64.5%;
  width: 32.2%;
  color: #ffe09c;
  font-size: clamp(7px, 1.18vw, 13px);
}

.newsletter-popup__success {
  top: 1.15%;
  right: 1.1%;
  bottom: 1.15%;
  width: 36.9%;
  border-left-color: rgba(218, 169, 74, 0.78);
}

@media (max-width: 620px) {
  .newsletter-popup__card {
    width: min(99vw, 1280px);
    max-width: calc((100vh - 12px) * 1.25);
  }

  .newsletter-popup__field {
    font-size: clamp(8px, 2.05vw, 13px);
  }
}