/* Gutenberg integration and responsive refinements to the supplied draft. */
.wp-site-blocks { padding: 0; overflow-x: clip; }
.wp-site-blocks > *, .draft-content, .draft-content > *, .wp-block-template-part { margin-block: 0; }
.draft-content { max-width: none; }
.wrap > *, .layout > *, .prose > *, .p-hero .wrap > *, .fgrid > * { min-width: 0; }
.btn { max-width: 100%; white-space: normal; text-align: center; }
.toc { max-width: 100%; }
.toc ol { max-width: 100%; }
.fgrid p { overflow-wrap: anywhere; }
.standard-page { min-height: 55vh; padding: 64px 24px 80px; }
.standard-page > h1 { margin-bottom: 28px; font-size: 48px; }
.standard-page .wp-block-post-content > p { margin-bottom: 24px; }
.wp-block-heading { color: inherit; }
h1,h2,h3,h4,h5,h6,.logo { letter-spacing: 0; }
.hero h1 { font-size: 76px; }
.p-hero h1 { font-size: 62px; }
.sec-head h2 { font-size: 48px; }
.lede { font-size: 19px; }
.prose h2 { font-size: 38px; }
.prose section { padding-block: 0; }
.ambient,.aurora::before,.aurora::after,.sun { display: none; }
.hero-card,.concern,.pcard,.card,.product,.trainer,.callout,.vs .col,.related a,.sample,.vi { border-radius: 8px; }
.hero-card { box-shadow: none; }
.hero .wrap { gap: 36px; }
.hero { padding-top: 54px; padding-bottom: 64px; }
.quick button { display: block; position: relative; padding-right: 32px; }
.quick button > span:last-child { position: absolute; right: 14px; top: 18px; }
.hero-visual svg { width: 100%; height: auto; }
.tbl-wrap { max-width: 100%; overflow-x: auto; }
.hdr > .wrap { gap: 20px; }
.nav { gap: 20px; }
.hdr .logo { white-space: nowrap; }
.logo { gap: 0; }
.logo > i { margin-right: 8px; }
.im-assessment { width: min(640px, calc(100% - 24px)); max-height: calc(100dvh - 40px); margin: auto; padding: 28px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); color: var(--ink); overflow: hidden; }
.im-assessment[open] { display: flex; flex-direction: column; }
.im-dialog-top, .im-assessment progress { flex-shrink: 0; }
#im-assessment-body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--muted) transparent; padding-right: 8px; }
.im-assessment::backdrop { background: rgb(0 0 0 / 75%); }
.im-dialog-top { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 24px; }
.im-dialog-top > span { font-family: var(--display); font-size: 22px; font-weight: 700; }
.im-dialog-top button { width: 40px; height: 40px; border: 1px solid var(--line); background: transparent; color: inherit; border-radius: 4px; font-size: 20px; }
.im-assessment progress { width: 100%; height: 6px; accent-color: var(--brand); margin-bottom: 26px; }
.im-assessment h2 { font-size: 32px; margin: 12px 0; }
.im-assessment .im-help { color: var(--muted); margin-bottom: 24px; }
.im-options { display: grid; gap: 10px; margin: 24px 0; }
.im-options label { display: flex; align-items: center; gap: 12px; padding: 14px; border: 1px solid var(--line); border-radius: 4px; cursor: pointer; }
.im-options label:has(input:checked) { border-color: var(--brand); background: var(--surface); }
.im-options input { width: 18px; height: 18px; accent-color: var(--brand); flex-shrink: 0; }
.im-actions { position: sticky; bottom: 0; display: flex; justify-content: space-between; gap: 12px; margin-top: 24px; padding-block: 16px 4px; background: var(--bg); }
.im-assessment .im-error { color: #ffafa0; }
.im-result { padding-block: 20px; }
.im-result p { margin-bottom: 18px; }
.im-result ul { padding-left: 22px; color: var(--muted); }
.im-result .btn { margin-top: 24px; }
.im-enquiry-fields label { display: block; font-size: 15px; }
.im-enquiry-fields input:not([type="checkbox"]):not([type="submit"]) { display: block; box-sizing: border-box; width: 100%; margin-top: 6px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 4px; background: var(--surface); color: var(--ink); font: inherit; }
.im-enquiry-fields .wpcf7-list-item { margin: 0; }
.im-enquiry-fields .wpcf7-acceptance label { display: flex; align-items: flex-start; gap: 10px; }
.im-enquiry-fields input[type="checkbox"] { flex-shrink: 0; margin-top: 5px; }
.im-enquiry-fields .wpcf7-submit { padding: 12px 22px; border: 0; border-radius: 4px; background: var(--ink); color: var(--bg); font: inherit; font-weight: 700; cursor: pointer; }
.im-enquiry-fields .wpcf7-submit:disabled { opacity: .6; cursor: wait; }
.im-assessment .btn { white-space: normal; text-align: center; }
html { scrollbar-gutter: stable; }
html:has(.im-assessment[open]), body:has(.im-assessment[open]) { overflow: hidden; }
.hdr a[aria-current="page"] { color: var(--ink); }
@media (max-height: 760px) {
    .im-assessment[open] { padding: 18px; max-height: calc(100dvh - 24px); }
    .im-assessment .im-dialog-top { margin-bottom: 12px; }
    .im-assessment progress { margin-bottom: 12px; }
    .im-assessment h2 { font-size: 28px; margin-block: 8px; }
    .im-assessment .im-help { margin-bottom: 10px; font-size: 16px; line-height: 1.4; }
    .im-assessment .im-options { gap: 8px; margin-block: 14px; }
    .im-assessment .im-options label { min-height: 44px; padding: 9px 12px; font-size: 16px; line-height: 1.4; }
    .im-assessment .im-actions { margin-top: 10px; padding-block: 4px 0; }
    .im-assessment .btn { min-height: 44px; padding: 10px 20px; }
}
.im-assessment.im-tight { padding: 12px; }
.im-assessment.im-tight .im-dialog-top { margin-bottom: 8px; }
.im-assessment.im-tight .im-dialog-top button { width: 32px; height: 32px; }
.im-assessment.im-tight progress { height: 4px; margin-bottom: 8px; }
.im-assessment.im-tight h2 { font-size: 22px; line-height: 1.15; margin-block: 6px; }
.im-assessment.im-tight .im-help { font-size: 15px; line-height: 1.3; margin-bottom: 6px; }
.im-assessment.im-tight .im-options { gap: 4px; margin-block: 8px; }
.im-assessment.im-tight .im-options label { min-height: 36px; padding: 6px 10px; font-size: 15px; line-height: 1.3; }
.im-assessment.im-tight .im-actions { margin-top: 6px; padding-top: 0; }
@media (max-width: 1100px) { .hero h1 { font-size: 64px; } .hdr .wrap { gap: 14px; } .nav { gap: 14px; } .hdr .btn { padding-inline: 14px; } }
@media (max-width: 900px) { .hero h1 { font-size: 56px; } .p-hero h1 { font-size: 48px; } .hero-side { max-width: 620px; width: 100%; margin-inline: auto; } .hero .wrap { gap: 32px; } .hdr .nav.open { z-index: 60; } }
@media (max-width: 960px) { .layout { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 600px) { .hero h1 { font-size: 42px; } .p-hero h1 { font-size: 38px; } .sec-head h2 { font-size: 34px; } .prose h2 { font-size: 30px; } .lede { font-size: 17px; } .hero { padding-block: 40px; } .hero h1 em { white-space: normal; } .hero-card { padding: 20px; } .hero-cta .btn { width: 100%; text-align: center; padding-inline: 18px; } .im-assessment { padding: 20px; } .im-assessment h2 { font-size: 28px; } .standard-page > h1 { font-size: 38px; } .standard-page { padding-block: 40px; } }

/* ==========================================================================
   MEDICATION PRICING & CUSTOMER JOURNEY (Liquid Glass & Modern Healthcare UI)
   ========================================================================== */

.im-med-pricing-section {
    padding-block: clamp(32px, 5vw, 64px);
    position: relative;
}

/* 1. Customer Journey Tracker */
.im-journey-tracker {
    margin-bottom: 36px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 20px;
    padding: 16px 20px;
    box-shadow: 0 10px 30px -10px rgba(0,0,0,0.4);
    overflow-x: auto;
    scrollbar-width: none;
}
.im-journey-tracker::-webkit-scrollbar { display: none; }
.im-journey-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 820px;
    justify-content: space-between;
}
.im-journey-step {
    display: flex;
    align-items: center;
    gap: 10px;
    opacity: 0.55;
    transition: opacity 0.3s, transform 0.3s;
    cursor: default;
}
.im-journey-step.active, .im-journey-step.completed {
    opacity: 1;
}
.im-journey-step.active .im-step-num {
    background: var(--brand);
    color: var(--brand-ink);
    box-shadow: 0 0 16px color-mix(in srgb, var(--brand) 60%, transparent);
}
.im-journey-step.completed .im-step-num {
    background: var(--surface);
    border: 1.5px solid var(--brand);
    color: var(--brand);
}
.im-step-num {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--line);
    color: var(--muted);
    display: grid;
    place-items: center;
    font-family: var(--display);
    font-weight: 800;
    font-size: 14px;
    flex-shrink: 0;
    transition: all 0.3s ease;
}
.im-step-text {
    display: flex;
    flex-direction: column;
}
.im-step-text strong {
    font-size: 13.5px;
    color: var(--ink);
    line-height: 1.2;
}
.im-step-text small {
    font-size: 11px;
    color: var(--muted);
}
.im-step-arrow {
    color: var(--line);
    font-size: 16px;
    font-weight: 700;
}

/* 2. Category Switcher (Prescription vs Natural) */
.im-category-switcher-wrap {
    display: flex;
    justify-content: center;
    margin-bottom: 28px;
}
.im-category-switcher {
    display: inline-flex;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 5px;
    gap: 4px;
    max-width: 100%;
}
.im-cat-btn {
    border: 0;
    background: transparent;
    color: var(--muted);
    font-family: var(--body);
    font-size: 14.5px;
    font-weight: 600;
    padding: 10px 22px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.25s ease;
}
.im-cat-btn:hover {
    color: var(--ink);
}
.im-cat-btn.active {
    background: var(--bg);
    color: var(--ink);
    box-shadow: 0 4px 14px rgba(0,0,0,0.3);
}
.im-tab-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--brand);
    display: inline-block;
}
.im-tab-badge {
    background: color-mix(in srgb, var(--brand) 20%, transparent);
    color: var(--brand);
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 99px;
    font-weight: 700;
}
.im-tab-badge-sub {
    background: color-mix(in srgb, var(--muted) 16%, transparent);
    color: var(--muted);
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 99px;
    font-weight: 600;
}

/* 3. Medication Selector Pills */
.im-med-selector-area {
    margin-bottom: 40px;
    background: color-mix(in srgb, var(--surface) 60%, transparent);
    border: 1px solid var(--line);
    border-radius: 20px;
    padding: 24px;
}
.im-med-selector-head {
    margin-bottom: 14px;
}
.im-med-selector-title {
    font-size: 19px;
    margin-top: 4px;
    font-weight: 700;
}
.im-med-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.im-med-pill {
    background: var(--bg);
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 10px 16px;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    transition: all 0.25s ease;
    cursor: pointer;
}
.im-med-pill:hover {
    border-color: var(--brand);
    transform: translateY(-2px);
}
.im-med-pill.active {
    border-color: var(--brand);
    background: linear-gradient(180deg, color-mix(in srgb, var(--brand) 12%, var(--surface)), var(--surface));
    box-shadow: 0 6px 18px -4px color-mix(in srgb, var(--brand) 30%, transparent);
}
.im-pill-badge {
    font-size: 10px;
    color: var(--brand);
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.im-pill-name {
    font-size: 14px;
    font-weight: 700;
    color: var(--ink);
    margin-top: 2px;
}
.im-pill-sub {
    font-size: 12px;
    color: var(--muted);
    margin-top: 1px;
}

/* Active Medication Details Banner */
.im-active-med-banner {
    margin-top: 18px;
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 12%, var(--surface)), var(--surface));
    border: 1px solid color-mix(in srgb, var(--brand) 35%, transparent);
    border-radius: 16px;
    padding: 18px 22px;
    animation: rise 0.4s ease;
}
.im-med-banner-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    position: relative;
    z-index: 1;
}
.im-med-banner-lead .im-med-tag {
    font-family: var(--mono);
    font-size: 11px;
    color: var(--brand);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}
.im-med-banner-lead h4 {
    font-size: 22px;
    font-weight: 800;
    margin: 4px 0;
}
.im-med-banner-lead p {
    color: var(--muted);
    font-size: 14px;
    max-width: 60ch;
}
.im-med-banner-pricing {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}
.im-banner-price-box {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}
.im-banner-price-lbl {
    font-size: 11px;
    color: var(--muted);
    text-transform: uppercase;
    font-family: var(--mono);
}
.im-banner-price-amt {
    font-family: var(--display);
    font-size: 28px;
    font-weight: 800;
    color: var(--ink);
}
.im-banner-price-amt small {
    font-size: 14px;
    color: var(--muted);
}
.im-banner-qty {
    font-size: 12px;
    color: var(--brand);
    font-weight: 600;
}
.im-status-badge {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
}
.im-status-badge.approved {
    background: color-mix(in srgb, var(--brand) 18%, transparent);
    color: var(--brand);
    border: 1px solid color-mix(in srgb, var(--brand) 30%, transparent);
}
.im-status-badge.pending {
    background: color-mix(in srgb, var(--amber) 16%, transparent);
    color: var(--amber);
    border: 1px solid color-mix(in srgb, var(--amber) 25%, transparent);
}

/* 4. Pricing Grid Header */
.im-pricing-grid-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 28px;
}
.im-grid-title h2 {
    font-size: clamp(28px, 3.8vw, 46px);
    margin: 8px 0;
}
.im-guarantee-pill {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: color-mix(in srgb, var(--surface) 90%, transparent);
    border: 1px solid color-mix(in srgb, var(--brand) 30%, var(--line));
    border-radius: 999px;
    padding: 10px 18px;
    font-size: 13.5px;
    color: var(--ink);
}
.im-guarantee-pill svg {
    color: var(--brand);
    flex-shrink: 0;
}

/* 5. Liquid Glass Pricing Cards */
.im-med-cards-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 48px;
}

.im-med-card.liquid-glass {
    position: relative;
    background: linear-gradient(145deg, rgba(17, 36, 38, 0.85) 0%, rgba(10, 23, 24, 0.95) 100%);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(61, 191, 184, 0.22);
    border-radius: 24px;
    padding: 26px 22px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    box-shadow: 0 16px 36px -12px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255, 255, 255, 0.08);
    transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), border-color 0.3s, box-shadow 0.35s;
}

.im-med-card.liquid-glass:hover {
    transform: translateY(-6px);
    border-color: var(--brand);
    box-shadow: 0 24px 50px -14px color-mix(in srgb, var(--brand) 28%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.im-med-card.liquid-glass.feat {
    border-color: var(--brand);
    background: linear-gradient(155deg, rgba(23, 49, 52, 0.9) 0%, rgba(11, 26, 27, 0.95) 100%);
    box-shadow: 0 20px 45px -12px color-mix(in srgb, var(--brand) 35%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.15);
}

.im-med-card.liquid-glass.selected-tier {
    border-color: var(--glow);
    outline: 2px solid var(--glow);
    outline-offset: 2px;
}

.im-card-badge {
    position: absolute;
    top: -12px;
    left: 20px;
    font-size: 10.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 4px 12px;
    border-radius: 999px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}
.im-card-badge.brand {
    background: var(--brand);
    color: var(--brand-ink);
}
.im-card-badge.amber {
    background: var(--amber);
    color: #1a1206;
}
.im-card-badge.coral {
    background: var(--risk);
    color: #fff;
}

.im-tier-eyebrow {
    font-family: var(--mono);
    font-size: 11px;
    color: var(--brand);
    letter-spacing: 0.1em;
}
.im-card-title {
    font-size: 21px;
    font-weight: 800;
    margin: 4px 0;
}
.im-card-desc {
    font-size: 13px;
    color: var(--muted);
    line-height: 1.4;
    min-height: 36px;
}

.im-card-pricing-block {
    margin-top: 4px;
}
.im-card-price {
    font-family: var(--display);
    font-weight: 800;
    display: flex;
    align-items: baseline;
    line-height: 1;
}
.im-card-price .im-currency {
    font-size: 24px;
    color: var(--brand);
    margin-right: 2px;
}
.im-card-price .im-amount {
    font-size: 44px;
    letter-spacing: -0.03em;
    color: var(--ink);
}
.im-card-price .im-period {
    font-family: var(--body);
    font-weight: 500;
    font-size: 14px;
    color: var(--muted);
    margin-left: 4px;
}
.im-card-doses {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    font-size: 12.5px;
    color: var(--ink);
    background: rgba(255,255,255,0.04);
    padding: 6px 10px;
    border-radius: 8px;
    border: 1px solid rgba(255,255,255,0.06);
}
.im-card-doses svg {
    color: var(--brand);
    flex-shrink: 0;
}

.im-card-divider {
    height: 1px;
    background: linear-gradient(90deg, rgba(61,191,184,0.3) 0%, rgba(255,255,255,0.04) 100%);
    margin-block: 4px;
}

.im-inclusions-title {
    font-size: 12px;
    font-weight: 700;
    color: var(--ink);
    display: block;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.im-inclusions-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 8px;
    font-size: 13.5px;
    color: var(--muted);
}
.im-inclusions-list li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    line-height: 1.35;
}
.im-check-ico {
    color: var(--glow);
    flex-shrink: 0;
    margin-top: 2px;
}

.im-card-cta {
    margin-top: auto;
    padding-top: 14px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.im-card-cta .btn {
    width: 100%;
    padding-block: 13px;
    font-size: 14.5px;
}
.im-card-subcta {
    text-align: center;
    font-size: 11px;
    color: var(--muted);
}

/* 6. Fulfillment Options Section */
.im-fulfillment-section {
    margin-bottom: 48px;
    padding: 32px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 24px;
}
.im-fulfillment-header {
    margin-bottom: 24px;
}
.im-fulfillment-header h3 {
    font-size: 26px;
    margin: 6px 0;
}
.im-fulfillment-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}
.im-fulfillment-card {
    position: relative;
    display: block;
    cursor: pointer;
    background: var(--bg);
    border: 1.5px solid var(--line);
    border-radius: 18px;
    padding: 22px;
    transition: all 0.25s ease;
}
.im-fulfillment-card input[type="radio"] {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 20px;
    height: 20px;
    accent-color: var(--brand);
}
.im-fulfillment-card:hover {
    border-color: var(--brand);
    transform: translateY(-2px);
}
.im-fulfillment-card.active {
    border-color: var(--brand);
    background: linear-gradient(145deg, color-mix(in srgb, var(--brand) 8%, var(--bg)), var(--bg));
    box-shadow: 0 10px 24px -6px color-mix(in srgb, var(--brand) 25%, transparent);
}
.im-f-badge {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--brand) 18%, transparent);
    color: var(--brand);
    margin-bottom: 12px;
}
.im-f-badge.amber {
    background: color-mix(in srgb, var(--amber) 18%, transparent);
    color: var(--amber);
}
.im-f-icon-box {
    margin-bottom: 12px;
    color: var(--brand);
}
.im-f-text h4 {
    font-size: 19px;
    font-weight: 800;
}
.im-f-sub {
    font-size: 12.5px;
    color: var(--muted);
    display: block;
    margin-bottom: 8px;
}
.im-f-desc {
    font-size: 13.5px;
    color: var(--muted);
    margin-bottom: 12px;
    line-height: 1.4;
}
.im-f-bullets {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 4px;
    font-size: 12.5px;
    color: var(--muted);
}
.im-f-pricing-tag {
    display: flex;
    justify-content: space-between;
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
    font-size: 13px;
    font-weight: 700;
}
.im-f-fee {
    color: var(--ok);
}
.im-f-eta {
    color: var(--muted);
}

/* 7. Transparent Order Summary Card */
.im-order-summary-wrapper {
    margin-bottom: 56px;
}
.im-order-summary-card.liquid-glass {
    background: linear-gradient(135deg, rgba(17, 36, 38, 0.95) 0%, rgba(6, 17, 18, 0.98) 100%);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border: 1.5px solid rgba(61, 191, 184, 0.3);
    border-radius: 24px;
    padding: clamp(24px, 4vw, 36px);
    box-shadow: 0 30px 60px -20px rgba(0,0,0,0.8), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}
.im-summary-header h3 {
    font-size: 28px;
    margin: 6px 0 8px;
}
.im-summary-header p {
    color: var(--muted);
    font-size: 15px;
}
.im-summary-table {
    margin-block: 24px;
    display: grid;
    gap: 12px;
    background: rgba(0, 0, 0, 0.25);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 16px;
    padding: 20px;
}
.im-summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14.5px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.im-summary-row:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}
.im-summary-row.total {
    padding-top: 10px;
    border-top: 1px solid var(--line);
    font-size: 18px;
    font-weight: 800;
}
.im-s-label {
    color: var(--muted);
}
.im-summary-row.total .im-s-label {
    color: var(--ink);
}
.im-s-val {
    color: var(--ink);
    font-weight: 600;
    text-align: right;
}
.im-s-val.free {
    color: var(--ok);
}
.im-strikethrough {
    color: var(--muted);
    text-decoration: line-through;
    margin-right: 6px;
    font-weight: 400;
}
.im-total-amt {
    font-family: var(--display);
    font-size: 32px;
    font-weight: 800;
    color: var(--brand);
}
.im-summary-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
}
.im-summary-safety-notice {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: var(--muted);
    font-size: 13.5px;
    max-width: 58ch;
}
.im-summary-safety-notice svg {
    color: var(--brand);
    flex-shrink: 0;
    margin-top: 3px;
}
.im-checkout-cta {
    padding: 16px 36px;
    font-size: 16px;
}

/* 8. Competitor Comparison Section */
.im-competitor-section {
    margin-bottom: 40px;
}
.im-competitor-head h3 {
    font-size: 28px;
    margin: 6px 0 10px;
}
.im-research-draft-notice {
    margin-top: 14px;
    padding: 12px 18px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--amber) 14%, transparent);
    border: 1px solid color-mix(in srgb, var(--amber) 30%, transparent);
    color: var(--amber);
    font-size: 13.5px;
}
.im-research-approved-notice {
    margin-top: 14px;
    padding: 12px 18px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--brand) 14%, transparent);
    border: 1px solid color-mix(in srgb, var(--brand) 30%, transparent);
    color: var(--brand);
    font-size: 13.5px;
}
.im-table-responsive {
    overflow-x: auto;
    margin-top: 20px;
    border-radius: 16px;
    border: 1px solid var(--line);
    background: var(--surface);
}
.im-comp-table {
    width: 100%;
    border-collapse: collapse;
    text-align: left;
    font-size: 14px;
}
.im-comp-table th, .im-comp-table td {
    padding: 16px 18px;
    border-bottom: 1px solid var(--line);
}
.im-comp-table thead th {
    background: var(--bg);
    font-family: var(--display);
    font-weight: 700;
    font-size: 14.5px;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.im-comp-table th.highlight, .im-comp-table td.highlight {
    background: color-mix(in srgb, var(--brand) 12%, var(--surface));
    border-inline: 1px solid color-mix(in srgb, var(--brand) 30%, transparent);
}
.im-highlight-sub {
    display: block;
    font-size: 11px;
    color: var(--brand);
    font-weight: 600;
}
.im-muted-note {
    color: var(--muted);
    font-size: 12px;
}
.im-comp-disclaimer {
    margin-top: 12px;
    font-size: 12.5px;
    color: var(--muted);
    line-height: 1.4;
}

/* Responsive adjustments */
@media (max-width: 1100px) {
    .im-med-cards-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 768px) {
    .im-fulfillment-grid {
        grid-template-columns: 1fr;
    }
    .im-summary-footer {
        flex-direction: column;
        align-items: stretch;
    }
    .im-checkout-cta {
        width: 100%;
    }
}
@media (max-width: 600px) {
    .im-med-cards-grid {
        grid-template-columns: 1fr;
    }
    .im-card-price .im-amount {
        font-size: 38px;
    }
    .im-cat-btn {
        padding: 8px 14px;
        font-size: 13px;
    }
}

/* ==========================================================================
   MEDICATION PROFILES CATALOG & CLINICAL INTAKE WIZARD
   ========================================================================== */

/* Catalog Section & Filtering */
.im-med-catalog-section {
    margin-block: clamp(32px, 5vw, 60px);
}
.im-catalog-head {
    margin-bottom: 32px;
}
.im-catalog-head h2 {
    font-size: clamp(28px, 3.5vw, 42px);
    margin-block: 8px 12px;
}
.im-catalog-filter-bar {
    display: inline-flex;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 5px;
    gap: 6px;
    margin-top: 20px;
    max-width: 100%;
    overflow-x: auto;
}
.im-filter-btn {
    border: 0;
    background: transparent;
    color: var(--muted);
    font-family: var(--body);
    font-size: 14px;
    font-weight: 600;
    padding: 9px 20px;
    border-radius: 999px;
    cursor: pointer;
    transition: all 0.25s ease;
    white-space: nowrap;
}
.im-filter-btn:hover {
    color: var(--ink);
}
.im-filter-btn.active {
    background: var(--brand);
    color: var(--brand-ink);
    box-shadow: 0 4px 14px color-mix(in srgb, var(--brand) 40%, transparent);
}

/* Medication Profile Grid & Cards */
.im-med-profile-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 24px;
    margin-bottom: 48px;
}
.im-med-profile-card {
    position: relative;
    background: linear-gradient(150deg, rgba(17, 36, 38, 0.9) 0%, rgba(10, 23, 24, 0.96) 100%);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(61, 191, 184, 0.22);
    border-radius: 24px;
    padding: 26px 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    box-shadow: 0 16px 36px -12px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255, 255, 255, 0.08);
    transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), border-color 0.3s, box-shadow 0.35s;
}
.im-med-profile-card:hover {
    transform: translateY(-5px);
    border-color: var(--brand);
    box-shadow: 0 24px 50px -14px color-mix(in srgb, var(--brand) 28%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.16);
}
.im-med-profile-card[style*="display: none"] {
    display: none !important;
}

/* Card Header & Badges */
.im-mp-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    flex-wrap: wrap;
}
.im-mp-tags {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.im-mp-cat-badge {
    font-family: var(--mono);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 6px;
}
.im-mp-cat-badge.brand {
    background: color-mix(in srgb, var(--brand) 18%, transparent);
    color: var(--brand);
    border: 1px solid color-mix(in srgb, var(--brand) 35%, transparent);
}
.im-mp-cat-badge.coral {
    background: color-mix(in srgb, var(--coral, #E07A6C) 18%, transparent);
    color: var(--coral, #E07A6C);
    border: 1px solid color-mix(in srgb, var(--coral, #E07A6C) 35%, transparent);
}
.im-mp-tag {
    font-size: 11.5px;
    color: var(--muted);
    background: var(--surface);
    padding: 4px 9px;
    border-radius: 6px;
    border: 1px solid var(--line);
}
.im-mp-brand-ref {
    font-size: 12px;
    text-align: right;
    color: var(--muted);
}
.im-mp-generic-label {
    display: block;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--muted);
}
.im-mp-brand-ref strong {
    color: var(--ink);
}

.im-mp-header {
    border-bottom: 1px solid var(--line);
    padding-bottom: 14px;
}
.im-mp-name {
    font-size: 26px;
    color: var(--ink);
    margin-bottom: 6px;
}
.im-mp-strength-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(61, 191, 184, 0.08);
    border: 1px solid rgba(61, 191, 184, 0.25);
    border-radius: 999px;
    padding: 4px 12px;
    font-size: 12.5px;
    color: var(--brand);
}
.im-mp-strength-badge svg {
    flex-shrink: 0;
}

/* Purpose & Benefits */
.im-mp-purpose h4 {
    font-size: 13.5px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--muted);
    margin-bottom: 6px;
}
.im-mp-purpose p {
    font-size: 14px;
    line-height: 1.5;
    color: var(--ink);
}

/* Safety Callout Box */
.im-mp-safety-box {
    background: rgba(240, 182, 84, 0.07);
    border: 1px solid rgba(240, 182, 84, 0.25);
    border-left: 3.5px solid var(--amber);
    border-radius: 10px;
    padding: 12px 14px;
}
.im-mp-safety-title {
    display: flex;
    align-items: center;
    gap: 7px;
    color: var(--amber);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 4px;
}
.im-mp-safety-desc {
    font-size: 12.5px;
    line-height: 1.45;
    color: color-mix(in srgb, var(--ink) 85%, var(--amber));
}

/* Card Pricing Footer */
.im-mp-pricing-footer {
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid var(--line);
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 14px;
    flex-wrap: wrap;
}
.im-mp-price-box {
    display: flex;
    flex-direction: column;
}
.im-mp-price-lbl {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--muted);
}
.im-mp-price-line {
    display: flex;
    align-items: baseline;
    gap: 4px;
}
.im-mp-amt {
    font-family: var(--display);
    font-size: 28px;
    font-weight: 800;
    color: var(--brand);
}
.im-mp-per {
    font-size: 14px;
    color: var(--muted);
}
.im-mp-doses {
    font-size: 12px;
    color: var(--ink);
    font-weight: 500;
}
.im-mp-includes {
    font-size: 11px;
    color: var(--ok);
    margin-top: 2px;
}

.im-mp-cta-wrap {
    flex-shrink: 0;
}
.im-mp-cta-wrap .btn {
    padding: 12px 20px;
    font-size: 14px;
}

.im-mp-disclaimer {
    font-size: 11.5px;
    color: var(--muted);
    border-top: 1px dashed rgba(255,255,255,0.06);
    padding-top: 8px;
    line-height: 1.4;
}

/* ==========================================================================
   MULTI-STEP MEDICAL QUESTIONNAIRE WIZARD & MODAL ENHANCEMENTS
   ========================================================================== */
.im-assessment.intake-mode {
    width: min(720px, calc(100% - 24px));
}

.im-intake-step {
    display: flex;
    flex-direction: column;
    gap: 16px;
    animation: imStepIn 0.3s ease-out;
}
@keyframes imStepIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

.im-step-header {
    margin-bottom: 6px;
}
.im-step-badge {
    display: inline-block;
    font-family: var(--mono);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--brand);
    background: rgba(61, 191, 184, 0.12);
    border: 1px solid rgba(61, 191, 184, 0.3);
    border-radius: 999px;
    padding: 3px 10px;
    margin-bottom: 8px;
}
.im-step-subtitle {
    color: var(--muted);
    font-size: 14.5px;
    line-height: 1.4;
    margin-top: 4px;
}

/* Choice Cards (Yes / No / Not sure) */
.im-choice-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 12px;
    margin-block: 6px 12px;
}
.im-choice-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 18px 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface);
    cursor: pointer;
    text-align: center;
    font-size: 15px;
    font-weight: 600;
    color: var(--ink);
    transition: all 0.25s ease;
}
.im-choice-card input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.im-choice-card:hover {
    border-color: rgba(61, 191, 184, 0.5);
    background: color-mix(in srgb, var(--surface) 90%, var(--brand));
}
.im-choice-card.selected {
    border-color: var(--brand);
    background: color-mix(in srgb, var(--brand) 15%, var(--surface));
    box-shadow: 0 0 16px rgba(61, 191, 184, 0.25);
    color: var(--brand);
}
.im-choice-icon {
    font-size: 20px;
}

/* Conditional subfields */
.im-subfields {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.35s ease, opacity 0.3s ease, margin 0.3s ease;
    margin-top: 0;
}
.im-subfields.expanded {
    max-height: 600px;
    opacity: 1;
    overflow: visible;
    margin-top: 14px;
}

/* Form Controls & Inputs */
.im-input-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 12px;
}
.im-input-group label {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ink);
}
.im-text-input,
.im-textarea-input {
    width: 100%;
    padding: 11px 14px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 8px;
    color: var(--ink);
    font-family: var(--body);
    font-size: 14.5px;
    box-sizing: border-box;
    transition: border-color 0.25s, box-shadow 0.25s;
}
.im-text-input:focus,
.im-textarea-input:focus {
    outline: none;
    border-color: var(--brand);
    box-shadow: 0 0 0 3px rgba(61, 191, 184, 0.2);
}
.im-dual-inputs {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}
.im-tri-inputs {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 10px;
}

/* Screening Table (Step 5) */
.im-screening-table {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface);
    overflow: hidden;
}
.im-screen-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 13px 16px;
    gap: 14px;
    border-bottom: 1px solid var(--line);
}
.im-screen-row:last-child {
    border-bottom: 0;
}
.im-screen-text strong {
    font-size: 13.5px;
    color: var(--ink);
    line-height: 1.4;
    font-weight: 500;
}
.im-screen-btns {
    display: inline-flex;
    gap: 6px;
    flex-shrink: 0;
}
.im-toggle-btn {
    border: 1px solid var(--line);
    background: var(--bg);
    color: var(--muted);
    font-size: 12.5px;
    font-weight: 700;
    padding: 6px 14px;
    border-radius: 999px;
    cursor: pointer;
    transition: all 0.2s ease;
    user-select: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.im-toggle-btn input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.im-toggle-btn:hover {
    color: var(--ink);
    border-color: rgba(255,255,255,0.25);
}
.im-toggle-btn.active {
    background: var(--brand);
    color: var(--brand-ink);
    border-color: var(--brand);
}

/* Alert Boxes */
.im-alert-box {
    padding: 12px 16px;
    border-radius: 8px;
    font-size: 13px;
    line-height: 1.45;
}
.im-alert-box.alert-danger {
    background: rgba(224, 79, 68, 0.12);
    border: 1px solid rgba(224, 79, 68, 0.4);
    border-left: 4px solid var(--risk);
    color: #ffafa0;
}
.im-alert-box.alert-danger strong {
    color: #ff8573;
    display: block;
    margin-bottom: 2px;
}
.im-alert-box.alert-warning {
    background: rgba(240, 182, 84, 0.12);
    border: 1px solid rgba(240, 182, 84, 0.4);
    border-left: 4px solid var(--amber);
    color: #fce293;
}
.im-alert-box.alert-warning strong {
    color: var(--amber);
    display: block;
    margin-bottom: 2px;
}

/* Fulfillment Options (Step 6) */
.im-fulfill-options {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-block: 6px 12px;
}
.im-fulfill-select-card {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 18px 20px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--surface);
    cursor: pointer;
    transition: all 0.25s ease;
}
.im-fulfill-select-card input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.im-fulfill-select-card:hover {
    border-color: rgba(61, 191, 184, 0.5);
}
.im-fulfill-select-card.selected {
    border-color: var(--brand);
    background: color-mix(in srgb, var(--brand) 10%, var(--surface));
    box-shadow: 0 0 18px rgba(61, 191, 184, 0.2);
}
.im-fs-head h4 {
    font-size: 16px;
    color: var(--ink);
    margin-block: 4px;
}
.im-fs-head p {
    font-size: 13px;
    color: var(--muted);
    line-height: 1.4;
}
.im-fs-badge {
    display: inline-block;
    font-family: var(--mono);
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 2px 8px;
    border-radius: 4px;
    background: rgba(61, 191, 184, 0.18);
    color: var(--brand);
}
.im-fs-badge.amber {
    background: rgba(240, 182, 84, 0.18);
    color: var(--amber);
}
.im-fs-pricing {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--line);
    font-size: 12.5px;
    color: var(--muted);
}
.im-fs-pricing strong {
    color: var(--ink);
}

/* Step 7 Review & Consent */
.im-review-contact-box {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 16px;
}
.im-answers-summary {
    background: rgba(0,0,0,0.25);
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.im-summary-item {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-size: 13px;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    padding-bottom: 6px;
}
.im-summary-item:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}
.im-summary-item span {
    color: var(--muted);
}
.im-summary-item strong {
    color: var(--ink);
    text-align: right;
}
.im-consent-block {
    margin-top: 6px;
}
.im-consent-label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 12px;
    line-height: 1.45;
    color: var(--muted);
    cursor: pointer;
}
.im-consent-label input[type="checkbox"] {
    margin-top: 3px;
    accent-color: var(--brand);
    flex-shrink: 0;
}
.im-error-msg {
    color: var(--risk);
    font-size: 13px;
    font-weight: 600;
    min-height: 18px;
    margin: 4px 0;
}

/* Confirmation Screen */
.im-confirm-view {
    text-align: center;
    padding-block: 10px;
}
.im-confirm-head {
    margin-bottom: 20px;
}
.im-confirm-badge {
    display: inline-block;
    padding: 5px 14px;
    border-radius: 999px;
    font-family: var(--mono);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 12px;
}
.im-confirm-badge.normal {
    background: rgba(92, 192, 138, 0.15);
    border: 1px solid rgba(92, 192, 138, 0.35);
    color: var(--ok);
}
.im-confirm-badge.flagged {
    background: rgba(224, 122, 108, 0.15);
    border: 1px solid rgba(224, 122, 108, 0.4);
    color: var(--risk);
}
.im-confirm-card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 16px 20px;
    text-align: left;
    margin-bottom: 24px;
}
.im-confirm-row {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-size: 13.5px;
    padding-block: 6px;
    border-bottom: 1px solid rgba(255,255,255,0.06);
}
.im-confirm-row:last-child {
    border-bottom: 0;
}
.im-confirm-row span {
    color: var(--muted);
}
.im-confirm-row strong {
    color: var(--ink);
}
.im-confirm-timeline {
    text-align: left;
    margin-bottom: 24px;
}
.im-timeline-item {
    display: flex;
    gap: 14px;
    padding-bottom: 16px;
    position: relative;
}
.im-timeline-item:not(:last-child)::before {
    content: '';
    position: absolute;
    left: 15px;
    top: 30px;
    bottom: 0;
    width: 2px;
    background: var(--line);
}
.im-tl-num {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--line);
    color: var(--muted);
    display: grid;
    place-items: center;
    font-weight: 700;
    font-size: 13px;
    flex-shrink: 0;
}
.im-timeline-item.active .im-tl-num {
    background: var(--brand);
    color: var(--brand-ink);
    box-shadow: 0 0 12px rgba(61, 191, 184, 0.5);
}
.im-tl-content strong {
    font-size: 14px;
    color: var(--ink);
    display: block;
}
.im-tl-content p {
    font-size: 12.5px;
    color: var(--muted);
    margin-top: 2px;
}

@media (max-width: 600px) {
    .im-med-profile-grid {
        grid-template-columns: 1fr;
    }
    .im-dual-inputs,
    .im-tri-inputs {
        grid-template-columns: 1fr;
    }
    .im-screen-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    .im-screen-btns {
        width: 100%;
        display: flex;
    }
    .im-toggle-btn {
        flex: 1;
        justify-content: center;
    }
}