/* Base theme: header, footer, nav, background, variables. Centralized for site-wide consistency. */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --gold: #C9A050;
    --gold-soft: #D8B86A;
    --gold-deep: #B8923E;
    --rich-gold: #C9A961;
    --gold-glow: rgba(201,169,97,0.6);
    --neon-blue: #6F87FF;
    --neon-purple: #9A64FF;
    /* Support tools / digital accents: slightly brighter than cooled mega-menu ion. */
    --neon-glow: rgba(130,112,255,0.44);
    --steel: #3C434D;
    --steel-soft: #5A6370;
    --steel-deep: #2A3038;
    --steel-glow: rgba(60,67,77,0.45);
    --ink: #080808;
    --glass: rgba(10,10,10,0.62);
    --line: rgba(255,255,255,0.08);
    --soft-white: rgba(255,255,255,0.88);
    --chat-size: 58px;
    --chat-panel-width: 320px;
    --chat-panel-thread-width: 520px;
    --abc-radius-pill: 999px;
    --abc-radius-control-tight: 10px;
    --abc-radius-control: 12px;
    --abc-radius-card: 14px;
    --abc-radius-panel: 22px;
    --abc-radius-large: 28px;
    --chat-radius: 16px;
    --ux-radius-md: var(--abc-radius-control);
    --ux-radius-lg: var(--abc-radius-panel);
    --ux-step-row-height: 96px;
    --ux-summary-row-height: 56px;
    --ux-section-gap: 20px;
    --ux-cta-primary-height: 50px;
    --ux-cta-secondary-height: 46px;
    --ux-panel-bg: rgba(8,10,15,0.84);
}

/* Scroll-root: forces classic scrollbar (viewport overlay scrollbars ignore custom styling). Body overflow hidden so scroll-root is the scroll container. */
.scroll-root {
    position: fixed;
    top: 92px;
    bottom: 60px;
    left: 0;
    right: 0;
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 1;
}

body.has-scroll-root {
    overflow: hidden;
}

/* Scrollbar - dark theme, gold gradient + glow. Do NOT set scrollbar-width - Chrome 121+ overrides -webkit-scrollbar when it's set. */
@supports not selector(::-webkit-scrollbar) {
    html, body, .scroll-root {
        scrollbar-width: thin;
        scrollbar-color: #161616 #080808;
    }
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
.scroll-root::-webkit-scrollbar {
    width: 10px;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
.scroll-root::-webkit-scrollbar-track {
    background: #080808;
    border-radius: 0;
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
.scroll-root::-webkit-scrollbar-thumb {
    background: #161616;
    border-radius: 5px;
}

html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover,
.scroll-root::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #E8D090 0%, #C9A050 50%, #A87A30 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.2),
        0 0 16px rgba(201, 160, 80, 0.6),
        0 0 36px rgba(201, 160, 80, 0.3);
    animation: scrollbar-glow 2s ease-in-out infinite;
}

@keyframes scrollbar-glow {
    0%, 100% {
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.2),
            0 0 12px rgba(201, 160, 80, 0.45),
            0 0 28px rgba(201, 160, 80, 0.2);
    }
    50% {
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.25),
            0 0 22px rgba(201, 160, 80, 0.7),
            0 0 48px rgba(201, 160, 80, 0.4);
    }
}

body {
    font-family: 'Inter', 'Roboto', sans-serif;
    background: #070707;
    color: #fff;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

.ambient {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background:
        radial-gradient(1200px circle at 18% 12%, rgba(201,160,80,0.12), transparent 55%),
        radial-gradient(900px circle at 82% 20%, rgba(90,130,255,0.10), transparent 55%),
        radial-gradient(700px circle at 50% 85%, rgba(255,255,255,0.05), transparent 60%);
    opacity: 0.7;
}

/* Header */
.main-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background:
        linear-gradient(120deg, rgba(201,160,80,0.05) 0%, rgba(0,0,0,0) 35%, rgba(0,0,0,0) 100%),
        linear-gradient(180deg, rgba(255,255,255,0.025) 0%, rgba(255,255,255,0.01) 100%),
        rgba(2,2,2,0.94);
    backdrop-filter: blur(10px);
    padding: 13px 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 1000;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    box-shadow: 0 14px 34px rgba(0,0,0,0.55);
}

.main-header::after {
    content: '';
    position: absolute;
    left: 10%;
    right: 10%;
    bottom: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.12), transparent);
    opacity: 0.35;
}

.logo-container {
    flex: 1;
    display: flex;
    align-items: center;
}

.logo {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    text-decoration: none;
}

.logo-img {
    height: 74px;
    width: auto;
    max-width: 320px;
    display: block;
}

.logo-icon {
    width: 50px;
    height: 50px;
}

.logo-text {
    display: flex;
    flex-direction: column;
}

.logo-abc {
    font-size: 32px;
    font-weight: 900;
    color: #C9A050;
    letter-spacing: 2px;
    line-height: 1;
}

.logo-subtitle {
    font-size: 11px;
    font-weight: 500;
    color: #C9A050;
    letter-spacing: 3px;
    margin-top: 2px;
}

/* Main Navigation */
.main-nav {
    display: flex;
    gap: 0;
    align-items: center;
    padding: 6px 6px;
    background: transparent;
    border: none;
    border-radius: 999px;
    backdrop-filter: blur(12px);
    box-shadow: none;
    position: relative;
    --nav-corner: 10px;
}

.main-nav::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 42px;
    transform: translateY(-50%);
    border-radius: 999px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.01) 100%),
        rgba(6,6,6,0.78);
    border: none;
    box-shadow:
        0 12px 28px rgba(0,0,0,0.6),
        inset 0 1px 0 rgba(255,255,255,0.04);
    opacity: 1;
    pointer-events: none;
}

.main-nav::after {
    content: '';
    display: none;
    pointer-events: none;
}

.nav-btn {
    padding: 10px 22px;
    background: rgba(12,12,12,0.6);
    color: rgba(255,255,255,0.78);
    text-decoration: none;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 2.8px;
    transition: color 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    position: relative;
    text-transform: uppercase;
    border-radius: 0;
    z-index: 1;
}

.main-nav > * + * .nav-btn {
    box-shadow: none;
}

.main-nav > .nav-btn:first-child,
.main-nav > :first-child .nav-btn {
    border-top-left-radius: var(--nav-corner);
    border-bottom-left-radius: var(--nav-corner);
}

.main-nav > .nav-btn:last-child,
.main-nav > :last-child .nav-btn {
    border-top-right-radius: var(--nav-corner);
    border-bottom-right-radius: var(--nav-corner);
}

.nav-btn::before {
    content: '';
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.nav-btn::after {
    content: none;
    display: none;
}

.nav-btn.active,
.nav-btn:hover {
    color: #fff;
}

.nav-btn.active {
    color: #F6F7FA;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0.08) 35%, rgba(0,0,0,0.4) 100%),
        rgba(24,26,30,0.98);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.45),
        0 12px 26px rgba(0,0,0,0.6);
    text-shadow: 0 1px 8px rgba(0,0,0,0.6);
    z-index: 3;
}

.nav-btn:hover:not(.active) {
    background: rgba(255,255,255,0.02);
    box-shadow:
        0 8px 18px rgba(0,0,0,0.45),
        0 0 0 1px rgba(255,255,255,0.22);
    z-index: 2;
}

.nav-btn:hover::before,
.nav-btn.active::before {
    opacity: 0;
}

/* Dropdown Navigation */
.nav-dropdown {
    position: relative;
    display: inline-block;
}

.nav-dropdown::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 50px;
    background: transparent;
    pointer-events: auto;
}

.dropdown-content {
    position: absolute;
    top: 100%;
    left: 0;
    background: rgba(10,10,10,0.92);
    min-width: 200px;
    box-shadow: 0 20px 44px rgba(0,0,0,0.6);
    z-index: 1001;
    border: 1px solid rgba(255,255,255,0.08);
    border-top: 1px solid rgba(60,67,77,0.65);
    border-radius: var(--abc-radius-card);
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transform: translateY(0);
    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease;
    backdrop-filter: blur(10px);
    pointer-events: none;
}

.nav-dropdown:last-child .dropdown-content {
    right: 6px;
    left: auto;
}

.dropdown-content a {
    display: block;
    padding: 12px 20px;
    color: #fff;
    text-decoration: none;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 1.8px;
    transition: color 0.3s ease, background 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}

.dropdown-content a:hover {
    background:
        linear-gradient(90deg, rgba(60,67,77,0.85) 0%, rgba(42,48,56,0.92) 55%, rgba(42,48,56,0.7) 100%);
    color: #F4F7FA;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 10px 24px rgba(0,0,0,0.5);
    transform: translateX(2px);
}

.nav-dropdown:hover .dropdown-content {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

.nav-dropdown.open .dropdown-content {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

.nav-dropdown:hover .nav-btn {
    color: #fff;
    background: rgba(255,255,255,0.02);
    box-shadow:
        0 8px 18px rgba(0,0,0,0.45),
        0 0 0 1px rgba(255,255,255,0.22);
    z-index: 2;
}

/* Hero Section (index, etc.) */
.hero {
    position: relative;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background:
        radial-gradient(1200px circle at 20% 15%, rgba(201,160,80,0.15), transparent 55%),
        radial-gradient(900px circle at 80% 20%, rgba(110,140,255,0.12), transparent 60%),
        linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.88)),
        url('https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?w=1920&q=80') center/cover;
    overflow: hidden;
    perspective: 1200px;
    z-index: 1;
}

/* Home page only: hero fills scroll area, no extra scroll (scroll-root inset: top 92px + bottom 60px) */
body.page-index .hero {
    height: calc(100vh - 152px);
    min-height: calc(100vh - 152px);
}

.hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 50% 45%, rgba(255,255,255,0.06), transparent 45%);
    opacity: 0.6;
    pointer-events: none;
    z-index: 1;
}

.hero::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 50% 50%, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 55%, rgba(0,0,0,0.92) 100%);
    pointer-events: none;
    z-index: 2;
}

.hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0.6) 60%, rgba(0,0,0,0.85) 100%);
    z-index: 2;
}

.hero-content {
    position: relative;
    z-index: 3;
    text-align: center;
    max-width: 980px;
    padding: 0 20px;
    animation: hero-fade 1.1s ease-out both;
    transform-style: preserve-3d;
}

.hero-title {
    font-size: 66px;
    font-weight: 800;
    color: #F7F7F7;
    margin-bottom: 24px;
    letter-spacing: 0.8px;
    line-height: 1.03;
    text-shadow: 0 10px 30px rgba(0,0,0,0.65), 0 2px 12px rgba(0,0,0,0.45);
    text-transform: uppercase;
    font-family: 'Arial', 'Inter', sans-serif;
    animation: hero-title 1.2s ease-out 0.1s both;
}

.hero-line {
    display: block;
}

.hero-subtitle {
    font-size: 13px;
    font-weight: 600;
    color: rgba(255,255,255,0.72);
    margin-bottom: 40px;
    letter-spacing: 4.6px;
    text-transform: uppercase;
    font-family: 'Inter', 'Roboto', sans-serif;
    animation: hero-subtitle 1.2s ease-out 0.25s both;
}

/* Footer Navigation */
.footer-nav {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    padding: 20px 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 40px;
    background:
        linear-gradient(120deg, rgba(201,160,80,0.05) 0%, rgba(0,0,0,0) 35%, rgba(0,0,0,0) 100%),
        linear-gradient(180deg, rgba(255,255,255,0.025) 0%, rgba(255,255,255,0.01) 100%),
        rgba(2,2,2,0.94);
    backdrop-filter: blur(16px);
    border-top: 1px solid rgba(255,255,255,0.08);
    box-shadow: 0 -14px 34px rgba(0,0,0,0.55);
    font-family: 'Arial', sans-serif;
    z-index: 1000;
}

.footer-link {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.5);
    text-decoration: none;
    padding: 0;
    transition: color 0.3s ease;
}

.footer-link:hover {
    color: #E4C47A;
    background-image: linear-gradient(180deg, #F7E6B0 0%, #D2A85A 55%, #9A6F2C 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: 0 0 14px rgba(201,160,80,0.35);
}

.footer-link:not(:last-child) {
    border-right: none;
}

.site-legal-bar {
    width: min(1120px, calc(100% - 32px));
    margin: 28px auto 116px;
    padding: 12px 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px 16px;
    flex-wrap: wrap;
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 18px;
    background:
        linear-gradient(135deg, rgba(201,160,80,0.07) 0%, rgba(111,135,255,0.05) 48%, rgba(255,255,255,0.03) 100%),
        rgba(5,5,7,0.82);
    backdrop-filter: blur(14px);
    box-shadow: 0 18px 36px rgba(0,0,0,0.32);
}

.site-legal-copy {
    font-size: 10px;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.46);
}

.site-legal-link,
.final-legal-links a {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.35px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.72);
    text-decoration: none;
    transition: color 0.25s ease, text-shadow 0.25s ease;
}

.site-legal-link:hover,
.site-legal-link:focus-visible,
.final-legal-links a:hover,
.final-legal-links a:focus-visible {
    color: #E4C47A;
    text-shadow: 0 0 14px rgba(201,160,80,0.28);
}

.final-legal-links {
    margin-top: 12px;
    display: flex;
    justify-content: center;
    gap: 10px 16px;
    flex-wrap: wrap;
}

/* Keyframes */
@keyframes hero-fade {
    from { opacity: 0; transform: translate3d(0,16px,20px); }
    to { opacity: 1; transform: translate3d(0,0,20px); }
}

@keyframes hero-title {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes hero-subtitle {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Responsive */
@media (max-width: 768px) {
    .main-header {
        flex-direction: column;
        gap: 20px;
        padding: 15px 20px;
    }

    .main-nav {
        flex-wrap: wrap;
        justify-content: center;
        gap: 4px;
        padding: 6px 8px;
    }

    .nav-btn {
        padding: 8px 12px;
        font-size: 9.5px;
        letter-spacing: 2.2px;
    }

    .hero-title {
        font-size: 30px;
        letter-spacing: 1px;
        line-height: 1.08;
    }

    .hero-subtitle {
        font-size: 12px;
        letter-spacing: 2.8px;
    }

    .footer-nav {
        flex-wrap: wrap;
        gap: 10px;
    }

    .footer-link {
        padding: 5px 15px;
        border: none !important;
    }

    .site-legal-bar {
        width: min(100% - 20px, 720px);
        margin: 20px auto 132px;
        padding: 11px 14px;
        gap: 8px 12px;
    }

    .site-legal-copy,
    .site-legal-link,
    .final-legal-links a {
        font-size: 9px;
        letter-spacing: 1.05px;
    }

    .final-legal-links {
        margin-top: 10px;
        gap: 8px 12px;
    }
}

@media (max-width: 1180px), (min-width: 1181px) and (max-width: 1366px) and (pointer: coarse) {
    /* Full-screen modal quieting: Chat + Guided Walkthrough should blur fixed chrome behind them.
       Resources tray remains intentionally sharp and is not part of this selector. */
    body.page-product.chat-open .main-header,
    body.page-product.chat-open .footer-nav,
    body.page-product:has(#edu-modal[aria-hidden="false"]) .main-header,
    body.page-product:has(#edu-modal[aria-hidden="false"]) .footer-nav {
        filter: blur(10px) brightness(0.58) saturate(0.88);
        opacity: 0.78;
        pointer-events: none;
        transform: translateZ(0);
        transition:
            filter 0.24s cubic-bezier(0.22, 1, 0.36, 1),
            opacity 0.24s cubic-bezier(0.22, 1, 0.36, 1);
    }
}

/* Product hero contract for finished-style Health product pages:
   - The finished four-page Health set is the locked shell/glass baseline for approved tiers.
   - Future page-to-page drift should be solved with page-level title/copy variants
     such as .hero-title-tablet-landscape / .hero-copy-tablet-landscape /
     .hero-title-compact-mobile / .hero-copy-compact-mobile, not by changing
     the shared shell or glass dimensions.
   - The shared guards below protect headline wrapping in portrait/narrow tiers,
     and the shared iPad Mini landscape shell/glass lock lives later in this file. */
/* Product pages (tablet portrait): keep hero headline inside the glass — no clipped nowrap lines. */
@media (min-width: 744px) and (max-width: 1024px) and (orientation: portrait) {
    .product-page .product-hero-title {
        text-wrap: balance;
        overflow-wrap: break-word;
        hyphens: manual;
    }

    .product-page .product-hero-title .hero-line {
        white-space: normal;
        text-wrap: balance;
        max-width: 100%;
    }
}

/* Product pages (phone / narrow): same “glass can be narrow” headline behavior as tablet portrait. */
@media (max-width: 743px) {
    .product-page .product-hero-title .hero-line {
        white-space: normal !important;
        text-wrap: balance;
        overflow-wrap: break-word;
        max-width: 100%;
    }
}

/* Shared product-page header/footer/mobile-menu shell for the finished four-page Health set. */
.page-product .mobile-support-tray-toggle,
.page-product .mobile-support-sheet,
.page-product .mobile-support-sheet-backdrop {
    display: none;
}

.page-product .mobile-nav-toggle,
.page-product .mobile-nav-spacer,
.page-product .footer-mobile-action {
    display: none;
}

@media (max-width: 767px) {
    .page-product .main-nav {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 4px;
        padding: 4px;
        border-radius: 18px;
    }

    .page-product .main-nav::before {
        inset: 0;
        top: 0;
        height: auto;
        transform: none;
        border-radius: 18px;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.015) 100%),
            rgba(6,6,6,0.86);
        box-shadow:
            0 16px 28px rgba(0,0,0,0.56),
            inset 0 1px 0 rgba(255,255,255,0.05);
    }

    .page-product .main-nav::after,
    .page-product .nav-dropdown::after {
        display: none;
    }

    .page-product .main-nav > a.nav-btn,
    .page-product .main-nav > .nav-dropdown {
        min-width: 0;
    }

    .page-product .nav-dropdown {
        width: 100%;
    }

    .page-product .main-nav > .nav-btn:first-child,
    .page-product .main-nav > :first-child .nav-btn,
    .page-product .main-nav > .nav-btn:last-child,
    .page-product .main-nav > :last-child .nav-btn {
        border-radius: 12px;
    }

    .page-product .nav-btn {
        width: 100%;
        min-height: 42px;
        padding: 8px 6px;
        justify-content: center;
        text-align: center;
        font-size: 8.6px;
        letter-spacing: 0.16em;
        line-height: 1.1;
        color: rgba(232,238,248,0.74);
        background: transparent;
        border-radius: 12px;
        text-shadow: none;
    }

    .page-product .nav-btn.active {
        background:
            linear-gradient(180deg, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0.08) 40%, rgba(0,0,0,0.44) 100%),
            rgba(24,26,30,0.98);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.32),
            0 12px 22px rgba(0,0,0,0.52);
    }

    .page-product .nav-btn:hover:not(.active),
    .page-product .nav-dropdown.open .nav-btn:not(.active) {
        background: rgba(255,255,255,0.04);
        box-shadow:
            0 8px 18px rgba(0,0,0,0.4),
            0 0 0 1px rgba(255,255,255,0.12);
    }

    .page-product .dropdown-content {
        top: calc(100% + 10px);
        left: 50%;
        right: auto;
        width: min(280px, calc(100vw - 28px));
        min-width: 0;
        border-radius: 14px;
        transform: translate(-50%, 8px);
        box-shadow: 0 22px 44px rgba(0,0,0,0.62);
    }

    .page-product .nav-dropdown:last-child .dropdown-content {
        left: 50%;
        right: auto;
    }

    .page-product .nav-dropdown:hover .dropdown-content,
    .page-product .nav-dropdown.open .dropdown-content {
        transform: translate(-50%, 0);
    }

    .page-product .dropdown-content a {
        padding: 13px 18px;
        font-size: 9px;
        letter-spacing: 0.16em;
    }

    .page-product .footer-nav {
        min-height: var(--product-compact-footer-h);
        padding: 10px 18px calc(10px + env(safe-area-inset-bottom, 0px));
        gap: 10px;
        flex-wrap: nowrap;
        background:
            linear-gradient(120deg, rgba(201,160,80,0.06) 0%, rgba(0,0,0,0) 40%, rgba(0,0,0,0) 100%),
            linear-gradient(180deg, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.012) 100%),
            rgba(2,2,2,0.96);
        box-shadow: 0 -16px 32px rgba(0,0,0,0.58);
    }

    .page-product .footer-link {
        flex: 1 1 0;
        min-width: 0;
        min-height: 42px;
        padding: 8px 10px;
        border: none !important;
        border-radius: 12px;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.015)),
            rgba(12,12,12,0.84);
        color: rgba(232,236,242,0.72);
        font-size: 8.9px;
        letter-spacing: 0.14em;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        line-height: 1.15;
    }

    .page-product .footer-link:hover {
        background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02)), rgba(18,18,18,0.92);
        color: rgba(244,247,252,0.88);
        background-image: none;
        -webkit-text-fill-color: currentColor;
        text-shadow: none;
    }
}

@keyframes compact-chat-star-glow {
    0%, 100% {
        fill: #E2BE6D;
        stroke: #E2BE6D;
        transform: translate(0px, 1px) scale(1);
        filter: drop-shadow(0 0 0 rgba(201,160,80,0));
    }
    34% {
        fill: rgba(225,188,106,0.94);
        stroke: rgba(225,188,106,0.94);
        transform: translate(0px, 1px) scale(1.08);
        filter:
            drop-shadow(0 0 10px rgba(201,160,80,0.32))
            drop-shadow(0 0 16px rgba(201,160,80,0.14));
    }
    58% {
        fill: rgba(241,214,142,0.98);
        stroke: rgba(241,214,142,0.98);
        transform: translate(0px, 1px) scale(1.18);
        filter:
            drop-shadow(0 0 14px rgba(230,196,113,0.5))
            drop-shadow(0 0 24px rgba(230,196,113,0.3));
    }
}

@media (max-width: 640px) {
    /* Phone menu-button chrome is centralized in the later phone shell block. */

    .page-product .main-nav {
        position: absolute;
        top: calc(100% + 10px);
        left: auto;
        right: 12px;
        width: min(320px, calc(100vw - 24px));
        max-width: calc(100vw - 24px);
        display: flex;
        flex-direction: column;
        gap: 10px;
        padding: 14px;
        border-radius: 20px;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.045) 0%, rgba(255,255,255,0.012) 18%, rgba(0,0,0,0) 100%),
            rgba(4,4,5,0.985);
        border: 1px solid rgba(255,255,255,0.08);
        box-shadow:
            0 22px 42px rgba(0,0,0,0.56),
            inset 0 1px 0 rgba(255,255,255,0.04);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateY(-8px) scale(0.985);
        transform-origin: top right;
        transition: opacity 0.24s ease, visibility 0.24s ease, transform 0.24s var(--ease-premium);
        z-index: 1001;
    }

    .page-product .main-nav::before,
    .page-product .main-nav::after,
    .page-product .nav-dropdown::after {
        display: none;
    }

    body.product-phone-nav-open .main-nav {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateY(0) scale(1);
    }

    .page-product .main-nav > a.nav-btn,
    .page-product .main-nav > .nav-dropdown {
        width: 100%;
        min-width: 0;
    }

    .page-product .main-nav > a.nav-btn {
        justify-content: flex-start;
        padding-left: 20px;
        color: rgba(228,233,241,0.82);
    }

    .page-product .main-nav > :not(:first-child)::before {
        display: none;
    }

    .page-product .main-nav > .nav-btn:first-child,
    .page-product .main-nav > :first-child .nav-btn,
    .page-product .main-nav > .nav-btn:last-child,
    .page-product .main-nav > :last-child .nav-btn {
        border-radius: 16px !important;
    }

    .page-product .nav-dropdown {
        width: 100%;
        display: block;
    }

    .page-product .nav-btn {
        display: flex;
        width: 100%;
        align-items: center;
        min-height: 54px;
        padding: 16px 18px;
        justify-content: flex-start;
        text-align: left;
        font-size: 10px;
        letter-spacing: 0.18em;
        border-radius: 16px !important;
        background: rgba(255,255,255,0.018);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.05),
            inset 0 -1px 0 rgba(255,255,255,0.02);
    }

    .page-product .nav-dropdown .nav-btn {
        justify-content: space-between;
    }

    .page-product .nav-dropdown .nav-btn::after {
        content: '+';
        font-size: 17px;
        line-height: 1;
        letter-spacing: 0;
        color: rgba(222,228,238,0.56);
        transition: transform 0.22s ease, color 0.22s ease;
    }

    .page-product .nav-dropdown.open .nav-btn::after {
        transform: rotate(45deg);
        color: rgba(244,247,252,0.86);
    }

    .page-product .nav-btn.active {
        background:
            linear-gradient(180deg, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0.04) 30%, rgba(0,0,0,0.18) 100%),
            rgba(22,24,28,0.98);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.14),
            inset 0 -1px 0 rgba(255,255,255,0.03);
    }

    .page-product .nav-dropdown .nav-btn.active {
        border: 1px solid rgba(111,135,255,0.38);
        background:
            linear-gradient(180deg, rgba(111,135,255,0.14) 0%, rgba(255,255,255,0.03) 24%, rgba(0,0,0,0.18) 100%),
            rgba(18,20,28,0.98);
        color: rgba(240,245,255,0.96);
        box-shadow:
            inset 0 1px 0 rgba(194,210,255,0.22),
            inset 0 -1px 0 rgba(111,135,255,0.14),
            0 0 0 1px rgba(111,135,255,0.06);
    }

    .page-product .nav-dropdown .nav-btn.active::after {
        color: rgba(170,193,255,0.88);
    }

    .page-product .nav-dropdown.open .nav-btn:not(.active) {
        background: rgba(255,255,255,0.03);
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
    }

    .page-product .dropdown-content {
        position: static;
        top: auto;
        left: auto;
        right: auto;
        width: calc(100% - 12px);
        min-width: 0;
        display: none;
        margin-top: 0;
        margin-left: 12px;
        border-radius: 16px;
        border: 0 solid transparent;
        background:
            linear-gradient(180deg, rgba(111,135,255,0.08) 0%, rgba(255,255,255,0.024) 18%, rgba(0,0,0,0.04) 100%),
            rgba(8,9,13,0.96);
        box-shadow:
            inset 0 1px 0 rgba(214,224,255,0.07),
            inset 0 0 0 1px rgba(255,255,255,0.035);
        transform: none;
        overflow: hidden;
    }

    .page-product .nav-dropdown:last-child .dropdown-content {
        left: auto;
        right: auto;
    }

    .page-product .nav-dropdown:hover .dropdown-content {
        display: none;
        margin-top: 0;
        border-width: 0;
    }

    .page-product .nav-dropdown:hover .nav-btn:not(.active) {
        background: rgba(255,255,255,0.018);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.05),
            inset 0 -1px 0 rgba(255,255,255,0.02);
    }

    .page-product .nav-dropdown.open .dropdown-content {
        display: block;
        transform: none;
        margin-top: 10px;
        border-width: 1px;
        border-color: rgba(146,166,255,0.16);
    }

    .page-product .dropdown-content a[aria-current="page"] {
        color: rgba(233,241,255,0.96);
        background:
            linear-gradient(90deg, rgba(111,135,255,0.14) 0%, rgba(111,135,255,0.04) 46%, transparent 100%),
            rgba(12,13,18,0.98);
        box-shadow: inset 2px 0 0 rgba(111,135,255,0.68);
    }

    .page-product .footer-nav {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0;
        padding: 0 0 calc(env(safe-area-inset-bottom, 0px));
        align-items: stretch;
        border-top: none;
        overflow: hidden;
        isolation: isolate;
        background: rgba(0,0,0,0.98);
        box-shadow:
            0 -20px 36px rgba(0,0,0,0.68),
            inset 0 1px 0 rgba(255,255,255,0.03),
            inset 0 10px 18px rgba(255,255,255,0.012);
    }

    .page-product .footer-nav::before {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: 50%;
        width: 1px;
        transform: translateX(-50%);
        background: linear-gradient(180deg, rgba(0,0,0,0.92) 0%, rgba(10,10,12,0.76) 100%);
        pointer-events: none;
        z-index: 2;
    }

    .page-product .footer-nav::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 1px;
        background:
            radial-gradient(18% 180% at 50% 50%, rgba(182,166,176,0.22) 0%, rgba(146,139,187,0.1) 38%, rgba(0,0,0,0) 72%),
            linear-gradient(90deg, rgba(96,111,224,0.74) 0%, rgba(96,111,224,0.7) 43.5%, rgba(122,124,210,0.68) 47.5%, rgba(156,145,178,0.66) 50%, rgba(195,170,136,0.66) 52.5%, rgba(218,186,118,0.7) 56.5%, rgba(226,190,109,0.74) 100%);
        box-shadow:
            0 0 10px rgba(96,111,224,0.12),
            0 0 12px rgba(226,190,109,0.1);
        pointer-events: none;
        z-index: 3;
    }

    .page-product .footer-link {
        display: none;
    }

    .page-product .footer-mobile-action {
        position: relative;
        z-index: 1;
        min-width: 0;
        min-height: 68px;
        padding: 12px 16px;
        border-radius: 0;
        border: 1px solid transparent;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.038) 0%, rgba(255,255,255,0.012) 18%, rgba(0,0,0,0) 100%) padding-box,
            linear-gradient(180deg, rgba(8,9,12,0.985) 0%, rgba(3,4,6,0.995) 100%) padding-box,
            linear-gradient(135deg, rgba(255,255,255,0.07), rgba(255,255,255,0.02)) border-box;
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.05),
            inset 0 -1px 0 rgba(255,255,255,0.02),
            inset 0 -18px 30px rgba(0,0,0,0.2);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        text-decoration: none;
        cursor: pointer;
        overflow: hidden;
        isolation: isolate;
        appearance: none;
        -webkit-appearance: none;
        -webkit-tap-highlight-color: transparent;
        transition: transform 0.22s var(--ease-premium), border-color 0.22s ease, box-shadow 0.22s ease, background 0.22s ease, color 0.22s ease;
    }

    .page-product .footer-mobile-action::after {
        content: '';
        position: absolute;
        inset: 1px;
        border-radius: 0;
        background: linear-gradient(180deg, rgba(255,255,255,0.022) 0%, rgba(255,255,255,0.006) 16%, transparent 40%);
        opacity: 0.42;
        pointer-events: none;
        z-index: 0;
    }

    .page-product .footer-mobile-content {
        position: relative;
        z-index: 1;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        width: 100%;
    }

    .page-product .footer-mobile-orb {
        width: 28px;
        height: 28px;
        flex: 0 0 28px;
        border-radius: 999px;
        border: 1px solid rgba(255,255,255,0.08);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background:
            radial-gradient(60% 60% at 30% 20%, rgba(255,255,255,0.1), rgba(6,6,6,0.88) 60%),
            rgba(8,8,8,0.94);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.04),
            0 0 0 1px rgba(0,0,0,0.28);
    }

    .page-product .footer-mobile-orb svg {
        width: 14px;
        height: 14px;
        display: block;
    }

    .page-product .footer-mobile-resource,
    .page-product .footer-mobile-chat {
        border-width: 0;
        border-style: solid;
    }

    .page-product .footer-mobile-resource {
        background:
            linear-gradient(180deg, rgba(255,255,255,0.038) 0%, rgba(255,255,255,0.012) 18%, rgba(0,0,0,0) 100%),
            radial-gradient(135% 125% at 0% 0%, rgba(126,148,255,0.085) 0%, rgba(126,148,255,0.024) 34%, rgba(0,0,0,0) 70%),
            linear-gradient(180deg, rgba(8,9,12,0.985) 0%, rgba(3,4,6,0.995) 100%);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.06),
            inset 1px 0 0 rgba(146,170,255,0.14);
    }

    .page-product .footer-mobile-resource .footer-mobile-orb svg {
        stroke: #7098E8;
        fill: none;
        stroke-width: 1.7;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    .page-product .footer-mobile-resource .footer-mobile-label {
        position: relative;
        z-index: 1;
        font-size: 10.9px;
        font-weight: 700;
        line-height: 1.12;
        letter-spacing: 0.22em;
        text-transform: uppercase;
        color: rgba(233,239,252,0.92);
        text-shadow: none;
    }

    .page-product .footer-mobile-chat {
        background:
            linear-gradient(180deg, rgba(255,255,255,0.038) 0%, rgba(255,255,255,0.012) 18%, rgba(0,0,0,0) 100%),
            radial-gradient(135% 125% at 100% 0%, rgba(226,190,109,0.085) 0%, rgba(226,190,109,0.024) 34%, rgba(0,0,0,0) 70%),
            linear-gradient(180deg, rgba(8,9,12,0.985) 0%, rgba(3,4,6,0.995) 100%);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.06),
            inset 1px 0 0 rgba(227,194,118,0.12);
        color: rgba(235,241,252,0.92);
    }

    .page-product .footer-mobile-chat .footer-mobile-orb svg {
        width: 18px;
        height: 18px;
        fill: #E2BE6D;
        stroke: #E2BE6D;
        stroke-width: 0.45px;
        stroke-linejoin: round;
        paint-order: stroke fill;
        shape-rendering: geometricPrecision;
        transform: translate(0px, 1px);
        animation: compact-chat-star-glow 1.85s cubic-bezier(0.4, 0, 0.2, 1) infinite;
    }

    .page-product .footer-mobile-chat .footer-mobile-label {
        position: relative;
        z-index: 1;
        font-size: 10.9px;
        font-weight: 700;
        line-height: 1.12;
        letter-spacing: 0.22em;
        text-transform: uppercase;
        color: rgba(244,236,214,0.92);
        text-shadow: none;
    }

    .page-product .footer-mobile-action:hover,
    .page-product .footer-mobile-action:focus-visible {
        transform: translateY(-1px);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.08),
            inset 0 -1px 0 rgba(255,255,255,0.03);
    }

    .page-product .footer-mobile-resource:hover,
    .page-product .footer-mobile-resource:focus-visible {
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.08),
            inset 1px 0 0 rgba(146,170,255,0.18);
        background:
            linear-gradient(180deg, rgba(255,255,255,0.048) 0%, rgba(255,255,255,0.016) 18%, rgba(0,0,0,0) 100%),
            radial-gradient(135% 125% at 0% 0%, rgba(156,177,255,0.11) 0%, rgba(156,177,255,0.032) 36%, rgba(0,0,0,0) 70%),
            linear-gradient(180deg, rgba(8,9,12,0.985) 0%, rgba(3,4,6,0.995) 100%);
    }

    .page-product .footer-mobile-chat:hover,
    .page-product .footer-mobile-chat:focus-visible {
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.08),
            inset 1px 0 0 rgba(227,194,118,0.16);
        background:
            linear-gradient(180deg, rgba(255,255,255,0.048) 0%, rgba(255,255,255,0.016) 18%, rgba(0,0,0,0) 100%),
            radial-gradient(135% 125% at 100% 0%, rgba(242,212,146,0.11) 0%, rgba(242,212,146,0.032) 36%, rgba(0,0,0,0) 70%),
            linear-gradient(180deg, rgba(8,9,12,0.985) 0%, rgba(3,4,6,0.995) 100%);
    }

    .page-product .chat-widget {
        display: none !important;
    }

    .page-product .mobile-support-tray-toggle,
    .page-product .mobile-support-sheet,
    .page-product .mobile-support-sheet-backdrop {
        display: block;
    }

    .page-product .mobile-support-tray-toggle {
        display: none !important;
    }

    .page-product .mobile-support-sheet-backdrop {
        position: fixed;
        inset: 0;
        background:
            radial-gradient(ellipse 100% 80% at 50% 100%, rgba(90,120,255,0.1) 0%, rgba(2,3,6,0.48) 48%, rgba(2,3,6,0.72) 100%);
        -webkit-backdrop-filter: blur(6px) saturate(108%);
        backdrop-filter: blur(6px) saturate(108%);
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.26s ease, visibility 0.26s ease;
        z-index: 1002;
    }

    .page-product .mobile-support-sheet {
        position: fixed;
        left: 10px;
        right: 10px;
        bottom: calc(12px + var(--product-compact-footer-h) + env(safe-area-inset-bottom, 0px));
        max-height: min(78vh, 520px);
        overflow: auto;
        padding: 18px 0 0;
        border-radius: 28px 34px 24px 16px;
        border: 1px solid rgba(111,135,255,0.18);
        background:
            linear-gradient(90deg, rgba(111,135,255,0.08) 0%, transparent 96px),
            linear-gradient(180deg, rgba(255,255,255,0.02) 0%, rgba(255,255,255,0) 74px),
            linear-gradient(145deg, rgba(8,10,16,0.28) 0%, rgba(2,2,2,0.72) 48%, rgba(0,0,0,0.8) 100%);
        -webkit-backdrop-filter: blur(12px) saturate(112%);
        backdrop-filter: blur(12px) saturate(112%);
        box-shadow:
            0 28px 54px rgba(0,0,0,0.72),
            inset 0 1px 0 rgba(255,255,255,0.04),
            inset 4px 0 0 var(--neon-blue);
        transform: translateY(calc(100% + 24px));
        opacity: 0;
        visibility: hidden;
        transition: transform 0.28s var(--ease-premium), opacity 0.28s ease, visibility 0.28s ease;
        z-index: 1004;
    }

    .page-product .mobile-support-sheet-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 12px;
        padding: 0 18px;
    }

    .page-product .mobile-support-sheet-copy {
        min-width: 0;
    }

    .page-product .mobile-support-sheet-kicker,
    .page-product .mobile-support-sheet-desc,
    .page-product .mobile-support-tray-badge,
    .page-product .mobile-support-tray-eyebrow {
        display: none;
    }

    .page-product .mobile-support-tray-title,
    .page-product .mobile-support-sheet-title {
        color: transparent;
        background-image: linear-gradient(135deg,
            rgba(214,228,255,0.98),
            var(--neon-blue),
            var(--neon-purple),
            rgba(206,186,255,0.96));
        background-size: 230% 230%;
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        animation: learn-toggle-shift var(--interactive-shift-duration) ease-in-out infinite;
        text-transform: uppercase;
    }

    .page-product .mobile-support-sheet-title {
        margin: 0;
        font-size: clamp(26px, 7.8vw, 31px);
        line-height: 1.04;
        letter-spacing: 0.04em;
        font-family: 'Montserrat', 'Arial', sans-serif;
    }

    /* Keep advisor artwork distinct from other resource cards on the same page. */
    .page-product #advisor-chat-gate .find-doctor-gate-body::before {
        background: url("../SHARED/HEALTH/RESOURCES/SPEAK%20TO%20AN%20ADVISOR.jpg") 50% 45% / cover no-repeat;
    }

    .page-product .mobile-support-sheet-close {
        width: 34px;
        height: 34px;
        border-radius: 999px;
        border: none;
        background: #050505;
        color: transparent;
        cursor: pointer;
        font-size: 0;
        text-indent: -9999px;
        line-height: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        position: relative;
        padding: 0;
        flex-shrink: 0;
        overflow: hidden;
        box-shadow:
            inset 3px 3px 6px #000000,
            inset -1px -1px 4px #1a1a1a,
            0 1px 0 rgba(255,255,255,0.1);
        transition:
            transform var(--popup-transition-duration) var(--popup-transition-ease),
            box-shadow var(--popup-transition-duration) var(--popup-transition-ease);
        outline: none;
    }

    .page-product .mobile-support-sheet-close::before,
    .page-product .mobile-support-sheet-close::after {
        content: '';
        position: absolute;
        width: 10px;
        height: 2px;
        border-radius: 2px;
        background: var(--neon-blue);
        box-shadow: 0 0 8px rgba(111,135,255,0.6);
        transition: transform 0.28s ease, width 0.28s ease;
    }

    .page-product .mobile-support-sheet-close::before { transform: rotate(45deg); }
    .page-product .mobile-support-sheet-close::after { transform: rotate(-45deg); }

    .page-product .mobile-support-sheet-close:hover,
    .page-product .mobile-support-sheet-close:active {
        transform: none;
        box-shadow:
            inset 3px 3px 6px #000000,
            inset -1px -1px 4px #1a1a1a,
            0 1px 0 rgba(255,255,255,0.1);
    }

    .page-product .mobile-support-sheet-close:hover::before,
    .page-product .mobile-support-sheet-close:hover::after,
    .page-product .mobile-support-sheet-close:active::before,
    .page-product .mobile-support-sheet-close:active::after {
        width: 11px;
        background: rgba(239,68,68,0.98);
        box-shadow: 0 0 10px rgba(239,68,68,0.8);
    }

    .page-product .mobile-support-sheet-close:hover::before,
    .page-product .mobile-support-sheet-close:active::before { transform: rotate(225deg); }

    .page-product .mobile-support-sheet-close:hover::after,
    .page-product .mobile-support-sheet-close:active::after { transform: rotate(135deg); }

    .page-product .mobile-support-action {
        -webkit-appearance: none;
        appearance: none;
        position: relative;
        width: 100%;
        min-height: 52px;
        padding: 16px 24px;
        border: none;
        border-left: 3px solid transparent;
        border-radius: 0;
        background-color: transparent;
        background-image: linear-gradient(rgba(255,255,255,0.035), rgba(255,255,255,0.035));
        background-repeat: no-repeat;
        background-position: 24px 100%;
        background-size: calc(100% - 24px) 1px;
        color: rgba(248,250,252,0.92);
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0;
        text-align: left;
        box-shadow: none;
        cursor: pointer;
        overflow: hidden;
        isolation: isolate;
        transition: background 0.24s ease, color 0.24s ease, border-left-color 0.24s ease;
        -webkit-tap-highlight-color: transparent;
    }

    .page-product .mobile-support-action::before,
    .page-product .mobile-support-action::after {
        content: '';
        position: absolute;
        left: 0;
        width: 0;
        height: 0;
        pointer-events: none;
        opacity: 0;
        display: block;
        box-sizing: border-box;
        z-index: 0;
    }

    .page-product .mobile-support-action::before {
        top: 0;
        border-top: 2px solid rgba(129,157,255,0.82);
        border-right: 2px solid rgba(129,157,255,0.82);
        border-top-left-radius: 12px;
        border-top-right-radius: 12px;
    }

    .page-product .mobile-support-action-label {
        position: relative;
        z-index: 1;
        font-size: 15px;
        font-weight: 500;
        line-height: 1.3;
        color: inherit;
    }

    .page-product .mobile-support-action-meta {
        display: none;
    }

    .page-product .mobile-support-action:last-child {
        background-image: none;
    }

    .page-product .mobile-support-action:hover,
    .page-product .mobile-support-action:focus-visible {
        background:
            linear-gradient(90deg, rgba(111,135,255,0.16) 0%, rgba(154,100,255,0.08) 100%),
            linear-gradient(90deg, rgba(0,0,0,0.98), rgba(0,0,0,0.98));
        background-position: 0 0;
        background-repeat: no-repeat;
        background-size: 230% 230%, 100% 100%;
        animation:
            resource-link-shift var(--interactive-shift-duration) ease-in-out infinite,
            learn-toggle-shift var(--interactive-shift-duration) ease-in-out infinite;
        color: rgba(255,255,255,0.98);
        border-left-color: rgba(129,157,255,0.82);
        border-radius: 12px;
        box-shadow: inset 1px 0 0 rgba(129,157,255,0.82);
    }

    .page-product .mobile-support-action:hover::before,
    .page-product .mobile-support-action:hover::after,
    .page-product .mobile-support-action:focus-visible::before,
    .page-product .mobile-support-action:focus-visible::after {
        opacity: 1;
        filter: drop-shadow(0 0 3px rgba(112,152,232,0.3));
    }

    .page-product .mobile-support-action:hover::before,
    .page-product .mobile-support-action:focus-visible::before {
        animation: resourceSnakeTopFromLeft 0.66s ease-out forwards;
    }

    .page-product .mobile-support-action:hover::after,
    .page-product .mobile-support-action:focus-visible::after {
        bottom: 0;
        border-bottom: 2px solid rgba(129,157,255,0.82);
        border-right: 2px solid rgba(129,157,255,0.82);
        border-bottom-left-radius: 12px;
        border-bottom-right-radius: 12px;
        animation: resourceSnakeBottomFromLeft 0.66s ease-out forwards;
    }

    body.product-support-open .mobile-support-sheet-backdrop {
        opacity: 1;
        visibility: visible;
    }

    body.product-support-open .mobile-support-sheet {
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
    }

    body.product-support-open .chat-widget {
        opacity: 0;
        pointer-events: none;
        transform: translateY(10px);
    }

    body.chat-open .mobile-support-sheet,
    body.chat-open .mobile-support-sheet-backdrop,
    body.chat-open .mobile-support-tray-toggle {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }
}

@media (min-width: 768px) and (max-width: 960px), (min-width: 821px) and (max-width: 1024px) and (orientation: portrait), (min-width: 961px) and (max-width: 1180px) and (orientation: landscape), (min-width: 1181px) and (max-width: 1366px) and (orientation: landscape) and (pointer: coarse) {
    .page-product .mobile-nav-toggle {
        position: relative;
        top: auto;
        right: auto;
        grid-column: 3;
        justify-self: end;
        align-self: center;
        width: 52px;
        height: 52px;
        transform: none;
        display: inline-flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 5px;
        border: 1px solid rgba(201,169,97,0.1);
        border-radius: 16px;
        background:
            radial-gradient(circle at 50% 0%, rgba(201,169,97,0.09), rgba(201,169,97,0) 54%),
            linear-gradient(180deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.012) 100%),
            rgba(4,4,7,0.975);
        box-shadow:
            0 18px 34px rgba(0,0,0,0.46),
            0 0 0 1px rgba(255,255,255,0.018),
            inset 0 1px 0 rgba(255,255,255,0.06),
            inset 0 -10px 18px rgba(0,0,0,0.16);
        color: rgba(242,245,251,0.9);
        cursor: pointer;
        z-index: 1002;
        -webkit-tap-highlight-color: transparent;
        transition: transform 0.22s var(--ease-premium), border-color 0.22s ease, background 0.22s ease, box-shadow 0.22s ease;
    }

    .page-product .mobile-nav-toggle span {
        display: block;
        width: 19px;
        height: 1.5px;
        border-radius: 999px;
        background:
            linear-gradient(90deg, rgba(255,255,255,0.94), rgba(214,222,236,0.8));
        box-shadow: 0 0 12px rgba(255,255,255,0.03);
        transition: transform 0.22s ease, opacity 0.22s ease;
        transform-origin: center;
    }

    .page-product .mobile-nav-toggle span:nth-child(1) {
        width: 19px;
        transform: translateX(-0.5px);
    }

    .page-product .mobile-nav-toggle span:nth-child(2) {
        width: 12px;
        transform: translateX(3px);
    }

    .page-product .mobile-nav-toggle span:nth-child(3) {
        width: 19px;
        transform: translateX(-0.5px);
    }

    body.page-product.product-phone-nav-open .mobile-nav-toggle {
        transform: translateY(1px) scale(0.985);
        border-color: rgba(125,149,255,0.26);
        background:
            radial-gradient(circle at 50% 0%, rgba(125,149,255,0.1), rgba(125,149,255,0) 56%),
            linear-gradient(180deg, rgba(255,255,255,0.065) 0%, rgba(255,255,255,0.014) 100%),
            rgba(7,7,10,0.982);
        box-shadow:
            0 18px 34px rgba(0,0,0,0.48),
            0 0 22px rgba(125,149,255,0.055),
            inset 0 1px 0 rgba(255,255,255,0.06),
            inset 0 0 0 1px rgba(125,149,255,0.08);
    }

    body.page-product.product-phone-nav-open .mobile-nav-toggle span:nth-child(1) {
        width: 19px;
        transform: translateY(7.75px) rotate(45deg);
    }

    body.page-product.product-phone-nav-open .mobile-nav-toggle span:nth-child(2) {
        opacity: 0;
        transform: scaleX(0.4);
    }

    body.page-product.product-phone-nav-open .mobile-nav-toggle span:nth-child(3) {
        width: 19px;
        transform: translateY(-7.75px) rotate(-45deg);
    }

    .page-product .main-nav {
        position: absolute;
        top: calc(100% + 10px);
        left: auto;
        right: 16px;
        width: min(340px, calc(100vw - 32px));
        max-width: calc(100vw - 32px);
        display: flex;
        flex-direction: column;
        gap: 10px;
        padding: 14px;
        border-radius: 20px;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.045) 0%, rgba(255,255,255,0.012) 18%, rgba(0,0,0,0) 100%),
            rgba(4,4,5,0.985);
        border: 1px solid rgba(255,255,255,0.08);
        box-shadow:
            0 22px 42px rgba(0,0,0,0.56),
            inset 0 1px 0 rgba(255,255,255,0.04);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateY(-8px) scale(0.985);
        transform-origin: top right;
        transition: opacity 0.24s ease, visibility 0.24s ease, transform 0.24s var(--ease-premium);
        z-index: 1001;
    }

    .page-product .main-nav::before,
    .page-product .main-nav::after,
    .page-product .nav-dropdown::after {
        display: none;
    }

    body.product-phone-nav-open .main-nav {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateY(0) scale(1);
    }

    .page-product .main-nav > a.nav-btn,
    .page-product .main-nav > .nav-dropdown {
        width: 100%;
        min-width: 0;
    }

    .page-product .main-nav > a.nav-btn {
        justify-content: flex-start;
        padding-left: 20px;
        color: rgba(228,233,241,0.82);
    }

    .page-product .main-nav > :not(:first-child)::before {
        display: none;
    }

    .page-product .main-nav > .nav-btn:first-child,
    .page-product .main-nav > :first-child .nav-btn,
    .page-product .main-nav > .nav-btn:last-child,
    .page-product .main-nav > :last-child .nav-btn {
        border-radius: 16px !important;
    }

    .page-product .nav-dropdown {
        width: 100%;
        display: block;
    }

    .page-product .nav-btn {
        display: flex;
        width: 100%;
        align-items: center;
        min-height: 54px;
        padding: 16px 18px;
        justify-content: flex-start;
        text-align: left;
        font-size: 10px;
        letter-spacing: 0.18em;
        border-radius: 16px !important;
        background: rgba(255,255,255,0.018);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.05),
            inset 0 -1px 0 rgba(255,255,255,0.02);
    }

    .page-product .nav-dropdown .nav-btn {
        justify-content: space-between;
    }

    .page-product .nav-dropdown .nav-btn::after {
        content: '+';
        font-size: 17px;
        line-height: 1;
        letter-spacing: 0;
        color: rgba(222,228,238,0.56);
        transition: transform 0.22s ease, color 0.22s ease;
    }

    .page-product .nav-dropdown.open .nav-btn::after {
        transform: rotate(45deg);
        color: rgba(244,247,252,0.86);
    }

    .page-product .nav-btn.active {
        background:
            linear-gradient(180deg, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0.04) 30%, rgba(0,0,0,0.18) 100%),
            rgba(22,24,28,0.98);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.14),
            inset 0 -1px 0 rgba(255,255,255,0.03);
    }

    .page-product .nav-dropdown .nav-btn.active {
        border: 1px solid rgba(111,135,255,0.38);
        background:
            linear-gradient(180deg, rgba(111,135,255,0.14) 0%, rgba(255,255,255,0.03) 24%, rgba(0,0,0,0.18) 100%),
            rgba(18,20,28,0.98);
        color: rgba(240,245,255,0.96);
        box-shadow:
            inset 0 1px 0 rgba(194,210,255,0.22),
            inset 0 -1px 0 rgba(111,135,255,0.14),
            0 0 0 1px rgba(111,135,255,0.06);
    }

    .page-product .nav-dropdown .nav-btn.active::after {
        color: rgba(170,193,255,0.88);
    }

    .page-product .nav-dropdown.open .nav-btn:not(.active) {
        background: rgba(255,255,255,0.03);
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
    }

    .page-product .dropdown-content {
        position: static;
        top: auto;
        left: auto;
        right: auto;
        width: calc(100% - 12px);
        min-width: 0;
        display: none;
        margin-top: 0;
        margin-left: 12px;
        border-radius: 16px;
        border: 0 solid transparent;
        background:
            linear-gradient(180deg, rgba(111,135,255,0.08) 0%, rgba(255,255,255,0.024) 18%, rgba(0,0,0,0.04) 100%),
            rgba(8,9,13,0.96);
        box-shadow:
            inset 0 1px 0 rgba(214,224,255,0.07),
            inset 0 0 0 1px rgba(255,255,255,0.035);
        transform: none;
        overflow: hidden;
    }

    .page-product .nav-dropdown:last-child .dropdown-content {
        left: auto;
        right: auto;
    }

    .page-product .nav-dropdown:hover .dropdown-content {
        display: none;
        margin-top: 0;
        border-width: 0;
    }

    .page-product .nav-dropdown:hover .nav-btn:not(.active) {
        background: rgba(255,255,255,0.018);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.05),
            inset 0 -1px 0 rgba(255,255,255,0.02);
    }

    .page-product .nav-dropdown.open .dropdown-content {
        display: block;
        transform: none;
        margin-top: 10px;
        border-width: 1px;
        border-color: rgba(146,166,255,0.16);
    }

    .page-product .dropdown-content a[aria-current="page"] {
        color: rgba(233,241,255,0.96);
        background:
            linear-gradient(90deg, rgba(111,135,255,0.14) 0%, rgba(111,135,255,0.04) 46%, transparent 100%),
            rgba(12,13,18,0.98);
        box-shadow: inset 2px 0 0 rgba(111,135,255,0.68);
    }

    .page-product .footer-nav {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0;
        min-height: var(--product-compact-footer-h);
        padding: 0 0 calc(env(safe-area-inset-bottom, 0px));
        align-items: stretch;
        border-top: none;
        overflow: hidden;
        isolation: isolate;
        background: rgba(0,0,0,0.98);
        box-shadow:
            0 -20px 36px rgba(0,0,0,0.68),
            inset 0 1px 0 rgba(255,255,255,0.03),
            inset 0 10px 18px rgba(255,255,255,0.012);
    }

    .page-product .footer-nav::before {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: 50%;
        width: 1px;
        transform: translateX(-50%);
        background: linear-gradient(180deg, rgba(0,0,0,0.92) 0%, rgba(10,10,12,0.76) 100%);
        pointer-events: none;
        z-index: 2;
    }

    .page-product .footer-nav::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 1px;
        background:
            radial-gradient(18% 180% at 50% 50%, rgba(182,166,176,0.22) 0%, rgba(146,139,187,0.1) 38%, rgba(0,0,0,0) 72%),
            linear-gradient(90deg, rgba(96,111,224,0.74) 0%, rgba(96,111,224,0.7) 43.5%, rgba(122,124,210,0.68) 47.5%, rgba(156,145,178,0.66) 50%, rgba(195,170,136,0.66) 52.5%, rgba(218,186,118,0.7) 56.5%, rgba(226,190,109,0.74) 100%);
        box-shadow:
            0 0 10px rgba(96,111,224,0.12),
            0 0 12px rgba(226,190,109,0.1);
        pointer-events: none;
        z-index: 3;
    }

    .page-product .footer-link {
        display: none;
    }

    .page-product .footer-mobile-action {
        position: relative;
        z-index: 1;
        min-width: 0;
        min-height: 78px;
        padding: 14px 18px;
        border-radius: 0;
        border: 1px solid transparent;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.038) 0%, rgba(255,255,255,0.012) 18%, rgba(0,0,0,0) 100%) padding-box,
            linear-gradient(180deg, rgba(8,9,12,0.985) 0%, rgba(3,4,6,0.995) 100%) padding-box,
            linear-gradient(135deg, rgba(255,255,255,0.07), rgba(255,255,255,0.02)) border-box;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        text-decoration: none;
        cursor: pointer;
        overflow: hidden;
        isolation: isolate;
        appearance: none;
        -webkit-appearance: none;
        -webkit-tap-highlight-color: transparent;
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.05),
            inset 0 -1px 0 rgba(255,255,255,0.02),
            inset 0 -18px 30px rgba(0,0,0,0.2);
        transition: transform 0.22s var(--ease-premium), border-color 0.22s ease, box-shadow 0.22s ease, background 0.22s ease, color 0.22s ease;
    }

    .page-product .footer-mobile-content {
        position: relative;
        z-index: 1;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 14px;
        width: 100%;
    }

    .page-product .footer-mobile-orb {
        width: 32px;
        height: 32px;
        flex: 0 0 32px;
    }

    .page-product .footer-mobile-orb svg {
        width: 16px;
        height: 16px;
        display: block;
    }

    .page-product .footer-mobile-resource .footer-mobile-label,
    .page-product .footer-mobile-chat .footer-mobile-label {
        font-size: 11.4px;
        letter-spacing: 0.24em;
    }

    .page-product .footer-mobile-chat .footer-mobile-orb svg {
        width: 21px;
        height: 21px;
    }

    .page-product .chat-widget {
        display: none !important;
    }

    .page-product .mobile-support-sheet,
    .page-product .mobile-support-sheet-backdrop {
        display: block;
    }

    .page-product .mobile-support-tray-toggle {
        display: none !important;
    }

    .page-product .mobile-support-sheet-backdrop {
        position: fixed;
        inset: 0;
        background:
            radial-gradient(ellipse 100% 80% at 50% 100%, rgba(90,120,255,0.1) 0%, rgba(2,3,6,0.48) 48%, rgba(2,3,6,0.72) 100%);
        -webkit-backdrop-filter: blur(6px) saturate(108%);
        backdrop-filter: blur(6px) saturate(108%);
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.26s ease, visibility 0.26s ease;
        z-index: 1002;
    }

    .page-product .mobile-support-sheet {
        position: fixed;
        left: 16px;
        right: 16px;
        bottom: calc(14px + var(--product-compact-footer-h) + env(safe-area-inset-bottom, 0px));
        max-height: min(72vh, 620px);
        overflow: auto;
        padding: 20px 0 0;
        border-radius: 32px 36px 26px 18px;
        border: 1px solid rgba(111,135,255,0.18);
        background:
            linear-gradient(90deg, rgba(111,135,255,0.08) 0%, transparent 96px),
            linear-gradient(180deg, rgba(255,255,255,0.02) 0%, rgba(255,255,255,0) 74px),
            linear-gradient(145deg, rgba(8,10,16,0.28) 0%, rgba(2,2,2,0.72) 48%, rgba(0,0,0,0.8) 100%);
        -webkit-backdrop-filter: blur(12px) saturate(112%);
        backdrop-filter: blur(12px) saturate(112%);
        box-shadow:
            0 28px 54px rgba(0,0,0,0.72),
            inset 0 1px 0 rgba(255,255,255,0.04),
            inset 4px 0 0 var(--neon-blue);
        transform: translateY(calc(100% + 24px));
        opacity: 0;
        visibility: hidden;
        transition: transform 0.28s var(--ease-premium), opacity 0.28s ease, visibility 0.28s ease;
        z-index: 1004;
    }

    .page-product .mobile-support-sheet-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        margin-bottom: 12px;
        padding: 0 22px;
    }

    .page-product .mobile-support-sheet-title {
        margin: 0;
        font-size: clamp(30px, 5vw, 36px);
        line-height: 1.02;
        letter-spacing: 0.04em;
        font-family: 'Montserrat', 'Arial', sans-serif;
    }

    .page-product .mobile-support-sheet-close {
        width: 38px;
        height: 38px;
    }

    .page-product .mobile-support-list {
        display: flex;
        flex-direction: column;
        gap: 0;
        margin-top: 6px;
        padding: 0 0 12px;
    }

    .page-product .mobile-support-action {
        min-height: 60px;
        padding: 18px 28px;
        background-position: 28px 100%;
        background-size: calc(100% - 28px) 1px;
    }

    .page-product .mobile-support-action-label {
        font-size: 16px;
    }

    body.product-support-open .mobile-support-sheet-backdrop {
        opacity: 1;
        visibility: visible;
    }

    body.product-support-open .mobile-support-sheet {
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
    }

    body.chat-open .mobile-support-sheet,
    body.chat-open .mobile-support-sheet-backdrop {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }
}

/* Step 2 authoritative shared product shell overrides. */
.page-product .mobile-support-tray-toggle,
.page-product .mobile-support-sheet,
.page-product .mobile-support-sheet-backdrop {

    display: none;
}

.page-product .mobile-nav-toggle {

    display: none;
}

.page-product .mobile-nav-spacer {

    display: none;
}

.page-product .footer-mobile-action {

    display: none;
}

@media (max-width: 1180px), (min-width: 1181px) and (max-width: 1366px) and (orientation: landscape) and (pointer: coarse) {
.page-product .scroll-root {

        scrollbar-width: none;
        -ms-overflow-style: none;
    }

.page-product .scroll-root::-webkit-scrollbar {

        width: 0;
        height: 0;
        display: none;
    }

}

@media (max-width: 767px) {
@supports not selector(::-webkit-scrollbar) {
.page-product .scroll-root {

            scrollbar-width: none;
        }

}

.page-product .scroll-root::-webkit-scrollbar {

        width: 0;
        height: 0;
    }

body.page-product {

        --product-compact-header-h: 126px;
        --product-compact-footer-h: 66px;
        --product-phone-tray-h: 0px;
    }

.page-product .scroll-root {

        top: calc(var(--product-compact-header-h) + env(safe-area-inset-top, 0px));
        bottom: calc(var(--product-compact-footer-h) + env(safe-area-inset-bottom, 0px));
    }

.page-product .main-header {

        flex-direction: column;
        gap: 10px;
        padding: calc(10px + env(safe-area-inset-top, 0px)) 16px 12px;
        background:
            linear-gradient(120deg, rgba(201,160,80,0.07) 0%, rgba(0,0,0,0) 42%, rgba(0,0,0,0) 100%),
            linear-gradient(180deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.01) 100%),
            rgba(2,2,2,0.96);
        box-shadow: 0 18px 36px rgba(0,0,0,0.62);
    }

.page-product .main-header::after {

        left: 16px;
        right: 16px;
        opacity: 0.45;
    }

.page-product .logo-container {

        width: 100%;
        flex: none;
        justify-content: center;
    }

.page-product .logo {

        justify-content: center;
    }

.page-product .main-nav {

        width: 100%;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 4px;
        padding: 4px;
        border-radius: 18px;
    }

.page-product .main-nav::before {

        inset: 0;
        top: 0;
        height: auto;
        transform: none;
        border-radius: 18px;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.015) 100%),
            rgba(6,6,6,0.86);
        box-shadow:
            0 16px 28px rgba(0,0,0,0.56),
            inset 0 1px 0 rgba(255,255,255,0.05);
    }

.page-product .main-nav::after,
.page-product .nav-dropdown::after {

        display: none;
    }

.page-product .main-nav > a.nav-btn,
.page-product .main-nav > .nav-dropdown {

        min-width: 0;
    }

.page-product .nav-dropdown {

        width: 100%;
    }

.page-product .main-nav > .nav-btn:first-child,
.page-product .main-nav > :first-child .nav-btn,
.page-product .main-nav > .nav-btn:last-child,
.page-product .main-nav > :last-child .nav-btn {

        border-radius: 12px;
    }

.page-product .nav-btn {

        width: 100%;
        min-height: 42px;
        padding: 8px 6px;
        justify-content: center;
        text-align: center;
        font-size: 8.6px;
        letter-spacing: 0.16em;
        line-height: 1.1;
        color: rgba(232,238,248,0.74);
        background: transparent;
        border-radius: 12px;
        text-shadow: none;
    }

.page-product .nav-btn.active {

        background:
            linear-gradient(180deg, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0.08) 40%, rgba(0,0,0,0.44) 100%),
            rgba(24,26,30,0.98);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.32),
            0 12px 22px rgba(0,0,0,0.52);
    }

.page-product .nav-btn:hover:not(.active),
.page-product .nav-dropdown.open .nav-btn:not(.active) {

        background: rgba(255,255,255,0.04);
        box-shadow:
            0 8px 18px rgba(0,0,0,0.4),
            0 0 0 1px rgba(255,255,255,0.12);
    }

.page-product .dropdown-content {

        top: calc(100% + 10px);
        left: 50%;
        right: auto;
        width: min(280px, calc(100vw - 28px));
        min-width: 0;
        border-radius: 14px;
        transform: translate(-50%, 8px);
        box-shadow: 0 22px 44px rgba(0,0,0,0.62);
    }

.page-product .nav-dropdown:last-child .dropdown-content {

        left: 50%;
        right: auto;
    }

.page-product .nav-dropdown:hover .dropdown-content,
.page-product .nav-dropdown.open .dropdown-content {

        transform: translate(-50%, 0);
    }

.page-product .dropdown-content a {

        padding: 13px 18px;
        font-size: 9px;
        letter-spacing: 0.16em;
    }

.page-product .footer-nav {

        min-height: var(--product-compact-footer-h);
        padding: 10px 18px calc(10px + env(safe-area-inset-bottom, 0px));
        gap: 10px;
        flex-wrap: nowrap;
        background:
            linear-gradient(120deg, rgba(201,160,80,0.06) 0%, rgba(0,0,0,0) 40%, rgba(0,0,0,0) 100%),
            linear-gradient(180deg, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.012) 100%),
            rgba(2,2,2,0.96);
        box-shadow: 0 -16px 32px rgba(0,0,0,0.58);
    }

.page-product .footer-link {

        flex: 1 1 0;
        min-width: 0;
        min-height: 42px;
        padding: 8px 10px;
        border: none !important;
        border-radius: 12px;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.015)),
            rgba(12,12,12,0.84);
        color: rgba(232,236,242,0.72);
        font-size: 8.9px;
        letter-spacing: 0.14em;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        line-height: 1.15;
    }

.page-product .footer-link:hover {

        background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02)), rgba(18,18,18,0.92);
        color: rgba(244,247,252,0.88);
        background-image: none;
        -webkit-text-fill-color: currentColor;
        text-shadow: none;
    }

}

@media (min-width: 641px) and (max-width: 768px) {
body.page-product {

        --product-compact-header-h: 132px;
        --product-compact-footer-h: 68px;
    }

body.page-product [data-alignment-tool] {

        bottom: 0 !important;
        z-index: 21026 !important;
    }

.page-product .nav-btn {

        min-height: 44px;
        font-size: 9px;
        letter-spacing: 0.18em;
    }

.page-product .footer-link {

        font-size: 9.2px;
        letter-spacing: 0.16em;
    }

.page-product .chat-widget {

        bottom: calc(84px + env(safe-area-inset-bottom, 0px));
        right: 16px;
    }

.page-product .chat-panel {

        bottom: calc(138px + env(safe-area-inset-bottom, 0px));
        right: 14px;
        max-width: calc(100vw - 28px);
    }

}

@media (max-width: 640px) {
body.page-product {

        --product-compact-header-h: 76px;
        --product-compact-footer-h: 76px;
        --product-phone-tray-h: 0px;
        --product-phone-tray-gap: 0px;
        --product-phone-chat-size: 0px;
        --product-phone-chat-gap: 0px;
        --product-mobile-copy-gap: 10px;
        --product-mobile-tight-gap: 14px;
        --product-mobile-section-gap: 30px;
        --product-mobile-major-gap: 52px;
        --product-mobile-standard-divider-offset: 16px;
        --product-mobile-major-divider-offset: 26px;
        --product-mobile-divider-width: min(148px, 46%);
    }

.page-product .scroll-root {

        bottom: calc(var(--product-compact-footer-h) + var(--product-phone-tray-h) + var(--product-phone-tray-gap) + env(safe-area-inset-bottom, 0px));
    }

.page-product .main-header {

        display: grid;
        grid-template-columns: 44px minmax(0, 1fr) 44px;
        height: var(--product-compact-header-h);
        min-height: var(--product-compact-header-h);
        gap: 0;
        padding: 0 12px;
        align-items: center;
        justify-content: stretch;
        box-sizing: border-box;
    }

.page-product .logo {

        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 0;
        height: 100%;
    }

.page-product .logo picture {

        display: block;
        line-height: 0;
    }

.page-product .logo-container {

        grid-column: 2;
        width: 100%;
        flex: none;
        padding: 0;
        display: flex;
        justify-content: center;
        align-self: center;
        align-items: center;
        transform: none;
    }

.page-product .mobile-nav-spacer {

        display: block;
        grid-column: 1;
        width: 44px;
        height: 44px;
    }

.page-product .main-header::after {

        left: 0;
        right: 0;
        opacity: 0.3;
    }

    /* Global premium phone menu button for locked product pages. */
.page-product .mobile-nav-toggle {

        position: relative;
        top: auto;
        right: auto;
        grid-column: 3;
        justify-self: end;
        align-self: center;
        width: 50px;
        height: 50px;
        transform: none;
        display: inline-flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4.5px;
        border: 1px solid rgba(201,169,97,0.1);
        border-radius: 16px;
        background:
            radial-gradient(circle at 50% 0%, rgba(201,169,97,0.09), rgba(201,169,97,0) 54%),
            linear-gradient(180deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.012) 100%),
            rgba(4,4,7,0.975);
        box-shadow:
            0 16px 32px rgba(0,0,0,0.46),
            0 0 0 1px rgba(255,255,255,0.018),
            inset 0 1px 0 rgba(255,255,255,0.06),
            inset 0 -10px 18px rgba(0,0,0,0.16);
        color: rgba(242,245,251,0.9);
        cursor: pointer;
        z-index: 1002;
        -webkit-tap-highlight-color: transparent;
        transition: transform 0.22s var(--ease-premium), border-color 0.22s ease, background 0.22s ease, box-shadow 0.22s ease;
    }

.page-product .mobile-nav-toggle span {

        display: block;
        width: 17px;
        height: 1.35px;
        border-radius: 999px;
        background:
            linear-gradient(90deg, rgba(255,255,255,0.94), rgba(214,222,236,0.8));
        box-shadow: 0 0 12px rgba(255,255,255,0.03);
        transition: transform 0.22s ease, opacity 0.22s ease;
        transform-origin: center;
    }

    .page-product .mobile-nav-toggle span:nth-child(1) {
        width: 18px;
        transform: translateX(-0.5px);
    }

    .page-product .mobile-nav-toggle span:nth-child(2) {
        width: 11px;
        transform: translateX(2.5px);
    }

    .page-product .mobile-nav-toggle span:nth-child(3) {
        width: 18px;
        transform: translateX(-0.5px);
    }

body.page-product.product-phone-nav-open .mobile-nav-toggle {

        transform: translateY(1px) scale(0.985);
        border-color: rgba(125,149,255,0.26);
        background:
            radial-gradient(circle at 50% 0%, rgba(125,149,255,0.1), rgba(125,149,255,0) 56%),
            linear-gradient(180deg, rgba(255,255,255,0.065) 0%, rgba(255,255,255,0.014) 100%),
            rgba(7,7,10,0.982);
        box-shadow:
            0 18px 34px rgba(0,0,0,0.48),
            0 0 22px rgba(125,149,255,0.055),
            inset 0 1px 0 rgba(255,255,255,0.06),
            inset 0 0 0 1px rgba(125,149,255,0.08);
    }

body.page-product.product-phone-nav-open .mobile-nav-toggle span:nth-child(1) {

        width: 17px;
        transform: translateY(5.5px) rotate(45deg);
    }

body.page-product.product-phone-nav-open .mobile-nav-toggle span:nth-child(2) {

        opacity: 0;
        transform: scaleX(0.4);
    }

body.page-product.product-phone-nav-open .mobile-nav-toggle span:nth-child(3) {

        width: 17px;
        transform: translateY(-5.5px) rotate(-45deg);
    }

.page-product .main-nav {

        position: absolute;
        top: calc(100% + 8px);
        left: auto;
        right: 12px;
        width: min(286px, calc(100vw - 24px));
        max-width: calc(100vw - 24px);
        display: flex;
        flex-direction: column;
        gap: 8px;
        padding: 12px;
        border-radius: 18px;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.045) 0%, rgba(255,255,255,0.012) 18%, rgba(0,0,0,0) 100%),
            rgba(4,4,5,0.985);
        border: 1px solid rgba(255,255,255,0.08);
        box-shadow:
            0 22px 42px rgba(0,0,0,0.56),
            inset 0 1px 0 rgba(255,255,255,0.04);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateY(-8px) scale(0.985);
        transform-origin: top right;
        transition: opacity 0.24s ease, visibility 0.24s ease, transform 0.24s var(--ease-premium);
        z-index: 1001;
    }

.page-product .main-nav::before {

        display: none;
    }

body.page-product.product-phone-nav-open .main-nav {

        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateY(0) scale(1);
    }

.page-product .nav-btn {

        display: flex;
        width: 100%;
        align-items: center;
        min-height: 48px;
        padding: 14px 18px;
        justify-content: flex-start;
        text-align: left;
        font-size: 9px;
        letter-spacing: 0.16em;
        border-radius: 14px !important;
        background: rgba(255,255,255,0.018);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.05),
            inset 0 -1px 0 rgba(255,255,255,0.02);
    }

.page-product .main-nav > a.nav-btn,
.page-product .main-nav > .nav-dropdown {

        width: 100%;
        min-width: 0;
    }

.page-product .main-nav > a.nav-btn {

        justify-content: flex-start;
        padding-left: 20px;
        color: rgba(228,233,241,0.82);
    }

.page-product .main-nav > :not(:first-child)::before {

        display: none;
    }

.page-product .main-nav > .nav-btn:first-child,
.page-product .main-nav > :first-child .nav-btn,
.page-product .main-nav > .nav-btn:last-child,
.page-product .main-nav > :last-child .nav-btn {

        border-radius: 14px !important;
    }

.page-product .nav-dropdown {

        width: 100%;
        display: block;
    }

.page-product .nav-dropdown .nav-btn {

        display: flex;
        align-items: center;
        justify-content: space-between;
    }

.page-product .nav-dropdown .nav-btn::after {

        content: '+';
        font-size: 17px;
        line-height: 1;
        letter-spacing: 0;
        color: rgba(222,228,238,0.56);
        transition: transform 0.22s ease, color 0.22s ease;
    }

.page-product .nav-dropdown.open .nav-btn::after {

        transform: rotate(45deg);
        color: rgba(244,247,252,0.86);
    }

.page-product .nav-btn.active {

        background:
            linear-gradient(180deg, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0.04) 30%, rgba(0,0,0,0.18) 100%),
            rgba(22,24,28,0.98);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.14),
            inset 0 -1px 0 rgba(255,255,255,0.03);
    }

.page-product .nav-dropdown .nav-btn.active {

        border: 1px solid rgba(111,135,255,0.38);
        background:
            linear-gradient(180deg, rgba(111,135,255,0.14) 0%, rgba(255,255,255,0.03) 24%, rgba(0,0,0,0.18) 100%),
            rgba(18,20,28,0.98);
        color: rgba(240,245,255,0.96);
        box-shadow:
            inset 0 1px 0 rgba(194,210,255,0.22),
            inset 0 -1px 0 rgba(111,135,255,0.14),
            0 0 0 1px rgba(111,135,255,0.06);
    }

.page-product .nav-dropdown .nav-btn.active::after {

        color: rgba(170,193,255,0.88);
    }

.page-product .nav-dropdown.open .nav-btn:not(.active) {

        background: rgba(255,255,255,0.03);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.06);
    }

.page-product .dropdown-content {

        position: static;
        top: auto;
        left: auto;
        right: auto;
        width: calc(100% - 12px);
        min-width: 0;
        display: none;
        margin-top: 0;
        margin-left: 12px;
        border-radius: 14px;
        border: 0 solid transparent;
        background:
            linear-gradient(180deg, rgba(111,135,255,0.08) 0%, rgba(255,255,255,0.024) 18%, rgba(0,0,0,0.04) 100%),
            rgba(8,9,13,0.96);
        box-shadow:
            inset 0 1px 0 rgba(214,224,255,0.07),
            inset 0 0 0 1px rgba(255,255,255,0.035);
        transform: none;
        overflow: hidden;
    }

.page-product .nav-dropdown:last-child .dropdown-content {

        left: auto;
        right: auto;
    }

.page-product .nav-dropdown:hover .dropdown-content {

        display: none;
        margin-top: 0;
        border-width: 0;
    }

.page-product .nav-dropdown:hover .nav-btn:not(.active) {

        background: rgba(255,255,255,0.018);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.05),
            inset 0 -1px 0 rgba(255,255,255,0.02);
    }

.page-product .nav-dropdown.open .dropdown-content {

        display: block;
        transform: none;
        margin-top: 10px;
        border-width: 1px;
        border-color: rgba(146,166,255,0.16);
    }

.page-product .dropdown-content a {

        padding: 13px 16px;
        font-size: 9px;
        letter-spacing: 0.16em;
    }

.page-product .dropdown-content a[aria-current="page"] {

        color: rgba(233,241,255,0.96);
        background:
            linear-gradient(90deg, rgba(111,135,255,0.14) 0%, rgba(111,135,255,0.04) 46%, transparent 100%),
            rgba(12,13,18,0.98);
        box-shadow: inset 2px 0 0 rgba(111,135,255,0.68);
    }

.page-product .panel-body {

        padding: 20px 16px 18px;
    }

.page-product .topic-body {

        padding: 0 16px 16px;
        font-size: 13.25px;
        line-height: 1.55;
    }

.page-product .topic-body p {

        padding-left: 0;
    }

.page-product .footer-nav {

        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0;
        padding: 0 0 calc(env(safe-area-inset-bottom, 0px));
        align-items: stretch;
        border-top: none;
        overflow: hidden;
        isolation: isolate;
        background: rgba(0,0,0,0.98);
        box-shadow:
            0 -20px 36px rgba(0,0,0,0.68),
            inset 0 1px 0 rgba(255,255,255,0.03),
            inset 0 10px 18px rgba(255,255,255,0.012);
    }

.page-product .footer-nav::before {

        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: 50%;
        width: 1px;
        transform: translateX(-50%);
        background: linear-gradient(180deg, rgba(0,0,0,0.92) 0%, rgba(10,10,12,0.76) 100%);
        pointer-events: none;
        z-index: 2;
    }

.page-product .footer-nav::after {

        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 1px;
        background:
            radial-gradient(18% 180% at 50% 50%, rgba(182,166,176,0.22) 0%, rgba(146,139,187,0.1) 38%, rgba(0,0,0,0) 72%),
            linear-gradient(90deg, rgba(96,111,224,0.74) 0%, rgba(96,111,224,0.7) 43.5%, rgba(122,124,210,0.68) 47.5%, rgba(156,145,178,0.66) 50%, rgba(195,170,136,0.66) 52.5%, rgba(218,186,118,0.7) 56.5%, rgba(226,190,109,0.74) 100%);
        box-shadow:
            0 0 10px rgba(96,111,224,0.12),
            0 0 12px rgba(226,190,109,0.1);
        pointer-events: none;
        z-index: 3;
    }

.page-product .footer-link {

        display: none;
    }

.page-product .footer-mobile-action {

        position: relative;
        z-index: 1;
        min-width: 0;
        min-height: 68px;
        padding: 12px 16px;
        border-radius: 0;
        border: 1px solid transparent;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.038) 0%, rgba(255,255,255,0.012) 18%, rgba(0,0,0,0) 100%) padding-box,
            linear-gradient(180deg, rgba(8,9,12,0.985) 0%, rgba(3,4,6,0.995) 100%) padding-box,
            linear-gradient(135deg, rgba(255,255,255,0.07), rgba(255,255,255,0.02)) border-box;
        box-shadow:
            none;
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.05),
            inset 0 -1px 0 rgba(255,255,255,0.02),
            inset 0 -18px 30px rgba(0,0,0,0.2);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        text-decoration: none;
        cursor: pointer;
        overflow: hidden;
        isolation: isolate;
        appearance: none;
        -webkit-appearance: none;
        -webkit-tap-highlight-color: transparent;
        transition: transform 0.22s var(--ease-premium), border-color 0.22s ease, box-shadow 0.22s ease, background 0.22s ease, color 0.22s ease;
    }

.page-product .footer-mobile-action::after {

        content: '';
        position: absolute;
        pointer-events: none;
    }

.page-product .footer-mobile-action::after {

        inset: 1px;
        border-radius: 0;
        background: linear-gradient(180deg, rgba(255,255,255,0.022) 0%, rgba(255,255,255,0.006) 16%, transparent 40%);
        opacity: 0.42;
        z-index: 0;
    }

.page-product .footer-mobile-content {

        position: relative;
        z-index: 1;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        width: 100%;
    }

@keyframes compact-chat-star-glow {
        0%, 100% {
            fill: #E2BE6D;
            stroke: #E2BE6D;
            transform: translate(0px, 1px) scale(1);
            filter: drop-shadow(0 0 0 rgba(201,160,80,0));
        }
        34% {
            fill: rgba(225,188,106,0.94);
            stroke: rgba(225,188,106,0.94);
            transform: translate(0px, 1px) scale(1.08);
            filter:
                drop-shadow(0 0 10px rgba(201,160,80,0.32))
                drop-shadow(0 0 16px rgba(201,160,80,0.14));
        }
        58% {
            fill: rgba(241,214,142,0.98);
            stroke: rgba(241,214,142,0.98);
            transform: translate(0px, 1px) scale(1.18);
            filter:
                drop-shadow(0 0 14px rgba(230,196,113,0.5))
                drop-shadow(0 0 24px rgba(230,196,113,0.3));
        }
    }

.page-product .footer-mobile-orb {

        width: 28px;
        height: 28px;
        flex: 0 0 28px;
        border-radius: 999px;
        border: 1px solid rgba(255,255,255,0.08);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background:
            radial-gradient(60% 60% at 30% 20%, rgba(255,255,255,0.1), rgba(6,6,6,0.88) 60%),
            rgba(8,8,8,0.94);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.04),
            0 0 0 1px rgba(0,0,0,0.28);
    }

.page-product .footer-mobile-orb svg {

        width: 14px;
        height: 14px;
        display: block;
    }

.page-product .footer-mobile-resource {

        border-width: 0;
        border-style: solid;
    }

.page-product .footer-mobile-chat {

        border-width: 0;
        border-style: solid;
    }

.page-product .footer-mobile-resource {

        background:
            linear-gradient(180deg, rgba(255,255,255,0.038) 0%, rgba(255,255,255,0.012) 18%, rgba(0,0,0,0) 100%),
            radial-gradient(135% 125% at 0% 0%, rgba(126,148,255,0.085) 0%, rgba(126,148,255,0.024) 34%, rgba(0,0,0,0) 70%),
            linear-gradient(180deg, rgba(8,9,12,0.985) 0%, rgba(3,4,6,0.995) 100%);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.06),
            inset 1px 0 0 rgba(146,170,255,0.14);
    }

.page-product .footer-mobile-resource .footer-mobile-orb svg {

        stroke: #7098E8;
        fill: none;
        stroke-width: 1.7;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

.page-product .footer-mobile-resource .footer-mobile-label {

        position: relative;
        z-index: 1;
        font-size: 10.9px;
        font-weight: 700;
        line-height: 1.12;
        letter-spacing: 0.22em;
        text-transform: uppercase;
        color: rgba(233,239,252,0.92);
        text-shadow: none;
    }

.page-product .footer-mobile-chat {

        background:
            linear-gradient(180deg, rgba(255,255,255,0.038) 0%, rgba(255,255,255,0.012) 18%, rgba(0,0,0,0) 100%),
            radial-gradient(135% 125% at 100% 0%, rgba(226,190,109,0.085) 0%, rgba(226,190,109,0.024) 34%, rgba(0,0,0,0) 70%),
            linear-gradient(180deg, rgba(8,9,12,0.985) 0%, rgba(3,4,6,0.995) 100%);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.06),
            inset 1px 0 0 rgba(227,194,118,0.12);
        color: rgba(235,241,252,0.92);
    }

.page-product .footer-mobile-chat .footer-mobile-orb svg {

        width: 18px;
        height: 18px;
        fill: #E2BE6D;
        stroke: #E2BE6D;
        stroke-width: 0.45px;
        stroke-linejoin: round;
        paint-order: stroke fill;
        shape-rendering: geometricPrecision;
        transform: translate(0px, 1px);
        animation: compact-chat-star-glow 1.85s cubic-bezier(0.4, 0, 0.2, 1) infinite;
    }

.page-product .footer-mobile-chat .footer-mobile-label {

        position: relative;
        z-index: 1;
        font-size: 10.9px;
        font-weight: 700;
        line-height: 1.12;
        letter-spacing: 0.22em;
        text-transform: uppercase;
        color: rgba(244,236,214,0.92);
        text-shadow: none;
    }

.page-product .footer-mobile-action:hover,
.page-product .footer-mobile-action:focus-visible {

        transform: translateY(-1px);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.08),
            inset 0 -1px 0 rgba(255,255,255,0.03);
    }

.page-product .footer-mobile-resource:hover,
.page-product .footer-mobile-resource:focus-visible {

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.08),
            inset 1px 0 0 rgba(146,170,255,0.18);
        background:
            linear-gradient(180deg, rgba(255,255,255,0.048) 0%, rgba(255,255,255,0.016) 18%, rgba(0,0,0,0) 100%),
            radial-gradient(135% 125% at 0% 0%, rgba(156,177,255,0.11) 0%, rgba(156,177,255,0.032) 36%, rgba(0,0,0,0) 70%),
            linear-gradient(180deg, rgba(8,9,12,0.985) 0%, rgba(3,4,6,0.995) 100%);
    }

.page-product .footer-mobile-chat:hover,
.page-product .footer-mobile-chat:focus-visible {

        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.08),
            inset 1px 0 0 rgba(227,194,118,0.16);
        background:
            linear-gradient(180deg, rgba(255,255,255,0.048) 0%, rgba(255,255,255,0.016) 18%, rgba(0,0,0,0) 100%),
            radial-gradient(135% 125% at 100% 0%, rgba(242,212,146,0.11) 0%, rgba(242,212,146,0.032) 36%, rgba(0,0,0,0) 70%),
            linear-gradient(180deg, rgba(8,9,12,0.985) 0%, rgba(3,4,6,0.995) 100%);
    }

.page-product .chat-widget {

        display: none !important;
    }

.page-product .chat-panel {

        bottom: calc(12px + var(--product-compact-footer-h) + env(safe-area-inset-bottom, 0px));
        right: 10px;
        max-width: calc(100vw - 20px);
    }

.page-product .chat-overlay {

        background:
            radial-gradient(ellipse 100% 80% at 50% 100%, rgba(90,120,255,0.1) 0%, rgba(2,3,6,0.48) 48%, rgba(2,3,6,0.72) 100%);
        -webkit-backdrop-filter: blur(6px) saturate(108%);
        backdrop-filter: blur(6px) saturate(108%);
    }

.page-product .mobile-support-tray-toggle,
.page-product .mobile-support-sheet,
.page-product .mobile-support-sheet-backdrop {

        display: block;
    }

.page-product .mobile-support-tray-toggle {

        position: fixed;
        left: 10px;
        right: auto;
        width: min(258px, calc(100vw - 30px - var(--product-phone-chat-size) - var(--product-phone-chat-gap)));
        bottom: calc(var(--product-phone-tray-gap) + var(--product-compact-footer-h) + env(safe-area-inset-bottom, 0px));
        min-height: var(--product-phone-tray-h);
        padding: 10px 18px;
        border-radius: 16px;
        border: 1px solid rgba(255,255,255,0.18);
        background:
            linear-gradient(90deg, rgba(111,135,255,0.08) 0%, transparent 72px),
            linear-gradient(180deg, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0) 100%),
            rgba(4,5,9,0.96);
        box-shadow:
            0 18px 34px rgba(0,0,0,0.52),
            inset 0 1px 0 rgba(255,255,255,0.1),
            inset 3px 0 0 rgba(111,135,255,0.76);
        color: rgba(240,245,255,0.96);
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        cursor: pointer;
        z-index: 995;
        transition: transform 0.24s var(--ease-premium), opacity 0.24s ease, box-shadow 0.24s ease, border-color 0.24s ease, background 0.24s ease;
        -webkit-tap-highlight-color: transparent;
    }

.page-product .mobile-support-tray-copy {

        display: flex;
        flex-direction: column;
        gap: 0;
        min-width: 0;
        text-align: left;
    }

.page-product .mobile-support-tray-eyebrow {

        display: none;
    }

.page-product .mobile-support-tray-title {

        font-size: 11.5px;
        font-weight: 700;
        line-height: 1.1;
        letter-spacing: 0.22em;
        text-transform: uppercase;
        color: transparent;
        background-image: linear-gradient(135deg,
            rgba(214,228,255,0.98),
            var(--neon-blue),
            var(--neon-purple),
            rgba(206,186,255,0.96));
        background-size: 230% 230%;
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        animation: learn-toggle-shift var(--interactive-shift-duration) ease-in-out infinite;
    }

.page-product .mobile-support-tray-badge {

        display: none;
    }

.page-product .mobile-support-sheet-backdrop {

        position: fixed;
        inset: 0;
        background:
            radial-gradient(ellipse 100% 80% at 50% 100%, rgba(90,120,255,0.1) 0%, rgba(2,3,6,0.48) 48%, rgba(2,3,6,0.72) 100%);
        -webkit-backdrop-filter: blur(6px) saturate(108%);
        backdrop-filter: blur(6px) saturate(108%);
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.26s ease, visibility 0.26s ease;
        z-index: 1002;
    }

.page-product .mobile-support-sheet {

        position: fixed;
        left: 10px;
        right: 10px;
        bottom: calc(12px + var(--product-compact-footer-h) + env(safe-area-inset-bottom, 0px));
        max-height: min(78vh, 520px);
        overflow: auto;
        padding: 18px 0 0;
        border-radius: 28px 34px 24px 16px;
        border: 1px solid rgba(111,135,255,0.18);
        background:
            linear-gradient(90deg, rgba(111,135,255,0.08) 0%, transparent 96px),
            linear-gradient(180deg, rgba(255,255,255,0.02) 0%, rgba(255,255,255,0) 74px),
            linear-gradient(145deg, rgba(8,10,16,0.28) 0%, rgba(2,2,2,0.72) 48%, rgba(0,0,0,0.8) 100%);
        -webkit-backdrop-filter: blur(12px) saturate(112%);
        backdrop-filter: blur(12px) saturate(112%);
        box-shadow:
            0 28px 54px rgba(0,0,0,0.72),
            inset 0 1px 0 rgba(255,255,255,0.04),
            inset 4px 0 0 var(--neon-blue);
        transform: translateY(calc(100% + 24px));
        opacity: 0;
        visibility: hidden;
        transition: transform 0.28s var(--ease-premium), opacity 0.28s ease, visibility 0.28s ease;
        z-index: 1004;
    }

.page-product .mobile-support-sheet-head {

        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 12px;
        padding: 0 18px;
    }

.page-product .mobile-support-sheet-copy {

        min-width: 0;
    }

.page-product .mobile-support-sheet-kicker {

        display: none;
    }

.page-product .mobile-support-sheet-title {

        margin: 0;
        font-size: clamp(26px, 7.8vw, 31px);
        line-height: 1.04;
        letter-spacing: 0.04em;
        color: transparent;
        background-image: linear-gradient(135deg,
            rgba(214,228,255,0.98),
            var(--neon-blue),
            var(--neon-purple),
            rgba(206,186,255,0.96));
        background-size: 230% 230%;
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        animation: learn-toggle-shift var(--interactive-shift-duration) ease-in-out infinite;
        font-family: 'Montserrat', 'Arial', sans-serif;
        text-transform: uppercase;
    }

.page-product .mobile-support-sheet-desc {

        display: none;
    }

.page-product .mobile-support-sheet-close {

        width: 34px;
        height: 34px;
        border-radius: 999px;
        border: none;
        background: #050505;
        color: transparent;
        cursor: pointer;
        font-size: 0;
        text-indent: -9999px;
        line-height: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        position: relative;
        padding: 0;
        flex-shrink: 0;
        overflow: hidden;
        box-shadow:
            inset 3px 3px 6px #000000,
            inset -1px -1px 4px #1a1a1a,
            0 1px 0 rgba(255,255,255,0.1);
        transition:
            transform var(--popup-transition-duration) var(--popup-transition-ease),
            box-shadow var(--popup-transition-duration) var(--popup-transition-ease);
        outline: none;
    }

.page-product .mobile-support-sheet-close:focus {

        outline: none;
    }

.page-product .mobile-support-sheet-close::before,
.page-product .mobile-support-sheet-close::after {

        content: '';
        position: absolute;
        width: 10px;
        height: 2px;
        border-radius: 2px;
        background: var(--neon-blue);
        box-shadow: 0 0 8px rgba(111,135,255,0.6);
        transition: transform 0.28s ease, width 0.28s ease;
    }

.page-product .mobile-support-sheet-close::before {
 transform: rotate(45deg); }

.page-product .mobile-support-sheet-close::after {
 transform: rotate(-45deg); }

.page-product .mobile-support-sheet-close:hover,
.page-product .mobile-support-sheet-close:active {

        transform: none;
        box-shadow:
            inset 3px 3px 6px #000000,
            inset -1px -1px 4px #1a1a1a,
            0 1px 0 rgba(255,255,255,0.1);
    }

.page-product .mobile-support-sheet-close:hover::before,
.page-product .mobile-support-sheet-close:hover::after,
.page-product .mobile-support-sheet-close:active::before,
.page-product .mobile-support-sheet-close:active::after {

        width: 11px;
        background: rgba(239,68,68,0.98);
        box-shadow: 0 0 10px rgba(239,68,68,0.8);
    }

.page-product .mobile-support-sheet-close:hover::before,
.page-product .mobile-support-sheet-close:active::before {
 transform: rotate(225deg); }

.page-product .mobile-support-sheet-close:hover::after,
.page-product .mobile-support-sheet-close:active::after {
 transform: rotate(135deg); }

.page-product .mobile-support-sheet-close:active {

        transform: scale(0.95);
    }

.page-product .chat-panel .chat-close,
.page-product .chat-panel .chat-thread-close {

        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        min-height: 34px !important;
        border-radius: 999px !important;
        border: none !important;
        background: #050505 !important;
        color: transparent !important;
        cursor: pointer;
        font-size: 0 !important;
        text-indent: -9999px !important;
        line-height: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: relative !important;
        padding: 0 !important;
        overflow: hidden !important;
        box-shadow:
            inset 3px 3px 6px #000000,
            inset -1px -1px 4px #1a1a1a,
            0 1px 0 rgba(255,255,255,0.1) !important;
        transition:
            transform var(--popup-transition-duration) var(--popup-transition-ease),
            box-shadow var(--popup-transition-duration) var(--popup-transition-ease) !important;
        outline: none !important;
        -webkit-appearance: none;
        appearance: none;
    }

.page-product .chat-panel .chat-close:focus,
.page-product .chat-panel .chat-thread-close:focus {

        outline: none !important;
    }

.page-product .chat-panel .chat-close svg,
.page-product .chat-panel .chat-thread-close svg {

        display: none !important;
    }

.page-product .chat-panel .chat-close::before,
.page-product .chat-panel .chat-close::after,
.page-product .chat-panel .chat-thread-close::before,
.page-product .chat-panel .chat-thread-close::after {

        content: '';
        position: absolute;
        width: 10px;
        height: 2px;
        border-radius: 2px;
        background: var(--neon-blue);
        box-shadow: 0 0 8px rgba(111,135,255,0.6);
        transition: transform 0.28s ease, width 0.28s ease;
    }

.page-product .chat-panel .chat-close::before,
.page-product .chat-panel .chat-thread-close::before {
 transform: rotate(45deg); }

.page-product .chat-panel .chat-close::after,
.page-product .chat-panel .chat-thread-close::after {
 transform: rotate(-45deg); }

.page-product .chat-panel .chat-close:hover,
.page-product .chat-panel .chat-close:active,
.page-product .chat-panel .chat-thread-close:hover,
.page-product .chat-panel .chat-thread-close:active {

        transform: none;
        box-shadow:
            inset 3px 3px 6px #000000,
            inset -1px -1px 4px #1a1a1a,
            0 1px 0 rgba(255,255,255,0.1) !important;
    }

.page-product .chat-panel .chat-close:hover::before,
.page-product .chat-panel .chat-close:hover::after,
.page-product .chat-panel .chat-close:active::before,
.page-product .chat-panel .chat-close:active::after,
.page-product .chat-panel .chat-thread-close:hover::before,
.page-product .chat-panel .chat-thread-close:hover::after,
.page-product .chat-panel .chat-thread-close:active::before,
.page-product .chat-panel .chat-thread-close:active::after {

        width: 11px;
        background: rgba(239,68,68,0.98);
        box-shadow: 0 0 10px rgba(239,68,68,0.8);
    }

.page-product .chat-panel .chat-close:hover::before,
.page-product .chat-panel .chat-close:active::before,
.page-product .chat-panel .chat-thread-close:hover::before,
.page-product .chat-panel .chat-thread-close:active::before {
 transform: rotate(225deg); }

.page-product .chat-panel .chat-close:hover::after,
.page-product .chat-panel .chat-close:active::after,
.page-product .chat-panel .chat-thread-close:hover::after,
.page-product .chat-panel .chat-thread-close:active::after {
 transform: rotate(135deg); }

.page-product .chat-panel .chat-back {

        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        min-height: 34px !important;
        border-radius: 999px !important;
        border: none !important;
        background: #050505 !important;
        color: var(--neon-blue) !important;
        cursor: pointer;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: relative !important;
        padding: 0 !important;
        overflow: hidden !important;
        box-shadow:
            inset 3px 3px 6px #000000,
            inset -1px -1px 4px #1a1a1a,
            0 1px 0 rgba(255,255,255,0.1) !important;
        transition:
            transform var(--popup-transition-duration) var(--popup-transition-ease),
            box-shadow var(--popup-transition-duration) var(--popup-transition-ease),
            color var(--popup-transition-duration) var(--popup-transition-ease) !important;
        outline: none !important;
        -webkit-appearance: none;
        appearance: none;
    }

.page-product .chat-panel .chat-back:focus {

        outline: none !important;
    }

.page-product .chat-panel .chat-back svg {

        width: 13px !important;
        height: 13px !important;
        stroke: currentColor !important;
        fill: none !important;
        stroke-width: 2 !important;
        transition: transform 0.25s ease, stroke 0.25s ease !important;
    }

.page-product .chat-panel .chat-back:hover,
.page-product .chat-panel .chat-back:active {

        transform: none;
        color: #8AA0FF !important;
        box-shadow:
            inset 3px 3px 6px #000000,
            inset -1px -1px 4px #1a1a1a,
            0 0 12px rgba(111,135,255,0.24),
            0 1px 0 rgba(255,255,255,0.1) !important;
    }

.page-product .chat-panel .chat-back:active {

        transform: scale(0.95);
    }

.page-product .chat-thread-header {

        display: grid !important;
        grid-template-columns: 34px minmax(0, 1fr) 34px;
        align-items: center !important;
        column-gap: 10px;
    }

.page-product .chat-thread-left {

        display: contents !important;
    }

.page-product .chat-thread-label {

        grid-column: 2;
        justify-self: center;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center;
        min-width: 0;
    }

.page-product .chat-thread-right {

        grid-column: 3;
        justify-self: end;
        display: inline-flex !important;
        align-items: center !important;
    }

.page-product .mobile-support-list {

        display: flex;
        flex-direction: column;
        gap: 0;
        margin-top: 6px;
        padding: 0 0 10px;
    }

.page-product .mobile-support-action {

        -webkit-appearance: none;
        appearance: none;
        position: relative;
        width: 100%;
        min-height: 52px;
        padding: 16px 24px;
        border: none;
        border-left: 3px solid transparent;
        border-radius: 0;
        background-color: transparent;
        background-image: linear-gradient(rgba(255,255,255,0.035), rgba(255,255,255,0.035));
        background-repeat: no-repeat;
        background-position: 24px 100%;
        background-size: calc(100% - 24px) 1px;
        color: rgba(248,250,252,0.92);
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0;
        text-align: left;
        box-shadow: none;
        cursor: pointer;
        overflow: hidden;
        isolation: isolate;
        transition: background 0.24s ease, color 0.24s ease, border-left-color 0.24s ease;
        -webkit-tap-highlight-color: transparent;
    }

.page-product .mobile-support-action::after {

        content: '';
        position: absolute;
        inset: auto;
        left: 0;
        width: 0;
        height: 0;
        pointer-events: none;
        opacity: 0;
        display: block;
        box-sizing: border-box;
        border: 0 solid transparent;
        z-index: 0;
        will-change: width, height, opacity;
    }

.page-product .mobile-support-action-label {

        position: relative;
        z-index: 1;
        font-size: 15px;
        font-weight: 500;
        line-height: 1.3;
        color: inherit;
    }

.page-product .mobile-support-action-meta {

        display: none;
    }

.page-product .mobile-support-action:last-child {

        background-image: none;
    }

.page-product .mobile-support-action::before {

        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 0;
        height: 0;
        border-top: 2px solid rgba(129,157,255,0.82);
        border-right: 2px solid rgba(129,157,255,0.82);
        border-top-left-radius: 12px;
        border-top-right-radius: 12px;
        pointer-events: none;
        opacity: 0;
        z-index: 0;
    }

.page-product .mobile-support-action:hover,
.page-product .mobile-support-action:focus-visible {

        background:
            linear-gradient(90deg, rgba(111,135,255,0.16) 0%, rgba(154,100,255,0.08) 100%),
            linear-gradient(90deg, rgba(0,0,0,0.98), rgba(0,0,0,0.98));
        background-position: 0 0;
        background-repeat: no-repeat;
        background-size: 230% 230%, 100% 100%;
        animation:
            resource-link-shift var(--interactive-shift-duration) ease-in-out infinite,
            learn-toggle-shift var(--interactive-shift-duration) ease-in-out infinite;
        color: rgba(255,255,255,0.98);
        border-left-color: rgba(129,157,255,0.82);
        border-radius: 12px;
        box-shadow: inset 1px 0 0 rgba(129,157,255,0.82);
    }

.page-product .mobile-support-action:hover::before,
.page-product .mobile-support-action:hover::after,
.page-product .mobile-support-action:focus-visible::before,
.page-product .mobile-support-action:focus-visible::after {

        opacity: 1;
        filter: drop-shadow(0 0 3px rgba(112,152,232,0.3));
    }

.page-product .mobile-support-action:hover::before,
.page-product .mobile-support-action:focus-visible::before {

        animation: resourceSnakeTopFromLeft 0.66s ease-out forwards;
    }

.page-product .mobile-support-action:hover::after,
.page-product .mobile-support-action:focus-visible::after {

        bottom: 0;
        border-bottom: 2px solid rgba(129,157,255,0.82);
        border-right: 2px solid rgba(129,157,255,0.82);
        border-bottom-left-radius: 12px;
        border-bottom-right-radius: 12px;
        animation: resourceSnakeBottomFromLeft 0.66s ease-out forwards;
    }

.page-product .mobile-support-tray-toggle {

        display: none !important;
    }

body.page-product.product-support-open .mobile-support-tray-toggle {

        opacity: 0;
        transform: translateY(10px);
        pointer-events: none;
    }

body.page-product.product-support-open .mobile-support-sheet-backdrop {

        opacity: 1;
        visibility: visible;
    }

body.page-product.product-support-open .mobile-support-sheet {

        transform: translateY(0);
        opacity: 1;
        visibility: visible;
    }

body.page-product.product-support-open .chat-widget {

        opacity: 0;
        pointer-events: none;
        transform: translateY(10px);
    }

body.page-product.chat-open .mobile-support-tray-toggle,
body.page-product.chat-open .mobile-support-sheet,
body.page-product.chat-open .mobile-support-sheet-backdrop {

        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

.page-product .chat-panel,
.page-product .chat-panel.is-thread {

        left: 10px;
        right: 10px;
        width: auto;
        max-width: none;
    }

.page-product .chat-overlay {

        background:
            linear-gradient(180deg, rgba(8,10,16,0.36) 0%, rgba(8,10,16,0.34) 100%),
            radial-gradient(ellipse 140% 108% at 50% 100%, rgba(255,255,255,0.05) 0%, rgba(15,17,24,0.34) 38%, rgba(7,8,12,0.52) 70%, rgba(4,5,8,0.66) 100%),
            radial-gradient(circle at 50% 14%, rgba(255,255,255,0.035) 0%, transparent 42%);
        -webkit-backdrop-filter: blur(14px) saturate(106%) brightness(0.92);
        backdrop-filter: blur(14px) saturate(106%) brightness(0.92);
    }

.page-product .chat-panel {

        background:
            linear-gradient(180deg, rgba(255,255,255,0.018) 0%, rgba(255,255,255,0.004) 18%, rgba(255,255,255,0) 48%),
            rgba(8,8,8,0.30);
        border: 1px solid rgba(236,212,150,0.24);
        border-left-width: 3px;
        border-left-color: rgba(226,190,109,0.9);
        box-shadow:
            0 28px 54px rgba(0,0,0,0.52),
            0 0 12px rgba(226,190,109,0.12),
            inset 0 1px 0 rgba(255,255,255,0.04),
            inset 3px 0 0 rgba(226,190,109,0.86);
        -webkit-backdrop-filter: blur(18px) saturate(118%);
        backdrop-filter: blur(18px) saturate(118%);
    }

.page-product .chat-thread-header {

        background:
            linear-gradient(180deg, rgba(255,255,255,0.075) 0%, rgba(255,255,255,0.018) 34%, rgba(7,8,12,0.48) 100%),
            rgba(12,12,15,0.62);
        border: 1px solid rgba(255,255,255,0.08);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.06),
            0 12px 24px rgba(0,0,0,0.34);
        -webkit-backdrop-filter: blur(14px) saturate(104%);
        backdrop-filter: blur(14px) saturate(104%);
    }

.page-product .chat-messages {

        position: relative;
        isolation: isolate;
        overflow: hidden;
        background: rgba(10,10,10,0.18);
        border: 1px solid rgba(255,255,255,0.07);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.035),
            0 12px 28px rgba(0,0,0,0.12);
        -webkit-backdrop-filter: blur(28px) saturate(118%) brightness(0.98);
        backdrop-filter: blur(28px) saturate(118%) brightness(0.98);
    }

.page-product .chat-messages::before {

        content: '';
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        background: linear-gradient(180deg, rgba(255,255,255,0.02) 0%, rgba(255,255,255,0.006) 22%, transparent 52%);
        opacity: 0.42;
    }

.page-product .chat-messages > * {

        position: relative;
        z-index: 1;
    }

.page-product .chat-messages .chat-selector-shell {

        background:
            linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.016) 22%, rgba(5,6,9,0.24) 100%),
            radial-gradient(120% 120% at 15% 0%, rgba(255,255,255,0.035), transparent 58%),
            rgba(17,17,21,0.5);
        border: 1px solid rgba(255,255,255,0.08);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.05),
            0 16px 30px rgba(0,0,0,0.2);
        -webkit-backdrop-filter: blur(15px) saturate(103%);
        backdrop-filter: blur(15px) saturate(103%);
    }

.page-product .chat-messages .chat-selector-btn {

        background:
            linear-gradient(180deg, rgba(255,255,255,0.08) 0%, rgba(255,255,255,0.024) 34%, rgba(5,6,10,0.2) 100%),
            rgba(13,14,18,0.48);
        box-shadow:
            inset 0 0 0 1px rgba(255,255,255,0.08),
            inset 0 1px 0 rgba(255,255,255,0.08),
            0 10px 20px rgba(0,0,0,0.18);
        -webkit-backdrop-filter: blur(14px) saturate(103%);
        backdrop-filter: blur(14px) saturate(103%);
    }

.page-product .chat-input-row {

        gap: 10px;
        padding: 10px 12px;
        border-radius: 12px;
        overflow: hidden;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.075) 0%, rgba(255,255,255,0.018) 34%, rgba(7,8,12,0.48) 100%),
            rgba(12,12,15,0.62);
        border: 1px solid rgba(255,255,255,0.08);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.06),
            0 12px 24px rgba(0,0,0,0.34);
        -webkit-backdrop-filter: blur(14px) saturate(104%);
        backdrop-filter: blur(14px) saturate(104%);
    }

.page-product .chat-input-row:focus-within {

        gap: 10px;
        padding: 10px 12px;
        border-radius: 12px;
        overflow: hidden;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.075) 0%, rgba(255,255,255,0.018) 34%, rgba(7,8,12,0.48) 100%),
            rgba(12,12,15,0.62);
        border: 1px solid rgba(255,255,255,0.08);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.06),
            0 12px 24px rgba(0,0,0,0.34);
        -webkit-backdrop-filter: blur(14px) saturate(104%);
        backdrop-filter: blur(14px) saturate(104%);
    }

.page-product .chat-input {

        background: rgba(8,8,11,0.22);
        box-shadow:
            inset 0 0 0 1px rgba(255,255,255,0.035),
            inset 0 1px 0 rgba(255,255,255,0.02);
        -webkit-backdrop-filter: blur(12px) saturate(102%);
        backdrop-filter: blur(12px) saturate(102%);
    }

.page-product .chat-input:hover {

        background: rgba(8,8,11,0.26);
        box-shadow:
            inset 0 0 0 1px rgba(255,255,255,0.05),
            inset 0 1px 0 rgba(255,255,255,0.024);
    }

.page-product .chat-input:focus,
.page-product .chat-input:focus-visible {

        outline: none;
        background:
            linear-gradient(180deg, rgba(111,135,255,0.08) 0%, rgba(154,100,255,0.04) 100%),
            rgba(10,10,14,0.28);
        box-shadow:
            inset 0 0 0 1px rgba(255,255,255,0.055),
            inset 0 1px 0 rgba(255,255,255,0.026),
            0 0 0 1px rgba(111,135,255,0.22),
            0 0 14px rgba(111,135,255,0.14),
            0 0 22px rgba(154,100,255,0.08);
    }

.page-product .chat-send {

        background:
            linear-gradient(180deg, rgba(255,255,255,0.14) 0%, rgba(255,255,255,0.045) 36%, rgba(8,9,12,0.24) 100%),
            rgba(30,30,34,0.56);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.28),
            0 10px 22px rgba(0,0,0,0.28);
        -webkit-backdrop-filter: blur(12px) saturate(103%);
        backdrop-filter: blur(12px) saturate(103%);
    }

}
/* End Step 2 authoritative shared product shell overrides. */
/* Step 2 verification fixes: keep product chrome above the alignment tool and restore tablet compact controls. */
@media (max-width: 640px) {
    body.page-product [data-alignment-tool] {
        display: flex !important;
        bottom: 0 !important;
        z-index: 21026 !important;
    }

    .page-product .main-header,
    .page-product .footer-nav {
        z-index: 21025;
    }

    .page-product .mobile-nav-toggle,
    .page-product .main-nav {
        z-index: 21011;
    }

    .page-product .mobile-support-sheet-backdrop {
        z-index: 21020;
    }

    .page-product .mobile-support-sheet {
        z-index: 21030;
    }

.page-product .chat-panel,
    .page-product .chat-panel.is-thread {
        z-index: 21040;
    }
}

/* Product pages (iPad Mini landscape): keep the hero shell/glass on the approved
   finished-page Health baseline so this narrower tablet tier does not drift page-to-page. */
@media (min-width: 961px) and (max-width: 1024px) and (orientation: landscape) and (pointer: coarse) {
    .page-product .product-hero {
        min-height: 381px;
    }

    .page-product .product-hero-content {
        min-height: 351px;
    }
}

/* Shared product-page logo sizing: keep new rollouts aligned with the approved
   finished-page Health shell across phone and tablet breakpoints. */
@media (max-width: 640px) {
    .page-product .logo-img {
        width: auto;
        height: auto;
        max-height: 33px;
        max-width: 208px;
        display: block;
        object-fit: contain;
    }
}

@media (min-width: 744px) and (max-width: 1024px) and (orientation: portrait) {
    .page-product .logo-img {
        width: auto;
        height: auto;
        max-height: 40px;
        max-width: 283px;
        display: block;
        object-fit: contain;
    }
}

@media (min-width: 744px) and (max-width: 960px) and (orientation: landscape) {
    .page-product .main-header .logo-img {
        width: auto;
        height: 38px;
        max-height: none;
        max-width: 230px;
        display: block;
        object-fit: contain;
        transform: none;
        transform-origin: center;
    }
}

@media (min-width: 821px) and (max-width: 1366px) and (orientation: portrait), (min-width: 961px) and (max-width: 1366px) and (orientation: landscape) and (pointer: coarse) {
    .page-product .logo-img {
        width: auto;
        height: auto;
        max-height: 50px;
        max-width: 360px;
    }
}

@media (min-width: 768px) and (max-width: 960px), (min-width: 821px) and (max-width: 1024px) and (orientation: portrait), (min-width: 961px) and (max-width: 1180px) and (orientation: landscape), (min-width: 1181px) and (max-width: 1366px) and (orientation: landscape) and (pointer: coarse) {
    body.page-product {
        --product-compact-header-h: 78px;
        --product-compact-footer-h: 78px;
        --product-phone-tray-h: 0px;
        --product-phone-tray-gap: 0px;
        --product-phone-chat-size: 0px;
        --product-phone-chat-gap: 0px;
    }

    body.page-product [data-alignment-tool] {
        display: flex !important;
        bottom: 0 !important;
        z-index: 21026 !important;
    }

    .page-product .scroll-root {
        top: calc(var(--product-compact-header-h) + env(safe-area-inset-top, 0px));
        bottom: calc(var(--product-compact-footer-h) + env(safe-area-inset-bottom, 0px));
    }

    .page-product .main-header {
        display: grid;
        grid-template-columns: 52px minmax(0, 1fr) 52px;
        height: var(--product-compact-header-h);
        min-height: var(--product-compact-header-h);
        gap: 0;
        padding: 0 16px;
        align-items: center;
        justify-content: stretch;
        box-sizing: border-box;
        z-index: 21025;
    }

    .page-product .logo-container {
        grid-column: 2;
        width: 100%;
        flex: none;
        padding: 0;
        display: flex;
        justify-content: center;
        align-self: center;
        align-items: center;
        transform: none;
    }

    .page-product .mobile-nav-spacer {
        display: block;
        grid-column: 1;
        width: 52px;
        height: 52px;
    }

    .page-product .mobile-nav-toggle {
        display: inline-flex;
        z-index: 21011;
    }

    .page-product .footer-nav {
        display: grid;
        z-index: 21025;
    }

    .page-product .footer-link {
        display: none;
    }

    .page-product .footer-mobile-action {
        display: inline-flex;
    }

    .page-product .footer-mobile-resource,
    .page-product .footer-mobile-chat {
        color: inherit !important;
        appearance: none !important;
        -webkit-appearance: none !important;
    }

    .page-product .footer-mobile-content {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 14px !important;
    }

    .page-product .footer-mobile-orb {
        width: 32px !important;
        height: 32px !important;
        flex: 0 0 32px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        color: inherit !important;
    }

    .page-product .footer-mobile-orb svg {
        width: 16px !important;
        height: 16px !important;
        display: block !important;
    }

    .page-product .footer-mobile-resource .footer-mobile-orb svg,
    .page-product .footer-mobile-resource .footer-mobile-orb svg * {
        fill: none !important;
        stroke: #7098E8 !important;
        stroke-width: 1.7 !important;
        stroke-linecap: round !important;
        stroke-linejoin: round !important;
    }

    .page-product .footer-mobile-chat .footer-mobile-orb svg,
    .page-product .footer-mobile-chat .footer-mobile-orb svg * {
        fill: #E2BE6D !important;
        stroke: #E2BE6D !important;
    }

    .page-product .footer-mobile-chat .footer-mobile-orb svg {
        width: 21px !important;
        height: 21px !important;
        stroke-width: 0.45px !important;
        stroke-linejoin: round !important;
        paint-order: stroke fill !important;
        shape-rendering: geometricPrecision !important;
        transform: translate(0px, 1px) !important;
    }

    .page-product .footer-mobile-label {
        position: relative !important;
        z-index: 1 !important;
        display: inline-block !important;
        color: rgba(238, 242, 252, 0.92) !important;
        -webkit-text-fill-color: currentColor !important;
        background: none !important;
        text-align: center !important;
    }

    .page-product .footer-mobile-resource .footer-mobile-label {
        color: rgba(233, 239, 252, 0.92) !important;
        font-size: 11.4px !important;
        font-weight: 700 !important;
        line-height: 1.12 !important;
        letter-spacing: 0.24em !important;
        text-transform: uppercase !important;
        text-shadow: none !important;
    }

    .page-product .footer-mobile-chat .footer-mobile-label {
        color: rgba(244, 236, 214, 0.92) !important;
        font-size: 11.4px !important;
        font-weight: 700 !important;
        line-height: 1.12 !important;
        letter-spacing: 0.24em !important;
        text-transform: uppercase !important;
        text-shadow: none !important;
    }

    .page-product .mobile-support-sheet,
    .page-product .mobile-support-sheet-backdrop {
        display: block;
    }

    .page-product .mobile-support-tray-toggle {
        display: none !important;
    }

    .page-product .mobile-support-sheet-backdrop {
        z-index: 21020;
    }

    .page-product .mobile-support-sheet {
        z-index: 21030;
    }

    .page-product .mobile-support-sheet-head {
        align-items: center !important;
        justify-content: space-between !important;
        gap: 14px !important;
        margin-bottom: 12px !important;
        padding: 0 22px !important;
    }

    .page-product .mobile-support-sheet-copy {
        min-width: 0 !important;
    }

    .page-product .mobile-support-sheet-kicker {
        display: none !important;
    }

    .page-product .mobile-support-sheet-title {
        display: block !important;
        margin: 0 !important;
        font-size: clamp(30px, 5vw, 36px) !important;
        line-height: 1.02 !important;
        letter-spacing: 0.04em !important;
        color: transparent !important;
        background-image: linear-gradient(135deg,
            rgba(214,228,255,0.98),
            var(--neon-blue),
            var(--neon-purple),
            rgba(206,186,255,0.96)) !important;
        background-size: 230% 230% !important;
        -webkit-background-clip: text !important;
        background-clip: text !important;
        -webkit-text-fill-color: transparent !important;
        animation: learn-toggle-shift var(--interactive-shift-duration) ease-in-out infinite !important;
        font-family: 'Montserrat', 'Arial', sans-serif !important;
        text-transform: uppercase !important;
    }

    .page-product .mobile-support-sheet-desc {
        display: none !important;
    }

    .page-product .mobile-support-sheet-close {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        min-height: 38px !important;
        padding: 0 !important;
        border: none !important;
        border-radius: 999px !important;
        background: #050505 !important;
        color: transparent !important;
        font-size: 0 !important;
        line-height: 0 !important;
        text-indent: -9999px !important;
        appearance: none !important;
        -webkit-appearance: none !important;
        box-shadow:
            inset 3px 3px 6px #000000,
            inset -1px -1px 4px #1a1a1a,
            0 1px 0 rgba(255,255,255,0.1) !important;
    }

    .page-product .mobile-support-sheet-close::before,
    .page-product .mobile-support-sheet-close::after {
        content: '' !important;
        position: absolute !important;
        width: 10px !important;
        height: 2px !important;
        border-radius: 2px !important;
        background: var(--neon-blue) !important;
        box-shadow: 0 0 8px rgba(111,135,255,0.6) !important;
    }

    .page-product .mobile-support-sheet-close::before {
        transform: rotate(45deg) !important;
    }

    .page-product .mobile-support-sheet-close::after {
        transform: rotate(-45deg) !important;
    }

    .page-product .mobile-support-sheet .mobile-support-list {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        margin-top: 6px !important;
        padding: 0 0 12px !important;
    }

    .page-product .mobile-support-sheet a.mobile-support-action,
    .page-product .mobile-support-sheet button.mobile-support-action {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 0 !important;
        width: 100% !important;
        min-height: 60px !important;
        padding: 18px 28px !important;
        border: none !important;
        border-left: 3px solid transparent !important;
        border-radius: 0 !important;
        background-color: transparent !important;
        background-image: linear-gradient(rgba(255,255,255,0.035), rgba(255,255,255,0.035)) !important;
        background-repeat: no-repeat !important;
        background-position: 28px 100% !important;
        background-size: calc(100% - 28px) 1px !important;
        color: rgba(248,250,252,0.92) !important;
        text-align: left !important;
        text-decoration: none !important;
        appearance: none !important;
        -webkit-appearance: none !important;
        box-shadow: none !important;
    }

    .page-product .mobile-support-sheet .mobile-support-action-label {
        display: inline !important;
        font-size: 16px !important;
        font-weight: 500 !important;
        line-height: 1.3 !important;
        color: inherit !important;
    }

    .page-product .mobile-support-sheet .mobile-support-action-meta {
        display: none !important;
    }

    .page-product .chat-panel,
    .page-product .chat-panel.is-thread {
        z-index: 21040;
    }
}

/* Footer resources geometry lock: keep the support sheet as one disciplined
   bottom-sheet product across phone and tablet, with a separate low-height
   phone-landscape fit so it does not read like accidental fullscreen. */
@media (max-width: 640px) {
    body.page-product {
        --product-support-sheet-inline-gap: 8px;
        --product-support-sheet-bottom-gap: 10px;
        --product-support-sheet-max-height: min(46svh, 430px);
        --product-support-sheet-radius: 18px;
        --product-support-sheet-pad-top: 16px;
        --product-support-sheet-head-pad-x: 20px;
        --product-support-sheet-head-gap: 14px;
        --product-support-sheet-title-size: clamp(26px, 7vw, 30px);
        --product-support-sheet-close-size: 40px;
        --product-support-sheet-row-min: 58px;
        --product-support-sheet-row-pad-y: 16px;
        --product-support-sheet-row-pad-x: 24px;
        --product-support-sheet-row-font-size: 15px;
        --product-surface-control-size: 40px;
        --product-surface-control-line: 11px;
    }
}

@media (min-width: 768px) and (max-width: 960px), (min-width: 821px) and (max-width: 1024px) and (orientation: portrait), (min-width: 961px) and (max-width: 1180px) and (orientation: landscape), (min-width: 1181px) and (max-width: 1366px) and (orientation: landscape) and (pointer: coarse) {
    body.page-product {
        --product-support-sheet-inline-gap: clamp(16px, 2vw, 22px);
        --product-support-sheet-width: clamp(430px, 48vw, 640px);
        --product-support-sheet-bottom-gap: 12px;
        --product-support-sheet-max-height: min(48svh, 460px);
        --product-support-sheet-radius: 28px;
        --product-support-sheet-pad-top: 18px;
        --product-support-sheet-head-pad-x: 24px;
        --product-support-sheet-head-gap: 14px;
        --product-support-sheet-title-size: clamp(30px, 3.2vw, 34px);
        --product-support-sheet-close-size: 40px;
        --product-support-sheet-row-min: 60px;
        --product-support-sheet-row-pad-y: 18px;
        --product-support-sheet-row-pad-x: 28px;
        --product-support-sheet-row-font-size: 16px;
        --product-surface-control-size: 40px;
        --product-surface-control-line: 11px;
    }
}

@media (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) and (pointer: coarse) {
    body.page-product {
        --product-support-sheet-max-height: min(64svh, 560px);
    }
}

@media (max-width: 960px) and (orientation: landscape) and (max-height: 540px) {
    body.page-product {
        --product-support-sheet-inline-gap: 12px;
        --product-support-sheet-bottom-gap: 8px;
        --product-support-sheet-max-height: min(68svh, 300px);
        --product-support-sheet-radius: 24px;
        --product-support-sheet-pad-top: 14px;
        --product-support-sheet-head-pad-x: 18px;
        --product-support-sheet-head-gap: 12px;
        --product-support-sheet-title-size: clamp(24px, 4vw, 28px);
        --product-support-sheet-close-size: 38px;
        --product-support-sheet-row-min: 54px;
        --product-support-sheet-row-pad-y: 14px;
        --product-support-sheet-row-pad-x: 22px;
        --product-support-sheet-row-font-size: 15px;
        --product-surface-control-size: 38px;
        --product-surface-control-line: 10px;
    }
}

@media (max-width: 640px), (min-width: 768px) and (max-width: 960px), (min-width: 821px) and (max-width: 1024px) and (orientation: portrait), (min-width: 961px) and (max-width: 1180px) and (orientation: landscape), (min-width: 1181px) and (max-width: 1366px) and (orientation: landscape) and (pointer: coarse) {
    .page-product .footer-mobile-label {
        font-family: 'Montserrat', 'Arial', sans-serif !important;
        font-weight: 700 !important;
        letter-spacing: 0.24em !important;
    }

    .page-product .mobile-support-sheet {
        left: var(--product-support-sheet-inline-gap);
        right: var(--product-support-sheet-inline-gap);
        width: auto;
        max-width: none;
        bottom: calc(var(--product-support-sheet-bottom-gap) + var(--product-compact-footer-h) + env(safe-area-inset-bottom, 0px));
        max-height: min(
            var(--product-support-sheet-max-height),
            calc(
                100dvh
                - var(--product-compact-header-h)
                - var(--product-compact-footer-h)
                - env(safe-area-inset-top, 0px)
                - env(safe-area-inset-bottom, 0px)
                - 32px
            )
        );
        padding: var(--product-support-sheet-pad-top) 0 0;
        border-radius: var(--product-support-sheet-radius);
        overflow: auto;
        overscroll-behavior: contain;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.012) 20%, rgba(255,255,255,0) 48%),
            radial-gradient(140% 120% at 0% 0%, rgba(111,135,255,0.08) 0%, rgba(111,135,255,0.024) 28%, rgba(0,0,0,0) 58%),
            rgba(6,7,11,0.95);
        border-color: rgba(131,151,255,0.16);
        box-shadow:
            0 30px 56px rgba(0,0,0,0.68),
            inset 0 1px 0 rgba(255,255,255,0.05),
            inset 3px 0 0 rgba(111,135,255,0.76);
    }

    .page-product .mobile-support-sheet-head {
        gap: var(--product-support-sheet-head-gap) !important;
        margin-bottom: 10px !important;
        padding: 0 var(--product-support-sheet-head-pad-x) !important;
    }

    .page-product .mobile-support-sheet-title {
        font-size: var(--product-support-sheet-title-size) !important;
        font-family: 'Montserrat', 'Arial', sans-serif !important;
        font-weight: 700 !important;
    }

    .page-product .mobile-support-sheet-close {
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
        min-height: 28px !important;
        border-radius: 999px !important;
        border: none !important;
        background: #050505 !important;
        box-shadow:
            inset 3px 3px 6px #000000,
            inset -1px -1px 4px #1a1a1a,
            0 1px 0 rgba(255,255,255,0.1) !important;
    }

    .page-product .mobile-support-sheet-close::before,
    .page-product .mobile-support-sheet-close::after {
        width: 7.6px !important;
        height: 1.6px !important;
        background: #6F87FF !important;
        box-shadow: 0 0 8px rgba(111,135,255,0.6) !important;
    }

    .page-product .mobile-support-sheet .mobile-support-list {
        padding: 0 0 10px !important;
    }

    .page-product .mobile-support-sheet a.mobile-support-action,
    .page-product .mobile-support-sheet button.mobile-support-action {
        min-height: var(--product-support-sheet-row-min) !important;
        padding: var(--product-support-sheet-row-pad-y) var(--product-support-sheet-row-pad-x) !important;
        justify-content: flex-start !important;
        background-position: var(--product-support-sheet-row-pad-x) 100% !important;
        background-size: calc(100% - var(--product-support-sheet-row-pad-x)) 1px !important;
    }

    .page-product .mobile-support-sheet .mobile-support-action-label {
        display: block !important;
        width: 100% !important;
        text-align: left !important;
        font-size: var(--product-support-sheet-row-font-size) !important;
        font-family: 'Inter', 'Arial', sans-serif !important;
        font-weight: 500 !important;
    }

    .page-product .chat-panel .chat-close,
    .page-product .chat-panel .chat-thread-close,
    .page-product .chat-panel .chat-back {
        width: var(--product-surface-control-size) !important;
        height: var(--product-surface-control-size) !important;
        min-width: var(--product-surface-control-size) !important;
        min-height: var(--product-surface-control-size) !important;
        box-shadow:
            0 12px 26px rgba(0,0,0,0.34),
            inset 3px 3px 6px #000000,
            inset -1px -1px 4px #1a1a1a,
            0 1px 0 rgba(255,255,255,0.1) !important;
    }

    .page-product .chat-panel .chat-close::before,
    .page-product .chat-panel .chat-close::after,
    .page-product .chat-panel .chat-thread-close::before,
    .page-product .chat-panel .chat-thread-close::after {
        width: var(--product-surface-control-line) !important;
    }

    .page-product .chat-panel .chat-back svg {
        width: 13px !important;
        height: 13px !important;
    }

    .page-product .chat-thread-header {
        grid-template-columns: var(--product-surface-control-size) minmax(0, 1fr) var(--product-surface-control-size) !important;
        column-gap: 12px !important;
        padding: 12px 14px !important;
    }
}

@media (min-width: 641px) and (max-width: 1366px) and (pointer: coarse) and (min-height: 641px) {
    .page-product .mobile-support-sheet {
        left: var(--product-support-sheet-inline-gap);
        right: auto;
        width: min(var(--product-support-sheet-width, clamp(430px, 48vw, 640px)), calc(100vw - (var(--product-support-sheet-inline-gap) * 2)));
        max-width: calc(100vw - (var(--product-support-sheet-inline-gap) * 2));
    }
}

@media (max-width: 640px), (min-width: 641px) and (max-width: 1366px) and (pointer: coarse) {
    .page-product .mobile-support-sheet,
    .page-product .mobile-support-sheet .mobile-support-list {
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .page-product .mobile-support-sheet::-webkit-scrollbar,
    .page-product .mobile-support-sheet .mobile-support-list::-webkit-scrollbar {
        width: 0;
        height: 0;
    }
}

/* Product overlay polish: unify the outside-of-panel scrim so Resources and
   Chat feel like the same premium system, with panel-local accent instead of
   generic full-screen fog. */
@media (max-width: 640px), (min-width: 641px) and (max-width: 1366px) and (pointer: coarse) {
    body.page-product.product-support-open .mobile-support-sheet-backdrop {
        background:
            radial-gradient(96% 76% at 50% 18%, rgba(255,255,255,0.072) 0%, rgba(255,255,255,0.026) 36%, rgba(255,255,255,0) 66%),
            radial-gradient(128% 94% at 16% 100%, rgba(255,255,255,0.046) 0%, rgba(255,255,255,0.016) 34%, rgba(255,255,255,0) 68%),
            linear-gradient(180deg, rgba(2,4,8,0.58) 0%, rgba(2,3,7,0.78) 52%, rgba(1,2,5,0.94) 100%),
            radial-gradient(140% 112% at 50% 100%, rgba(255,255,255,0.022) 0%, rgba(9,10,14,0.3) 32%, rgba(4,5,9,0.72) 70%, rgba(1,2,5,0.94) 100%) !important;
        -webkit-backdrop-filter: blur(16px) saturate(114%) brightness(0.72) !important;
        backdrop-filter: blur(16px) saturate(114%) brightness(0.72) !important;
    }

    body.page-product.product-support-open .mobile-support-sheet {
        -webkit-backdrop-filter: blur(24px) saturate(110%) brightness(0.94) !important;
        backdrop-filter: blur(24px) saturate(110%) brightness(0.94) !important;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.052) 0%, rgba(255,255,255,0.012) 20%, rgba(255,255,255,0) 48%),
            radial-gradient(140% 120% at 0% 0%, rgba(255,255,255,0.052) 0%, rgba(255,255,255,0.016) 28%, rgba(0,0,0,0) 58%),
            rgba(6,7,10,0.88) !important;
        border-color: rgba(255,255,255,0.135) !important;
        box-shadow:
            0 30px 56px rgba(0,0,0,0.68),
            inset 0 1px 0 rgba(255,255,255,0.062),
            inset 2px 0 0 rgba(255,255,255,0.28) !important;
    }

    body.page-product.product-support-open .mobile-support-sheet-title {
        background-image: linear-gradient(135deg, rgba(248,250,255,0.98), rgba(218,224,236,0.94), rgba(248,250,255,0.94)) !important;
        background-size: 100% 100% !important;
        animation: none !important;
    }

    body.page-product.product-support-open .mobile-support-sheet-close::before,
    body.page-product.product-support-open .mobile-support-sheet-close::after {
        background: #6F87FF !important;
        box-shadow: 0 0 8px rgba(111,135,255,0.6) !important;
    }

    body.page-product.product-support-open .mobile-support-sheet-close:focus,
    body.page-product.product-support-open .mobile-support-sheet-close:focus-visible {
        outline: none !important;
        box-shadow:
            inset 3px 3px 6px #000000,
            inset -1px -1px 4px #1a1a1a,
            0 1px 0 rgba(255,255,255,0.1) !important;
    }

    body.page-product.product-phone-nav-open .scroll-root::after {
        content: '';
        position: fixed;
        inset: 0;
        z-index: 999;
        pointer-events: none;
        background:
            radial-gradient(96% 76% at 50% 18%, rgba(255,255,255,0.072) 0%, rgba(255,255,255,0.026) 36%, rgba(255,255,255,0) 66%),
            radial-gradient(128% 94% at 16% 100%, rgba(255,255,255,0.046) 0%, rgba(255,255,255,0.016) 34%, rgba(255,255,255,0) 68%),
            linear-gradient(180deg, rgba(2,4,8,0.58) 0%, rgba(2,3,7,0.78) 52%, rgba(1,2,5,0.94) 100%),
            radial-gradient(140% 112% at 50% 100%, rgba(255,255,255,0.022) 0%, rgba(9,10,14,0.3) 32%, rgba(4,5,9,0.72) 70%, rgba(1,2,5,0.94) 100%);
        -webkit-backdrop-filter: blur(16px) saturate(114%) brightness(0.72);
        backdrop-filter: blur(16px) saturate(114%) brightness(0.72);
    }
}

/* ---------------------------------------------------------------------------
   FAMILY A DESKTOP LOCK  (global)
   ---------------------------------------------------------------------------
   Every two-button FAMILY A popup (.find-doctor-gate) must render STACKED on
   desktop, mirroring Instant Quote's rhythm. Applies to:
     - Find A Doctor / Find A Dentist / Find Vision Care
     - Check Drug Plans / Prescription Coverage Check
     - Any future FAMILY A sibling added later
   Side-by-side buttons force labels to clip under the chevron and feel
   crunched — this keeps every page identical without per-page edits.
   Owner-approved Apr 19, 2026. Use body.page-product so the shared rule
   beats the bare .find-doctor-gate-actions declarations inside each page's
   inline <style> block without a specificity war.
   --------------------------------------------------------------------------- */
body.page-product .find-doctor-gate .find-doctor-gate-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 0;
}

body.page-product .find-doctor-gate .find-doctor-choice {
    flex: 0 0 auto;
    width: 100%;
    min-height: 66px;
    padding: 14px 16px 14px 18px;
}

body.page-product .find-doctor-gate .fdc-label {
    white-space: normal;
    text-align: left;
}

/* Body rhythm lock — all FAMILY A popups share the same vertical rhythm on
   desktop. 28px top + 28px bottom gives the copy a real cushion from the
   header and the last button a real cushion from the footer, so the card
   reads premium, not crunched. No per-variant drift. */
body.page-product .find-doctor-gate .find-doctor-gate-body {
    padding-top: 28px;
    padding-bottom: 28px;
}

body.page-product .find-doctor-gate .find-doctor-gate-content {
    transform: none;
    gap: 18px;
}

body.page-product .find-doctor-gate .find-doctor-gate-copy {
    min-height: 0;
    display: block;
    max-width: 48ch;
    line-height: 1.6;
    margin: 0 auto;
}

/* Floor the card height a touch so the stacked buttons + copy breathe the
   same way Instant Quote already does on desktop. Individual pages may set
   an explicit height on .find-doctor-gate; min-height floors it without
   fighting that declared height when the stacked layout needs more room. */
body.page-product .find-doctor-gate {
    min-height: 392px;
    height: auto;
}

/* ---------------------------------------------------------------------------
   GLOBAL EXCEPTION — Marketplace "Compare Plans" 3-line body cap
   ---------------------------------------------------------------------------
   Owner-approved Apr 19, 2026. Compare Plans (.drug-plan-bridge on
   health-marketplace.html) keeps its longer HealthCare.gov-vs-us framing copy
   and is explicitly exempt from the FAMILY A 2-line body cap. The copy must
   still fit in **exactly 3 lines** on desktop, tablet, and phone — widen the
   copy block + nudge the card shell where needed so natural wrapping lands
   on 3 lines without -webkit-line-clamp and without shrinking font below the
   shared FAMILY A rhythm.
   Scoped by body[data-phone-nav-class="marketplace-phone-nav-open"] so the
   sibling Medicare .drug-plan-bridge ("Check Drug Plans", shorter copy) is
   not affected.
   --------------------------------------------------------------------------- */
body[data-phone-nav-class="marketplace-phone-nav-open"].page-product .find-doctor-gate.drug-plan-bridge .find-doctor-gate-copy {
    max-width: 72ch;
}

/* ---------------------------------------------------------------------------
   RESOURCE POPUP PARAGRAPH COPY SIZE LOCK  (global, all viewports)
   ---------------------------------------------------------------------------
   Family A bridge popup paragraph copy renders at 12px on desktop, tablet,
   and phone. Enrollment-family guide copy now lives in
   product-page-instance-overrides.css with the rest of that modal family.
   --------------------------------------------------------------------------- */
body.page-product .find-doctor-gate .find-doctor-gate-copy {
    font-size: 12px !important;
}

/* ---------------------------------------------------------------------------
   RESOURCE POPUP SCROLLBAR HIDE LOCK  (global, all viewports)
   ---------------------------------------------------------------------------
   Hide the visible scrollbar on Family A bridge popups across desktop,
   tablet, and phone. Enrollment-family scrollbars now live in
   product-page-instance-overrides.css.
   --------------------------------------------------------------------------- */
body.page-product .find-doctor-gate,
body.page-product .find-doctor-gate-body {
    scrollbar-width: none;
    -ms-overflow-style: none;
}

body.page-product .find-doctor-gate::-webkit-scrollbar,
body.page-product .find-doctor-gate-body::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}

/* ---------------------------------------------------------------------------
   GLOBAL COMPACT RESOURCE POPUP LOCK  (phone + tablet)
   ---------------------------------------------------------------------------
   Family A bridge popups open from the footer Resources sheet. Enrollment-
   family guide modals now live in product-page-instance-overrides.css.
   --------------------------------------------------------------------------- */
@media (max-width: 640px), (min-width: 768px) and (max-width: 960px), (min-width: 821px) and (max-width: 1024px) and (orientation: portrait), (min-width: 961px) and (max-width: 1180px) and (orientation: landscape), (min-width: 1181px) and (max-width: 1366px) and (orientation: landscape) and (pointer: coarse) {

    /* ========================================================================
       FAMILY A — .find-doctor-gate (base shell — Find a Doctor, Check Drug
       Plans, Compare Plans, Compare Private Plans, Prescription Coverage
       Check, Instant Quote, etc.)
       ====================================================================== */
    body.page-product .find-doctor-gate {
        /* Tablet/larger-compact default for FAMILY A: wider shell + more
           inner breathing room so the card reads premium, not crunched.
           Phone-only override narrows this below at (max-width: 640px). */
        width: min(520px, calc(100vw - 48px));
        height: auto;
        min-height: 336px;
        max-height: min(92svh, 640px);
        border-radius: 24px;
        display: grid;
        grid-template-rows: auto 1fr auto;
    }

    body.page-product .find-doctor-gate-head {
        min-height: 60px;
        padding: 10px 16px 10px 20px;
    }

    body.page-product .find-doctor-gate-body {
        padding: 22px 22px 20px;
        min-height: 0;
    }

    body.page-product .find-doctor-gate-content {
        gap: 18px;
    }

    body.page-product .find-doctor-gate:not(.drug-plan-bridge):not(.instant-quote-modal) .find-doctor-gate-content {
        transform: none;
    }

    body.page-product .find-doctor-gate-copy {
        max-width: 46ch;
        font-size: 13.5px;
        line-height: 1.55;
        text-wrap: pretty;
    }

    /* Phone + tablet: stack the two choice buttons vertically so each
       button gets the full modal width. Side-by-side buttons on small
       viewports force the text to be clipped under the chevron arrow
       ("I AM 65 OR OLDER" was overlapping the arrow). Mirrors the
       stacked rhythm already approved on .drug-plan-bridge. */
    body.page-product .find-doctor-gate-actions {
        flex-direction: column;
        gap: 12px;
    }

    body.page-product .find-doctor-choice {
        flex: 0 0 auto;
        min-height: 62px;
        padding: 14px 16px 14px 18px;
        border-radius: 12px;
    }

    body.page-product .fdc-label {
        font-size: 12px;
        line-height: 1.2;
    }

    body.page-product .find-doctor-gate-footer {
        min-height: 56px;
        padding: 12px 18px;
    }

    body.page-product .find-doctor-fallback {
        max-width: 46ch;
        font-size: 10.5px;
        line-height: 1.45;
        text-wrap: balance;
    }

    /* FAMILY A variants that stack two buttons vertically — size to content,
       match the desktop rhythm (small even gap above copy, small even gap
       below the last button). No forced min-height, and override any hard
       page-level height (the Medicare/Marketplace/Private/Dental-Vision inline
       CSS sets height:392px/408px which would otherwise leave dead space). */
    body.page-product .find-doctor-gate.drug-plan-bridge,
    body.page-product .find-doctor-gate.instant-quote-modal {
        min-height: 0;
        height: auto !important;
        max-height: min(94svh, 640px);
    }

    body.page-product .find-doctor-gate.drug-plan-bridge .find-doctor-gate-body,
    body.page-product .find-doctor-gate.instant-quote-modal .find-doctor-gate-body {
        padding: 22px 22px 20px;
        min-height: 0;
    }

    body.page-product .find-doctor-gate.instant-quote-modal .find-doctor-gate-body::before {
        background: url('../SHARED/HEALTH/RESOURCES/INSTANT%20QUOTE.jpg') 50% 45% / cover no-repeat !important;
    }

    body.page-product [data-dialog-modal="view-plan-options"] .find-doctor-gate-body::before,
    body.page-product #group-plan-options .find-doctor-gate-body::before {
        background: url('../SHARED/HEALTH/RESOURCES/VIEW%20PLAN%20OPTIONS.jpg') 50% 45% / cover no-repeat !important;
    }

    body.page-product .find-doctor-gate.drug-plan-bridge .find-doctor-gate-content,
    body.page-product .find-doctor-gate.instant-quote-modal .find-doctor-gate-content {
        gap: 18px;
        transform: none;
    }

    body.page-product .find-doctor-gate.drug-plan-bridge .find-doctor-gate-copy,
    body.page-product .find-doctor-gate.instant-quote-modal .find-doctor-gate-copy {
        max-width: 48ch;
        min-height: auto;
        font-size: 13.5px;
        line-height: 1.55;
    }

    body.page-product .find-doctor-gate.drug-plan-bridge .find-doctor-gate-actions,
    body.page-product .find-doctor-gate.instant-quote-modal .find-doctor-gate-actions {
        flex-direction: column;
        gap: 12px;
    }

    body.page-product .find-doctor-gate.drug-plan-bridge .find-doctor-choice,
    body.page-product .find-doctor-gate.instant-quote-modal .find-doctor-choice {
        min-height: 62px;
        padding: 14px 16px 14px 18px;
    }

    body.page-product .find-doctor-gate.drug-plan-bridge .fdc-label,
    body.page-product .find-doctor-gate.instant-quote-modal .fdc-label {
        letter-spacing: 0.08em;
    }

    /* GLOBAL EXCEPTION — Marketplace "Compare Plans" 3-line body cap
       (tablet + phone). Same Apr 19, 2026 exception from the desktop block
       above. Widen the card shell slightly and the copy block so the longer
       HealthCare.gov framing wraps to exactly 3 lines at this viewport range
       without shrinking font or clamping. Scoped to Marketplace body so
       Medicare's shorter "Check Drug Plans" copy is unaffected. */
    body[data-phone-nav-class="marketplace-phone-nav-open"].page-product .find-doctor-gate.drug-plan-bridge {
        width: min(560px, calc(100vw - 24px));
    }

    body[data-phone-nav-class="marketplace-phone-nav-open"].page-product .find-doctor-gate.drug-plan-bridge .find-doctor-gate-copy {
        max-width: none;
    }

}

/* Phone-only tightening: the small bridge dialogs can sit closer to the
   compact footer chrome on narrow screens without feeling cramped. */
@media (max-width: 640px) {
    body.page-product .find-doctor-gate {
        width: min(400px, calc(100vw - 24px));
        min-height: 330px;
    }

    body.page-product .find-doctor-gate.drug-plan-bridge,
    body.page-product .find-doctor-gate.instant-quote-modal {
        width: min(400px, calc(100vw - 24px));
        min-height: 0;
    }
}

/* ==========================================================================
   GOLD CTA — SWEEP + SHEEN ANIMATION (GLOBAL, SINGLE SOURCE OF TRUTH)
   --------------------------------------------------------------------------
   This is the hero button animation ("Get My Private Plan Review" etc.)
   AND the resource-popup gold CTA animation, in one shared block. Any
   element carrying class `cta-core cta-primary float-cta` inside one of
   these three parent contexts gets the full animation:

     1. .product-hero                    — main hero button
     2. .path-subsection-final .final-cta-standalone
                                         — bottom-of-page final CTA
          3. .path-modal-footer               -- resource-popup gold CTA
                                           (shared CTA animation only; popup
                                           family chrome lives in its owner CSS).

   To add a new popup family's gold CTA, add that family's parent
   selector here as a 4th grouped selector in every block below. DO NOT
   duplicate this code per-page.

   Owner rule (Apr 19, 2026): the resource-popup gold CTA must carry the
   SAME animation and shift as the hero button. Blue secondary buttons
   and `.find-doctor-choice` dark-glass tiles do NOT get this.

   This block replaces the previous per-page inline copies that used to
   live in each product page's <style> block.                             */

/* Base look: padding, sizing, colors, shadow. */
body.page-product .product-hero .cta-core.cta-primary.float-cta,
body.page-product .path-subsection-final .final-cta-standalone .cta-core.cta-primary.float-cta,
body.page-product .path-modal-footer .cta-core.cta-primary.float-cta {
    padding: 13px 24px;
    width: min(100%, 320px);
    border: 1px solid rgba(224,189,108,0.96);
    background:
        linear-gradient(165deg, rgba(255,255,255,0.18), rgba(255,255,255,0.04) 28%, rgba(74,52,12,0.18) 68%, rgba(74,52,12,0.28) 100%),
        linear-gradient(180deg, rgba(236,212,150,0.98), rgba(201,160,80,0.92));
    color: rgba(18,13,7,0.96);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;
    transition: all 0.3s ease;
    box-shadow:
        0 22px 42px rgba(0,0,0,0.56),
        0 0 14px rgba(201,160,80,0.24),
        inset 0 1px 0 rgba(255,255,255,0.28);
    text-shadow: none;
    backdrop-filter: blur(6px);
    animation: none;
}

/* ::before — the faint gold line sweep (diagonal thin gradient strips). */
body.page-product .product-hero .cta-core.cta-primary.float-cta::before,
body.page-product .path-subsection-final .final-cta-standalone .cta-core.cta-primary.float-cta::before,
body.page-product .path-modal-footer .cta-core.cta-primary.float-cta::before {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    padding: 1px;
    background:
        linear-gradient(150deg,
            transparent 46%,
            rgba(201,160,80,0.85) 49.5%,
            rgba(201,160,80,0.85) 50.5%,
            transparent 54%) -120% 0 / 220% 220% no-repeat,
        linear-gradient(-24deg,
            transparent 46%,
            rgba(230,183,101,0.72) 49.5%,
            rgba(230,183,101,0.72) 50.5%,
            transparent 54%) 130% 0 / 220% 220% no-repeat;
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    mask-composite: exclude;
    opacity: 0.84;
    transition: opacity 0.3s ease;
    animation: hero-cta-line-sweep 4.2s ease-in-out infinite;
    pointer-events: none;
}

/* ::after — the white slanted sheen band (the thing that sweeps
   left-to-right across the button on a time loop). */
body.page-product .product-hero .cta-core.cta-primary.float-cta::after,
body.page-product .path-subsection-final .final-cta-standalone .cta-core.cta-primary.float-cta::after,
body.page-product .path-modal-footer .cta-core.cta-primary.float-cta::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 0;
    background: linear-gradient(110deg,
        transparent 18%,
        rgba(255,255,255,0.14) 38%,
        rgba(255,255,255,0.42) 50%,
        rgba(255,255,255,0.14) 62%,
        transparent 82%);
    -webkit-mask: none;
    -webkit-mask-composite: source-over;
    mask: none;
    mask-composite: add;
    filter: drop-shadow(0 0 6px rgba(255,255,255,0.24));
    transform: translateX(-140%);
    opacity: 0.76;
    animation: hero-cta-sheen 4.2s ease-in-out infinite;
    pointer-events: none;
}

/* Hover lift + brightened background. */
body.page-product .product-hero .cta-core.cta-primary.float-cta:hover,
body.page-product .path-subsection-final .final-cta-standalone .cta-core.cta-primary.float-cta:hover,
body.page-product .path-modal-footer .cta-core.cta-primary.float-cta:hover {
    transform: translateY(-2px);
    border-color: rgba(239,206,131,0.98);
    background:
        linear-gradient(165deg, rgba(255,255,255,0.2), rgba(255,255,255,0.06) 28%, rgba(96,68,16,0.2) 68%, rgba(96,68,16,0.32) 100%),
        linear-gradient(180deg, rgba(244,222,167,0.98), rgba(207,168,88,0.95));
    color: rgba(22,16,9,0.96);
    box-shadow:
        0 30px 58px rgba(0,0,0,0.6),
        0 0 22px rgba(201,160,80,0.28),
        0 0 36px rgba(201,160,80,0.14);
}

/* Hover variants of the sweep/sheen (faster pulse, higher opacity). */
body.page-product .product-hero .cta-core.cta-primary.float-cta:hover::before,
body.page-product .path-subsection-final .final-cta-standalone .cta-core.cta-primary.float-cta:hover::before,
body.page-product .path-modal-footer .cta-core.cta-primary.float-cta:hover::before {
    opacity: 0.94;
    animation: hero-cta-line-sweep-hover 1.2s linear infinite;
}

body.page-product .product-hero .cta-core.cta-primary.float-cta:hover::after,
body.page-product .path-subsection-final .final-cta-standalone .cta-core.cta-primary.float-cta:hover::after,
body.page-product .path-modal-footer .cta-core.cta-primary.float-cta:hover::after {
    opacity: 0.9;
    animation: hero-cta-sheen-hover 1.1s linear infinite;
}

/* Explicit idle-state restore when not hovering (prevents an in-flight
   hover animation from freezing mid-run). */
body.page-product .product-hero .cta-core.cta-primary.float-cta:not(:hover)::before,
body.page-product .path-subsection-final .final-cta-standalone .cta-core.cta-primary.float-cta:not(:hover)::before,
body.page-product .path-modal-footer .cta-core.cta-primary.float-cta:not(:hover)::before {
    animation: hero-cta-line-sweep 4.2s ease-in-out infinite;
}

body.page-product .product-hero .cta-core.cta-primary.float-cta:not(:hover)::after,
body.page-product .path-subsection-final .final-cta-standalone .cta-core.cta-primary.float-cta:not(:hover)::after,
body.page-product .path-modal-footer .cta-core.cta-primary.float-cta:not(:hover)::after {
    animation: hero-cta-sheen 4.2s ease-in-out infinite;
}

/* Respect reduced motion. */
@media (prefers-reduced-motion: reduce) {
    body.page-product .product-hero .cta-core.cta-primary.float-cta::before,
    body.page-product .product-hero .cta-core.cta-primary.float-cta::after,
    body.page-product .path-subsection-final .final-cta-standalone .cta-core.cta-primary.float-cta::before,
    body.page-product .path-subsection-final .final-cta-standalone .cta-core.cta-primary.float-cta::after,
    body.page-product .path-modal-footer .cta-core.cta-primary.float-cta::before,
    body.page-product .path-modal-footer .cta-core.cta-primary.float-cta::after {
        animation: none;
    }
    body.page-product .product-hero .cta-core.cta-primary.float-cta:hover,
    body.page-product .path-subsection-final .final-cta-standalone .cta-core.cta-primary.float-cta:hover,
    body.page-product .path-modal-footer .cta-core.cta-primary.float-cta:hover {
        transform: none;
    }
}

/* Keyframes used by the animation above. */
@keyframes hero-cta-line-sweep {
    0%, 100% {
        background-position: -120% 0, 130% 0;
        opacity: 0.74;
    }
    50% {
        background-position: 40% 0, -30% 0;
        opacity: 0.96;
    }
}

@keyframes hero-cta-sheen {
    0% { transform: translateX(-140%); }
    54%, 100% { transform: translateX(140%); }
}

@keyframes hero-cta-line-sweep-hover {
    0% {
        background-position: -96% 0, 108% 0;
        opacity: 0.8;
    }
    100% {
        background-position: 50% 0, -38% 0;
        opacity: 0.96;
    }
}

@keyframes hero-cta-sheen-hover {
    0% { transform: translateX(-102%); }
    100% { transform: translateX(112%); }
}

/* -----------------------------------------------------------------------------
   PRODUCT HERO + FINAL BOOKING CTA — MOBILE SHORT LABEL
   Desktop/tablet keep page-specific copy; max-width 768px shows generic line so
   gold float-cta does not clip on narrow phones.
----------------------------------------------------------------------------- */
body.page-product .product-hero .cta-core.cta-primary.float-cta .hero-cta-label-mobile,
body.page-product .path-subsection-final .final-cta-standalone .cta-core.cta-primary.float-cta .hero-cta-label-mobile {
    display: none;
}

@media (max-width: 768px) {
    body.page-product .product-hero .cta-core.cta-primary.float-cta .hero-cta-label-desktop,
    body.page-product .path-subsection-final .final-cta-standalone .cta-core.cta-primary.float-cta .hero-cta-label-desktop {
        display: none;
    }

    body.page-product .product-hero .cta-core.cta-primary.float-cta .hero-cta-label-mobile,
    body.page-product .path-subsection-final .final-cta-standalone .cta-core.cta-primary.float-cta .hero-cta-label-mobile {
        display: inline;
    }
}

/* Shared product chrome: short landscape phones need maximum vertical content
   room, while preserving touchable controls. */
@media (min-width: 641px) and (max-width: 1180px) and (orientation: landscape) and (max-height: 700px) {
    body.page-product {
        --product-compact-header-h: 64px !important;
        --product-compact-footer-h: 64px !important;
    }

    .page-product .main-header {
        grid-template-columns: 46px minmax(0, 1fr) 46px !important;
        height: var(--product-compact-header-h) !important;
        min-height: var(--product-compact-header-h) !important;
        padding: 0 14px !important;
    }

    .page-product .mobile-nav-spacer,
    .page-product .mobile-nav-toggle {
        width: 46px !important;
        height: 46px !important;
        min-width: 46px !important;
        min-height: 46px !important;
    }

    .page-product .main-header .logo-img {
        height: 36px !important;
        max-height: 36px !important;
        max-width: 210px !important;
    }

    .page-product .footer-nav {
        min-height: var(--product-compact-footer-h) !important;
    }

    .page-product .footer-mobile-action {
        min-height: var(--product-compact-footer-h) !important;
        padding: 8px 14px !important;
    }

    .page-product .footer-mobile-content {
        gap: 11px !important;
    }

    .page-product .footer-mobile-orb {
        width: 26px !important;
        height: 26px !important;
        flex-basis: 26px !important;
    }

    .page-product .footer-mobile-orb svg {
        width: 13px !important;
        height: 13px !important;
    }

    .page-product .footer-mobile-chat .footer-mobile-orb svg {
        width: 17px !important;
        height: 17px !important;
    }

    .page-product .footer-mobile-resource .footer-mobile-label,
    .page-product .footer-mobile-chat .footer-mobile-label {
        font-size: 10.4px !important;
        letter-spacing: 0.22em !important;
    }
}

/* Shared product chrome: tablet landscape keeps a little more visual presence
   than phone landscape, but gives content more room than portrait. */
@media (min-width: 961px) and (max-width: 1180px) and (orientation: landscape) and (min-height: 701px),
       (min-width: 1181px) and (max-width: 1366px) and (orientation: landscape) and (max-height: 1100px) and (pointer: coarse) {
    body.page-product {
        --product-compact-header-h: clamp(66px, 8.5svh, 72px) !important;
        --product-compact-footer-h: clamp(66px, 8.5svh, 72px) !important;
    }

    .page-product .main-header {
        grid-template-columns: clamp(46px, 6.1svh, 52px) minmax(0, 1fr) clamp(46px, 6.1svh, 52px) !important;
        height: var(--product-compact-header-h) !important;
        min-height: var(--product-compact-header-h) !important;
        padding: 0 16px !important;
    }

    .page-product .mobile-nav-spacer,
    .page-product .mobile-nav-toggle {
        width: clamp(46px, 6.1svh, 52px) !important;
        height: clamp(46px, 6.1svh, 52px) !important;
        min-width: clamp(46px, 6.1svh, 52px) !important;
        min-height: clamp(46px, 6.1svh, 52px) !important;
    }

    .page-product .main-header .logo-img {
        height: clamp(36px, 4.8svh, 42px) !important;
        max-height: clamp(36px, 4.8svh, 42px) !important;
        max-width: 230px !important;
    }

    .page-product .footer-nav {
        min-height: var(--product-compact-footer-h) !important;
    }

    .page-product .footer-mobile-action {
        min-height: var(--product-compact-footer-h) !important;
        padding: 9px 16px !important;
    }

    .page-product .footer-mobile-content {
        gap: 12px !important;
    }

    .page-product .footer-mobile-orb {
        width: clamp(26px, 3.4svh, 30px) !important;
        height: clamp(26px, 3.4svh, 30px) !important;
        flex-basis: clamp(26px, 3.4svh, 30px) !important;
    }

    .page-product .footer-mobile-orb svg {
        width: clamp(13px, 1.72svh, 15px) !important;
        height: clamp(13px, 1.72svh, 15px) !important;
    }

    .page-product .footer-mobile-chat .footer-mobile-orb svg {
        width: clamp(17px, 2.2svh, 19px) !important;
        height: clamp(17px, 2.2svh, 19px) !important;
    }

    .page-product .footer-mobile-resource .footer-mobile-label,
    .page-product .footer-mobile-chat .footer-mobile-label {
        font-size: clamp(10.5px, 1.32svh, 11px) !important;
        letter-spacing: 0.23em !important;
    }
}

/* Shared product chrome: vertical phone views should be compact, but not as
   compressed as sideways landscape. */
@media (max-width: 640px) and (orientation: portrait) {
    body.page-product {
        --product-compact-header-h: 68px !important;
        --product-compact-footer-h: 68px !important;
    }

    .page-product .main-header {
        grid-template-columns: 46px minmax(0, 1fr) 46px !important;
        height: var(--product-compact-header-h) !important;
        min-height: var(--product-compact-header-h) !important;
        padding: 0 12px !important;
    }

    .page-product .mobile-nav-spacer,
    .page-product .mobile-nav-toggle {
        width: 46px !important;
        height: 46px !important;
        min-width: 46px !important;
        min-height: 46px !important;
    }

    .page-product .main-header .logo-img {
        height: 31px !important;
        max-height: 31px !important;
        max-width: 156px !important;
    }

    .page-product .footer-nav {
        min-height: var(--product-compact-footer-h) !important;
    }

    .page-product .footer-mobile-action {
        min-height: var(--product-compact-footer-h) !important;
        padding: 8px 12px !important;
    }

    .page-product .footer-mobile-content {
        gap: 10px !important;
    }

    .page-product .footer-mobile-orb {
        width: 26px !important;
        height: 26px !important;
        flex-basis: 26px !important;
    }

    .page-product .footer-mobile-orb svg {
        width: 13px !important;
        height: 13px !important;
    }

    .page-product .footer-mobile-chat .footer-mobile-orb svg {
        width: 17px !important;
        height: 17px !important;
    }

    .page-product .footer-mobile-resource .footer-mobile-label,
    .page-product .footer-mobile-chat .footer-mobile-label {
        font-size: 10.4px !important;
        letter-spacing: 0.22em !important;
    }
}

/* Shared product chrome: tablet portrait gets a fluid compact height so Mini,
   Air, and Pro scale together without page-specific rules. */
@media (min-width: 768px) and (max-width: 1180px) and (orientation: portrait) {
    body.page-product {
        --product-compact-header-h: clamp(70px, 6.2svh, 74px) !important;
        --product-compact-footer-h: clamp(70px, 6.2svh, 74px) !important;
    }

    .page-product .main-header {
        grid-template-columns: clamp(48px, 4.5svh, 52px) minmax(0, 1fr) clamp(48px, 4.5svh, 52px) !important;
        height: var(--product-compact-header-h) !important;
        min-height: var(--product-compact-header-h) !important;
        padding: 0 16px !important;
    }

    .page-product .mobile-nav-spacer,
    .page-product .mobile-nav-toggle {
        width: clamp(48px, 4.5svh, 52px) !important;
        height: clamp(48px, 4.5svh, 52px) !important;
        min-width: clamp(48px, 4.5svh, 52px) !important;
        min-height: clamp(48px, 4.5svh, 52px) !important;
    }

    .page-product .main-header .logo-img {
        height: clamp(36px, 3.3svh, 40px) !important;
        max-height: clamp(36px, 3.3svh, 40px) !important;
        max-width: 220px !important;
    }

    .page-product .footer-nav {
        min-height: var(--product-compact-footer-h) !important;
    }

    .page-product .footer-mobile-action {
        min-height: var(--product-compact-footer-h) !important;
        padding: 9px 16px !important;
    }

    .page-product .footer-mobile-content {
        gap: 12px !important;
    }

    .page-product .footer-mobile-orb {
        width: 28px !important;
        height: 28px !important;
        flex-basis: 28px !important;
    }

    .page-product .footer-mobile-orb svg {
        width: 14px !important;
        height: 14px !important;
    }

    .page-product .footer-mobile-chat .footer-mobile-orb svg {
        width: 18px !important;
        height: 18px !important;
    }

    .page-product .footer-mobile-resource .footer-mobile-label,
    .page-product .footer-mobile-chat .footer-mobile-label {
        font-size: 10.8px !important;
        letter-spacing: 0.23em !important;
    }
}

/* Compact footer black-glass lock: keep Resources / Chat as one clean bottom bar. */
@media (max-width: 640px), (min-width: 641px) and (max-width: 1366px) and (pointer: coarse) {
    body.page-product .footer-nav {
        background:
            linear-gradient(180deg, rgba(18,19,22,0.98) 0%, rgba(5,6,8,0.995) 48%, rgba(1,2,4,1) 100%) !important;
        box-shadow:
            0 -18px 34px rgba(0,0,0,0.72),
            inset 0 1px 0 rgba(255,255,255,0.055),
            inset 0 14px 22px rgba(255,255,255,0.012) !important;
    }

    body.page-product .footer-nav::before {
        background:
            linear-gradient(180deg, rgba(255,255,255,0.035) 0%, rgba(255,255,255,0.09) 48%, rgba(255,255,255,0.035) 100%) !important;
        box-shadow: 0 0 10px rgba(255,255,255,0.025) !important;
    }

    body.page-product .footer-nav::after {
        background:
            radial-gradient(22% 180% at 50% 50%, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.043) 44%, rgba(0,0,0,0) 76%),
            linear-gradient(90deg, rgba(255,255,255,0.043) 0%, rgba(255,255,255,0.13) 50%, rgba(255,255,255,0.043) 100%) !important;
        box-shadow: 0 0 12px rgba(255,255,255,0.035) !important;
    }

    body.page-product .footer-mobile-action,
    body.page-product .footer-mobile-resource,
    body.page-product .footer-mobile-chat,
    body.page-product .footer-mobile-resource:hover,
    body.page-product .footer-mobile-resource:focus-visible,
    body.page-product .footer-mobile-chat:hover,
    body.page-product .footer-mobile-chat:focus-visible {
        background:
            linear-gradient(180deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.013) 22%, rgba(0,0,0,0) 100%),
            linear-gradient(180deg, rgba(10,11,14,0.985) 0%, rgba(3,4,6,0.998) 100%) !important;
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.055),
            inset 0 -1px 0 rgba(255,255,255,0.018) !important;
    }

    body.page-product .footer-mobile-resource:hover,
    body.page-product .footer-mobile-resource:focus-visible,
    body.page-product .footer-mobile-chat:hover,
    body.page-product .footer-mobile-chat:focus-visible {
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,0.075),
            inset 0 -1px 0 rgba(255,255,255,0.025),
            inset 0 0 22px rgba(255,255,255,0.018) !important;
    }

    body.page-product .footer-mobile-resource .footer-mobile-label,
    body.page-product .footer-mobile-chat .footer-mobile-label {
        color: rgba(238,242,252,0.92) !important;
        text-shadow: none !important;
    }
}

/* Shared public chrome cleanup: keep header/footer black-glass and reserve color for logo/CTAs. */
.main-header,
.page-product .main-header {
    background:
        linear-gradient(180deg, rgba(255,255,255,0.028) 0%, rgba(255,255,255,0.008) 100%),
        rgba(2,2,2,0.965) !important;
}

.footer-nav,
.page-product .footer-nav {
    background:
        linear-gradient(180deg, rgba(255,255,255,0.022) 0%, rgba(255,255,255,0.007) 100%),
        rgba(2,2,2,0.965) !important;
}

@media (max-width: 640px), (min-width: 641px) and (max-width: 1366px) and (pointer: coarse) {
    body.page-product .main-header {
        background:
            linear-gradient(180deg, rgba(255,255,255,0.032) 0%, rgba(255,255,255,0.008) 100%),
            rgba(2,2,3,0.975) !important;
    }

    body.page-product .mobile-nav-toggle {
        border-color: rgba(255,255,255,0.045) !important;
        border-radius: 13px !important;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.046) 0%, rgba(255,255,255,0.01) 100%),
            rgba(5,5,7,0.985) !important;
        box-shadow:
            0 16px 30px rgba(0,0,0,0.58),
            0 0 22px rgba(255,255,255,0.026),
            inset 0 1px 0 rgba(255,255,255,0.046),
            inset 0 -10px 18px rgba(0,0,0,0.20) !important;
        gap: 4px !important;
    }

    body.page-product.product-phone-nav-open .mobile-nav-toggle {
        border-color: rgba(255,255,255,0.052) !important;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.052) 0%, rgba(255,255,255,0.012) 100%),
            rgba(7,7,9,0.99) !important;
        box-shadow:
            0 16px 32px rgba(0,0,0,0.62),
            0 0 24px rgba(255,255,255,0.03),
            inset 0 1px 0 rgba(255,255,255,0.05),
            inset 0 -10px 20px rgba(0,0,0,0.18) !important;
    }

    body.page-product .mobile-nav-toggle span {
        width: 17px !important;
        height: 1.45px !important;
        background: linear-gradient(90deg, rgba(255,255,255,0.94), rgba(216,221,230,0.82)) !important;
        box-shadow: none !important;
    }

    body.page-product .mobile-nav-toggle span:nth-child(1),
    body.page-product .mobile-nav-toggle span:nth-child(3) {
        width: 17px !important;
        transform: translateX(0) !important;
    }

    body.page-product .mobile-nav-toggle span:nth-child(2) {
        width: 11px !important;
        transform: translateX(3px) !important;
    }

    body.page-product.product-phone-nav-open .mobile-nav-toggle span:nth-child(1) {
        width: 17px !important;
        transform: translateY(5.35px) rotate(45deg) !important;
    }

    body.page-product.product-phone-nav-open .mobile-nav-toggle span:nth-child(2) {
        opacity: 0 !important;
        transform: scaleX(0.35) !important;
    }

    body.page-product.product-phone-nav-open .mobile-nav-toggle span:nth-child(3) {
        width: 17px !important;
        transform: translateY(-5.35px) rotate(-45deg) !important;
    }
}

@media (max-width: 640px) {
    body.page-product .main-header {
        grid-template-columns: 44px minmax(0, 1fr) 44px !important;
    }

    body.page-product .mobile-nav-spacer,
    body.page-product .mobile-nav-toggle {
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        min-height: 44px !important;
    }
}

@media (min-width: 641px) and (max-width: 1366px) and (pointer: coarse) {
    body.page-product .main-header {
        grid-template-columns: 44px minmax(0, 1fr) 44px !important;
    }

    body.page-product .mobile-nav-spacer,
    body.page-product .mobile-nav-toggle {
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        min-height: 44px !important;
    }
}

@media (max-width: 1180px),
       (min-width: 1181px) and (max-width: 1366px) and (orientation: landscape) and (pointer: coarse) {
    body.page-product .main-header {
        grid-template-columns: 40px minmax(0, 1fr) 40px !important;
    }

    body.page-product .mobile-nav-spacer,
    body.page-product .mobile-nav-toggle {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        min-height: 40px !important;
    }

    body.page-product .mobile-nav-toggle span,
    body.page-product .mobile-nav-toggle span:nth-child(1),
    body.page-product .mobile-nav-toggle span:nth-child(3),
    body.page-product.product-phone-nav-open .mobile-nav-toggle span:nth-child(1),
    body.page-product.product-phone-nav-open .mobile-nav-toggle span:nth-child(3) {
        width: 15px !important;
    }

    body.page-product .mobile-nav-toggle span:nth-child(2) {
        width: 10px !important;
    }

    body.page-product.product-phone-nav-open .mobile-nav-toggle span:nth-child(1) {
        transform: translateY(5.1px) rotate(45deg) !important;
    }

    body.page-product.product-phone-nav-open .mobile-nav-toggle span:nth-child(3) {
        transform: translateY(-5.1px) rotate(-45deg) !important;
    }
}

@media (min-width: 641px) and (max-width: 1366px) and (pointer: coarse) {
    body.page-product .main-header .logo-img {
        height: clamp(34px, 4.8svh, 42px) !important;
        max-height: clamp(34px, 4.8svh, 42px) !important;
        max-width: 220px !important;
    }
}

/* Product resource sub-popup polish: shared blue-black glass treatment for
   resource detail modals across the product-page set. */
@media (max-width: 640px), (min-width: 641px) and (max-width: 1366px) and (pointer: coarse) {
    body.page-product .find-doctor-gate-backdrop {
        background:
            radial-gradient(92% 76% at 50% 18%, rgba(111,135,255,0.12) 0%, rgba(111,135,255,0.044) 34%, rgba(111,135,255,0) 68%),
            radial-gradient(118% 92% at 18% 100%, rgba(86,107,210,0.11) 0%, rgba(86,107,210,0.038) 34%, rgba(86,107,210,0) 70%),
            linear-gradient(180deg, rgba(1,3,8,0.58) 0%, rgba(1,3,8,0.78) 54%, rgba(1,2,6,0.94) 100%),
            rgba(1,2,6,0.9) !important;
        -webkit-backdrop-filter: blur(17px) saturate(116%) brightness(0.68) !important;
        backdrop-filter: blur(17px) saturate(116%) brightness(0.68) !important;
    }

    body.page-product .find-doctor-gate-backdrop::before {
        background:
            radial-gradient(ellipse 82% 68% at 50% 42%, rgba(125,149,255,0.06) 0%, rgba(125,149,255,0.02) 38%, transparent 62%),
            radial-gradient(ellipse 105% 96% at 50% 58%, transparent 36%, rgba(0,0,0,0.18) 100%) !important;
        -webkit-mask-image: radial-gradient(ellipse 92% 82% at 50% 50%, black 0%, transparent 74%) !important;
        mask-image: radial-gradient(ellipse 92% 82% at 50% 50%, black 0%, transparent 74%) !important;
    }

    body.page-product .find-doctor-gate {
        border-color: rgba(150,171,255,0.16) !important;
        background:
            radial-gradient(115% 86% at 50% 46%, rgba(125,149,255,0.12) 0%, rgba(125,149,255,0.04) 42%, rgba(125,149,255,0) 72%),
            linear-gradient(165deg, rgba(255,255,255,0.11), rgba(255,255,255,0.035) 34%, rgba(5,8,20,0.64)),
            rgba(4,6,13,0.62) !important;
        box-shadow:
            0 34px 78px rgba(0,0,0,0.72),
            0 0 46px rgba(98,138,255,0.34),
            0 0 90px rgba(98,138,255,0.14),
            inset 0 1px 0 rgba(255,255,255,0.13),
            inset 0 -1px 0 rgba(255,255,255,0.05) !important;
        -webkit-backdrop-filter: blur(18px) saturate(122%) brightness(1.04) !important;
        backdrop-filter: blur(18px) saturate(122%) brightness(1.04) !important;
    }
}