/* Global Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Roboto', Arial, sans-serif;
    line-height: 1.6;
    color: #333;
    background-color: #fff;
}

.container {
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
}

h1, h2, h3 {
    color: #1e3a5f;
    margin-bottom: 20px;
}

h2 {
    font-size: 2rem;
    margin: 30px 0;
}

p {
    margin-bottom: 15px;
}

img {
    max-width: 100%;
    height: auto;
}

.bold {
    font-weight: bold;
}

/* Header */
header {
    background-color: white;
    padding: 5px 0;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo img {
    height: 70px;
}

.rating {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.stars {
    color: #f8a100;
    font-size: 1rem;
    letter-spacing: 2px;
}
.rating p {margin-bottom: 0;}
.contact-info {
    text-align: right; position:relative; line-height: 18px; padding-right: 10px;
}

.contact-info p {
    margin: 0;
    font-size: 0.9rem;
}
.phone-icon {display: none;}
.phone-icon svg {width: 16px; fill: rgb(45, 121, 197);}
.phone-number {
    display: inline-block;
    color: #f8a100;
    text-decoration: none;
    font-weight: bold;
    margin-top: 0px;
}

/* Progress Bar */
.progress-container {display: flex; justify-content: space-between; align-items: center; width: 100%; background-color: rgb(235, 241, 250); border: none;}
.item-progress {display: flex; line-height: 34px; font-weight: 500; padding: 2px 12px; border-right: solid 1px rgb(233, 137, 47);}
.item-progress:last-child {border:none;}
.item-progress.active {color: #fff; position:relative}
.item-progress span {position: relative; z-index: 2;}
.progress-container .progress-bar-container {display: flex; width: 100%; height: 38px; align-items: center; flex: 1 1 0%; position: relative; font-size: 13px;}
.step-detail {background: #000; color: #fff; font-size: 13px; padding: 0 12px; line-height: 38px;}

.progress-topbar {z-index:0; width:0; background:rgb(233, 137, 47); position: absolute; left: 0; top: 0; height: 100%; transition: ease all 0.5s;}
.step1 .progress-topbar {width:20%}
.active.complete .progress-topbar {width:100%}
.active.half .progress-topbar {width:50%}

.progress-mobile {width:10%; background:rgb(233, 137, 47); position: absolute;  left: 0; top: 0; height: 100%; display: none;}
.back-button {
    display: flex;
    align-items: center;
    background-color:#09477e;
    color: #fff;
    border: none;
    padding: 2px 12px;
    border-radius: 0px;
    cursor: pointer;
    font-size: 0.9rem; line-height: 34px;
}

.arrow {
    margin-right: 5px;
}

.progress-steps {
    display: flex;
    flex: 1;
    justify-content: center;
    gap: 20px;
}


/* Main Content */
main {
    padding: 0;
}

.main-container {
    display: flex;
    gap: 0px; height: calc(100vh - 87px);
}

.main-content {background-color: white; padding: 0px; width: calc(100vw - 320px);}
.main-content .inner-cont {padding: 24px; display: flex; flex-direction: column; min-height: calc(100vh - 150px);}
.home-cont {max-width: 1000px; width:100%; margin:25px auto; flex: 1 1 auto; flex-direction: column; justify-content: center; align-items: center;}

/* Tighten the "Your details" / spouse-details forms so they don't sprawl across
   the wide main-content area on desktop. The right column on most rows is empty
   anyway — capping the form width makes the empty space visually symmetric. */
.home-cont form.step-6,
.home-cont form.step-6b,
.home-cont form.step-6c {
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
}
.main-content h2 {
    text-align: center;
    margin-top: 0;          /* zero out browser default to tighten spacing above heading */
    margin-bottom: 40px;
}

/* Benefits Section */
.benefits {
    display: flex;
    flex-direction: column;
    gap: 30px;
    margin-bottom: 40px; max-width: 500px; margin: 0 auto;
}

.benefit {
    display: flex;
    align-items: center;
    gap: 10px;
}

.benefit-icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 2px solid #f8a100;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.benefit-icon img {
    width: 30px;
    height: 30px;
}

.benefit-text p {
    font-size: 16px; font-weight: 500;
    margin: 0;
}

/* Continue Button */
.continue-button {display: block; width: 280px; background-color: #f16e16; color: white;
    border: none;
    padding: 14px 15px;
    border-radius: 5px;
    font-size: 1.2rem;
    font-weight: bold;
    cursor: pointer;
    margin: 30px auto;
    transition: background-color 0.3s;
}

.continue-button:hover {
    background-color: #f8a100;
}
.button-logos {display:flex; justify-content:space-between;align-items: center; flex-wrap: wrap;gap: 20px;}
.button-logos .continue-button {display: inline-block;}
/* Insurance Logos */
.insurance-logos {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 40px;
}

.insurance-logos img {
    height: 35px;
    opacity: 0.95; color: transparent;
    transition: opacity 0.3s;
}

.insurance-logos img:hover {
    opacity: 1;
}
.navigation-bar {width:100%;}
.top-navigation-bar {background: #073b91; width: 100%; padding: 15px 24px; vertical-align: top;}
.top-navigation-bar .top-nav-text, .top-navigation-bar img {display: inline-block; vertical-align: top;}
.top-navigation-bar .top-nav-text {line-height: 24px;}
.top-navigation-bar .top-nav-text h5 {color:#e9892f; font-size: 20px; margin-bottom: 0;}
.top-navigation-bar .top-nav-text p {font-size: 18px; font-weight: bold; color: #fff; margin-bottom: 0;}
.bottom-navigation-bar {border-top: 1px solid #b9c6db; padding:12px 0;background: linear-gradient(0deg, rgba(213, 221, 233, 0.2) 0%, rgba(213, 221, 233, 0.2) 100%), #fff;}
.bottom-navigation-bar .steps-cont {display: flex; justify-content: space-between; align-items: start; max-width: 483px; width: 100%; margin: 0 auto;}
.bottom-navigation-bar .steps-cont .step {width:100px; text-align: center;}
.bottom-navigation-bar .steps-cont .step h6 {position:relative; font-size: 14px; color: #111; width: 96px; border-top: solid 2px #f7d3b2; padding: 3px 0 0; margin: 0 auto;}
.bottom-navigation-bar .steps-cont .step h6.active:before {position: absolute; content: ''; height: 2px; left: 0; top: -2px; background: #e9892f; width: 5%;}
.bottom-navigation-bar .steps-cont .step p {font-size: 12px; color: #000; padding: 2px 0; margin: 0;}


.lds-roller {
    /* change color here */
    color: #e01010
  }
  .lds-roller,
  .lds-roller div,
  .lds-roller div:after {
    box-sizing: border-box;
  }
  .lds-roller {
    display: block; margin: 0 auto;
    position: relative;
    width: 80px;
    height: 80px;
  }
  .lds-roller div {
    animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    transform-origin: 40px 40px;
  }
  .lds-roller div:after {
    content: " ";
    display: block;
    position: absolute;
    width: 7.2px;
    height: 7.2px;
    border-radius: 50%;
    background: currentColor;
    margin: -3.6px 0 0 -3.6px;
  }
  .lds-roller div:nth-child(1) {
    animation-delay: -0.036s;
  }
  .lds-roller div:nth-child(1):after {
    top: 62.62742px;
    left: 62.62742px;
  }
  .lds-roller div:nth-child(2) {
    animation-delay: -0.072s;
  }
  .lds-roller div:nth-child(2):after {
    top: 67.71281px;
    left: 56px;
  }
  .lds-roller div:nth-child(3) {
    animation-delay: -0.108s;
  }
  .lds-roller div:nth-child(3):after {
    top: 70.90963px;
    left: 48.28221px;
  }
  .lds-roller div:nth-child(4) {
    animation-delay: -0.144s;
  }
  .lds-roller div:nth-child(4):after {
    top: 72px;
    left: 40px;
  }
  .lds-roller div:nth-child(5) {
    animation-delay: -0.18s;
  }
  .lds-roller div:nth-child(5):after {
    top: 70.90963px;
    left: 31.71779px;
  }
  .lds-roller div:nth-child(6) {
    animation-delay: -0.216s;
  }
  .lds-roller div:nth-child(6):after {
    top: 67.71281px;
    left: 24px;
  }
  .lds-roller div:nth-child(7) {
    animation-delay: -0.252s;
  }
  .lds-roller div:nth-child(7):after {
    top: 62.62742px;
    left: 17.37258px;
  }
  .lds-roller div:nth-child(8) {
    animation-delay: -0.288s;
  }
  .lds-roller div:nth-child(8):after {
    top: 56px;
    left: 12.28719px;
  }
  @keyframes lds-roller {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
  
  .plans {margin: 20px auto 60px;padding: 0px 5px; position: relative;z-index:4; max-width:900px; }
  .terms {margin: 20px auto 60px;padding: 0px 5px; position: relative;z-index:4; max-width:700px; }
  .plan {background:rgb(240, 250, 255);  position:relative; margin:35px 0 50px;display:flex;border-radius:8px;}
  
  .feature-title {background:#9fc2ee; padding:6px 12px; color:#0c2f59; font-size:15px; border-top-left-radius: 8px; width:100%; display:none}
  .plan .plan-title {background: rgb(224, 239, 245); color:#111; width:41%; border-top-left-radius: 8px; border-bottom-left-radius: 8px;  position:relative;}
  .plan .plan-title .plan-excerpt {font-size:13px; padding:30px 20px 0px; display: none;}
  .plan .plan-title .plan-name {font-family: 'Mulish', sans-serif; font-weight:500; font-size:24px; padding:25px 20px 5px 20px;}
  .plan .plan-description {padding:20px 25px 15px; width:59%;border-top-right-radius: 8px; border-bottom-right-radius: 8px;}
  .plan .plan-description h3 {padding:0 10px; margin-bottom: 8px;}
  .plan .graybox {background:#fff; padding:10px 10px; text-align:center; height: 100%; align-items: center; justify-content: center; flex-direction: column; display: flex;}
  .plan .graybox p {font-size:14px; color:#333; margin:0;line-height:16px;}
  .plan .graybox .price {font-size:26px; color:#0d4cab; font-family: 'Mulish', sans-serif; font-weight:500;line-height:32px;}
  .plan .graybox .discount {font-size:12px; text-decoration:line-through; color:#ef233c; line-height:10px;}
  .plan .feature {margin:0 0 5px; padding:0 10px; display:flex; justify-content: space-between;}
  .plan .feature h3 {font-size:13px; display:flex; margin:0; font-weight:400;}
  .plan .feature svg {fill:green; display:flex; width:10px; height:10px;}
  .plan .plan-footer {padding:0px; position:absolute; bottom:0; left:0; width:100%;}
  .plan .seal-bronze, .plan .seal-silver, .plan .seal-gold, .plan .seal-platinum, .plan .seal-catastrophic {padding:9px 13px; display:flex; align-items:center; border-bottom-left-radius: 8px; vertical-align:middle; background: #abbaab;}
  .plan .seal-bronze img, .plan .seal-silver img, .plan .seal-gold img, .plan .seal-platinum img, .plan .seal-catastrophic img {width:18px; height:auto; display:inline-block; margin-right:0px;vertical-align:middle;}
  .plan .seal-bronze .text-seal, .plan .seal-silver .text-seal, .plan .seal-gold .text-seal, .plan .seal-platinum .text-seal, .plan .seal-catastrophic .text-seal {vertical-align:middle;}
  .plan .seal-bronze .rating, .plan .seal-silver .rating, .plan .seal-gold .rating, .plan .seal-platinum .rating, .plan .seal-catastrophic .rating  {display:flex; align-items:center; margin-left:6px;}
  
  .plan .seal-bronze { background: -webkit-linear-gradient(to bottom, #FFE7D1, #DBAF84); background: linear-gradient(to bottom, #FFE7D1, #DBAF84);color:#111}
  .plan .seal-silver {background: -webkit-linear-gradient(to bottom, #F0F2F7, #BBC1C4); background: linear-gradient(to bottom, #F0F2F7, #BBC1C4);color:#111}
  .plan .seal-gold {background: -webkit-linear-gradient(to bottom, #FFF6D4, #EBBF67); background: linear-gradient(to bottom, #FFF6D4, #EBBF67); color:#111}
  .plan .seal-platinum {background: -webkit-linear-gradient(to bottom, #F5F5F5, #D1D1D1); background: linear-gradient(to bottom, #F5F5F5, #D1D1D1); color:#111;}
  .plan .seal-catastrophic {background: -webkit-linear-gradient(to bottom, #FD1D1D, #833AB4); background: linear-gradient(to bottom, #FD1D1D, #833AB4); color: #fff;}
 .plan .plan-footer svg {color:rgba(123,123,123,.3)!important;}
  .plan .seal-silver svg.on {color:#ffaf03!important;}
  .plan .seal-bronze svg.on {color:#ffaf03!important;}
  .plan .seal-gold svg.on {color:#e6f1f5!important;}
  .plan .seal-platinum svg.on {color:#ffaf03!important;}
  .plan .seal-catastrophic svg.on {color:#ffaf03!important;}
  
  .plan .btn-order, .btn-styl.terms-btn {margin-top:10px; max-width: 280px; margin: 10px auto 0; font-size:18px; padding:7px 15px; background-color: #f16e16; color: white; font-weight: bold; border:none; width:100%;}
  .btn-styl.terms-btn {border-radius: 5px;}
  .plan.plan-b .feature-title {position:absolute; border-top-right-radius: 8px; width:auto; top:-35px;}
  .plan.plan-b .plan-title {border-top-left-radius: 0; width:50%; padding-bottom:30px;}
  .plan.plan-b .plan-description {width:50%; text-align: center;}
  .plan.plan-b .plan-description .row {text-align: left;}
  .plan-b .price-wrap {padding:10px 20px;}
  .plan.plan-b .plan-excerpt {padding-top:10px;}
  .plan.plan-b .plan-name {line-height:26px;}

  .thanks {padding-top: 50px;}
  .thanks .btn.continue-button {width: auto;}
  .signature-pad {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    font-size: 10px;
    width: 100%;
    height: 300px;
    max-width: 700px;
    max-height: 460px;
    border: 1px solid #e8e8e8;
    background-color: #fff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.08) inset;
    border-radius: 4px;
    padding: 16px;
    }
    .signature-pad--body {
        position: relative;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        border: 1px solid #f4f4f4;
        }
        .signature-pad--body canvas {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            border-radius: 4px;
            box-shadow: 0 0 5px rgba(0, 0, 0, 0.02) inset;
            }
    .signature-pad::before, .signature-pad::after {
        position: absolute;
        z-index: -1;
        content: "";
        width: 40%;
        height: 10px;
        bottom: 10px;
        background: transparent;
        box-shadow: 0 8px 12px rgba(0, 0, 0, 0.4);
        }
        .signature-pad::before {
            left: 20px;
            -webkit-transform: skew(-3deg) rotate(-3deg);
            transform: skew(-3deg) rotate(-3deg);
            }
            .signature-pad::after {
                right: 20px;
                -webkit-transform: skew(3deg) rotate(3deg);
                transform: skew(3deg) rotate(3deg);
                }
/* Sidebar */
.sidebar {
    width:320px;
    background-color: #09477e;
    color: white;
    overflow-y: auto;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.sidebar h2 {
    color: white;
    font-size: 26px; line-height: 32px;
    margin: 0;
}

.sidebar p {
    color: rgba(255, 255, 255, 0.9);
}

.sidebar h3 {
    color: white;
    margin: 0px; font-size: 17px; line-height: 22px;
}

.sidebar-section {padding: 24px; position:relative;background: radial-gradient(75.94% 100% at 50% 0px, rgba(40, 51, 64, 0.125) 0px, rgba(40, 51, 64, 0) 100%);}
.arrow-down {content: " "; position: absolute; left: 50%; top: 0; width: 0; height: 0; border: 11px solid rgba(136,183,213,0); border-top: 11px solid #09477e; margin-left: -11px;}
.requeriments-section {display: flex; justify-content: space-between;}

/* Eligibility Progress */
.eligibility-progress {
    margin: 10px 0; display: flex; gap: 10px;
}

.sidebar .progress-bar-container {
    height: 8px;
    background-color: rgba(255, 255, 255, 0.3);
    margin: 10px 0;
    position: relative; flex: 1 1 0%;
}

.progress-bar-fill {
    height: 100%;
    background-color: #f8a100;
    border-radius: 5px;
}

.progress-percentage {
    font-size: 0.9rem;
}

/* Requirements List */
.requirements-list {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin: 10px 0;
}

.requirement {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 1px;
    opacity: 0.5;
}

.requirement.active {
    opacity: 1;
}

.requirement-icon {
    width: 1.25rem;
}

/* Person Illustration */
.person-illustration {
    text-align: center;
    margin: 0px 0;
}

.person-illustration img {
    max-height: 200px;
}

/* ACA Logo */
.aca-logo {
    margin: 5px 0;
}

.aca-logo img {
    max-height: 80px;
}

/* Agent Info */
.agent-info {
    margin-top: 30px;
}

.checklist {
    margin-top: 10px;
}

.checklist-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 1px;
}

.check-icon {
    color: #fff;
    font-weight: bold;
    font-size: 1.2rem;
}

.gross-msg {text-align: center; color: #777;}
.gross-msg span, h2 span {color: rgb(233, 137, 47);}

.back-btn {font-size: 14px; color: #888; margin-right: 5px; border-radius: 3px; padding: 8px 26px; font-family: 'Mulish', sans-serif; font-weight: 600; text-decoration: none; background: #E5E5E5; height: 43px; display: inline-block; vertical-align: top; line-height: 27px; transform-origin: bottom;animation-duration: 2s; animation-iteration-count:infinite; box-shadow: none;border:none;}
.btn-styl:hover {box-shadow: 0 0 12px rgba(0,0,0,.4);}
.back-btn:hover {box-shadow: 0 0 12px rgba(0,0,0,.2); color: #444;}
.off-quest {transform:scale(0); opacity: 0; display: none}

.option {margin: 0 0 12px; color: #fff;  display: inline-block; height: 50px;  background: rgb(220, 130, 46); width: 100%; border-radius: 8px;
    text-align: center; line-height: 45px; transition: ease 0.5s all; cursor: pointer; font-size: 18px; font-weight: bold;}

.option:hover {box-shadow: 0 0 22px rgba(0, 0, 0, .1); background: rgb(220, 130, 46);}

.option.active {box-shadow: 0 0 16px rgba(0, 0, 0, .12); color: #fff; background:rgb(171, 99, 31);}

.option.check {width:48%; max-width: 158px; height: 48px; text-align: left; border: solid 1px rgb(44, 120, 195); margin: 0; border-radius: 6px; padding: 12px 12px 12px 44px; position:relative; background:#fff; font-size: 16px; color: #000; line-height: 24px;}
.option.check:before {content: ''; display: block; width:20px; border-radius: 50%; height: 20px; left:12px; top: 12px; position: absolute; border: solid 1px rgb(44, 120, 195); }
.option.check.active:before {background: rgb(44, 120, 195);}
.option.check:hover {background: #fff;}
.option.check.first {border-top-right-radius: 0; border-bottom-right-radius: 0;}
.option.check.second {border-top-left-radius: 0; border-bottom-left-radius: 0; margin-left: -5px;}
.option.check.big {max-width: 258px;height: 170px; vertical-align:top;}
label {margin-bottom: 0; font-weight: bold;}
.copy-tcpa {font-size:11px; color:#666; line-height:1.45; padding:5px 0;}
      .copy-tcpa a {color:#2d79c5; text-decoration: underline;}

.tcpa-details { margin-top: 6px; }
.tcpa-details > summary {
  font-size: 11px;
  color: #2d79c5;
  cursor: pointer;
  display: inline-block;
  list-style: none;
  user-select: none;
  text-decoration: underline;
}
.tcpa-details > summary::-webkit-details-marker { display: none; }
.tcpa-details > summary::before {
  content: "▸ ";
  display: inline-block;
  margin-right: 2px;
  transition: transform 0.15s;
}
.tcpa-details[open] > summary::before {
  content: "▾ ";
}
.tcpa-details .tcpa-full {
  margin-top: 6px;
  padding: 8px 10px;
  background: #f8f9fa;
  border-radius: 4px;
  border-left: 3px solid #ddd;
  font-size: 11px;
  color: #666;
  line-height: 1.45;
}
      .small {font-size: 13px; margin-bottom: 0;}
.check-2 input {-webkit-box-align: center; -ms-flex-align: center; -ms-flex-negative: 0; align-items: center; -webkit-appearance: none; appearance: none; background-color: #fff;  border: 2px solid #262626;  border-radius: 0;  cursor: pointer; display: inline-block; flex-shrink: 0; height: 32px; width:32px; justify-items: center; margin: 0; place-content: center; position: relative; line-height: 34px;}
.check-2 input[type=radio] {border-color:#262626;accent-color:#35CB74;display: inline-grid; border-radius: 100%}
.check-2 input[type=checkbox] {border-color:#262626;accent-color:#35CB74;display: inline-grid; border-radius: 4px; width:24px; height:24px;}
.check-2 input[type=radio]:checked:before {border-radius: 100%; box-shadow: inset 0 0 4em 1em #046791; content:''; height: 22px; opacity:1; width:22px;}
.check-2 input[type=checkbox]:checked:before {border-radius:2px; box-shadow: inset 0 0 4em 1em #046791; content:''; height: 14px; opacity:1; width:14px;}
.check-2 label {vertical-align: top; display: inline-block; line-height: 18px; padding-bottom: 12px; width: 90%}
label small {font-size: 13px; font-weight: normal}
.check-2 label.form-check-label {font-size: 12px; line-height: 14px; width:89%}
.form-check label {font-size: 12px; }
.iti {width:100%;}
.form-icome img {width: 350px;}
.form-group {padding-bottom:10px;}
.form-group label {font-size: 15px; color: #262626; font-weight:bold;display:block; padding: 5px 0;}
.label-checkgroup {display:block;}
.plans-check {max-width:410px; margin:0 auto;}
.plans-check .check-2 input {width:20px; height:20px; vertical-align:middle;}
.plans-check .check-2 input[type=radio]:checked:before {width:10px; height:10px; box-shadow: inset 0 0 4em 1em #46900a;}
.plans-check .check-2 label {font-weight:normal; line-height:12px; padding-bottom:10px;}
.check-2 input[type=checkbox]  {width:20px; height:20px; vertical-align:middle;}
.check-2 input[type=checkbox]:checked:before {width:10px; height:10px; box-shadow: inset 0 0 4em 1em #46900a;}

.form {max-width: 1000px;margin: 10px auto 40px; position: relative; z-index:4;border:none;}
.stp-qust {max-width: 450px; margin: 0 auto;}
.stp-qust.expanded {max-width: 700px; }
.stp-qust.expanded h2 {text-align: left;}
.step-4a .stp-qust {max-width: 325px;}
.form h1 {margin-bottom:25px;}
.tool-message {width:100%; margin:25px auto 10px; padding:6px 18px; background:#eee; border-radius:6px; color:#666; font-size:13px; border:solid 1px #ddd; opacity:0.7;}
.tool-message h4 {padding:0; margin:0 0 0px; color:#666; font-size:14px;}
.form-wrap {max-width:750px; margin:0 auto;}
.form-wrap h2 {font-size:21px; line-height:40px; margin-bottom:15px;}
.progress-quest {background:#ebf6e2; justify-content: flex-start; align-items: center; position: absolute; padding: 0; display: flex; height: 12px;width: 100%; top: 0px; left:0; margin: 0 auto; }
.progress-value {box-shadow: 0 10px 40px -10px #0f385a;  border-radius: 0;  background: #46900a;  height: 12px;  position:absolute; transition: all 1s ease; width:0;}
.progress-value.progress-10 { width:10%;}
.progress-value.progress-20 { width:20%;}
.progress-value.progress-30 { width:30%;}
.progress-value.progress-40 { width:40%;}
.progress-value.progress-50 { width:50%}
.progress-value.progress-60 { width:60%}
.progress-value.progress-70 { width:70%}
.progress-value.progress-80 { width:80%}
.progress-value.progress-90 { width:90%}

.form-control {border:1px solid rgb(231, 229, 228);font-size: 14px; padding: 10px; border-radius: 6px; width: 100%; border: 1px solid #ced4da; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.rounded-lg {border-radius:8px;} 
.h-20.overflow-y-auto {max-height:75px; overflow-y:auto;}
.check-container {
  display: inline-block!important;
  position: relative;
  padding: 0 30px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.check-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background: #eee;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.check-container:hover input ~ .checkmark {
  background: #ccc;
}

/* When the radio button is checked, add a blue background */
.check-container input:checked ~ .checkmark {
  background: linear-gradient(-132deg,#d5a1fe,#7b8bf2);;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.check-container:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.check-container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.check-container .checkmark:after {
  top: 9px;
  left: 9px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: white;
}   
input.form-control {height: 40px;}        
.is-invalid {color: red; font-size: 14px; font-weight: bold;}
.form-control.is-invalid, .was-validated .form-control:invalid { border-color: #dc3545; padding-right: calc(1.5em + .75rem); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1…circle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat; background-position: right calc(.375em + .1875rem) center; background-size: calc(.75em + .375rem) calc(.75em + .375rem);  }
select.form-control {height:45px; background-image: linear-gradient(45deg, transparent 50%, gray 50%),
linear-gradient(135deg, gray 50%, transparent 50%), linear-gradient(to right, #ccc, #ccc); background-position: calc(100% - 18px) calc(1em + 6px), calc(100% - 13px) calc(1em + 6px), calc(100% - 3em) 1em; background-size: 5px 5px, 5px 5px, 1px 1.5em; background-repeat: no-repeat;}
.range-slider {
    -webkit-appearance: none;
    appearance: none; 
    width: 100%;
    cursor: pointer;
    outline: none;
    border-radius: 15px;
    height: 6px;
    background: #ccc;
  }
        .range-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none; 
    height: 15px;
    width: 15px;
    background-color: rgb(171, 99, 31);
    border-radius: 50%;
    border: none;
    transition: .2s ease-in-out;
  }
  
  .range-slider::-moz-range-thumb {
    height: 15px;
    width: 15px;
    background-color: rgb(171, 99, 31);
    border-radius: 50%;
    border: none;
    transition: .2s ease-in-out;
  }
  
  .range-slider::-webkit-slider-thumb:hover {
    box-shadow: 0 0 0 10px rgba(144, 115, 10, .1)
  }
  .range-slider:active::-webkit-slider-thumb {
    box-shadow: 0 0 0 13px rgba(144, 115, 10, .2)
  }
  .range-slider:focus::-webkit-slider-thumb {
    box-shadow: 0 0 0 13px rgba(144, 115, 10, .2)
  }
  
  .range-slider::-moz-range-thumb:hover {
    box-shadow: 0 0 0 10px rgba(144, 115, 10, .1)
  }
  .range-slider:active::-moz-range-thumb {
    box-shadow: 0 0 0 13px rgba(144, 115, 10, .2)
  }
  .range-slider:focus::-moz-range-thumb {
    box-shadow: 0 0 0 13px rgba(144, 115, 10, 0.2)    
  }
  .range {position:relative; max-width: 400px; margin: 0 auto;}
  .range .value-range {font-size: 18px; width: auto;text-align: center; display:inline-block; margin:15px auto 5px; padding:8px 15px; background:#fff; border-radius:9px; border:solid 3px #f6f0e2;}
  .range .value-range .value2 {font-weight:bold;font-size: 20px;}
  .range .min-value, .range .max-value {font-size:12px;color:#999;position:absolute;bottom:-25px;}
  .range .min-value {left:0;}
  .range .max-value {right:0;}

.premium-box {color:#000;}
.metal-badge {font-size:13px!important; padding:8px!important;margin-left:5px!important; margin-bottom:4px;}
.metal-badge:first-child {margin-left:0!important;}
/* Responsive Design */
/* Mobile-only utility: hidden by default (desktop), shown inside the mobile media query below.
   Used for surfacing condensed mobile-specific content (e.g. the sidebar help line). */
.mobile-only {display: none;}

/* Compact "Need help? Call ..." line shown inside the fixed bottom sidebar bar on mobile.
   Sits next to the eligibility progress bar so the bar surface is useful. */
.sidebar-help-line {
    display: none; /* shown via .mobile-only override on mobile */
    color: rgba(255,255,255,0.95);
    font-size: 13px;
    text-align: center;
    text-decoration: none;
    margin-top: 4px;
    line-height: 1.3;
}
.sidebar-help-line:hover, .sidebar-help-line:focus {
    color: #fff;
    text-decoration: underline;
}
.sidebar-help-line .phone-number {
    font-weight: 700;
    margin-left: 4px;
    white-space: nowrap;
}

@media (max-width: 992px) {
    .main-container {
        flex-direction: column;
    }
    .main-content .inner-cont {min-height: calc(100vh - 250px);}
    /* Reserve space at the bottom of the form so the fixed eligibility bar
       (the .sidebar pinned to the viewport bottom on mobile) doesn't cover
       the Continue button or the last form fields. */
    .main-content .inner-cont {padding-bottom: 90px;}
    .main-content, .sidebar {width:100%;}
    .sidebar {position: fixed; bottom: 0; left: 0;z-index:9999;}
    .sidebar-section {padding: 5px;}
    .mobile-off {display: none;}
    .mobile-only {display: block;}
    .sidebar-help-line {display: block;}

    /* Tighten vertical rhythm on mobile/tablet so the heading sits closer to
       the banner instead of pushing content down with default margins. */
    .home-cont {margin-top: 8px; margin-bottom: 0;}
    .main-content h2 {margin-bottom: 20px;}
    .stp-qust > .form-group:first-child,
    .stp-qust > .row:first-child {margin-top: 0;}
    
    .progress-steps {
        display: none;
    }
    
    .progress-bar {
        justify-content: space-between;
    }
}

@media (max-width: 768px) {
    .progress-mobile {display: block;}
    .item-progress {display: none;}
    .header-container .rating{display: none; }
    .plan {flex-direction:column;}
    .plan.plan-b .plan-title, .plan.plan-b .plan-description {width:100%; border-radius:0;}
    .plan .seal-bronze, .plan .seal-silver, .plan .seal-gold, .plan .seal-platinum, .plan .seal-catastrophic {border-radius:0;}
    .plan .graybox .price {font-size:22px; line-height:24px;}
    .plan-header h1 {font-size:28px; line-height:28px;}
    .plan-header h3 {font-size:20px; line-height:24px;}
    .benefit-name {font-size:14px; line-height:18px;word-wrap: anywhere;}
}














/* Add this to your styles.css file */

.plan-type-badge {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  border-radius: 20px;
  padding: 6px 16px;
  margin: 8px 0;
  margin-left: 18px;
  display: inline-block;
  box-shadow: 0 2px 8px rgba(102, 126, 234, 0.3);
  transition: all 0.3s ease;
}

.plan-type-badge:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
}

.plan-type-badge .type-label {
  color: rgba(255, 255, 255, 0.8);
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-right: 6px;
}

.plan-type-badge .type-value {
  color: #ffffff;
  font-size: 13px;
  font-weight: 600;
  text-transform: capitalize;
}

/* Alternative style - if you prefer a more subtle approach */
.plan-type-badge.subtle {
  background: #f8f9ff;
  border: 1px solid #e1e5f0;
  color: #5a67d8;
}

.plan-type-badge.subtle .type-label {
  color: #718096;
}

.plan-type-badge.subtle .type-value {
  color: #5a67d8;
}

/* Mobile responsive */
@media (max-width: 768px) {
  .plan-type-badge {
    font-size: 12px;
    padding: 4px 12px;
  }
  .home-cont {margin:0 auto;}
  .main-content h2 {margin:0 auto 20px;}
  .plan-type-badge .type-label {
    font-size: 10px;
  }
  
  .plan-type-badge .type-value {
    font-size: 12px;
  }

  .language-switcher {
    position: static;
    justify-content: flex-end;
    margin-bottom: 4px;
  }
}

/* Language Switcher — circular flag-only icons */
.language-switcher {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  margin-bottom: 10px;
}

.lang-btn {
  /* Hide the "EN"/"ES" text — we keep it in markup for accessibility */
  font-size: 0;
  line-height: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 2px solid transparent;
  background: #fff;
  border-radius: 50%;
  cursor: pointer;
  overflow: hidden;
  opacity: 0.55;
  transition: transform .15s, border-color .15s, box-shadow .15s, opacity .15s;
  transition: all 0.2s ease;
  color: #333;
  text-transform: uppercase;
}

.lang-btn:hover {
  opacity: 1;
  transform: scale(1.05);
  border-color: #cdd6e0;
}

.lang-btn img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  border: 0;
  display: block;
}

.lang-btn.active {
  opacity: 1;
  border-color: #2c78c3;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(44, 120, 195, 0.18);
}
.lang-btn.active:hover {
  transform: none;
}

@media (max-width: 768px) {
  .language-switcher {
    justify-content: center;
    margin-bottom: 12px;
    gap: 6px;
  }

  .lang-btn {
    width: 26px;
    height: 26px;
  }
}

/* ── Deep-Link Apply Page ── */
.aca-context-banner {
  background: linear-gradient(135deg, #1a5276, #2980b9);
  color: #fff;
  text-align: center;
  padding: 18px 24px;
}
.aca-context-banner h2 { font-size: 18px; font-weight: 700; margin-bottom: 4px; }
.aca-context-banner p { font-size: 13px; opacity: 0.9; margin: 0; }

.aca-subtitle {
  font-size: 14px;
  color: #2980b9;
  font-weight: 600;
  margin-bottom: 28px;
  padding: 8px 12px;
  background: #eaf4fb;
  border-left: 4px solid #2980b9;
  border-radius: 2px;
}

/* SSN Section (new design) */
.ssn-section { margin-bottom: 28px; }
.ssn-section .ssn-label {
  font-size: 18px;
  font-weight: 700;
  color: #222;
  margin-bottom: 8px;
}
.ssn-section .ssn-context {
  font-size: 13px;
  color: #555;
  margin-bottom: 14px;
  line-height: 1.5;
}
.ssn-section .ssn-context strong { color: #c8621a; font-weight: 700; }

.ssn-input-wrapper {
  position: relative;
  max-width: 340px;
  margin-bottom: 10px;
}
.ssn-input-wrapper .form-control {
  height: 48px !important;
  font-size: 18px !important;
  padding-right: 44px !important;
  letter-spacing: 2px;
  font-family: monospace, 'Roboto', sans-serif;
}
.ssn-input-wrapper .form-control:focus {
  border-color: #c8621a;
  box-shadow: 0 0 0 2px rgba(200,98,26,0.15);
}
.ssn-lock-icon {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 18px;
  color: #888;
  pointer-events: none;
}

.ssn-security-note {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  margin-top: 10px;
  margin-bottom: 20px;
}
.ssn-security-note svg { flex-shrink: 0; margin-top: 2px; }
.ssn-security-note p {
  margin: 0;
  font-size: 11px;
  color: #888;
  line-height: 1.4;
}

.ssn-trust-badges {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
}
.ssn-badge {
  font-size: 12px;
  color: #666;
  display: flex;
  align-items: center;
  gap: 5px;
  border: 1px solid #ddd;
  border-radius: 4px;
  padding: 6px 12px;
}
.ssn-badge img { max-height: 24px; }

.ssn-legal-footer {
  margin-top: 20px;
  font-size: 11px;
  color: #999;
  text-align: center;
  line-height: 1.6;
}

.apply-card {
  background: #fff;
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  padding: 32px 36px;
  max-width: 700px;
  margin: 28px auto;
}
@media (max-width: 576px) {
  .apply-card { padding: 20px 16px; }
}

.apply-divider {
  border: none;
  border-top: 1px solid #eee;
  margin: 8px 0 28px;
}

.apply-continue-btn {
  width: 100%;
  padding: 16px;
  background: #f16e16;
  color: #fff;
  font-size: 17px;
  font-weight: 700;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  transition: background 0.2s;
  letter-spacing: 0.3px;
}
.apply-continue-btn:hover { background: #f8a100; }

/* ── Verify (Federal Eligibility) Page ── */
.verify-plan-pill {
  background: #fff;
  border: 1px solid #e7e5e4;
  border-radius: 8px;
  padding: 12px 18px;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.verify-plan-pill__label {
  font-size: 12px;
  color: #888;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-weight: 600;
}
.verify-plan-pill__name {
  font-size: 15px;
  font-weight: 700;
  color: #222;
  flex: 1;
}
.verify-plan-pill__premium {
  font-size: 15px;
  font-weight: 700;
  color: #c8621a;
}

.verify-section {
  margin-bottom: 20px;
}
.verify-section__heading {
  font-size: 18px;
  font-weight: 700;
  color: #222;
  margin: 0 0 4px;
}
.verify-section__sub-heading {
  font-size: 15px;
  font-weight: 700;
  color: #333;
  margin: 16px 0 8px;
}
.verify-section__note {
  font-size: 13px;
  color: #666;
  margin-bottom: 14px;
}

.verify-dependent-ssn {
  margin-bottom: 14px;
}
.verify-dependent-ssn label {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: #333;
  margin-bottom: 6px;
}

.verify-attestation {
  background: #f8f9fa;
  border-left: 4px solid #2980b9;
  border-radius: 4px;
  padding: 14px 16px;
  margin: 20px 0;
}
.verify-attestation__label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: #333;
}
.verify-attestation__checkbox {
  margin-top: 3px;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  cursor: pointer;
}

.verify-eyebrow {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  color: #c8621a;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.sidebar-plan-summary {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 8px;
  padding: 14px 16px;
  margin-top: 10px;
}
.sidebar-plan-summary__issuer {
  font-size: 11px;
  color: rgba(255,255,255,0.7);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-weight: 600;
  margin-bottom: 4px;
}
.sidebar-plan-summary__name {
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 10px;
  line-height: 1.3;
}
.sidebar-plan-summary__premium {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  border-top: 1px solid rgba(255,255,255,0.15);
  padding-top: 10px;
}
.sidebar-plan-summary__premium-label {
  font-size: 12px;
  color: rgba(255,255,255,0.8);
}
.sidebar-plan-summary__premium-value {
  font-size: 18px;
  font-weight: 700;
  color: #ffa94d;
}

/* ============================================================
   Helping Hands landing (helping-hands.html) + compact banner
   ============================================================ */

.helping-hands-landing {
  max-width: 720px;
  margin: 40px auto;
  padding: 40px 30px;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
  text-align: center;
}

.helping-hands-logos {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-bottom: 28px;
  flex-wrap: wrap;
}

.helping-hands-logos .hh-logo {
  height: 48px;
  width: auto;
  max-width: 180px;
  object-fit: contain;
}

.helping-hands-logos .ic-logo {
  height: 40px;
  width: auto;
  max-width: 160px;
  object-fit: contain;
}

.helping-hands-logos .hh-plus {
  font-size: 28px;
  font-weight: 300;
  color: #2d79c5;
  line-height: 1;
}

.helping-hands-heading {
  font-size: 28px;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 18px;
  line-height: 1.3;
}

.helping-hands-body {
  font-size: 16px;
  line-height: 1.6;
  color: #4a4a4a;
  margin-bottom: 24px;
  text-align: left;
}

.helping-hands-prefill-summary {
  background: #f7fafd;
  border: 1px solid #e1eaf3;
  border-radius: 10px;
  padding: 18px 20px;
  margin: 0 0 28px 0;
  text-align: left;
}

.hh-prefill-title {
  font-size: 13px;
  font-weight: 700;
  color: #1a3a5c;
  margin-bottom: 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.hh-prefill-list {
  list-style: none;
  padding: 0;
  margin: 0 0 10px 0;
}

.hh-prefill-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 0;
  font-size: 15px;
  color: #1a1a1a;
  border-bottom: 1px solid #eef3f8;
}

.hh-prefill-item:last-child {
  border-bottom: none;
}

.hh-prefill-icon {
  font-size: 16px;
  flex-shrink: 0;
  width: 22px;
  text-align: center;
}

.hh-prefill-value {
  font-weight: 500;
  word-break: break-word;
}

.hh-prefill-footnote {
  font-size: 12px;
  color: #7a8899;
  font-style: italic;
  margin-top: 10px;
}

.helping-hands-continue-wrap {
  margin-bottom: 28px;
}

.helping-hands-continue-wrap .continue-button {
  min-width: 240px;
  font-size: 18px;
  padding: 14px 36px;
}

.helping-hands-continue-wrap .continue-button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.helping-hands-loading-hint {
  font-size: 13px;
  color: #888;
  margin-top: 10px;
  font-style: italic;
}

.helping-hands-continue-wrap .continue-button:not(:disabled) + .helping-hands-loading-hint {
  display: none;
}

/* Soft error shown when GHL prefill fetch fails — user can still proceed */
.helping-hands-fetch-error {
  background: #fff8e6;
  border: 1px solid #f3e3a8;
  border-radius: 8px;
  padding: 10px 14px;
  margin: 0 0 14px;
  color: #6b5a18;
  font-size: 14px;
  text-align: left;
}

/* Compact banner shown on steps.html when user is in GHL flow */
#helping-hands-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 10px 16px;
  margin: 0 0 16px 0;
  background: linear-gradient(90deg, #f0f7ff 0%, #e8f0fc 100%);
  border: 1px solid #d0e1f5;
  border-radius: 8px;
  font-size: 14px;
  color: #1a3a5c;
}

#helping-hands-banner img {
  max-height: 32px;
  max-width: 100px;
  height: auto;
  width: auto;
}

#helping-hands-banner.d-none {
  display: none !important;
}

/* When deep-linked via GHL flow, hide the "Step N/15" progress chrome —
   the counter is misleading since we skip ahead, and it creates a big
   empty gap above the form. Also tighten spacing around the form. */
body.ghl-flow .progress-container {
  display: none;
}

body.ghl-flow .main-content > .form,
body.ghl-flow form.step-4-b,
body.ghl-flow form.step-6 {
  margin-top: 0;
  padding-top: 0;
}

body.ghl-flow #helping-hands-banner {
  margin-bottom: 12px;
}

@media (max-width: 576px) {
  .helping-hands-landing {
    margin: 20px 12px;
    padding: 28px 18px;
  }
  .helping-hands-heading {
    font-size: 22px;
  }
  .helping-hands-logos .hh-logo {
    height: 40px;
    max-width: 140px;
  }
  .helping-hands-logos .ic-logo {
    height: 34px;
    max-width: 140px;
  }
  /* Tighten the "We've got your info on file" summary on mobile */
  .helping-hands-prefill-summary {
    padding: 12px 14px;
    margin-bottom: 14px;
  }
  .hh-prefill-title {
    font-size: 11px;
    margin-bottom: 6px;
  }
  .hh-prefill-item {
    font-size: 14px;
    padding: 4px 0;
    gap: 8px;
  }
  .hh-prefill-icon {
    font-size: 14px;
    width: 18px;
  }
  .hh-prefill-footnote {
    font-size: 11px;
    margin-top: 6px;
  }
  #helping-hands-banner {
    font-size: 13px;
    gap: 10px;
  }
}

/* =========================================================================
   Redesigned step (used by .step-6 and .step-6b)
   - Card layout, sectioned grouping, segmented Yes/No, polished CTA
   - Scoped under .rd-step so nothing else on the site is affected.
   ========================================================================= */

.rd-step {
  max-width: 720px;
  margin: 0 auto;
  padding: 8px 16px 24px;
  font-family: 'Roboto', Arial, sans-serif;
  color: #0f2742;
}

.rd-step .rd-card {
  background: #ffffff;
  border: 1px solid #e3e8ef;
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(15,39,66,0.08);
  padding: 32px 32px 24px;
}

.rd-step .rd-h1 {
  font-size: 26px;
  line-height: 1.25;
  margin: 0 0 6px;
  color: #0f2742;
  font-weight: 700;
}

.rd-step .rd-sub {
  margin: 0 0 24px;
  color: #6b7a8c;
  font-size: 15px;
  line-height: 1.5;
}

/* Sections */
.rd-step .rd-section {
  border-top: 1px solid #e3e8ef;
  padding-top: 20px;
  margin-top: 20px;
}
.rd-step .rd-section:first-of-type {
  border-top: 0;
  padding-top: 0;
  margin-top: 0;
}

.rd-step .rd-section-label {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  font-weight: 600;
  color: #2c78c3;
  margin-bottom: 14px;
}

/* Field grid */
.rd-step .rd-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 6px;
}
.rd-step .rd-field {
  margin-bottom: 18px;
}

.rd-step .rd-label-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 6px;
  gap: 8px;
}

.rd-step label.rd-fld {
  font-size: 14px;
  font-weight: 600;
  color: #0f2742;
  margin: 0 0 6px;
  display: block;
}
.rd-step .rd-label-row label.rd-fld { margin-bottom: 0; }

.rd-step .rd-req { color: #e0524d; }

.rd-step .rd-help-inline {
  font-size: 12px;
  color: #6b7a8c;
  font-weight: 400;
}

.rd-step .rd-help-block {
  font-size: 12px;
  color: #6b7a8c;
  margin-top: 6px;
  display: flex;
  gap: 6px;
  align-items: flex-start;
  line-height: 1.45;
}
.rd-step .rd-help-ico {
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #eaf1fa;
  color: #2c78c3;
  font-size: 10px;
  font-weight: 700;
  font-style: normal;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  margin-top: 2px;
}

/* Inputs */
.rd-step .rd-input.form-control {
  width: 100%;
  padding: 12px 14px;
  height: auto;
  border: 1px solid #cdd6e0;
  border-radius: 8px;
  font-size: 15px;
  color: #0f2742;
  background: #fff;
  transition: border-color .15s, box-shadow .15s;
  box-shadow: none;
}
.rd-step .rd-input.form-control::placeholder { color: #98a3b3; }
.rd-step .rd-input.form-control:focus {
  outline: 0;
  border-color: #2c78c3;
  box-shadow: 0 0 0 3px rgba(44,120,195,0.18);
}

/* Segmented Yes/No (overrides global .option styling inside .rd-seg only) */
.rd-step .rd-seg {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  background: #f4f6fa;
  border: 1px solid #cdd6e0;
  border-radius: 10px;
  padding: 4px;
}
.rd-step .rd-seg .option {
  /* Reset all global .option / .option.check styling */
  width: auto;
  max-width: none;
  height: auto;
  margin: 0;
  padding: 11px 12px;
  background: transparent;
  border: 0;
  border-radius: 7px;
  color: #314a66;
  font-size: 15px;
  font-weight: 600;
  text-align: center;
  line-height: 1.3;
  position: static;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .15s, color .15s, box-shadow .15s;
  box-shadow: none;
}
.rd-step .rd-seg .option::before {
  display: none !important;
  content: none;
}
.rd-step .rd-seg .option:hover {
  background: rgba(255,255,255,0.6);
  color: #0f2742;
  box-shadow: none;
}
.rd-step .rd-seg .option.active {
  background: #ffffff;
  color: #2c78c3;
  box-shadow: 0 1px 2px rgba(15,39,66,0.06);
}
/* Affirmative-green tint for "Yes" when chosen */
.rd-step .rd-seg .option[id*="Yes"].active {
  color: #2f9e44;
}

/* Error placement under segmented control */
.rd-step .rd-field .is-invalid {
  font-size: 12px;
  color: #e0524d;
  margin-top: 6px;
  text-align: left;
}

/* Select dropdowns inside the redesigned step */
.rd-step select.rd-input.form-control {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%236b7a8c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 38px;
  cursor: pointer;
}

/* Stacked card-style options (long-text radio choices) */
.rd-step .rd-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 4px;
}
.rd-step .rd-card-opt.option {
  /* Reset global .option styles */
  width: auto;
  max-width: none;
  height: auto;
  margin: 0;
  padding: 16px 18px;
  background: #ffffff;
  border: 1.5px solid #cdd6e0;
  border-radius: 10px;
  color: #314a66;
  font-size: 14px;
  font-weight: 400;
  text-align: left;
  line-height: 1.45;
  position: static;
  display: flex;
  flex-direction: column;
  gap: 6px;
  cursor: pointer;
  transition: border-color .15s, background .15s, box-shadow .15s, transform .05s;
  box-shadow: none;
}
.rd-step .rd-card-opt.option::before {
  display: none !important;
  content: none;
}
.rd-step .rd-card-opt.option:hover {
  border-color: #2c78c3;
  background: #f7fbff;
  box-shadow: 0 2px 8px rgba(44,120,195,0.08);
}
.rd-step .rd-card-opt.option.active {
  border-color: #2c78c3;
  background: #eaf3fb;
  box-shadow: 0 0 0 3px rgba(44,120,195,0.18);
}
.rd-step .rd-card-opt .rd-opt-title {
  font-size: 15px;
  font-weight: 700;
  color: #0f2742;
}
.rd-step .rd-card-opt .rd-opt-desc {
  font-size: 13px;
  color: #6b7a8c;
}
.rd-step .rd-card-opt.option.active .rd-opt-title {
  color: #2c78c3;
}
@media (max-width: 540px) {
  .rd-step .rd-cards {
    grid-template-columns: 1fr;
  }
}

/* CTA + trust row */
.rd-step .rd-cta-wrap {
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px solid #e3e8ef;
}
.rd-step .rd-cta.continue-button {
  display: block;
  width: 100%;
  max-width: none;
  background: #f16e16;
  color: #fff;
  border: 0;
  border-radius: 10px;
  padding: 16px 20px;
  font-size: 17px;
  font-weight: 700;
  cursor: pointer;
  transition: background .15s, transform .05s;
  box-shadow: 0 4px 14px rgba(241,110,22,0.28);
  margin: 0;
}
.rd-step .rd-cta.continue-button:hover {
  background: #d85f0d;
}
.rd-step .rd-cta.continue-button:active {
  transform: translateY(1px);
}
.rd-step .rd-cta .rd-arrow {
  margin-left: 8px;
  display: inline-block;
}

.rd-step .rd-trust-row {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 14px;
  margin-top: 14px;
  color: #6b7a8c;
  font-size: 12px;
  flex-wrap: wrap;
}
.rd-step .rd-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  background: #f4f6fa;
  border: 1px solid #e3e8ef;
  border-radius: 6px;
  font-weight: 600;
  color: #314a66;
}
.rd-step .rd-badge .rd-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2f9e44;
  display: inline-block;
}
.rd-step .rd-lock::before {
  content: "🔒";
  margin-right: 4px;
}

/* Skip link (step-4b) and disclaimer (step-2) inside rd-cta-wrap */
.rd-step .rd-skip-link {
  display: block;
  text-align: center;
  margin-top: 12px;
  font-size: 13px;
  color: #007bff;
  text-decoration: underline;
  cursor: pointer;
}
.rd-step .rd-disclaimer {
  text-align: center;
  margin-top: 10px;
  font-size: 12px;
  color: #8a95a3;
}

/* Option buttons (step-3 coverage, step-4a income range) inside rd-card */
.rd-step .rd-field > .option {
  display: block;
  width: 100%;
  margin-bottom: 10px;
  border-radius: 10px;
  font-size: 15px;
  height: auto;
  padding: 14px 20px;
  line-height: 1.3;
}
.rd-step .rd-field > .option:last-of-type { margin-bottom: 0; }

/* Range slider inside rd-card */
.rd-step .range { max-width: 100%; margin-top: 8px; }

/* gross-msg warning in step-4 */
.rd-step .gross-msg { margin-bottom: 4px; }

/* Copy-TCPA inside rd-field */
.rd-step .copy-tcpa { font-size: 11px; color: #6b7a8c; }

/* Polish the existing helping-hands continuity banner — bigger logo
   that respects its native (wide) aspect ratio, matched padding. */
#helping-hands-banner {
  padding: 14px 18px;
  border-radius: 10px;
  gap: 16px;
}
#helping-hands-banner img {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  max-height: 56px;
  max-width: 180px;
  height: auto;
  width: auto;
  object-fit: contain;
}
@media (max-width: 540px) {
  #helping-hands-banner img {
    max-height: 44px;
    max-width: 140px;
  }
}

/* Mobile */
@media (max-width: 540px) {
  .rd-step { padding: 4px 12px 24px; }
  .rd-step .rd-card {
    padding: 22px 18px 18px;
    border-radius: 12px;
  }
  .rd-step .rd-h1 { font-size: 22px; }
  .rd-step .rd-row {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .rd-step .rd-trust-row {
    gap: 8px 12px;
    font-size: 11px;
  }
  .rd-step .rd-cta.continue-button {
    font-size: 16px;
    padding: 14px 18px;
  }
}

/* =========================================================================
   Helping Hands landing page — extends .rd-step / .rd-card with partnership
   masthead, prefill summary, and disabled-CTA loading state.
   ========================================================================= */

/* Re-zero the legacy .helping-hands-landing styles (they conflict with .rd-card) */
.rd-step.helping-hands-landing {
  margin-top: 32px;
  margin-bottom: 64px;
  padding: 8px 16px 24px;
  background: transparent;
  box-shadow: none;
  border-radius: 0;
}

/* Center-aligned variant of the card content for this page */
.rd-step.helping-hands-landing .rd-card {
  text-align: center;
}
.rd-step.helping-hands-landing .rd-h1 {
  font-size: 28px;
  text-align: center;
  margin: 0 0 10px;
}
.rd-step.helping-hands-landing .rd-sub {
  text-align: center;
  margin: 0 auto 24px;
  max-width: 540px;
  font-size: 15px;
}

/* Co-branded partnership masthead */
.hh-partnership {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  margin: 4px 0 10px;
  flex-wrap: wrap;
}
.hh-partnership-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1px solid #e3e8ef;
  border-radius: 12px;
  padding: 12px 16px;
  min-height: 64px;
  box-shadow: 0 1px 2px rgba(15,39,66,0.04);
}
.hh-partnership-logo img {
  display: block;
  height: 40px;
  width: auto;
  max-width: 160px;
  object-fit: contain;
}
.hh-partnership-logo--ic img {
  height: 32px;
}
.hh-partnership-plus {
  font-size: 22px;
  font-weight: 300;
  color: #2c78c3;
  line-height: 1;
}
.hh-partnership-tag {
  display: inline-block;
  margin: 0 auto 8px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  color: #2c78c3;
  padding: 3px 10px;
  background: #eaf3fb;
  border-radius: 999px;
}

/* Prefill summary — section styled, left-aligned content inside centered card */
.rd-step.helping-hands-landing .helping-hands-prefill-summary {
  text-align: left;
  background: #f7fafd;
  border: 1px solid #e1eaf3;
  border-radius: 10px;
  padding: 18px 20px;
  margin: 8px 0 24px;
}
.rd-step.helping-hands-landing .hh-prefill-title.rd-section-label {
  margin-bottom: 12px;
}
.rd-step.helping-hands-landing .hh-prefill-list {
  list-style: none;
  padding: 0;
  margin: 0 0 12px;
}
.rd-step.helping-hands-landing .hh-prefill-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 0;
  font-size: 15px;
  color: #0f2742;
  border-bottom: 1px solid #e6eef6;
}
.rd-step.helping-hands-landing .hh-prefill-item:last-child {
  border-bottom: 0;
}
.rd-step.helping-hands-landing .hh-prefill-icon {
  font-size: 16px;
  flex-shrink: 0;
  width: 22px;
  text-align: center;
}
.rd-step.helping-hands-landing .hh-prefill-value {
  font-weight: 500;
  word-break: break-word;
}
.rd-step.helping-hands-landing .hh-prefill-footnote {
  font-size: 12px;
  color: #7a8899;
  font-style: italic;
  margin: 0;
}

/* Soft fallback error band */
.rd-step.helping-hands-landing .helping-hands-fetch-error {
  background: #fff8e6;
  border: 1px solid #f3e3a8;
  border-radius: 8px;
  padding: 10px 14px;
  margin: 0 0 18px;
  color: #6b5a18;
  font-size: 13px;
  text-align: left;
}

/* CTA wrapper centers the loading hint between the button and trust row */
.rd-step.helping-hands-landing .rd-cta-wrap {
  border-top: 1px solid #e3e8ef;
  margin-top: 28px;
  padding-top: 24px;
}
.rd-step.helping-hands-landing .rd-cta.continue-button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  box-shadow: none;
}
.rd-step.helping-hands-landing .helping-hands-loading-hint {
  font-size: 13px;
  color: #6b7a8c;
  font-style: italic;
  margin: 12px 0 0;
  text-align: center;
}
.rd-step.helping-hands-landing .rd-cta.continue-button:not(:disabled) ~ .helping-hands-loading-hint {
  display: none;
}

@media (max-width: 540px) {
  .rd-step.helping-hands-landing .rd-h1 { font-size: 22px; }
  .hh-partnership { gap: 14px; }
  .hh-partnership-logo { padding: 8px 12px; min-height: 52px; }
  .hh-partnership-logo img { height: 32px; }
  .hh-partnership-logo--ic img { height: 26px; }
  .rd-step.helping-hands-landing .helping-hands-prefill-summary {
    padding: 14px 16px;
  }
}