﻿:root{
      --brand-cream:#FFBBA4;
      --brand-soft:#FACDBE;
      --brand-beige:#E4D7C9;
      --brand-dark:#555555;
      --brand-ink:#555555;
      --brand-accent:#F18068;
      --brand-accent-2:#FC9878;
      --brand-border:#D1D3D5;

      --soft-border: rgba(85,85,85,.12);
      --soft-bg: #FBCCBE;
      --muted: rgba(85,85,85,.75);
      --muted2: rgba(85,85,85,.65);
    }
    body { background: #fff; }
    .nav-shadow{ box-shadow: 0 8px 20px rgba(0,0,0,.05); }
    .site-header .container{
      padding-top: .25rem;
      padding-bottom: .25rem;
    }
    .site-brand{ padding: 0; }
    .site-logo{
      height: 120px;
      width: auto;
      transition: height .2s ease, transform .2s ease;
    }
    .site-header.preload .site-logo{
      transition: none;
    }
    .site-header.shrink .container{
      padding-top: .1rem;
      padding-bottom: .1rem;
    }
    .site-header.shrink .site-logo{
      height: 70px;
      transform: translateY(0);
    }
    .card-soft{
      border: 1px solid var(--soft-border);
      box-shadow: 0 10px 30px rgba(0,0,0,.04);
      border-radius: 16px;
    }
    .rounded-2xl{ border-radius: 20px; }
    .badge-soft{
      background: rgba(250,205,190,.35);
      border: 1px solid rgba(85,85,85,.12);
      color: #162c28;
    }
    .muted{ color: var(--muted); }
    .small-muted{ color: var(--muted2); font-size:.92rem; }
    .divider{ height:1px; background: rgba(85,85,85,.12); }

    .btn-brand{
      background: var(--brand-accent);
      border-color: var(--brand-accent);
      color:#fff;
    }
    .btn-brand:hover,
    .btn-brand:focus{
      background: var(--brand-accent-2);
      border-color: var(--brand-accent-2);
      color:#fff;
    }
    /* Ensure primary action button always visible */
    #btnNext,
    #btnNext:hover,
    #btnNext:focus,
    #btnNext:active{
      background: var(--brand-accent) !important;
      border-color: var(--brand-accent) !important;
      color: #fff !important;
      opacity: 1 !important;
      visibility: visible !important;
    }
    #btnNext:hover,
    #btnNext:focus{
      background: var(--brand-accent-2) !important;
      border-color: var(--brand-accent-2) !important;
    }
    .btn-outline-brand{
      border-color: rgba(85,85,85,.35);
      color: var(--brand-dark);
    }
    .btn-outline-brand:hover{
      background: rgba(85,85,85,.10);
      border-color: rgba(85,85,85,.55);
      color: var(--brand-dark);
      opacity: 1;
    }
    /* Keep links/buttons visible on hover */
    a,
    a:visited { color: var(--brand-dark); }
    a:hover,
    a:focus { color: var(--brand-dark); text-decoration: underline; }
    .btn,
    .btn:hover,
    .btn:focus {
      text-decoration: none;
      opacity: 1 !important;
      visibility: visible !important;
    }
    .btn-brand:hover,
    .btn-brand:focus { color: #fff !important; }
    .btn-outline-brand:hover,
    .btn-outline-brand:focus { color: var(--brand-ink) !important; }
    .nav-link:hover,
    .nav-link:focus { color: var(--brand-dark); opacity: 1; }
    footer a { color: rgba(255,255,255,.78); text-decoration: none; }
    footer a:hover,
    footer a:focus { color: #fff; text-decoration: underline; }

    .wizard-step{ display:none; }
    .wizard-step.active{ display:block; }

    .step-pill{
      display:flex; gap:.75rem; align-items:flex-start;
      padding:.75rem .85rem; border-radius: 14px;
      border: 1px solid var(--soft-border);
      background: #fff;
      transition: .15s ease;
    }
    .step-pill:hover{ border-color: rgba(85,85,85,.22); }
    .step-pill.active{
      background: var(--soft-bg);
      border-color: rgba(85,85,85,.22);
    }
    .step-num{
      width: 30px; height: 30px; border-radius: 999px;
      display:grid; place-items:center;
      background: rgba(85,85,85,.12);
      color: var(--brand-dark);
      font-weight: 700;
      flex: 0 0 auto;
    }
    .step-pill.active .step-num{
      background: var(--brand-accent);
      color: #fff;
    }

    .progress { height: 10px; border-radius: 999px; }
    .progress-bar { border-radius: 999px; }

    .required::after{ content:" *"; color:#dc3545; }

    #wizardForm{
      color: #1f1f1f;
    }
    #wizardForm .muted,
    #wizardForm .small-muted{
      color: #2f2f2f !important;
    }
    #wizardForm .form-label,
    #wizardForm .form-check-label,
    #wizardForm .fw-semibold,
    #wizardForm h2,
    #wizardForm h3,
    #wizardForm h4{
      color: #181818;
    }
    #wizardForm .form-control,
    #wizardForm .form-select{
      color: #1b1b1b;
    }
    #wizardForm .form-control::placeholder{
      color: rgba(34,34,34,.72);
    }
    #wizardForm .review-box{
      color: #1f1f1f;
    }

    .sticky-aside{ position: sticky; top: 98px; }

    .review-box{
      border: 1px solid var(--soft-border);
      border-radius: 14px;
      padding: 14px;
      background: #fff;
    }

    .choice-tile{
      border:1px solid var(--soft-border);
      border-radius: 16px;
      padding: 16px;
      background: #fff;
      cursor: pointer;
      transition: .15s ease;
      height: 100%;
    }
    .choice-tile:hover{ border-color: rgba(85,85,85,.25); box-shadow: 0 10px 22px rgba(0,0,0,.04); }
    .choice-tile.active{ border-color: rgba(85,85,85,.35); background: var(--soft-bg); }
    .choice-tile.active,
    .choice-tile.active .small-muted{
      color: #1a1a1a;
    }
    .choice-tile.active .fw-semibold{
      color: #111;
    }
    .choice-tile label{
      transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
    }
    .choice-tile label.is-selected{
      background: #efe6d8;
      border-color: rgba(17,17,17,.45) !important;
      box-shadow: inset 0 0 0 1px rgba(17,17,17,.08);
    }

    .form-check-input[type="radio"]{
      border-color: #111;
    }
    .form-check-input[type="radio"]:checked{
      background-color: #111;
      border-color: #111;
    }
    .form-check-input[type="radio"]:focus{
      border-color: #111;
      box-shadow: 0 0 0 .25rem rgba(17,17,17,.2);
    }

    .pricing-table th, .pricing-table td{
      vertical-align: middle;
      font-size: .92rem;
    }

    .toast-container { z-index: 1080; }
    .hidden{ display:none !important; }

    .confidence-strip{
      display: grid;
      gap: 10px;
      grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
      margin-top: 6px;
    }
    .confidence-item{
      background: #fff8f5;
      border: 1px solid rgba(85,85,85,.16);
      border-radius: 12px;
      padding: 12px;
    }
    .confidence-value{
      font-weight: 700;
      color: #151515;
      margin-bottom: 4px;
      letter-spacing: .2px;
    }
    .id-proof-sample{
      border: 1px solid rgba(85,85,85,.2);
      background: #fff8f5;
      border-radius: 12px;
      padding: 12px;
    }
    .id-proof-sample-head{
      font-size: .86rem;
      font-weight: 700;
      color: #141414;
      margin-bottom: 8px;
      letter-spacing: .2px;
      text-transform: uppercase;
    }
    .id-proof-sample-img{
      width: 100%;
      max-width: 360px;
      border-radius: 10px;
      border: 1px solid rgba(17,17,17,.2);
      display: block;
      background: #fff;
    }

    .bmi-panel{
      border: 1px solid #d5c8bc;
      border-radius: 14px;
      background: linear-gradient(180deg, #fff8f3 0%, #fff 100%);
      padding: 14px;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
    }
    .bmi-kicker{
      font-size: .8rem;
      font-weight: 700;
      letter-spacing: .4px;
      text-transform: uppercase;
      color: #343434;
      margin-bottom: 6px;
    }
    .bmi-value-line{
      display: flex;
      align-items: baseline;
      gap: 8px;
    }
    .bmi-value{
      font-size: 1.9rem;
      font-weight: 800;
      line-height: 1;
      color: #0f0f0f;
    }
    .bmi-unit{
      font-size: .82rem;
      color: rgba(20,20,20,.86);
      font-weight: 700;
    }
    .bmi-category{
      display: inline-flex;
      align-items: center;
      border-radius: 999px;
      padding: .26rem .7rem;
      font-size: .78rem;
      font-weight: 700;
      letter-spacing: .2px;
      border: 1px solid transparent;
      margin-bottom: 4px;
    }
    .bmi-category.neutral{ background: #fff; border-color: rgba(85,85,85,.2); color: #3a3a3a; }
    .bmi-category.under{ background: #e9f4ff; border-color: #b6d8ff; color: #0a4f93; }
    .bmi-category.healthy{ background: #e9f8ef; border-color: #b9e7c7; color: #1f6b2f; }
    .bmi-category.over{ background: #fff4e8; border-color: #ffd3ab; color: #8b4c0a; }
    .bmi-category.obesity{ background: #ffe9e8; border-color: #ffc6c3; color: #8f1912; }
    .bmi-graph-wrap{
      margin-top: 10px;
    }
    .bmi-graph{
      position: relative;
      display: grid;
      grid-template-columns: 12% 22% 17% 49%;
      border-radius: 10px;
      overflow: hidden;
      border: 1px solid rgba(35,35,35,.24);
      min-height: 74px;
      background: #fff;
    }
    .bmi-segment{
      font-size: .76rem;
      line-height: 1.2;
      padding: 9px 6px;
      color: #151515;
      text-align: center;
      border-right: 1px solid rgba(35,35,35,.18);
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 3px;
      font-weight: 700;
    }
    .bmi-segment span{
      font-weight: 700;
      font-size: .7rem;
    }
    .bmi-segment.under{ background: #e9f4ff; }
    .bmi-segment.healthy{ background: #e9f8ef; }
    .bmi-segment.over{ background: #fff4e8; }
    .bmi-segment.obesity{
      background: #ffe9e8;
      border-right: 0;
    }
    .bmi-marker{
      position: absolute;
      top: -2px;
      transform: translateX(-50%);
      pointer-events: none;
    }
    .bmi-marker::before{
      content: "";
      display: block;
      width: 2px;
      height: 78px;
      background: #111;
      opacity: .78;
      margin: 0 auto;
    }
    .bmi-marker span{
      position: absolute;
      top: -20px;
      left: 50%;
      transform: translateX(-50%);
      background: #111;
      color: #fff;
      font-size: .68rem;
      font-weight: 700;
      padding: 2px 6px;
      border-radius: 999px;
      white-space: nowrap;
    }
    #bmiPanel .small-muted{
      color: #2b2b2b !important;
      font-weight: 500;
    }
    @media (max-width: 767.98px){
      .bmi-graph{
        grid-template-columns: 1fr;
        min-height: 0;
      }
      .bmi-segment{
        border-right: 0;
        border-bottom: 1px solid rgba(35,35,35,.16);
        padding: 8px 10px;
      }
      .bmi-segment.obesity{
        border-bottom: 0;
      }
      .bmi-marker{
        display: none !important;
      }
    }

    .outcome-projection{
      border: 1px solid var(--soft-border);
      border-radius: 14px;
      background: #fffdfb;
      padding: 14px;
      color: #1a1a1a;
    }
    .outcome-projection .fw-semibold,
    .outcome-projection .form-label{
      color: #161616;
    }
    .outcome-projection .small-muted,
    .outcome-projection #projectionSummary{
      color: #2a2a2a !important;
    }
    .projection-chart{
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      align-items: end;
      gap: 8px;
      height: 132px;
      padding: 10px;
      border-radius: 12px;
      border: 1px solid rgba(85,85,85,.12);
      background: linear-gradient(180deg, #fff8f4 0%, #fff 100%);
    }
    .projection-bar{
      border-radius: 8px 8px 5px 5px;
      background: linear-gradient(180deg, #f4a58f 0%, #f18068 100%);
      min-height: 14px;
      position: relative;
      transition: height .25s ease;
    }
    .projection-bar::after{
      content: attr(data-label);
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      bottom: -22px;
      font-size: .72rem;
      color: rgba(40,40,40,.9);
      white-space: nowrap;
    }

    .trust-proof{
      border: 1px solid var(--soft-border);
      border-radius: 14px;
      background: #fff;
      padding: 14px;
      overflow: hidden;
    }
    .auto-slider{
      overflow: hidden;
      width: 100%;
      position: relative;
    }
    .auto-slider-track{
      display: flex;
      gap: 0;
      width: max-content;
      animation: auto-slide-loop 38s linear infinite;
      will-change: transform;
    }
    .auto-slider-group{
      display: flex;
      gap: 12px;
      padding-right: 12px;
      box-sizing: border-box;
    }
    .auto-slider-images .auto-slider-track{
      animation-duration: 27s;
    }
    .auto-slide{
      flex: 0 0 clamp(230px, 30vw, 320px);
    }
    .testimonial-card{
      border: 1px solid rgba(85,85,85,.14);
      border-radius: 12px;
      background: #fff9f5;
      padding: 12px;
      height: 100%;
      color: #1c1c1c;
    }
    .testimonial-card p{
      font-size: .92rem;
      line-height: 1.45;
    }

    .before-after{
      border: 1px solid var(--soft-border);
      border-radius: 14px;
      background: #fff;
      padding: 14px;
      overflow: hidden;
    }
    .ba-card{
      border: 1px solid rgba(85,85,85,.14);
      border-radius: 12px;
      overflow: hidden;
      background: #fff;
    }
    .auto-slider-images .auto-slide{
      flex-basis: clamp(250px, 38vw, 420px);
    }
    .ba-card img{
      width: 100%;
      height: 220px;
      object-fit: contain;
      object-position: center;
      background: #f5f5f5;
      padding: 4px;
      display: block;
    }
    .ba-caption{
      font-size: .85rem;
      color: #2f2f2f;
      padding: 8px 10px;
      background: #fff8f4;
      border-top: 1px solid rgba(85,85,85,.12);
    }

    .payment-summary-title{
      font-size: 1.32rem;
      font-weight: 800;
      color: #111;
      letter-spacing: .2px;
    }
    .payment-summary-grid{
      display: grid;
      gap: 10px;
    }
    .payment-summary-row{
      display: grid;
      grid-template-columns: minmax(90px, 160px) 1fr;
      gap: 10px;
      align-items: start;
      border-bottom: 1px dashed rgba(85,85,85,.2);
      padding-bottom: 8px;
    }
    .payment-summary-label{
      color: #2a2a2a;
      font-weight: 700;
      font-size: 1rem;
    }
    .payment-summary-value{
      color: #111;
      font-weight: 700;
      font-size: 1.03rem;
      line-height: 1.35;
      word-break: break-word;
    }
    .payment-summary-total{
      border-bottom: none;
      margin-top: 2px;
      padding-top: 2px;
    }
    .payment-summary-total .payment-summary-label,
    .payment-summary-total .payment-summary-value{
      font-size: 1.16rem;
      color: #000;
      font-weight: 800;
    }

    .payment-form-shell{
      background: linear-gradient(180deg, #fff 0%, #fff8f4 100%);
    }
    .payment-form-title{
      font-size: 1.15rem;
      font-weight: 800;
      color: #111;
      margin-bottom: 2px;
    }
    .payment-form-subtitle{
      color: #2f2f2f;
      font-size: .95rem;
    }
    .payment-form-trust{
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }
    .payment-trust-pill{
      display: inline-flex;
      align-items: center;
      border: 1px solid rgba(85,85,85,.24);
      border-radius: 999px;
      padding: 5px 10px;
      font-size: .8rem;
      font-weight: 700;
      color: #1d1d1d;
      background: #fff;
    }
    .payment-fields-wrap{
      border: 1px solid rgba(85,85,85,.15);
      border-radius: 12px;
      background: #fff;
      padding: 12px;
      min-height: 132px;
    }
    #payment_submit{
      font-size: 1rem;
      font-weight: 700;
      letter-spacing: .2px;
      padding-top: .7rem;
      padding-bottom: .7rem;
    }
    @keyframes auto-slide-loop{
      from { transform: translateX(0); }
      to { transform: translateX(-50%); }
    }
    @media (max-width: 767.98px){
      .auto-slide{
        flex-basis: 80vw;
      }
      .auto-slider-images .auto-slide{
        flex-basis: 88vw;
      }
    }






