/* styles.css — Blaze AI Coupons page */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: #0f172a;
  background: #f8fafc;
  line-height: 1.6;
}

.container { width: min(1100px, 92%); margin: 0 auto; }

.site-header {
  background: radial-gradient(1000px 600px at 10% 10%, #e0f2fe 0, transparent 60%) no-repeat,
              radial-gradient(1200px 800px at 90% -10%, #e9d5ff 0, transparent 60%) no-repeat,
              linear-gradient(180deg, #0ea5e9, #6366f1);
  color: #fff;
  padding: 72px 0 56px;
  text-align: center;
}
.site-header h1 { margin: 0 0 12px; font-size: clamp(2rem, 1.4rem + 2.5vw, 3rem); font-weight: 800; }
.subtitle { margin: 0 auto 20px; max-width: 44ch; opacity: 0.95; }
.cta {
  display: inline-block; margin-top: 10px; padding: 12px 18px;
  background: #111827; color: #fff; border-radius: 10px;
  text-decoration: none; font-weight: 700;
  transition: transform .15s ease, box-shadow .15s ease;
  box-shadow: 0 8px 20px rgba(0,0,0,.25);
}
.cta:hover { transform: translateY(-2px); }

main { padding: 32px 0 64px; }
h2 { font-size: clamp(1.3rem, 1.1rem + 1.2vw, 2rem); margin: 28px 0 12px; }
h3 { font-size: 1.125rem; margin: 0 0 8px; }

.deal-grid {
  display: grid; grid-template-columns: repeat(12, 1fr);
  gap: 16px; margin-top: 10px;
}
.deal-card {
  grid-column: span 12;
  background: #fff; border: 1px solid #e5e7eb;
  border-radius: 14px; padding: 18px;
  box-shadow: 0 10px 22px rgba(15,23,42,0.06);
}
@media (min-width: 640px) { .deal-card { grid-column: span 6; } }
@media (min-width: 960px) { .deal-card { grid-column: span 4; } }

.btn {
  display: inline-block; margin-top: 10px; padding: 8px 12px;
  border-radius: 10px; background: #0ea5e9; color: #fff;
  text-decoration: none; font-weight: 700;
  transition: filter .15s ease, transform .15s ease;
}
.btn:hover { filter: brightness(0.95); transform: translateY(-1px); }

.steps {
  background: #fff; border: 1px solid #e5e7eb;
  border-radius: 14px; padding: 18px 22px;
}
.steps li { margin: 8px 0; }

.benefits {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: 10px 16px; list-style: none; padding-left: 0;
}
.benefits li::before { content: "✔"; margin-right: 8px; }
@media (max-width: 639px) { .benefits { grid-template-columns: 1fr; } }

.site-footer {
  background: #0b1220; color: #cbd5e1; padding: 26px 0;
}
.site-footer .footer-grid { display: grid; gap: 10px; align-items: center; }
@media (min-width: 720px) {
  .site-footer .footer-grid { grid-template-columns: 1fr auto; }
}
.footer-nav a { color: #cbd5e1; text-decoration: none; margin-right: 14px; }
.footer-nav a:hover { text-decoration: underline; }