.sbf-app {
 font-family: Inter, Arial, sans-serif;
}

.sbf-shell {
 padding: max(8px, env(safe-area-inset-top)) clamp(18px, 5vw, 44px) max(12px, env(safe-area-inset-bottom));
}

.sbf-header {
 min-height: 54px;
}

.sbf-logo {
 width: clamp(160px, 43vw, 270px);
 max-height: 62px;
}

.sbf-call-icon {
 width: 46px;
 height: 46px;
}

.sbf-progress-wrap {
 padding: 5px 0 3px;
}

.sbf-progress-label {
 margin-bottom: 5px;
 font-size: clamp(13px, 1.8vh, 17px);
 font-weight: 500;
}

.sbf-progress i {
 height: 6px;
}

.sbf-step {
 padding: 2px 0;
}

.sbf-visual {
 position: relative;
 height: clamp(124px, 24vh, 240px);
 margin-bottom: 9px;
 overflow: hidden;
}

.sbf-visual img {
 position: absolute !important;
 inset: 0 !important;
 display: block !important;
 width: 100% !important;
 height: 100% !important;
 max-width: 100% !important;
 max-height: 100% !important;
 object-fit: contain !important;
}

.sbf-step-contact .sbf-visual {
 height: clamp(122px, 18vh, 188px);
 margin-bottom: 10px;
}

.sbf-eyebrow {
 min-height: 30px;
 padding: 5px 19px;
 margin-bottom: 10px;
 background: #bcf2ff;
 font-size: clamp(11px, 1.55vh, 15px);
 font-weight: 600;
}

.sbf-copy h1 {
 font-size: clamp(25px, 4.25vh, 46px);
 font-weight: 600 !important;
 letter-spacing: -.035em;
 line-height: 1.06;
}

.sbf-copy p {
 margin-top: 8px;
 font-size: clamp(13px, 1.9vh, 19px);
}

.sbf-copy h2 {
 margin-top: 12px;
 font-size: clamp(15px, 2.15vh, 21px);
 font-weight: 600 !important;
}

.sbf-highlights {
 gap: 7px 14px;
 margin-top: 9px;
 font-size: clamp(11px, 1.6vh, 15px);
 font-weight: 500;
}

.sbf-choices {
 gap: 9px;
 margin-top: 13px;
}

.sbf-choice {
 min-height: clamp(54px, 7.2vh, 70px);
 grid-template-columns: 42px minmax(0, 1fr) 20px;
 gap: 10px;
 padding: 8px 16px;
 border-radius: 14px;
}

.sbf-choice-mark {
 width: 40px;
 height: 40px;
 color: var(--sbf-accent);
 border: 0;
 border-radius: 0;
}

.sbf-choice-mark::before {
 display: none;
}

.sbf-option-icon {
 width: 38px;
 height: 38px;
 fill: none;
 stroke: currentColor;
 stroke-width: 2.2;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.sbf-choice strong {
 font-size: clamp(14px, 2vh, 19px);
 font-weight: 600;
}

.sbf-choice small {
 margin-top: 2px;
 font-size: clamp(11px, 1.55vh, 14px);
}

.sbf-footer {
 min-height: 44px;
 padding-top: 6px;
}

.sbf-back,
.sbf-phone-line {
 font-size: clamp(12px, 1.65vh, 16px);
}

.sbf-phone-line {
 padding-top: 10px;
}

.sbf-form {
 gap: 7px;
 margin-top: 10px;
}

.sbf-form label {
 min-height: clamp(49px, 6.5vh, 62px);
 grid-template-columns: 30px 1fr;
 padding: 0 16px;
}

.sbf-form label svg {
 width: 24px;
 height: 24px;
}

.sbf-form input {
 font-size: clamp(14px, 1.9vh, 18px);
}

.sbf-submit {
 min-height: clamp(58px, 7.4vh, 72px);
 padding: 0 22px;
 border-radius: 15px;
 font-size: clamp(21px, 2.8vh, 27px) !important;
 font-weight: 600 !important;
}

.sbf-privacy,
.sbf-form-status {
 font-size: clamp(10px, 1.4vh, 13px);
}

.sbf-privacy {
 display: flex;
 align-items: center;
 justify-content: center;
 gap: 5px;
}

.sbf-privacy svg {
 width: 14px;
 height: 14px;
 flex: 0 0 14px;
 fill: none;
 stroke: var(--sbf-accent);
 stroke-width: 1.9;
 stroke-linecap: round;
 stroke-linejoin: round;
}

/* After completion, show only the confirmation message — no previous step content. */
.sbf-app.sbf-is-complete .sbf-shell {
 grid-template-rows: minmax(0, 1fr);
}

.sbf-step-contact.is-submitted {
 align-content: center;
}

.sbf-step-contact.is-submitted .sbf-success {
 width: 100%;
 max-width: 440px;
 padding: 0 18px;
}

@media (max-height: 720px) {
 .sbf-shell {
  padding-top: 8px;
  padding-bottom: 7px;
 }

 .sbf-header {
  min-height: 45px;
 }

 .sbf-logo {
  max-height: 48px;
 }

 .sbf-call-icon {
  width: 40px;
  height: 40px;
 }

 .sbf-visual {
  height: 17vh;
 }

 .sbf-step-contact .sbf-visual {
  height: 15vh;
 }

 .sbf-copy h1 {
  font-size: clamp(22px, 4.5vh, 32px);
 }

 .sbf-copy p,
 .sbf-copy h2,
 .sbf-highlights {
  margin-top: 4px;
 }

 .sbf-choices,
 .sbf-form {
  gap: 5px;
  margin-top: 6px;
 }

 .sbf-choice {
  min-height: 48px;
 }

 .sbf-form label {
  min-height: 43px;
 }

 .sbf-submit {
  min-height: 50px;
 }

 .sbf-footer {
  min-height: 37px;
 }
}

@media (max-width: 430px) {
 .sbf-shell {
  padding-left: 17px;
  padding-right: 17px;
 }

 .sbf-choice {
  grid-template-columns: 38px minmax(0, 1fr) 18px;
  padding-left: 11px;
  padding-right: 11px;
 }

 .sbf-choice-mark,
 .sbf-option-icon {
  width: 35px;
  height: 35px;
 }
}
