/* v7.1.9 — scope strictly to the How It Works editor onboarding section. */
.isp-inner-main[data-isp-page="how"] .isp-onboarding {
  max-width: 1280px;
  margin: clamp(40px,5.6vw,78px) auto 0;
  padding: 0;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 24px;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-heading-copy {max-width: 770px;}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-eyebrow {
  margin: 0 0 13px;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #b17a1a;
  letter-spacing: .15em;
  font-size: 11px;
  font-weight: 850;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-eyebrow span {
  background: #bd871d;width: 24px;height: 2px;border-radius: 2px;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding h2 {
  font: 750 clamp(32px,3.5vw,47px)/1.12 Georgia,'Times New Roman',serif;
  letter-spacing: -.04em;
  color: #132e61;
  margin: 0 0 13px;
  text-wrap: balance;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-lead {
  font-size: clamp(15px,1.3vw,17px);
  line-height: 1.6;
  color: #576e8d;
  margin: 0;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-step-count {
  flex: none;
  color: #6b82a5;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .12em;
  padding: 10px 13px;
  border: 1px solid #d8e4f2;
  border-radius: 100px;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-grid {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 16px;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-card {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  min-height: 315px;
  padding: clamp(22px,2.5vw,31px);
  border: 1px solid #dce7f4;
  border-radius: 19px;
  background: #fff;
  box-shadow: 0 12px 32px rgba(15,46,97,.055);
  transition: transform .2s,box-shadow .2s,border-color .2s;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-card:hover {
  transform: translateY(-3px);
  border-color: #aec9eb;
  box-shadow: 0 17px 37px rgba(15,46,97,.12);
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-card--1 {
  background: linear-gradient(145deg,#153b7d,#0f2b5d);
  border-color: #153b7d;
  color: #fff;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-card--3 {
  background: linear-gradient(155deg,#f1f7ff,#eaf3fe);
  border-color: #d4e5fa;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 32px;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-number {
  color: #bf891e;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: .1em;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-card--1 .isp-onboarding-number {color:#ffd17c;}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-icon {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  background: #e9f3ff;
  border-radius: 14px;
  color: #0c63e7;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-icon svg {width: 26px;height: 26px;}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-card--1 .isp-onboarding-icon {
  background: rgba(255,255,255,.12);
  color: #fff;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding h3 {
  font: 750 clamp(24px,2.2vw,29px)/1.15 Georgia,'Times New Roman',serif;
  letter-spacing: -.026em;
  margin: 0 0 14px;
  color: #173460;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-card--1 h3 {color:#fff;}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-card p {
  color: #536c8e;
  margin: 0;
  line-height: 1.65;
  font-size: 15px;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-card--1 p {color: #e1edff;}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-card-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-top: 16px;
  margin-top: auto;
  border-top: 1px solid #e1e9f5;
  font-size: 12px;
  font-weight: 850;
  color: #3374c3;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-card--1 .isp-onboarding-card-foot {
  color: #f2cb79;
  border-color: rgba(255,255,255,.24);
}
/* Step markers are labels, not links; don't use an arrow that suggests a click. */
.isp-inner-main[data-isp-page="how"] .isp-onboarding-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  margin-top: 16px;
  padding: 26px 31px;
  border: 1px solid #d6e6f8;
  border-radius: 17px;
  background: #f1f7ff;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-bottom > div {min-width: 0;flex: 1;}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-bottom-label {
  display: block;
  color: #a67a26;
  font-size: 10px;
  letter-spacing: .14em;
  font-weight: 850;
  margin-bottom: 8px;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-bottom p {
  color: #1f3c6d;
  font-size: clamp(17px,1.6vw,21px);
  font-weight: 700;
  line-height: 1.45;
  margin: 0;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-cta {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  text-decoration: none;
  min-height: 50px;
  padding: 12px 22px;
  border-radius: 11px;
  background: #0865ed;
  color: #fff;
  font-size: 15px;
  font-weight: 850;
  box-shadow: 0 10px 23px rgba(8,101,237,.13);
  transition: background .2s,transform .2s;
}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-cta svg {width: 18px;height: 18px;}
.isp-inner-main[data-isp-page="how"] .isp-onboarding-cta:hover,
.isp-inner-main[data-isp-page="how"] .isp-onboarding-cta:focus-visible {
  color:#fff;
  background:#064dbb;
  text-decoration:none;
  transform:translateY(-1px);
}
.isp-inner-main[data-isp-page="how"] .isp-inner-page-card:has(.isp-onboarding) {margin-top: 0;}
@media (max-width: 920px) {
  .isp-inner-main[data-isp-page="how"] .isp-onboarding-grid {gap: 12px;}
  .isp-inner-main[data-isp-page="how"] .isp-onboarding-card {min-height: 300px;padding: 21px;}
  .isp-inner-main[data-isp-page="how"] .isp-onboarding h3 {font-size: 23px;}
}
@media (max-width: 700px) {
  .isp-inner-main[data-isp-page="how"] .isp-onboarding {margin-top: 38px;}
  .isp-inner-main[data-isp-page="how"] .isp-onboarding-grid {grid-template-columns: 1fr;gap: 12px;}
  .isp-inner-main[data-isp-page="how"] .isp-onboarding-heading {align-items: flex-start;}
  .isp-inner-main[data-isp-page="how"] .isp-onboarding-step-count {display:none;}
  .isp-inner-main[data-isp-page="how"] .isp-onboarding h2 {font-size: 32px;}
  .isp-inner-main[data-isp-page="how"] .isp-onboarding-card {min-height: 0;}
  .isp-inner-main[data-isp-page="how"] .isp-onboarding-card-top {margin-bottom: 17px;}
  .isp-inner-main[data-isp-page="how"] .isp-onboarding-card p {margin-bottom: 22px;}
  .isp-inner-main[data-isp-page="how"] .isp-onboarding-card-foot {margin-top: 0;}
  .isp-inner-main[data-isp-page="how"] .isp-onboarding-bottom {flex-direction: column;align-items: stretch;padding: 21px;gap: 18px;}
  .isp-inner-main[data-isp-page="how"] .isp-onboarding-cta {width: 100%;}
}
@media (prefers-reduced-motion: reduce) {
  .isp-inner-main[data-isp-page="how"] .isp-onboarding-card,
  .isp-inner-main[data-isp-page="how"] .isp-onboarding-cta {transition:none;}
}

/* Override the generic WP post-link colour so the primary CTA is readable. */
.isp-inner-main[data-isp-page="how"] .isp-inner-prose a.isp-onboarding-cta,
.isp-inner-main[data-isp-page="how"] .isp-inner-prose a.isp-onboarding-cta:visited,
.isp-inner-main[data-isp-page="how"] .isp-inner-prose a.isp-onboarding-cta:hover {
  color: #fff !important;
  text-decoration: none !important;
}
