:root {
  --bg: #f5f7fb;
  --surface: #ffffff;
  --ink: #122033;
  --muted: #4d5f75;
  --line: #d9e2ef;
  --brand: #0b5cab;
  --brand-2: #1f8f6b;
  --shadow: 0 10px 30px rgba(18, 32, 51, 0.08);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: "Segoe UI", "Trebuchet MS", Arial, sans-serif;
  color: var(--ink);
  background:
    radial-gradient(circle at 10% 10%, #e8f1ff 0%, transparent 42%),
    radial-gradient(circle at 85% 0%, #e7fff7 0%, transparent 30%),
    var(--bg);
  line-height: 1.55;
}

.container { width: min(1100px, calc(100% - 32px)); margin: 0 auto; padding: 26px 0 40px; }

.hero { background: linear-gradient(130deg, #0a3f78, #0b5cab 52%, #1f8f6b); color: #fff; border-radius: 18px; padding: 30px 24px; box-shadow: var(--shadow); }
.hero h1 { margin: 0 0 8px; font-size: clamp(1.6rem, 2.4vw, 2.3rem); line-height: 1.2; }
.hero p { margin: 0; max-width: 800px; opacity: 0.96; font-size: 1.02rem; }

.section-title { margin: 28px 0 12px; font-size: 1.22rem; }

.cards { display: grid; grid-template-columns: repeat(12, 1fr); gap: 14px; }
.card { grid-column: span 6; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 18px; box-shadow: 0 6px 18px rgba(18,32,51,0.05); display:flex; flex-direction:column; gap:10px; }
.tag { display:inline-block; width: fit-content; padding:4px 10px; border-radius:999px; font-size:0.8rem; font-weight:700; letter-spacing:0.03em; text-transform:uppercase; background:#e8f1ff; color:#0b4f96; }
.card h2 { margin:0; font-size:1.14rem; line-height:1.3; }
.card p { margin:0; color:var(--muted); }
.actions { margin-top:auto; display:flex; flex-wrap:wrap; gap:8px; }

.btn { display:inline-block; text-decoration:none; font-weight:700; font-size:0.94rem; padding:9px 13px; border-radius:10px; border:1px solid transparent; transition: transform 0.15s ease, box-shadow 0.15s ease; }
.btn.primary { background: var(--brand); color: #fff; }
.btn.secondary { border-color: var(--line); color: var(--ink); background: #fff; }
.btn:hover { transform: translateY(-1px); box-shadow: 0 6px 12px rgba(18,32,51,0.12); }

.note { margin-top:18px; border-left:4px solid var(--brand-2); background:#f1fbf7; padding:12px 14px; color:#28453c; border-radius:8px; }
.lead-box { margin-top:18px; background:#ffffff; border:1px solid var(--line); border-radius:14px; box-shadow:0 8px 20px rgba(18,32,51,0.06); padding:18px; }
.lead-box h3 { margin:0 0 8px; font-size:1.1rem; }
.lead-box p { margin:0 0 10px; color:var(--muted); }
.lead-grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:10px; }
.lead-grid label { display:block; font-size:0.86rem; font-weight:600; margin-bottom:4px; color:#27384d; }
.lead-grid input, .lead-grid select, .lead-grid textarea { width:100%; border:1px solid #c9d6e8; border-radius:10px; padding:10px; font:inherit; color:var(--ink); background:#fff; }
.lead-grid .full { grid-column: 1 / -1; }
.disclaimer { margin-top:10px; font-size:0.85rem; color:#5b6b80; }
.choice-row { display:flex; gap:12px; flex-wrap:wrap; margin-top:6px; color:#284158; font-size:0.92rem; }
.choice-row label { display:inline-flex; align-items:center; gap:6px; cursor:pointer; }
.download-box { margin-top:12px; padding:12px; border:1px dashed #acc2df; border-radius:10px; background:#f7fbff; color:#284158; display:none; }
.download-box.show { display:block; }

@media (max-width: 900px) { .card { grid-column: span 12; } .lead-grid { grid-template-columns: 1fr; } }