:root {
  color: #152033;
  background: #f4f7fb;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; }
a { color: inherit; }
.shell { width: min(1100px, calc(100% - 40px)); margin: 0 auto; }
header { position: sticky; top: 0; z-index: 10; border-bottom: 1px solid rgba(203,213,225,.8);
  background: rgba(255,255,255,.88); backdrop-filter: blur(16px); }
nav { min-height: 68px; display: flex; align-items: center; gap: 28px; }
.brand { display: flex; align-items: center; gap: 11px; margin-right: auto; text-decoration: none; font-weight: 850; }
.brand img { width: 38px; height: 38px; border-radius: 11px; }
nav > a:not(.brand) { color: #59677e; text-decoration: none; font-size: 14px; font-weight: 700; }
.hero { padding: 92px 0 70px; text-align: center; background:
  radial-gradient(circle at 20% 20%, rgba(37,99,235,.12), transparent 36%),
  radial-gradient(circle at 80% 15%, rgba(16,185,129,.11), transparent 32%); }
.eyebrow { margin: 0 0 16px; color: #2563eb; font-size: 13px; font-weight: 850; letter-spacing: .14em; }
h1 { max-width: 850px; margin: 0 auto; font-size: clamp(38px, 7vw, 68px); line-height: 1.04; letter-spacing: -.045em; }
.hero-copy { max-width: 680px; margin: 24px auto 0; color: #66758c; font-size: 19px; line-height: 1.65; }
.cta-row { display: flex; justify-content: center; gap: 12px; margin-top: 30px; }
.button { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; padding: 0 19px;
  border-radius: 12px; text-decoration: none; font-size: 14px; font-weight: 800; }
.button.primary { color: #fff; background: #2563eb; box-shadow: 0 12px 30px rgba(37,99,235,.24); }
.button.secondary { color: #28405f; background: #e6edf7; }
.trust { display: flex; justify-content: center; gap: 22px; margin-top: 38px; color: #526078; font-size: 13px; }
.section { padding: 72px 0; }
.section h2 { margin: 0 0 12px; text-align: center; font-size: clamp(28px, 4vw, 42px); letter-spacing: -.035em; }
.section-intro { max-width: 650px; margin: 0 auto 34px; color: #6b7890; text-align: center; line-height: 1.65; }
.grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.card { padding: 24px; border: 1px solid #dfe7f1; border-radius: 18px; background: #fff;
  box-shadow: 0 12px 35px rgba(30,64,175,.06); }
.card .number { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 11px;
  color: #1d4ed8; background: #dbeafe; font-weight: 850; }
.card h3 { margin: 18px 0 8px; font-size: 19px; }
.card p { margin: 0; color: #6b7890; line-height: 1.65; }
.privacy { color: #e2e8f0; background: #0f172a; }
.privacy .card { border-color: #26344c; background: #172033; box-shadow: none; }
.privacy .card h3 { color: #f8fafc; }
.privacy .card p { color: #aab8ca; }
.page { padding: 64px 0 90px; }
.page article { max-width: 790px; margin: 0 auto; padding: 34px; border: 1px solid #dfe7f1; border-radius: 18px; background: #fff; }
.page h1 { margin: 0 0 12px; font-size: 42px; text-align: left; }
.page h2 { margin-top: 32px; font-size: 24px; }
.page p, .page li { color: #5f6f86; line-height: 1.75; }
.faq { display: grid; gap: 12px; }
.faq details { padding: 17px 19px; border: 1px solid #dfe7f1; border-radius: 13px; background: #fff; }
.faq summary { cursor: pointer; font-weight: 800; }
footer { padding: 32px 0; border-top: 1px solid #dfe7f1; color: #718096; font-size: 13px; }
footer .shell { display: flex; justify-content: space-between; gap: 20px; }
footer div { display: flex; gap: 18px; }

@media (max-width: 760px) {
  nav > a:not(.brand) { display: none; }
  .hero { padding-top: 64px; }
  .hero-copy { font-size: 16px; }
  .grid { grid-template-columns: 1fr; }
  .trust { flex-direction: column; gap: 8px; }
  .cta-row, footer .shell { flex-direction: column; }
}
