:root {
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:#211b3a;
  background:#fcfbff;
  font-synthesis:none
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth
}
body {
  margin:0
}
a {
  color:#5143c6
}
a:focus-visible {
  outline:3px solid #6659d9;
  outline-offset:3px
}
.wrap {
  width:min(1160px,calc(100% - 40px));
  margin:0 auto
}
.skip-link {
  position:absolute;
  top:-100px;
  left:12px;
  z-index:10;
  background:#fff;
  padding:10px
}
.skip-link:focus {
  top:12px
}
.site-header {
  background:#fff;
  border-bottom:1px solid #e8e4f5
}
.header-inner,.footer-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px
}
.header-inner {
  min-height:78px
}
.brand {
  display:inline-flex;
  align-items:center;
  gap:9px;
  color:#211b3a;
  text-decoration:none;
  font-size:21px;
  font-weight:750
}
.brand img {
  width:36px;
  height:36px
}
.brand small {
  display:block;
  font-size:11px;
  font-weight:600;
  color:#746f84;
  line-height:1
}
.site-header nav {
  display:flex;
  align-items:center;
  gap:28px
}
.site-header nav a {
  text-decoration:none;
  font-weight:600
}
.header-cta {
  padding:11px 17px;
  border-radius:8px;
  background:#6659d9;
  color:#fff!important
}
.hero {
  padding:92px 0;
  background:#f5f3fc
}
.hero-grid {
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(250px,0.7fr);
  gap:70px;
  align-items:center
}
.eyebrow {
  font-size:12px;
  letter-spacing:.12em;
  font-weight:800;
  color:#584bc3
}
.hero h1 {
  max-width:760px;
  font-size:clamp(38px,4.7vw,62px);
  line-height:1.09;
  letter-spacing:-.04em;
  margin:20px 0
}
.lead {
  font-size:19px;
  line-height:1.65;
  max-width:740px;
  color:#514b63
}
.actions {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:14px;
  margin-top:30px
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:12px 20px;
  border-radius:8px;
  text-decoration:none;
  font-weight:700
}
.button.primary {
  background:#6659d9;
  color:#fff
}
.button.primary:hover,.header-cta:hover {
  background:#584bc3
}
.button.secondary {
  background:#fff;
  border:1px solid #d6d0ed;
  color:#413797
}
.small-note {
  font-size:13px;
  color:#746f84;
  margin:14px 0 0
}
.hero-card {
  background:#fff;
  border:1px solid #e8e4f5;
  border-radius:18px;
  box-shadow:0 18px 50px #41328712;
  min-height:290px;
  padding:38px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:center;
  justify-items:center;
  gap:15px
}
.hero-card img {
  width:82px;
  height:82px;
  object-fit:contain
}
.hero-card strong {
  grid-row:2;
  font-size:18px;
  overflow-wrap:anywhere;
  text-align:center
}
.hero-card span {
  grid-column:2;
  grid-row:1/3;
  color:#6659d9;
  font-size:42px
}
.section {
  padding:78px 0
}
.section.soft {
  background:#f5f3fc
}
.section h2 {
  font-size:clamp(28px,3vw,39px);
  line-height:1.2;
  letter-spacing:-.025em;
  margin:12px 0 25px
}
.section-intro {
  max-width:820px;
  font-size:18px;
  line-height:1.7;
  color:#514b63
}
.card-grid,.step-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px
}
.pathway-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px;
  margin-top:30px
}
.pathway-card {
  position:relative;
  display:block;
  background:#fff;
  border:1px solid #e8e4f5;
  border-radius:13px;
  padding:27px 60px 27px 27px;
  text-decoration:none;
  color:#211b3a
}
.pathway-card:hover,.pathway-card:focus-visible {
  border-color:#6659d9;
  box-shadow:0 0 0 3px #eeebff
}
.pathway-card h3 {
  font-size:20px;
  margin:0 0 13px
}
.pathway-card p {
  color:#514b63;
  line-height:1.65;
  margin:0
}
.pathway-card span {
  position:absolute;
  right:27px;
  top:27px;
  color:#6659d9;
  font-size:24px
}
.info-card {
  background:#fff;
  border:1px solid #e8e4f5;
  border-radius:13px;
  padding:27px
}
.info-card h3,.step-grid h3 {
  font-size:20px;
  margin:0 0 13px
}
.info-card p,.step-grid p {
  color:#514b63;
  line-height:1.65;
  margin:0
}
.step-grid {
  list-style:none;
  counter-reset:step;
  padding:0;
  margin:30px 0 0
}
.step-grid li {
  counter-increment:step;
  padding:0 17px 0 0
}
.step-grid li:before {
  content:counter(step,decimal-leading-zero);
  display:block;
  font-weight:800;
  font-size:28px;
  color:#6659d9;
  margin-bottom:16px
}
.text-link {
  font-weight:700
}
.related {
  display:flex;
  flex-wrap:wrap;
  gap:16px
}
.related a {
  display:inline-block;
  background:#fff;
  border:1px solid #e8e4f5;
  border-radius:8px;
  padding:16px 20px;
  font-weight:700;
  text-decoration:none
}
.site-footer {
  background:#211b3a;
  color:#fff;
  padding:30px 0
}
.footer-inner>span {
  font-weight:700
}
.footer-inner>div {
  display:flex;
  flex-wrap:wrap;
  gap:18px
}
.site-footer a {
  color:#fff
}
.site-footer a[aria-current=page] {
  text-decoration:none;
  font-weight:700
}
@media(max-width:820px) {
  .hero {
    padding:60px 0
  }
  .hero-grid {
    grid-template-columns:1fr;
    gap:32px
  }
  .hero-card {
    min-height:190px
  }
  .card-grid,.step-grid,.pathway-grid {
    grid-template-columns:1fr
  }
  .site-header nav {
    gap:12px
  }
  .site-header nav a:not(.header-cta) {
    display:none
  }
}
@media(max-width:480px) {
  .wrap {
    width:min(100% - 28px,1160px)
  }
  .header-cta {
    font-size:13px;
    padding:10px
  }
  .hero h1 {
    font-size:38px
  }
  .lead {
    font-size:17px
  }
  .hero-card {
    padding:22px;
    gap:8px
  }
  .hero-card img {
    width:54px;
    height:54px
  }
  .hero-card strong {
    font-size:13px;
    white-space:nowrap
  }
  .hero-card span {
    font-size:28px
  }
  .section {
    padding:56px 0
  }
  .footer-inner {
    align-items:flex-start;
    flex-direction:column
  }
}