@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700;800&display=swap');

:root {
  --bg: #f8f9fc;
  --fg: #171a25;
  --card: #fff;
  --primary: #3554e8;
  --primary-dark: #2945c8;
  --muted: #697083;
  --border: #e1e4ec;
  --accent: #eaf0ff;
  --danger: #b42318;
  --radius: 16px;
  --shadow: 0 20px 60px -25px rgba(53,84,232,.35);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: Archivo, Arial, sans-serif;
  line-height: 1.55;
}
h1,h2,h3 { margin: 0; font-weight: 800; letter-spacing: -.02em; line-height: 1.08; }
p { margin: 0 0 1rem; }
.container { width: min(960px, calc(100% - 40px)); margin: auto; }

.hero-surface {
  background: linear-gradient(160deg, #e5ebff 0%, #f8f9fc 55%, #f0f2f7 100%);
  overflow: hidden;
}
.hero-grid {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 60px;
  align-items: center;
  padding: 70px 0;
}
.logo { display:block; width:100%; max-width:420px; border-radius:18px; margin-bottom:28px; }
.cover { width:100%; max-width:440px; display:block; margin:auto; border-radius:28px; object-fit:cover; }
h1 { font-size: clamp(40px, 6vw, 62px); margin: 14px 0; }
.lead { max-width: 650px; font-size: 19px; color: var(--muted); }
.pill {
  display:inline-block;
  margin:0;
  padding:7px 15px;
  border:1px solid #cdd6ff;
  border-radius:999px;
  background:#fff;
  color:var(--primary);
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.btn-primary {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:999px;
  padding:13px 27px;
  background:var(--primary);
  color:#fff;
  font:inherit;
  font-weight:700;
  text-decoration:none;
  cursor:pointer;
  transition:.15s ease;
}
.btn-primary:hover { background:var(--primary-dark); transform:translateY(-1px); }
.btn-primary:disabled { opacity:.6; cursor:not-allowed; transform:none; }
.small { font-size:14px; }
.muted { color:var(--muted); }
.intro { max-width:800px; padding:65px 20px 40px; font-size:18px; }
.form-section { padding-bottom:90px; }
.tabs {
  display:flex;
  gap:5px;
  padding:6px;
  margin-bottom:30px;
  border:1px solid var(--border);
  border-radius:999px;
  background:#fff;
}
.tab {
  flex:1;
  border:0;
  border-radius:999px;
  background:transparent;
  padding:12px 20px;
  color:var(--muted);
  font:inherit;
  font-size:14px;
  font-weight:800;
  cursor:pointer;
}
.tab.active { background:var(--primary); color:#fff; }
.tab-intro { margin-bottom:28px; color:var(--muted); }
.tab-intro h2 { color:var(--fg); font-size:34px; margin-bottom:12px; }
.card {
  background:var(--card);
  border:1px solid var(--border);
  border-radius:24px;
  box-shadow:var(--shadow);
  padding:40px;
}
.card > div { margin-bottom:35px; }
.card h3 { font-size:22px; margin-bottom:5px; }
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:18px; }
label { display:block; font-size:14px; font-weight:600; margin-bottom:12px; }
input {
  display:block;
  width:100%;
  margin-top:7px;
  padding:12px 14px;
  border:1px solid var(--border);
  border-radius:10px;
  background:#f9fafc;
  color:var(--fg);
  font:inherit;
  outline:none;
}
input:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(53,84,232,.14); }
.span-2 { grid-column:span 2; }
.chips { display:flex; flex-wrap:wrap; gap:8px; margin:15px 0 18px; }
.check {
  width:auto;
  margin:0;
  padding:8px 15px;
  border:1px solid var(--border);
  border-radius:999px;
  background:#fff;
  color:var(--muted);
  cursor:pointer;
  font-weight:500;
}
.check input { display:none; }
.check.selected { border-color:var(--primary); background:var(--accent); color:#263eae; font-weight:700; }
.actions { display:flex; align-items:center; gap:16px; margin:0 !important; }
.error {
  margin:20px 0;
  padding:12px 15px;
  border-radius:9px;
  background:#fff0ef;
  color:var(--danger);
  font-size:14px;
}
.success { text-align:center; padding:55px 40px; }
.success h3 { font-size:30px; margin:10px 0; }
.eyebrow { color:var(--primary); text-transform:uppercase; letter-spacing:.12em; font-size:12px; font-weight:800; }
.center { text-align:center; margin-top:28px; }
.hidden { display:none !important; }
footer {
  border-top:1px solid var(--border);
  background:#fff;
  padding:30px 20px;
  text-align:center;
  color:var(--muted);
  font-size:14px;
}

@media (max-width: 760px) {
  .hero-grid { grid-template-columns:1fr; gap:35px; padding:45px 0; }
  .hero-grid > div:last-child { order:-1; }
  .cover { max-width:520px; }
  .grid-2 { grid-template-columns:1fr; }
  .span-2 { grid-column:auto; }
  .card { padding:25px; }
  .intro { padding-top:45px; font-size:16px; }
  .actions { align-items:flex-start; flex-direction:column; }
}