.haw-section {
    background: #f5f3ef;
    background-image:
        radial-gradient(60% 50% at 50% -10%, rgba(255,255,255,0.7) 0%, transparent 70%),
        linear-gradient(180deg, #f6f3ef 0%, #ece8e2 100%);
    --haw-ink: #0a0a0a;
    isolation: isolate;
}
.haw-wrap {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
    position: relative;
    z-index: 1;
}
@media (min-width: 768px) { .haw-wrap { padding: 0 40px; } }

.haw-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 36px;
    flex-wrap: wrap;
}
.haw-header__copy { max-width: 720px; }
.haw-eyebrow {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: rgba(26, 26, 26, 0.45);
    margin-bottom: 14px;
}
.haw-title {
    margin: 0;
    color: #0a0a0a;
    font-size: 1.875rem;
    line-height: 1.05;
    letter-spacing: -0.025em;
    font-weight: 700;
}
@media (min-width: 768px) {
    .haw-title { font-size: 3rem; }
}

.haw-controls {
    display: inline-flex;
    gap: 10px;
    flex-shrink: 0;
}
.haw-btn {
    width: 44px;
    height: 44px;
    border-radius: 999px;
    background: #ffffff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    color: var(--haw-ink);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 1px 1px rgba(15, 23, 42, 0.03), 0 4px 10px -4px rgba(15, 23, 42, 0.06);
    transition: background 0.2s ease, transform 0.2s cubic-bezier(.2,.8,.2,1), border-color 0.2s ease, box-shadow 0.22s ease, opacity 0.2s ease;
}
.haw-btn:hover {
    background: #ffffff;
    border-color: rgba(15, 23, 42, 0.14);
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(15, 23, 42, 0.04), 0 8px 16px -4px rgba(15, 23, 42, 0.08);
}
.haw-btn:active { transform: translateY(0); box-shadow: 0 1px 1px rgba(15, 23, 42, 0.03); }
.haw-btn:disabled { opacity: 0.4; cursor: default; transform: none; box-shadow: none; }
.haw-btn svg { width: 18px; height: 18px; }

.haw-subtitle {
    margin: 14px 0 0;
    color: rgba(26, 26, 26, 0.6);
    font-size: 16px;
    line-height: 1.6;
    max-width: 600px;
    font-weight: 400;
}

.haw-carousel {
    position: relative;
    margin: 0 -24px;
    overflow: hidden;
    padding: 60px 0 120px;
    touch-action: pan-y;
    -webkit-mask-image: linear-gradient(to right, transparent 0, black 80px, black calc(100% - 80px), transparent 100%);
            mask-image: linear-gradient(to right, transparent 0, black 80px, black calc(100% - 80px), transparent 100%);
}
@media (min-width: 768px) {
    .haw-carousel {
        margin: 0 -40px;
        padding: 80px 0 140px;
        -webkit-mask-image: linear-gradient(to right, transparent 0, black 120px, black calc(100% - 120px), transparent 100%);
                mask-image: linear-gradient(to right, transparent 0, black 120px, black calc(100% - 120px), transparent 100%);
    }
}
.haw-track {
    display: flex;
    gap: 24px;
    padding: 0 24px;
    transform: translate3d(var(--haw-offset, 0), 0, 0);
    transition: transform 0.55s cubic-bezier(.2,.8,.2,1);
    will-change: transform;
}
@media (min-width: 768px) {
    .haw-track { gap: 28px; padding: 0 40px; }
}

.haw-card {
    flex: 0 0 92%;
    scroll-snap-align: start;
    background: #ffffff;
    border-radius: 28px;
    overflow: hidden;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 320px auto;
    box-shadow:
        0 0 0 1px rgba(15, 23, 42, 0.04),
        0 2px 4px rgba(15, 23, 42, 0.025),
        0 6px 14px -2px rgba(15, 23, 42, 0.04),
        0 18px 36px -8px rgba(15, 23, 42, 0.06),
        0 36px 72px -16px rgba(15, 23, 42, 0.08);
    transition: box-shadow 0.35s cubic-bezier(.2,.8,.2,1), transform 0.35s cubic-bezier(.2,.8,.2,1);
}
.haw-card:hover {
    box-shadow:
        0 0 0 1px rgba(15, 23, 42, 0.05),
        0 2px 4px rgba(15, 23, 42, 0.03),
        0 8px 18px -2px rgba(15, 23, 42, 0.05),
        0 24px 48px -8px rgba(15, 23, 42, 0.08),
        0 48px 96px -20px rgba(15, 23, 42, 0.10);
}
@media (min-width: 900px) {
    .haw-card {
        flex-basis: 78%;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: minmax(440px, 1fr);
    }
}
@media (min-width: 1200px) {
    .haw-card { flex-basis: 1080px; }
}

.haw-card__content {
    order: 2;
    padding: 36px 28px 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
    text-align: center;
    position: relative;
}
@media (min-width: 900px) {
    .haw-card__content {
        order: 1;
        padding: 48px 40px;
    }
}
.haw-card__num {
    position: absolute;
    top: 24px;
    left: 28px;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.16em;
    color: rgba(26, 26, 26, 0.42);
}
@media (min-width: 900px) {
    .haw-card__num { top: 32px; left: 36px; }
}
.haw-card__copy {
    display: flex;
    flex-direction: column;
    gap: 14px;
    max-width: 460px;
    align-items: center;
    text-align: center;
    margin: 0 auto;
}
.haw-card__title {
    margin: 0;
    color: var(--haw-ink);
    font-size: clamp(1.375rem, 2.2vw, 1.875rem);
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.2;
    text-align: center;
}
.haw-card__text {
    margin: 0;
    color: rgba(26, 26, 26, 0.6);
    font-size: 15px;
    line-height: 1.6;
    max-width: 440px;
    text-align: center;
}

.haw-card__visual {
    order: 1;
    position: relative;
    background: linear-gradient(140deg, var(--haw-tint, #fff5e8) 0%, #ffffff 100%);
    overflow: hidden;
}
@media (min-width: 900px) { .haw-card__visual { order: 2; } }

.haw-rings {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    pointer-events: none;
}
.haw-ring {
    position: absolute;
    border-radius: 999px;
    background: radial-gradient(closest-side, var(--haw-a) 0%, transparent 75%);
    opacity: 0.85;
}
.haw-ring--1 { width: 360px; height: 360px; }
.haw-ring--2 { width: 520px; height: 520px; opacity: 0.55; }
.haw-ring--3 { width: 700px; height: 700px; opacity: 0.30; }

/* Mockup base */
.haw-mock {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
}

/* Folder mockup (schedule) */
.haw-mock--folder { padding: 36px; }
.haw-mock--folder { display: block; }
.haw-mock--folder .haw-tab,
.haw-mock--folder .haw-folder {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 14px;
    padding: 10px 18px;
    font-size: 13px;
    color: rgba(26, 26, 26, 0.62);
    box-shadow: 0 8px 24px -16px rgba(15, 23, 42, 0.18);
    width: 56%;
    max-width: 320px;
    text-align: left;
}
.haw-mock--folder .haw-tab--3 { top: 28%; transform: translate(-50%, 0) scale(0.84); opacity: 0.78; }
.haw-mock--folder .haw-tab--2 { top: 36%; transform: translate(-50%, 0) scale(0.92); opacity: 0.92; }
.haw-mock--folder .haw-tab--1 { top: 44%; color: var(--haw-b); border-color: rgba(15,23,42,0.10); display: flex; align-items: center; gap: 8px; }
.haw-tab__dot { width: 6px; height: 6px; border-radius: 999px; background: var(--haw-b); }
.haw-mock--folder .haw-folder {
    top: 56%;
    width: 64%;
    max-width: 360px;
    padding: 18px 22px;
    border-radius: 16px;
    background: linear-gradient(180deg, #fff 0%, #fafaf7 100%);
    box-shadow: 0 12px 32px -18px rgba(15, 23, 42, 0.20);
    color: var(--haw-ink);
    font-size: 16px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.haw-folder__plus {
    width: 28px; height: 28px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.05);
    color: rgba(26, 26, 26, 0.6);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    line-height: 1;
}

/* Chat mockup (intent) */
.haw-mock--chat { padding: 28px; flex-direction: column; align-items: stretch; gap: 10px; display: flex; justify-content: center; }
.haw-bubble {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 14px;
    padding: 12px 16px;
    font-size: 14px;
    color: var(--haw-ink);
    max-width: 80%;
    box-shadow: 0 6px 18px -12px rgba(15, 23, 42, 0.16);
}
.haw-bubble--in { align-self: flex-start; border-bottom-left-radius: 4px; }
.haw-bubble--out {
    align-self: flex-end;
    background: var(--haw-b);
    color: #fff;
    border: none;
    border-bottom-right-radius: 4px;
}
.haw-bubble--out strong { font-weight: 700; }

/* Insurance card */
.haw-mock--card { padding: 28px; }
.haw-insurance {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 16px;
    padding: 20px 22px;
    width: 80%;
    max-width: 360px;
    box-shadow: 0 14px 36px -20px rgba(15, 23, 42, 0.20);
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.haw-insurance__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 13.5px;
    color: rgba(26, 26, 26, 0.55);
}
.haw-insurance__row strong { color: var(--haw-ink); font-weight: 600; }
.haw-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 600;
    background: rgba(63, 180, 106, 0.14);
    color: #1f8c46;
    border: 1px solid rgba(63, 180, 106, 0.25);
}
.haw-pill--ok::before {
    content: '';
    width: 6px; height: 6px;
    border-radius: 999px;
    background: #1f8c46;
}

/* Calendar / booking */
.haw-mock--cal { padding: 28px; }
.haw-mock--cal {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: stretch;
    justify-content: center;
}
.haw-cal__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 10px 14px;
    font-size: 13px;
    color: rgba(26, 26, 26, 0.7);
    width: 80%;
    max-width: 380px;
    margin: 0 auto;
}
.haw-slot {
    width: 80%;
    max-width: 380px;
    margin: 0 auto;
    padding: 12px 14px;
    border-radius: 12px;
    font-size: 13.5px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    color: rgba(26, 26, 26, 0.7);
}
.haw-slot--on {
    background: linear-gradient(180deg, #fff 0%, color-mix(in srgb, var(--haw-a) 30%, white) 100%);
    border-color: color-mix(in srgb, var(--haw-b) 35%, transparent);
    color: var(--haw-ink);
    font-weight: 600;
}
.haw-slot--off { opacity: 0.6; }

/* SMS */
.haw-mock--sms { padding: 28px; }
.haw-mock--sms { display: flex; flex-direction: column; gap: 8px; justify-content: center; align-items: stretch; }
.haw-sms {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 14px;
    padding: 12px 16px;
    font-size: 13.5px;
    color: var(--haw-ink);
    width: 80%;
    max-width: 360px;
    margin: 0 auto;
    box-shadow: 0 6px 18px -12px rgba(15, 23, 42, 0.14);
}
.haw-sms--head {
    background: rgba(15, 23, 42, 0.04);
    color: rgba(26, 26, 26, 0.55);
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 8px 16px;
}
.haw-sms__row { padding: 4px 0; }
.haw-sms__row--quiet { color: rgba(26, 26, 26, 0.4); font-size: 12.5px; }

/* EHR */
.haw-mock--ehr { padding: 28px; }
.haw-mock--ehr {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
    justify-content: center;
}
.haw-ehr__head {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 10px 16px;
    font-size: 12.5px;
    font-weight: 600;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    width: 80%;
    max-width: 360px;
}
.haw-ehr__line {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 10px 16px;
    font-size: 13.5px;
    color: rgba(26, 26, 26, 0.65);
    width: 80%;
    max-width: 360px;
    display: flex;
    justify-content: space-between;
}
.haw-ehr__line strong { color: var(--haw-ink); font-weight: 600; }
.haw-ehr__pill { margin-top: 2px; }

/* ── CHATBOT VISUALS ─────────────────────────────────────────── */

/* Knowledge base mockup */
.haw-mock--kb { display: block; padding: 36px; }
.haw-kb-tab {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 14px;
    padding: 10px 18px;
    font-size: 13px;
    color: rgba(26, 26, 26, 0.62);
    box-shadow: 0 8px 24px -16px rgba(15, 23, 42, 0.18);
    width: 56%;
    max-width: 320px;
    text-align: left;
}
.haw-kb-tab--3 { top: 22%; transform: translate(-50%, 0) scale(0.84); opacity: 0.7; }
.haw-kb-tab--2 { top: 30%; transform: translate(-50%, 0) scale(0.92); opacity: 0.88; }
.haw-kb-tab--1 { top: 38%; color: var(--haw-b); border-color: rgba(15,23,42,0.10); display: flex; align-items: center; gap: 8px; }
.haw-kb-card {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%);
    width: 70%;
    max-width: 380px;
    padding: 14px 16px;
    border-radius: 16px;
    background: linear-gradient(180deg, #fff 0%, #fafaf7 100%);
    box-shadow: 0 14px 32px -18px rgba(15, 23, 42, 0.20);
    border: 1px solid rgba(15, 23, 42, 0.06);
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.haw-kb-card__row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 10px;
    font-size: 13px;
    color: rgba(26, 26, 26, 0.7);
    position: relative;
}
.haw-kb-card__row--active {
    background: color-mix(in srgb, var(--haw-a) 35%, white);
    color: var(--haw-ink);
    font-weight: 500;
}
.haw-kb-card__pulse {
    margin-left: auto;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--haw-b);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--haw-b) 25%, transparent);
    animation: haw-pulse 1.6s ease-in-out infinite;
}
.haw-kb-card__icon { opacity: 0.7; font-size: 14px; }
.haw-kb-card__foot {
    margin-top: 4px;
    padding: 8px 10px 4px;
    border-top: 1px dashed rgba(15, 23, 42, 0.08);
    font-size: 11px;
    color: rgba(26, 26, 26, 0.45);
    letter-spacing: 0.02em;
}

/* Chatbot conversation mockup (shared) */
.haw-mock--chatbot { padding: 28px; flex-direction: column; align-items: stretch; gap: 10px; display: flex; justify-content: center; }
.haw-cbt {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 18px;
    padding: 16px 14px;
    width: 86%;
    max-width: 380px;
    margin: 0 auto;
    box-shadow: 0 14px 36px -20px rgba(15, 23, 42, 0.20);
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.haw-cbt--compact { gap: 4px; padding: 10px; }
.haw-cbt__head {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: rgba(26, 26, 26, 0.5);
    padding: 0 6px 4px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
}
.haw-cbt__dot {
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: #1f8c46;
    box-shadow: 0 0 0 3px rgba(31, 140, 70, 0.15);
}
.haw-cbt__lang {
    font-size: 10.5px;
    padding: 3px 8px;
    border-radius: 6px;
    background: rgba(15, 23, 42, 0.06);
    color: rgba(26, 26, 26, 0.6);
    letter-spacing: 0.05em;
}
.haw-cbt__lang--active { background: var(--haw-b); color: #fff; }
.haw-cbt__lang-arrow { color: rgba(26, 26, 26, 0.35); font-size: 12px; }
.haw-cbt__msg {
    padding: 10px 14px;
    border-radius: 14px;
    font-size: 13.5px;
    line-height: 1.4;
    max-width: 92%;
}
.haw-cbt__msg--user {
    align-self: flex-start;
    background: #f3f3f1;
    color: var(--haw-ink);
    border-bottom-left-radius: 4px;
}
.haw-cbt__msg--bot {
    align-self: flex-end;
    background: var(--haw-b);
    color: #fff;
    border-bottom-right-radius: 4px;
    box-shadow: 0 6px 16px -8px color-mix(in srgb, var(--haw-b) 50%, transparent);
}
.haw-cbt__tag {
    align-self: flex-start;
    margin-left: 8px;
    font-size: 10.5px;
    font-weight: 600;
    color: var(--haw-b);
    background: color-mix(in srgb, var(--haw-b) 12%, white);
    border: 1px solid color-mix(in srgb, var(--haw-b) 22%, transparent);
    padding: 3px 8px;
    border-radius: 999px;
    letter-spacing: 0.02em;
}
.haw-cbt__tag--alert {
    color: #b8331c;
    background: rgba(232, 73, 28, 0.10);
    border-color: rgba(232, 73, 28, 0.22);
}
.haw-cbt__typing {
    align-self: flex-end;
    background: var(--haw-b);
    border-radius: 14px;
    border-bottom-right-radius: 4px;
    padding: 10px 14px;
    display: flex;
    gap: 4px;
}
.haw-cbt__typing span {
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.7);
    animation: haw-bounce 1.2s ease-in-out infinite;
}
.haw-cbt__typing span:nth-child(2) { animation-delay: 0.15s; }
.haw-cbt__typing span:nth-child(3) { animation-delay: 0.3s; }
.haw-cbt__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 4px 8px;
}
.haw-cbt__chip {
    padding: 6px 12px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.10);
    font-size: 12.5px;
    color: rgba(26, 26, 26, 0.7);
    font-weight: 500;
}
.haw-cbt__chip--selected {
    background: var(--haw-b);
    color: #fff;
    border-color: var(--haw-b);
    box-shadow: 0 4px 12px -4px color-mix(in srgb, var(--haw-b) 50%, transparent);
}
.haw-cbt__confirm {
    margin-top: 4px;
    padding: 10px 12px;
    background: color-mix(in srgb, var(--haw-a) 35%, white);
    border: 1px solid color-mix(in srgb, var(--haw-b) 25%, transparent);
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.haw-cbt__confirm-icon {
    width: 22px;
    height: 22px;
    border-radius: 999px;
    background: var(--haw-b);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    flex-shrink: 0;
}
.haw-cbt__confirm strong { display: block; font-size: 13px; color: var(--haw-ink); font-weight: 600; }
.haw-cbt__confirm small { font-size: 11.5px; color: rgba(26, 26, 26, 0.55); }
.haw-cbt__handoff {
    margin-top: 4px;
    padding: 10px 12px;
    background: color-mix(in srgb, var(--haw-a) 35%, white);
    border: 1px solid color-mix(in srgb, var(--haw-b) 25%, transparent);
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.haw-cbt__avatar {
    width: 32px;
    height: 32px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--haw-b) 0%, color-mix(in srgb, var(--haw-b) 60%, black) 100%);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11.5px;
    font-weight: 700;
    flex-shrink: 0;
    letter-spacing: 0.04em;
}
.haw-cbt__handoff strong { display: block; font-size: 13px; color: var(--haw-ink); font-weight: 600; }
.haw-cbt__handoff small { font-size: 11.5px; color: rgba(26, 26, 26, 0.55); }
.haw-cbt__live {
    margin-left: auto;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #1f8c46;
    box-shadow: 0 0 0 4px rgba(31, 140, 70, 0.18);
    animation: haw-pulse 1.4s ease-in-out infinite;
}
.haw-cbt-arrow {
    text-align: center;
    color: rgba(26, 26, 26, 0.35);
    font-size: 18px;
    line-height: 1;
    margin: 2px 0;
}

/* CRM record card */
.haw-crm {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 14px;
    padding: 12px 14px;
    width: 86%;
    max-width: 380px;
    margin: 0 auto;
    box-shadow: 0 12px 28px -18px rgba(15, 23, 42, 0.18);
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.haw-crm__head {
    font-size: 11px;
    font-weight: 600;
    color: rgba(26, 26, 26, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding-bottom: 4px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
    margin-bottom: 2px;
}
.haw-crm__line {
    display: flex;
    justify-content: space-between;
    font-size: 12.5px;
    color: rgba(26, 26, 26, 0.65);
    padding: 2px 0;
}
.haw-crm__line strong { color: var(--haw-ink); font-weight: 600; }
.haw-crm .haw-pill { align-self: flex-start; margin-top: 4px; }

@keyframes haw-pulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.15); opacity: 0.7; }
}
@keyframes haw-bounce {
    0%, 60%, 100% { transform: translateY(0); opacity: 0.7; }
    30% { transform: translateY(-3px); opacity: 1; }
}

/* ── SMART BOOKING VISUALS ───────────────────────────────────── */
.haw-mock--sb {
    padding: 28px;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    display: flex;
    justify-content: center;
}
.haw-mock--sb > * { width: 86%; max-width: 380px; margin: 0 auto; }

/* Sync mockup */
.haw-sb-sources {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
}
.haw-sb-source {
    display: flex; align-items: center; gap: 8px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 10px;
    padding: 8px 12px;
    font-size: 12px;
    color: var(--haw-ink);
    box-shadow: 0 4px 12px -8px rgba(15, 23, 42, 0.08);
}
.haw-sb-source__icon { font-size: 14px; }
.haw-sb-merge {
    display: flex;
    justify-content: center;
    gap: 8px;
    height: 24px;
    margin: 4px 0;
    align-items: center;
}
.haw-sb-merge__line {
    width: 1.5px;
    height: 100%;
    background: linear-gradient(to bottom, transparent, var(--haw-b), transparent);
    background-size: 100% 200%;
    animation: haw-flow-down 1.4s linear infinite;
}
.haw-sb-merge__line:nth-child(2) { animation-delay: 0.2s; }
.haw-sb-merge__line:nth-child(3) { animation-delay: 0.4s; }
.haw-sb-merge__line:nth-child(4) { animation-delay: 0.6s; }
.haw-sb-unified {
    display: flex; flex-direction: column; align-items: center;
    background: linear-gradient(180deg, #fff 0%, color-mix(in srgb, var(--haw-a) 30%, white) 100%);
    border: 1px solid color-mix(in srgb, var(--haw-b) 30%, transparent);
    border-radius: 14px;
    padding: 12px 16px;
    text-align: center;
    position: relative;
    box-shadow: 0 12px 32px -16px color-mix(in srgb, var(--haw-b) 30%, transparent);
}
.haw-sb-unified__pulse {
    position: absolute;
    top: 10px; right: 12px;
    width: 8px; height: 8px;
    border-radius: 999px;
    background: var(--haw-b);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--haw-b) 25%, transparent);
    animation: haw-pulse 1.4s ease-in-out infinite;
}
.haw-sb-unified strong { font-size: 13.5px; color: var(--haw-ink); font-weight: 600; }
.haw-sb-unified small { font-size: 11px; color: rgba(26, 26, 26, 0.55); }

/* Match mockup */
.haw-sb-visitor, .haw-sb-provider {
    display: flex; align-items: center; gap: 10px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 10px 12px;
    box-shadow: 0 6px 18px -10px rgba(15, 23, 42, 0.10);
}
.haw-sb-visitor__avatar, .haw-sb-provider__avatar {
    width: 32px; height: 32px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--haw-b) 0%, color-mix(in srgb, var(--haw-b) 60%, black) 100%);
    color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    flex-shrink: 0;
}
.haw-sb-visitor strong, .haw-sb-provider strong { display: block; font-size: 13px; color: var(--haw-ink); font-weight: 600; }
.haw-sb-visitor small, .haw-sb-provider small { font-size: 11.5px; color: rgba(26, 26, 26, 0.55); }
.haw-sb-tags {
    display: flex; flex-wrap: wrap; gap: 6px;
    padding: 0 12px;
}
.haw-sb-tag {
    background: color-mix(in srgb, var(--haw-a) 50%, white);
    color: var(--haw-ink);
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 500;
}
.haw-sb-route-line {
    height: 28px;
    width: 2px;
    background: linear-gradient(to bottom, transparent, var(--haw-b), transparent);
    background-size: 100% 200%;
    margin: 0 auto;
    animation: haw-flow-down 1.4s linear infinite;
}
.haw-sb-match-pill {
    margin-left: auto;
    background: color-mix(in srgb, var(--haw-b) 12%, white);
    color: var(--haw-b);
    border: 1px solid color-mix(in srgb, var(--haw-b) 28%, transparent);
    border-radius: 999px;
    padding: 3px 8px;
    font-size: 10.5px;
    font-weight: 600;
    flex-shrink: 0;
}

/* Lock mockup */
.haw-sb-cal {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 10px 12px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.12);
}
.haw-sb-cal__head {
    font-size: 11px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
    margin-bottom: 6px;
}
.haw-sb-cal__slot {
    padding: 8px 10px;
    border-radius: 8px;
    font-size: 12.5px;
    color: rgba(26, 26, 26, 0.55);
    margin: 3px 0;
}
.haw-sb-cal__slot--locked {
    background: color-mix(in srgb, var(--haw-a) 40%, white);
    border: 1px solid color-mix(in srgb, var(--haw-b) 30%, transparent);
    color: var(--haw-ink);
    font-weight: 600;
    display: flex; align-items: center; justify-content: space-between;
    gap: 8px;
}
.haw-sb-locked-badge {
    background: var(--haw-b);
    color: #fff;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 600;
    flex-shrink: 0;
    animation: haw-pulse 1.6s ease-in-out infinite;
}
.haw-sb-channels {
    display: flex; flex-direction: column; gap: 4px;
    margin-top: 6px;
}
.haw-sb-channel {
    display: flex; align-items: center; gap: 6px;
    background: #fafafa;
    border: 1px dashed rgba(15, 23, 42, 0.10);
    border-radius: 8px;
    padding: 6px 10px;
    font-size: 11.5px;
    color: rgba(26, 26, 26, 0.55);
}
.haw-sb-channel--blocked span { color: rgba(26, 26, 26, 0.45); margin-left: auto; font-style: italic; font-size: 10.5px; }

/* Reminder timeline */
.haw-sb-timeline {
    display: flex; flex-direction: column; gap: 10px;
    padding: 4px 0;
    position: relative;
}
.haw-sb-timeline::before {
    content: '';
    position: absolute;
    top: 12px; bottom: 12px;
    left: 9px;
    width: 1px;
    background: rgba(15, 23, 42, 0.10);
}
.haw-sb-tl-item {
    display: flex; align-items: flex-start; gap: 12px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 10px;
    padding: 8px 12px;
    position: relative;
    z-index: 1;
    opacity: 0.65;
}
.haw-sb-tl-item--past { opacity: 1; }
.haw-sb-tl-item--active {
    opacity: 1;
    background: color-mix(in srgb, var(--haw-a) 30%, white);
    border-color: color-mix(in srgb, var(--haw-b) 30%, transparent);
}
.haw-sb-tl-dot {
    width: 12px; height: 12px;
    border-radius: 999px;
    background: var(--haw-b);
    flex-shrink: 0;
    margin-top: 2px;
    border: 2px solid #fff;
}
.haw-sb-tl-dot--pulse {
    animation: haw-pulse 1.4s ease-in-out infinite;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--haw-b) 25%, transparent);
}
.haw-sb-tl-item strong { display: block; font-size: 12.5px; color: var(--haw-ink); font-weight: 600; }
.haw-sb-tl-item small { font-size: 11px; color: rgba(26, 26, 26, 0.6); }

/* Rebook mockup */
.haw-sb-noshow {
    display: flex; align-items: center; gap: 10px;
    background: rgba(232, 73, 28, 0.08);
    border: 1px solid rgba(232, 73, 28, 0.22);
    border-radius: 12px;
    padding: 10px 12px;
}
.haw-sb-noshow__icon {
    width: 28px; height: 28px;
    border-radius: 999px;
    background: rgba(232, 73, 28, 0.15);
    color: #b8331c;
    display: inline-flex; align-items: center; justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
}
.haw-sb-noshow strong { display: block; font-size: 13px; color: var(--haw-ink); font-weight: 600; }
.haw-sb-noshow small { font-size: 11.5px; color: rgba(26, 26, 26, 0.55); }
.haw-sb-arrow-down {
    text-align: center;
    color: rgba(26, 26, 26, 0.35);
    font-size: 16px;
    line-height: 1;
}
.haw-sb-rebook {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 10px 12px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.12);
    display: flex; flex-direction: column; gap: 6px;
}
.haw-sb-rebook__head {
    font-size: 11px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.haw-sb-rebook__slots {
    display: flex; gap: 5px; flex-wrap: wrap;
}
.haw-sb-rebook__slot {
    padding: 5px 10px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.10);
    font-size: 11.5px;
    color: rgba(26, 26, 26, 0.7);
}
.haw-sb-rebook__slot--on {
    background: var(--haw-b);
    color: #fff;
    border-color: var(--haw-b);
}
.haw-sb-rebook__confirm {
    display: flex; align-items: center; gap: 8px;
    margin-top: 4px;
    padding: 8px 10px;
    background: color-mix(in srgb, var(--haw-a) 30%, white);
    border-radius: 10px;
    font-size: 12px;
    color: var(--haw-ink);
    font-weight: 500;
}
.haw-sb-rebook__check {
    width: 20px; height: 20px;
    border-radius: 999px;
    background: var(--haw-b);
    color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 11px; font-weight: 700;
}

/* Dashboard mockup */
.haw-sb-dash {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 14px;
    padding: 14px;
    box-shadow: 0 12px 32px -16px rgba(15, 23, 42, 0.14);
    display: flex; flex-direction: column; gap: 12px;
}
.haw-sb-dash__head {
    font-size: 11px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
}
.haw-sb-stat__row {
    display: flex; justify-content: space-between;
    font-size: 12.5px;
    color: rgba(26, 26, 26, 0.65);
    margin-bottom: 6px;
}
.haw-sb-stat__row strong {
    color: var(--haw-ink);
    font-weight: 700;
    font-size: 14px;
}
.haw-sb-bar {
    height: 6px;
    background: rgba(15, 23, 42, 0.06);
    border-radius: 999px;
    overflow: hidden;
}
.haw-sb-bar__fill {
    height: 100%;
    background: linear-gradient(90deg, color-mix(in srgb, var(--haw-b) 70%, white) 0%, var(--haw-b) 100%);
    border-radius: 999px;
    animation: haw-bar-grow 1.4s ease-out;
}
.haw-sb-bar__fill--low {
    background: linear-gradient(90deg, #3fb46a 0%, #1f8c46 100%);
}

@keyframes haw-flow-down {
    0% { background-position: 0 -200%; }
    100% { background-position: 0 200%; }
}
@keyframes haw-bar-grow {
    0% { width: 0% !important; }
}

/* ── DIGITAL INTAKE VISUALS ──────────────────────────────────── */
.haw-mock--di {
    padding: 28px;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    display: flex;
    justify-content: center;
}
.haw-mock--di > * { width: 86%; max-width: 380px; margin: 0 auto; }

/* SMS link */
.haw-di-sms {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 14px;
    padding: 12px 14px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
}
.haw-di-sms__head {
    font-size: 11px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
    margin-bottom: 6px;
}
.haw-di-sms__body { font-size: 13px; color: var(--haw-ink); line-height: 1.5; }
.haw-di-sms__link {
    display: inline-block;
    margin-top: 4px;
    color: var(--haw-b);
    font-weight: 600;
    text-decoration: underline;
}
.haw-di-sms__meta {
    margin-top: 6px;
    font-size: 10.5px;
    color: rgba(26, 26, 26, 0.45);
}
.haw-di-arrow {
    text-align: center;
    color: rgba(26, 26, 26, 0.35);
    font-size: 16px;
    line-height: 1;
}
.haw-di-tap {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    background: color-mix(in srgb, var(--haw-a) 35%, white);
    border: 1px solid color-mix(in srgb, var(--haw-b) 30%, transparent);
    border-radius: 12px;
    padding: 10px 14px;
    font-size: 12.5px;
    color: var(--haw-ink);
    font-weight: 500;
}
.haw-di-tap__icon { font-size: 16px; animation: haw-pulse 1.4s ease-in-out infinite; }

/* Phone form */
.haw-di-phone {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 18px;
    padding: 14px;
    box-shadow: 0 14px 36px -16px rgba(15, 23, 42, 0.18);
    width: 78%;
    max-width: 320px;
}
.haw-di-phone__head {
    display: flex; align-items: center; gap: 10px;
    margin-bottom: 12px;
}
.haw-di-phone__progress {
    flex: 1;
    height: 4px;
    background: rgba(15, 23, 42, 0.08);
    border-radius: 999px;
    overflow: hidden;
}
.haw-di-phone__progress span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, color-mix(in srgb, var(--haw-b) 60%, white) 0%, var(--haw-b) 100%);
    border-radius: 999px;
}
.haw-di-phone__step { font-size: 10px; color: rgba(26, 26, 26, 0.5); font-weight: 600; }
.haw-di-phone__title { font-size: 14px; font-weight: 600; color: var(--haw-ink); margin-bottom: 8px; }
.haw-di-phone__opts { display: flex; gap: 6px; margin-bottom: 8px; }
.haw-di-phone__opt {
    padding: 8px 14px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.10);
    font-size: 12px;
    color: rgba(26, 26, 26, 0.7);
}
.haw-di-phone__opt--on {
    background: var(--haw-b);
    color: #fff;
    border-color: var(--haw-b);
    box-shadow: 0 4px 10px -2px color-mix(in srgb, var(--haw-b) 50%, transparent);
}
.haw-di-phone__branch {
    display: flex; align-items: center; gap: 8px;
    margin: 6px 0 8px;
    padding-left: 6px;
}
.haw-di-phone__branch-line {
    width: 18px;
    height: 2px;
    background: var(--haw-b);
    border-radius: 999px;
}
.haw-di-phone__branch-tag {
    background: color-mix(in srgb, var(--haw-b) 12%, white);
    color: var(--haw-b);
    border: 1px solid color-mix(in srgb, var(--haw-b) 28%, transparent);
    border-radius: 999px;
    padding: 2px 8px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.04em;
}
.haw-di-phone__sub { display: flex; flex-direction: column; gap: 4px; padding-left: 12px; }
.haw-di-phone__sub-q {
    background: color-mix(in srgb, var(--haw-a) 25%, white);
    border: 1px solid var(--haw-a);
    border-radius: 8px;
    padding: 6px 10px;
    font-size: 11.5px;
    color: rgba(26, 26, 26, 0.6);
    opacity: 0.55;
}
.haw-di-phone__sub-q--active {
    opacity: 1;
    color: var(--haw-ink);
    font-weight: 600;
    border-color: color-mix(in srgb, var(--haw-b) 30%, transparent);
}

/* Insurance OCR */
.haw-di-card {
    background: linear-gradient(135deg, #1d3a6e 0%, #355285 100%);
    border-radius: 12px;
    padding: 16px;
    color: #fff;
    position: relative;
    overflow: hidden;
    box-shadow: 0 12px 28px -12px rgba(29, 58, 110, 0.40);
}
.haw-di-card__top {
    display: flex; align-items: center; gap: 10px;
}
.haw-di-card__camera { font-size: 20px; }
.haw-di-card__photo { font-size: 12px; color: rgba(255, 255, 255, 0.85); font-weight: 500; }
.haw-di-card__scan {
    position: absolute;
    left: 0; right: 0;
    top: 50%;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.6), transparent);
    box-shadow: 0 0 12px rgba(255, 255, 255, 0.4);
    animation: haw-scan 2s ease-in-out infinite;
}
.haw-di-fields {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 12px 14px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 4px;
}
.haw-di-fields__head {
    font-size: 10.5px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding-bottom: 4px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
    margin-bottom: 4px;
}
.haw-di-fields__row {
    display: flex; justify-content: space-between;
    font-size: 12px;
    color: rgba(26, 26, 26, 0.6);
    padding: 2px 0;
}
.haw-di-fields__row strong { color: var(--haw-ink); font-weight: 600; }
.haw-di-fields__pill {
    align-self: flex-start;
    margin-top: 4px;
    background: rgba(31, 140, 70, 0.10);
    border: 1px solid rgba(31, 140, 70, 0.25);
    color: #1f8c46;
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 10.5px;
    font-weight: 700;
}

/* E-signatures */
.haw-di-doc {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 14px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
}
.haw-di-doc__head {
    font-size: 11px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
    margin-bottom: 8px;
}
.haw-di-doc__lines { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }
.haw-di-doc__lines span {
    display: block;
    height: 4px;
    background: rgba(15, 23, 42, 0.08);
    border-radius: 999px;
    width: 100%;
}
.haw-di-sig {
    position: relative;
    margin: 8px 0 12px;
    padding: 10px 0 4px;
}
.haw-di-sig__line {
    position: absolute;
    left: 0; right: 0; bottom: 18px;
    height: 1px;
    background: rgba(15, 23, 42, 0.18);
}
.haw-di-sig__name {
    font-family: 'Brush Script MT', cursive, ui-serif, serif;
    font-size: 22px;
    color: var(--haw-b);
    font-weight: 400;
    font-style: italic;
}
.haw-di-sig__date {
    display: inline-block;
    margin-left: 8px;
    font-size: 11px;
    color: rgba(26, 26, 26, 0.5);
}
.haw-di-checks { display: flex; flex-direction: column; gap: 4px; }
.haw-di-check {
    display: inline-flex; align-items: center; gap: 6px;
    background: color-mix(in srgb, var(--haw-a) 25%, white);
    border: 1px solid color-mix(in srgb, var(--haw-b) 25%, transparent);
    color: var(--haw-ink);
    border-radius: 8px;
    padding: 5px 10px;
    font-size: 11.5px;
    font-weight: 500;
}

/* Pre-visit pay */
.haw-di-pay {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 14px;
    padding: 14px;
    box-shadow: 0 12px 28px -14px rgba(15, 23, 42, 0.12);
    display: flex; flex-direction: column; gap: 8px;
}
.haw-di-pay__head {
    font-size: 11px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
}
.haw-di-pay__row {
    display: flex; justify-content: space-between;
    font-size: 12.5px;
    color: rgba(26, 26, 26, 0.65);
}
.haw-di-pay__row strong { color: var(--haw-ink); font-weight: 600; }
.haw-di-pay__card {
    display: flex; align-items: center; gap: 10px;
    margin-top: 4px;
    padding: 10px 12px;
    background: color-mix(in srgb, var(--haw-a) 35%, white);
    border: 1px solid color-mix(in srgb, var(--haw-b) 28%, transparent);
    border-radius: 10px;
    font-size: 13px;
    color: var(--haw-ink);
    font-weight: 500;
}
.haw-di-pay__card-icon { font-size: 16px; }
.haw-di-pay__card-pulse {
    margin-left: auto;
    width: 8px; height: 8px;
    border-radius: 999px;
    background: var(--haw-b);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--haw-b) 25%, transparent);
    animation: haw-pulse 1.4s ease-in-out infinite;
}
.haw-di-pay__btn {
    margin-top: 4px;
    padding: 10px 12px;
    background: var(--haw-b);
    color: #fff;
    border-radius: 10px;
    text-align: center;
    font-size: 13px;
    font-weight: 600;
    box-shadow: 0 8px 20px -6px color-mix(in srgb, var(--haw-b) 60%, transparent);
}

/* EHR sync */
.haw-di-form-mini, .haw-di-ehr {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 12px 14px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 4px;
}
.haw-di-form-mini__head, .haw-di-ehr__head {
    font-size: 10.5px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding-bottom: 4px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
    margin-bottom: 4px;
}
.haw-di-form-mini__row {
    font-size: 12px;
    color: var(--haw-ink);
    padding: 2px 0;
}
.haw-di-ehr__field {
    font-family: ui-monospace, SFMono-Regular, monospace;
    font-size: 11.5px;
    color: rgba(26, 26, 26, 0.7);
    padding: 3px 0;
}
.haw-di-ehr__pill {
    align-self: flex-start;
    margin-top: 4px;
    background: rgba(31, 140, 70, 0.10);
    border: 1px solid rgba(31, 140, 70, 0.25);
    color: #1f8c46;
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 10.5px;
    font-weight: 700;
}

@keyframes haw-scan {
    0%, 100% { transform: translateY(-22px); opacity: 1; }
    50% { transform: translateY(22px); opacity: 1; }
}

/* ── AI AFTERCARE VISUALS ───────────────────────────────────── */
.haw-mock--ac {
    padding: 28px;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    display: flex;
    justify-content: center;
}
.haw-mock--ac > * { width: 86%; max-width: 380px; margin: 0 auto; }

/* Enroll: visit closed event + cadence card */
.haw-ac-event {
    display: flex; align-items: center; gap: 12px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 12px 14px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    position: relative;
}
.haw-ac-event__pulse {
    width: 10px; height: 10px;
    border-radius: 999px;
    background: var(--haw-b);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--haw-b) 25%, transparent);
    animation: haw-pulse 1.4s ease-in-out infinite;
    flex-shrink: 0;
}
.haw-ac-event strong { display: block; font-size: 13px; color: var(--haw-ink); font-weight: 600; }
.haw-ac-event small { font-size: 11.5px; color: rgba(26, 26, 26, 0.55); }
.haw-ac-cadence-card {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 12px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 8px;
}
.haw-ac-cadence-card__head {
    font-size: 11px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
}
.haw-ac-cadence-card__steps {
    display: flex; gap: 6px;
}
.haw-ac-step {
    flex: 1;
    text-align: center;
    background: color-mix(in srgb, var(--haw-a) 35%, white);
    border: 1px solid color-mix(in srgb, var(--haw-b) 20%, transparent);
    border-radius: 8px;
    padding: 6px 8px;
    font-size: 12px;
    font-weight: 600;
    color: var(--haw-ink);
}
.haw-ac-cadence-card__pill {
    align-self: flex-start;
    background: rgba(31, 140, 70, 0.10);
    color: #1f8c46;
    border: 1px solid rgba(31, 140, 70, 0.25);
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 10.5px;
    font-weight: 700;
}

/* Check-in SMS */
.haw-ac-sms {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 14px;
    padding: 12px 14px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 8px;
}
.haw-ac-sms__head {
    font-size: 11px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
}
.haw-ac-sms__body {
    font-size: 13px;
    color: var(--haw-ink);
    line-height: 1.5;
}
.haw-ac-sms__opts {
    display: flex; gap: 5px;
    margin-top: 2px;
}
.haw-ac-sms__opt {
    flex: 1;
    text-align: center;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.10);
    border-radius: 8px;
    padding: 6px 0;
    font-size: 13px;
    font-weight: 600;
    color: rgba(26, 26, 26, 0.65);
}
.haw-ac-sms__opt--on {
    background: var(--haw-b);
    color: #fff;
    border-color: var(--haw-b);
    box-shadow: 0 4px 10px -2px color-mix(in srgb, var(--haw-b) 50%, transparent);
}
.haw-ac-sms__legend {
    display: flex; justify-content: space-between;
    font-size: 10px;
    color: rgba(26, 26, 26, 0.45);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.haw-ac-reply {
    align-self: flex-end;
    background: var(--haw-b);
    color: #fff;
    padding: 8px 12px;
    border-radius: 14px;
    border-bottom-right-radius: 4px;
    font-size: 13px;
    max-width: 80%;
    margin-left: auto;
    box-shadow: 0 6px 16px -8px color-mix(in srgb, var(--haw-b) 50%, transparent);
}

/* Photo + AI flag */
.haw-ac-photo {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 12px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 8px;
}
.haw-ac-photo__frame {
    position: relative;
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
    border-radius: 10px;
    padding: 18px 14px;
    color: #fff;
    text-align: center;
    overflow: hidden;
    display: flex; align-items: center; gap: 10px; justify-content: center;
}
.haw-ac-photo__icon { font-size: 24px; }
.haw-ac-photo__caption { font-size: 12px; color: rgba(255, 255, 255, 0.85); }
.haw-ac-photo__scan {
    position: absolute;
    left: 0; right: 0; top: 50%;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.7), transparent);
    box-shadow: 0 0 12px rgba(255, 255, 255, 0.5);
    animation: haw-scan 2s ease-in-out infinite;
}
.haw-ac-photo__analysis { display: flex; flex-direction: column; gap: 3px; }
.haw-ac-photo__row {
    display: flex; justify-content: space-between;
    font-size: 11.5px;
    color: rgba(26, 26, 26, 0.6);
    padding: 2px 4px;
}
.haw-ac-photo__row strong { color: var(--haw-ink); font-weight: 600; }
.haw-ac-photo__row:last-child strong { color: #b8331c; font-weight: 700; }
.haw-ac-flag {
    display: flex; align-items: center; gap: 8px;
    background: rgba(232, 73, 28, 0.08);
    border: 1px solid rgba(232, 73, 28, 0.25);
    color: #b8331c;
    border-radius: 10px;
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 600;
}
.haw-ac-flag__bolt { font-size: 14px; }
.haw-ac-flag__live {
    margin-left: auto;
    width: 8px; height: 8px;
    border-radius: 999px;
    background: #b8331c;
    box-shadow: 0 0 0 4px rgba(232, 73, 28, 0.18);
    animation: haw-pulse 1.2s ease-in-out infinite;
}

/* Aftercare guide */
.haw-ac-guide {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 12px 14px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 6px;
}
.haw-ac-guide__head {
    font-size: 11px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
    margin-bottom: 2px;
}
.haw-ac-guide__row {
    display: flex; align-items: center; gap: 8px;
    font-size: 12.5px;
    color: var(--haw-ink);
    padding: 4px 6px;
    border-radius: 7px;
}
.haw-ac-guide__row.aif-do { background: color-mix(in srgb, var(--haw-a) 30%, white); }
.haw-ac-guide__row.aif-dont { background: rgba(15, 23, 42, 0.04); color: rgba(26, 26, 26, 0.7); }
.haw-ac-guide__check {
    width: 18px; height: 18px;
    border-radius: 999px;
    background: var(--haw-b);
    color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 10px; font-weight: 700;
    flex-shrink: 0;
}
.haw-ac-guide__x {
    width: 18px; height: 18px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.20);
    color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 10px; font-weight: 700;
    flex-shrink: 0;
}
.haw-ac-guide__pill {
    align-self: flex-start;
    margin-top: 4px;
    background: color-mix(in srgb, var(--haw-b) 10%, white);
    color: var(--haw-b);
    border: 1px solid color-mix(in srgb, var(--haw-b) 25%, transparent);
    border-radius: 999px;
    padding: 3px 9px;
    font-size: 10.5px;
    font-weight: 700;
}

/* Review at peak */
.haw-ac-score {
    display: flex; align-items: center; gap: 10px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 10px;
    padding: 8px 12px;
}
.haw-ac-score__label {
    font-size: 11px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    flex-shrink: 0;
}
.haw-ac-score__bar { flex: 1; height: 6px; background: rgba(15, 23, 42, 0.08); border-radius: 999px; overflow: hidden; }
.haw-ac-score__fill {
    height: 100%;
    background: linear-gradient(90deg, color-mix(in srgb, var(--haw-b) 70%, white), var(--haw-b));
    border-radius: 999px;
    animation: haw-bar-grow 1.4s ease-out;
}
.haw-ac-score__num {
    font-size: 14px;
    font-weight: 700;
    color: var(--haw-b);
    flex-shrink: 0;
}
.haw-ac-stars {
    display: flex; align-items: center; gap: 8px;
    background: color-mix(in srgb, var(--haw-a) 30%, white);
    border: 1px solid color-mix(in srgb, var(--haw-b) 25%, transparent);
    border-radius: 8px;
    padding: 6px 10px;
    color: var(--haw-b);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.05em;
}
.haw-ac-stars span {
    margin-left: auto;
    font-size: 10.5px;
    font-weight: 600;
    color: var(--haw-ink);
    letter-spacing: 0;
    text-transform: uppercase;
}
.haw-ac-review {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 10px 12px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 6px;
}
.haw-ac-review__head {
    font-size: 10.5px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.haw-ac-review__body { font-size: 12.5px; color: var(--haw-ink); line-height: 1.4; }
.haw-ac-review__btns { display: flex; gap: 5px; flex-wrap: wrap; }
.haw-ac-review__btn {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.10);
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 11px;
    color: var(--haw-ink);
    font-weight: 500;
}
.haw-ac-review__btn.aif-google {
    background: var(--haw-b);
    color: #fff;
    border-color: var(--haw-b);
    box-shadow: 0 4px 10px -2px color-mix(in srgb, var(--haw-b) 50%, transparent);
}

/* Outcome archived */
.haw-ac-outcome {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 12px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 6px;
}
.haw-ac-outcome__head {
    font-size: 11px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
}
.haw-ac-outcome__photos {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 5px;
    margin: 4px 0;
}
.haw-ac-outcome__photo {
    background: linear-gradient(135deg, color-mix(in srgb, var(--haw-a) 30%, white) 0%, color-mix(in srgb, var(--haw-a) 50%, white) 100%);
    border: 1px solid color-mix(in srgb, var(--haw-b) 22%, transparent);
    border-radius: 8px;
    padding: 14px 6px 6px;
    text-align: center;
    font-size: 16px;
}
.haw-ac-outcome__photo small {
    display: block;
    margin-top: 4px;
    font-size: 10px;
    color: rgba(26, 26, 26, 0.55);
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.haw-ac-outcome__row {
    display: flex; justify-content: space-between;
    font-size: 12px;
    color: rgba(26, 26, 26, 0.6);
    padding: 1px 0;
}
.haw-ac-outcome__row strong { color: var(--haw-ink); font-weight: 600; }
.haw-ac-outcome__pill {
    align-self: flex-start;
    margin-top: 4px;
    background: rgba(31, 140, 70, 0.10);
    color: #1f8c46;
    border: 1px solid rgba(31, 140, 70, 0.25);
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 10.5px;
    font-weight: 700;
}

/* ── MISSED-CALL TEXT-BACK VISUALS ───────────────────────────── */
.haw-mock--mc {
    padding: 28px;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    display: flex;
    justify-content: center;
}
.haw-mock--mc > * { width: 86%; max-width: 380px; margin: 0 auto; }

/* Phone log */
.haw-mc-phone {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 12px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 5px;
}
.haw-mc-phone__head {
    font-size: 11px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
    margin-bottom: 2px;
}
.haw-mc-phone__row {
    display: grid;
    grid-template-columns: 1fr auto 70px;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    border-radius: 7px;
    font-size: 12px;
}
.haw-mc-phone__row--missed {
    background: color-mix(in srgb, var(--haw-a) 35%, white);
    border: 1px solid color-mix(in srgb, var(--haw-b) 25%, transparent);
    animation: haw-pulse-soft 1.6s ease-in-out infinite;
}
.haw-mc-phone__caller { color: var(--haw-ink); font-weight: 600; }
.haw-mc-phone__meta { font-size: 10.5px; color: rgba(26, 26, 26, 0.55); }
.haw-mc-phone__tag {
    background: var(--haw-b);
    color: #fff;
    border-radius: 999px;
    padding: 2px 8px;
    font-size: 10px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.haw-mc-phone__tag--ok {
    background: rgba(31, 140, 70, 0.12);
    color: #1f8c46;
    border: 1px solid rgba(31, 140, 70, 0.25);
}
.haw-mc-fire {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    background: color-mix(in srgb, var(--haw-a) 30%, white);
    border: 1px solid color-mix(in srgb, var(--haw-b) 30%, transparent);
    border-radius: 10px;
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 600;
    color: var(--haw-ink);
}
.haw-mc-fire__pulse {
    width: 10px; height: 10px;
    border-radius: 999px;
    background: var(--haw-b);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--haw-b) 25%, transparent);
    animation: haw-pulse 1.2s ease-in-out infinite;
}
@keyframes haw-pulse-soft {
    0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--haw-b) 0%, transparent); }
    50% { box-shadow: 0 0 0 4px color-mix(in srgb, var(--haw-b) 18%, transparent); }
}

/* Sub-30s SMS timer + bubble */
.haw-mc-timer {
    display: flex; align-items: center; justify-content: space-between;
    background: color-mix(in srgb, var(--haw-a) 30%, white);
    border: 1px solid color-mix(in srgb, var(--haw-b) 25%, transparent);
    border-radius: 10px;
    padding: 8px 14px;
}
.haw-mc-timer__label {
    font-size: 10.5px;
    font-weight: 700;
    color: var(--haw-ink);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.haw-mc-timer__num {
    font-size: 22px;
    font-weight: 800;
    color: var(--haw-b);
    font-family: ui-monospace, SFMono-Regular, monospace;
    letter-spacing: -0.02em;
}
.haw-mc-sms {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 14px;
    padding: 12px 14px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
}
.haw-mc-sms__head {
    font-size: 10.5px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
    margin-bottom: 6px;
}
.haw-mc-sms__body {
    font-size: 13px;
    color: var(--haw-ink);
    line-height: 1.5;
    margin-bottom: 6px;
}
.haw-mc-sms__from {
    font-size: 10.5px;
    color: rgba(26, 26, 26, 0.5);
    font-style: italic;
}

/* Routes */
.haw-mc-msg {
    background: #f3f3f1;
    color: var(--haw-ink);
    border-radius: 12px;
    border-bottom-left-radius: 4px;
    padding: 8px 12px;
    font-size: 12.5px;
    align-self: flex-start;
    max-width: 85%;
}
.haw-mc-routes { display: flex; flex-direction: column; gap: 6px; }
.haw-mc-route {
    display: grid;
    grid-template-columns: auto 1fr auto;
    column-gap: 12px;
    align-items: center;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 10px;
    padding: 8px 12px;
    box-shadow: 0 4px 12px -8px rgba(15, 23, 42, 0.08);
}
.haw-mc-route--on {
    background: color-mix(in srgb, var(--haw-a) 35%, white);
    border-color: color-mix(in srgb, var(--haw-b) 30%, transparent);
}
.haw-mc-route__icon { font-size: 18px; grid-row: span 2; }
.haw-mc-route strong { font-size: 12.5px; color: var(--haw-ink); font-weight: 600; }
.haw-mc-route small { font-size: 10.5px; color: rgba(26, 26, 26, 0.55); }

/* Caller context */
.haw-mc-caller {
    display: flex; align-items: center; gap: 10px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 10px 12px;
    box-shadow: 0 6px 16px -10px rgba(15, 23, 42, 0.10);
}
.haw-mc-caller__avatar {
    width: 36px; height: 36px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--haw-b) 0%, color-mix(in srgb, var(--haw-b) 60%, black) 100%);
    color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 13px; font-weight: 700;
    flex-shrink: 0;
}
.haw-mc-caller strong { display: block; font-size: 13px; color: var(--haw-ink); font-weight: 600; }
.haw-mc-caller small { font-size: 11px; color: rgba(26, 26, 26, 0.55); font-family: ui-monospace, monospace; }
.haw-mc-caller__pill {
    margin-left: auto;
    background: color-mix(in srgb, var(--haw-b) 12%, white);
    color: var(--haw-b);
    border: 1px solid color-mix(in srgb, var(--haw-b) 28%, transparent);
    border-radius: 999px;
    padding: 3px 9px;
    font-size: 10.5px;
    font-weight: 700;
}
.haw-mc-context {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 10px 12px;
    box-shadow: 0 6px 16px -10px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 3px;
}
.haw-mc-context__head {
    font-size: 10.5px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 4px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
    margin-bottom: 4px;
}
.haw-mc-context__row {
    display: flex; justify-content: space-between;
    font-size: 12px;
    color: rgba(26, 26, 26, 0.6);
    padding: 1px 0;
}
.haw-mc-context__row strong { color: var(--haw-ink); font-weight: 600; }

/* Outcomes tracker */
.haw-mc-outcomes {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 12px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 5px;
}
.haw-mc-outcomes__head {
    font-size: 10.5px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
    margin-bottom: 2px;
}
.haw-mc-outcomes__row {
    display: grid;
    grid-template-columns: 64px 1fr auto;
    gap: 8px;
    align-items: center;
    padding: 6px 8px;
    border-radius: 7px;
    font-size: 12px;
}
.haw-mc-outcomes__row--booked { background: rgba(31, 140, 70, 0.06); }
.haw-mc-outcomes__row--chat { background: color-mix(in srgb, var(--haw-a) 30%, white); }
.haw-mc-outcomes__row--queue { background: rgba(245, 184, 64, 0.06); }
.haw-mc-outcomes__time { font-size: 10.5px; color: rgba(26, 26, 26, 0.55); font-weight: 600; }
.haw-mc-outcomes__name { color: var(--haw-ink); font-weight: 600; }
.haw-mc-outcomes__tag {
    font-size: 10.5px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 999px;
}
.haw-mc-outcomes__row--booked .haw-mc-outcomes__tag { background: rgba(31, 140, 70, 0.15); color: #1f8c46; }
.haw-mc-outcomes__row--chat .haw-mc-outcomes__tag { background: color-mix(in srgb, var(--haw-b) 14%, white); color: var(--haw-b); }
.haw-mc-outcomes__row--queue .haw-mc-outcomes__tag { background: rgba(245, 184, 64, 0.15); color: #b8731c; }
.haw-mc-outcomes__stat {
    display: flex; align-items: center; gap: 10px;
    margin-top: 4px;
    padding: 8px 12px;
    background: color-mix(in srgb, var(--haw-a) 25%, white);
    border: 1px dashed color-mix(in srgb, var(--haw-b) 28%, transparent);
    border-radius: 10px;
}
.haw-mc-outcomes__stat strong {
    font-size: 22px;
    font-weight: 800;
    color: var(--haw-b);
    letter-spacing: -0.02em;
}
.haw-mc-outcomes__stat span {
    font-size: 11px;
    color: var(--haw-ink);
    font-weight: 600;
}

/* CRM thread */
.haw-mc-thread {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 12px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 4px;
}
.haw-mc-thread__head {
    font-size: 10.5px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
    margin-bottom: 4px;
}
.haw-mc-thread__line {
    display: flex; gap: 12px;
    font-size: 11.5px;
    padding: 3px 0;
    color: var(--haw-ink);
}
.haw-mc-thread__time {
    font-family: ui-monospace, SFMono-Regular, monospace;
    color: rgba(26, 26, 26, 0.5);
    font-weight: 600;
    flex-shrink: 0;
    width: 56px;
}
.haw-mc-thread__pill {
    align-self: flex-start;
    margin-top: 4px;
    background: rgba(31, 140, 70, 0.10);
    color: #1f8c46;
    border: 1px solid rgba(31, 140, 70, 0.25);
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 10.5px;
    font-weight: 700;
}

/* ── APPOINTMENT REMINDERS VISUALS ──────────────────────────── */
.haw-mock--ar {
    padding: 28px;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    display: flex;
    justify-content: center;
}
.haw-mock--ar > * { width: 86%; max-width: 380px; margin: 0 auto; }

/* Patient + risk score */
.haw-ar-patient {
    display: flex; align-items: center; gap: 10px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 10px 12px;
    box-shadow: 0 6px 16px -10px rgba(15, 23, 42, 0.10);
}
.haw-ar-patient__avatar {
    width: 32px; height: 32px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--haw-b) 0%, color-mix(in srgb, var(--haw-b) 60%, black) 100%);
    color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 12px; font-weight: 700;
    flex-shrink: 0;
}
.haw-ar-patient strong { display: block; font-size: 13px; color: var(--haw-ink); font-weight: 600; }
.haw-ar-patient small { font-size: 11.5px; color: rgba(26, 26, 26, 0.55); }
.haw-ar-risk {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 12px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 7px;
}
.haw-ar-risk__head {
    font-size: 11px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 4px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
}
.haw-ar-risk__bar {
    height: 8px;
    background: rgba(15, 23, 42, 0.06);
    border-radius: 999px;
    overflow: hidden;
}
.haw-ar-risk__fill {
    height: 100%;
    background: linear-gradient(90deg, #1f8c46 0%, #f0b840 50%, var(--haw-b) 100%);
    border-radius: 999px;
    animation: haw-bar-grow 1.4s ease-out;
}
.haw-ar-risk__label {
    display: flex; justify-content: space-between;
    font-size: 11px;
    color: rgba(26, 26, 26, 0.55);
    font-weight: 600;
}
.haw-ar-risk__label strong { color: var(--haw-b); font-weight: 700; }
.haw-ar-risk__factors { display: flex; flex-wrap: wrap; gap: 4px; }
.haw-ar-risk__factor {
    background: color-mix(in srgb, var(--haw-a) 50%, white);
    color: var(--haw-ink);
    border-radius: 999px;
    padding: 2px 8px;
    font-size: 10.5px;
    font-weight: 600;
}
.haw-ar-risk__pill {
    align-self: flex-start;
    margin-top: 4px;
    background: color-mix(in srgb, var(--haw-b) 10%, white);
    color: var(--haw-b);
    border: 1px solid color-mix(in srgb, var(--haw-b) 30%, transparent);
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 10.5px;
    font-weight: 700;
}

/* Time markers + SMS */
.haw-ar-time {
    align-self: flex-start;
    background: var(--haw-b);
    color: #fff;
    border-radius: 999px;
    padding: 4px 12px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    box-shadow: 0 4px 10px -2px color-mix(in srgb, var(--haw-b) 50%, transparent);
}
.haw-ar-sms {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 14px;
    padding: 12px 14px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 8px;
}
.haw-ar-sms__head {
    font-size: 11px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
}
.haw-ar-sms__body {
    font-size: 13px;
    color: var(--haw-ink);
    line-height: 1.5;
}
.haw-ar-sms__from {
    font-size: 10.5px;
    color: rgba(26, 26, 26, 0.5);
    font-style: italic;
}
.haw-ar-buttons { display: flex; gap: 6px; }
.haw-ar-button {
    flex: 1;
    text-align: center;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.10);
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12px;
    font-weight: 600;
    color: rgba(26, 26, 26, 0.7);
}
.haw-ar-button--on {
    background: var(--haw-b);
    color: #fff;
    border-color: var(--haw-b);
    box-shadow: 0 4px 10px -2px color-mix(in srgb, var(--haw-b) 50%, transparent);
}
.haw-ar-arrow {
    text-align: center;
    color: rgba(26, 26, 26, 0.35);
    font-size: 16px;
    line-height: 1;
}
.haw-ar-confirm {
    display: flex; align-items: center; gap: 10px;
    background: color-mix(in srgb, var(--haw-a) 35%, white);
    border: 1px solid color-mix(in srgb, var(--haw-b) 30%, transparent);
    border-radius: 12px;
    padding: 10px 12px;
}
.haw-ar-confirm__check {
    width: 22px; height: 22px;
    border-radius: 999px;
    background: var(--haw-b);
    color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 12px; font-weight: 700;
    flex-shrink: 0;
}
.haw-ar-confirm strong { display: block; font-size: 13px; color: var(--haw-ink); font-weight: 600; }
.haw-ar-confirm small { font-size: 11px; color: rgba(26, 26, 26, 0.55); }

/* Prep details */
.haw-ar-prep {
    background: color-mix(in srgb, var(--haw-a) 30%, white);
    border: 1px dashed color-mix(in srgb, var(--haw-b) 28%, transparent);
    border-radius: 10px;
    padding: 8px 10px;
    display: flex; flex-direction: column; gap: 4px;
}
.haw-ar-prep__row {
    font-size: 12px;
    color: var(--haw-ink);
    font-weight: 500;
}

/* No-show recovery */
.haw-ar-noshow {
    display: flex; align-items: center; gap: 10px;
    background: rgba(232, 73, 28, 0.08);
    border: 1px solid rgba(232, 73, 28, 0.25);
    border-radius: 12px;
    padding: 10px 12px;
}
.haw-ar-noshow__icon {
    width: 28px; height: 28px;
    border-radius: 999px;
    background: rgba(232, 73, 28, 0.15);
    color: #b8331c;
    display: inline-flex; align-items: center; justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
}
.haw-ar-noshow strong { display: block; font-size: 13px; color: var(--haw-ink); font-weight: 600; }
.haw-ar-noshow small { font-size: 11.5px; color: rgba(26, 26, 26, 0.55); }
.haw-ar-recovery {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 12px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 8px;
}
.haw-ar-recovery__head {
    font-size: 11px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
}
.haw-ar-recovery__body { font-size: 12.5px; color: var(--haw-ink); line-height: 1.4; }
.haw-ar-recovery__pill {
    align-self: flex-start;
    background: rgba(31, 140, 70, 0.10);
    color: #1f8c46;
    border: 1px solid rgba(31, 140, 70, 0.25);
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 10.5px;
    font-weight: 700;
}

/* Thread log */
.haw-ar-thread {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 12px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 4px;
}
.haw-ar-thread__head {
    font-size: 10.5px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
    margin-bottom: 4px;
}
.haw-ar-thread__line {
    display: flex; gap: 12px;
    font-size: 11.5px;
    padding: 3px 0;
    color: var(--haw-ink);
}
.haw-ar-thread__time {
    font-family: ui-monospace, SFMono-Regular, monospace;
    color: rgba(26, 26, 26, 0.5);
    font-weight: 600;
    flex-shrink: 0;
    width: 70px;
}
.haw-ar-thread__pill {
    align-self: flex-start;
    margin-top: 4px;
    background: rgba(31, 140, 70, 0.10);
    color: #1f8c46;
    border: 1px solid rgba(31, 140, 70, 0.25);
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 10.5px;
    font-weight: 700;
}

/* ── PATIENT CRM VISUALS ─────────────────────────────────────── */
.haw-mock--crm {
    padding: 28px;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    display: flex;
    justify-content: center;
}
.haw-mock--crm > * { width: 86%; max-width: 380px; margin: 0 auto; }

/* Ingest sources */
.haw-crm-sources {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 5px;
}
.haw-crm-source {
    display: flex; align-items: center; gap: 6px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 8px;
    padding: 5px 8px;
    font-size: 11px;
    color: var(--haw-ink);
    box-shadow: 0 4px 10px -8px rgba(15, 23, 42, 0.06);
}
.haw-crm-source span { font-weight: 500; }
.haw-crm-flow {
    display: flex; justify-content: center; gap: 12px;
    height: 22px; align-items: center;
}
.haw-crm-flow__line {
    width: 1.5px;
    height: 100%;
    background: linear-gradient(to bottom, transparent, var(--haw-b), transparent);
    background-size: 100% 200%;
    animation: haw-flow-down 1.4s linear infinite;
}
.haw-crm-flow__line:nth-child(2) { animation-delay: 0.2s; }
.haw-crm-flow__line:nth-child(3) { animation-delay: 0.4s; }
.haw-crm-record {
    display: flex; flex-direction: column; align-items: center;
    background: linear-gradient(180deg, #fff 0%, color-mix(in srgb, var(--haw-a) 30%, white) 100%);
    border: 1px solid color-mix(in srgb, var(--haw-b) 30%, transparent);
    border-radius: 14px;
    padding: 12px 16px;
    text-align: center;
    position: relative;
    box-shadow: 0 12px 32px -16px color-mix(in srgb, var(--haw-b) 30%, transparent);
}
.haw-crm-record__pulse {
    position: absolute;
    top: 10px; right: 12px;
    width: 8px; height: 8px;
    border-radius: 999px;
    background: var(--haw-b);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--haw-b) 25%, transparent);
    animation: haw-pulse 1.4s ease-in-out infinite;
}
.haw-crm-record strong { font-size: 13px; color: var(--haw-ink); font-weight: 600; }
.haw-crm-record small { font-size: 11px; color: rgba(26, 26, 26, 0.55); }

/* Tag */
.haw-crm-patient {
    display: flex; align-items: center; gap: 10px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 10px 12px;
    box-shadow: 0 6px 16px -10px rgba(15, 23, 42, 0.10);
}
.haw-crm-patient__avatar {
    width: 32px; height: 32px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--haw-b) 0%, color-mix(in srgb, var(--haw-b) 60%, black) 100%);
    color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 13px; font-weight: 700;
    flex-shrink: 0;
}
.haw-crm-patient strong { display: block; font-size: 13px; color: var(--haw-ink); font-weight: 600; }
.haw-crm-patient small { font-size: 11px; color: rgba(26, 26, 26, 0.55); }
.haw-crm-tags {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 10px 12px;
    display: flex; flex-direction: column; gap: 6px;
    box-shadow: 0 6px 16px -10px rgba(15, 23, 42, 0.10);
}
.haw-crm-tag-group {
    display: flex; align-items: center; gap: 6px;
    flex-wrap: wrap;
}
.haw-crm-tag-label {
    font-size: 9.5px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    width: 65px;
    flex-shrink: 0;
}
.haw-crm-tag {
    border-radius: 999px;
    padding: 3px 9px;
    font-size: 10.5px;
    font-weight: 700;
}
.haw-crm-tag--source {
    background: color-mix(in srgb, var(--haw-b) 12%, white);
    color: var(--haw-b);
    border: 1px solid color-mix(in srgb, var(--haw-b) 28%, transparent);
}
.haw-crm-tag--stage {
    background: rgba(31, 140, 70, 0.10);
    color: #1f8c46;
    border: 1px solid rgba(31, 140, 70, 0.28);
}
.haw-crm-tag--proc {
    background: rgba(58, 123, 213, 0.10);
    color: #1c4a8c;
    border: 1px solid rgba(58, 123, 213, 0.28);
}
.haw-crm-tag-pill {
    align-self: center;
    margin-top: 4px;
    background: color-mix(in srgb, var(--haw-b) 6%, white);
    color: var(--haw-b);
    border: 1px dashed color-mix(in srgb, var(--haw-b) 30%, transparent);
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 10.5px;
    font-weight: 600;
}

/* Score */
.haw-crm-score-card {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 12px 14px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 8px;
}
.haw-crm-score-card__head {
    font-size: 11px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
}
.haw-crm-score-row {
    display: grid;
    grid-template-columns: 88px 1fr 60px;
    gap: 8px;
    align-items: center;
}
.haw-crm-score-row__label {
    font-size: 11px;
    color: rgba(26, 26, 26, 0.6);
    font-weight: 500;
}
.haw-crm-score-row__bar {
    height: 6px;
    background: rgba(15, 23, 42, 0.08);
    border-radius: 999px;
    overflow: hidden;
}
.haw-crm-score-row__fill {
    height: 100%;
    background: linear-gradient(90deg, color-mix(in srgb, var(--haw-b) 70%, white), var(--haw-b));
    border-radius: 999px;
    animation: haw-bar-grow 1.4s ease-out;
}
.haw-crm-score-row__fill--good {
    background: linear-gradient(90deg, #6ee7a8, #1f8c46);
}
.haw-crm-score-row__num {
    font-size: 12px;
    font-weight: 700;
    color: var(--haw-b);
    text-align: right;
    font-family: ui-monospace, SFMono-Regular, monospace;
}
.haw-crm-score-row__num--good { color: #1f8c46; }
.haw-crm-score-card__pill {
    align-self: flex-start;
    margin-top: 4px;
    background: color-mix(in srgb, var(--haw-b) 8%, white);
    color: var(--haw-b);
    border: 1px solid color-mix(in srgb, var(--haw-b) 28%, transparent);
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 10.5px;
    font-weight: 700;
}

/* Segments */
.haw-crm-segments {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    padding: 12px 14px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 5px;
}
.haw-crm-segments__head {
    font-size: 11px;
    font-weight: 700;
    color: rgba(26, 26, 26, 0.55);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
    margin-bottom: 2px;
}
.haw-crm-segment {
    display: flex; align-items: center; gap: 10px;
    background: #fafafa;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12px;
    color: var(--haw-ink);
}
.haw-crm-segment--on {
    background: color-mix(in srgb, var(--haw-a) 35%, white);
    border-color: color-mix(in srgb, var(--haw-b) 30%, transparent);
    position: relative;
}
.haw-crm-segment__name { flex: 1; font-weight: 500; }
.haw-crm-segment__count {
    font-family: ui-monospace, SFMono-Regular, monospace;
    font-size: 12px;
    font-weight: 700;
    color: var(--haw-b);
    background: color-mix(in srgb, var(--haw-b) 10%, white);
    border-radius: 999px;
    padding: 2px 9px;
    border: 1px solid color-mix(in srgb, var(--haw-b) 28%, transparent);
}
.haw-crm-segment__pulse {
    width: 7px; height: 7px;
    border-radius: 999px;
    background: var(--haw-b);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--haw-b) 25%, transparent);
    animation: haw-pulse 1.4s ease-in-out infinite;
    margin-left: 4px;
}

/* Profile */
.haw-crm-profile {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 14px;
    padding: 12px 14px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 8px;
}
.haw-crm-profile__head {
    display: flex; align-items: center; gap: 10px;
    padding-bottom: 8px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
}
.haw-crm-profile__avatar {
    width: 36px; height: 36px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--haw-b) 0%, color-mix(in srgb, var(--haw-b) 60%, black) 100%);
    color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 14px; font-weight: 700;
    flex-shrink: 0;
}
.haw-crm-profile strong { display: block; font-size: 14px; color: var(--haw-ink); font-weight: 600; }
.haw-crm-profile small { font-size: 11.5px; color: rgba(26, 26, 26, 0.55); }
.haw-crm-profile__pill {
    margin-left: auto;
    background: color-mix(in srgb, var(--haw-b) 12%, white);
    color: var(--haw-b);
    border: 1px solid color-mix(in srgb, var(--haw-b) 28%, transparent);
    border-radius: 999px;
    padding: 3px 9px;
    font-size: 10.5px;
    font-weight: 700;
}
.haw-crm-profile__timeline { display: flex; flex-direction: column; gap: 3px; }
.haw-crm-profile__row {
    display: flex; gap: 12px;
    font-size: 11.5px;
    padding: 3px 0;
    color: var(--haw-ink);
    border-left: 2px solid color-mix(in srgb, var(--haw-b) 25%, transparent);
    padding-left: 10px;
    margin-left: 8px;
}
.haw-crm-profile__time {
    font-family: ui-monospace, SFMono-Regular, monospace;
    color: rgba(26, 26, 26, 0.5);
    font-weight: 600;
    flex-shrink: 0;
    width: 55px;
}

/* Stack / agent power */
.haw-crm-stack {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 14px;
    padding: 14px;
    box-shadow: 0 8px 22px -12px rgba(15, 23, 42, 0.10);
    display: flex; flex-direction: column; gap: 10px;
    align-items: center;
}
.haw-crm-stack__hub {
    display: flex; flex-direction: column; align-items: center;
    background: linear-gradient(135deg, color-mix(in srgb, var(--haw-a) 50%, white) 0%, color-mix(in srgb, var(--haw-a) 80%, white) 100%);
    border: 1.5px solid color-mix(in srgb, var(--haw-b) 35%, transparent);
    border-radius: 14px;
    padding: 12px 22px;
    text-align: center;
    position: relative;
    box-shadow: 0 8px 22px -12px color-mix(in srgb, var(--haw-b) 30%, transparent);
}
.haw-crm-stack__hub-pulse {
    position: absolute;
    top: 8px; right: 10px;
    width: 8px; height: 8px;
    border-radius: 999px;
    background: var(--haw-b);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--haw-b) 25%, transparent);
    animation: haw-pulse 1.4s ease-in-out infinite;
}
.haw-crm-stack__hub strong { display: block; font-size: 13px; color: var(--haw-ink); font-weight: 700; }
.haw-crm-stack__hub small { font-size: 11px; color: rgba(26, 26, 26, 0.6); }
.haw-crm-stack__agents {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    width: 100%;
}
.haw-crm-agent {
    display: flex; align-items: center; gap: 8px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 11.5px;
    color: var(--haw-ink);
    font-weight: 500;
    box-shadow: 0 4px 10px -8px rgba(15, 23, 42, 0.06);
}
.haw-crm-agent__icon { font-size: 14px; }
.haw-crm-stack__pill {
    background: color-mix(in srgb, var(--haw-b) 8%, white);
    color: var(--haw-b);
    border: 1px dashed color-mix(in srgb, var(--haw-b) 30%, transparent);
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 10.5px;
    font-weight: 700;
}

@media (max-width: 768px) {
    .haw-card__content { padding: 24px 24px 28px; }
    .haw-card__title { font-size: 1.375rem; }
    .haw-card__text { font-size: 14px; }
    .haw-cbt { width: 92%; padding: 12px 10px; }
    .haw-cbt__msg { font-size: 12.5px; padding: 8px 12px; }
    .haw-kb-card { width: 84%; }
    .haw-mock--sb > *,
    .haw-mock--di > *,
    .haw-mock--ac > *,
    .haw-mock--mc > *,
    .haw-mock--ar > *,
    .haw-mock--crm > *,
    .haw-mock--wf > *,
    .haw-mock--sc > *,
    .haw-mock--ae > *,
    .haw-mock--vr > *,
    .haw-mock--cb > *,
    .haw-mock--sb > *,
    .haw-mock--di2 > *,
    .haw-mock--ac2 > *,
    .haw-mock--ar2 > *,
    .haw-mock--crm2 > *,
    .haw-mock--ns2 > *,
    .haw-mock--wf2 > *,
    .haw-mock--sc2 > * { width: 92%; }
}

/* ─── AI Scribe additions ─── */
.haw-mock--sc2 { display: flex; align-items: center; justify-content: center; padding: 12px; }
.haw-mock--sc2 > * {
    width: 80%; max-width: 380px;
    background: #fff;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: 0 14px 28px -16px rgba(15, 23, 42, 0.18);
    padding: 14px;
    display: flex; flex-direction: column;
    flex: 1;
    justify-content: center;
}
.haw-sc-pill {
    margin-top: 8px;
    padding: 6px 10px;
    background: var(--haw-tint, #fff5e8);
    border: 1px dashed var(--haw-b, #f3a26a);
    border-radius: 999px;
    text-align: center;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--haw-b, #f3a26a);
}

/* Devices */
.haw-sc-devices { gap: 10px; }
.haw-sc-devices__head {
    font-size: 10.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(15, 23, 42, 0.6);
    padding-bottom: 4px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.1);
}
.haw-sc-devices__row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.haw-sc-devices__device {
    padding: 12px 6px;
    border-radius: 10px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
    display: flex; flex-direction: column; align-items: center; gap: 4px;
}
.haw-sc-devices__icon { font-size: 22px; line-height: 1; }
.haw-sc-devices__name { font-size: 10.5px; font-weight: 700; color: rgba(15, 23, 42, 0.78); }
.haw-sc-devices__output {
    display: flex; align-items: center; gap: 8px;
    padding: 9px 12px;
    border-radius: 8px;
    background: rgba(31, 140, 70, 0.08);
    border: 1px solid rgba(31, 140, 70, 0.25);
    font-size: 11px;
    color: #1f8c46;
    font-weight: 700;
}
.haw-sc-devices__output-icon {
    width: 22px; height: 22px;
    background: #1f8c46;
    color: #fff;
    border-radius: 999px;
    display: flex; align-items: center; justify-content: center;
    font-size: 12px;
    font-weight: 800;
}

/* Specialty chips */
.haw-sc-specialty { gap: 10px; }
.haw-sc-specialty__head {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--haw-b, #a78bfa);
}
.haw-sc-specialty__chips { display: flex; flex-wrap: wrap; gap: 4px; }
.haw-sc-specialty__chip {
    font-size: 10px;
    font-weight: 700;
    padding: 5px 10px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.04);
    border: 1px solid rgba(15, 23, 42, 0.06);
    color: rgba(15, 23, 42, 0.7);
}
.haw-sc-specialty__chip--on {
    background: var(--haw-tint, #f4efff);
    color: var(--haw-b, #a78bfa);
    border-color: var(--haw-b, #a78bfa);
}
.haw-sc-specialty__chip--more {
    background: linear-gradient(135deg, color-mix(in srgb, var(--haw-b, #a78bfa) 8%, white), color-mix(in srgb, var(--haw-b, #a78bfa) 16%, white));
    border: 1px dashed var(--haw-b, #a78bfa);
    color: var(--haw-b, #a78bfa);
    font-style: italic;
}

/* Sign workflow */
.haw-sc-sign { gap: 6px; }
.haw-sc-sign__row {
    display: grid;
    grid-template-columns: 28px 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
    font-size: 11.5px;
    color: rgba(15, 23, 42, 0.78);
    font-weight: 600;
}
.haw-sc-sign__row--active {
    background: var(--haw-tint, #ecf8ef);
    border-color: var(--haw-b, #3fb46a);
    color: var(--haw-b, #3fb46a);
    font-weight: 700;
}
.haw-sc-sign__step {
    width: 28px; height: 28px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.08);
    color: rgba(15, 23, 42, 0.6);
    display: flex; align-items: center; justify-content: center;
    font-weight: 800;
    font-size: 13px;
}
.haw-sc-sign__step--active { background: var(--haw-b, #3fb46a); color: #fff; }
.haw-sc-sign__check {
    width: 22px; height: 22px;
    background: rgba(31, 140, 70, 0.12);
    color: #1f8c46;
    border-radius: 999px;
    display: flex; align-items: center; justify-content: center;
    font-size: 12px;
    font-weight: 800;
}
.haw-sc-sign__btn {
    background: #0a0a0a;
    color: #fff;
    padding: 5px 10px;
    border-radius: 6px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.02em;
}

/* Time saved */
.haw-sc-time { gap: 8px; }
.haw-sc-time__row {
    display: grid;
    grid-template-columns: 110px 1fr 50px;
    align-items: center;
    gap: 10px;
}
.haw-sc-time__label { font-size: 10.5px; font-weight: 700; color: rgba(15, 23, 42, 0.78); }
.haw-sc-time__bar {
    height: 12px;
    background: rgba(15, 23, 42, 0.06);
    border-radius: 4px;
    overflow: hidden;
}
.haw-sc-time__fill { display: block; height: 100%; border-radius: 4px; }
.haw-sc-time__fill--manual { background: rgba(220, 38, 38, 0.55); }
.haw-sc-time__fill--agent { background: linear-gradient(90deg, color-mix(in srgb, #1f8c46 60%, white), #1f8c46); }
.haw-sc-time__val {
    font-size: 11px;
    font-weight: 800;
    text-align: right;
    color: rgba(15, 23, 42, 0.6);
    font-family: ui-monospace, SFMono-Regular, monospace;
}
.haw-sc-time__val--ok { color: #1f8c46; }
.haw-sc-time__hero {
    margin-top: 4px;
    padding: 10px 12px;
    background: linear-gradient(135deg, rgba(31, 140, 70, 0.06) 0%, rgba(110, 231, 168, 0.12) 100%);
    border: 1px solid rgba(31, 140, 70, 0.22);
    border-radius: 10px;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    column-gap: 10px;
}
.haw-sc-time__hero-label {
    font-size: 9.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(26, 26, 26, 0.55);
    grid-column: 1; grid-row: 1;
    align-self: end;
}
.haw-sc-time__hero-amt {
    font-size: 22px;
    font-weight: 800;
    color: #1f8c46;
    font-family: ui-monospace, SFMono-Regular, monospace;
    line-height: 1;
    grid-column: 2; grid-row: 1 / span 2;
    align-self: center;
    padding-left: 10px;
    border-left: 1px solid rgba(31, 140, 70, 0.22);
}
.haw-sc-time__hero-amt small { font-size: 11px; font-weight: 700; margin-left: 1px; }
.haw-sc-time__hero-extra {
    font-size: 10px;
    font-weight: 600;
    color: rgba(26, 26, 26, 0.65);
    grid-column: 1; grid-row: 2;
}
.haw-sc-time__hero-extra strong { color: #1f8c46; font-weight: 800; }

/* ─── AI Workflow Automation additions ─── */
.haw-mock--wf2 { display: flex; align-items: center; justify-content: center; padding: 12px; }
.haw-mock--wf2 > * {
    width: 80%; max-width: 380px;
    background: #fff;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: 0 14px 28px -16px rgba(15, 23, 42, 0.18);
    padding: 14px;
    display: flex; flex-direction: column;
    flex: 1;
    justify-content: center;
}

/* Dry-run sandbox */
.haw-wf-dryrun { gap: 6px; }
.haw-wf-dryrun__head {
    display: flex; align-items: center; gap: 6px;
    padding-bottom: 8px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.1);
    margin-bottom: 4px;
}
.haw-wf-dryrun__tab {
    padding: 5px 11px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: rgba(15, 23, 42, 0.55);
    background: rgba(15, 23, 42, 0.04);
    font-family: ui-monospace, SFMono-Regular, monospace;
    text-transform: uppercase;
}
.haw-wf-dryrun__tab--on {
    background: var(--haw-tint, #eaf2ff);
    color: var(--haw-b, #3a7bd5);
    border: 1px solid var(--haw-b, #3a7bd5);
}
.haw-wf-dryrun__range {
    margin-left: auto;
    font-size: 10px;
    font-weight: 700;
    color: rgba(15, 23, 42, 0.55);
    font-family: ui-monospace, SFMono-Regular, monospace;
}
.haw-wf-dryrun__row {
    display: grid;
    grid-template-columns: 28px auto 1fr;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
}
.haw-wf-dryrun__icon {
    width: 28px; height: 28px;
    border-radius: 8px;
    background: var(--haw-tint, #eaf2ff);
    color: var(--haw-b, #3a7bd5);
    border: 1px solid var(--haw-b, #3a7bd5);
    display: flex; align-items: center; justify-content: center;
    font-weight: 800;
    font-size: 14px;
}
.haw-wf-dryrun__row strong {
    font-size: 18px;
    font-weight: 800;
    color: rgba(15, 23, 42, 0.85);
    font-family: ui-monospace, SFMono-Regular, monospace;
    letter-spacing: -0.02em;
}
.haw-wf-dryrun__row span:last-child {
    font-size: 11px;
    color: rgba(15, 23, 42, 0.6);
    font-weight: 500;
}
.haw-wf-dryrun__hero {
    margin-top: 4px;
    padding: 10px 12px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(31, 140, 70, 0.06) 0%, rgba(110, 231, 168, 0.12) 100%);
    border: 1px solid rgba(31, 140, 70, 0.22);
    display: flex; align-items: center; gap: 12px;
}
.haw-wf-dryrun__hero-label {
    font-size: 9.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(26, 26, 26, 0.55);
}
.haw-wf-dryrun__hero-zero {
    font-size: 22px;
    font-weight: 800;
    color: #1f8c46;
    font-family: ui-monospace, SFMono-Regular, monospace;
    line-height: 1;
}
.haw-wf-dryrun__hero-cta {
    margin-left: auto;
    font-size: 10.5px;
    font-weight: 800;
    color: #1f8c46;
    font-family: ui-monospace, SFMono-Regular, monospace;
    letter-spacing: 0.02em;
}

/* ─── No-Show Recovery additions ─── */
.haw-mock--ns2 { display: flex; align-items: center; justify-content: center; padding: 12px; }
.haw-mock--ns2 > * {
    width: 80%; max-width: 380px;
    background: #fff;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: 0 14px 28px -16px rgba(15, 23, 42, 0.18);
    padding: 14px;
    display: flex; flex-direction: column;
    flex: 1;
    justify-content: center;
}
.haw-ns-pill {
    margin-top: 8px;
    padding: 6px 10px;
    background: var(--haw-tint, #feebf3);
    border: 1px dashed var(--haw-b, #e8347a);
    border-radius: 999px;
    text-align: center;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--haw-b, #e8347a);
}

/* Treatment cycles */
.haw-ns-treat { gap: 8px; }
.haw-ns-treat__head {
    font-size: 10.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(15, 23, 42, 0.6);
    padding-bottom: 4px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.1);
}
.haw-ns-treat__row {
    display: grid;
    grid-template-columns: 60px 60px 1fr 80px;
    align-items: center;
    gap: 8px;
    padding: 6px 4px;
}
.haw-ns-treat__name {
    font-size: 11.5px;
    font-weight: 800;
    color: rgba(15, 23, 42, 0.85);
}
.haw-ns-treat__cycle {
    font-size: 9.5px;
    font-weight: 700;
    color: rgba(15, 23, 42, 0.55);
    font-family: ui-monospace, SFMono-Regular, monospace;
}
.haw-ns-treat__bar {
    height: 6px;
    background: rgba(15, 23, 42, 0.06);
    border-radius: 999px;
    overflow: hidden;
}
.haw-ns-treat__bar > span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, color-mix(in srgb, var(--haw-b, #e8347a) 60%, white), var(--haw-b, #e8347a));
    border-radius: 999px;
}
.haw-ns-treat__tag {
    font-size: 9.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--haw-b, #e8347a);
    text-align: right;
    font-family: ui-monospace, SFMono-Regular, monospace;
}

/* ─── Patient CRM additions ─── */
.haw-mock--crm2 { display: flex; align-items: center; justify-content: center; padding: 12px; }
.haw-mock--crm2 > * {
    width: 80%; max-width: 380px;
    background: #fff;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: 0 14px 28px -16px rgba(15, 23, 42, 0.18);
    padding: 14px;
    display: flex; flex-direction: column;
    flex: 1;
    justify-content: center;
}
.haw-crm-pill {
    margin-top: 8px;
    padding: 6px 10px;
    background: var(--haw-tint, #eaf2ff);
    border: 1px dashed var(--haw-b, #3a7bd5);
    border-radius: 999px;
    text-align: center;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--haw-b, #3a7bd5);
}

/* Lifecycle */
.haw-crm-lifecycle { gap: 5px; }
.haw-crm-lifecycle__row {
    display: flex; align-items: center; justify-content: space-between;
    padding: 9px 12px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
}
.haw-crm-lifecycle__stage {
    font-size: 11px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.06);
    color: rgba(15, 23, 42, 0.7);
}
.haw-crm-lifecycle__stage--ok { background: var(--haw-tint, #eaf2ff); color: var(--haw-b, #3a7bd5); }
.haw-crm-lifecycle__stage--peak { background: rgba(31, 140, 70, 0.12); color: #1f8c46; }
.haw-crm-lifecycle__stage--repeat { background: rgba(245, 158, 11, 0.14); color: #b45309; }
.haw-crm-lifecycle__row strong {
    font-size: 16px;
    font-weight: 800;
    color: rgba(15, 23, 42, 0.8);
    font-family: ui-monospace, SFMono-Regular, monospace;
    letter-spacing: -0.02em;
}

/* Birthday */
.haw-crm-bday { gap: 10px; align-items: center; }
.haw-crm-bday__icon {
    font-size: 36px;
    line-height: 1;
    margin: 6px 0;
}
.haw-crm-bday__text {
    display: flex; flex-direction: column; gap: 3px;
    align-items: center;
    text-align: center;
}
.haw-crm-bday__title {
    font-size: 13px;
    font-weight: 800;
    color: var(--haw-b, #e8347a);
}
.haw-crm-bday__sub {
    font-size: 10.5px;
    color: rgba(15, 23, 42, 0.55);
    font-weight: 600;
    font-family: ui-monospace, SFMono-Regular, monospace;
}
.haw-crm-bday__msg {
    padding: 10px 12px;
    border-radius: 10px;
    background: var(--haw-tint, #feebf3);
    border: 1px solid var(--haw-b, #e8347a);
    display: flex; flex-direction: column; gap: 4px;
    align-self: stretch;
}
.haw-crm-bday__msg-tag {
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--haw-b, #e8347a);
}
.haw-crm-bday__msg-text {
    font-size: 11px;
    color: rgba(15, 23, 42, 0.78);
    font-weight: 500;
    font-style: italic;
    line-height: 1.4;
}

/* Campaign */
.haw-crm-campaign { gap: 8px; }
.haw-crm-campaign__head {
    font-size: 11.5px;
    font-weight: 800;
    color: var(--haw-b, #3fb46a);
    padding-bottom: 8px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.1);
}
.haw-crm-campaign__filters {
    display: flex; flex-wrap: wrap; gap: 4px;
}
.haw-crm-campaign__filter {
    font-size: 9.5px;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.04);
    border: 1px solid rgba(15, 23, 42, 0.06);
    color: rgba(15, 23, 42, 0.7);
    font-family: ui-monospace, SFMono-Regular, monospace;
}
.haw-crm-campaign__stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
}
.haw-crm-campaign__stat {
    padding: 8px 6px;
    border-radius: 8px;
    background: var(--haw-tint, #ecf8ef);
    border: 1px solid var(--haw-b, #3fb46a);
    display: flex; flex-direction: column; align-items: center; gap: 2px;
}
.haw-crm-campaign__stat span {
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(15, 23, 42, 0.55);
}
.haw-crm-campaign__stat strong {
    font-size: 16px;
    font-weight: 800;
    color: var(--haw-b, #3fb46a);
    font-family: ui-monospace, SFMono-Regular, monospace;
}

/* ─── Appointment Reminders additions ─── */
.haw-mock--ar2 { display: flex; align-items: center; justify-content: center; padding: 12px; }
.haw-mock--ar2 > * {
    width: 80%; max-width: 380px;
    background: #fff;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: 0 14px 28px -16px rgba(15, 23, 42, 0.18);
    padding: 14px;
    display: flex; flex-direction: column;
}
.haw-ar-pill {
    margin-top: 8px;
    padding: 6px 10px;
    background: var(--haw-tint, #fff7e0);
    border: 1px dashed var(--haw-b, #f0b840);
    border-radius: 999px;
    text-align: center;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--haw-b, #f0b840);
}

/* Smart send-time */
.haw-ar-sendtime {
    gap: 10px;
    flex: 1;
    justify-content: center;
}
.haw-ar-sendtime__head {
    display: flex; align-items: baseline; justify-content: space-between;
    padding-bottom: 8px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.1);
    font-size: 10.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(15, 23, 42, 0.6);
}
.haw-ar-sendtime__patient {
    color: var(--haw-b, #f0b840);
    font-family: ui-monospace, SFMono-Regular, monospace;
    font-size: 10px;
}
.haw-ar-sendtime__chart {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 8px;
    height: 100px;
    align-items: end;
    padding: 4px 6px;
}
.haw-ar-sendtime__col {
    display: flex; flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    height: 100%;
    gap: 6px;
}
.haw-ar-sendtime__bar {
    display: block;
    width: 100%;
    background: linear-gradient(180deg, color-mix(in srgb, var(--haw-b, #f0b840) 60%, white), var(--haw-b, #f0b840));
    border-radius: 4px 4px 0 0;
    min-height: 8px;
    opacity: 0.55;
}
.haw-ar-sendtime__col--peak .haw-ar-sendtime__bar {
    opacity: 1;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--haw-b, #f0b840) 30%, transparent);
}
.haw-ar-sendtime__hr {
    font-size: 9.5px;
    font-weight: 800;
    color: rgba(15, 23, 42, 0.6);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-family: ui-monospace, SFMono-Regular, monospace;
}
.haw-ar-sendtime__col--peak .haw-ar-sendtime__hr { color: var(--haw-b, #f0b840); }
.haw-ar-sendtime__peak {
    display: flex; align-items: center; gap: 8px;
    padding: 8px 12px;
    border-radius: 8px;
    background: var(--haw-tint, #fff7e0);
    border: 1px solid var(--haw-b, #f0b840);
    font-size: 11px;
    font-weight: 700;
    color: rgba(15, 23, 42, 0.78);
}
.haw-ar-sendtime__peak strong { color: var(--haw-b, #f0b840); font-weight: 800; font-family: ui-monospace, SFMono-Regular, monospace; }
.haw-ar-sendtime__peak-dot {
    width: 8px; height: 8px;
    border-radius: 999px;
    background: var(--haw-b, #f0b840);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--haw-b, #f0b840) 22%, transparent);
}

/* Reply intent parsing */
.haw-ar-intent { gap: 5px; }
.haw-ar-intent__row {
    display: grid;
    grid-template-columns: 1fr auto auto;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
    font-size: 10.5px;
}
.haw-ar-intent__msg {
    font-style: italic;
    color: rgba(15, 23, 42, 0.75);
    font-weight: 500;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.haw-ar-intent__arrow { color: rgba(15, 23, 42, 0.35); font-weight: 700; }
.haw-ar-intent__tag {
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 3px 7px;
    border-radius: 999px;
    white-space: nowrap;
}
.haw-ar-intent__tag--ok         { background: rgba(31, 140, 70, 0.12);  color: #1f8c46; }
.haw-ar-intent__tag--reschedule { background: rgba(245, 158, 11, 0.14); color: #b45309; }
.haw-ar-intent__tag--cancel     { background: rgba(220, 38, 38, 0.12);  color: #b91c1c; }
.haw-ar-intent__tag--faq        { background: var(--haw-tint, #f4efff); color: var(--haw-b, #a78bfa); }

/* ─── AI Aftercare additions ─── */
.haw-mock--ac2 { display: flex; align-items: center; justify-content: center; padding: 12px; }
.haw-mock--ac2 > * {
    width: 80%; max-width: 380px;
    background: #fff;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: 0 14px 28px -16px rgba(15, 23, 42, 0.18);
    padding: 14px;
    display: flex; flex-direction: column;
}

.haw-ac-pause { gap: 8px; }
.haw-ac-pause__msg {
    display: grid;
    grid-template-columns: 28px 1fr;
    align-items: start;
    gap: 10px;
    padding: 10px 12px;
    background: rgba(220, 38, 38, 0.06);
    border: 1px solid rgba(220, 38, 38, 0.25);
    border-radius: 10px;
}
.haw-ac-pause__msg-icon {
    width: 28px; height: 28px;
    border-radius: 999px;
    background: #b91c1c;
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 16px;
    font-weight: 800;
}
.haw-ac-pause__msg-body { display: flex; flex-direction: column; gap: 2px; }
.haw-ac-pause__msg-from {
    font-size: 9.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(15, 23, 42, 0.55);
}
.haw-ac-pause__msg-text {
    font-size: 11.5px;
    color: rgba(15, 23, 42, 0.85);
    font-weight: 600;
    font-style: italic;
}
.haw-ac-pause__row {
    display: flex; align-items: center; gap: 10px;
    padding: 8px 12px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
    font-size: 11px;
    color: rgba(15, 23, 42, 0.75);
    font-weight: 600;
}
.haw-ac-pause__row--stop { background: rgba(245, 158, 11, 0.08); border-color: rgba(245, 158, 11, 0.3); }
.haw-ac-pause__row--alert { background: rgba(31, 140, 70, 0.06); border-color: rgba(31, 140, 70, 0.22); color: #1f8c46; font-weight: 700; }
.haw-ac-pause__chip {
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 3px 8px;
    border-radius: 999px;
    background: #b45309;
    color: #fff;
    white-space: nowrap;
    font-family: ui-monospace, SFMono-Regular, monospace;
}
.haw-ac-pause__chip--alert { background: #1f8c46; }
.haw-ac-pause__pill {
    margin-top: auto;
    padding: 6px 10px;
    background: var(--haw-tint, #fff5e8);
    border: 1px dashed var(--haw-b, #f3a26a);
    border-radius: 999px;
    text-align: center;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--haw-b, #f3a26a);
}

/* ─── Digital Intake additions ─── */
.haw-mock--di2 { display: flex; align-items: center; justify-content: center; padding: 12px; }
.haw-mock--di2 > * {
    width: 80%; max-width: 380px;
    background: #fff;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: 0 14px 28px -16px rgba(15, 23, 42, 0.18);
    padding: 14px;
    display: flex; flex-direction: column;
}
.haw-di-pill {
    margin-top: 8px;
    padding: 6px 10px;
    background: var(--haw-tint, #feebf3);
    border: 1px dashed var(--haw-b, #e8347a);
    border-radius: 999px;
    text-align: center;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--haw-b, #e8347a);
}

/* Photo + body markers */
.haw-di-photo { gap: 10px; align-items: center; }
.haw-di-photo__head {
    font-size: 10.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(15, 23, 42, 0.55);
}
.haw-di-photo__body {
    height: 130px;
    width: auto;
}
.haw-di-photo__mark {
    fill: var(--haw-b, #e8347a);
    stroke: none;
    animation: aif-pulse 1.4s ease-in-out infinite;
}
.haw-di-photo__mark:nth-of-type(2) { animation-delay: 0.4s; }
.haw-di-photo__upload {
    display: flex; align-items: center; gap: 8px;
    padding: 8px 12px;
    border-radius: 8px;
    background: var(--haw-tint, #feebf3);
    border: 1px solid var(--haw-b, #e8347a);
    font-size: 11px;
    font-weight: 700;
    color: var(--haw-b, #e8347a);
    align-self: stretch;
    justify-content: center;
}
.haw-di-photo__icon { font-size: 14px; }

/* Conditional logic */
.haw-di-logic { gap: 6px; }
.haw-di-logic__node {
    padding: 8px 10px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
    font-size: 10.5px;
    font-weight: 700;
    color: rgba(15, 23, 42, 0.7);
    text-align: center;
}
.haw-di-logic__node--root {
    background: var(--haw-tint, #f4efff);
    border-color: var(--haw-b, #a78bfa);
    color: var(--haw-b, #a78bfa);
    font-size: 11.5px;
    font-weight: 800;
}
.haw-di-logic__node--root strong {
    color: var(--haw-b, #a78bfa);
    font-weight: 800;
}
.haw-di-logic__node--on {
    background: rgba(31, 140, 70, 0.08);
    border-color: rgba(31, 140, 70, 0.25);
    color: #1f8c46;
}
.haw-di-logic__node--off {
    opacity: 0.4;
    background: rgba(15, 23, 42, 0.04);
}
.haw-di-logic__line {
    height: 12px;
    background: linear-gradient(180deg, var(--haw-b, #a78bfa) 0%, transparent 100%);
    width: 2px;
    margin: 0 auto;
    opacity: 0.5;
}
.haw-di-logic__row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4px;
}

/* Triage */
.haw-di-triage { gap: 8px; }
.haw-di-triage__alert {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 12px;
    background: rgba(220, 38, 38, 0.08);
    border: 1px solid rgba(220, 38, 38, 0.3);
    border-radius: 10px;
}
.haw-di-triage__icon {
    width: 28px; height: 28px;
    background: #b91c1c;
    color: #fff;
    border-radius: 999px;
    display: flex; align-items: center; justify-content: center;
    font-size: 16px;
    font-weight: 800;
}
.haw-di-triage__alert-body {
    display: flex; flex-direction: column; gap: 1px;
    min-width: 0;
}
.haw-di-triage__alert-title {
    font-size: 11.5px;
    font-weight: 800;
    color: #b91c1c;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.haw-di-triage__alert-sub {
    font-size: 10.5px;
    color: rgba(15, 23, 42, 0.7);
    font-weight: 600;
    font-style: italic;
}
.haw-di-triage__step {
    display: flex; align-items: center; gap: 8px;
    padding: 8px 12px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
    font-size: 11px;
    color: rgba(15, 23, 42, 0.75);
    font-weight: 600;
}
.haw-di-triage__step--ok {
    background: rgba(31, 140, 70, 0.06);
    border-color: rgba(31, 140, 70, 0.22);
    color: #1f8c46;
    font-weight: 700;
}
.haw-di-triage__pulse {
    width: 9px; height: 9px;
    border-radius: 999px;
    background: var(--haw-b, #f3a26a);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--haw-b, #f3a26a) 22%, transparent);
    animation: aif-pulse 1.4s ease-in-out infinite;
}
.haw-di-triage__check {
    width: 18px; height: 18px;
    border-radius: 999px;
    background: #1f8c46;
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 11px;
    font-weight: 800;
}

/* Provider brief */
.haw-di-brief { gap: 4px; font-family: ui-monospace, SFMono-Regular, monospace; }
.haw-di-brief__head {
    display: flex; align-items: baseline; justify-content: space-between;
    padding-bottom: 8px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.1);
    margin-bottom: 4px;
    font-family: -apple-system, BlinkMacSystemFont, sans-serif;
}
.haw-di-brief__pname {
    font-size: 14px;
    font-weight: 800;
    color: rgba(15, 23, 42, 0.85);
}
.haw-di-brief__tag {
    font-size: 9.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--haw-b, #3a7bd5);
    padding: 3px 8px;
    border-radius: 999px;
    background: var(--haw-tint, #eaf2ff);
    border: 1px solid var(--haw-b, #3a7bd5);
}
.haw-di-brief__row {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 12px;
    padding: 6px 10px;
    border-radius: 6px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
    font-size: 10.5px;
}
.haw-di-brief__row span:first-child {
    color: rgba(15, 23, 42, 0.5);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 9.5px;
}
.haw-di-brief__row span:last-child {
    color: rgba(15, 23, 42, 0.85);
    font-weight: 700;
}
.haw-di-brief__flag {
    color: #b45309 !important;
    background: rgba(245, 158, 11, 0.12);
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 10px !important;
    align-self: start;
}

/* ─── Smart Booking additions ─── */
.haw-mock--sb { display: flex; align-items: center; justify-content: center; padding: 12px; }
.haw-mock--sb > * {
    width: 80%; max-width: 380px;
    background: #fff;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: 0 14px 28px -16px rgba(15, 23, 42, 0.18);
    padding: 14px;
    display: flex; flex-direction: column;
}
.haw-sb-pill {
    margin-top: 8px;
    padding: 6px 10px;
    background: var(--haw-tint, #ecf8ef);
    border: 1px dashed var(--haw-b, #3fb46a);
    border-radius: 999px;
    text-align: center;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--haw-b, #3fb46a);
}

/* Locations */
.haw-sb-locations { gap: 5px; }
.haw-sb-locations__head {
    font-size: 10.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(15, 23, 42, 0.6);
    padding-bottom: 8px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.1);
    margin-bottom: 4px;
}
.haw-sb-locations__row {
    display: grid;
    grid-template-columns: 18px 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 9px 10px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
}
.haw-sb-locations__row--active {
    background: var(--haw-tint, #ecf8ef);
    border-color: var(--haw-b, #3fb46a);
}
.haw-sb-locations__pin {
    width: 8px; height: 8px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.35);
    margin: 0 auto;
}
.haw-sb-locations__row--active .haw-sb-locations__pin {
    background: var(--haw-b, #3fb46a);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--haw-b, #3fb46a) 22%, transparent);
}
.haw-sb-locations__body {
    display: flex; flex-direction: column; gap: 1px;
    min-width: 0;
}
.haw-sb-locations__name {
    font-size: 11.5px;
    font-weight: 700;
    color: rgba(15, 23, 42, 0.85);
}
.haw-sb-locations__meta {
    font-size: 10px;
    color: rgba(15, 23, 42, 0.55);
    font-weight: 500;
    font-family: ui-monospace, SFMono-Regular, monospace;
}
.haw-sb-locations__chip {
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 3px 8px;
    border-radius: 999px;
    background: var(--haw-b, #3fb46a);
    color: #fff;
}

/* Urgent slots */
.haw-sb-urgent { gap: 10px; }
.haw-sb-urgent__head {
    display: flex; align-items: center; justify-content: space-between;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.1);
    font-size: 10.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(15, 23, 42, 0.7);
}
.haw-sb-urgent__pulse {
    width: 8px; height: 8px;
    border-radius: 999px;
    background: var(--haw-b, #e8347a);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--haw-b, #e8347a) 22%, transparent);
    animation: aif-pulse 1.4s ease-in-out infinite;
}
.haw-sb-urgent__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
}
.haw-sb-urgent__slot {
    padding: 10px 0;
    text-align: center;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 800;
    font-family: ui-monospace, SFMono-Regular, monospace;
    letter-spacing: 0.02em;
}
.haw-sb-urgent__slot--filled {
    background: rgba(15, 23, 42, 0.06);
    color: rgba(15, 23, 42, 0.5);
}
.haw-sb-urgent__slot--held {
    background: var(--haw-tint, #feebf3);
    color: var(--haw-b, #e8347a);
    border: 1px dashed var(--haw-b, #e8347a);
}
.haw-sb-urgent__legend {
    display: flex; gap: 14px; flex-wrap: wrap;
    font-size: 9.5px;
    font-weight: 700;
    color: rgba(15, 23, 42, 0.6);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.haw-sb-urgent__sw {
    display: inline-block;
    width: 9px; height: 9px;
    border-radius: 3px;
    margin-right: 4px;
    vertical-align: -1px;
}
.haw-sb-urgent__sw--held { background: var(--haw-b, #e8347a); }
.haw-sb-urgent__sw--filled { background: rgba(15, 23, 42, 0.4); }

/* Recover */
.haw-sb-recover { gap: 6px; }
.haw-sb-recover__row {
    display: grid;
    grid-template-columns: 24px 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
}
.haw-sb-recover__row--miss {
    background: rgba(220, 38, 38, 0.04);
    border-color: rgba(220, 38, 38, 0.18);
}
.haw-sb-recover__row--ok {
    background: rgba(31, 140, 70, 0.06);
    border-color: rgba(31, 140, 70, 0.22);
}
.haw-sb-recover__icon {
    width: 24px; height: 24px;
    border-radius: 999px;
    display: flex; align-items: center; justify-content: center;
    font-size: 13px;
    font-weight: 800;
    background: rgba(15, 23, 42, 0.06);
    color: rgba(15, 23, 42, 0.7);
}
.haw-sb-recover__row--miss .haw-sb-recover__icon { background: rgba(220, 38, 38, 0.12); color: #b91c1c; }
.haw-sb-recover__row--ok .haw-sb-recover__icon { background: rgba(31, 140, 70, 0.12); color: #1f8c46; }
.haw-sb-recover__body {
    display: flex; flex-direction: column; gap: 1px;
}
.haw-sb-recover__title {
    font-size: 11.5px;
    font-weight: 700;
    color: rgba(15, 23, 42, 0.85);
}
.haw-sb-recover__sub {
    font-size: 10px;
    color: rgba(15, 23, 42, 0.55);
    font-weight: 500;
}
.haw-sb-recover__time {
    font-size: 10px;
    font-weight: 800;
    color: rgba(15, 23, 42, 0.6);
    font-family: ui-monospace, SFMono-Regular, monospace;
    letter-spacing: 0.04em;
}

/* ─── AI Chatbot additions ─── */
.haw-mock--cb { display: flex; align-items: center; justify-content: center; padding: 12px; }
.haw-mock--cb > * {
    width: 80%; max-width: 380px;
    background: #fff;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: 0 14px 28px -16px rgba(15, 23, 42, 0.18);
    padding: 14px;
    display: flex; flex-direction: column;
}
.haw-cb-pill {
    margin-top: 8px;
    padding: 6px 10px;
    background: var(--haw-tint, #fff5e8);
    border: 1px dashed var(--haw-b, #f3a26a);
    border-radius: 999px;
    text-align: center;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--haw-b, #f3a26a);
}

/* Channels (multi-channel) */
.haw-cb-channels { gap: 8px; }
.haw-cb-channels__row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
}
.haw-cb-channels__chip {
    padding: 8px 10px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.06);
    font-size: 10.5px;
    font-weight: 700;
    color: rgba(15, 23, 42, 0.75);
    text-align: center;
    font-family: ui-monospace, SFMono-Regular, monospace;
}
.haw-cb-channels__center {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 12px;
    margin: 4px 0;
}
.haw-cb-channels__line {
    height: 2px;
    background: repeating-linear-gradient(90deg, var(--haw-b, #f3a26a) 0 6px, transparent 6px 11px);
    opacity: 0.6;
    border-radius: 999px;
}
.haw-cb-channels__hub {
    padding: 8px 16px;
    text-align: center;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--haw-b, #f3a26a) 0%, color-mix(in srgb, var(--haw-b, #f3a26a) 70%, #1f8c46) 100%);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    box-shadow: 0 6px 14px -6px var(--haw-b, #f3a26a);
}

/* 24/7 conversations log */
.haw-cb-247 { gap: 5px; font-family: ui-monospace, SFMono-Regular, monospace; }
.haw-cb-247__head {
    display: flex; align-items: center; gap: 8px;
    padding-bottom: 8px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.1);
    margin-bottom: 4px;
    font-size: 10.5px;
    font-weight: 800;
    color: rgba(15, 23, 42, 0.7);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-family: -apple-system, BlinkMacSystemFont, sans-serif;
}
.haw-cb-247__live {
    width: 9px; height: 9px;
    border-radius: 999px;
    background: var(--haw-b, #3fb46a);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--haw-b, #3fb46a) 22%, transparent);
    animation: aif-pulse 1.4s ease-in-out infinite;
}
.haw-cb-247__time {
    margin-left: auto;
    color: var(--haw-b, #3fb46a);
    font-family: ui-monospace, SFMono-Regular, monospace;
}
.haw-cb-247__row {
    display: grid;
    grid-template-columns: 70px 1fr;
    gap: 10px;
    padding: 7px 10px;
    border-radius: 7px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
    font-size: 10.5px;
}
.haw-cb-247__row span:first-child { color: rgba(15, 23, 42, 0.5); font-weight: 700; }
.haw-cb-247__row span:last-child { color: rgba(15, 23, 42, 0.85); font-weight: 600; font-family: -apple-system, BlinkMacSystemFont, sans-serif; }

/* Privacy / HIPAA */
.haw-cb-priv { gap: 6px; }
.haw-cb-priv__row {
    display: flex; align-items: center; gap: 10px;
    padding: 9px 12px;
    border-radius: 8px;
    background: var(--haw-tint, #eaf2ff);
    border: 1px solid var(--haw-b, #3a7bd5);
    font-size: 11px;
    color: rgba(15, 23, 42, 0.78);
    font-weight: 600;
}
.haw-cb-priv__icon {
    width: 22px; height: 22px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 999px;
    background: var(--haw-b, #3a7bd5);
    color: #fff;
    font-weight: 800;
    font-size: 13px;
}

/* ─── AI Voice Receptionist visuals ─── */
.haw-mock--vr { display: flex; align-items: center; justify-content: center; padding: 12px; }
.haw-mock--vr > * {
    width: 80%; max-width: 380px;
    background: #fff;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: 0 14px 28px -16px rgba(15, 23, 42, 0.18);
    padding: 14px;
    display: flex; flex-direction: column;
}
.haw-vr-pill {
    margin-top: 8px;
    padding: 6px 10px;
    background: var(--haw-tint, #ecf8ef);
    border: 1px dashed var(--haw-b, #3fb46a);
    border-radius: 999px;
    text-align: center;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--haw-b, #3fb46a);
}

/* Pickup */
.haw-vr-pickup { gap: 12px; align-items: center; }
.haw-vr-pickup__phone {
    position: relative;
    width: 70px; height: 70px;
    border-radius: 999px;
    background: var(--haw-tint, #ecf8ef);
    display: flex; align-items: center; justify-content: center;
    color: var(--haw-b, #3fb46a);
    font-size: 30px;
}
.haw-vr-pickup__ring {
    position: absolute; inset: 0;
    border-radius: 999px;
    border: 2px solid var(--haw-b, #3fb46a);
    opacity: 0;
    animation: haw-vr-ring 1.6s ease-out infinite;
}
@keyframes haw-vr-ring {
    0%   { transform: scale(1);   opacity: 0.6; }
    100% { transform: scale(1.5); opacity: 0; }
}
.haw-vr-pickup__check {
    position: absolute;
    bottom: -4px; right: -4px;
    width: 24px; height: 24px;
    background: var(--haw-b, #3fb46a);
    color: #fff;
    border-radius: 999px;
    display: flex; align-items: center; justify-content: center;
    font-size: 13px;
    font-weight: 800;
    border: 2px solid #fff;
}
.haw-vr-pickup__time {
    text-align: center;
    display: flex; flex-direction: column; gap: 1px;
}
.haw-vr-pickup__time strong {
    font-size: 28px;
    font-weight: 800;
    color: var(--haw-b, #3fb46a);
    font-family: ui-monospace, SFMono-Regular, monospace;
    line-height: 1;
}
.haw-vr-pickup__time strong small {
    font-size: 14px; font-weight: 700; margin-left: 1px;
}
.haw-vr-pickup__time span {
    font-size: 9.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: rgba(15, 23, 42, 0.55);
}
.haw-vr-pickup__row {
    display: flex; align-items: center; gap: 8px;
    padding: 8px 12px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
    font-size: 11px;
    color: rgba(15, 23, 42, 0.7);
    font-weight: 600;
    align-self: stretch;
    justify-content: center;
}
.haw-vr-pickup__dot {
    width: 8px; height: 8px;
    border-radius: 999px;
    background: var(--haw-b, #3fb46a);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--haw-b, #3fb46a) 22%, transparent);
    animation: aif-pulse 1.4s ease-in-out infinite;
}

/* Voice */
.haw-vr-voice { gap: 10px; }
.haw-vr-voice__head {
    display: flex; align-items: center; gap: 8px;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.1);
    font-size: 10.5px;
    font-weight: 800;
    color: rgba(15, 23, 42, 0.7);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.haw-vr-voice__live {
    width: 9px; height: 9px;
    border-radius: 999px;
    background: var(--haw-b, #e8347a);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--haw-b, #e8347a) 22%, transparent);
    animation: aif-pulse 1.4s ease-in-out infinite;
}
.haw-vr-voice__wave {
    display: flex; align-items: center; gap: 2px;
    height: 36px;
    padding: 0 4px;
}
.haw-vr-voice__wave > span {
    flex: 1;
    background: linear-gradient(180deg, color-mix(in srgb, var(--haw-b, #e8347a) 60%, white), var(--haw-b, #e8347a));
    border-radius: 2px;
    height: 22%;
    animation: haw-vr-voice-wave 1.4s ease-in-out infinite;
}
.haw-vr-voice__wave > span:nth-child(2n)  { animation-delay: 0.08s; }
.haw-vr-voice__wave > span:nth-child(3n)  { animation-delay: 0.16s; }
.haw-vr-voice__wave > span:nth-child(4n)  { animation-delay: 0.24s; }
.haw-vr-voice__wave > span:nth-child(5n)  { animation-delay: 0.32s; }
.haw-vr-voice__wave > span:nth-child(7n)  { animation-delay: 0.40s; }
@keyframes haw-vr-voice-wave {
    0%, 100% { height: 22%; }
    25%      { height: 75%; }
    50%      { height: 38%; }
    75%      { height: 90%; }
}
.haw-vr-voice__chips {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4px;
    padding: 4px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.04);
}
.haw-vr-voice__chip {
    text-align: center;
    padding: 6px 0;
    font-size: 10px;
    font-weight: 700;
    color: rgba(15, 23, 42, 0.55);
    border-radius: 999px;
    transition: all 0.2s ease;
}
.haw-vr-voice__chip--on {
    background: #fff;
    color: var(--haw-b, #e8347a);
    box-shadow: 0 2px 6px -2px rgba(15, 23, 42, 0.18);
}

/* ─── AI Aesthetics visuals ─── */
.haw-mock--ae { display: flex; align-items: center; justify-content: center; padding: 12px; }
.haw-mock--ae > * {
    width: 80%; max-width: 380px;
    background: #fff;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: 0 14px 28px -16px rgba(15, 23, 42, 0.18);
    padding: 14px;
    display: flex; flex-direction: column;
}
.haw-ae-pill {
    margin-top: 8px;
    padding: 6px 10px;
    background: var(--haw-tint, #feebf3);
    border: 1px dashed var(--haw-b, #e8347a);
    border-radius: 999px;
    text-align: center;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--haw-b, #e8347a);
}

.haw-ae-cap { gap: 10px; }
.haw-ae-cap__head {
    display: flex; align-items: center; gap: 8px;
    font-size: 10.5px;
    font-weight: 800;
    color: rgba(15, 23, 42, 0.7);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.1);
}
.haw-ae-cap__rec {
    width: 9px; height: 9px;
    border-radius: 999px;
    background: #dc2626;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.18);
    animation: aif-pulse 1.4s ease-in-out infinite;
}
.haw-ae-cap__frame {
    position: relative;
    height: 160px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    color: rgba(15, 23, 42, 0.5);
    overflow: hidden;
}
.haw-ae-cap__face-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 16px 12px 26px;
}
.haw-ae-cap__shutter {
    position: absolute;
    bottom: 14px; left: 50%;
    transform: translateX(-50%);
    width: 28px; height: 28px;
    border-radius: 999px;
    background: #fff;
    border: 3px solid var(--haw-b, #e8347a);
    box-shadow: 0 4px 12px -4px rgba(15, 23, 42, 0.25);
    z-index: 2;
}
.haw-ae-cap__corner {
    position: absolute;
    width: 18px; height: 18px;
    border: 2.5px solid var(--haw-b, #e8347a);
    z-index: 2;
}
.haw-ae-cap__corner--tl { top: 8px; left: 8px; border-right: none; border-bottom: none; border-radius: 4px 0 0 0; }
.haw-ae-cap__corner--tr { top: 8px; right: 8px; border-left: none; border-bottom: none; border-radius: 0 4px 0 0; }
.haw-ae-cap__corner--bl { bottom: 8px; left: 8px; border-right: none; border-top: none; border-radius: 0 0 0 4px; }
.haw-ae-cap__corner--br { bottom: 8px; right: 8px; border-left: none; border-top: none; border-radius: 0 0 4px 0; }

/* Clinical pre-read (analyze) */
.haw-ae-analyze { gap: 6px; }
.haw-ae-analyze__head {
    display: flex; align-items: baseline; justify-content: space-between;
    padding: 0 4px 8px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.1);
    margin-bottom: 4px;
}
.haw-ae-analyze__title {
    font-size: 10.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: rgba(15, 23, 42, 0.7);
}
.haw-ae-analyze__time {
    font-size: 10px;
    font-weight: 700;
    color: var(--haw-b, #a78bfa);
    font-family: ui-monospace, SFMono-Regular, monospace;
    letter-spacing: 0.04em;
}
.haw-ae-analyze__row {
    display: grid;
    grid-template-columns: 90px auto 1fr;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
}
.haw-ae-analyze__lbl {
    font-size: 11px;
    font-weight: 700;
    color: rgba(15, 23, 42, 0.78);
}
.haw-ae-analyze__val {
    font-size: 9.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-align: center;
    padding: 3px 10px;
    border-radius: 999px;
    font-family: ui-monospace, SFMono-Regular, monospace;
    white-space: nowrap;
    justify-self: start;
}
.haw-ae-analyze__val--mild { background: rgba(31, 140, 70, 0.12);  color: #1f8c46; }
.haw-ae-analyze__val--mod  { background: rgba(245, 158, 11, 0.14); color: #b45309; }
.haw-ae-analyze__val--good { background: rgba(31, 140, 70, 0.12);  color: #1f8c46; }
.haw-ae-analyze__sub {
    font-size: 10px;
    color: rgba(15, 23, 42, 0.55);
    font-family: ui-monospace, SFMono-Regular, monospace;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.haw-ae-map { gap: 10px; }
.haw-ae-map__face {
    position: relative;
    height: 170px;
    background: #fff;
    border-radius: 12px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    overflow: hidden;
}
.haw-ae-map__face-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 12px;
}
.haw-ae-map__dot {
    position: absolute;
    width: 8px; height: 8px;
    border-radius: 999px;
    background: var(--haw-b, #a78bfa);
    transform: translate(-50%, -50%);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--haw-b, #a78bfa) 22%, transparent);
    animation: haw-ae-pulse 1.8s ease-in-out infinite;
    z-index: 2;
}
.haw-ae-map__dot:nth-child(2)  { animation-delay: 0.10s; }
.haw-ae-map__dot:nth-child(3)  { animation-delay: 0.20s; }
.haw-ae-map__dot:nth-child(4)  { animation-delay: 0.30s; }
.haw-ae-map__dot:nth-child(5)  { animation-delay: 0.40s; }
.haw-ae-map__dot:nth-child(6)  { animation-delay: 0.50s; }
.haw-ae-map__dot:nth-child(7)  { animation-delay: 0.60s; }
.haw-ae-map__dot:nth-child(8)  { animation-delay: 0.70s; }
@keyframes haw-ae-pulse {
    0%, 100% { opacity: 0.7;  transform: translate(-50%, -50%) scale(1); }
    50%      { opacity: 1;    transform: translate(-50%, -50%) scale(1.3); }
}
.haw-ae-map__legend {
    display: flex; align-items: center; justify-content: space-between;
    padding: 6px 10px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
    font-size: 10.5px;
    font-weight: 700;
    color: rgba(15, 23, 42, 0.7);
}
.haw-ae-map__sw {
    display: inline-block;
    width: 7px; height: 7px;
    border-radius: 999px;
    background: var(--haw-b, #a78bfa);
    margin-right: 6px;
    vertical-align: 1px;
}
.haw-ae-map__t {
    font-family: ui-monospace, SFMono-Regular, monospace;
    color: var(--haw-b, #a78bfa);
    font-weight: 800;
    font-size: 10.5px;
    letter-spacing: 0.04em;
}

/* Combos (3 packages stacked) */
.haw-ae-combos { gap: 8px; padding-top: 14px; }
.haw-ae-combos__pkg {
    position: relative;
    padding: 12px 14px;
    border-radius: 10px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.06);
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: 12px;
    row-gap: 1px;
}
.haw-ae-combos__pkg--rec {
    background: linear-gradient(135deg, color-mix(in srgb, var(--haw-b, #3a7bd5) 6%, white) 0%, color-mix(in srgb, var(--haw-b, #3a7bd5) 14%, white) 100%);
    border-color: color-mix(in srgb, var(--haw-b, #3a7bd5) 35%, transparent);
    box-shadow: 0 6px 14px -8px color-mix(in srgb, var(--haw-b, #3a7bd5) 35%, transparent);
}
.haw-ae-combos__badge {
    position: absolute;
    top: -8px; left: 14px;
    background: var(--haw-b, #3a7bd5);
    color: #fff;
    font-size: 8.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 3px 8px;
    border-radius: 999px;
    white-space: nowrap;
    box-shadow: 0 4px 8px -3px color-mix(in srgb, var(--haw-b, #3a7bd5) 50%, transparent);
}
.haw-ae-combos__name {
    grid-column: 1; grid-row: 1;
    font-size: 11.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: rgba(15, 23, 42, 0.55);
}
.haw-ae-combos__pkg--rec .haw-ae-combos__name { color: var(--haw-b, #3a7bd5); }
.haw-ae-combos__amt {
    grid-column: 2; grid-row: 1 / span 2;
    align-self: center;
    font-size: 20px;
    font-weight: 800;
    color: rgba(15, 23, 42, 0.85);
    font-family: ui-monospace, SFMono-Regular, monospace;
    letter-spacing: -0.02em;
}
.haw-ae-combos__pkg--rec .haw-ae-combos__amt { color: var(--haw-b, #3a7bd5); }
.haw-ae-combos__sub {
    grid-column: 1; grid-row: 2;
    font-size: 10px;
    color: rgba(15, 23, 42, 0.6);
    font-weight: 600;
}

.haw-ae-plan { gap: 5px; }
.haw-ae-plan__row, .haw-ae-plan__total {
    display: flex; justify-content: space-between; align-items: center;
    padding: 7px 10px;
    border-radius: 7px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
    font-size: 11px;
    color: rgba(15, 23, 42, 0.78);
    font-family: ui-monospace, SFMono-Regular, monospace;
}
.haw-ae-plan__row strong, .haw-ae-plan__total strong {
    font-weight: 800;
    color: var(--haw-b, #3a7bd5);
}
.haw-ae-plan__total {
    background: color-mix(in srgb, var(--haw-b, #3a7bd5) 8%, white);
    border-color: var(--haw-b, #3a7bd5);
    margin-top: 4px;
}
.haw-ae-plan__total span { font-weight: 700; }
.haw-ae-plan__total strong { font-size: 13px; }

.haw-ae-sim { gap: 10px; }
.haw-ae-sim__split {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: 0;
    height: 130px;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.06);
}
.haw-ae-sim__pane {
    display: flex; align-items: center; justify-content: center;
    background: rgba(15, 23, 42, 0.04);
    color: rgba(15, 23, 42, 0.5);
    font-size: 24px;
    font-weight: 800;
    letter-spacing: 0.08em;
}
.haw-ae-sim__pane--after {
    background: linear-gradient(135deg, rgba(31, 140, 70, 0.1) 0%, rgba(110, 231, 168, 0.18) 100%);
    color: #1f8c46;
}

.haw-ae-pt { gap: 10px; align-items: center; }
.haw-ae-pt__device {
    width: 200px; padding: 8px;
    background: #0f172a;
    border-radius: 14px;
    box-shadow: 0 12px 24px -16px rgba(15, 23, 42, 0.4);
}
.haw-ae-pt__title {
    background: #fff;
    border-radius: 8px 8px 0 0;
    padding: 6px;
    font-size: 9px;
    font-weight: 800;
    color: rgba(15, 23, 42, 0.55);
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}
.haw-ae-pt__compare {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: 4px;
    background: #fafaf8;
    padding: 4px;
}
.haw-ae-pt__compare > span {
    background: rgba(15, 23, 42, 0.06);
    color: rgba(15, 23, 42, 0.4);
    border-radius: 6px;
    padding: 18px 0;
    text-align: center;
    font-size: 22px;
    font-weight: 800;
}
.haw-ae-pt__a {
    background: linear-gradient(135deg, rgba(31, 140, 70, 0.12), rgba(110, 231, 168, 0.22)) !important;
    color: #1f8c46 !important;
}
.haw-ae-pt__cta {
    background: #0a0a0a;
    color: #fff;
    border-radius: 0 0 8px 8px;
    padding: 8px;
    text-align: center;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.02em;
}

.haw-ae-log { gap: 5px; font-family: ui-monospace, SFMono-Regular, monospace; }
.haw-ae-log__row {
    display: grid;
    grid-template-columns: 100px 1fr;
    gap: 12px;
    padding: 6px 10px;
    border-radius: 6px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
    font-size: 10.5px;
}
.haw-ae-log__row span:first-child {
    color: rgba(15, 23, 42, 0.5);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 9.5px;
}
.haw-ae-log__row span:last-child { color: rgba(15, 23, 42, 0.85); font-weight: 700; }

/* ─── AI Scribe visuals ─── */
.haw-mock--sc { display: flex; align-items: center; justify-content: center; padding: 12px; }
.haw-mock--sc > * {
    width: 80%; max-width: 380px;
    background: #fff;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: 0 14px 28px -16px rgba(15, 23, 42, 0.18);
    padding: 14px;
    display: flex; flex-direction: column;
}
.haw-sc-pill {
    margin-top: 8px;
    padding: 6px 10px;
    background: var(--haw-tint, #ecf8ef);
    border: 1px dashed var(--haw-b, #3fb46a);
    border-radius: 999px;
    text-align: center;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--haw-b, #3fb46a);
}

/* Consent */
.haw-sc-consent { gap: 8px; }
.haw-sc-consent__head {
    font-size: 10.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(15, 23, 42, 0.55);
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.1);
}
.haw-sc-consent__row {
    display: flex; align-items: center; gap: 10px;
    padding: 10px;
    border-radius: 10px;
    background: var(--haw-tint, #ecf8ef);
    border: 1px solid var(--haw-b, #3fb46a);
}
.haw-sc-consent__check {
    width: 22px; height: 22px;
    display: flex; align-items: center; justify-content: center;
    background: var(--haw-b, #3fb46a);
    color: #fff;
    border-radius: 999px;
    font-weight: 800;
    font-size: 13px;
}
.haw-sc-consent__text {
    font-size: 12px;
    font-weight: 700;
    color: var(--haw-b, #3fb46a);
}
.haw-sc-consent__meta {
    display: flex; flex-direction: column; gap: 3px;
    padding: 8px 10px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
    font-size: 10px;
    color: rgba(15, 23, 42, 0.6);
    font-family: ui-monospace, SFMono-Regular, monospace;
}

/* Listen */
.haw-sc-listen { gap: 8px; }
.haw-sc-listen__top {
    display: flex; align-items: center; gap: 8px;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.1);
}
.haw-sc-listen__rec {
    width: 9px; height: 9px;
    border-radius: 999px;
    background: #dc2626;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.18);
    animation: aif-pulse 1.4s ease-in-out infinite;
}
.haw-sc-listen__title {
    font-size: 10.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(15, 23, 42, 0.7);
}
.haw-sc-listen__wave {
    display: flex; align-items: end; gap: 3px;
    height: 28px;
    padding: 4px 0;
}
.haw-sc-listen__wave span {
    flex: 1;
    background: linear-gradient(180deg, color-mix(in srgb, var(--haw-b, #e8347a) 70%, white), var(--haw-b, #e8347a));
    border-radius: 2px;
    height: 30%;
    animation: aif-sc-wave 1.4s ease-in-out infinite;
}
.haw-sc-listen__wave span:nth-child(2n)  { animation-delay: 0.1s; }
.haw-sc-listen__wave span:nth-child(3n)  { animation-delay: 0.2s; }
.haw-sc-listen__wave span:nth-child(4n)  { animation-delay: 0.3s; }
.haw-sc-listen__wave span:nth-child(5n)  { animation-delay: 0.4s; }
@keyframes aif-sc-wave {
    0%, 100% { height: 25%; }
    20%      { height: 75%; }
    40%      { height: 45%; }
    60%      { height: 90%; }
    80%      { height: 35%; }
}
.haw-sc-listen__live {
    padding: 8px 10px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.025);
    border-left: 2px solid var(--haw-b, #e8347a);
    font-size: 11.5px;
    color: rgba(15, 23, 42, 0.8);
    font-style: italic;
    line-height: 1.35;
}

/* Diarize */
.haw-sc-diarize { gap: 10px; }
.haw-sc-diarize__bar {
    display: flex;
    height: 14px;
    border-radius: 999px;
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.06);
}
.haw-sc-diarize__seg { height: 100%; }
.haw-sc-diarize__seg--dr { background: #1f8c46; }
.haw-sc-diarize__seg--pt { background: var(--haw-b, #f0b840); }
.haw-sc-diarize__seg--fm { background: #a78bfa; }
.haw-sc-diarize__legend {
    display: flex; gap: 10px; flex-wrap: wrap;
    font-size: 10px;
    font-weight: 700;
    color: rgba(15, 23, 42, 0.7);
}
.haw-sc-diarize__sw {
    display: inline-block;
    width: 9px; height: 9px;
    border-radius: 3px;
    margin-right: 4px;
    vertical-align: -1px;
}
.haw-sc-diarize__sw--dr { background: #1f8c46; }
.haw-sc-diarize__sw--pt { background: var(--haw-b, #f0b840); }
.haw-sc-diarize__sw--fm { background: #a78bfa; }

/* SOAP */
.haw-sc-soap { gap: 5px; }
.haw-sc-soap__row {
    display: grid;
    grid-template-columns: 22px 1fr;
    align-items: center;
    gap: 10px;
    padding: 7px 9px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
    font-size: 11px;
    color: rgba(15, 23, 42, 0.78);
}
.haw-sc-soap__l {
    width: 22px; height: 22px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 6px;
    background: color-mix(in srgb, var(--haw-b, #3a7bd5) 15%, white);
    border: 1px solid var(--haw-b, #3a7bd5);
    color: var(--haw-b, #3a7bd5);
    font-weight: 800;
    font-size: 12px;
}

/* Codes */
.haw-sc-codes { gap: 5px; }
.haw-sc-codes__row {
    display: grid;
    grid-template-columns: 50px 1fr 50px;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.05);
    font-family: ui-monospace, SFMono-Regular, monospace;
}
.haw-sc-codes__type {
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(15, 23, 42, 0.5);
    background: rgba(15, 23, 42, 0.06);
    padding: 3px 4px;
    border-radius: 4px;
    text-align: center;
}
.haw-sc-codes__code {
    font-size: 12px;
    font-weight: 800;
    color: rgba(15, 23, 42, 0.8);
}
.haw-sc-codes__conf {
    font-size: 10px;
    font-weight: 800;
    text-align: center;
    padding: 3px 5px;
    border-radius: 4px;
    background: color-mix(in srgb, var(--haw-b, #a78bfa) 12%, white);
    color: var(--haw-b, #a78bfa);
}

/* EHR */
.haw-sc-ehr { gap: 5px; padding: 0; overflow: hidden; }
.haw-sc-ehr > * { padding-left: 12px; padding-right: 12px; }
.haw-sc-ehr__head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 9px 12px;
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}
.haw-sc-ehr__app {
    font-size: 10px;
    font-weight: 800;
    color: #fff;
    background: var(--haw-b, #f3a26a);
    padding: 3px 7px;
    border-radius: 4px;
    letter-spacing: 0.06em;
}
.haw-sc-ehr__status {
    font-size: 9px;
    font-weight: 800;
    background: rgba(31, 140, 70, 0.12);
    color: #1f8c46;
    padding: 3px 8px;
    border-radius: 999px;
    letter-spacing: 0.08em;
}
.haw-sc-ehr__row {
    display: grid;
    grid-template-columns: 90px 1fr;
    gap: 12px;
    padding: 6px 12px;
    font-size: 10.5px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.05);
    font-family: ui-monospace, SFMono-Regular, monospace;
}
.haw-sc-ehr__row span:first-child {
    color: rgba(15, 23, 42, 0.5);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 9.5px;
}
.haw-sc-ehr__row span:last-child {
    color: rgba(15, 23, 42, 0.85);
    font-weight: 700;
}
.haw-sc-ehr .haw-sc-pill { margin: 8px 12px 0; }

/* ─── Workflow Automation visuals ─── */
.haw-mock--wf { display: flex; align-items: center; justify-content: center; padding: 12px; }
.haw-mock--wf > * {
    width: 80%; max-width: 380px;
    background: #fff;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: 0 14px 28px -16px rgba(15, 23, 42, 0.18);
    padding: 14px;
    display: flex; flex-direction: column;
}
.haw-wf-grid {
    display: flex; flex-direction: column;
    gap: 8px;
}
.haw-wf-grid__row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}
.haw-wf-grid__center {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 12px;
    margin: 2px 0;
}
.haw-wf-grid__line {
    height: 2px;
    background: repeating-linear-gradient(90deg,
        var(--haw-b, #3a7bd5) 0 6px,
        transparent 6px 11px);
    opacity: 0.5;
    border-radius: 999px;
}
.haw-wf-tile {
    padding: 8px 10px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.04);
    border: 1px solid rgba(15, 23, 42, 0.06);
    font-size: 11px;
    font-weight: 700;
    text-align: center;
    color: rgba(15, 23, 42, 0.7);
    font-family: ui-monospace, SFMono-Regular, monospace;
}
.haw-wf-hub {
    padding: 9px 18px;
    text-align: center;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--haw-b, #3a7bd5) 0%, color-mix(in srgb, var(--haw-b, #3a7bd5) 70%, #1f8c46) 100%);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    box-shadow: 0 6px 14px -6px var(--haw-b, #3a7bd5);
    white-space: nowrap;
}
.haw-wf-pill {
    margin-top: 4px;
    padding: 6px 10px;
    background: var(--haw-tint, #eaf2ff);
    border: 1px dashed var(--haw-b, #3a7bd5);
    border-radius: 999px;
    text-align: center;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--haw-b, #3a7bd5);
}

/* Templates */
.haw-wf-templates { gap: 6px; }
.haw-wf-tpl {
    display: flex; justify-content: space-between; align-items: center;
    padding: 9px 12px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.06);
}
.haw-wf-tpl--active {
    background: var(--haw-tint, #ecf8ef);
    border-color: var(--haw-b, #3fb46a);
}
.haw-wf-tpl__name { font-size: 11.5px; font-weight: 700; color: rgba(15, 23, 42, 0.8); }
.haw-wf-tpl__steps { font-size: 10px; font-weight: 600; color: rgba(15, 23, 42, 0.5); font-family: ui-monospace, SFMono-Regular, monospace; }
.haw-wf-tpl--active .haw-wf-tpl__steps { color: var(--haw-b, #3fb46a); }
.haw-wf-tpl--more {
    display: flex; justify-content: center;
    background: var(--haw-tint, #ecf8ef);
    border: 1px dashed var(--haw-b, #3fb46a);
    color: var(--haw-b, #3fb46a);
    font-size: 11px; font-weight: 700; font-style: italic;
    padding: 8px;
}

/* Triggers */
.haw-wf-trigger { gap: 8px; }
.haw-wf-trigger__row {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.06);
}
.haw-wf-trigger__event {
    padding: 4px 8px;
    background: var(--haw-tint, #f4efff);
    border-radius: 6px;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--haw-b, #a78bfa);
    font-family: ui-monospace, SFMono-Regular, monospace;
    text-align: center;
}
.haw-wf-trigger__arrow { color: rgba(15, 23, 42, 0.4); font-weight: 700; }
.haw-wf-trigger__action {
    padding: 4px 8px;
    background: rgba(31, 140, 70, 0.08);
    border: 1px solid rgba(31, 140, 70, 0.2);
    border-radius: 6px;
    font-size: 10.5px;
    font-weight: 700;
    color: #1f8c46;
    font-family: ui-monospace, SFMono-Regular, monospace;
    text-align: center;
}

/* Sync */
.haw-wf-sync { gap: 10px; }
.haw-wf-sync__panel {
    display: flex; align-items: center; justify-content: space-between;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.06);
}
.haw-wf-sync__label {
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: rgba(15, 23, 42, 0.55);
}
.haw-wf-sync__field {
    font-size: 11px;
    color: rgba(15, 23, 42, 0.75);
    font-family: ui-monospace, SFMono-Regular, monospace;
}
.haw-wf-sync__field em { color: #1f8c46; font-style: normal; font-weight: 700; }
.haw-wf-sync__wire {
    position: relative;
    height: 22px;
    margin: 0 30px;
    border-top: 2px dashed var(--haw-b, #f0b840);
}
.haw-wf-sync__dot {
    position: absolute; top: -5px; left: 0;
    width: 8px; height: 8px;
    border-radius: 999px;
    background: var(--haw-b, #f0b840);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--haw-b, #f0b840) 24%, transparent);
    animation: haw-wf-sync-flow 1.6s ease-in-out infinite;
}
@keyframes haw-wf-sync-flow {
    0%   { left: 0%;   opacity: 0; }
    10%  { opacity: 1; }
    90%  { opacity: 1; }
    100% { left: 100%; opacity: 0; }
}
.haw-wf-sync__time {
    position: absolute; top: -10px; left: 50%;
    transform: translateX(-50%);
    background: #fff;
    padding: 1px 7px;
    border-radius: 999px;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--haw-b, #f0b840);
    border: 1px solid var(--haw-b, #f0b840);
    font-family: ui-monospace, SFMono-Regular, monospace;
}

/* Retry */
.haw-wf-retry { gap: 6px; font-family: ui-monospace, SFMono-Regular, monospace; }
.haw-wf-retry__row {
    display: grid;
    grid-template-columns: 70px 1fr 80px;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border-radius: 7px;
    background: rgba(15, 23, 42, 0.025);
    border: 1px solid rgba(15, 23, 42, 0.06);
    font-size: 10.5px;
}
.haw-wf-retry__row--ok {
    background: rgba(31, 140, 70, 0.08);
    border-color: rgba(31, 140, 70, 0.2);
}
.haw-wf-retry__time { color: rgba(15, 23, 42, 0.5); font-weight: 600; }
.haw-wf-retry__msg { color: rgba(15, 23, 42, 0.8); font-weight: 600; }
.haw-wf-retry__tag {
    font-size: 9px; font-weight: 800; letter-spacing: 0.06em;
    text-transform: uppercase;
    text-align: center;
    padding: 3px 0;
    border-radius: 4px;
}
.haw-wf-retry__tag--warn { background: rgba(251, 191, 36, 0.18); color: #b45309; }
.haw-wf-retry__tag--ok   { background: rgba(31, 140, 70, 0.18); color: #1f8c46; }

/* Audit */
.haw-wf-audit { gap: 4px; font-family: ui-monospace, SFMono-Regular, monospace; }
.haw-wf-audit__head {
    font-size: 10.5px;
    font-weight: 700;
    color: rgba(15, 23, 42, 0.6);
    padding: 4px 8px 8px;
    border-bottom: 1px dashed rgba(15, 23, 42, 0.1);
    margin-bottom: 6px;
}
.haw-wf-audit__line {
    font-size: 11px;
    line-height: 1.5;
    padding: 1px 8px;
    border-radius: 4px;
}
.haw-wf-audit__line--minus { background: rgba(220, 38, 38, 0.06); color: #b91c1c; }
.haw-wf-audit__line--plus  { background: rgba(31, 140, 70, 0.06); color: #1f8c46; }
