/* The source's three-step composition, in the approved Bradial palette and geometry. */
.onboarding-section{padding:68px 0 100px;background:radial-gradient(ellipse at 8% 65%,#f4faff,transparent 54%),#fff}
.onboarding-container{width:min(1240px,calc(100% - 80px));margin-inline:auto}
.onboarding-heading{max-width:1060px;margin:0 auto 54px;text-align:center}
.onboarding-headline{margin:0;color:var(--ink);font-size:clamp(44px,4.1vw,57px);font-weight:400;line-height:1.11;letter-spacing:-.045em;text-wrap:balance}
.onboarding-description{max-width:740px;margin:26px auto 0;color:#6c8193;font-size:17px;font-weight:350;line-height:1.75;text-wrap:balance}
.onboarding-layout{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:stretch}
.onboarding-visual{position:relative;min-width:0;min-height:550px;border:1px solid #cce3f9;border-radius:24px;overflow:hidden;background:radial-gradient(ellipse at 55% 20%,#dff3ff,#b9ddff 55%,#e7f4ff 95%);box-shadow:inset 0 1px 0 #ffffffc9}
.onboarding-screen{position:absolute;left:58px;right:-102px;top:58px;bottom:-60px;overflow:hidden;border:1px solid #e1eef8;border-radius:18px;background:#fff;box-shadow:0 12px 38px -18px #2f6a9c42}
.onboarding-screen img{display:block;width:100%;height:auto;max-width:none;transform:translateY(-9.1%);user-select:none}
.onboarding-steps{display:flex;flex-direction:column;gap:16px;min-width:0}
.onboarding-step{min-width:0;overflow:hidden;border:1px solid #d3e7fa;border-radius:22px;background:#f8fcff;transition:background-color .2s,border-color .2s}
.onboarding-step.is-open{border-color:#b5d9fa;background:linear-gradient(135deg,#f4faff,#e6f3ff)}
.onboarding-step-heading{margin:0;font:inherit}
.onboarding-step-button{display:flex;align-items:flex-start;gap:18px;width:100%;padding:25px 24px;border:0;background:transparent;text-align:left;line-height:1.4}
.onboarding-step-button:hover{background:#ddecfc55}
.onboarding-step-button:focus-visible{outline-offset:-5px;border-radius:21px}
.onboarding-number{display:grid;place-items:center;flex-shrink:0;width:43px;height:43px;border:1px solid #d0e6fa;border-radius:13px;background:#e6f2fe;color:#2f86ea;font-size:16px;font-weight:450;line-height:1;transition:background-color .2s,color .2s}
.is-open .onboarding-number{background:#2f86ea;border-color:#2f86ea;color:#fff;box-shadow:inset 0 1px 2px #ffffff70}
.onboarding-step-text{display:block;min-width:0;padding-top:1px}
.onboarding-step-title{display:block;color:#2b465c;font-size:23px;font-weight:400;line-height:1.2;letter-spacing:-.025em}
.onboarding-step-description{display:block;margin-top:10px;color:#647f96;font-size:16px;font-weight:350;line-height:1.6}
.onboarding-detail{margin:0 24px 24px;overflow:hidden;border:1px solid #e2effa;border-radius:16px;background:#f4f8fe}
.onboarding-detail img{display:block;width:100%;height:auto;user-select:none}
.onboarding-detail-pair{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:8px;padding:10px;background:#e8f3fe}
.onboarding-detail-pair img{border-radius:11px}
@media(max-width:1100px) and (min-width:801px){.onboarding-container{width:calc(100% - 56px)}.onboarding-layout{gap:24px}.onboarding-headline{font-size:49px}.onboarding-visual{min-height:550px}.onboarding-screen{left:35px;right:-135px;top:74px}.onboarding-step-button{padding:23px 20px;gap:14px}.onboarding-step-title{font-size:21px}.onboarding-step-description{font-size:15px}.onboarding-detail{margin:0 20px 20px}}
@media(max-width:800px){.onboarding-section{padding:46px 0 76px}.onboarding-container{width:calc(100% - 48px)}.onboarding-heading{margin-bottom:38px}.onboarding-headline{font-size:49px}.onboarding-description{font-size:17px;max-width:630px}.onboarding-layout{grid-template-columns:1fr;gap:24px;max-width:650px;margin:auto}.onboarding-visual{min-height:430px}.onboarding-screen{left:44px;right:-76px;top:36px}.onboarding-step-button{padding:24px}.onboarding-step-title{font-size:23px}}
@media(max-width:520px){.onboarding-section{padding:38px 0 64px}.onboarding-container{width:calc(100% - 36px)}.onboarding-heading{margin-bottom:30px}.onboarding-headline{font-size:clamp(35px,9.5vw,43px);line-height:1.12;letter-spacing:-.044em}.onboarding-description{margin-top:22px;font-size:16px;line-height:1.7}.onboarding-layout{gap:20px}.onboarding-visual{min-height:330px;border-radius:22px}.onboarding-screen{left:28px;right:-46px;top:34px;border-radius:12px}.onboarding-steps{gap:12px}.onboarding-step{border-radius:20px}.onboarding-step-button{gap:14px;padding:22px 18px}.onboarding-number{width:37px;height:37px;border-radius:11px;font-size:15px}.onboarding-step-title{font-size:21px}.onboarding-step-description{font-size:15px;margin-top:9px;line-height:1.6}.onboarding-detail{margin:0 18px 18px;border-radius:13px}.onboarding-detail-pair{gap:6px;padding:7px}}
@media(max-width:360px){.onboarding-step-button{padding:21px 16px;gap:12px}.onboarding-number{width:34px;height:34px}.onboarding-step-title{font-size:20px}.onboarding-detail{margin-inline:16px}.onboarding-visual{min-height:300px}}
@media(prefers-reduced-motion:reduce){.onboarding-step,.onboarding-number{transition:none}.onboarding-headline .headline-char{opacity:1!important;transform:none!important}}
