.newsletter-page { margin-top: 36px; margin-bottom: 56px; color: #f5f3fa; font-size: 16px; line-height: 1.65; }
.newsletter-layout { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 24px; align-items: start; }
.newsletter-introduction, .newsletter-signup { padding: 30px; border-radius: 5px; background: #34324c; box-shadow: 0 8px 28px #0006; }
.newsletter-introduction { border-top: 3px solid #fea410; }
.newsletter-page h2 { margin: 0 0 20px; color: #fff; font-size: 32px; line-height: 1.15; }
.newsletter-page p { margin-bottom: 18px; }
.newsletter-introduction a { display: inline-flex; align-items: center; gap: 12px; padding: 8px 0; font-weight: 800; }
.newsletter-field { margin-bottom: 22px; }
.newsletter-page label { display: block; font-size: 16px; }
.newsletter-page .form-control { min-height: 48px; padding: 10px 12px; font-size: 16px; border: 1px solid #ffffff38 !important; }
.newsletter-page .form-control:focus { border-color: #fea410 !important; box-shadow: 0 0 0 3px #fea41040; }
.newsletter-genres { margin: 6px 0 24px; }
.newsletter-genres legend { float: none; width: auto; margin-bottom: 4px; font-size: 18px; font-weight: 800; }
.newsletter-page .newsletter-hint { margin-bottom: 14px; color: #d7d4e3; font-size: 15px; }
.newsletter-genre-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.newsletter-page .newsletter-genre { display: flex; align-items: center; gap: 9px; min-height: 44px; margin: 0; padding: 8px 10px; border: 1px solid #ffffff2e; border-radius: 4px; font-size: 15px; font-weight: 600; line-height: 1.35; cursor: pointer; }
.newsletter-genre input { flex: 0 0 auto; width: 18px; height: 18px; margin: 0; accent-color: #fea410; }
.newsletter-genre:focus-within { outline: 2px solid #fea410; outline-offset: 2px; }
.newsletter-page .newsletter-confirmation-note { margin-bottom: 22px; color: #e3dfed; font-size: 15px; }
.newsletter-page .newsletter-submit { width: 100%; min-height: 48px; padding: 10px 18px; color: #241e17; background: #fea410; font-size: 17px; font-weight: 900; }
.newsletter-page .newsletter-submit:hover, .newsletter-page .newsletter-submit:focus { background: #ffbb46; color: #241e17; }
.newsletter-page [role="status"] { font-size: 17px; line-height: 1.6; }
@media (max-width: 767px) {
    .newsletter-layout { grid-template-columns: 1fr; gap: 20px; }
    .newsletter-introduction, .newsletter-signup { padding: 24px; }
    .newsletter-page h2 { font-size: 29px; }
}
@media (max-width: 380px) {
    .newsletter-introduction, .newsletter-signup { padding: 20px; }
    .newsletter-genre-options { grid-template-columns: 1fr; }
}