/* ============================================================
   newsletter.css — Newsletter Signup
   ============================================================ */

/* ========== 20. NEWSLETTER ========== */

.newsletter-section {
  background: linear-gradient(135deg, #1a1625, #2d1f3d);
  padding: 48px 32px;
  text-align: center;
}

.newsletter-section h2 {
  color: #fff;
  margin-bottom: 8px;
}

.newsletter-section p {
  color: rgba(255, 255, 255, 0.7);
  font-size: 15px;
  margin-bottom: 24px;
}

.newsletter-form {
  display: flex;
  max-width: 500px;
  margin: 0 auto;
  gap: 10px;
}

.newsletter-form input {
  flex: 1;
  padding: 12px 16px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: var(--radius);
  color: #fff;
  font-family: var(--font-body);
  font-size: 14px;
}

.newsletter-form input::placeholder {
  color: rgba(255, 255, 255, 0.4);
}

.newsletter-form input:focus {
  outline: none;
  border-color: var(--color-primary);
}

.newsletter-form .btn {
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
  color: #fff;
  white-space: nowrap;
}

@media (max-width: 768px) {
  .newsletter-section { padding: 36px 20px; }
  .newsletter-form {
    flex-direction: column;
  }
  .newsletter-form input,
  .newsletter-form .btn {
    width: 100%;
  }
}