/* —— Blue + Gold CTA (responsive) —— */
:root{
    --kings-blue:#1f3b73;
    --kings-blue-600:#182f5b;
    --kings-gold:#f4c256;
}
.mini-cta{
    display:flex; gap:12px; align-items:center; justify-content:space-between; flex-wrap:wrap;
    background: linear-gradient(135deg, var(--kings-blue), var(--kings-blue-600));
    color:#fff;
    border:1px solid rgba(255,255,255,.15);
    border-radius:22px;
    padding:14px 18px;
    box-shadow:0 12px 30px rgba(13,27,42,.18);
}
.mini-cta__row{ display:flex; align-items:center; gap:10px; flex:1 1 auto; min-width:240px; }
.mini-cta__pill{
    display:inline-flex; align-items:center; justify-content:center;
    padding:6px 10px; border-radius:999px; font-weight:900; font-size:.78rem; letter-spacing:.08em;
    background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.35); color:#fff;
}
.mini-cta__text{ opacity:.95 }
.mini-cta__actions{ display:flex; gap:10px; flex:0 0 auto; min-width:220px; }
.btn-gold{
    background:var(--kings-gold); border-color:var(--kings-gold); color:#1b1b1b; font-weight:800; border-radius:12px;
}
.btn-gold:hover{ background:#e9b441; border-color:#e9b441; color:#131313; }
.btn-ghost-light{
    background:transparent; color:#fff; border:1px solid rgba(255,255,255,.7); font-weight:800; border-radius:12px;
}
.btn-ghost-light:hover{ background:rgba(255,255,255,.12); color:#fff; }

/* Mobile */
@media (max-width:576px){
    .mini-cta{ padding:12px; }
    .mini-cta__text{ font-size:14px; line-height:1.35; }
    .mini-cta__actions{ width:100%; }
    .mini-cta__actions .btn{ width:100%; }
}

/* --- Plan Scope Chips (reusable) --- */
.plan-scope{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:10px 0 14px }
.plan-scope__eyebrow{ font-size:.75rem; text-transform:uppercase; letter-spacing:.12em; color:var(--muted,#5a6886); font-weight:800; margin-right:2px }
.plan-chip{
    display:inline-flex; align-items:center; gap:6px; padding:7px 10px; border-radius:999px; font-weight:800; font-size:.8rem;
    border:1px solid; background:#fff;
}
.scope-silver{ color:#415167; border-color:#dbe6f2; background:#f5f8fc }
.scope-gold  { color:#8a6b1f; border-color:#ecd89e; background:#fff8e6 }
.scope-plat  { color:#0c4c74; border-color:#bfe6ff; background:#eef9ff }
:root{
    --brand:#1f3b73; /* primary */
    --brand-600:#16315e; /* hover/darken */
    --brand-50:#eef3ff; /* subtle tint */
    --ink:#0f172a; /* text */
    --muted:#6b7280; /* secondary text */
    --surface:#ffffff; /* cards */
    --surface-alt:#f7f9fc; /* page bg tint */
    --ring:rgba(31,59,115,.25); /* focus ring */
    --shadow:0 12px 30px rgba(16,24,40,.08),0 2px 8px rgba(16,24,40,.05);
}
*{box-sizing:border-box}
html,body{height:100%}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--surface-alt);}

/* ===== Activation banner mobile polish ===== */
@media (max-width: 576px) {
    /* Hide the calendar icon on small screens */
    .activation-banner__icon {
        display: none !important;
    }

    /* Stack content cleanly */
    .activation-banner__content {
        flex-direction: column;
        align-items: stretch !important;
        gap: 12px !important;
    }

    /* Let text span full width without getting pushed right */
    #alertImmediateActivation .min-w-0 {
        min-width: 0;
    }

    /* Nudge the eyebrow and pill for readability */
    .activation-banner__eyebrow {
        display: block;
        margin-bottom: 4px;
    }

    .activation-banner__pill {
        display: inline-block;
        margin-top: 2px;
    }

    /* Center the button + make it full-width on mobile */
    #containerActivateImmediatelyBtn {
        width: 100%;
        justify-content: center !important; /* center the button */
    }

    #containerActivateImmediatelyBtn .activation-banner__btn {
        width: 100%;
        max-width: 420px; /* keep it tasteful */
    }
}

/* Small tablet refinement */
@media (min-width: 577px) and (max-width: 768px) {
    #containerActivateImmediatelyBtn {
        width: 100%;
        justify-content: flex-end; /* right align on small tablets */
    }
}


/* ---- Global rhythm ---- */
.section{padding:72px 0}
@media (max-width: 991.98px){.section{padding:56px 0}}
.container{max-width:1140px}


/* ---- Navbar tweaks ---- */
.navbar{--bs-navbar-padding-y: .9rem;border-bottom:1px solid #edf1f7;background:#fff}
.navbar-brand{letter-spacing:.2px}
.navbar .btn{border-radius:999px}
.brand-badge{display:inline-grid;place-items:center;width:36px;height:36px;background:var(--brand-50);border-radius:12px}


/* ---- Hero ---- */
.hero{position:relative;isolation:isolate}
.hero::before{content:"";position:absolute;inset:-20% 0 auto -20%;height:60%;background:radial-gradient(60% 60% at 15% 20%, rgba(31,59,115,.15) 0%, rgba(31,59,115,0) 70%),
linear-gradient(180deg,#fff 0%,#f6f9ff 100%);z-index:-1}
.hero .display-4,.hero .title{font-weight:800;letter-spacing:-.02em}
.hero .text-primary,.hero .accent{color:var(--brand)!important}
.hero .lead{color:var(--muted);font-size:1.125rem;max-width:62ch}


/* Pills list */
ul.pills, .pills{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 0;padding:0;list-style:none}
.pill, ul.pills li{padding:8px 12px;border-radius:999px;background:#f4f7ff;border:1px solid #e6ecff;font-weight:600;font-size:.9rem;color:#223}


/* Card (glass-lite) */
.hero .card,.hero-card{background:linear-gradient(180deg,#ffffff, #f9fbff);border:1px solid #e7ecf8;border-radius:22px;box-shadow:var(--shadow)}
.hero .card-body,.hero-card{padding:28px}


/* Buttons */
.btn-primary{--bs-btn-bg:var(--brand);--bs-btn-border-color:var(--brand);--bs-btn-hover-bg:var(--brand-600);--bs-btn-hover-border-color:var(--brand-600);--bs-btn-active-bg:var(--brand-600)}
.btn-outline-primary{--bs-btn-color:var(--brand);--bs-btn-border-color:var(--brand);--bs-btn-hover-bg:var(--brand-50);--bs-btn-hover-border-color:var(--brand)}
.btn{box-shadow:0 1px 2px rgba(16,24,40,.04)}
.btn:focus{outline:3px solid transparent;box-shadow:0 0 0 4px var(--ring)}
.btn-tiny{
    padding: 0 4px;
    font-size: 0.75rem;
    line-height: 1;
}

/* Feature tiles */
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:992px){.features{grid-template-columns:repeat(2,1fr)}}
@media (max-width:576px){.features{grid-template-columns:1fr}}
.feature{display:flex;gap:14px;padding:18px;border:1px solid #e8eefb;border-radius:16px;background:var(--surface);transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease}
.feature:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:#dbe6ff}
.feature .k{min-width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:var(--brand-50);font-weight:800;color:var(--brand)}
.feature strong{font-weight:700}
.feature div div{color:var(--muted)}


/* Pricing / cards */
.pricing-card{border:1px solid #e8eefb;border-radius:20px;padding:24px;background:var(--surface);box-shadow:var(--shadow)}
.price-xl{font-size:3rem;font-weight:800;letter-spacing:-.02em}
.per{color:var(--muted)}


/* Tables */
.table.cover{--bs-table-bg:#fff;border:1px solid #eef2ff;border-radius:16px;overflow:hidden}
.table thead th{background:#f7f9ff}


/* Footer */
.site-footer{background:#f7f9fc;border-top:1px solid #edf1f7}


/* Utilities */
.shadow-soft{box-shadow:var(--shadow)}
.py-xxl-6{padding-top:6rem!important;padding-bottom:6rem!important}
/* How it works */
.step-dot {
    width: 44px; height: 44px; border-radius: 999px;
    display:flex; align-items:center; justify-content:center;
    font-size: 1.1rem;
}
.icon-wrap { font-size: 1.6rem; line-height: 1; }

.timeline { position: relative; margin-left: 1.5rem; }
.timeline::before {
    content: ""; position: absolute; left: 14px; top: 0; bottom: 0;
    width: 2px; background: rgba(31,59,115,.15);
}
.timeline-item { position: relative; margin-bottom: 1.5rem; }
.timeline-marker {
    position: absolute; left: -3px; top: .75rem;
    width: 32px; height: 32px; border-radius: 50%;
    background: #eef3ff; color: #1f3b73; display:flex; align-items:center; justify-content:center;
    font-weight: 700;
    box-shadow: 0 0 0 4px #fff;
}
.timeline-card { margin-left: 2.5rem; }

.icon-badge {
    width: 48px; height: 48px; border-radius: 14px;
    display:inline-flex; align-items:center; justify-content:center;
    background: #eef3ff; color: #1f3b73; font-size: 1.25rem;
}

.fake-disabled {
    background-color: #e9ecef;
    opacity: 1;
    cursor: not-allowed;
}
.fake-disabled:focus {
    background-color: #e9ecef !important;
    border-color: #dee2e6 !important;
    box-shadow: none !important;
    cursor: not-allowed;
}

/* Small polish */
.accordion { border-radius: 1rem; overflow: hidden; }
.accordion-button { font-weight: 600; }


/* Text Colors */

.text-blue {
    color: #1f77ff;      /* base blue */
}
.text-blue-light {
    color: #66b3ff;      /* lighter blue */
}
.text-blue-dark {
    color: #16315e;      /* darker blue */
}

.text-green {
    color: #28a745;      /* base green */
}
.text-green-light {
    color: #71d48a;      /* lighter green */
}
.text-green-dark {
    color: #1e7e34;      /* darker green */
}

.text-red {
    color: #dc3545;      /* base red */
}
.text-red-light {
    color: #f08080;      /* lighter red */
}
.text-red-dark {
    color: #a71d2a;      /* darker red */
}

/* —— Member Card: neutral, compact, with outer well —— */
.member-well{
    background:#f7f5f1;              /* warm neutral (not blue) */
    border:1px solid #e8e2d8;
    border-radius:16px;
    padding:14px;
    box-shadow:0 10px 28px rgba(34,34,34,.06);
}
.health-card{
    position:relative;
    background:linear-gradient(180deg,#fff, #fbfbfb);
    border:1px solid #e8e8e8;
    border-radius:12px;
    padding:14px;
    max-width:460px;                  /* smaller */
    margin:0 auto;
    box-shadow:0 6px 18px rgba(0,0,0,.05);
    color:#142033;
}
.hc-stripe{                          /* subtle “security” stripe */
    height:6px;
    border-radius:8px 8px 0 0;
    background:
            repeating-linear-gradient(90deg,#e9e4da 0 12px,#dcd6cb 12px 24px);
    margin:-14px -14px 12px -14px;
}
.hc-row{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.hc-label{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#6b7687}
.hc-value{font-weight:700;color:#1a2740;font-size:14px}
.hc-mono{font-family:ui-monospace,Menlo,Consolas,monospace}
.hc-divider{height:1px;background:linear-gradient(90deg,#eee,transparent);margin:10px 0}
.hc-badge{
    display:inline-flex;align-items:center;gap:6px;
    background:#eef6f0;border:1px solid #d7eadc;color:#1b5e2a;
    padding:4px 8px;border-radius:999px;font-size:11px;font-weight:600;
}
.hc-dot{width:7px;height:7px;border-radius:50%;background:#28a745;display:inline-block}
.hc-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:576px){ .hc-list{grid-template-columns:1fr} }
.hc-help{font-size:12px;color:#475675;line-height:1.35}
/* Activation banner (Kings blue theme) */
.activation-banner{
    position:relative;
    border-radius:20px;
    padding:20px 22px;
    color:#fff;
    overflow:hidden;
    border:1px solid rgba(255,255,255,0.08);
    box-shadow:0 10px 24px rgba(31,59,115,0.18);
    background:
            radial-gradient(1200px 400px at 85% -50%, rgba(212,160,46,0.25) 0%, rgba(212,160,46,0) 60%),
            linear-gradient(135deg,#264987 0%,#1f3b73 55%,#1b3466 100%);
}

/* subtle texture layer */
.activation-banner__bg{
    position:absolute; inset:0;
    background:
            radial-gradient(120px 60px at 15% 120%, rgba(255,255,255,0.08), transparent 70%),
            radial-gradient(160px 80px at 85% 0%, rgba(255,255,255,0.06), transparent 70%);
    pointer-events:none;
}

.activation-banner__content{ position:relative; z-index:1; }

.activation-banner__icon{
    width:48px; height:48px; flex:0 0 48px;
    display:grid; place-items:center;
    border-radius:14px;
    color:#fff;
    background:linear-gradient(135deg, rgba(255,255,255,0.18), rgba(255,255,255,0.05));
    border:1px solid rgba(255,255,255,0.18);
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.25), 0 6px 18px rgba(0,0,0,0.15);
}

.activation-banner__eyebrow{
    font-size:12px; letter-spacing:.14em; text-transform:uppercase;
    color:rgba(255,255,255,0.7);
    margin-bottom:4px;
}

.activation-banner__pill{
    display:inline-block;
    line-height:1;
    padding:8px 12px;
    border-radius:999px;
    background:rgba(255,255,255,0.14);
    border:1px solid rgba(212,160,46,0.65);            /* gold accent */
    box-shadow:0 4px 14px rgba(212,160,46,0.25);
    margin-left:6px;
    font-weight:700;
    color:#fff;
    backdrop-filter:saturate(140%) blur(2px);
}

/* CTA aligns with your blue brand and "blue buttons" preference */
.activation-banner__btn{
    --kings-blue:#1f3b73;
    background:#fff;
    color:var(--kings-blue);
    border:1px solid rgba(255,255,255,0.7);
    padding:10px 16px;
    border-radius:14px;
    font-weight:600;
    transition:transform .12s ease, box-shadow .12s ease, background-color .12s ease;
    box-shadow:0 10px 18px rgba(0,0,0,0.15);
}
.activation-banner__btn:hover{
    transform:translateY(-1px);
    box-shadow:0 12px 22px rgba(0,0,0,0.18);
    background:#f7f9ff;
}

/* Responsive: stack nicely on small screens */
@media (max-width: 576px){
    .activation-banner{ padding:16px 14px; }
    .activation-banner__icon{ width:42px; height:42px; border-radius:12px; }
    .activation-banner__btn{ width:100%; border-radius:12px; }
    .activation-banner__pill{ padding:7px 10px; }
}

/* Force Set */
/* ---------- HOVER COLOR FIXES (place at the very end of your CSS) ---------- */

/* Base link colors */
:root {
    --link: var(--brand);
    --link-hover: var(--brand-600);
}

/* Links (non-buttons) */
a:not(.btn):not([class*="btn"]) {
    color: var(--link);
    text-decoration: none;
}
a:not(.btn):not([class*="btn"]):hover,
a:not(.btn):not([class*="btn"]):focus {
    color: var(--link-hover);
    text-decoration: underline;
}

/* Ghost / Outline buttons should NOT flip text to white on hover */
.btn-ghost {
    color: var(--brand);
    background: #f6f8fd;
    border: 1px solid #e6ecf5;
}
.btn-ghost:hover,
.btn-ghost:focus {
    color: var(--brand);
    background: var(--brand-50);
    border-color: var(--brand);
}

/* Outline primary: keep brand text color on hover */
.btn-outline-primary:hover,
.btn-outline-primary:focus {
    color: var(--brand);
    background: var(--brand-50);
    border-color: var(--brand);
}

/* Nav links, dropdown items, table links, etc. */
.nav-link:hover,
.nav-link:focus,
.dropdown-item:hover,
.dropdown-item:focus,
.table a:not([class*="btn"]):hover,
.table a:not([class*="btn"]):focus,
.cardx a:not([class*="btn"]):hover,
.cardx a:not([class*="btn"]):focus,
.feature:hover a:not([class*="btn"]),
.feature:focus a:not([class*="btn"]) {
    color: var(--brand) !important;
}

/* Feature/card hovers should not force white text */
.feature:hover,
.feature:focus,
.cardx:hover,
.cardx:focus {
    color: inherit; /* keep the original text color */
}

/* Keep primary/brand buttons white text (intended) */
.btn-primary,
.btn-brand {
    color: #fff;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-brand:hover,
.btn-brand:focus {
    color: #fff; /* still white on brand buttons */
}
/* Brand buttons: dark blue background, white text normally */
.btn-primary,
.btn-brand {
    background: var(--brand);
    border-color: var(--brand);
    color: #fff;
}

/* On hover: lighter blue background, keep text white */
.btn-primary:hover,
.btn-brand:hover {
    background: var(--brand-600);   /* your lighter/darker shade */
    border-color: var(--brand-600);
    color: #fff; /* keep text white */
}

/* Optional: an even lighter shade if you want a visible hover lift */
.btn-primary:hover,
.btn-brand:hover {
    background: #2a4d91; /* tweak this hex if var(--brand-600) is too dark */
}
/* White text on dark backgrounds */
.navbar .nav-link:hover,
.navbar .nav-link:focus,
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus,
.btn-brand .nav-link:hover,
.btn-brand .nav-link:focus {
    color: #2a4d91 !important; /* obtained from .btn-brand:hover */
}
/* Brand blue on hover for light background links */
.table a:not([class*="btn"]):hover,
.table a:not([class*="btn"]):focus,
.cardx a:not([class*="btn"]):hover,
.cardx a:not([class*="btn"]):focus,
.feature:hover a:not([class*="btn"]),
.feature:focus a:not([class*="btn"]) {
    color: var(--brand) !important;
}

/* Overlay */
.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1019;
    inset: 0;
    pointer-events: all;
    outline: none;
}
.overlay.hidden {
    display: none;
}
.fixed-overlay {
    position: fixed;
    width: 100vw;
    height: 100vh;
    z-index: 1030;
}
.spinner {
    width: 50px;
    height: 50px;
    border: 6px solid #ccc;
    border-top-color: #333;
    border-radius: 50%;
    animation: spin 1s linear infinite;
    outline: none;
    pointer-events: none;
    user-select: none;
}
.spinner:focus {
    outline: none;
}
@keyframes spin {
    to { transform: rotate(360deg); }
}

/* Positioning */
.position-relative {
    position:relative !important;
}
.position-fixed {
    position: fixed !important;
}

/* width utilities */
.min-w-0 {
    min-width: 0 !important;
}
.w-10  { width: 10% !important; }
.w-20  { width: 20% !important; }
.w-30  { width: 30% !important; }
.w-40  { width: 40% !important; }
.w-50  { width: 50% !important; }
.w-60  { width: 60% !important; }
.w-70  { width: 70% !important; }
.w-80  { width: 80% !important; }
.w-90  { width: 90% !important; }
.w-100 { width: 100% !important; }

/* === Normalize Bootstrap button states to Kings blue (place at very end) === */
.btn-primary{
    --bs-btn-bg: var(--brand);
    --bs-btn-border-color: var(--brand);
    --bs-btn-hover-bg: var(--brand-600);
    --bs-btn-hover-border-color: var(--brand-600);
    --bs-btn-active-bg: var(--brand-600);
    --bs-btn-active-border-color: var(--brand-600);
    --bs-btn-disabled-bg: var(--brand);
    --bs-btn-disabled-border-color: var(--brand);
    --bs-btn-focus-shadow-rgb: 31,59,115; /* matches --brand */
    color: #fff;
}

/* Outline version: keep text blue, fix active “off blue” */
.btn-outline-primary{
    --bs-btn-color: var(--brand);
    --bs-btn-border-color: var(--brand);
    --bs-btn-hover-bg: var(--brand-50);
    --bs-btn-hover-border-color: var(--brand);
    --bs-btn-active-bg: var(--brand-50);
    --bs-btn-active-border-color: var(--brand);
    --bs-btn-focus-shadow-rgb: 31,59,115;
    color: var(--brand);
}

/* Optional: unify focus ring */
.btn:focus, .btn:focus-visible{
    box-shadow: 0 0 0 .25rem rgba(31,59,115,.25);
}

/* Mobile tap highlight (iOS/Android) */
.btn, a.btn { -webkit-tap-highlight-color: rgba(31,59,115,.15); }