:root {
    --lh-bg: #050008;
    --lh-bg-2: #07000d;
    --lh-card: #0b0013;
    --lh-card-2: #140020;
    --lh-deep: #5b21b6;
    --lh-royal: #7c3aed;
    --lh-neon: #ff3cff;
    --lh-lavender: #c77dff;
    --lh-soft: #e9d5ff;
    --lh-white: #ffffff;
    --lh-muted: #e9d5ff;
    --lh-border: rgba(255, 60, 255, 0.34);
    --lh-glow: 0 0 28px rgba(255, 60, 255, 0.52);
    --lh-shadow: 0 20px 70px rgba(0, 0, 0, 0.55);
    --lh-radius: 18px;
}

* {
    box-sizing: border-box;
}

html {
    color-scheme: dark;
    background: var(--lh-bg);
    overflow-x: hidden;
}

body {
    min-height: 100vh;
    overflow-x: hidden !important;
    background:
        radial-gradient(circle at 15% 5%, rgba(255, 60, 255, 0.14), transparent 24%),
        radial-gradient(circle at 88% 6%, rgba(124, 58, 237, 0.18), transparent 30%),
        radial-gradient(ellipse at 50% 110%, rgba(255, 60, 255, 0.16), transparent 44%),
        linear-gradient(180deg, var(--lh-bg), var(--lh-bg-2) 58%, #030005) !important;
    color: var(--lh-white) !important;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    line-height: 1.6;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-image:
        radial-gradient(circle, rgba(233, 213, 255, 0.85) 0 1px, transparent 1.5px),
        radial-gradient(ellipse at 70% 18%, rgba(124, 58, 237, 0.16), transparent 38%),
        linear-gradient(115deg, transparent 0 47%, rgba(192, 132, 252, 0.045) 47% 49%, transparent 49% 100%);
    background-size: 96px 96px, 640px 380px, 280px 280px;
    opacity: 0.32;
}

a {
    color: var(--lh-soft);
}

a:hover {
    color: var(--lh-neon);
}

.site-header {
    background:
        radial-gradient(circle at 15% 0, rgba(255, 60, 255, 0.15), transparent 34%),
        linear-gradient(180deg, rgba(0, 0, 0, 0.94), rgba(5, 0, 8, 0.84)) !important;
    border-bottom: 1px solid rgba(255, 60, 255, 0.22) !important;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.58), 0 0 34px rgba(124, 58, 237, 0.18) !important;
    position: sticky;
    isolation: isolate;
    padding-top: 0.45rem !important;
    padding-bottom: 0.45rem !important;
}

.site-header::after {
    content: "☾  ◐  ●  ◑  ☽";
    position: absolute;
    left: 50%;
    top: 0.55rem;
    transform: translateX(-50%);
    color: rgba(233, 213, 255, 0.78);
    font-size: 0.78rem;
    letter-spacing: 0.7rem;
    text-shadow: 0 0 14px rgba(255, 60, 255, 0.85);
    pointer-events: none;
    z-index: -1;
    opacity: 0.75;
}

.site-header::after {
    content: none !important;
    display: none !important;
}

.brand-title {
    color: var(--lh-white) !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase;
    text-shadow: 0 0 12px rgba(255, 255, 255, 0.34), 0 0 22px rgba(255, 60, 255, 0.72);
}

.brand,
.main-nav,
.mobile-menu-btn {
    position: relative;
    z-index: 1;
}

.brand-tagline {
    display: none !important;
}

.brand-mark,
.brand-logo {
    width: 46px !important;
    height: 46px !important;
    flex-basis: 46px !important;
}

.brand-tagline {
    color: var(--lh-muted) !important;
}

.brand-logo,
.footer-logo {
    filter: drop-shadow(0 0 8px rgba(255, 60, 255, 0.95)) drop-shadow(0 0 22px rgba(124, 58, 237, 0.62)) !important;
}

.brand-logo {
    border-radius: 12px;
    animation: logoFloatPulse 4.8s ease-in-out infinite;
    transform-origin: 50% 58%;
    will-change: transform, filter;
}

.brand:hover .brand-logo,
.brand:focus-within .brand-logo {
    animation-duration: 2.8s;
    filter: drop-shadow(0 0 12px rgba(255, 60, 255, 1)) drop-shadow(0 0 34px rgba(124, 58, 237, 0.8)) !important;
}

.main-nav a,
.logout-button {
    color: var(--lh-soft) !important;
    border-radius: 6px !important;
    border: 1px solid transparent !important;
    border-bottom: 1px solid rgba(255, 60, 255, 0) !important;
    text-transform: none;
    letter-spacing: 0.01em;
    text-shadow: 0 0 8px rgba(255, 255, 255, 0.22);
    min-height: 34px !important;
    padding-top: 0.34rem !important;
    padding-bottom: 0.34rem !important;
}

.main-nav {
    flex-wrap: nowrap !important;
    gap: 0.35rem !important;
}

.main-nav .nav-group {
    flex-wrap: nowrap !important;
    gap: 0.18rem !important;
}

.desktop-nav .nav-group:nth-of-type(2) a:not(.nav-emphasis) {
    display: none !important;
}

.main-nav a:hover,
.logout-button:hover,
.main-nav .nav-emphasis {
    color: var(--lh-white) !important;
    background: rgba(255, 60, 255, 0.06) !important;
    border-color: rgba(255, 60, 255, 0.38) !important;
    box-shadow: 0 0 16px rgba(255, 60, 255, 0.25), inset 0 0 18px rgba(255, 60, 255, 0.05);
}

.main-nav .nav-emphasis {
    border-radius: 8px !important;
    padding-inline: 1rem !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.12), transparent 48%),
        linear-gradient(135deg, rgba(91, 33, 182, 0.72), rgba(180, 24, 222, 0.72)) !important;
    border-color: rgba(255, 60, 255, 0.58) !important;
    box-shadow:
        0 0 12px rgba(255, 60, 255, 0.52),
        0 0 24px rgba(124, 58, 237, 0.34),
        inset 0 0 14px rgba(255, 255, 255, 0.1) !important;
    transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease, filter 160ms ease;
}

.main-nav .nav-emphasis:hover,
.main-nav .nav-emphasis:focus-visible {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.14), transparent 50%),
        linear-gradient(135deg, rgba(153, 0, 255, 0.92), rgba(197, 22, 244, 0.96), rgba(231, 53, 255, 0.92)) !important;
    border-color: rgba(255, 216, 255, 0.86) !important;
    color: var(--lh-white) !important;
    transform: translateY(-1px);
    filter: brightness(1.08);
    box-shadow:
        0 0 16px rgba(255, 60, 255, 0.9),
        0 0 34px rgba(124, 58, 237, 0.66),
        inset 0 0 16px rgba(255, 255, 255, 0.14) !important;
    text-shadow: 0 0 8px rgba(255, 255, 255, 0.64), 0 0 16px rgba(255, 60, 255, 0.9);
}

.mobile-menu-btn,
.mobile-nav-panel {
    background: rgba(3, 0, 6, 0.96) !important;
    color: var(--lh-white) !important;
    border-color: rgba(255, 60, 255, 0.44) !important;
    box-shadow: 0 0 18px rgba(255, 60, 255, 0.24) !important;
}

.mobile-nav-overlay {
    background: rgba(0, 0, 0, 0.68) !important;
}

.mobile-nav-panel {
    display: none !important;
}

.mobile-nav-open .mobile-nav-panel {
    display: flex !important;
}

.mobile-nav-heading {
    color: var(--lh-lavender) !important;
}

.mobile-nav-links a,
.mobile-nav-links button {
    background: rgba(217, 70, 239, 0.1) !important;
    border: 1px solid rgba(217, 70, 239, 0.28) !important;
    color: var(--lh-soft) !important;
}

.page-main {
    margin: 0 !important;
    padding: clamp(0.75rem, 2vw, 1.5rem) !important;
}

.content-card,
.content-card.page-shell,
.card-large,
.card-small,
.lh-card,
.choice-card,
.test-card,
.info-card,
.action-card,
.order-card,
.contact-card,
.customer-summary-card,
.dashboard-nextstep-card,
.orders-table-card,
.orders-empty,
.tests-hero-copy,
.tests-hero-panel,
.process-card,
.instructions-subsection,
.contact-dialog {
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)),
        radial-gradient(circle at top left, rgba(255, 60, 255, 0.11), transparent 36%),
        var(--lh-card) !important;
    border: 1px solid var(--lh-border) !important;
    border-radius: 10px !important;
    box-shadow: var(--lh-shadow), 0 0 22px rgba(255, 60, 255, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.075) !important;
    color: var(--lh-white) !important;
}

.content-card.page-shell {
    max-width: 1240px !important;
    margin: 0 auto !important;
    padding: clamp(0.8rem, 2vw, 1.45rem) !important;
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(180deg, rgba(5, 0, 8, 0.86), rgba(12, 0, 20, 0.94)),
        url("/static/dna_portal/witch_lab_page_header.png") center top / cover no-repeat !important;
}

.content-card.page-shell::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 14% 0%, rgba(217, 70, 239, 0.16), transparent 28%),
        radial-gradient(circle at 88% 0%, rgba(124, 58, 237, 0.12), transparent 36%),
        linear-gradient(180deg, rgba(5, 0, 8, 0.34), rgba(5, 0, 8, 0.82) 46%, rgba(5, 0, 8, 0.96));
    z-index: 0;
}

.content-card.page-shell > * {
    position: relative;
    z-index: 1;
}

.page-shell > .content-card {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.page-title,
h1,
h2,
h3,
.featured-title,
.choice-title,
.choice-head,
.card-title,
.samples-title,
.order-title {
    color: var(--lh-white) !important;
    letter-spacing: 0 !important;
}

.page-title,
h1 {
    font-size: clamp(2.1rem, 6vw, 4.8rem) !important;
    line-height: 0.98 !important;
    font-weight: 900 !important;
    text-wrap: balance;
}

.hero-title {
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: clamp(2.4rem, 5.25vw, 4.3rem) !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em !important;
    text-shadow: 0 0 12px rgba(255, 255, 255, 0.32), 0 0 26px rgba(255, 255, 255, 0.12);
}

.magic-word {
    color: var(--lh-neon);
    font-style: italic;
    font-weight: 800;
    text-shadow: 0 0 12px rgba(255, 60, 255, 0.95), 0 0 34px rgba(124, 58, 237, 0.9);
}

h2 {
    font-size: clamp(1.35rem, 3vw, 2.1rem);
    line-height: 1.1;
}

p,
li,
td,
th,
.card-subtitle,
.hero-text,
.choice-text,
.featured-text,
.featured-subtext,
.tests-lead,
.tests-sublead,
.test-card p,
.info-card p,
.process-card p,
.instructions-section p,
.contact-card p,
.order-subtitle,
.order-meta,
.order-summary-text,
.order-note,
.order-small-print,
.samples-subtitle,
.orders-footnote,
.contact-extra p {
    color: var(--lh-muted) !important;
}

strong,
th,
label,
.test-price,
.price-amount,
.pill-value,
.orders-order-value {
    color: var(--lh-soft) !important;
}

.btn,
.btn-primary,
button[type="submit"],
.contact-popup-trigger {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 0.7rem;
    min-height: 48px;
    padding: 0.72rem 1.65rem !important;
    border-radius: 8px !important;
    border: 1px solid rgba(255, 216, 255, 0.72) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.18), transparent 44%),
        linear-gradient(135deg, #9900ff 0%, #c516f4 48%, #e735ff 100%) !important;
    color: var(--lh-white) !important;
    font-weight: 850 !important;
    text-decoration: none !important;
    position: relative;
    text-shadow: 0 0 8px rgba(255, 255, 255, 0.42);
    box-shadow: 0 0 14px rgba(255, 60, 255, 0.72), 0 0 34px rgba(124, 58, 237, 0.5), inset 0 0 18px rgba(255, 255, 255, 0.12) !important;
    transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
}

.btn::before,
.btn-primary::before,
button[type="submit"]::before,
.contact-popup-trigger::before {
    content: "✦";
    order: 2;
    color: #ffffff;
    font-size: 1rem;
    line-height: 1;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.88), 0 0 18px rgba(255, 60, 255, 0.9);
}

.btn:hover,
.btn-primary:hover,
button[type="submit"]:hover {
    transform: translateY(-2px);
    filter: brightness(1.08);
    box-shadow: 0 0 22px rgba(255, 60, 255, 0.92), 0 0 48px rgba(124, 58, 237, 0.62), inset 0 0 18px rgba(255, 255, 255, 0.18) !important;
}

.btn-secondary,
.view-pill,
.test-pill,
.instruction-pill,
.instruction-btn,
.create-pill,
.btn-small,
.btn-xs,
.order-checklist-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 0.7rem;
    min-height: 48px;
    padding: 0.7rem 1.55rem !important;
    border-radius: 8px !important;
    border: 1px solid rgba(233, 213, 255, 0.74) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.055), transparent 55%),
        rgba(2, 0, 5, 0.66) !important;
    color: var(--lh-soft) !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    position: relative;
    box-shadow: 0 0 12px rgba(255, 60, 255, 0.2), inset 0 0 14px rgba(255, 60, 255, 0.045) !important;
}

.btn-secondary::before,
.view-pill::before,
.test-pill::before,
.instruction-pill::before,
.instruction-btn::before,
.create-pill::before,
.btn-small::before,
.btn-xs::before,
.order-checklist-btn::before {
    content: "✦";
    order: 2;
    color: var(--lh-soft);
    font-size: 0.95rem;
    line-height: 1;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.62), 0 0 18px rgba(255, 60, 255, 0.78);
}

.btn-secondary:hover,
.view-pill:hover,
.test-pill:hover,
.instruction-btn:hover,
.btn-xs:hover,
.order-checklist-btn:hover {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.12), transparent 48%),
        rgba(217, 70, 239, 0.18) !important;
    color: var(--lh-white) !important;
    transform: translateY(-2px);
    box-shadow: 0 0 20px rgba(255, 60, 255, 0.44), 0 0 34px rgba(124, 58, 237, 0.3), inset 0 0 16px rgba(255, 60, 255, 0.1) !important;
}

input,
select,
textarea,
.contact-input {
    background: rgba(5, 0, 8, 0.72) !important;
    border: 1px solid rgba(192, 132, 252, 0.5) !important;
    color: var(--lh-white) !important;
    border-radius: 12px !important;
    padding: 0.7rem 0.85rem !important;
}

input:focus,
select:focus,
textarea:focus,
.contact-input:focus {
    outline: none !important;
    border-color: var(--lh-neon) !important;
    box-shadow: 0 0 0 3px rgba(217, 70, 239, 0.22), 0 0 18px rgba(217, 70, 239, 0.32) !important;
}

::placeholder {
    color: rgba(233, 213, 255, 0.58) !important;
}

table {
    background: rgba(5, 0, 8, 0.38) !important;
    border-radius: 14px;
    overflow: hidden;
}

thead,
.tests-table thead,
.orders-table thead {
    background: rgba(217, 70, 239, 0.12) !important;
}

th,
td,
.tests-table th,
.tests-table td,
.orders-table th,
.orders-table td,
.samples-table th,
.samples-table td {
    border-color: rgba(217, 70, 239, 0.18) !important;
}

.status-pill {
    border-radius: 999px !important;
    border: 1px solid rgba(255, 255, 255, 0.24) !important;
    padding: 0.3rem 0.7rem !important;
    font-weight: 850 !important;
    box-shadow: 0 0 14px rgba(255, 255, 255, 0.12) !important;
}

.status-pending_acceptance {
    background: #5b21b6 !important;
    border-color: #c084fc !important;
    color: #fff !important;
    box-shadow: 0 0 18px rgba(192, 132, 252, 0.28) !important;
}
.status-accepted_provide_details,
.status-accepted {
    background: #b45309 !important;
    border-color: #f59e0b !important;
    color: #fff7ed !important;
    box-shadow: 0 0 18px rgba(245, 158, 11, 0.28) !important;
}
.status-awaiting_mail,
.status-awaiting {
    background: #c2410c !important;
    border-color: #fb923c !important;
    color: #ffedd5 !important;
    box-shadow: 0 0 18px rgba(251, 146, 60, 0.28) !important;
}
.status-samples_received,
.status-received {
    background: #1d4ed8 !important;
    border-color: #60a5fa !important;
    color: #eff6ff !important;
    box-shadow: 0 0 18px rgba(96, 165, 250, 0.28) !important;
}
.status-in_progress,
.status-progress,
.status-rerun_in_progress {
    background: #0f766e !important;
    border-color: #2dd4bf !important;
    color: #ecfeff !important;
    box-shadow: 0 0 18px rgba(45, 212, 191, 0.28) !important;
}
.status-completed {
    background: #047857 !important;
    border-color: #34d399 !important;
    color: #ecfdf5 !important;
    box-shadow: 0 0 18px rgba(52, 211, 153, 0.28) !important;
}
.status-needs_attention {
    background: #be123c !important;
    border-color: #fb7185 !important;
    color: #fff1f2 !important;
    box-shadow: 0 0 18px rgba(251, 113, 133, 0.28) !important;
}
.status-cancelled {
    background: #7f1d1d !important;
    border-color: #f87171 !important;
    color: #fff1f2 !important;
    box-shadow: 0 0 18px rgba(248, 113, 113, 0.28) !important;
}

.lh-kicker,
.tests-kicker,
.section-kicker,
.contact-eyebrow,
.featured-badge,
.summary-label,
.orders-order-label,
.guide-quick-label {
    color: var(--lh-lavender) !important;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-weight: 900;
}

.lh-icon,
.home-icon,
.dashboard-icon,
.orders-header-icon,
.contact-icon-pill,
.customer-summary-emoji,
.order-cta-icon,
.action-emoji,
.choice-icon,
.orders-empty-icon {
    background: radial-gradient(circle at 35% 25%, #ffffff, var(--lh-neon) 32%, var(--lh-deep) 78%) !important;
    color: var(--lh-white) !important;
    box-shadow: 0 0 24px rgba(217, 70, 239, 0.62) !important;
}

.site-footer {
    background:
        radial-gradient(circle at 50% 0, rgba(217, 70, 239, 0.16), transparent 42%),
        #030005 !important;
    border-top: 1px solid rgba(217, 70, 239, 0.28) !important;
    color: var(--lh-muted) !important;
}

.footer-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.8rem;
    margin-bottom: 1rem;
}

.footer-logo {
    width: 58px;
    height: 58px;
    object-fit: contain;
    border-radius: 14px;
    animation: logoFloatPulse 5.6s ease-in-out infinite;
}

.footer-brand strong,
.footer-brand span {
    display: block;
    text-align: left;
}

.footer-brand strong {
    color: var(--lh-white);
    font-size: 1.1rem;
}

.footer-brand span {
    color: var(--lh-lavender);
    font-size: 0.78rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.footer-links {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.65rem 1rem;
    margin-bottom: 1rem;
}

.footer-links a {
    color: var(--lh-soft);
    font-weight: 750;
    text-decoration: none;
}

.social-btn {
    background: rgba(18, 0, 31, 0.9) !important;
    border: 1px solid rgba(217, 70, 239, 0.34);
    box-shadow: 0 0 18px rgba(217, 70, 239, 0.22) !important;
}

.footer-text {
    color: var(--lh-muted) !important;
}

.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.full-image-hero {
    position: relative;
    max-width: 1440px;
    margin: 0 auto clamp(1.7rem, 4vw, 2.8rem);
    border: 1px solid rgba(255, 60, 255, 0.24);
    border-radius: 12px;
    overflow: visible;
    background: #000;
    box-shadow: 0 0 30px rgba(255, 60, 255, 0.22), 0 22px 70px rgba(0, 0, 0, 0.56);
}

.full-header-image {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 12px;
}

.hero-hotspot {
    position: absolute;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.7rem;
    min-height: clamp(42px, 3.4vw, 52px);
    min-width: clamp(132px, 11.5vw, 172px);
    padding: clamp(0.62rem, 0.85vw, 0.78rem) clamp(1.1rem, 1.7vw, 1.65rem);
    color: var(--lh-white) !important;
    font-size: clamp(0.95rem, 1.18vw, 1.12rem);
    font-weight: 900;
    line-height: 1;
    text-shadow: 0 0 8px rgba(255, 255, 255, 0.42);
    text-decoration: none !important;
    border-radius: 10px;
    transform: none;
    transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
}

.hero-hotspot::after {
    content: "✦";
    font-size: 0.95em;
    line-height: 1;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.88), 0 0 18px rgba(255, 60, 255, 0.9);
}

.hero-hotspot:hover {
    transform: translateY(-2px);
    filter: brightness(1.08);
}

.hero-hotspot:focus-visible {
    outline: 3px solid rgba(255, 255, 255, 0.95);
    outline-offset: 4px;
    box-shadow: 0 0 28px rgba(255, 60, 255, 0.9);
}

.hero-hotspot-order {
    left: 34.5%;
    top: 85.2%;
    bottom: auto;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.18), transparent 44%),
        linear-gradient(135deg, #9900ff 0%, #c516f4 48%, #e735ff 100%);
    border: 1px solid rgba(255, 216, 255, 0.72);
    box-shadow: 0 0 14px rgba(255, 60, 255, 0.72), 0 0 34px rgba(124, 58, 237, 0.5), inset 0 0 18px rgba(255, 255, 255, 0.12);
}

.hero-hotspot-how {
    left: 50%;
    top: 85.2%;
    bottom: auto;
    color: var(--lh-soft) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.055), transparent 55%),
        rgba(2, 0, 5, 0.66);
    border: 1px solid rgba(233, 213, 255, 0.74);
    box-shadow: 0 0 12px rgba(255, 60, 255, 0.2), inset 0 0 14px rgba(255, 60, 255, 0.045);
}

@media (max-width: 720px) {
    .hero-hotspot {
        border-radius: 8px;
        min-height: 38px;
        min-width: min(42vw, 165px);
        padding: 0.58rem 0.8rem;
        font-size: clamp(0.74rem, 3.1vw, 0.9rem);
    }

    .hero-hotspot-order {
        left: 9%;
        top: 74%;
        bottom: auto;
    }

    .hero-hotspot-how {
        left: auto;
        right: 9%;
        top: 74%;
        bottom: auto;
    }

    .home-moon-cta {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
    }

    .home-moon-button {
        width: 100%;
        max-width: 320px;
    }
}

.home-wrapper > .lh-hero {
    display: none !important;
}

.lh-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.82fr);
    gap: clamp(1.25rem, 4vw, 3rem);
    align-items: center;
    min-height: min(700px, calc(100vh - 118px));
    overflow: hidden;
    background:
        radial-gradient(circle at 84% 18%, rgba(233, 213, 255, 0.18), transparent 8%),
        radial-gradient(ellipse at 72% 52%, rgba(255, 60, 255, 0.18), transparent 32%),
        radial-gradient(ellipse at 16% 78%, rgba(91, 33, 182, 0.18), transparent 34%),
        linear-gradient(115deg, rgba(0, 0, 0, 0.9), rgba(18, 0, 31, 0.84) 58%, rgba(0, 0, 0, 0.9));
    border: 1px solid rgba(255, 60, 255, 0.28);
    border-radius: 12px;
    padding: clamp(1.1rem, 3vw, 2.25rem);
    box-shadow: inset 0 0 80px rgba(255, 60, 255, 0.09), 0 0 42px rgba(124, 58, 237, 0.18);
}

.lh-hero-photo {
    background:
        linear-gradient(90deg, rgba(0, 0, 0, 0.98) 0%, rgba(5, 0, 8, 0.9) 34%, rgba(5, 0, 8, 0.46) 52%, rgba(0, 0, 0, 0.14) 100%),
        radial-gradient(circle at 22% 58%, rgba(0, 0, 0, 0.72), transparent 30%),
        var(--hero-image) 62% center / cover no-repeat !important;
    min-height: min(720px, calc(100vh - 102px));
}

.lh-hero-photo .lh-hero-copy {
    max-width: 620px;
}

.lh-hero-photo .lh-hero-visual {
    min-height: 520px;
}

.lh-hero::before,
.lh-hero::after {
    content: "";
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
    filter: blur(2px);
}

.lh-hero::before {
    width: 360px;
    height: 360px;
    right: 6%;
    top: 14%;
    background: radial-gradient(circle, rgba(255, 60, 255, 0.31), transparent 62%);
}

.lh-hero-photo::before {
    display: none;
}

.lh-hero::after {
    inset: auto -20% -28% -20%;
    height: 240px;
    background: radial-gradient(ellipse, rgba(255, 60, 255, 0.26), transparent 70%);
}

.lh-hero-photo::after {
    inset: 0;
    height: auto;
    border-radius: inherit;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.1), transparent 42%, rgba(0, 0, 0, 0.24)),
        radial-gradient(circle at 70% 52%, rgba(255, 60, 255, 0.08), transparent 32%);
    z-index: 0;
}

.lh-hero-copy,
.lh-hero-visual,
.lh-section {
    position: relative;
    z-index: 1;
}

.lh-hero-copy p {
    max-width: 680px;
    font-size: clamp(1rem, 2vw, 1.18rem);
}

.lh-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    margin-top: 1.05rem;
}

.home-moon-cta {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: clamp(0.8rem, 2.5vw, 1.5rem);
    margin: clamp(1.6rem, 3vw, 2.4rem) 0;
    padding: clamp(0.85rem, 2vw, 1.2rem) clamp(1rem, 3vw, 2rem);
    overflow: hidden;
    border: 1px solid rgba(217, 70, 239, 0.42);
    border-radius: 10px;
    background:
        radial-gradient(circle at 9% 50%, rgba(217, 70, 239, 0.28), transparent 18%),
        linear-gradient(90deg, rgba(5, 0, 8, 0.92), rgba(18, 0, 31, 0.86) 42%, rgba(5, 0, 8, 0.94)),
        url("/static/dna_portal/witch_lab_page_header.png") center 56% / cover no-repeat;
    box-shadow: 0 0 28px rgba(217, 70, 239, 0.22), inset 0 0 26px rgba(217, 70, 239, 0.07);
}

.home-moon-cta::before,
.home-moon-cta::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.home-moon-cta::before {
    inset: 0;
    background:
        radial-gradient(circle at 22% 28%, rgba(255, 255, 255, 0.16), transparent 5%),
        radial-gradient(circle at 86% 28%, rgba(233, 213, 255, 0.18), transparent 4%),
        linear-gradient(180deg, rgba(0, 0, 0, 0.1), rgba(5, 0, 8, 0.58));
}

.home-moon-cta::after {
    right: 2.2rem;
    bottom: 0.5rem;
    width: 160px;
    height: 26px;
    opacity: 0.5;
    background:
        linear-gradient(90deg, transparent, rgba(217, 70, 239, 0.6), transparent);
    filter: blur(12px);
}

.home-moon-scene,
.home-moon-copy,
.home-moon-button {
    position: relative;
    z-index: 1;
}

.home-moon-scene {
    width: clamp(74px, 10vw, 118px);
    aspect-ratio: 1;
    display: grid;
    place-items: center;
}

.home-moon-glow {
    width: 72%;
    aspect-ratio: 1;
    border-radius: 50%;
    background:
        radial-gradient(circle at 64% 38%, rgba(5, 0, 8, 0.86) 0 22%, transparent 23%),
        radial-gradient(circle at 34% 30%, #ffffff 0 5%, #f5d0fe 13%, #d946ef 45%, #7c3aed 78%);
    box-shadow: 0 0 20px rgba(255, 255, 255, 0.26), 0 0 34px rgba(217, 70, 239, 0.62);
}

.home-moon-star {
    position: absolute;
    width: 0.72rem;
    height: 0.72rem;
    color: #f5d0fe;
    text-shadow: 0 0 12px rgba(217, 70, 239, 0.88);
}

.home-moon-star::before {
    content: "\2726";
}

.star-one { left: 8%; top: 18%; }
.star-two { right: 12%; top: 24%; transform: scale(0.7); }
.star-three { right: 26%; bottom: 14%; transform: scale(0.85); }

.home-moon-copy {
    text-align: center;
}

.home-moon-copy h2 {
    margin: 0;
    font-family: Georgia, "Times New Roman", serif;
    color: var(--lh-white);
    font-size: clamp(1.45rem, 3.4vw, 2.35rem);
    line-height: 1.06;
    text-shadow: 0 0 14px rgba(255, 255, 255, 0.28), 0 0 26px rgba(217, 70, 239, 0.4);
}

.home-moon-copy p {
    margin: 0.18rem 0 0;
    color: var(--lh-soft);
    font-size: clamp(1rem, 2vw, 1.25rem);
}

.home-moon-button {
    white-space: nowrap;
}

.error-page-shell {
    position: relative;
    max-width: 820px;
    margin: clamp(1.5rem, 5vw, 4rem) auto;
    padding: clamp(2rem, 5vw, 4rem) clamp(1rem, 4vw, 3rem);
    overflow: hidden;
    text-align: center;
    border: 1px solid rgba(217, 70, 239, 0.38);
    border-radius: 10px;
    background:
        radial-gradient(circle at 50% 0%, rgba(217, 70, 239, 0.24), transparent 34%),
        linear-gradient(180deg, rgba(18, 0, 31, 0.86), rgba(5, 0, 8, 0.96)),
        url("/static/dna_portal/witch_lab_page_header.png") center 42% / cover no-repeat;
    box-shadow: 0 0 32px rgba(217, 70, 239, 0.24), 0 24px 70px rgba(0, 0, 0, 0.48);
}

.error-page-shell::before {
    content: "\2726";
    position: absolute;
    top: 1.2rem;
    right: 1.35rem;
    color: var(--lh-lavender);
    font-size: 1.3rem;
    text-shadow: 0 0 16px rgba(217, 70, 239, 0.8);
}

.error-page-moon {
    width: clamp(64px, 12vw, 104px);
    aspect-ratio: 1;
    margin: 0 auto 1rem;
    border-radius: 50%;
    background:
        radial-gradient(circle at 64% 38%, rgba(5, 0, 8, 0.9) 0 24%, transparent 25%),
        radial-gradient(circle at 34% 30%, #ffffff 0 5%, #f5d0fe 13%, #d946ef 45%, #7c3aed 78%);
    box-shadow: 0 0 22px rgba(255, 255, 255, 0.22), 0 0 38px rgba(217, 70, 239, 0.58);
}

.error-page-shell .page-title {
    margin-top: 0.7rem;
    color: var(--lh-white) !important;
    text-shadow: 0 0 16px rgba(255, 255, 255, 0.3), 0 0 32px rgba(217, 70, 239, 0.42);
}

.error-page-shell p {
    max-width: 580px;
    margin: 0.8rem auto 1.45rem;
    color: var(--lh-muted);
    line-height: 1.6;
}

.error-page-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
    justify-content: center;
}

.hero-proof-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    margin-top: clamp(1.05rem, 2.6vw, 1.65rem);
    max-width: 680px;
    border-top: 1px solid rgba(255, 60, 255, 0.18);
}

.hero-proof-item {
    display: grid;
    justify-items: center;
    gap: 0.22rem;
    padding: 0.8rem 0.85rem 0.05rem;
    text-align: center;
    border-right: 1px solid rgba(233, 213, 255, 0.13);
}

.hero-proof-item:last-child {
    border-right: 0;
}

.hero-proof-icon {
    display: grid;
    place-items: center;
    width: 50px;
    height: 50px;
    margin-bottom: 0.25rem;
    color: var(--lh-soft);
    border: 1px solid rgba(255, 60, 255, 0.54);
    border-radius: 999px;
    font-size: 1.35rem;
    box-shadow: 0 0 18px rgba(255, 60, 255, 0.35), inset 0 0 16px rgba(255, 60, 255, 0.08);
}

.lh-svg-icon {
    width: 1em;
    height: 1em;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 3.1;
    stroke-linecap: round;
    stroke-linejoin: round;
    overflow: visible;
    filter: drop-shadow(0 0 7px rgba(217, 70, 239, 0.9));
}

.hero-proof-icon .lh-svg-icon,
.lh-card-icon .lh-svg-icon {
    width: 58%;
    height: 58%;
}

.hero-proof-item strong {
    color: var(--lh-white) !important;
    font-size: 0.94rem;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.25);
}

.hero-proof-item span:last-child {
    color: var(--lh-soft);
    font-size: 0.82rem;
    line-height: 1.3;
}

.lh-logo-orb {
    position: relative;
    display: grid;
    place-items: center;
    min-height: 380px;
}

.lh-logo-orb img {
    width: min(100%, 470px);
    filter: drop-shadow(0 0 10px rgba(255, 60, 255, 1)) drop-shadow(0 0 48px rgba(255, 60, 255, 0.9)) drop-shadow(0 0 90px rgba(124, 58, 237, 0.72));
    animation: labFloat 7s ease-in-out infinite;
}

.lh-orbit {
    position: absolute;
    color: var(--lh-lavender);
    text-shadow: 0 0 16px rgba(255, 60, 255, 0.9);
    font-size: clamp(1.6rem, 4vw, 2.5rem);
    animation: labTwinkle 3.8s ease-in-out infinite;
}

.lh-orbit:nth-child(2) { top: 8%; left: 18%; }
.lh-orbit:nth-child(3) { right: 8%; top: 25%; animation-delay: 0.7s; }
.lh-orbit:nth-child(4) { left: 7%; bottom: 20%; animation-delay: 1.2s; }
.lh-orbit:nth-child(5) { right: 16%; bottom: 8%; animation-delay: 1.8s; }

.lh-grid,
.lh-card-grid,
.tests-grid,
.customer-summary-grid,
.dashboard-card-grid,
.dashboard-actions,
.contact-grid,
.orders-table-section,
.tests-info-grid,
.guide-quick-grid,
.sample-type-grid,
.process-list,
.choice-grid,
.featured-grid,
.order-live-summary {
    gap: 1rem !important;
}

.lh-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}

/* Homepage final polish overrides. Kept last so restored broad theme sweeps do not flatten these sections. */
.page-shell .home-wrapper .home-header-quote.home-moon-cta {
    position: relative !important;
    display: block !important;
    padding: 0 !important;
    margin: clamp(1.35rem, 3vw, 2.1rem) auto clamp(1.4rem, 3vw, 2rem) !important;
    overflow: hidden !important;
    border-radius: 8px !important;
    background: #050008 !important;
    border: 1px solid rgba(217, 70, 239, 0.42) !important;
    box-shadow: 0 0 30px rgba(217, 70, 239, 0.2), 0 18px 60px rgba(0, 0, 0, 0.5) !important;
}

.page-shell .home-wrapper .home-header-quote.home-moon-cta .home-quote-banner-image {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 112px !important;
    object-fit: cover !important;
    opacity: 1 !important;
    filter: saturate(1.22) contrast(1.12) brightness(0.82) !important;
}

.page-shell .home-wrapper .home-header-quote.home-moon-cta .home-moon-actions {
    position: absolute !important;
    right: clamp(1rem, 3vw, 2rem) !important;
    top: 50% !important;
    z-index: 4 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0.55rem !important;
    width: auto !important;
    transform: translateY(-50%) !important;
}

.page-shell .home-wrapper .home-header-quote.home-moon-cta .home-moon-button {
    min-width: 154px !important;
    justify-content: center !important;
    white-space: nowrap !important;
}

.page-shell .home-wrapper .home-tests .test-card-link .lh-card-icon.lh-icon-badge {
    display: grid !important;
    place-items: center !important;
    width: 46px !important;
    height: 46px !important;
    padding: 0 !important;
    overflow: hidden !important;
}

.page-shell .home-wrapper .home-tests .test-card-link .lh-card-icon.lh-icon-badge .lh-svg-icon {
    display: block !important;
    width: 24px !important;
    height: 24px !important;
    max-width: 24px !important;
    max-height: 24px !important;
    margin: 0 !important;
    transform: none !important;
}

.page-shell .home-wrapper .home-process.lh-section {
    position: relative !important;
    padding: clamp(1rem, 2.5vw, 1.45rem) !important;
    border: 1px solid rgba(217, 70, 239, 0.32) !important;
    border-radius: 8px !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.008)),
        radial-gradient(circle at 8% 14%, rgba(217, 70, 239, 0.15), transparent 32%),
        radial-gradient(circle at 86% 18%, rgba(124, 58, 237, 0.15), transparent 30%),
        rgba(8, 0, 16, 0.9) !important;
    box-shadow: 0 16px 54px rgba(0, 0, 0, 0.36), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

.page-shell .home-wrapper .home-process-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.85rem !important;
}

.page-shell .home-wrapper .process-card.lh-card {
    position: relative !important;
    min-height: 230px !important;
    padding: 1.05rem 1rem 1rem !important;
    border-color: rgba(192, 132, 252, 0.36) !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)),
        radial-gradient(circle at 18% 0%, rgba(217, 70, 239, 0.13), transparent 34%),
        rgba(10, 0, 18, 0.88) !important;
}

.page-shell .home-wrapper .process-icon {
    display: grid !important;
    place-items: center !important;
    width: 56px !important;
    height: 56px !important;
}

.page-shell .home-wrapper .process-icon .lh-svg-icon {
    width: 30px !important;
    height: 30px !important;
}

@media (max-width: 860px) {
    .page-shell .home-wrapper .home-process-grid {
        grid-template-columns: 1fr !important;
    }

    .page-shell .home-wrapper .home-header-quote.home-moon-cta .home-moon-actions {
        position: relative !important;
        right: auto !important;
        top: auto !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        padding: 0.8rem !important;
        transform: none !important;
        background: rgba(5, 0, 8, 0.88) !important;
    }
}

/* Absolute final tone: sleek black neon lab, with clean pink edge light. */
body {
    background:
        radial-gradient(circle at 12% 4%, rgba(255, 60, 255, 0.16), transparent 24%),
        radial-gradient(circle at 88% 7%, rgba(124, 58, 237, 0.18), transparent 30%),
        radial-gradient(ellipse at 50% 112%, rgba(255, 60, 255, 0.14), transparent 44%),
        linear-gradient(180deg, #050008 0%, #090011 54%, #030005 100%) !important;
}

body::before {
    opacity: 0.34 !important;
}

@media screen {
    .content-card.page-shell:not(.shipping-checklist):not(.certificate-page),
    .page-shell:not(.shipping-checklist):not(.certificate-page) {
        background:
            radial-gradient(circle at 14% 0%, rgba(255, 60, 255, 0.12), transparent 30%),
            radial-gradient(circle at 86% 2%, rgba(124, 58, 237, 0.13), transparent 36%),
            linear-gradient(180deg, rgba(8, 0, 16, 0.92), rgba(4, 0, 8, 0.97)) !important;
        border-color: rgba(255, 60, 255, 0.3) !important;
        box-shadow:
            0 24px 80px rgba(0, 0, 0, 0.58),
            0 0 34px rgba(255, 60, 255, 0.12),
            inset 0 1px 0 rgba(255, 255, 255, 0.055) !important;
    }

    .content-card.page-shell:not(.shipping-checklist):not(.certificate-page)::before {
        background:
            radial-gradient(circle at 16% 0%, rgba(255, 60, 255, 0.14), transparent 30%),
            radial-gradient(circle at 82% 5%, rgba(199, 125, 255, 0.1), transparent 36%),
            linear-gradient(180deg, rgba(5, 0, 8, 0.26), rgba(5, 0, 8, 0.74) 52%, rgba(5, 0, 8, 0.92)) !important;
    }

    .page-shell :where(
        [class*="card"],
        [class*="panel"],
        [class*="box"],
        [class*="shell"],
        [class*="tile"],
        [class*="summary"],
        [class*="notice"],
        [class*="callout"],
        [class*="section"],
        [class*="step"],
        [class*="item"],
        [class*="table"],
        [class*="form"],
        [class*="field"],
        [class*="choice"],
        [class*="order"],
        [class*="sample"],
        [class*="dashboard"],
        [class*="waitlist"],
        [class*="staff"]
    ):not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *) {
        background:
            linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.01)),
            radial-gradient(circle at 12% 0%, rgba(255, 60, 255, 0.12), transparent 34%),
            linear-gradient(180deg, rgba(12, 0, 22, 0.9), rgba(5, 0, 10, 0.96)) !important;
        border-color: rgba(255, 60, 255, 0.32) !important;
        box-shadow:
            0 18px 54px rgba(0, 0, 0, 0.48),
            0 0 22px rgba(255, 60, 255, 0.1),
            inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
    }

    .page-shell :where(.lh-card, .test-card, .price-card, .info-card, .process-card, .dashboard-card, .account-card, .order-card):not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *) {
        background:
            linear-gradient(145deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.012)),
            radial-gradient(circle at 18% 0%, rgba(255, 60, 255, 0.13), transparent 36%),
            rgba(7, 0, 14, 0.94) !important;
        border-color: rgba(255, 60, 255, 0.34) !important;
    }

    .page-shell :where(.section-kicker, [class*="kicker"]):not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *) {
        display: inline-block !important;
        width: auto !important;
        max-width: max-content !important;
        padding: 0 !important;
        background: transparent !important;
        background-image: none !important;
        border: 0 !important;
        box-shadow: none !important;
        color: #ffd8ff !important;
        -webkit-text-fill-color: #ffd8ff !important;
        text-shadow: 0 0 10px rgba(255, 60, 255, 0.42), 0 0 18px rgba(199, 125, 255, 0.24) !important;
    }

    .page-shell :where(.btn, .btn-primary, .btn-secondary, .btn-ghost, button[type="submit"]:not(.logout-button), a[class*="button"], [class*="button"], [class*="pill"]):not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *) {
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.014) 46%),
            radial-gradient(circle at 86% 20%, rgba(255, 60, 255, 0.18), transparent 38%),
            rgba(9, 0, 17, 0.9) !important;
        border-color: rgba(255, 196, 255, 0.48) !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        text-shadow: 0 1px 2px rgba(17, 0, 24, 0.85), 0 0 8px rgba(255, 255, 255, 0.22) !important;
        box-shadow:
            0 0 10px rgba(255, 60, 255, 0.24),
            0 0 24px rgba(217, 70, 239, 0.12),
            inset 0 0 14px rgba(255, 255, 255, 0.055) !important;
        transition: transform 160ms ease, background 160ms ease, box-shadow 160ms ease, border-color 160ms ease, filter 160ms ease !important;
    }

    .page-shell :where(.btn-primary, .nav-emphasis, button[type="submit"]:not(.logout-button), [class*="button"].primary):not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *) {
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.18), transparent 44%),
            linear-gradient(135deg, #9900ff 0%, #c516f4 48%, #e735ff 100%) !important;
        border-color: rgba(255, 216, 255, 0.72) !important;
        box-shadow:
            0 0 14px rgba(255, 60, 255, 0.46),
            0 0 34px rgba(217, 70, 239, 0.25),
            inset 0 0 16px rgba(255, 255, 255, 0.12) !important;
    }

    .page-shell :where(.btn, .btn-primary, .btn-secondary, .btn-ghost, button[type="submit"]:not(.logout-button), a[class*="button"], [class*="button"], [class*="pill"]):not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *):hover,
    .page-shell :where(.btn, .btn-primary, .btn-secondary, .btn-ghost, button[type="submit"]:not(.logout-button), a[class*="button"], [class*="button"], [class*="pill"]):not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *):focus-visible {
        transform: translateY(-1px);
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.2), transparent 42%),
            linear-gradient(135deg, rgba(176, 0, 255, 0.96), rgba(210, 28, 255, 0.96), rgba(255, 77, 255, 0.95)) !important;
        border-color: rgba(255, 226, 255, 0.86) !important;
        box-shadow:
            0 0 16px rgba(255, 255, 255, 0.28),
            0 0 34px rgba(255, 60, 255, 0.66),
            0 0 64px rgba(217, 70, 239, 0.36),
            inset 0 0 18px rgba(255, 255, 255, 0.14) !important;
    }

    .page-shell .section-kicker.section-kicker,
    .page-shell [class*="kicker"][class*="kicker"] {
        display: inline-block !important;
        width: auto !important;
        max-width: max-content !important;
        min-height: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        background-color: transparent !important;
        background-image: none !important;
        border: 0 !important;
        box-shadow: none !important;
        color: #ffd8ff !important;
        -webkit-text-fill-color: #ffd8ff !important;
        text-shadow: 0 0 10px rgba(255, 60, 255, 0.42), 0 0 18px rgba(199, 125, 255, 0.24) !important;
    }

    .page-shell.page-shell.page-shell .section-kicker.section-kicker.section-kicker:not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *),
    .page-shell.page-shell.page-shell [class*="kicker"][class*="kicker"][class*="kicker"]:not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *) {
        background: transparent !important;
        background-color: transparent !important;
        background-image: none !important;
        box-shadow: none !important;
        border: 0 !important;
    }

    .page-shell.page-shell.page-shell .section-head.section-head.section-head:not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *) {
        background: transparent !important;
        background-color: transparent !important;
        background-image: none !important;
        border: 0 !important;
        box-shadow: none !important;
        padding: 0 !important;
    }

    .page-shell.page-shell.page-shell .section-head.section-head.section-head > * {
        position: relative;
        z-index: 1;
    }
}

/* Mobile homepage alignment: preserve the quote artwork and center test cards. */
@media (max-width: 640px) {
    .page-main.page-main .page-shell.page-shell .home-wrapper.home-wrapper .home-header-quote.home-moon-cta .home-quote-banner-image {
        object-position: left center !important;
    }

    .page-main.page-main .page-shell.page-shell .home-wrapper.home-wrapper .home-tests.home-tests .lh-card-grid.lh-card-grid {
        grid-template-columns: minmax(0, min(100%, 280px)) !important;
        justify-content: center !important;
        justify-items: center !important;
    }

    .page-main.page-main .page-shell.page-shell .home-wrapper.home-wrapper .home-tests.home-tests .test-card-link.test-card-link {
        width: 100% !important;
        max-width: 280px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

/* True final tone: sleek black neon lab, not cloudy glass. */
body {
    background:
        radial-gradient(circle at 12% 4%, rgba(255, 60, 255, 0.16), transparent 24%),
        radial-gradient(circle at 88% 7%, rgba(124, 58, 237, 0.18), transparent 30%),
        radial-gradient(ellipse at 50% 112%, rgba(255, 60, 255, 0.14), transparent 44%),
        linear-gradient(180deg, #050008 0%, #090011 54%, #030005 100%) !important;
}

body::before {
    opacity: 0.34 !important;
}

@media screen {
    .content-card.page-shell:not(.shipping-checklist):not(.certificate-page),
    .page-shell:not(.shipping-checklist):not(.certificate-page) {
        background:
            radial-gradient(circle at 14% 0%, rgba(255, 60, 255, 0.12), transparent 30%),
            radial-gradient(circle at 86% 2%, rgba(124, 58, 237, 0.13), transparent 36%),
            linear-gradient(180deg, rgba(8, 0, 16, 0.92), rgba(4, 0, 8, 0.97)) !important;
        border-color: rgba(255, 60, 255, 0.3) !important;
        box-shadow:
            0 24px 80px rgba(0, 0, 0, 0.58),
            0 0 34px rgba(255, 60, 255, 0.12),
            inset 0 1px 0 rgba(255, 255, 255, 0.055) !important;
    }

    .content-card.page-shell:not(.shipping-checklist):not(.certificate-page)::before {
        background:
            radial-gradient(circle at 16% 0%, rgba(255, 60, 255, 0.14), transparent 30%),
            radial-gradient(circle at 82% 5%, rgba(199, 125, 255, 0.1), transparent 36%),
            linear-gradient(180deg, rgba(5, 0, 8, 0.26), rgba(5, 0, 8, 0.74) 52%, rgba(5, 0, 8, 0.92)) !important;
    }

    .page-shell :where(
        [class*="card"],
        [class*="panel"],
        [class*="box"],
        [class*="shell"],
        [class*="tile"],
        [class*="summary"],
        [class*="notice"],
        [class*="callout"],
        [class*="section"],
        [class*="step"],
        [class*="item"],
        [class*="table"],
        [class*="form"],
        [class*="field"],
        [class*="choice"],
        [class*="order"],
        [class*="sample"],
        [class*="dashboard"],
        [class*="waitlist"],
        [class*="staff"]
    ):not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *) {
        background:
            linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.01)),
            radial-gradient(circle at 12% 0%, rgba(255, 60, 255, 0.12), transparent 34%),
            linear-gradient(180deg, rgba(12, 0, 22, 0.9), rgba(5, 0, 10, 0.96)) !important;
        border-color: rgba(255, 60, 255, 0.32) !important;
        box-shadow:
            0 18px 54px rgba(0, 0, 0, 0.48),
            0 0 22px rgba(255, 60, 255, 0.1),
            inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
    }

    .page-shell :where(.lh-card, .test-card, .price-card, .info-card, .process-card, .dashboard-card, .account-card, .order-card):not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *) {
        background:
            linear-gradient(145deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.012)),
            radial-gradient(circle at 18% 0%, rgba(255, 60, 255, 0.13), transparent 36%),
            rgba(7, 0, 14, 0.94) !important;
        border-color: rgba(255, 60, 255, 0.34) !important;
    }
}

.page-shell.page-shell .home-wrapper.home-wrapper .home-tests.home-tests .test-card-link.test-card-link > h3 {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    opacity: 1 !important;
    background: transparent !important;
    background-image: none !important;
    background-clip: border-box !important;
    -webkit-background-clip: border-box !important;
    filter: none !important;
    mix-blend-mode: normal !important;
    font-weight: 1000 !important;
}

.page-shell .home-wrapper .featured-grid .rabbitry-programs {
    display: grid;
    gap: 1rem;
    margin-top: 0.85rem;
}

.page-shell .home-wrapper .featured-grid .rabbitry-program {
    padding-top: 0.92rem;
    border-top: 1px solid rgba(255, 60, 255, 0.2);
}

.page-shell .home-wrapper .featured-grid .rabbitry-program:first-child {
    padding-top: 0;
    border-top: 0;
}

.page-shell .home-wrapper .featured-grid .rabbitry-program h3 {
    margin: 0 0 0.42rem;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-size: clamp(1.25rem, 2vw, 1.7rem);
    font-weight: 950;
    line-height: 1.12;
}

.page-shell .home-wrapper .featured-grid .rabbitry-program p {
    margin: 0 0 0.7rem;
}

.page-shell .home-wrapper .home-tests .test-card-link h3,
.page-shell .home-wrapper .home-process .process-card h3 {
    color: var(--lh-white) !important;
    -webkit-text-fill-color: var(--lh-white) !important;
    font-weight: 950 !important;
    text-align: center !important;
    text-shadow:
        0 0 10px rgba(255, 255, 255, 0.38),
        0 0 18px rgba(255, 60, 255, 0.45) !important;
}

.page-shell .home-wrapper .home-process .process-card h3 {
    width: 100% !important;
    margin-top: -0.32rem !important;
    margin-bottom: 0.5rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.page-shell .home-wrapper .home-process .process-card .process-icon {
    margin-bottom: 0.38rem !important;
}


/* Final homepage process pass: soften the box and pull it into the pink lab system. */
.page-main .page-shell .home-wrapper section.home-process.lh-section {
    max-width: 1180px !important;
    margin: clamp(1.35rem, 3vw, 2.2rem) auto !important;
    padding: clamp(1.15rem, 2.8vw, 1.8rem) !important;
    border: 1px solid rgba(255, 60, 255, 0.44) !important;
    border-radius: 10px !important;
    background:
        radial-gradient(circle at 18% 4%, rgba(255, 60, 255, 0.22), transparent 35%),
        radial-gradient(circle at 84% 12%, rgba(199, 125, 255, 0.18), transparent 32%),
        linear-gradient(180deg, rgba(18, 0, 31, 0.52), rgba(5, 0, 8, 0.7)) !important;
    box-shadow:
        0 0 34px rgba(255, 60, 255, 0.18),
        0 22px 64px rgba(0, 0, 0, 0.42),
        inset 0 0 28px rgba(255, 60, 255, 0.06) !important;
}

.page-main .page-shell .home-wrapper section.home-process.lh-section .section-head {
    margin-bottom: 1.1rem !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.page-main .page-shell .home-wrapper section.home-process.lh-section .section-kicker {
    color: #ffd8ff !important;
    text-shadow: 0 0 14px rgba(255, 60, 255, 0.42) !important;
}

.page-main .page-shell .home-wrapper section.home-process.lh-section .section-head h2 {
    max-width: 760px !important;
    margin: 0 !important;
    color: #ffffff !important;
    text-shadow: 0 0 16px rgba(255, 255, 255, 0.18), 0 0 24px rgba(255, 60, 255, 0.18) !important;
}

.page-main .page-shell .home-wrapper section.home-process.lh-section .process-card.lh-card {
    min-height: 224px !important;
    padding: 1.15rem 1.1rem 1.1rem !important;
    border: 1px solid rgba(255, 60, 255, 0.34) !important;
    border-radius: 8px !important;
    background:
        radial-gradient(circle at 16% 0%, rgba(255, 60, 255, 0.16), transparent 35%),
        linear-gradient(145deg, rgba(20, 0, 32, 0.9), rgba(7, 0, 14, 0.92)) !important;
    box-shadow: 0 16px 44px rgba(0, 0, 0, 0.36), 0 0 18px rgba(255, 60, 255, 0.09) !important;
}

.page-main .page-shell .home-wrapper section.home-process.lh-section .process-icon {
    border-color: rgba(255, 216, 255, 0.58) !important;
    background:
        radial-gradient(circle at 35% 25%, rgba(255, 255, 255, 0.24), transparent 32%),
        linear-gradient(135deg, rgba(255, 60, 255, 0.64), rgba(118, 44, 191, 0.58)) !important;
    box-shadow: 0 0 18px rgba(255, 60, 255, 0.38), inset 0 0 14px rgba(255, 255, 255, 0.1) !important;
}

.page-main .page-shell .home-wrapper section.home-process.lh-section .process-step {
    color: #ffffff !important;
    border-color: rgba(255, 60, 255, 0.62) !important;
    background:
        radial-gradient(circle at 35% 25%, rgba(255, 255, 255, 0.22), transparent 36%),
        rgba(255, 60, 255, 0.2) !important;
    box-shadow: 0 0 18px rgba(255, 60, 255, 0.34) !important;
}

@media (max-width: 860px) {
    .page-main .page-shell .home-wrapper section.home-process.lh-section .home-process-grid {
        grid-template-columns: 1fr !important;
    }

    .page-main .page-shell .home-wrapper section.home-process.lh-section .process-card.lh-card {
        min-height: 0 !important;
        padding-right: 4rem !important;
    }
}

/* Clean lab glow pass: less black mass, more transparent pink/violet glass. */
:root {
    --lh-glass-deep: rgba(18, 0, 32, 0.62);
    --lh-glass-mid: rgba(54, 12, 72, 0.44);
    --lh-glass-pink: rgba(255, 60, 255, 0.14);
    --lh-glass-lavender: rgba(199, 125, 255, 0.18);
    --lh-lab-line: rgba(255, 196, 255, 0.34);
    --lh-lab-shadow: 0 16px 48px rgba(24, 0, 34, 0.42), 0 0 28px rgba(255, 60, 255, 0.1);
}

body {
    background:
        radial-gradient(circle at 12% 4%, rgba(255, 60, 255, 0.2), transparent 26%),
        radial-gradient(circle at 88% 8%, rgba(199, 125, 255, 0.2), transparent 32%),
        radial-gradient(ellipse at 50% 110%, rgba(255, 60, 255, 0.18), transparent 48%),
        linear-gradient(180deg, #0b0013 0%, #130022 44%, #07000d 100%) !important;
}

body::before {
    opacity: 0.48 !important;
    background-image:
        radial-gradient(circle, rgba(255, 255, 255, 0.76) 0 1px, transparent 1.6px),
        linear-gradient(115deg, transparent 0 47%, rgba(199, 125, 255, 0.07) 47% 49%, transparent 49% 100%),
        radial-gradient(ellipse at 70% 18%, rgba(255, 60, 255, 0.18), transparent 42%) !important;
}

body::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.035), transparent 18%, transparent 82%, rgba(255, 255, 255, 0.035)),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.028) 0 1px, transparent 1px 140px);
    mix-blend-mode: screen;
    opacity: 0.38;
}

@media screen {
    .content-card.page-shell:not(.shipping-checklist):not(.certificate-page),
    .page-shell:not(.shipping-checklist):not(.certificate-page) {
        background:
            linear-gradient(180deg, rgba(32, 0, 48, 0.56), rgba(10, 0, 18, 0.68)),
            radial-gradient(circle at 14% 0%, rgba(255, 60, 255, 0.18), transparent 34%),
            radial-gradient(circle at 88% 0%, rgba(199, 125, 255, 0.16), transparent 38%) !important;
        border-color: rgba(255, 60, 255, 0.3) !important;
        box-shadow: 0 22px 80px rgba(17, 0, 28, 0.46), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
    }

    .content-card.page-shell:not(.shipping-checklist):not(.certificate-page)::before {
        background:
            radial-gradient(circle at 16% 0%, rgba(255, 60, 255, 0.2), transparent 34%),
            radial-gradient(circle at 82% 8%, rgba(199, 125, 255, 0.17), transparent 38%),
            linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(5, 0, 8, 0.34) 58%, rgba(5, 0, 8, 0.56)) !important;
    }

    .page-shell :where(
        [class*="card"],
        [class*="panel"],
        [class*="box"],
        [class*="shell"],
        [class*="tile"],
        [class*="summary"],
        [class*="notice"],
        [class*="callout"],
        [class*="section"],
        [class*="step"],
        [class*="item"],
        [class*="table"],
        [class*="form"],
        [class*="field"],
        [class*="choice"],
        [class*="order"],
        [class*="sample"],
        [class*="dashboard"],
        [class*="waitlist"],
        [class*="staff"]
    ):not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *) {
        background:
            linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.024)),
            radial-gradient(circle at 10% 0%, var(--lh-glass-pink), transparent 38%),
            radial-gradient(circle at 92% 10%, var(--lh-glass-lavender), transparent 42%),
            linear-gradient(180deg, var(--lh-glass-mid), var(--lh-glass-deep)) !important;
        border-color: var(--lh-lab-line) !important;
        box-shadow: var(--lh-lab-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
    }

    .page-shell :where(.lh-section, .test-section-block, .process-section, .pricing-section, .customer-summary-section, .dashboard-order-cta):not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *) {
        background:
            linear-gradient(180deg, rgba(64, 12, 78, 0.36), rgba(13, 0, 22, 0.54)),
            radial-gradient(circle at 18% 0%, rgba(255, 60, 255, 0.16), transparent 34%),
            radial-gradient(circle at 86% 8%, rgba(199, 125, 255, 0.16), transparent 38%) !important;
    }

    .page-shell :where(.lh-card, .test-card, .price-card, .info-card, .process-card, .dashboard-card, .account-card, .order-card):not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *) {
        background:
            linear-gradient(145deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.026)),
            radial-gradient(circle at 18% 0%, rgba(255, 60, 255, 0.18), transparent 36%),
            linear-gradient(180deg, rgba(38, 6, 52, 0.56), rgba(8, 0, 16, 0.7)) !important;
        border-color: rgba(255, 196, 255, 0.38) !important;
    }

    .page-shell :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea, .order-notes-textarea):not(.certificate-page):not(.certificate-page *) {
        background: rgba(255, 255, 255, 0.065) !important;
        border-color: rgba(255, 196, 255, 0.42) !important;
        box-shadow: inset 0 0 18px rgba(255, 60, 255, 0.08), 0 0 12px rgba(199, 125, 255, 0.08) !important;
    }

    .page-shell :where(table, .sheet-table):not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *) {
        background: rgba(255, 255, 255, 0.04) !important;
    }
}

/* Homepage process polish: keep the steps, lose the blue control-panel feel. */
.page-shell .home-wrapper .home-process.lh-section {
    max-width: 1180px !important;
    margin: clamp(1.35rem, 3vw, 2.2rem) auto !important;
    padding: clamp(1.15rem, 2.8vw, 1.8rem) !important;
    border: 1px solid rgba(255, 60, 255, 0.42) !important;
    border-radius: 10px !important;
    background:
        radial-gradient(circle at 18% 4%, rgba(255, 60, 255, 0.2), transparent 35%),
        radial-gradient(circle at 82% 12%, rgba(199, 125, 255, 0.16), transparent 32%),
        linear-gradient(180deg, rgba(18, 0, 31, 0.5), rgba(5, 0, 8, 0.62)) !important;
    box-shadow:
        0 0 32px rgba(255, 60, 255, 0.16),
        0 22px 64px rgba(0, 0, 0, 0.4),
        inset 0 0 28px rgba(255, 60, 255, 0.055) !important;
}

.page-shell .home-wrapper .home-process .section-head {
    max-width: 860px !important;
    margin: 0 0 1.1rem !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.page-shell .home-wrapper .home-process .section-kicker {
    color: var(--lh-lavender) !important;
}

.page-shell .home-wrapper .home-process .section-head h2 {
    max-width: 760px;
    color: var(--lh-white) !important;
    font-size: clamp(1.95rem, 4vw, 3.15rem) !important;
    line-height: 1.02 !important;
    text-shadow: 0 0 18px rgba(255, 60, 255, 0.35) !important;
}

.page-shell .home-wrapper .home-process-grid {
    gap: 0.95rem !important;
}

.page-shell .home-wrapper .process-card.lh-card {
    min-height: 0 !important;
    padding: 1.1rem 1.05rem 1.15rem !important;
    border: 1px solid rgba(255, 60, 255, 0.32) !important;
    border-radius: 10px !important;
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 60, 255, 0.13), transparent 42%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.01)),
        rgba(10, 0, 18, 0.72) !important;
    box-shadow:
        0 0 22px rgba(255, 60, 255, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

.page-shell .home-wrapper .process-card.lh-card::after {
    inset: auto 1rem 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255, 60, 255, 0.72), transparent) !important;
}

.page-shell .home-wrapper .process-card .process-step {
    top: 0.85rem !important;
    right: 0.85rem !important;
    width: 34px !important;
    height: 34px !important;
    border-color: rgba(255, 60, 255, 0.58) !important;
    color: var(--lh-white) !important;
    background:
        radial-gradient(circle at 35% 25%, rgba(255, 255, 255, 0.22), transparent 36%),
        rgba(217, 70, 239, 0.2) !important;
    box-shadow: 0 0 18px rgba(255, 60, 255, 0.34) !important;
}

.page-shell .home-wrapper .process-icon {
    width: 52px !important;
    height: 52px !important;
    margin-bottom: 0.85rem !important;
    color: #ffffff !important;
    border-color: rgba(255, 216, 255, 0.56) !important;
    background:
        radial-gradient(circle at 35% 25%, rgba(255, 255, 255, 0.24), transparent 32%),
        linear-gradient(135deg, rgba(153, 0, 255, 0.72), rgba(231, 53, 255, 0.5)) !important;
    box-shadow:
        0 0 18px rgba(255, 60, 255, 0.38),
        inset 0 0 14px rgba(255, 255, 255, 0.1) !important;
}

.page-shell .home-wrapper .process-card h3 {
    margin-bottom: 0.55rem !important;
    color: var(--lh-white) !important;
    text-shadow: 0 0 12px rgba(255, 60, 255, 0.28) !important;
}

.page-shell .home-wrapper .process-card p {
    color: var(--lh-muted) !important;
}

@media (max-width: 860px) {
    .page-shell .home-wrapper .home-process-grid {
        grid-template-columns: 1fr !important;
    }

    .page-shell .home-wrapper .process-card.lh-card {
        padding-right: 3.75rem !important;
    }
}

/* Final readability correction for the tests hero copy. */
.page-shell .tests-overview-shell .tests-hero-copy .tests-lead,
.page-shell .tests-overview-shell .tests-hero-copy .tests-sublead {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.page-shell .tests-overview-shell .tests-hero-copy .tests-lead,
.page-shell .tests-overview-shell .tests-hero-copy .tests-sublead {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.page-shell > :not(.shipping-checklist):not(.certificate-page) .card-subtitle.card-subtitle,
.page-shell > :not(.shipping-checklist):not(.certificate-page) .highlight-intro.highlight-intro {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}

.page-shell .how-wrapper .process-list {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(260px, 1fr)) !important;
    gap: 0.95rem !important;
    align-items: stretch !important;
}

.page-shell .how-wrapper .process-card.process-card {
    display: block !important;
    min-height: 0 !important;
    padding: 1.15rem 1.15rem 1.15rem 4.75rem !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}

.page-shell .how-wrapper .process-card.process-card > div {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
}

.page-shell .how-wrapper .process-card.process-card h3,
.page-shell .how-wrapper .process-card.process-card p {
    max-width: none !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
}

.page-shell .how-wrapper .process-card.process-card h3 {
    margin: 0 0 0.42rem !important;
    font-size: clamp(1.02rem, 1.6vw, 1.18rem) !important;
    line-height: 1.22 !important;
}

.page-shell .how-wrapper .process-card.process-card p {
    line-height: 1.6 !important;
}

.page-shell .tests-overview-shell .tests-hero-copy .tests-lead,
.page-shell .tests-overview-shell .tests-hero-copy .tests-sublead {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

@media (max-width: 760px) {
    .page-shell .how-wrapper .process-list {
        grid-template-columns: 1fr !important;
    }
}

.page-shell .home-wrapper .home-header-quote.home-moon-cta .home-moon-actions .btn-primary.home-moon-button {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.18), transparent 42%),
        linear-gradient(135deg, #e600e6 0%, #eb3fc7 48%, #f271de 100%) !important;
    border-color: rgba(255, 205, 255, 0.82) !important;
    box-shadow:
        0 0 10px rgba(255, 0, 255, 0.58),
        0 0 24px rgba(255, 79, 216, 0.42),
        0 0 42px rgba(217, 70, 239, 0.24),
        inset 0 0 14px rgba(255, 255, 255, 0.12) !important;
    text-shadow: 0 1px 1px rgba(45, 0, 55, 0.62) !important;
}

.page-shell .home-wrapper .home-header-quote.home-moon-cta .home-moon-actions .btn-primary.home-moon-button:hover,
.page-shell .home-wrapper .home-header-quote.home-moon-cta .home-moon-actions .btn-primary.home-moon-button:focus-visible {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.22), transparent 42%),
        linear-gradient(135deg, #f02de9 0%, #f052cd 48%, #fa87ed 100%) !important;
    box-shadow:
        0 0 14px rgba(255, 0, 255, 0.72),
        0 0 30px rgba(255, 79, 216, 0.5),
        0 0 54px rgba(217, 70, 239, 0.3),
        inset 0 0 16px rgba(255, 255, 255, 0.16) !important;
}

.page-shell .home-wrapper .home-tests .home-species-list {
    font-size: 0.86rem !important;
    line-height: 1.35 !important;
}

.home-tests .lh-card-grid {
    grid-template-columns: repeat(auto-fit, minmax(210px, 280px));
    justify-content: start;
}

.lh-card {
    padding: 1rem;
}

.home-tests .test-card-link {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0 !important;
    min-height: 258px;
    text-decoration: none;
}

.home-test-card-image {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    max-height: 210px;
    height: auto;
    object-fit: cover;
    border-bottom: 1px solid rgba(255, 60, 255, 0.28);
    filter: saturate(1.08) contrast(1.04);
}

.home-test-card-image-rabbit-dwarf {
    object-fit: contain;
    object-position: center center;
    transform: none;
    background:
        radial-gradient(circle at center, rgba(255, 60, 255, 0.12), transparent 42%),
        #050008;
}

/* Theme coverage for older page-local templates. */
.page-shell :is(
    .about-hero-card,
    .about-story-card,
    .about-card,
    .account-card,
    .dash-card,
    .dashboard-card,
    .dash-hero,
    .credit-card,
    .smart-card,
    .price-card,
    .savings-card,
    .sample-card,
    .sample-step-card,
    .sample-review-card,
    .rabbit-card,
    .rabbit-step-card,
    .rabbit-instructions,
    .rabbit-form,
    .rabbit-label-rule,
    .rabbit-label-pill,
    .gene-grid-wrap,
    .gene-cell,
    .gene-head,
    .wizard-card,
    .shipping-card,
    .checklist-card,
    .certificate-card,
    .guide-card,
    .guide-step,
    .toenail-card,
    .policy-card,
    .waitlist-card,
    .status-card,
    .shop-card,
    .chick-card,
    .history-card,
    .staff-card,
    .staff_card,
    .staff-nav-shell,
    .staff-panel,
    .staff-summary-card,
    .staff-side-note-card,
    .staff-notes-card,
    .staff-search-card,
    .staff-section,
    .staff-order-workspace,
    .staff-sample-card,
    .staff-status-card,
    .chick-panel,
    .credit-table,
    .completed-total-card,
    .empty-history,
    .dashboard-ticker-item,
    .order-live-summary > div,
    .order-top-grid > div,
    .callout-mail,
    .genetics-key-card,
    .toenail-page-hero,
    .toenail-page-reminders,
    .toenail-page-reminders div,
    .toenail-guide-header,
    .toenail-items-card,
    .toenail-video-intro,
    .toenail-video-card,
    .toenail-amount-card,
    .toenail-step-list li,
    .ai-main-card,
    .ai-side-card,
    .ai-suggestion-card,
    .alloc-card,
    .history-search-card,
    .shop-status-card,
    .filter-card,
    .search-card,
    .summary-card,
    .summary-box,
    .section-card,
    .section-panel,
    .form-card,
    .form-panel,
    .table-card,
    .results-card,
    .detail-card,
    .note-card,
    .notice-card,
    .review-card,
    .preview-card
) {
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.014)),
        radial-gradient(circle at top left, rgba(255, 60, 255, 0.11), transparent 38%),
        rgba(8, 0, 16, 0.9) !important;
    border: 1px solid rgba(255, 60, 255, 0.3) !important;
    box-shadow: 0 18px 56px rgba(0, 0, 0, 0.45), 0 0 22px rgba(255, 60, 255, 0.1) !important;
    color: var(--lh-white) !important;
}

.page-shell :is(
    .about-hero-card,
    .about-story-card,
    .about-card,
    .account-card,
    .dash-card,
    .dashboard-card,
    .dash-hero,
    .credit-card,
    .smart-card,
    .price-card,
    .savings-card,
    .sample-card,
    .sample-step-card,
    .sample-review-card,
    .rabbit-card,
    .rabbit-step-card,
    .rabbit-instructions,
    .rabbit-form,
    .rabbit-label-rule,
    .rabbit-label-pill,
    .gene-grid-wrap,
    .gene-cell,
    .gene-head,
    .wizard-card,
    .shipping-card,
    .checklist-card,
    .guide-card,
    .guide-step,
    .toenail-card,
    .policy-card,
    .waitlist-card,
    .status-card,
    .shop-card,
    .chick-card,
    .history-card,
    .staff-card,
    .staff_card,
    .staff-nav-shell,
    .staff-panel,
    .staff-summary-card,
    .staff-side-note-card,
    .staff-notes-card,
    .staff-search-card,
    .staff-section,
    .staff-order-workspace,
    .staff-sample-card,
    .staff-status-card,
    .chick-panel,
    .credit-table,
    .completed-total-card,
    .empty-history,
    .dashboard-ticker-item,
    .order-live-summary > div,
    .order-top-grid > div,
    .callout-mail,
    .genetics-key-card,
    .toenail-page-hero,
    .toenail-page-reminders,
    .toenail-page-reminders div,
    .toenail-guide-header,
    .toenail-items-card,
    .toenail-video-intro,
    .toenail-video-card,
    .toenail-amount-card,
    .toenail-step-list li,
    .ai-main-card,
    .ai-side-card,
    .ai-suggestion-card,
    .alloc-card,
    .history-search-card,
    .shop-status-card,
    .filter-card,
    .search-card,
    .summary-card,
    .summary-box,
    .section-card,
    .section-panel,
    .form-card,
    .form-panel,
    .table-card,
    .results-card,
    .detail-card,
    .note-card,
    .notice-card,
    .review-card,
    .preview-card
) :is(h1, h2, h3, h4, strong, label, .card-title, .ai-card-title, .price-card-title, .smart-title, .status-h3) {
    color: var(--lh-white) !important;
}

.page-shell :is(
    .about-hero-card,
    .about-story-card,
    .about-card,
    .account-card,
    .dash-card,
    .dashboard-card,
    .dash-hero,
    .credit-card,
    .smart-card,
    .price-card,
    .savings-card,
    .sample-card,
    .sample-step-card,
    .sample-review-card,
    .rabbit-card,
    .rabbit-step-card,
    .rabbit-instructions,
    .rabbit-form,
    .rabbit-label-rule,
    .rabbit-label-pill,
    .gene-grid-wrap,
    .gene-cell,
    .gene-head,
    .wizard-card,
    .shipping-card,
    .checklist-card,
    .guide-card,
    .guide-step,
    .toenail-card,
    .policy-card,
    .waitlist-card,
    .status-card,
    .shop-card,
    .chick-card,
    .history-card,
    .staff-card,
    .staff_card,
    .staff-nav-shell,
    .staff-panel,
    .staff-summary-card,
    .staff-side-note-card,
    .staff-notes-card,
    .staff-search-card,
    .staff-section,
    .staff-order-workspace,
    .staff-sample-card,
    .staff-status-card,
    .chick-panel,
    .credit-table,
    .completed-total-card,
    .empty-history,
    .dashboard-ticker-item,
    .order-live-summary > div,
    .order-top-grid > div,
    .callout-mail,
    .genetics-key-card,
    .toenail-page-hero,
    .toenail-page-reminders,
    .toenail-page-reminders div,
    .toenail-guide-header,
    .toenail-items-card,
    .toenail-video-intro,
    .toenail-video-card,
    .toenail-amount-card,
    .toenail-step-list li,
    .ai-main-card,
    .ai-side-card,
    .ai-suggestion-card,
    .alloc-card,
    .history-search-card,
    .shop-status-card,
    .filter-card,
    .search-card,
    .summary-card,
    .summary-box,
    .section-card,
    .section-panel,
    .form-card,
    .form-panel,
    .table-card,
    .results-card,
    .detail-card,
    .note-card,
    .notice-card,
    .review-card,
    .preview-card
) :is(p, li, td, small, .hint, .mini-help, .card-subtitle, .smart-body, .price-card-body, .status-muted) {
    color: var(--lh-muted) !important;
}

.page-shell :is(
    input:not([type="checkbox"]):not([type="radio"]),
    select,
    textarea,
    .order-notes-textarea
) {
    background: rgba(5, 0, 8, 0.86) !important;
    border: 1px solid rgba(255, 60, 255, 0.34) !important;
    color: var(--lh-white) !important;
    box-shadow: inset 0 0 16px rgba(255, 60, 255, 0.05) !important;
}

.page-shell :is(input, textarea)::placeholder {
    color: rgba(233, 213, 255, 0.54) !important;
}

.page-shell select option {
    background: #12001d;
    color: var(--lh-white);
}

.page-shell :is(
    .staff-tab,
    .staff-pill,
    .staff-sub-pill,
    .tab-pill,
    .pill-outline,
    .link-button,
    .prompt-chip,
    .voice-pill,
    .btn-secondary,
    .secondary-btn,
    .status-pill,
    .stat-pill,
    .import-pill,
    .autosave-status,
    .staff-sponsor-btn
) {
    background: rgba(255, 60, 255, 0.08) !important;
    border: 1px solid rgba(255, 60, 255, 0.32) !important;
    color: var(--lh-soft) !important;
    box-shadow: 0 0 14px rgba(255, 60, 255, 0.1) !important;
}

/* Last-mile sweep for old page-local cards and panels that still hard-code pale CSS. */
.page-shell > :not(.shipping-checklist):not(.certificate-page) :is(
    [class*="card"],
    [class*="panel"],
    [class*="box"],
    [class*="callout"],
    [class*="summary"],
    [class*="section"],
    [class*="tile"],
    [class*="item"],
    [class*="notice"],
    [class*="note"],
    [class*="form"],
    [class*="table"],
    [class*="wrap"]
),
.page-shell > :is(
    [class*="card"],
    [class*="panel"],
    [class*="box"],
    [class*="callout"],
    [class*="summary"],
    [class*="section"],
    [class*="tile"],
    [class*="item"],
    [class*="notice"],
    [class*="note"],
    [class*="form"],
    [class*="table"],
    [class*="wrap"]
):not(.shipping-checklist):not(.certificate-page) {
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.048), rgba(255, 255, 255, 0.012)),
        radial-gradient(circle at top left, rgba(255, 60, 255, 0.1), transparent 38%),
        rgba(8, 0, 16, 0.9) !important;
    border-color: rgba(255, 60, 255, 0.28) !important;
    color: var(--lh-white) !important;
    box-shadow: 0 16px 44px rgba(0, 0, 0, 0.36), 0 0 18px rgba(255, 60, 255, 0.08) !important;
}

.page-shell .order-wrapper > .add-on-info-callout {
    border-color: rgba(255, 122, 232, 0.52) !important;
    background:
        radial-gradient(circle at 50% 0, rgba(255, 255, 255, 0.12), transparent 42%),
        linear-gradient(135deg, rgba(82, 16, 82, 0.96), rgba(129, 26, 112, 0.94)) !important;
    box-shadow:
        0 0 18px rgba(255, 60, 255, 0.18),
        0 18px 46px rgba(0, 0, 0, 0.34) !important;
}

.page-shell .order-wrapper > .add-on-info-callout :is(h2, p) {
    color: #ffffff !important;
}

.page-shell > :not(.shipping-checklist):not(.certificate-page) :is(
    [class*="card"],
    [class*="panel"],
    [class*="box"],
    [class*="callout"],
    [class*="summary"],
    [class*="section"],
    [class*="tile"],
    [class*="item"],
    [class*="notice"],
    [class*="note"],
    [class*="form"],
    [class*="table"],
    [class*="wrap"]
) :is(h1, h2, h3, h4, h5, strong, label, th),
.page-shell > :is(
    [class*="card"],
    [class*="panel"],
    [class*="box"],
    [class*="callout"],
    [class*="summary"],
    [class*="section"],
    [class*="tile"],
    [class*="item"],
    [class*="notice"],
    [class*="note"],
    [class*="form"],
    [class*="table"],
    [class*="wrap"]
):not(.shipping-checklist):not(.certificate-page) :is(h1, h2, h3, h4, h5, strong, label, th) {
    color: var(--lh-white) !important;
}

.page-shell > :not(.shipping-checklist):not(.certificate-page) :is(
    [class*="card"],
    [class*="panel"],
    [class*="box"],
    [class*="callout"],
    [class*="summary"],
    [class*="section"],
    [class*="tile"],
    [class*="item"],
    [class*="notice"],
    [class*="note"],
    [class*="form"],
    [class*="table"],
    [class*="wrap"]
) :is(p, li, td, small, span),
.page-shell > :is(
    [class*="card"],
    [class*="panel"],
    [class*="box"],
    [class*="callout"],
    [class*="summary"],
    [class*="section"],
    [class*="tile"],
    [class*="item"],
    [class*="notice"],
    [class*="note"],
    [class*="form"],
    [class*="table"],
    [class*="wrap"]
):not(.shipping-checklist):not(.certificate-page) :is(p, li, td, small, span) {
    color: var(--lh-muted) !important;
}

.page-shell :is(
    .staff-tab-active,
    .staff_tab_active,
    .tab-pill.is-active,
    .is-active,
    .active
) {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.14), transparent 50%),
        linear-gradient(135deg, rgba(153, 0, 255, 0.9), rgba(217, 70, 239, 0.92)) !important;
    border-color: rgba(255, 216, 255, 0.76) !important;
    color: var(--lh-white) !important;
}

.page-shell :is(table, .sheet-table) {
    color: var(--lh-muted) !important;
}

.page-shell :is(thead, th) {
    color: var(--lh-soft) !important;
    border-color: rgba(255, 60, 255, 0.26) !important;
}

.page-shell :is(td, th) {
    border-color: rgba(255, 60, 255, 0.18) !important;
}

.page-shell :is(tbody tr:nth-child(even), .staff-table tbody tr:nth-child(even)) {
    background: rgba(255, 60, 255, 0.045) !important;
}

.home-tests .test-card-link {
    position: relative;
}

.page-shell .home-status-note,
.home-wrapper .home-status-note {
    color: #f4dcff !important;
    font-weight: 750 !important;
    text-shadow: 0 0 12px rgba(217, 70, 239, 0.7) !important;
}

.home-tests .test-card-link .lh-card-icon.lh-icon-badge {
    position: absolute;
    top: 0.62rem;
    right: 0.62rem;
    z-index: 2;
    display: grid !important;
    width: 46px;
    height: 46px;
    margin: 0;
    color: var(--lh-soft);
    background:
        radial-gradient(circle at 35% 25%, rgba(255, 255, 255, 0.16), transparent 36%),
        rgba(5, 0, 8, 0.78);
    border: 1px solid rgba(233, 213, 255, 0.52);
    box-shadow: 0 0 18px rgba(217, 70, 239, 0.42), inset 0 0 14px rgba(217, 70, 239, 0.1);
}

.page-shell :is(.step-icon-image, .inline-icon-image, .toenail-hero-image, .instructions-main-image, .toenail-amount-card img) {
    background:
        radial-gradient(circle at center, rgba(255, 60, 255, 0.1), rgba(5, 0, 8, 0.86)) !important;
    border-color: rgba(255, 60, 255, 0.28) !important;
    box-shadow: 0 0 18px rgba(255, 60, 255, 0.12) !important;
}

.home-tests .test-card-link h3,
.home-tests .test-card-link p,
.home-tests .test-card-link strong {
    margin-left: 0.78rem;
    margin-right: 0.78rem;
    text-align: center;
}

.home-tests .test-card-link h3 {
    margin-top: 0.72rem;
    margin-bottom: 0.32rem;
    font-size: 1rem;
    line-height: 1.15;
}

.home-tests .test-card-link p {
    flex: 0 1 auto;
    margin-top: 0;
    margin-bottom: 0.26rem;
    font-size: 0.86rem;
    line-height: 1.38;
}

.home-tests .test-card-link strong {
    align-self: center;
    margin-top: 0.18rem;
    margin-bottom: 0.62rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--lh-white) !important;
    font-size: 1.24rem;
    font-weight: 1000;
    line-height: 1;
    letter-spacing: 0.01em;
    text-shadow:
        0 0 10px rgba(255, 255, 255, 0.68),
        0 0 20px rgba(255, 60, 255, 0.9),
        0 0 30px rgba(217, 70, 239, 0.52);
    box-shadow: none;
}

@media (min-width: 900px) {
    .home-tests .lh-card-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 280px));
        justify-content: start;
    }
}

.home-wrapper .home-header-quote {
    position: relative;
    display: block !important;
    padding: 0 !important;
    margin: clamp(1.35rem, 3vw, 2.1rem) auto clamp(1.4rem, 3vw, 2rem) !important;
    overflow: hidden;
    border-radius: 8px;
    background: #050008 !important;
    border: 1px solid rgba(217, 70, 239, 0.42) !important;
    box-shadow: 0 0 30px rgba(217, 70, 239, 0.2), 0 18px 60px rgba(0, 0, 0, 0.5) !important;
}

.home-wrapper .home-header-quote::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(5, 0, 8, 0.14), transparent 42%, rgba(5, 0, 8, 0.36)),
        radial-gradient(circle at 86% 48%, rgba(217, 70, 239, 0.2), transparent 24%);
}

.home-wrapper .home-header-quote::after {
    content: "";
    position: absolute;
    right: 4%;
    bottom: 12%;
    z-index: 1;
    width: 180px;
    height: 42px;
    pointer-events: none;
    opacity: 0.5;
    background: linear-gradient(90deg, transparent, rgba(217, 70, 239, 0.72), transparent);
    filter: blur(14px);
}

.home-wrapper .home-quote-banner-image {
    display: block;
    width: 100%;
    height: auto;
    min-height: 112px;
    object-fit: cover;
    opacity: 1 !important;
    filter: saturate(1.22) contrast(1.12) brightness(0.82) !important;
}

.home-wrapper .home-header-quote .home-moon-actions {
    position: absolute;
    right: clamp(1rem, 3vw, 2rem);
    top: 50%;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.55rem;
    transform: translateY(-50%);
}

.home-wrapper .home-header-quote .home-moon-button {
    min-width: 154px;
    justify-content: center;
    white-space: nowrap;
}

.home-tests .test-card-link .lh-card-icon.lh-icon-badge {
    place-items: center !important;
    overflow: hidden;
}

.home-tests .test-card-link .lh-card-icon.lh-icon-badge .lh-svg-icon {
    width: 52% !important;
    height: 52% !important;
    margin: 0 !important;
    transform: none !important;
}

.home-process {
    position: relative;
    padding: clamp(1rem, 2.5vw, 1.45rem);
    border: 1px solid rgba(217, 70, 239, 0.28);
    border-radius: 8px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.008)),
        radial-gradient(circle at 8% 14%, rgba(217, 70, 239, 0.15), transparent 32%),
        radial-gradient(circle at 86% 18%, rgba(124, 58, 237, 0.15), transparent 30%),
        rgba(8, 0, 16, 0.9);
    box-shadow: 0 16px 54px rgba(0, 0, 0, 0.36), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.home-process .section-head {
    margin-bottom: 1rem;
}

.home-process-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.process-card {
    position: relative;
    min-height: 230px;
    padding: 1.05rem 1rem 1rem !important;
    overflow: hidden;
    border-color: rgba(192, 132, 252, 0.36) !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)),
        radial-gradient(circle at 18% 0%, rgba(217, 70, 239, 0.13), transparent 34%),
        rgba(10, 0, 18, 0.88) !important;
}

.process-card::after {
    content: "";
    position: absolute;
    inset: auto 1rem 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(217, 70, 239, 0.75), transparent);
    opacity: 0.62;
}

.process-step {
    position: absolute;
    top: 0.85rem;
    right: 0.9rem;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid rgba(217, 70, 239, 0.42);
    color: var(--lh-soft);
    font-weight: 950;
    background: rgba(5, 0, 8, 0.78);
    box-shadow: 0 0 18px rgba(217, 70, 239, 0.22);
}

.process-icon {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    margin-bottom: 1rem;
    border-radius: 50%;
    color: #f5d0fe;
    border: 1px solid rgba(233, 213, 255, 0.42);
    background: radial-gradient(circle at 35% 25%, rgba(255, 255, 255, 0.16), transparent 36%), rgba(5, 0, 8, 0.82);
    box-shadow: 0 0 24px rgba(217, 70, 239, 0.3), inset 0 0 14px rgba(217, 70, 239, 0.1);
}

.process-icon .lh-svg-icon {
    width: 54%;
    height: 54%;
}

.process-card h3 {
    margin-top: 0;
    color: var(--lh-white) !important;
}

.process-card p {
    color: var(--lh-soft) !important;
    line-height: 1.5;
}

@media (max-width: 860px) {
    .home-process-grid {
        grid-template-columns: 1fr;
    }

    .home-wrapper .home-header-quote .home-moon-actions {
        position: relative;
        right: auto;
        top: auto;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        padding: 0.8rem;
        transform: none;
        background: rgba(5, 0, 8, 0.88);
    }
}

.lh-section {
    margin-top: clamp(1.25rem, 3vw, 2rem);
}

.lh-card:hover,
.test-card:hover,
.choice-card:hover,
.action-card:hover,
.contact-card:hover {
    border-color: rgba(255, 60, 255, 0.72) !important;
    box-shadow: var(--lh-shadow), 0 0 30px rgba(255, 60, 255, 0.28) !important;
}

.lh-card-icon {
    display: inline-grid;
    place-items: center;
    width: 48px;
    height: 48px;
    margin-bottom: 0.65rem;
    border-radius: 999px;
    background: rgba(255, 60, 255, 0.08);
    border: 1px solid rgba(255, 60, 255, 0.32);
    color: var(--lh-neon);
    font-size: 1.45rem;
    box-shadow: 0 0 18px rgba(255, 60, 255, 0.24);
}

.lh-cta {
    margin-top: 1.5rem;
    padding: clamp(1rem, 3vw, 1.6rem);
    border-radius: var(--lh-radius);
    background:
        radial-gradient(circle at 8% 50%, rgba(255, 60, 255, 0.2), transparent 32%),
        linear-gradient(135deg, rgba(91, 33, 182, 0.3), rgba(18, 0, 31, 0.9));
    border: 1px solid rgba(255, 60, 255, 0.38);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.important-banner,
.sample-label-callout,
.savings-banner,
.sale-banner,
.callout-box,
.contact-message,
.form-errors,
.field-error,
.contact-form-errors {
    background: rgba(180, 83, 9, 0.16) !important;
    border: 1px solid rgba(251, 191, 36, 0.45) !important;
    color: #fde68a !important;
}

.form-errors,
.field-error,
.contact-form-errors,
.contact-message-error {
    background: rgba(190, 18, 60, 0.16) !important;
    border-color: rgba(244, 63, 94, 0.5) !important;
    color: #fecdd3 !important;
}

.row-male,
.row-female,
.row-other,
.row-blue-none,
.row-blue-hetero,
.row-blue-homo,
.row-rw-none,
.row-rw-hetero,
.row-rw-homo,
.row-dwarf-hetero,
.row-dwarf-false,
.row-dwarf-peanut {
    background: rgba(192, 132, 252, 0.08) !important;
}

.row-male td:first-child,
.row-female td:first-child,
.row-blue-homo td:first-child,
.row-dwarf-peanut td:first-child {
    border-left: 4px solid var(--lh-neon) !important;
}

@keyframes labFloat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-12px); }
}

@keyframes logoFloatPulse {
    0%, 100% {
        transform: translateY(0) scale(1);
        filter: drop-shadow(0 0 8px rgba(255, 60, 255, 0.9)) drop-shadow(0 0 22px rgba(124, 58, 237, 0.6));
    }
    45% {
        transform: translateY(-4px) scale(1.035);
        filter: drop-shadow(0 0 14px rgba(255, 60, 255, 1)) drop-shadow(0 0 34px rgba(124, 58, 237, 0.8));
    }
    60% {
        transform: translateY(-2px) scale(1.01);
    }
}

@keyframes labTwinkle {
    0%, 100% { opacity: 0.58; transform: scale(0.96); }
    50% { opacity: 1; transform: scale(1.06); }
}

@media (max-width: 900px) {
    .lh-hero,
    .tests-hero,
    .tests-grid,
    .tests-info-grid,
    .process-list,
    .guide-quick-grid,
    .sample-type-grid,
    .order-top-grid,
    .contact-grid,
    .choice-grid,
    .featured-grid {
        grid-template-columns: 1fr !important;
    }

    .lh-logo-orb {
        min-height: 270px;
    }

    .lh-logo-orb img {
        width: min(82vw, 330px);
    }

    .lh-hero-photo {
        background:
            linear-gradient(180deg, rgba(0, 0, 0, 0.94) 0%, rgba(5, 0, 8, 0.86) 48%, rgba(5, 0, 8, 0.24) 100%),
            var(--hero-image) center bottom / cover no-repeat !important;
    }

    .lh-hero-photo .lh-hero-visual {
        min-height: 260px;
    }
}

@media (max-width: 640px) {
    .site-header::after {
        display: none;
    }

    .hero-proof-row {
        grid-template-columns: 1fr;
        border-top: 1px solid rgba(255, 60, 255, 0.18);
    }

    .hero-proof-item {
        grid-template-columns: 52px minmax(0, 1fr);
        justify-items: start;
        text-align: left;
        border-right: 0;
        border-bottom: 1px solid rgba(233, 213, 255, 0.12);
    }

    .hero-proof-item:last-child {
        border-bottom: 0;
    }

    .hero-proof-icon {
        grid-row: span 2;
        margin-bottom: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
    }

    .brand-logo,
    .footer-logo {
        animation: none !important;
    }
}

/* Shared detail pages for individual DNA tests */
.card-large > .test-hero {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.36fr) !important;
    gap: clamp(1rem, 3vw, 2rem) !important;
    align-items: center !important;
    padding: clamp(1.1rem, 3.6vw, 2.5rem) !important;
    margin-bottom: 1.4rem !important;
    border: 1px solid rgba(255, 60, 255, 0.36) !important;
    border-radius: 14px !important;
    background:
        linear-gradient(105deg, rgba(0, 0, 0, 0.9), rgba(18, 0, 31, 0.76) 54%, rgba(5, 0, 8, 0.58)),
        url("/static/dna_portal/witch_lab_page_header.png") center center / cover no-repeat !important;
    box-shadow: 0 0 34px rgba(217, 70, 239, 0.2), inset 0 0 70px rgba(255, 60, 255, 0.08) !important;
    overflow: hidden !important;
}

.card-large > .test-hero .test-hero-text {
    flex: initial !important;
    min-width: 0 !important;
}

.page-shell .card-subtitle,
.page-shell .highlight-intro {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}

.card-large > .test-hero .page-title {
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: clamp(2.45rem, 6.6vw, 5.4rem) !important;
    line-height: 0.98 !important;
    text-align: left !important;
    margin-bottom: 1rem !important;
    text-shadow: 0 0 16px rgba(255, 255, 255, 0.34), 0 0 36px rgba(217, 70, 239, 0.38) !important;
}

.card-large > .test-hero .highlight-intro,
.card-large > .test-hero p {
    max-width: 760px !important;
    text-align: left !important;
    color: var(--lh-soft) !important;
    text-shadow: 0 0 12px rgba(0, 0, 0, 0.84) !important;
}

.card-large > .test-hero .highlight-intro {
    font-size: clamp(1rem, 1.8vw, 1.25rem) !important;
    font-weight: 900 !important;
    font-style: normal !important;
    color: var(--lh-white) !important;
}

.card-large > .test-hero .test-hero-image-wrap {
    flex: initial !important;
    width: 100% !important;
    max-width: 320px !important;
    justify-self: center !important;
}

.card-large > .test-hero .test-hero-image {
    width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
    border-radius: 12px !important;
    border: 1px solid rgba(255, 60, 255, 0.5) !important;
    background: #050008 !important;
    box-shadow: 0 0 28px rgba(255, 60, 255, 0.28), 0 22px 54px rgba(0, 0, 0, 0.55) !important;
    animation: none !important;
}

.card-large > .test-hero .price-row {
    justify-content: flex-start !important;
    gap: 1rem !important;
    margin-top: 1.35rem !important;
}

.page-shell .card-large > .test-hero .price-row .price-tag,
.page-shell .card-large > .test-hero .price-row .price-tag.sparkle-text,
.card-large > .test-hero .price-tag {
    color: #ffffff !important;
    font-size: clamp(1.35rem, 2.5vw, 1.85rem) !important;
    font-weight: 950 !important;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.48), 0 0 20px rgba(255, 60, 255, 0.86) !important;
}

.card-large > .test-hero .price-row .btn-primary,
.card-large > .test-hero .price-row a.btn-primary {
    border: 1px solid rgba(255, 216, 255, 0.9) !important;
    background: linear-gradient(135deg, #ff2be7 0%, #d000ff 52%, #ff5bf1 100%) !important;
    color: #ffffff !important;
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.18) inset,
        0 0 20px rgba(255, 43, 231, 0.62),
        0 10px 24px rgba(0, 0, 0, 0.35) !important;
    text-shadow: 0 1px 0 rgba(40, 0, 50, 0.4) !important;
}

.card-large > .test-hero .price-row .btn-primary:hover,
.card-large > .test-hero .price-row .btn-primary:focus-visible,
.card-large > .test-hero .price-row a.btn-primary:hover,
.card-large > .test-hero .price-row a.btn-primary:focus-visible {
    background: linear-gradient(135deg, #ff5bf1 0%, #e42dff 50%, #ff8cf6 100%) !important;
    color: #ffffff !important;
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.24) inset,
        0 0 28px rgba(255, 43, 231, 0.78),
        0 12px 28px rgba(0, 0, 0, 0.42) !important;
}

.card-large .section-divider {
    border: 0 !important;
    border-top: 1px solid rgba(255, 60, 255, 0.22) !important;
    box-shadow: 0 0 14px rgba(255, 60, 255, 0.24) !important;
    margin: 1.3rem 0 !important;
}

.card-large .test-section.section-box,
.card-large .section-box,
.card-large .related-tests-box {
    max-width: 980px !important;
    margin: 1rem auto !important;
    padding: clamp(1rem, 2.4vw, 1.55rem) !important;
    border-radius: 12px !important;
    border: 1px solid rgba(255, 60, 255, 0.36) !important;
    background:
        radial-gradient(circle at top left, rgba(255, 60, 255, 0.13), transparent 36%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.012)),
        rgba(7, 0, 13, 0.88) !important;
    box-shadow: 0 0 26px rgba(217, 70, 239, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
    color: var(--lh-white) !important;
}

.card-large .test-section h2,
.card-large .test-section h3,
.card-large .section-box h2,
.card-large .section-box h3 {
    color: var(--lh-white) !important;
    text-align: center !important;
    font-size: clamp(1.45rem, 3vw, 2.2rem) !important;
    text-shadow: 0 0 16px rgba(217, 70, 239, 0.42) !important;
}

.card-large .test-section h3::after {
    color: var(--lh-lavender) !important;
    text-shadow: 0 0 12px rgba(255, 60, 255, 0.8) !important;
}

.card-large .test-section p,
.card-large .test-section li,
.card-large .section-box p,
.card-large .section-box li,
.card-large .soft-note {
    color: var(--lh-muted) !important;
    font-size: 1rem !important;
}

.card-large .species-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important;
    gap: 0.7rem !important;
    max-width: 760px !important;
    margin: 0.8rem auto 1rem !important;
}

.card-large .species-grid ul {
    display: grid !important;
    gap: 0.5rem !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.card-large .species-grid li {
    padding: 0.62rem 0.78rem !important;
    border: 1px solid rgba(255, 60, 255, 0.24) !important;
    border-radius: 8px !important;
    background: rgba(255, 60, 255, 0.07) !important;
    color: var(--lh-soft) !important;
    font-weight: 800 !important;
}

.card-large .test-section a:not(.btn):not(.btn-primary):not(.btn-secondary),
.card-large .section-box a:not(.btn):not(.btn-primary):not(.btn-secondary) {
    color: var(--lh-soft) !important;
    font-weight: 900 !important;
    text-decoration: underline !important;
    text-underline-offset: 0.2em !important;
}

@media (max-width: 820px) {
    .card-large > .test-hero {
        grid-template-columns: 1fr !important;
    }

    .card-large > .test-hero .page-title,
    .card-large > .test-hero .highlight-intro,
    .card-large > .test-hero p {
        text-align: center !important;
    }

    .card-large > .test-hero .price-row {
        justify-content: center !important;
        flex-wrap: wrap !important;
    }
}

/* Public rebrand polish pass: tests, pricing, and how-it-works. */
.page-shell .card-large > .test-hero {
    position: relative !important;
    isolation: isolate !important;
    min-height: clamp(360px, 38vw, 520px) !important;
}

.page-shell .card-large > .test-hero::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    background:
        radial-gradient(circle at 12% 18%, rgba(217, 70, 239, 0.22), transparent 31%),
        radial-gradient(circle at 88% 12%, rgba(192, 132, 252, 0.16), transparent 28%),
        linear-gradient(180deg, rgba(5, 0, 8, 0.12), rgba(5, 0, 8, 0.7)) !important;
}

.page-shell .card-large > .test-hero::after {
    content: "Test. Trust. Protect." !important;
    position: absolute !important;
    left: clamp(1rem, 3vw, 2.35rem) !important;
    bottom: clamp(0.75rem, 1.8vw, 1.15rem) !important;
    color: rgba(233, 213, 255, 0.72) !important;
    font-size: 0.72rem !important;
    font-weight: 900 !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
}

.page-shell .card-large > .test-hero .card-subtitle {
    color: var(--lh-white) !important;
    font-style: normal !important;
    text-shadow: 0 0 14px rgba(217, 70, 239, 0.38) !important;
}

.page-shell .card-large > .test-hero .sparkle-text::after,
.page-shell .card-large > .test-hero .sparkle::after {
    content: "*" !important;
    color: var(--lh-soft) !important;
    text-shadow: 0 0 10px rgba(255, 60, 255, 0.9) !important;
}

.page-shell .card-large > .test-hero .sparkle-orbit {
    width: 126% !important;
    height: 126% !important;
    background:
        radial-gradient(circle at 34% 28%, rgba(255, 255, 255, 0.2), transparent 24%),
        radial-gradient(circle at 70% 76%, rgba(217, 70, 239, 0.24), transparent 32%) !important;
    filter: blur(7px) !important;
    opacity: 0.95 !important;
}

.page-shell .card-large > .test-hero .image-credit {
    color: var(--lh-muted) !important;
    -webkit-text-fill-color: var(--lh-muted) !important;
}

.page-shell .card-large .test-section.section-box,
.page-shell .card-large .section-box,
.page-shell .card-large .related-tests-box {
    position: relative !important;
    overflow: hidden !important;
}

.page-shell .card-large .test-section.section-box::before,
.page-shell .card-large .section-box::before,
.page-shell .card-large .related-tests-box::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
        linear-gradient(90deg, rgba(255, 60, 255, 0.18), transparent 22%, transparent 78%, rgba(124, 58, 237, 0.16)),
        radial-gradient(circle at 50% 0%, rgba(233, 213, 255, 0.09), transparent 32%) !important;
    opacity: 0.72 !important;
}

.page-shell .card-large .test-section.section-box > *,
.page-shell .card-large .section-box > *,
.page-shell .card-large .related-tests-box > * {
    position: relative !important;
    z-index: 1 !important;
}

.page-shell .card-large .info-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
    gap: 0.85rem !important;
}

.page-shell .card-large .info-grid .info-card,
.page-shell .card-large .faq-item {
    border-radius: 8px !important;
    border: 1px solid rgba(192, 132, 252, 0.32) !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.01)),
        rgba(10, 0, 18, 0.72) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

.page-shell .how-wrapper {
    max-width: 1180px !important;
    margin: 0 auto !important;
    background:
        linear-gradient(180deg, rgba(5, 0, 8, 0.88), rgba(10, 0, 18, 0.96)),
        url("/static/dna_portal/witch_lab_page_header.png") center top / cover no-repeat !important;
}

.page-shell .how-wrapper .how-hero {
    display: grid !important;
    gap: clamp(1rem, 2.4vw, 1.5rem) !important;
}

.page-shell .how-wrapper .how-hero-text {
    max-width: 860px !important;
}

.page-shell .how-wrapper .card-subtitle,
.page-shell .how-wrapper .process-intro p,
.page-shell .how-wrapper .process-card p {
    color: var(--lh-muted) !important;
}

.page-shell .how-wrapper .kit-note {
    display: inline-flex !important;
    justify-content: center !important;
    width: fit-content !important;
    padding: 0.7rem 1.1rem !important;
    border: 1px solid rgba(233, 213, 255, 0.44) !important;
    border-radius: 8px !important;
    background: rgba(5, 0, 8, 0.72) !important;
    color: var(--lh-white) !important;
    -webkit-text-fill-color: var(--lh-white) !important;
    box-shadow: 0 0 22px rgba(217, 70, 239, 0.24) !important;
}

.page-shell .how-wrapper .process-section {
    padding: clamp(1rem, 2.6vw, 1.5rem) !important;
    border-radius: 10px !important;
    border: 1px solid rgba(217, 70, 239, 0.3) !important;
    background:
        radial-gradient(circle at 10% 0%, rgba(217, 70, 239, 0.16), transparent 32%),
        radial-gradient(circle at 92% 10%, rgba(124, 58, 237, 0.14), transparent 32%),
        rgba(6, 0, 12, 0.86) !important;
}

.page-shell .how-wrapper .process-intro h2 {
    color: var(--lh-white) !important;
    text-shadow: 0 0 18px rgba(217, 70, 239, 0.32) !important;
}

.page-shell .how-wrapper .process-list {
    counter-reset: process !important;
}

.page-shell .how-wrapper .process-card {
    position: relative !important;
    min-height: 178px !important;
    padding: 1.05rem 1.05rem 1.05rem 4.6rem !important;
    border: 1px solid rgba(192, 132, 252, 0.34) !important;
    border-radius: 8px !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.052), rgba(255, 255, 255, 0.012)),
        rgba(10, 0, 18, 0.86) !important;
    box-shadow: 0 16px 42px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

.page-shell .how-wrapper .step-number {
    position: absolute !important;
    left: 1rem !important;
    top: 1rem !important;
    width: 46px !important;
    height: 46px !important;
    border: 1px solid rgba(233, 213, 255, 0.72) !important;
    background:
        radial-gradient(circle at 35% 25%, rgba(255, 255, 255, 0.22), transparent 28%),
        linear-gradient(135deg, #5b21b6, #d946ef) !important;
    color: #ffffff !important;
    box-shadow: 0 0 20px rgba(217, 70, 239, 0.48) !important;
}

.page-shell .how-wrapper .process-card h3 {
    color: var(--lh-white) !important;
    text-shadow: 0 0 12px rgba(217, 70, 239, 0.28) !important;
}

.page-shell .tests-overview-shell .test-card {
    min-height: 318px !important;
}

.page-shell .tests-overview-shell .test-card::before {
    min-height: 152px !important;
}

.page-shell .tests-overview-shell .test-price {
    white-space: nowrap !important;
}

@media (max-width: 820px) {
    .page-shell .card-large > .test-hero {
        min-height: auto !important;
        padding-bottom: 2.7rem !important;
    }

    .page-shell .card-large > .test-hero::after {
        left: 50% !important;
        transform: translateX(-50%) !important;
        width: max-content !important;
        max-width: calc(100% - 2rem) !important;
        text-align: center !important;
    }

    .page-shell .card-large > .test-hero .test-hero-image-wrap {
        max-width: min(320px, 100%) !important;
        order: -1 !important;
    }

    .page-shell .how-wrapper .process-card {
        min-height: auto !important;
    }
}

@media (max-width: 560px) {
    .page-shell .card-large > .test-hero .price-row,
    .page-shell .how-wrapper .instruction-buttons {
        display: grid !important;
        grid-template-columns: 1fr !important;
        justify-items: stretch !important;
    }

    .page-shell .card-large > .test-hero .price-tag {
        text-align: center !important;
    }

    .page-shell .how-wrapper .process-card {
        padding: 4.35rem 0.9rem 1rem !important;
    }

    .page-shell .how-wrapper .step-number {
        left: 50% !important;
        transform: translateX(-50%) !important;
    }
}

:where(
    button,
    input[type="button"],
    input[type="submit"],
    input[type="reset"],
    a[class*="btn"],
    a[class*="button"],
    a[class*="pill"],
    .btn,
    .btn-primary,
    .btn-secondary,
    .social-btn,
    .instruction-pill,
    .instruction-btn,
    .view-pill,
    .test-pill,
    .create-pill,
    .order-checklist-btn,
    .pill-outline,
    .link-button,
    .shop-view-pill
):not([disabled]):not(.is-disabled):hover,
:where(
    button,
    input[type="button"],
    input[type="submit"],
    input[type="reset"],
    a[class*="btn"],
    a[class*="button"],
    a[class*="pill"],
    .btn,
    .btn-primary,
    .btn-secondary,
    .social-btn,
    .instruction-pill,
    .instruction-btn,
    .view-pill,
    .test-pill,
    .create-pill,
    .order-checklist-btn,
    .pill-outline,
    .link-button,
    .shop-view-pill
):not([disabled]):not(.is-disabled):focus-visible {
    transform: translateY(-2px) !important;
    border-color: rgba(255, 255, 255, 0.82) !important;
    filter: brightness(1.13) saturate(1.12) !important;
    box-shadow:
        0 0 16px rgba(255, 255, 255, 0.46),
        0 0 34px rgba(255, 60, 255, 0.86),
        0 0 64px rgba(124, 58, 237, 0.58),
        inset 0 0 18px rgba(255, 255, 255, 0.14) !important;
    outline: none !important;
}

/* Keep the printable shipping checklist as black ink on white paper. */
.page-shell .shipping-checklist,
.page-shell .shipping-checklist :is(p, span, strong, label, th, td, h1, h2, h3, button) {
    color: #000 !important;
    -webkit-text-fill-color: #000 !important;
    text-shadow: none !important;
}

.page-shell .shipping-checklist .header-note p,
.page-shell .shipping-checklist .section-copy,
.page-shell .shipping-checklist .checklist-footer span {
    color: #000 !important;
    -webkit-text-fill-color: #000 !important;
}

.page-shell .shipping-checklist .header-note,
.page-shell .shipping-checklist .print-table th {
    background: #efefef !important;
    border-color: #000 !important;
    box-shadow: none !important;
}

.page-shell .shipping-checklist .order-summary div,
.page-shell .shipping-checklist .rule-grid label,
.page-shell .shipping-checklist .table-shell,
.page-shell .shipping-checklist .print-table td,
.page-shell .shipping-checklist .worksheet-label,
.page-shell .shipping-checklist .box,
.page-shell .shipping-checklist .print-button {
    background: #fff !important;
    border-color: #000 !important;
    box-shadow: none !important;
}

@media print {
    .page-shell,
    .page-shell .certificate-page,
    .page-shell .certificate-wrapper,
    .page-shell .certificate-section,
    .page-shell .certificate-result-section {
        background: #fff !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    .page-shell .certificate-wrapper :is(p, span, strong, label, th, td, h1, h2, h3, dt, dd) {
        color: #000 !important;
        -webkit-text-fill-color: #000 !important;
        text-shadow: none !important;
    }
}

@media screen {
    .page-shell :where(
        [class*="card"],
        [class*="panel"],
        [class*="box"],
        [class*="shell"],
        [class*="tile"],
        [class*="summary"],
        [class*="notice"],
        [class*="callout"],
        [class*="section"],
        [class*="step"],
        [class*="item"],
        [class*="table"],
        [class*="form"],
        [class*="field"],
        [class*="choice"],
        [class*="order"],
        [class*="sample"],
        [class*="dashboard"],
        [class*="waitlist"],
        [class*="staff"]
    ):not(.certificate-page):not(.certificate-page *) {
        background:
            linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)),
            radial-gradient(circle at top left, rgba(255, 60, 255, 0.11), transparent 36%),
            rgba(9, 0, 16, 0.9) !important;
        border-color: rgba(255, 60, 255, 0.34) !important;
        color: var(--lh-white) !important;
        box-shadow: 0 18px 54px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
        text-shadow: none !important;
    }

    .page-shell :where(
        [style*="background:#fff"],
        [style*="background: #fff"],
        [style*="background:#ffffff"],
        [style*="background: #ffffff"],
        [style*="background:#f"],
        [style*="background: #f"],
        [style*="background-color:#fff"],
        [style*="background-color: #fff"],
        [style*="background-color:#f"],
        [style*="background-color: #f"]
    ):not(.certificate-page):not(.certificate-page *) {
        background:
            linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)),
            rgba(9, 0, 16, 0.92) !important;
        border-color: rgba(255, 60, 255, 0.34) !important;
        color: var(--lh-white) !important;
        -webkit-text-fill-color: var(--lh-white) !important;
    }

    .page-shell :where(
        table,
        thead,
        tbody,
        tr,
        th,
        td,
        ul,
        ol,
        li,
        form,
        fieldset,
        details,
        summary
    ):not(.certificate-page):not(.certificate-page *) {
        background-color: transparent !important;
        border-color: rgba(217, 70, 239, 0.24) !important;
    }

    .page-shell :where(p, li, dd, small, span, div, blockquote):not(.certificate-page):not(.certificate-page *) {
        color: var(--lh-muted) !important;
        -webkit-text-fill-color: currentColor !important;
    }

    .page-shell :where(h1, h2, h3, h4, h5, h6, strong, label, th, legend, dt):not(.certificate-page):not(.certificate-page *),
    .page-shell :where(a:not(.btn):not(.btn-primary):not(.btn-secondary):not([class*="button"]):not([class*="pill"])):not(.certificate-page):not(.certificate-page *) {
        color: var(--lh-soft) !important;
        -webkit-text-fill-color: currentColor !important;
    }

    .page-shell :where(h1, h2, h3, h4, h5, h6, .page-title, .hero-title):not(.certificate-page):not(.certificate-page *) {
        color: var(--lh-white) !important;
    }

    .page-shell :where(input, select, textarea, option) {
        background: rgba(5, 0, 8, 0.86) !important;
        border-color: rgba(192, 132, 252, 0.5) !important;
        color: var(--lh-white) !important;
        -webkit-text-fill-color: var(--lh-white) !important;
    }

    .page-shell :where(.btn, .btn-primary, button[type="submit"]:not(.logout-button), [class*="button"].primary):not(.certificate-page):not(.certificate-page *) {
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.18), transparent 44%),
            linear-gradient(135deg, #9900ff 0%, #c516f4 48%, #e735ff 100%) !important;
        border-color: rgba(255, 216, 255, 0.72) !important;
        color: var(--lh-white) !important;
        -webkit-text-fill-color: var(--lh-white) !important;
    }

    .page-shell :where(.btn-secondary, .btn-ghost, [class*="pill"], [class*="button"]:not(.primary), [class*="link"]):not(.certificate-page):not(.certificate-page *) {
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.055), transparent 55%),
            rgba(2, 0, 5, 0.72) !important;
        border-color: rgba(233, 213, 255, 0.5) !important;
        color: var(--lh-soft) !important;
        -webkit-text-fill-color: var(--lh-soft) !important;
    }

    .page-shell :where(.shipping-checklist) {
        background:
            linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)),
            radial-gradient(circle at top left, rgba(255, 60, 255, 0.11), transparent 36%),
            rgba(9, 0, 16, 0.94) !important;
        color: var(--lh-white) !important;
    }

    .page-shell .status-pending_acceptance { background: #5b21b6 !important; color: #fff !important; -webkit-text-fill-color: #fff !important; }
    .page-shell .status-accepted_provide_details,
    .page-shell .status-accepted { background: #b45309 !important; border-color: #f59e0b !important; color: #fff7ed !important; -webkit-text-fill-color: #fff7ed !important; box-shadow: 0 0 18px rgba(245, 158, 11, 0.28) !important; }
    .page-shell .status-awaiting_mail,
    .page-shell .status-awaiting { background: #c2410c !important; border-color: #fb923c !important; color: #ffedd5 !important; -webkit-text-fill-color: #ffedd5 !important; box-shadow: 0 0 18px rgba(251, 146, 60, 0.28) !important; }
    .page-shell .status-samples_received,
    .page-shell .status-received {
        background: #1d4ed8 !important;
        border-color: #60a5fa !important;
        color: #eff6ff !important;
        -webkit-text-fill-color: #eff6ff !important;
        box-shadow: 0 0 18px rgba(96, 165, 250, 0.28) !important;
    }
    .page-shell .status-in_progress,
    .page-shell .status-progress,
    .page-shell .status-rerun_in_progress { background: #0f766e !important; border-color: #2dd4bf !important; color: #ecfeff !important; -webkit-text-fill-color: #ecfeff !important; box-shadow: 0 0 18px rgba(45, 212, 191, 0.28) !important; }
    .page-shell .status-completed { background: #047857 !important; border-color: #34d399 !important; color: #ecfdf5 !important; -webkit-text-fill-color: #ecfdf5 !important; box-shadow: 0 0 18px rgba(52, 211, 153, 0.28) !important; }
    .page-shell .status-needs_attention { background: #be123c !important; border-color: #fb7185 !important; color: #fff1f2 !important; -webkit-text-fill-color: #fff1f2 !important; box-shadow: 0 0 18px rgba(251, 113, 133, 0.28) !important; }
    .page-shell .status-cancelled { background: #7f1d1d !important; border-color: #f87171 !important; color: #fff1f2 !important; -webkit-text-fill-color: #fff1f2 !important; box-shadow: 0 0 18px rgba(248, 113, 113, 0.28) !important; }
}

/* True final homepage polish overrides. */
.page-shell .home-wrapper .home-header-quote.home-moon-cta {
    position: relative !important;
    display: block !important;
    padding: 0 !important;
    margin: clamp(1.35rem, 3vw, 2.1rem) auto clamp(1.4rem, 3vw, 2rem) !important;
    overflow: hidden !important;
    border-radius: 8px !important;
    background: #050008 !important;
    border: 1px solid rgba(217, 70, 239, 0.42) !important;
    box-shadow: 0 0 30px rgba(217, 70, 239, 0.2), 0 18px 60px rgba(0, 0, 0, 0.5) !important;
}

.page-shell .home-wrapper .home-header-quote.home-moon-cta .home-quote-banner-image {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 112px !important;
    object-fit: cover !important;
    opacity: 1 !important;
    filter: saturate(1.22) contrast(1.12) brightness(0.82) !important;
}

.page-shell .home-wrapper .home-header-quote.home-moon-cta .home-moon-actions {
    position: absolute !important;
    right: clamp(1rem, 3vw, 2rem) !important;
    top: 50% !important;
    z-index: 4 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0.55rem !important;
    width: auto !important;
    transform: translateY(-50%) !important;
}

.page-shell .home-wrapper .home-header-quote.home-moon-cta .home-moon-button {
    min-width: 154px !important;
    justify-content: center !important;
    white-space: nowrap !important;
}

.page-shell .home-wrapper .home-tests .test-card-link .lh-card-icon.lh-icon-badge {
    display: grid !important;
    place-items: center !important;
    width: 46px !important;
    height: 46px !important;
    padding: 0 !important;
    overflow: hidden !important;
}

.page-shell .home-wrapper .home-tests .test-card-link .lh-card-icon.lh-icon-badge .lh-svg-icon {
    display: block !important;
    width: 24px !important;
    height: 24px !important;
    max-width: 24px !important;
    max-height: 24px !important;
    margin: 0 !important;
    transform: none !important;
}

.page-shell .home-wrapper .home-process.lh-section {
    position: relative !important;
    padding: clamp(1rem, 2.5vw, 1.45rem) !important;
    border: 1px solid rgba(217, 70, 239, 0.32) !important;
    border-radius: 8px !important;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.008)), radial-gradient(circle at 8% 14%, rgba(217, 70, 239, 0.15), transparent 32%), radial-gradient(circle at 86% 18%, rgba(124, 58, 237, 0.15), transparent 30%), rgba(8, 0, 16, 0.9) !important;
    box-shadow: 0 16px 54px rgba(0, 0, 0, 0.36), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

.page-shell .home-wrapper .home-process-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.85rem !important;
}

.page-shell .home-wrapper .process-card.lh-card {
    position: relative !important;
    min-height: 230px !important;
    padding: 1.05rem 1rem 1rem !important;
    border-color: rgba(192, 132, 252, 0.36) !important;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)), radial-gradient(circle at 18% 0%, rgba(217, 70, 239, 0.13), transparent 34%), rgba(10, 0, 18, 0.88) !important;
}

.page-shell .home-wrapper .process-card .process-step {
    position: absolute !important;
    top: 0.85rem !important;
    right: 0.9rem !important;
}

.page-shell .home-wrapper .process-icon {
    display: grid !important;
    place-items: center !important;
    width: 56px !important;
    height: 56px !important;
}

.page-shell .home-wrapper .process-icon .lh-svg-icon {
    width: 30px !important;
    height: 30px !important;
}

@media (max-width: 860px) {
    .page-shell .home-wrapper .home-process-grid {
        grid-template-columns: 1fr !important;
    }

    .page-shell .home-wrapper .home-header-quote.home-moon-cta .home-moon-actions {
        position: relative !important;
        right: auto !important;
        top: auto !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        padding: 0.8rem !important;
        transform: none !important;
        background: rgba(5, 0, 8, 0.88) !important;
    }
}

/* Absolute final tone: sleek black neon lab, with clean pink edge light. */
body {
    background:
        radial-gradient(circle at 12% 4%, rgba(255, 60, 255, 0.16), transparent 24%),
        radial-gradient(circle at 88% 7%, rgba(124, 58, 237, 0.18), transparent 30%),
        radial-gradient(ellipse at 50% 112%, rgba(255, 60, 255, 0.14), transparent 44%),
        linear-gradient(180deg, #050008 0%, #090011 54%, #030005 100%) !important;
}

body::before {
    opacity: 0.34 !important;
}

@media screen {
    .content-card.page-shell:not(.shipping-checklist):not(.certificate-page),
    .page-shell:not(.shipping-checklist):not(.certificate-page) {
        background:
            radial-gradient(circle at 14% 0%, rgba(255, 60, 255, 0.12), transparent 30%),
            radial-gradient(circle at 86% 2%, rgba(124, 58, 237, 0.13), transparent 36%),
            linear-gradient(180deg, rgba(8, 0, 16, 0.92), rgba(4, 0, 8, 0.97)) !important;
        border-color: rgba(255, 60, 255, 0.3) !important;
        box-shadow:
            0 24px 80px rgba(0, 0, 0, 0.58),
            0 0 34px rgba(255, 60, 255, 0.12),
            inset 0 1px 0 rgba(255, 255, 255, 0.055) !important;
    }

    .content-card.page-shell:not(.shipping-checklist):not(.certificate-page)::before {
        background:
            radial-gradient(circle at 16% 0%, rgba(255, 60, 255, 0.14), transparent 30%),
            radial-gradient(circle at 82% 5%, rgba(199, 125, 255, 0.1), transparent 36%),
            linear-gradient(180deg, rgba(5, 0, 8, 0.26), rgba(5, 0, 8, 0.74) 52%, rgba(5, 0, 8, 0.92)) !important;
    }

    .page-shell :where(
        [class*="card"],
        [class*="panel"],
        [class*="box"],
        [class*="shell"],
        [class*="tile"],
        [class*="summary"],
        [class*="notice"],
        [class*="callout"],
        [class*="section"],
        [class*="step"],
        [class*="item"],
        [class*="table"],
        [class*="form"],
        [class*="field"],
        [class*="choice"],
        [class*="order"],
        [class*="sample"],
        [class*="dashboard"],
        [class*="waitlist"],
        [class*="staff"]
    ):not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *) {
        background:
            linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.01)),
            radial-gradient(circle at 12% 0%, rgba(255, 60, 255, 0.12), transparent 34%),
            linear-gradient(180deg, rgba(12, 0, 22, 0.9), rgba(5, 0, 10, 0.96)) !important;
        border-color: rgba(255, 60, 255, 0.32) !important;
        box-shadow:
            0 18px 54px rgba(0, 0, 0, 0.48),
            0 0 22px rgba(255, 60, 255, 0.1),
            inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
    }

    .page-shell :where(.lh-card, .test-card, .price-card, .info-card, .process-card, .dashboard-card, .account-card, .order-card):not(.shipping-checklist):not(.shipping-checklist *):not(.certificate-page):not(.certificate-page *) {
        background:
            linear-gradient(145deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.012)),
            radial-gradient(circle at 18% 0%, rgba(255, 60, 255, 0.13), transparent 36%),
            rgba(7, 0, 14, 0.94) !important;
        border-color: rgba(255, 60, 255, 0.34) !important;
    }
}
@media screen {
    .page-shell.page-shell .order-wrapper.order-wrapper .samples-table.samples-table .order-result-pill.order-result-pill {
        background:
            linear-gradient(135deg, rgba(255, 255, 255, 0.22), var(--result-bg, rgba(148, 163, 184, 0.2)) 48%, rgba(8, 0, 16, 0.46)),
            rgba(8, 0, 16, 0.68) !important;
        border-color: var(--result-border, rgba(226, 232, 240, 0.72)) !important;
        box-shadow:
            0 0 0 1px rgba(255, 255, 255, 0.1),
            0 0 16px var(--result-glow, rgba(226, 232, 240, 0.28)),
            0 0 28px rgba(255, 255, 255, 0.08),
            inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
    }
}

@media screen {
    .page-shell.page-shell .certificate-page.certificate-page .certificate-social-card .certificate-social-kicker.certificate-social-kicker {
        display: block !important;
        width: auto !important;
        padding: 0 !important;
        background: transparent !important;
        background-image: none !important;
        color: #2c173d !important;
        -webkit-text-fill-color: #2c173d !important;
        text-shadow: none !important;
    }
}

/* Compact homepage process cards: keep each icon tied to its step content. */
@media screen {
    .page-main .page-shell.page-shell .home-wrapper.home-wrapper .home-process.home-process .process-card.process-card {
        display: grid !important;
        grid-template-columns: 44px minmax(0, 1fr) !important;
        grid-template-rows: auto auto !important;
        column-gap: 0.7rem !important;
        row-gap: 0.45rem !important;
        align-items: center !important;
        min-height: 0 !important;
        padding: 0.8rem 0.85rem !important;
    }

    .page-main .page-shell.page-shell .home-wrapper.home-wrapper .home-process.home-process .process-card .process-icon {
        grid-column: 1 !important;
        grid-row: 1 !important;
        width: 44px !important;
        height: 44px !important;
        margin: 0 !important;
        color: #ffffff !important;
        font-size: 1.15rem !important;
        font-weight: 950 !important;
        line-height: 1 !important;
    }

    .page-main .page-shell.page-shell .home-wrapper.home-wrapper .home-process.home-process .process-card .process-icon .lh-svg-icon {
        width: 23px !important;
        height: 23px !important;
    }

    .page-main .page-shell.page-shell .home-wrapper.home-wrapper .home-process.home-process .process-card h3 {
        grid-column: 2 !important;
        grid-row: 1 !important;
        width: auto !important;
        margin: 0 !important;
        text-align: center !important;
        line-height: 1.18 !important;
    }

    .page-main .page-shell.page-shell .home-wrapper.home-wrapper .home-process.home-process .process-card p {
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        margin: 0 !important;
        line-height: 1.42 !important;
        text-align: center !important;
    }
}

/* Center the homepage signature-flock and rabbitry feature cards. */
@media screen {
    .page-main .page-shell.page-shell .home-wrapper.home-wrapper .featured-grid.featured-grid > .lh-card.lh-card,
    .page-main .page-shell.page-shell .home-wrapper.home-wrapper .featured-grid.featured-grid .rabbitry-program.rabbitry-program {
        text-align: center !important;
    }

    .page-main .page-shell.page-shell .home-wrapper.home-wrapper .featured-grid.featured-grid > .lh-card.lh-card .section-kicker {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .page-main .page-shell.page-shell .home-wrapper.home-wrapper .featured-grid.featured-grid > .lh-card.lh-card .feature-kicker.feature-kicker {
        font-size: clamp(1.05rem, 1.8vw, 1.25rem) !important;
        line-height: 1.15 !important;
        letter-spacing: 0.12em !important;
        margin-bottom: 0.65rem !important;
        color: #ff78f6 !important;
        -webkit-text-fill-color: #ff78f6 !important;
        font-weight: 950 !important;
        text-shadow:
            0 0 8px rgba(255, 120, 246, 0.72),
            0 0 18px rgba(217, 70, 239, 0.42) !important;
    }

    .page-main .page-shell.page-shell .home-wrapper.home-wrapper .featured-grid.featured-grid > .lh-card.lh-card {
        padding: 0.95rem 1rem !important;
    }

    .page-main .page-shell.page-shell .home-wrapper.home-wrapper .featured-grid.featured-grid > .lh-card.lh-card > h2:not(.feature-kicker) {
        margin: 0 0 0.45rem !important;
    }

    .page-main .page-shell.page-shell .home-wrapper.home-wrapper .featured-grid.featured-grid > .lh-card.lh-card > p {
        margin: 0 0 0.65rem !important;
    }

    .page-main .page-shell.page-shell .home-wrapper.home-wrapper .featured-grid.featured-grid .rabbitry-program.rabbitry-program {
        padding: 0.7rem 0 !important;
    }

    .page-main .page-shell.page-shell .home-wrapper.home-wrapper .featured-grid.featured-grid .rabbitry-program.rabbitry-program h3 {
        margin: 0 0 0.25rem !important;
    }

    .page-main .page-shell.page-shell .home-wrapper.home-wrapper .featured-grid.featured-grid .rabbitry-program.rabbitry-program p {
        margin: 0 0 0.55rem !important;
    }

    .page-main .page-shell.page-shell .home-wrapper.home-wrapper .featured-grid.featured-grid > .lh-card.lh-card .lh-actions {
        justify-content: center !important;
    }
}

/* Remove nested framing around the homepage test heading and card grid. */
@media screen {
    .page-main.page-main.page-main .page-shell.page-shell.page-shell .home-wrapper.home-wrapper.home-wrapper.home-wrapper .home-tests.home-tests.home-tests.home-tests .section-head.section-head.section-head.section-head,
    .page-main.page-main.page-main .page-shell.page-shell.page-shell .home-wrapper.home-wrapper.home-wrapper.home-wrapper .home-tests.home-tests.home-tests.home-tests .lh-card-grid.lh-card-grid.lh-card-grid.lh-card-grid {
        background: transparent !important;
        background-color: transparent !important;
        background-image: none !important;
        border: 0 !important;
        box-shadow: none !important;
        outline: 0 !important;
        backdrop-filter: none !important;
    }

    .page-main.page-main.page-main .page-shell.page-shell.page-shell .home-wrapper.home-wrapper.home-wrapper.home-wrapper .home-tests.home-tests.home-tests.home-tests .section-head.section-head::before,
    .page-main.page-main.page-main .page-shell.page-shell.page-shell .home-wrapper.home-wrapper.home-wrapper.home-wrapper .home-tests.home-tests.home-tests.home-tests .section-head.section-head::after,
    .page-main.page-main.page-main .page-shell.page-shell.page-shell .home-wrapper.home-wrapper.home-wrapper.home-wrapper .home-tests.home-tests.home-tests.home-tests .lh-card-grid.lh-card-grid::before,
    .page-main.page-main.page-main .page-shell.page-shell.page-shell .home-wrapper.home-wrapper.home-wrapper.home-wrapper .home-tests.home-tests.home-tests.home-tests .lh-card-grid.lh-card-grid::after {
        display: none !important;
        content: none !important;
    }
}

/* Wide desktop sizing: use the available browser width and keep navigation readable. */
@media (min-width: 1181px) {
    .content-card.page-shell {
        width: 100% !important;
        max-width: 1680px !important;
    }

    .page-shell .staff-labbench {
        width: 100% !important;
        max-width: none !important;
    }

    .main-nav a,
    .logout-button {
        min-height: 40px !important;
        padding: 0.45rem 0.7rem !important;
        font-size: 1rem !important;
        line-height: 1.25 !important;
    }

    .site-header {
        padding-left: clamp(1.25rem, 2vw, 2.5rem) !important;
        padding-right: clamp(1.25rem, 2vw, 2.5rem) !important;
    }

    .page-shell .full-image-hero {
        max-width: 1600px;
    }
}

/* Pricing category headings should sit directly on their section surface. */
@media screen {
    .page-main.page-main.page-main .page-shell.page-shell.page-shell .tests-overview-shell.tests-overview-shell.tests-overview-shell.tests-overview-shell .test-section-block.test-section-block.test-section-block.test-section-block .section-head.section-head.section-head.section-head {
        background: transparent !important;
        background-color: transparent !important;
        background-image: none !important;
        border: 0 !important;
        box-shadow: none !important;
        outline: 0 !important;
        backdrop-filter: none !important;
    }

    .page-main.page-main.page-main .page-shell.page-shell.page-shell .tests-overview-shell.tests-overview-shell.tests-overview-shell.tests-overview-shell .test-section-block.test-section-block.test-section-block.test-section-block .section-head.section-head::before,
    .page-main.page-main.page-main .page-shell.page-shell.page-shell .tests-overview-shell.tests-overview-shell.tests-overview-shell.tests-overview-shell .test-section-block.test-section-block.test-section-block.test-section-block .section-head.section-head::after {
        display: none !important;
        content: none !important;
    }
}

/* Center the two primary homepage section headings as complete title groups. */
@media screen {
    .page-main.page-main.page-main .page-shell.page-shell.page-shell .home-wrapper.home-wrapper.home-wrapper.home-wrapper .home-tests.home-tests.home-tests.home-tests .section-head.section-head.section-head.section-head,
    .page-main.page-main.page-main .page-shell.page-shell.page-shell .home-wrapper.home-wrapper.home-wrapper.home-wrapper .home-process.home-process.home-process.home-process .section-head.section-head.section-head.section-head {
        text-align: center !important;
    }

    .page-main.page-main.page-main .page-shell.page-shell.page-shell .home-wrapper.home-wrapper.home-wrapper.home-wrapper .home-process.home-process.home-process.home-process .section-head.section-head.section-head.section-head {
        width: 100% !important;
        max-width: none !important;
        margin: 0 auto 1.1rem !important;
    }

    .page-main.page-main.page-main .page-shell.page-shell.page-shell .home-wrapper.home-wrapper.home-wrapper.home-wrapper .home-tests.home-tests.home-tests.home-tests .section-head.section-head .section-kicker.section-kicker,
    .page-main.page-main.page-main .page-shell.page-shell.page-shell .home-wrapper.home-wrapper.home-wrapper.home-wrapper .home-process.home-process.home-process.home-process .section-head.section-head .section-kicker.section-kicker {
        width: fit-content !important;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
    }

    .page-main.page-main.page-main .page-shell.page-shell.page-shell .home-wrapper.home-wrapper.home-wrapper.home-wrapper .home-tests.home-tests.home-tests.home-tests .section-head.section-head > h2,
    .page-main.page-main.page-main .page-shell.page-shell.page-shell .home-wrapper.home-wrapper.home-wrapper.home-wrapper .home-process.home-process.home-process.home-process .section-head.section-head > h2 {
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
    }
}