/* Configuration intake only. Recommendation content belongs to the later result page. */
.config-page {
  color-scheme: light;
  background: #f4f7fb;
  color: #15253e;
}

.config-page main { overflow: clip; }
.config-page .config-container { width: min(calc(100% - 48px), 1120px); margin-inline: auto; }
.config-page [data-shared-header] { height: 0; }
.config-fallback-footer { margin: 0; padding: 36px 24px; background: #0e1a2c; color: #d8e4f4; text-align: center; }

.config-hero {
  position: relative;
  isolation: isolate;
  padding: 138px 0 142px;
  overflow: hidden;
  background:
    radial-gradient(ellipse 42% 95% at 91% 53%, rgba(94, 49, 173, .36), transparent 72%),
    radial-gradient(ellipse 42% 83% at 5% 100%, rgba(22, 105, 213, .24), transparent 76%),
    linear-gradient(115deg, #0a172a 3%, #10213a 58%, #1a1b3f 100%);
  color: #f7faff;
}
.config-hero::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background-image: linear-gradient(#8ca4d10c 1px, transparent 1px), linear-gradient(90deg, #8ca4d10c 1px, transparent 1px);
  background-size: 62px 62px;
  mask-image: linear-gradient(90deg, transparent 8%, #000 100%);
  content: '';
  pointer-events: none;
}
.config-breadcrumb { display: flex; align-items: center; gap: 10px; margin-bottom: 29px; color: #b7c9e3; font-size: 13px; }
.config-breadcrumb a { text-decoration: none; transition: color 180ms; }
.config-breadcrumb a:hover { color: #fff; }
.config-breadcrumb [aria-current] { color: #f7faff; }
.config-eyebrow { margin: 0 0 13px; color: #a9caff; font-size: 12px; font-weight: 650; letter-spacing: .13em; }
.config-hero h1 { max-width: 900px; margin: 0; font-size: clamp(34px, 4.1vw, 59px); font-weight: 660; line-height: 1.23; letter-spacing: -.048em; }
.config-title-dot { color: #8c7cff; }
.config-hero-lead { max-width: 760px; margin: 19px 0 0; color: #cedaf0; font-size: clamp(15px, 1.4vw, 17px); line-height: 1.75; }
.config-flow { display: flex; align-items: center; gap: 16px; margin: 39px 0 0; padding: 0; list-style: none; color: #aabbd2; font-size: 13px; }
.config-flow li { display: inline-flex; align-items: center; gap: 9px; white-space: nowrap; }
.config-flow li[aria-current] { color: #fff; font-weight: 630; }
.config-flow-number { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border: 1px solid #ffffff5c; border-radius: 50%; font-size: 10px; font-variant-numeric: tabular-nums; }
.config-flow li[aria-current] .config-flow-number { border-color: #91bfff; background: #2364ca; }
.config-flow-line { width: 36px; height: 1px; margin-right: 8px; background: #7890b5a8; }

.config-workspace { padding: 0 0 108px; background: #f4f7fb; }
.config-form-card { position: relative; z-index: 1; margin-top: -88px; padding: clamp(28px, 4.3vw, 58px); border: 1px solid #d9e4f1; border-radius: 20px; background: #fff; box-shadow: 0 24px 70px #16315d12; }
.config-card-heading { display: flex; align-items: start; justify-content: space-between; gap: 24px; margin-bottom: 34px; }
.config-card-eyebrow { margin: 0 0 8px; color: #0756d8; font-size: 11px; font-weight: 700; letter-spacing: .12em; }
.config-card-heading h2 { margin: 0; color: #10223d; font-size: clamp(26px, 2.6vw, 34px); line-height: 1.28; letter-spacing: -.04em; }
.config-card-heading p:last-child { margin: 10px 0 0; color: #64748b; font-size: 14px; line-height: 1.65; }
.config-required-note { flex: 0 0 auto; margin-top: 30px; color: #64748b; font-size: 12px; white-space: nowrap; }
.config-required-note span, .config-field label > span { color: #e05255; font-style: normal; }

.config-fieldset { min-width: 0; margin: 0; padding: 26px 0 31px; border: 0; border-top: 1px solid #dfe7f2; }
.config-fieldset legend { display: flex; align-items: center; gap: 11px; width: 100%; padding: 0 0 19px; color: #172942; font-size: 17px; font-weight: 650; }
.config-group-number { display: inline-flex; align-items: center; justify-content: center; width: 29px; height: 29px; border: 1px solid #b7d1f7; border-radius: 7px; background: #edf4ff; color: #0d5bd2; font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; }
.config-group-help { margin: -8px 0 18px; color: #64748b; font-size: 13px; line-height: 1.6; }
.config-fields { display: grid; gap: 18px 20px; }
.config-fields-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.config-fields-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.config-secondary-row { margin-top: 21px; }
.config-field { min-width: 0; }
.config-field label { display: block; margin-bottom: 9px; color: #20344e; font-size: 14px; font-weight: 600; }
.config-field label em { margin-left: 5px; color: #64748b; font-size: 12px; font-style: normal; font-weight: 400; }
.config-field input, .config-field select { display: block; width: 100%; min-width: 0; height: 54px; padding: 0 15px; border: 1px solid #bfcde0; border-radius: 9px; outline: 0; background: #fff; color: #10243f; font: inherit; font-size: 15px; transition: border-color 180ms, box-shadow 180ms; }
.config-field input::placeholder { color: #7b8da3; }
.config-field select { cursor: pointer; }
.config-field input:hover, .config-field select:hover { border-color: #7ea6da; }
.config-field input:focus, .config-field select:focus { border-color: #1768dd; box-shadow: 0 0 0 4px #1768dd1b; }
.config-field [aria-invalid="true"] { border-color: #ba3542; }
.config-field [aria-invalid="true"]:focus { box-shadow: 0 0 0 4px #ba35421b; }
.config-unit-input { position: relative; }
.config-unit-input input { padding-right: 52px; }
.config-unit-input > span { position: absolute; top: 50%; right: 14px; transform: translateY(-50%); color: #63758c; font-size: 13px; pointer-events: none; }
.config-field-hint { display: block; margin-top: 6px; color: #62758c; font-size: 12px; line-height: 1.5; }
.config-field-error { display: block; margin-top: 6px; color: #a22635; font-size: 12px; line-height: 1.45; }
.config-field-error:empty { display: none; }
.config-contact-group { padding-bottom: 37px; }

.config-submit-area { display: flex; align-items: center; justify-content: space-between; gap: 24px; border-top: 1px solid #dfe7f2; padding-top: 27px; }
.config-submit-explainer { margin: 0; color: #20354e; font-size: 13px; font-weight: 600; line-height: 1.6; }
.config-prototype-note { max-width: 580px; margin: 5px 0 0; color: #677990; font-size: 12px; line-height: 1.6; }
.config-submit { display: inline-flex; align-items: center; justify-content: center; gap: 22px; min-height: 54px; flex: 0 0 auto; padding: 0 25px; border: 1px solid #6a66e5; border-radius: 10px; background: linear-gradient(110deg, #176fea, #873cf2); box-shadow: 0 12px 25px #455fd62a; color: #fff; font-size: 15px; font-weight: 650; cursor: pointer; transition: transform 180ms, box-shadow 180ms, filter 180ms; }
.config-submit:hover { transform: translateY(-2px); box-shadow: 0 16px 29px #455fd638; filter: brightness(1.06); }
.config-submit:focus-visible { outline: 3px solid #176fea; outline-offset: 3px; }
.config-form-status { margin: 16px 0 0; color: #a22635; font-size: 13px; line-height: 1.6; }
.config-form-status:empty { display: none; }

.config-flow-dialog { width: min(510px, calc(100% - 32px)); max-height: calc(100dvh - 32px); padding: 34px; border: 1px solid #d9e4f1; border-radius: 18px; background: #fff; color: #172942; box-shadow: 0 30px 90px #020c25a8; }
.config-flow-dialog::backdrop { background: #071426a8; backdrop-filter: blur(6px); }
.config-dialog-close { position: absolute; top: 13px; right: 13px; width: 44px; height: 44px; border: 0; border-radius: 8px; background: transparent; color: #667990; font-size: 26px; cursor: pointer; }
.config-dialog-close:hover { background: #edf3fb; }
.config-dialog-eyebrow { margin: 0 0 8px; color: #0756d8; font-size: 11px; font-weight: 700; letter-spacing: .12em; }
.config-flow-dialog h2 { margin: 0 26px 17px 0; font-size: clamp(22px, 3vw, 27px); line-height: 1.35; }
.config-flow-dialog p:not(.config-dialog-eyebrow) { color: #53667f; font-size: 14px; line-height: 1.7; }
.config-flow-dialog .config-dialog-note { padding: 13px 15px; border-radius: 8px; background: #eef4fc; }
.config-dialog-confirm { min-height: 46px; margin-top: 6px; padding: 0 20px; border: 0; border-radius: 8px; background: linear-gradient(110deg, #176fea, #873cf2); color: #fff; font-weight: 650; cursor: pointer; }

@media (max-width: 820px) {
  .config-hero { padding-block: 126px 130px; }
  .config-form-card { padding: 32px; }
  .config-submit-area { align-items: stretch; flex-direction: column; }
  .config-submit { align-self: flex-start; }
}
@media (max-width: 600px) {
  .config-page .config-container { width: min(calc(100% - 32px), 1120px); }
  .config-hero { padding: 110px 0 116px; }
  .config-breadcrumb { margin-bottom: 25px; }
  .config-hero h1 { font-size: clamp(30px, 8vw, 39px); }
  .config-hero-lead { margin-top: 16px; font-size: 14px; }
  .config-flow { gap: 7px; margin-top: 27px; font-size: 11px; }
  .config-flow li { gap: 6px; }
  .config-flow-number { width: 25px; height: 25px; }
  .config-flow-line { width: 14px; margin-right: 2px; }
  .config-workspace { padding-bottom: 70px; }
  .config-form-card { margin-top: -70px; padding: 25px 20px; border-radius: 15px; }
  .config-card-heading { margin-bottom: 25px; }
  .config-card-heading p:last-child { font-size: 13px; }
  .config-required-note { margin-top: 4px; }
  .config-fields-two { grid-template-columns: 1fr; }
  .config-fields { gap: 17px; }
  .config-fields-three { gap: 8px; }
  .config-fieldset { padding-block: 22px 26px; }
  .config-fieldset legend { padding-bottom: 14px; }
  .config-secondary-row { margin-top: 17px; }
  .config-submit { width: 100%; align-self: stretch; }
  .config-flow-dialog { padding: 28px 22px; }
}
@media (max-width: 400px) {
  .config-hero h1 { letter-spacing: -.058em; }
  .config-card-heading { display: block; }
  .config-required-note { display: block; margin-top: 12px; }
  .config-fields-three .config-field label { font-size: 13px; }
  .config-fields-three .config-field input { padding-left: 9px; padding-right: 24px; font-size: 14px; }
  .config-fields-three .config-unit-input > span { right: 7px; }
  .config-fields-three .config-field input::placeholder { color: transparent; }
}
@media (prefers-reduced-motion: reduce) {
  .config-submit:hover { transform: none; }
}