/* A guided conversation; answers shape the next question and suggested plan. */
.onboarding-section { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(45px, 7vw, 110px); padding-block: 110px; border-top: 1px solid #d2d2d2; color: #1c1c1c; scroll-margin-top: 25px; }
.onboarding-intro { align-self: start; padding-top: 9px; }.onboarding-intro > .eyebrow { color: #626262; font-size: 10px; }
.onboarding-intro h2 { font-size: clamp(47px, 5.2vw, 76px); line-height: 1.02; letter-spacing: -.065em; font-weight: 460; margin: 30px 0 26px; }.onboarding-intro h2 em { font-family: Georgia, 'Times New Roman', serif; font-weight: 400; color: #666666; }
.onboarding-intro > p:not(.eyebrow) { font-size: 14px; color: #646464; line-height: 1.85; max-width: 39ch; }
.onboarding-promise { display: flex; gap: 17px; align-items: start; padding-top: 28px; margin-top: 30px; border-top: 1px solid #d2d2d2; max-width: 330px; }.onboarding-promise > span { font-size: 25px; line-height: 1; }.onboarding-promise p { font-size: 12px; line-height: 1.8; }
.onboarding-intro > .onboarding-privacy { font-size: 10px !important; margin-top: 38px; max-width: 47ch !important; color: #777777 !important; }
.onboarding-panel { min-width: 0; padding: clamp(25px, 3vw, 43px); background: #fafafa; border: 1px solid #d3d3d3; box-shadow: 0 20px 55px -38px #37373730; }
.onboarding-topline { display: flex; align-items: center; justify-content: space-between; gap: 20px; font-family: var(--mono); font-size: 8px; letter-spacing: .055em; color: #727272; }
.onboarding-meter { height: 2px; background: #e2e2e2; margin: 18px 0 31px; overflow: hidden; }.onboarding-meter > span { display: block; height: 100%; width: 100%; transform: scaleX(0); transform-origin: left; background: #353535; transition: transform .4s ease; }
.onboarding-form h3, .onboarding-fallback h3 { font-size: clamp(25px, 2.6vw, 36px); line-height: 1.14; letter-spacing: -.045em; font-weight: 470; margin: 0; }.onboarding-form h3:focus { outline: none; }.onboarding-form h3:focus-visible { outline: 1px solid #555555; outline-offset: 6px; }
.onboarding-hint { font-size: 12px; color: #707070; line-height: 1.8; margin-top: 14px; max-width: 52ch; }
.onboarding-options { border: 0; padding: 0; margin: 27px 0 0; display: grid; gap: 10px; min-width: 0; }
.onboarding-option { display: flex; gap: 13px; align-items: flex-start; padding: 18px; border: 1px solid #d8d8d8; background: #f6f6f6; cursor: pointer; transition: border-color .2s, background .2s; }.onboarding-option:hover { border-color: #939393; background: #ededed; }.onboarding-option:has(input:checked) { border-color: #444444; background: #e8e8e8; }.onboarding-option:has(input:focus-visible) { outline: 2px solid #333333; outline-offset: 3px; }
.onboarding-option input { flex: none; width: 15px; height: 15px; accent-color: #303030; margin: 1px 0 0; }.onboarding-option input:focus-visible { outline: none; }
.onboarding-option-copy { display: block; }.onboarding-option-title { display: block; font-size: 13px; font-weight: 540; line-height: 1.45; }.onboarding-option-detail { display: block; margin-top: 6px; font-size: 11px; line-height: 1.65; color: #757575; }
[data-onboarding-fields][data-kind='multiple'] .onboarding-options { grid-template-columns: 1fr 1fr; gap: 10px; }[data-onboarding-fields][data-kind='multiple'] .onboarding-option { padding: 17px 14px; }
.onboarding-business-label { display: block; font-size: 11px; margin-top: 32px; color: #6b6b6b; }.onboarding-business-input { display: block; width: 100%; margin-top: 10px; padding: 16px 0; font-size: 23px; color: #1c1c1c; background: transparent; border: 0; border-bottom: 1px solid #a6a6a6; border-radius: 0; }.onboarding-business-input::placeholder { color: #a7a7a7; }.onboarding-business-input:focus-visible { outline: none; border-bottom: 2px solid #333333; }.onboarding-business-input[aria-invalid='true'] { border-bottom-color: #944434; }
.onboarding-error { color: #934732; font-size: 11px; line-height: 1.65; min-height: 18px; margin-top: 13px; }
.onboarding-navigation { display: flex; justify-content: flex-end; align-items: center; gap: 22px; margin-top: 18px; }.onboarding-back { margin-right: auto; padding: 10px 0; color: #5e5e5e; font-size: 11px; background: none; border: 0; }
.onboarding-primary { display: inline-flex; align-items: center; justify-content: space-between; gap: 25px; padding: 15px 19px; min-height: 48px; border: 1px solid #272727; border-radius: 2px; color: #f4f4f4; background: #272727; font-size: 12px; text-decoration: none; line-height: 1.4; cursor: pointer; }.onboarding-primary:hover { background: #171717; border-color: #171717; }.onboarding-secondary { border: 1px solid #acacac; background: transparent; color: #4b4b4b; border-radius: 2px; padding: 14px 16px; min-height: 48px; font-size: 11px; }
.onboarding-small { font-size: 10px; color: #767676; line-height: 1.8; margin-top: 16px; }.onboarding-status:empty { margin-top: 0; }.onboarding-kicker { color: #7d7d7d; font-family: var(--mono); font-size: 9px; line-height: 1.7; letter-spacing: .035em; margin: 0 0 13px; overflow-wrap: anywhere; }
.onboarding-why { margin: 24px 0 25px; padding: 20px; background: #eeeeee; border-left: 2px solid #555555; }.onboarding-why > span { font-family: var(--mono); font-size: 8px; color: #757575; }.onboarding-why p { font-size: 12px; line-height: 1.8; color: #545454; margin-top: 9px; }
.onboarding-plan { padding: 0; margin: 0 0 34px; list-style: none; counter-reset: plan-step; }.onboarding-plan li { position: relative; padding: 19px 0 19px 32px; border-top: 1px solid #d9d9d9; counter-increment: plan-step; }.onboarding-plan li::before { content: '0' counter(plan-step); position: absolute; left: 0; top: 22px; font-family: var(--mono); color: #8d8d8d; font-size: 8px; }.onboarding-plan h4 { margin: 0; font-size: 13px; font-weight: 550; }.onboarding-plan p { color: #6f6f6f; font-size: 11px; line-height: 1.8; margin-top: 7px; }
.onboarding-answers-heading { display: flex; gap: 15px; align-items: baseline; justify-content: space-between; padding-top: 23px; border-top: 1px solid #c4c4c4; }.onboarding-answers-heading h4 { font-size: 13px; font-weight: 550; margin: 0; }.onboarding-answers-heading > span { color: #808080; font-size: 9px; }
.onboarding-summary { margin: 14px 0 25px; }.onboarding-answer { padding: 13px 0; border-bottom: 1px solid #dfdfdf; }.onboarding-answer dt { font-size: 9px; color: #808080; }.onboarding-answer dd { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 5px 0 0; font-size: 11px; line-height: 1.65; }.onboarding-answer-value { min-width: 0; overflow-wrap: anywhere; }.onboarding-edit { border: 0; background: none; padding: 6px 0 6px 10px; color: #444444; text-decoration: underline; font-size: 10px; flex: none; }
.onboarding-scope { font-size: 10px; line-height: 1.85; color: #7d7d7d; }.onboarding-keep { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 25px; }.onboarding-start-again { border: 0; padding: 10px 0; background: none; color: #808080; text-decoration: underline; font-size: 10px; margin-top: 16px; }
.onboarding-fallback > p:not(.onboarding-kicker) { font-size: 13px; color: #717171; line-height: 1.8; margin-block: 18px 24px; }.onboarding-fallback > .onboarding-small { font-size: 10px !important; margin-bottom: 0 !important; }
.onboarding-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.onboarding-context { padding-bottom: 24px; margin-bottom: 22px; border-bottom: 1px solid #d2d2d2; }
.onboarding-context .onboarding-small { margin: 0 0 12px; }
.onboarding-copy-fallback { margin-top: 22px; }
.onboarding-copy-fallback label { display: block; margin-bottom: 10px; }
.onboarding-copy-text { width: 100%; padding: 16px; border: 1px solid #8a8a8a; border-radius: 18px; background: #f5f5f5; color: #303030; font: 14px/1.6 var(--sans, sans-serif); resize: vertical; }
.onboarding-copy-text:focus-visible { outline: 2px solid #555; outline-offset: 3px; }
.onboarding-contact a { color: #353535; text-underline-offset: 3px; overflow-wrap: anywhere; }
@media (max-width: 1000px) { .onboarding-section { gap: 43px; grid-template-columns: .8fr 1.2fr; }.onboarding-intro h2 { font-size: 54px; }.onboarding-panel { padding: 28px; } }
@media (max-width: 760px) { .onboarding-section { grid-template-columns: 1fr; gap: 35px; padding-block: 65px; }.onboarding-intro h2 { font-size: 54px; margin-block: 24px 22px; }.onboarding-intro > p:not(.eyebrow) { font-size: 13px; max-width: 46ch; }.onboarding-promise { margin-top: 22px; padding-top: 20px; max-width: none; }.onboarding-intro > .onboarding-privacy { margin-top: 22px; }.onboarding-panel { padding: 26px; }.onboarding-form h3 { font-size: 28px; }.onboarding-option { padding: 16px; }.onboarding-meter { margin-bottom: 25px; }.onboarding-answers-heading { align-items: start; flex-direction: column; gap: 7px; } }
@media (max-width: 390px) { .onboarding-panel { padding: 21px; }.onboarding-topline { font-size: 7px; gap: 8px; }.onboarding-intro h2 { font-size: 49px; }.onboarding-option { padding: 15px 13px; }.onboarding-option-title { font-size: 12px; }.onboarding-option-detail { font-size: 10px; }.onboarding-primary { padding-inline: 16px; font-size: 11px; }.onboarding-keep { align-items: stretch; flex-direction: column; }.onboarding-keep > * { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .onboarding-meter > span, .onboarding-option { transition: none; } }
