/* cyrillic-ext */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(/fonts/font_0.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(/fonts/font_1.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* symbols2 */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(/fonts/font_2.woff2) format('woff2');
    unicode-range: U+2000-2001, U+2004-2008, U+200A, U+23B8-23BD, U+2500-259F;
}

/* vietnamese */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(/fonts/font_3.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(/fonts/font_4.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(/fonts/font_5.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* cyrillic-ext */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(/fonts/font_0.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(/fonts/font_1.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* symbols2 */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(/fonts/font_2.woff2) format('woff2');
    unicode-range: U+2000-2001, U+2004-2008, U+200A, U+23B8-23BD, U+2500-259F;
}

/* vietnamese */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(/fonts/font_3.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(/fonts/font_4.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(/fonts/font_5.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* cyrillic-ext */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(/fonts/font_0.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(/fonts/font_1.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* symbols2 */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(/fonts/font_2.woff2) format('woff2');
    unicode-range: U+2000-2001, U+2004-2008, U+200A, U+23B8-23BD, U+2500-259F;
}

/* vietnamese */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(/fonts/font_3.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(/fonts/font_4.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Geist Mono';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(/fonts/font_5.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* cyrillic-ext */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(/fonts/font_18.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(/fonts/font_19.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* greek-ext */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(/fonts/font_20.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
}

/* greek */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(/fonts/font_21.woff2) format('woff2');
    unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

/* vietnamese */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(/fonts/font_22.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(/fonts/font_23.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(/fonts/font_24.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* cyrillic-ext */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(/fonts/font_18.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(/fonts/font_19.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* greek-ext */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(/fonts/font_20.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
}

/* greek */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(/fonts/font_21.woff2) format('woff2');
    unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

/* vietnamese */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(/fonts/font_22.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(/fonts/font_23.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(/fonts/font_24.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* cyrillic-ext */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(/fonts/font_18.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(/fonts/font_19.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* greek-ext */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(/fonts/font_20.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
}

/* greek */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(/fonts/font_21.woff2) format('woff2');
    unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

/* vietnamese */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(/fonts/font_22.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(/fonts/font_23.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(/fonts/font_24.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* cyrillic-ext */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(/fonts/font_18.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(/fonts/font_19.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* greek-ext */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(/fonts/font_20.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
}

/* greek */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(/fonts/font_21.woff2) format('woff2');
    unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

/* vietnamese */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(/fonts/font_22.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(/fonts/font_23.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(/fonts/font_24.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

.logo.scope-logo {
    display: inline-block;
    flex: none
}

:root {
    --bg: #0a0a0a;
    --bg-1: #0d0d0f;
    --bg-2: #121214;
    --bg-3: #18181b;
    --text: #f5f5f7;
    --text-2: #a8a8ad;
    --text-3: #6f6f76;
    --line: rgba(255, 255, 255, .1);
    --line-2: rgba(255, 255, 255, .18);
    --glass: rgba(255, 255, 255, .045);
    --glass-2: rgba(255, 255, 255, .07);
    --glass-hi: rgba(255, 255, 255, .14);
    --on-light: #0a0a0a;
    --danger: #ff453a;
    --success: #30d158;
    --warn: #ffd60a;
    --silver: linear-gradient(135deg, #ffffff 0%, #d7d7da 35%, #8a8a90 70%, #f2f2f4 100%);
    --primary: #ffffff;
    --on-primary: #0a0a0a;
    --primary-shadow: rgba(255, 255, 255, .12);
    --heading: var(--text);
    --ring: rgba(255, 255, 255, .16);
    --grid-line: rgba(255, 255, 255, .04);
    --input-bg: rgba(0, 0, 0, .35);
    --input-focus: rgba(0, 0, 0, .55);
    --header-bg: rgba(10, 10, 10, .6);
    --menu-bg: rgba(10, 10, 10, .92);
    --overlay: rgba(10, 10, 10, .6);
    --product-bg: radial-gradient(78% 64% at 50% 28%, #1c3f73 0%, #0e2750 52%, #081831 100%);
    --sunken: rgba(0, 0, 0, .4);
    --chip-bg: linear-gradient(160deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .02));
    --sheen: rgba(255, 255, 255, .05);
    --halo: rgba(255, 255, 255, .12);
    --toast-bg: rgba(255, 255, 255, .95);
    --toast-fg: #0a0a0a;
    --selection: rgba(255, 255, 255, .22);
    --font-display: var(--font-sans);
    --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-mono: "Geist Mono", ui-monospace, "SF Mono", "Cascadia Code", Menlo, Consolas, monospace;
    --fs-xs: .75rem;
    --fs-sm: .875rem;
    --fs-base: 1rem;
    --fs-lg: clamp(1.0625rem, .5vw + 1rem, 1.125rem);
    --fs-xl: clamp(1.25rem, 3vw, 1.375rem);
    --fs-2xl: clamp(1.5rem, 4.5vw, 1.75rem);
    --fs-3xl: clamp(1.875rem, 6vw, 2.5rem);
    --fs-4xl: clamp(2.25rem, 8vw, 3.5rem);
    --fs-5xl: clamp(2.75rem, 7vw, 5.5rem);
    --sp-1: .25rem;
    --sp-2: .5rem;
    --sp-3: .75rem;
    --sp-4: 1rem;
    --sp-5: 1.5rem;
    --sp-6: 2rem;
    --sp-7: 3rem;
    --sp-8: 4rem;
    --sp-9: 6rem;
    --sp-10: 8rem;
    --r-sm: 8px;
    --r-md: 12px;
    --r-lg: 18px;
    --r-xl: 26px;
    --r-full: 999px;
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
    --shadow-md: 0 8px 30px rgba(0, 0, 0, .45);
    --shadow-lg: 0 24px 60px rgba(0, 0, 0, .55);
    --glow: 0 0 0 1px var(--line), 0 1px 0 0 var(--glass-hi) inset;
    --blur: 18px;
    --maxw: 1480px;
    --maxw-narrow: 780px;
    --nav-h: 64px;
    --ease: cubic-bezier(.22, 1, .36, 1);
    --dur: .24s;
    --z-nav: 100;
    --z-drawer: 200;
    --z-toast: 300;
    color-scheme: dark
}

:root {
    --bg: #ffffff;
    --bg-1: #f5f8fd;
    --bg-2: #e9f0f9;
    --bg-3: #dde7f3;
    --text: #11182b;
    --text-2: #46587a;
    --text-3: #7c8aa0;
    --line: rgba(41, 46, 76, .14);
    --line-2: rgba(41, 46, 76, .22);
    --glass: rgba(255, 255, 255, .66);
    --glass-2: rgba(255, 255, 255, .82);
    --glass-hi: rgba(255, 255, 255, .9);
    --primary: #292e4c;
    --on-primary: #ffffff;
    --primary-shadow: rgba(41, 46, 76, .28);
    --heading: var(--primary);
    --ring: rgba(41, 46, 76, .14);
    --grid-line: rgba(41, 46, 76, .05);
    --shadow-sm: 0 1px 2px rgba(16, 24, 40, .06);
    --shadow-md: 0 8px 28px rgba(16, 24, 40, .08);
    --shadow-lg: 0 24px 60px rgba(16, 24, 40, .12);
    --input-bg: #f4f7fc;
    --input-focus: #ffffff;
    --header-bg: rgba(255, 255, 255, .78);
    --menu-bg: rgba(255, 255, 255, .97);
    --overlay: rgba(255, 255, 255, .82);
    --sunken: #f2f6fb;
    --chip-bg: linear-gradient(160deg, #e8eef9, #fafcff);
    --sheen: rgba(64, 96, 180, .07);
    --halo: rgba(41, 46, 76, .2);
    --toast-bg: #292e4c;
    --toast-fg: #ffffff;
    --selection: rgba(41, 46, 76, .18);
    color-scheme: light
}

.eyebrow {
    color: var(--primary)
}

*,
*:before,
*:after {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

html {
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth
}

@media(prefers-reduced-motion:reduce) {
    html {
        scroll-behavior: auto
    }

    *,
    *:before,
    *:after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important
    }
}

body {
    font-family: var(--font-sans);
    font-size: var(--fs-base);
    line-height: 1.6;
    color: var(--text);
    background: var(--bg);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    min-height: 100dvh;
    overflow-x: hidden
}

body:before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: radial-gradient(60rem 40rem at 50% -10%, var(--sheen), transparent 60%), radial-gradient(40rem 40rem at 85% 10%, var(--sheen), transparent 55%), radial-gradient(50rem 50rem at 10% 100%, var(--sheen), transparent 60%)
}

body.admin:before {
    content: none
}

img,
svg,
video {
    display: block;
    max-width: 100%
}

[hidden] {
    display: none !important
}

a {
    color: inherit;
    text-decoration: none
}

button,
input,
textarea,
select {
    font: inherit;
    color: inherit
}

::selection {
    background: var(--selection)
}

:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 3px;
    border-radius: 4px
}

h1,
h2,
h3,
h4 {
    line-height: 1.08;
    font-weight: 600;
    letter-spacing: -.02em;
    font-family: var(--font-display);
    color: var(--heading)
}

h1 {
    font-size: var(--fs-4xl)
}

h2 {
    font-size: var(--fs-3xl)
}

h3 {
    font-size: var(--fs-xl)
}

p {
    color: var(--text-2)
}

.mono {
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
    letter-spacing: -.02em
}

.price {
    color: var(--heading)
}

.container {
    width: 100%;
    max-width: var(--maxw);
    margin-inline: auto;
    padding-inline: var(--sp-5)
}

.container-narrow {
    max-width: var(--maxw-narrow)
}

.section {
    padding-block: var(--sp-9)
}

@media(max-width:640px) {
    .section {
        padding-block: var(--sp-8)
    }

    .container {
        padding-inline: var(--sp-4)
    }
}

.eyebrow {
    font-family: var(--font-mono);
    font-size: var(--fs-xs);
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--text-3)
}

.lead {
    font-size: var(--fs-lg);
    color: var(--text-2);
    max-width: 56ch
}

.glass {
    background: var(--glass);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    -webkit-backdrop-filter: blur(var(--blur));
    backdrop-filter: blur(var(--blur));
    box-shadow: 0 1px 0 0 var(--glass-hi) inset, var(--shadow-md)
}

.btn {
    --_bg: var(--glass-2);
    --_fg: var(--text);
    --_bd: var(--line-2);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--sp-2);
    min-height: 44px;
    padding: .75rem 1.4rem;
    border-radius: var(--r-full);
    border: 1px solid var(--_bd);
    background: var(--_bg);
    color: var(--_fg);
    font-size: var(--fs-sm);
    font-weight: 550;
    letter-spacing: -.01em;
    cursor: pointer;
    transition: transform var(--dur) var(--ease), background var(--dur) var(--ease), border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease), opacity var(--dur) var(--ease);
    -webkit-backdrop-filter: blur(var(--blur));
    backdrop-filter: blur(var(--blur));
    white-space: nowrap
}

.btn:hover {
    transform: translateY(-1px);
    background: var(--glass-hi)
}

.btn:active {
    transform: translateY(0) scale(.985)
}

.btn:disabled {
    opacity: .45;
    cursor: not-allowed;
    transform: none
}

.btn-primary {
    --_bg: var(--primary);
    --_fg: var(--on-primary);
    --_bd: transparent;
    font-weight: 600;
    box-shadow: 0 8px 24px var(--primary-shadow)
}

.btn-primary:hover {
    background: var(--primary);
    filter: brightness(.94);
    box-shadow: 0 12px 32px var(--primary-shadow)
}

.btn-ghost {
    --_bg: transparent;
    --_bd: var(--line)
}

.btn-block {
    width: 100%
}

.btn-lg {
    min-height: 52px;
    padding: .9rem 1.8rem;
    font-size: var(--fs-base)
}

.btn-sm {
    min-height: 38px;
    padding: .5rem 1rem;
    font-size: var(--fs-xs)
}

.btn-danger {
    --_fg: var(--danger);
    --_bd: rgba(255, 69, 58, .3);
    --_bg: rgba(255, 69, 58, .08)
}

.pill {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .35rem .75rem;
    border-radius: var(--r-full);
    border: 1px solid var(--line);
    background: var(--glass);
    font-size: var(--fs-xs);
    color: var(--text-2);
    letter-spacing: .01em
}

.pill svg {
    width: 14px;
    height: 14px;
    opacity: .85
}

.tag {
    font-family: var(--font-mono);
    font-size: .7rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-3);
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    padding: .2rem .5rem
}

.field {
    display: flex;
    flex-direction: column;
    gap: .4rem
}

.field>label {
    font-size: var(--fs-sm);
    color: var(--text-2);
    font-weight: 500
}

.field .req {
    color: var(--text-3)
}

.input,
.textarea,
.select {
    width: 100%;
    min-height: 48px;
    padding: .7rem .9rem;
    background: var(--input-bg);
    border: 1px solid var(--line-2);
    border-radius: var(--r-md);
    color: var(--text);
    font-size: var(--fs-base);
    transition: border-color var(--dur) var(--ease), background var(--dur) var(--ease), box-shadow var(--dur) var(--ease)
}

.textarea {
    min-height: 110px;
    resize: vertical;
    line-height: 1.5
}

.input::placeholder,
.textarea::placeholder {
    color: var(--text-3)
}

.input:focus,
.textarea:focus,
.select:focus {
    outline: none;
    border-color: var(--primary);
    background: var(--input-focus);
    box-shadow: 0 0 0 3px var(--ring)
}

.input[aria-invalid=true],
.textarea[aria-invalid=true] {
    border-color: var(--danger)
}

.field-error {
    font-size: var(--fs-xs);
    color: var(--danger);
    min-height: 1em
}

.help {
    font-size: var(--fs-xs);
    color: var(--text-3)
}

.grid {
    display: grid;
    gap: var(--sp-5)
}

.hr {
    height: 1px;
    background: var(--line);
    border: 0;
    margin-block: var(--sp-6)
}

.muted {
    color: var(--text-3)
}

.grid-paper {
    position: relative
}

.grid-paper:before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-image: linear-gradient(var(--grid-line) 1px, transparent 1px), linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
    background-size: 28px 28px;
    -webkit-mask-image: linear-gradient(180deg, #000, transparent);
    mask-image: linear-gradient(180deg, #000, transparent)
}

.center {
    text-align: center
}

.stack {
    display: flex;
    flex-direction: column
}

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

.reveal {
    opacity: 1;
    transform: none
}

@media(prefers-reduced-motion:no-preference) {
    .js .reveal {
        opacity: 0;
        transform: translateY(16px);
        transition: opacity .6s var(--ease), transform .6s var(--ease)
    }

    .js .reveal.in {
        opacity: 1;
        transform: none
    }
}

html.gate-locked:not(.gate-presumed-unlocked) {
    overflow: hidden
}

html.gate-locked:not(.gate-presumed-unlocked) body>:not(#site-gate) {
    display: none !important
}

#site-gate {
    display: none
}

html.gate-locked:not(.gate-presumed-unlocked) #site-gate {
    display: grid;
    position: fixed;
    inset: 0;
    z-index: 9999;
    place-items: safe center;
    overflow-y: auto;
    padding: var(--sp-4);
    background: var(--bg)
}

#age-gate[hidden] {
    display: none
}

html.age-gate-locked.age-gate-visible {
    overflow: hidden
}

html.age-gate-locked.age-gate-visible #age-gate:not([hidden]) {
    display: grid;
    position: fixed;
    inset: 0;
    z-index: 9998;
    place-items: safe center;
    overflow-y: auto;
    padding: var(--sp-4);
    background: #ffffffb3
}

.pimage.scope-pimage {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 5;
    display: grid;
    place-items: center;
    border-radius: var(--r-md);
    overflow: hidden;
    background: var(--product-bg)
}

.pimage-img.scope-pimage {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    filter: drop-shadow(0 12px 24px color-mix(in srgb, var(--text) 28%, transparent));
    transition: transform var(--dur) var(--ease)
}

.pimage.scope-pimage.img-failed .pimage-img.scope-pimage {
    display: none
}



.ftr.scope-footer {
    margin-top: var(--sp-10);
    border-top: 1px solid var(--line);
    padding-block: var(--sp-8) var(--sp-6);
    background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--text) 2%, transparent))
}

.ftr-top.scope-footer {
    display: grid;
    grid-template-columns: 1.3fr 2fr;
    gap: var(--sp-7)
}

.ftr-brand.scope-footer {
    display: flex;
    flex-direction: column;
    gap: .9rem;
    align-items: flex-start
}

.ftr-tag.scope-footer {
    color: var(--text-3);
    font-size: var(--fs-sm);
    max-width: 30ch
}

.ftr-contact.scope-footer {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: .65rem
}

.ftr-contact.scope-footer a.scope-footer,
.ftr-contact.scope-footer span.scope-footer {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-size: var(--fs-sm);
    color: var(--text-2)
}

.ftr-contact.scope-footer a.scope-footer:hover {
    color: var(--text)
}

.ftr-cols.scope-footer {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--sp-5)
}

.ftr-col.scope-footer h4.scope-footer {
    font-size: var(--fs-xs);
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--text-3);
    margin-bottom: .9rem;
    font-weight: 600
}

.ftr-col.scope-footer ul.scope-footer {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: .65rem
}

.ftr-col.scope-footer a.scope-footer {
    font-size: var(--fs-sm);
    color: var(--text-2)
}

.ftr-col.scope-footer a.scope-footer:hover {
    color: var(--text)
}

.ftr-disclaimer.scope-footer {
    margin-block: var(--sp-6);
    padding: 1.1rem 1.3rem;
    border-radius: var(--r-md)
}

.ftr-disclaimer.scope-footer strong.scope-footer {
    display: block;
    font-size: var(--fs-sm);
    margin-bottom: .35rem
}

.ftr-disclaimer.scope-footer p.scope-footer {
    font-size: var(--fs-xs);
    color: var(--text-3);
    line-height: 1.6
}

.ftr-bottom.scope-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-4);
    flex-wrap: wrap;
    font-size: var(--fs-xs);
    color: var(--text-3)
}

.ftr-pills.scope-footer {
    display: flex;
    gap: .5rem;
    flex-wrap: wrap
}

@media(max-width:760px) {
    .ftr.scope-footer {
        margin-top: var(--sp-7);
        padding-block: var(--sp-6) var(--sp-5)
    }

    .ftr-top.scope-footer {
        grid-template-columns: 1fr;
        gap: var(--sp-6)
    }

    .ftr-cols.scope-footer {
        grid-template-columns: repeat(2, 1fr)
    }

    .ftr-disclaimer.scope-footer {
        margin-block: var(--sp-5)
    }
}

.hdr.scope-header {
    position: sticky;
    top: 0;
    z-index: var(--z-nav);
    padding-top: .7rem;
    transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease);
    border-bottom: 1px solid transparent
}

.hdr.scope-header.scrolled {
    background: var(--header-bg);
    -webkit-backdrop-filter: blur(var(--blur)) saturate(1.4);
    backdrop-filter: blur(var(--blur)) saturate(1.4);
    border-bottom-color: var(--line)
}

.hdr-inner.scope-header {
    height: var(--nav-h);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-5)
}

.hdr-nav.scope-header {
    display: flex;
    align-items: center;
    gap: .35rem;
    margin-left: auto
}

.hdr-link.scope-header {
    padding: .45rem .85rem;
    border-radius: var(--r-full);
    font-size: var(--fs-sm);
    color: var(--text-2);
    transition: color var(--dur) var(--ease), background var(--dur) var(--ease)
}

.hdr-link.scope-header:hover {
    color: var(--text);
    background: var(--glass)
}

.hdr-link.scope-header.active {
    color: var(--text)
}

.hdr-actions.scope-header {
    display: flex;
    align-items: center;
    gap: .4rem
}

.cart-btn.scope-header {
    position: relative;
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    color: var(--text);
    transition: background var(--dur) var(--ease)
}

.cart-btn.scope-header:hover {
    background: var(--glass)
}

.cart-count.scope-header {
    position: absolute;
    top: 4px;
    right: 2px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    display: grid;
    place-items: center;
    border-radius: var(--r-full);
    background: var(--primary);
    color: var(--on-primary);
    font-size: .68rem;
    font-weight: 700;
    line-height: 1;
    font-variant-numeric: tabular-nums
}

@media(max-width:640px) {
    .hdr.scope-header {
        padding-top: .4rem
    }

    .hdr-inner.scope-header {
        height: 52px;
        gap: var(--sp-3)
    }

    .hdr-logo.scope-header .logo {
        height: 26px;
        width: auto
    }

    .cart-btn.scope-header {
        width: 44px;
        height: 44px
    }

    .cart-btn.scope-header svg {
        width: 20px;
        height: 20px
    }
}

.age-gate-aura.scope-agegate {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(72% 52% at 50% 4%, var(--bg-2), transparent 66%), radial-gradient(94% 64% at 50% 122%, var(--glass-2), transparent 70%)
}

.age-gate-card.scope-agegate {
    position: relative;
    width: 100%;
    max-width: 436px;
    min-width: 0;
    padding: clamp(1.6rem, 4.5vw, 2.5rem);
    border-radius: var(--r-lg);
    box-shadow: 0 1px 0 0 var(--glass-hi) inset, var(--shadow-lg);
    text-align: center
}

.age-gate-main.scope-agegate {
    display: flex;
    flex-direction: column;
    align-items: center
}

.age-gate-badge.scope-agegate {
    display: inline-grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: var(--glass-2);
    border: 1px solid var(--line);
    box-shadow: var(--shadow-sm)
}

.age-gate-eyebrow.scope-agegate {
    margin: var(--sp-4) 0 0;
    font-family: var(--font-mono);
    font-size: var(--fs-xs);
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--text-3)
}

.age-gate-title.scope-agegate {
    margin: var(--sp-2) 0 0;
    font-size: var(--fs-2xl);
    line-height: 1.16;
    letter-spacing: -.02em;
    color: var(--text);
    text-wrap: balance
}

.age-gate-sub.scope-agegate {
    margin: var(--sp-3) auto 0;
    max-width: 34ch;
    font-size: var(--fs-sm);
    line-height: 1.55;
    color: var(--text-2)
}

.age-gate-notice.scope-agegate {
    width: 100%;
    margin-top: var(--sp-5);
    padding: var(--sp-4);
    text-align: left;
    background: var(--bg-2);
    border: 1px solid var(--line);
    border-radius: var(--r-md)
}

.age-gate-notice-label.scope-agegate {
    display: block;
    margin-bottom: var(--sp-2);
    font-family: var(--font-mono);
    font-size: .62rem;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--text-3)
}

.age-gate-notice.scope-agegate p.scope-agegate {
    margin: 0;
    font-size: var(--fs-xs);
    line-height: 1.6;
    color: var(--text-2)
}

.age-gate-actions.scope-agegate {
    display: flex;
    gap: var(--sp-3);
    width: 100%;
    margin-top: var(--sp-5)
}

.age-gate-actions.scope-agegate .btn.scope-agegate {
    justify-content: center
}

#age-gate-agree.scope-agegate {
    flex: 1.6
}

#age-gate-disagree.scope-agegate {
    flex: 1
}

.age-gate-tos.scope-agegate {
    margin: var(--sp-4) 0 0;
    font-size: var(--fs-xs);
    color: var(--text-3)
}

@media(prefers-reduced-motion:no-preference) {
    .age-gate-card.scope-agegate {
        animation: age-gate-in .44s var(--ease) both
    }

    @keyframes age-gate-in {
        0% {
            opacity: 0;
            transform: translateY(10px) scale(.985)
        }
    }
}

@media(max-width:460px) {
    .age-gate-actions.scope-agegate {
        flex-direction: column
    }

    #age-gate-agree.scope-agegate,
    #age-gate-disagree.scope-agegate {
        flex: none
    }
}

.site-gate-card.scope-sitegate {
    width: 100%;
    max-width: 380px;
    display: flex;
    flex-direction: column;
    gap: .85rem;
    padding: 2rem;
    border-radius: var(--r-lg)
}

.site-gate-message.scope-sitegate {
    min-height: 1.2em;
    font-size: var(--fs-sm);
    color: var(--danger);
    text-align: center
}

.site-gate-wait.scope-sitegate {
    display: grid;
    place-items: center;
    min-width: 88px;
    min-height: 88px
}

.site-gate-wait-mark.scope-sitegate {
    display: grid;
    place-items: center;
    width: 76px;
    height: 76px;
    border-radius: 50%;
    color: var(--text);
    opacity: .72;
    animation: gate-wait-pulse 1.8s var(--ease) infinite
}

.site-gate-wait-mark.scope-sitegate img {
    max-width: 44px
}

@keyframes gate-wait-pulse {

    0%,
    to {
        opacity: .42;
        transform: scale(.96)
    }

    50% {
        opacity: .82;
        transform: scale(1)
    }
}

@media(prefers-reduced-motion:reduce) {
    .site-gate-wait-mark.scope-sitegate {
        animation: none
    }
}

#site-gate-form.scope-sitegate {
    max-width: 760px;
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    gap: 0;
    padding: 0;
    overflow: hidden
}

.site-gate-brand-panel.scope-sitegate {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    padding: 2.25rem;
    background: var(--glass-2);
    border-right: 1px solid var(--line)
}

.site-gate-eyebrow.scope-sitegate {
    margin: 0;
    font-size: var(--fs-xs);
    text-transform: uppercase;
    letter-spacing: .16em;
    color: var(--text-3)
}

.site-gate-headline.scope-sitegate {
    margin: 0;
    font-size: var(--fs-2xl);
    line-height: 1.15;
    letter-spacing: -.02em;
    color: var(--text)
}

.site-gate-intro.scope-sitegate {
    margin: 0;
    font-size: var(--fs-sm);
    line-height: 1.5;
    color: var(--text-2)
}

.site-gate-checklist.scope-sitegate {
    list-style: none;
    margin: .25rem 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .85rem
}

.site-gate-check.scope-sitegate {
    display: flex;
    align-items: center;
    gap: .75rem
}

.site-gate-check-ic.scope-sitegate {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    flex: none;
    border-radius: 50%;
    background: var(--glass);
    border: 1px solid var(--line);
    color: var(--text)
}

.site-gate-check-tx.scope-sitegate {
    display: flex;
    flex-direction: column;
    line-height: 1.25
}

.site-gate-check-tx.scope-sitegate strong.scope-sitegate {
    font-size: var(--fs-sm);
    font-weight: 600;
    color: var(--text)
}

.site-gate-check-tx.scope-sitegate small.scope-sitegate {
    font-size: var(--fs-xs);
    color: var(--text-3)
}

.site-gate-footnote.scope-sitegate {
    display: flex;
    align-items: center;
    gap: .4rem;
    margin: auto 0 0;
    padding-top: .5rem;
    font-size: var(--fs-xs);
    color: var(--text-3)
}

.site-gate-access-panel.scope-sitegate {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: .85rem;
    padding: 2.25rem
}

.site-gate-fields.scope-sitegate,
.site-gate-retry-panel.scope-sitegate {
    display: flex;
    flex-direction: column;
    gap: .85rem
}

.site-gate-title.scope-sitegate {
    font-size: var(--fs-lg);
    margin: 0
}

.site-gate-welcome.scope-sitegate {
    margin: 0 0 .4rem;
    font-size: var(--fs-sm);
    color: var(--text-2)
}

.site-gate-retry-msg.scope-sitegate {
    margin: 0 0 .4rem;
    font-size: var(--fs-sm);
    line-height: 1.5;
    color: var(--text-2)
}

@media(max-width:640px) {
    #site-gate-form.scope-sitegate {
        grid-template-columns: 1fr;
        max-width: 420px
    }

    .site-gate-brand-panel.scope-sitegate {
        border-right: none;
        border-bottom: 1px solid var(--line);
        padding: 1.75rem
    }

    .site-gate-headline.scope-sitegate {
        font-size: var(--fs-lg)
    }

    .site-gate-checklist.scope-sitegate,
    .site-gate-footnote.scope-sitegate {
        display: none
    }

    .site-gate-access-panel.scope-sitegate {
        padding: 1.75rem
    }
}

.skip-link.scope-global {
    position: fixed;
    top: .5rem;
    left: .5rem;
    z-index: 1000;
    transform: translateY(-150%);
    background: var(--primary);
    color: var(--on-primary);
    padding: .5rem .9rem;
    border-radius: var(--r-sm);
    font-size: var(--fs-sm);
    font-weight: 600;
    transition: transform .2s var(--ease)
}

.skip-link.scope-global:focus-visible {
    transform: translateY(0)
}

.toast.scope-global {
    position: fixed;
    left: 50%;
    bottom: 1.5rem;
    transform: translate(-50%, 1rem);
    z-index: var(--z-toast);
    padding: .7rem 1.1rem;
    border-radius: var(--r-full);
    background: var(--toast-bg);
    color: var(--toast-fg);
    font-size: var(--fs-sm);
    font-weight: 600;
    box-shadow: var(--shadow-lg);
    opacity: 0;
    transition: opacity .28s var(--ease), transform .28s var(--ease);
    pointer-events: none;
    max-width: calc(100vw - 2rem)
}

.toast.scope-global.show {
    opacity: 1;
    transform: translate(-50%)
}

.detail.scope-product {
    padding-top: var(--sp-5)
}

.crumbs.scope-product {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: var(--fs-sm);
    color: var(--text-3);
    padding-block: var(--sp-4)
}

.crumbs.scope-product a.scope-product:hover {
    color: var(--text)
}

.crumbs.scope-product svg.scope-product {
    opacity: .4
}

.detail-grid.scope-product {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--sp-7);
    align-items: start
}

.detail-media.scope-product {
    position: relative;
    border-radius: var(--r-xl);
    padding: var(--sp-5);
    display: grid;
    place-items: center;
    min-height: 420px;
    position: sticky;
    top: calc(var(--nav-h) + 1rem)
}

.detail-vial.scope-product {
    max-width: 320px;
    background: transparent
}

.detail-tag.scope-product {
    position: absolute;
    top: .75rem;
    left: .75rem;
    border-top-left-radius: calc(var(--r-xl) - .75rem);
    color: var(--text-2);
    background: var(--overlay);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px)
}

.buy.scope-product {
    display: flex;
    flex-direction: column;
    gap: .85rem;
    align-items: flex-start
}

.buy.scope-product h1.scope-product {
    font-size: var(--fs-4xl)
}

.buy-sum.scope-product {
    font-size: var(--fs-lg)
}

.buy-price.scope-product {
    display: flex;
    align-items: baseline;
    gap: .5rem;
    font-size: var(--fs-2xl);
    font-weight: 500
}

.buy-price.scope-product .muted.scope-product {
    font-size: var(--fs-base)
}

.detail-stock.scope-product {
    font-size: var(--fs-sm);
    color: var(--text-2);
    margin-top: -.2rem
}

.detail-stock.scope-product[data-out] {
    color: var(--danger)
}

.variants.scope-product {
    width: 100%;
    margin-top: .3rem
}

.variants-label.scope-product {
    display: block;
    font-size: var(--fs-sm);
    color: var(--text-2);
    margin-bottom: .5rem
}

.variants-row.scope-product {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem
}

.variant.scope-product {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    min-width: 96px;
    padding: .7rem 1rem;
    border-radius: var(--r-md);
    border: 1px solid var(--line-2);
    background: var(--glass);
    color: var(--text);
    cursor: pointer;
    text-align: left;
    transition: all var(--dur) var(--ease)
}

.variant.scope-product:hover {
    border-color: var(--text-3)
}

.variant.scope-product.active {
    border-color: var(--primary);
    background: var(--glass-hi);
    box-shadow: 0 0 0 1px var(--primary) inset
}

.v-dose.scope-product {
    font-size: var(--fs-base);
    font-weight: 500
}

.v-price.scope-product {
    font-size: var(--fs-xs);
    color: var(--text-3)
}

.buy-actions.scope-product {
    display: flex;
    gap: .6rem;
    width: 100%;
    margin-top: .4rem
}

.qty.scope-product {
    display: flex;
    align-items: center;
    border: 1px solid var(--line-2);
    border-radius: var(--r-full);
    background: var(--input-bg);
    flex: none
}

.qty-btn.scope-product {
    width: 44px;
    height: 44px;
    margin: 0 3px;
    display: grid;
    place-items: center;
    background: none;
    border: 0;
    color: var(--text);
    cursor: pointer;
    border-radius: 50%
}

.qty-btn.scope-product:hover {
    background: var(--glass)
}

.qty-input.scope-product {
    width: 40px;
    height: 52px;
    text-align: center;
    background: none;
    border: 0;
    color: var(--text);
    font-size: var(--fs-base)
}

.qty-input.scope-product:focus {
    outline: none
}

.qty.scope-product:focus-within {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--ring)
}

.add-main.scope-product {
    flex: 1
}

.add-main.scope-product.added {
    background: var(--success);
    color: #04210f
}

.ruo-note.scope-product {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    font-size: var(--fs-xs);
    color: var(--text-3);
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    padding: .4rem .7rem;
    margin-top: .3rem
}

.buy-trust.scope-product {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin-top: .5rem
}

.buy-trust.scope-product li.scope-product {
    display: flex;
    align-items: center;
    gap: .55rem;
    font-size: var(--fs-sm);
    color: var(--text-2)
}

.buy-trust.scope-product svg.scope-product {
    color: var(--text-3);
    flex: none
}

.info-grid.scope-product {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: var(--sp-6);
    margin-top: var(--sp-8);
    align-items: start
}

.about-prod.scope-product h2.scope-product {
    font-size: var(--fs-2xl);
    margin-bottom: .8rem
}

.about-prod.scope-product p.scope-product {
    line-height: 1.7;
    max-width: 64ch
}

.ra-head.scope-product {
    font-size: var(--fs-base);
    margin: 1.4rem 0 .7rem
}

.ra-list.scope-product {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem
}

.specs.scope-product {
    padding: 1.4rem;
    border-radius: var(--r-lg)
}

.specs.scope-product h3.scope-product {
    font-size: var(--fs-base);
    margin-bottom: .6rem
}

.spec-sub.scope-product {
    margin-top: 1.3rem;
    padding-top: 1.1rem;
    border-top: 1px solid var(--line)
}

.spec-rows.scope-product>div.scope-product {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .55rem 0;
    border-bottom: 1px solid var(--line);
    font-size: var(--fs-sm)
}

.spec-rows.scope-product>div.scope-product:last-child {
    border-bottom: 0
}

.spec-rows.scope-product dt.scope-product {
    color: var(--text-3)
}

.spec-rows.scope-product dd.scope-product {
    color: var(--text);
    text-align: right
}

@media(max-width:900px) {
    .detail-grid.scope-product {
        grid-template-columns: 1fr;
        gap: var(--sp-5)
    }

    .detail-media.scope-product {
        position: static;
        min-height: 320px;
        padding: var(--sp-3)
    }

    .info-grid.scope-product {
        grid-template-columns: 1fr
    }
}

@media(max-width:520px) {    .buy-actions.scope-product {
        flex-wrap: wrap
    }
}

.faq-section.scope-faq {
    margin-top: var(--sp-9);
    margin-bottom: var(--sp-9)
}

.faq-head.scope-faq {
    margin-bottom: var(--sp-6)
}

.faq-head.scope-faq .eyebrow.scope-faq {
    margin-bottom: .5rem
}

.faq-title.scope-faq {
    font-size: var(--fs-2xl);
    letter-spacing: -.02em
}

.faq-list.scope-faq {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3)
}

.faq.scope-faq {
    padding: 0;
    border-radius: var(--r-lg);
    overflow: hidden
}

.faq.scope-faq summary.scope-faq {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-4);
    padding: var(--sp-4) var(--sp-5);
    cursor: pointer;
    list-style: none;
    font-weight: 600;
    color: var(--heading);
    transition: color var(--dur) var(--ease)
}

.faq.scope-faq summary.scope-faq::-webkit-details-marker {
    display: none
}

.faq.scope-faq summary.scope-faq:hover {
    color: var(--primary)
}

.faq.scope-faq summary.scope-faq svg {
    flex: none;
    color: var(--text-3);
    transition: transform var(--dur) var(--ease)
}

.faq.scope-faq[open] summary.scope-faq svg {
    transform: rotate(180deg)
}

.faq.scope-faq>p.scope-faq {
    padding: 0 var(--sp-5) var(--sp-4);
    color: var(--text-2);
    font-size: var(--fs-sm);
    line-height: 1.6;
    max-width: 70ch
}

@media(prefers-reduced-motion:no-preference) {
    .faq.scope-faq {
        interpolate-size: allow-keywords
    }

    .faq.scope-faq::details-content {
        height: 0;
        overflow: hidden;
        opacity: 0;
        transition: height .3s var(--ease), opacity .25s var(--ease), content-visibility .3s allow-discrete
    }

    .faq.scope-faq[open]::details-content {
        height: auto;
        opacity: 1
    }
}