.btf-recommender {
  --btf-primary: #1D9E75;
  --btf-secondary: #0F6E56;
  --btf-bg: #FFFFFF;
  --btf-text: #1A1714;
  --btf-hero-text: #1A1714;
  --btf-text-sub: #6B5D50;
  --btf-text-hint: #9B8E82;
  font-family: inherit;
  max-width: 720px;
  margin: 0 auto;
  color: var(--btf-text);
  box-sizing: border-box;
}
.btf-recommender * { 
  box-sizing: border-box; 
}

.btf-hero { 
  text-align: center; padding: 40px 16px; 
}
.btf-eyebrow {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--btf-primary);
  margin: 0 0 14px;
}
.btf-hero-title { 
  font-size: clamp(26px,4vw,38px); 
  font-weight: 600; 
  margin: 0 0 14px; 
  line-height: 1.2; 
  color: var(--btf-hero-text); 
}
.btf-hero-subtitle { 
  font-size: 15px; 
  color: var(--btf-text); 
  max-width: 440px; 
  margin: 0 auto 28px; 
  line-height: 1.7; 
}

.btf-btn {
  border: none;
  cursor: pointer;
  font-family: inherit;
  font-weight: 600;
  letter-spacing: 0.04em;
  transition: opacity 0.2s, transform 0.15s;
}
.btf-btn-primary {
  background: var(--btf-primary);
  color: var(--btf-bg);
  padding: 14px 32px;
  font-size: 14px;
  border-radius: 4px;
}
.btf-btn-primary:hover { 
  opacity: 0.9; 
  transform: translateY(-1px); 
}
.btf-btn-primary:disabled { 
  opacity: 0.35; 
  cursor: not-allowed; 
  transform: none; 
}

.btf-btn-secondary {
  background: transparent;
  color: var(--btf-text-sub);
  border: 1px solid var(--btf-text-hint);
  padding: 13px 24px;
  font-size: 13px;
  border-radius: 4px;
  cursor: pointer;
}

.btf-quiz-wrapper { 
  padding: 20px 16px 48px; 
}
.btf-progress-header { 
  display: flex; 
  justify-content: space-between; 
  font-size: 11px; 
  letter-spacing: 0.1em; 
  text-transform: uppercase; 
  color: var(--btf-text); 
  margin-bottom: 8px; 
}
.btf-progress-track { 
  height: 4px; 
  background: transparent; 
  border-radius: 99px; 
  margin-bottom: 36px; 
  position: relative;
  overflow: hidden; 
}
.btf-progress-track::before {
  background: var(--btf-primary); 
  content: '';
  height: 100%;
  opacity: 0.25;
  position: absolute;
  width: 100%;
}
.btf-progress-fill { 
  height: 4px; 
  background: var(--btf-primary); 
  border-radius: 99px; 
  transition: width 0.4s ease; 
}

.btf-question-area { 
  animation: btf-fade 0.35s ease both; 
}
@keyframes btf-fade { 
  from { 
    opacity:0; 
    transform: translateY(14px); 
  } to {     
    opacity:1; 
    transform: translateY(0); 
  } 
}

.btf-question-category { 
  font-size: 11px; 
  letter-spacing: 0.16em; 
  text-transform: uppercase; 
  color: var(--btf-primary); 
  margin: 0 0 10px; font-weight: 600; }
.btf-question-text { 
  font-size: clamp(20px,3vw,28px); 
  font-weight: 600; 
  margin: 0 0 6px; 
  line-height: 1.3; 
  color: var(--btf-hero-text); 
}
.btf-question-hint { 
  font-size: 13px; 
  color: var(--btf-text-hint); 
  margin: 0 0 28px; }

.btf-options-grid { 
  display: grid; 
  grid-template-columns: repeat(auto-fill,minmax(200px,1fr)); 
  gap: 10px; margin-bottom: 32px; 
}
.btf-option-card {
  background: var(--btf-bg);
  border: 1px solid var(--btf-text-hint);
  border-radius: 6px;
  padding: 16px;
  cursor: pointer;
  text-align: left;
  transition: border-color 0.15s, transform 0.15s;
}
.btf-option-card:hover { 
  border-color: var(--btf-primary); 
  transform: translateY(-1px); 
}
.btf-option-card.btf-selected { 
  border-color: var(--btf-primary); 
  border-width: 2px; 
  background: color-mix(in srgb, var(--btf-primary) 8%, var(--btf-bg)); 
}
.btf-option-tag { 
  display: inline-block; 
  font-size: 9px; 
  letter-spacing: 0.12em; 
  text-transform: uppercase; 
  color: var(--btf-bg); 
  background: var(--btf-text); 
  padding: 3px 8px; 
  border-radius: 3px; 
  margin-bottom: 8px; 
}
.btf-option-title { 
  font-size: 15px; 
  font-weight: 600; 
  margin: 0 0 4px; }
.btf-option-desc { 
  font-size: 12px; 
  color: var(--btf-text-hint); 
  margin: 0; 
  line-height: 1.4; 
}

.btf-nav-row { 
  display: flex; 
  gap: 10px; 
  align-items: center; 
}

.btf-loading-area { 
  text-align: center; 
  padding: 64px 16px; }
.btf-loading-ring { 
  width: 36px; 
  height: 36px; 
  border: 2px solid var(--btf-text-hint); 
  border-top-color: var(--btf-primary); 
  border-radius: 50%; 
  animation: btf-spin 0.8s linear infinite; 
  margin: 0 auto 18px; 
}
@keyframes btf-spin { 
  to { 
    transform: rotate(360deg); 
  } 
}
.btf-loading-text { 
  font-size: 18px; 
  font-weight: 600; 
  margin: 0 0 6px; 
}
.btf-loading-sub { 
  font-size: 13px; 
  color: var(--btf-text-hint); 
  margin: 0; 
}

.btf-result-hero { 
  background: var(--btf-primary); 
  border: 1px solid var(--btf-text-hint); 
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  color: var(--btf-text); 
  padding: 32px;  
}
.btf-result-hero .btf-eyebrow { 
  color: var(--btf-primary); 
}
.btf-result-name { 
  font-size: clamp(24px,4vw,34px); 
  color: var(--btf-bg); 
  font-weight: 700; 
  margin: 0 0 4px; 
  line-height: 1.15; 
}
.btf-result-type { 
  font-size: 13px;
  color: var(--btf-bg); margin: 0 0 20px; }
.btf-result-stats { 
  display: flex; 
  gap: 24px; 
  flex-wrap: wrap; 
  padding-top: 18px; 
  border-top: 1px solid var(--btf-bg); 
}
.btf-stat-label { 
  font-size: 9px; 
  letter-spacing: 0.14em; 
  text-transform: uppercase; 
  color: var(--btf-text-hint); 
  margin-bottom: 4px; 
}
.btf-stat-value { 
  font-size: 16px; 
  color: var(--btf-bg); 
  font-weight: 600; 
}

.btf-result-body { 
  background: var(--btf-bg); 
  border: 1px solid var(--btf-text-hint); 
  border-top: none; 
  padding: 28px 32px; 
}
.btf-result-section { 
  margin-bottom: 28px; 
}
.btf-result-section:last-child { 
  margin-bottom: 0; 
}
.btf-result-section-label { 
  font-size: 10px; 
  letter-spacing: 0.16em; 
  text-transform: uppercase; 
  color: var(--btf-primary); 
  margin: 0 0 10px; 
  font-weight: 600; 
}
.btf-result-why { 
  font-size: 14px; 
  color: var(--btf-text); 
  line-height: 1.75; 
  margin: 0;
}

.btf-also-grid { 
  display: grid; 
  grid-template-columns: repeat(auto-fill,minmax(180px,1fr)); 
  gap: 10px; 
}
.btf-also-card { 
  background: var(--btf-text); 
  border-radius: 6px; 
  padding: 14px; 
}
.btf-also-name { 
  font-size: 13px; 
  color: var(--btf-bg); 
  font-weight: 600; margin: 0 0 4px; 
}
.btf-also-note { 
  font-size: 11px; 
  color: var(--btf-bg); 
  margin: 0; 
  line-height: 1.4; 
}

.btf-capture-section { 
  background: var(--btf-bg);
  border: 1px solid var(--btf-text-hint);
  border-top: 0;
  padding: 32px; 
  border-radius: 0 0 8px 8px; 
}
.btf-capture-title {
  color: var(--btf-text); 
  font-size: 20px; 
  font-weight: 700; 
  margin: 0 0 6px; }
.btf-capture-sub { 
  color: var(--btf-text-hint); 
  font-size: 13px; 
  margin: 0 0 22px; 
  line-height: 1.6; 
}
.btf-form-grid { 
  display: grid; 
  grid-template-columns: 1fr 1fr; 
  gap: 10px; 
  margin-bottom: 10px; 
}
.btf-form-full { 
  margin-bottom: 10px; 
}
.btf-form-grid input, 
.btf-form-full input {
  width: 100%;
  background: var(--btf-bg);
  border: 1px solid  var(--btf-text);
  color: var(--btf-text);
  padding: 13px 14px;
  font-size: 13px;
  border-radius: 4px;
  font-family: inherit;
  outline: none;
}
.btf-form-grid input::placeholder, 
.btf-form-full input::placeholder { 
  color: var(--btf-text-hint); 
}
.btf-form-grid input:focus, 
.btf-form-full input:focus { 
  border-color: var(--btf-primary); 
}
.btf-consent-row { 
  display: flex; 
  gap: 8px; 
  align-items: flex-start; 
  margin: 14px 0 20px; 
}
.btf-consent-row input { 
  margin-top: 3px; 
  flex-shrink: 0; 
}
.btf-consent-row label { 
  font-size: 11px; 
  color: var(--btf-text-hint); 
  line-height: 1.5; 
}
.btf-btn-submit { 
  width: 100%; 
  background: var(--btf-primary); 
  color: var(--btf-bg); 
  padding: 15px; 
  font-size: 13px; 
  border-radius: 4px; 
}
.btf-btn-submit:hover { 
  opacity: 0.92; 
}
.btf-form-error { 
  color: #ff8c8c; 
  font-size: 12px; 
  margin-top: 10px; 
}

.btf-success-area { 
  background: var(--btf-bg); 
  border: 1px solid var(--btf-text-hint); 
  border-top: none; 
  padding: 48px 32px; 
  text-align: center; }
.btf-success-mark { 
  width: 40px; 
  height: 40px; 
  border: 1px solid var(--btf-primary); 
  border-radius: 50%; display: flex; 
  align-items: center; 
  justify-content: center; 
  margin: 0 auto 18px; 
  color: var(--btf-primary); 
  font-size: 16px; 
}
.btf-success-title { 
  font-size: 22px; 
  font-weight: 700; 
  margin: 0 0 10px; 
}
.btf-success-body { 
  font-size: 13px; 
  color: var(--btf-text-sub); 
  max-width: 380px; 
  margin: 0 auto; 
  line-height: 1.7; 
}

.btf-restart-row { 
  text-align: center; margin-top: 18px; }
.btf-btn-restart { 
  background: none; 
  border: none; 
  color: var(--btf-text-hint); 
  font-size: 12px; 
  text-decoration: underline; 
  cursor: pointer; 
  font-family: inherit; 
}

.btf-disclaimer { 
  font-size: 11px; 
  color: var(--btf-text); 
  text-align: center; 
  max-width: 540px; 
  margin: 24px auto 0; 
  line-height: 1.6; 
  padding: 0 16px; 
}

@media (max-width: 600px) {
  .btf-options-grid { 
    grid-template-columns: 1fr; 
  }
  .btf-form-grid { 
    grid-template-columns: 1fr; 
  }
  .btf-result-hero, 
  .btf-result-body, 
  .btf-capture-section, 
  .btf-success-area { 
    padding: 22px 18px; 
  }
  .btf-result-stats { 
    gap: 16px; 
  }
}