html, body {
 margin: 0;
 padding: 0;
 background: #000;
 color: #fff;
 font-family: 'Fjalla One', sans-serif;
}

.newsletter-banner {
 max-width: 1100px;
 margin: 40px auto;
 padding: 26px 22px;
 border: 1px solid rgba(255,255,255,0.12);
 border-radius: 14px;
 background: linear-gradient(180deg, rgba(12,12,12,0.92), rgba(7,7,7,0.96));
 box-shadow: 0 14px 32px rgba(0,0,0,0.22);
}

.newsletter-banner h2 {
 margin: 0 0 10px;
 font-size: 22px;
 letter-spacing: 1px;
 text-transform: uppercase;
 text-align: center;
}

.newsletter-form {
 width: 100%;
}

.input-row {
 display: flex;
 gap: 10px;
 align-items: end;
 flex-wrap: wrap;
}

.input-group {
 flex: 1 1 280px;
}

.input-group-wide {
 flex: 1 1 520px;
}

.input-group label {
 display: block;
 margin-bottom: 8px;
 font-size: 12px;
 letter-spacing: 1px;
 text-transform: uppercase;
 color: rgba(255,255,255,0.78);
}

.input-group input {
 width: 100%;
 padding: 14px 14px;
 border-radius: 10px;
 border: 1px solid rgba(255,255,255,0.18);
 background: rgba(0,0,0,0.55);
 color: #fff;
 outline: none;
 font-size: 14px;
 text-transform: none;
}

.input-helper {
 margin-top: 8px;
 color: rgba(255,255,255,0.62);
 font-family: Arial, Helvetica, sans-serif;
 font-size: 12px;
 line-height: 1.5;
 text-transform: none;
}

.input-group input:focus {
 border-color: rgba(255,255,255,0.45);
}

.submit-btn {
 flex: 0 0 auto;
 min-height: 49px;
 padding: 0 20px;
 border-radius: 10px;
 border: 1px solid rgba(255,255,255,0.20);
 background: rgba(255, 0, 0, 0.18);
 color: #fff;
 cursor: pointer;
 text-transform: uppercase;
 letter-spacing: 1px;
 font-size: 14px;
}

.submit-btn:hover {
 background: rgba(255, 0, 0, 0.28);
}

.submit-btn:active {
 transform: translateY(1px);
}

.fineprint {
 margin: 12px 0 0;
 font-size: 12px;
 opacity: 0.78;
 text-transform: none;
 line-height: 1.55;
 text-align: center;
}

.status {
 margin-top: 12px;
 font-size: 14px;
 text-transform: none;
 text-align: center;
}

.status.ok { color: #b7ffb7; }
.status.err { color: #ffb7b7; }

.confirm-wrap {
 margin-top: 14px;
 padding: 14px;
 border-radius: 12px;
 border: 1px solid rgba(255,255,255,0.14);
 background: rgba(255,255,255,0.04);
 text-align: center;
}

.confirm-title {
 font-size: 14px;
 letter-spacing: 1px;
 text-transform: uppercase;
 margin-bottom: 8px;
}

.confirm-link {
 display: inline-block;
 padding: 10px 14px;
 border-radius: 10px;
 border: 1px solid rgba(255,255,255,0.20);
 background: rgba(0,0,0,0.55);
 color: #fff;
 text-decoration: none;
 text-transform: none;
}

.confirm-link:hover {
 background: rgba(255, 0, 0, 0.18);
}

.confirm-note {
 margin-top: 10px;
 font-size: 12px;
 opacity: 0.85;
 text-transform: none;
}

@media (max-width: 700px) {
 .submit-btn {
 width: 100%;
 }
}
