/** Shopify CDN: Minification failed

Line 11364:0 Unexpected "/"

**/
:root {
  /* brand colours */
  --goli-burgundy: #50000b;
  --goli-cream: #fbf7ee;
  --goli-tan: #e8d5c4;
  --goli-gold: #dfce89;
  --goli-red: #a40011;

  /* fonts */
  --font-heading-family: "Gilroy", sans-serif;
  --font-body-family: "Gilroy", sans-serif;
  --font-nb-architekt: "Gilroy", sans-serif;
  --font-body-style: normal;
  --font-body-weight: 400;
  --font-body-weight-bold: 700;
  --font-heading-style: normal;
  --font-heading-weight: 500;
  --font-body-scale: 1;
  --font-heading-scale: 1;

  /* theme */
  --color-background: 255,255,255;
  --gradient-background: #fff;
  --color-foreground: 80,0,11;
  --color-button: 164,0,17;
  --color-button-text: 255,255,255;
  --page-width: 150rem;

  /* font sizes — UI micro */
  --fs-badge: 9.25px;
  --fs-xs: 10.25px;
  --fs-sm: 11.25px;
  --fs-md: 12.25px;
  --fs-base: 13.25px;
  --fs-lg: 14.25px;
  --fs-xl: 15.25px;
  --fs-2xl: 16.25px;

  /* font sizes — headings */
  --fs-h5: 17.25px;
  --fs-h4: 18.25px;
  --fs-h3: 22.25px;
  --fs-h2: 24.25px;
  --fs-h2-lg: 26.25px;
  --fs-h1: 28.25px;
  --fs-h1-lg: 32.25px;

  /* font sizes — display */
  --fs-d1: 36.25px;
  --fs-d2: 38.25px;
  --fs-d3: 42.25px;
  --fs-d4: 48.25px;
  --fs-d5: 52.25px;
  --fs-d6: 64.25px;

  /* font weights */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;

  /* letter spacing */
  --ls-xs: 0.01em;
  --ls-sm: 0.02em;
  --ls-md: 0.04em;
  --ls-lg: 0.06em;
  --ls-xl: 0.08em;
  --ls-2xl: 0.1em;
  --ls-3xl: 0.14em;
}





/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */
@layer properties {
    @supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))) {

        *,
        :before,
        :after,
        ::backdrop {
            --tw-translate-x: 0;
            --tw-translate-y: 0;
            --tw-translate-z: 0;
            --tw-rotate-x: initial;
            --tw-rotate-y: initial;
            --tw-rotate-z: initial;
            --tw-skew-x: initial;
            --tw-skew-y: initial;
            --tw-space-y-reverse: 0;
            --tw-space-x-reverse: 0;
            --tw-divide-y-reverse: 0;
            --tw-border-style: solid;
            --tw-gradient-position: initial;
            --tw-gradient-from: #0000;
            --tw-gradient-via: #0000;
            --tw-gradient-to: #0000;
            --tw-gradient-stops: initial;
            --tw-gradient-via-stops: initial;
            --tw-gradient-from-position: 0%;
            --tw-gradient-via-position: 50%;
            --tw-gradient-to-position: 100%;
            --tw-leading: initial;
            --tw-font-weight: initial;
            --tw-tracking: initial;
            --tw-ordinal: initial;
            --tw-slashed-zero: initial;
            --tw-numeric-figure: initial;
            --tw-numeric-spacing: initial;
            --tw-numeric-fraction: initial;
            --tw-shadow: 0 0 #0000;
            --tw-shadow-color: initial;
            --tw-shadow-alpha: 100%;
            --tw-inset-shadow: 0 0 #0000;
            --tw-inset-shadow-color: initial;
            --tw-inset-shadow-alpha: 100%;
            --tw-ring-color: initial;
            --tw-ring-shadow: 0 0 #0000;
            --tw-inset-ring-color: initial;
            --tw-inset-ring-shadow: 0 0 #0000;
            --tw-ring-inset: initial;
            --tw-ring-offset-width: 0px;
            --tw-ring-offset-color: #fff;
            --tw-ring-offset-shadow: 0 0 #0000;
            --tw-outline-style: solid;
            --tw-blur: initial;
            --tw-brightness: initial;
            --tw-contrast: initial;
            --tw-grayscale: initial;
            --tw-hue-rotate: initial;
            --tw-invert: initial;
            --tw-opacity: initial;
            --tw-saturate: initial;
            --tw-sepia: initial;
            --tw-drop-shadow: initial;
            --tw-drop-shadow-color: initial;
            --tw-drop-shadow-alpha: 100%;
            --tw-drop-shadow-size: initial;
            --tw-backdrop-blur: initial;
            --tw-backdrop-brightness: initial;
            --tw-backdrop-contrast: initial;
            --tw-backdrop-grayscale: initial;
            --tw-backdrop-hue-rotate: initial;
            --tw-backdrop-invert: initial;
            --tw-backdrop-opacity: initial;
            --tw-backdrop-saturate: initial;
            --tw-backdrop-sepia: initial;
            --tw-duration: initial;
            --tw-ease: initial;
            --tw-content: "";
            --tw-animation-delay: 0s;
            --tw-animation-direction: normal;
            --tw-animation-duration: initial;
            --tw-animation-fill-mode: none;
            --tw-animation-iteration-count: 1;
            --tw-enter-blur: 0;
            --tw-enter-opacity: 1;
            --tw-enter-rotate: 0;
            --tw-enter-scale: 1;
            --tw-enter-translate-x: 0;
            --tw-enter-translate-y: 0;
            --tw-exit-blur: 0;
            --tw-exit-opacity: 1;
            --tw-exit-rotate: 0;
            --tw-exit-scale: 1;
            --tw-exit-translate-x: 0;
            --tw-exit-translate-y: 0
        }
    }
}

@layer theme {

    :root,
    :host {
        --font-serif: "Gilroy", sans-serif;
        --color-red-100: oklch(93.6% .032 17.717);
        --color-red-400: oklch(70.4% .191 22.216);
        --color-red-500: oklch(63.7% .237 25.331);
        --color-red-600: oklch(57.7% .245 27.325);
        --color-red-800: oklch(44.4% .177 26.899);
        --color-orange-100: oklch(95.4% .038 75.164);
        --color-orange-800: oklch(47% .157 37.304);
        --color-yellow-100: oklch(97.3% .071 103.193);
        --color-yellow-800: oklch(47.6% .114 61.907);
        --color-green-400: oklch(79.2% .209 151.711);
        --color-green-500: oklch(72.3% .219 149.579);
        --color-blue-400: oklch(70.7% .165 254.624);
        --color-gray-100: oklch(96.7% .003 264.542);
        --color-gray-200: oklch(92.8% .006 264.531);
        --color-gray-300: oklch(87.2% .01 258.338);
        --color-gray-400: oklch(70.7% .022 261.325);
        --color-gray-500: oklch(55.1% .027 264.364);
        --color-gray-600: oklch(44.6% .03 256.802);
        --color-gray-700: oklch(37.3% .034 259.733);
        --color-gray-800: oklch(27.8% .033 256.848);
        --color-gray-900: oklch(21% .034 264.665);
        --color-black: #000;
        --color-white: #fff;
        --spacing: .25rem;
        --container-xs: 20rem;
        --container-sm: 24rem;
        --container-md: 28rem;
        --container-lg: 32rem;
        --container-2xl: 42rem;
        --container-3xl: 48rem;
        --container-4xl: 56rem;
        --container-5xl: 64rem;
        --container-6xl: 72rem;
        --container-7xl: 80rem;
        --text-xs: .75rem;
        --text-xs--line-height: calc(1/.75);
        --text-sm: .875rem;
        --text-sm--line-height: calc(1.25/.875);
        --text-base: 1rem;
        --text-base--line-height: 1.5;
        --text-lg: 1.125rem;
        --text-lg--line-height: calc(1.75/1.125);
        --text-xl: 1.25rem;
        --text-xl--line-height: calc(1.75/1.25);
        --text-2xl: 1.5rem;
        --text-2xl--line-height: calc(2/1.5);
        --text-3xl: 1.875rem;
        --text-3xl--line-height: 1.2;
        --text-4xl: 2.25rem;
        --text-4xl--line-height: calc(2.5/2.25);
        --text-5xl: 3rem;
        --text-5xl--line-height: 1;
        --font-weight-normal: 400;
        --font-weight-medium: 500;
        --font-weight-semibold: 600;
        --font-weight-bold: 700;
        --tracking-tight: -.025em;
        --tracking-wide: .025em;
        --tracking-wider: .05em;
        --tracking-widest: .1em;
        --leading-snug: 1.375;
        --leading-normal: 1.5;
        --leading-relaxed: 1.625;
        --radius-xs: .125rem;
        --radius-sm: .25rem;
        --radius-md: .375rem;
        --radius-lg: .5rem;
        --radius-xl: .75rem;
        --radius-2xl: 1rem;
        --ease-in: cubic-bezier(.4, 0, 1, 1);
        --ease-out: cubic-bezier(0, 0, .2, 1);
        --ease-in-out: cubic-bezier(.4, 0, .2, 1);
        --animate-spin: spin 1s linear infinite;
        --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1)infinite;
        --blur-2xl: 40px;
        --aspect-video: 16/9;
        --default-transition-duration: .15s;
        --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
        --default-mono-font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace
    }
}

@layer base {

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

    ::file-selector-button {
        box-sizing: border-box;
        border: 0 solid;
        margin: 0;
        padding: 0
    }

    html,
    :host {
        -webkit-text-size-adjust: 100%;
        tab-size: 4;
        font-feature-settings: normal;
        font-variation-settings: normal;
        -webkit-tap-highlight-color: transparent;
        font-family: Gilroy, sans-serif;
        line-height: 1.5
    }

    hr {
        height: 0;
        color: inherit;
        border-top-width: 1px
    }

    abbr:where([title]) {
        -webkit-text-decoration: underline dotted;
        text-decoration: underline dotted
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        font-size: inherit;
        font-weight: inherit
    }

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

    b,
    strong {
        font-weight: bolder
    }

    code,
    kbd,
    samp,
    pre {
        font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
        font-feature-settings: var(--default-mono-font-feature-settings, normal);
        font-variation-settings: var(--default-mono-font-variation-settings, normal);
        font-size: 1em
    }

    small {
        font-size: 80%
    }

    sub,
    sup {
        vertical-align: baseline;
        font-size: 75%;
        line-height: 0;
        position: relative
    }

    sub {
        bottom: -.25em
    }

    sup {
        top: -.5em
    }

    table {
        text-indent: 0;
        border-color: inherit;
        border-collapse: collapse
    }

    :-moz-focusring {
        outline: auto
    }

    progress {
        vertical-align: baseline
    }

    summary {
        display: list-item
    }

    ol,
    ul,
    menu {
        list-style: none
    }

    img,
    svg,
    video,
    canvas,
    audio,
    iframe,
    embed,
    object {
        vertical-align: middle;
        display: block
    }

    img,
    video {
        max-width: 100%;
        height: auto
    }

    button,
    input,
    select,
    optgroup,
    textarea {
        font: inherit;
        font-feature-settings: inherit;
        font-variation-settings: inherit;
        letter-spacing: inherit;
        color: inherit;
        opacity: 1;
        background-color: #0000;
        border-radius: 0
    }

    ::file-selector-button {
        font: inherit;
        font-feature-settings: inherit;
        font-variation-settings: inherit;
        letter-spacing: inherit;
        color: inherit;
        opacity: 1;
        background-color: #0000;
        border-radius: 0
    }

    :where(select:is([multiple], [size])) optgroup {
        font-weight: bolder
    }

    :where(select:is([multiple], [size])) optgroup option {
        padding-inline-start: 20px
    }

    ::file-selector-button {
        margin-inline-end: 4px
    }

    ::placeholder {
        opacity: 1
    }

    @supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px) {
        ::placeholder {
            color: currentColor
        }

        @supports (color:color-mix(in lab, red, red)) {
            ::placeholder {
                color: color-mix(in oklab, currentcolor 50%, transparent)
            }
        }
    }

    textarea {
        resize: vertical
    }

    ::-webkit-search-decoration {
        -webkit-appearance: none
    }

    ::-webkit-date-and-time-value {
        min-height: 1lh;
        text-align: inherit
    }

    ::-webkit-datetime-edit {
        display: inline-flex
    }

    ::-webkit-datetime-edit-fields-wrapper {
        padding: 0
    }

    ::-webkit-datetime-edit {
        padding-block: 0
    }

    ::-webkit-datetime-edit-year-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-month-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-day-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-hour-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-minute-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-second-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-millisecond-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-meridiem-field {
        padding-block: 0
    }

    ::-webkit-calendar-picker-indicator {
        line-height: 1
    }

    :-moz-ui-invalid {
        box-shadow: none
    }

    button,
    input:where([type=button], [type=reset], [type=submit]) {
        appearance: button
    }

    ::file-selector-button {
        appearance: button
    }

    ::-webkit-inner-spin-button {
        height: auto
    }

    ::-webkit-outer-spin-button {
        height: auto
    }

    [hidden]:where(:not([hidden=until-found])) {
        display: none !important
    }
}

@layer components;

@layer utilities {
    .\@container\/card-header {
        container: card-header/inline-size
    }

    .\@container\/field-group {
        container: field-group/inline-size
    }

    .pointer-events-none {
        pointer-events: none
    }

    .collapse {
        visibility: collapse
    }

    .invisible {
        visibility: hidden
    }

    .visible {
        visibility: visible
    }

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

    .absolute {
        position: absolute
    }

    .fixed {
        position: fixed
    }

    .relative {
        position: relative
    }

    .static {
        position: static
    }

    .sticky {
        position: sticky
    }

    .inset-0 {
        inset: calc(var(--spacing)*0)
    }

    .inset-x-0 {
        inset-inline: calc(var(--spacing)*0)
    }

    .inset-y-0 {
        inset-block: calc(var(--spacing)*0)
    }

    .-top-12 {
        top: calc(var(--spacing)*-12)
    }

    .top-0 {
        top: calc(var(--spacing)*0)
    }

    .top-1\.5 {
        top: calc(var(--spacing)*1.5)
    }

    .top-1\/2 {
        top: 50%
    }

    .top-3\.5 {
        top: calc(var(--spacing)*3.5)
    }

    .top-4 {
        top: calc(var(--spacing)*4)
    }

    .top-\[1px\] {
        top: 1px
    }

    .top-\[50\%\] {
        top: 50%
    }

    .top-\[60\%\] {
        top: 60%
    }

    .top-full {
        top: 100%
    }

    .-right-12 {
        right: calc(var(--spacing)*-12)
    }

    .right-0 {
        right: calc(var(--spacing)*0)
    }

    .right-1 {
        right: calc(var(--spacing)*1)
    }

    .right-2 {
        right: calc(var(--spacing)*2)
    }

    .right-3 {
        right: calc(var(--spacing)*3)
    }

    .right-4 {
        right: calc(var(--spacing)*4)
    }

    .-bottom-12 {
        bottom: calc(var(--spacing)*-12)
    }

    .bottom-0 {
        bottom: calc(var(--spacing)*0)
    }

    .bottom-1 {
        bottom: calc(var(--spacing)*1)
    }

    .bottom-4 {
        bottom: calc(var(--spacing)*4)
    }

    .-left-12 {
        left: calc(var(--spacing)*-12)
    }

    .left-0 {
        left: calc(var(--spacing)*0)
    }

    .left-1\/2 {
        left: 50%
    }

    .left-2 {
        left: calc(var(--spacing)*2)
    }

    .left-4 {
        left: calc(var(--spacing)*4)
    }

    .left-\[50\%\] {
        left: 50%
    }

    .isolate {
        isolation: isolate
    }

    .z-10 {
        z-index: 10
    }

    .z-20 {
        z-index: 20
    }

    .z-40 {
        z-index: 40
    }

    .z-50 {
        z-index: 50
    }

    .z-\[1\] {
        z-index: 1
    }

    .order-first {
        order: -9999
    }

    .order-last {
        order: 9999
    }

    .col-start-2 {
        grid-column-start: 2
    }

    .row-span-2 {
        grid-row: span 2/span 2
    }

    .row-start-1 {
        grid-row-start: 1
    }

    .container {
        width: 100%
    }

    @media (min-width:40rem) {
        .container {
            max-width: 40rem
        }
    }

    @media (min-width:48rem) {
        .container {
            max-width: 48rem
        }
    }

    @media (min-width:64rem) {
        .container {
            max-width: 64rem
        }
    }

    @media (min-width:80rem) {
        .container {
            max-width: 80rem
        }
    }

    @media (min-width:96rem) {
        .container {
            max-width: 96rem
        }
    }

    .\!m-0 {
        margin: calc(var(--spacing)*0) !important
    }

    .-mx-1 {
        margin-inline: calc(var(--spacing)*-1)
    }

    .mx-2 {
        margin-inline: calc(var(--spacing)*2)
    }

    .mx-3\.5 {
        margin-inline: calc(var(--spacing)*3.5)
    }

    .mx-auto {
        margin-inline: auto
    }

    .-my-2 {
        margin-block: calc(var(--spacing)*-2)
    }

    .my-0 {
        margin-block: calc(var(--spacing)*0)
    }

    .my-0\.5 {
        margin-block: calc(var(--spacing)*.5)
    }

    .my-1 {
        margin-block: calc(var(--spacing)*1)
    }

    .-mt-4 {
        margin-top: calc(var(--spacing)*-4)
    }

    .mt-0\.5 {
        margin-top: calc(var(--spacing)*.5)
    }

    .mt-1 {
        margin-top: calc(var(--spacing)*1)
    }

    .mt-1\.5 {
        margin-top: calc(var(--spacing)*1.5)
    }

    .mt-2 {
        margin-top: calc(var(--spacing)*2)
    }

    .mt-3 {
        margin-top: calc(var(--spacing)*3)
    }

    .mt-4 {
        margin-top: calc(var(--spacing)*4)
    }

    .mt-8 {
        margin-top: calc(var(--spacing)*8)
    }

    .mt-12 {
        margin-top: calc(var(--spacing)*12)
    }

    .mt-auto {
        margin-top: auto
    }

    .mr-2 {
        margin-right: calc(var(--spacing)*2)
    }

    .mr-4 {
        margin-right: calc(var(--spacing)*4)
    }

    .mb-1 {
        margin-bottom: calc(var(--spacing)*1)
    }

    .mb-2 {
        margin-bottom: calc(var(--spacing)*2)
    }

    .mb-3 {
        margin-bottom: calc(var(--spacing)*3)
    }

    .mb-4 {
        margin-bottom: calc(var(--spacing)*4)
    }

    .mb-6 {
        margin-bottom: calc(var(--spacing)*6)
    }

    .mb-8 {
        margin-bottom: calc(var(--spacing)*8)
    }

    .mb-12 {
        margin-bottom: calc(var(--spacing)*12)
    }

    .-ml-4 {
        margin-left: calc(var(--spacing)*-4)
    }

    .ml-1 {
        margin-left: calc(var(--spacing)*1)
    }

    .ml-2 {
        margin-left: calc(var(--spacing)*2)
    }

    .ml-4 {
        margin-left: calc(var(--spacing)*4)
    }

    .ml-auto {
        margin-left: auto
    }

    .line-clamp-1 {
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        display: -webkit-box;
        overflow: hidden
    }

    .line-clamp-2 {
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        display: -webkit-box;
        overflow: hidden
    }

    .block {
        display: block
    }

    .contents {
        display: contents
    }

    .flex {
        display: flex
    }

    .grid {
        display: grid
    }

    .hidden {
        display: none
    }

    .inline {
        display: inline
    }

    .inline-block {
        display: inline-block
    }

    .inline-flex {
        display: inline-flex
    }

    .table {
        display: table
    }

    .table-caption {
        display: table-caption
    }

    .table-cell {
        display: table-cell
    }

    .table-row {
        display: table-row
    }

    .field-sizing-content {
        field-sizing: content
    }

    .aspect-square {
        aspect-ratio: 1
    }

    .aspect-video {
        aspect-ratio: var(--aspect-video)
    }

    .size-\(--cell-size\) {
        width: var(--cell-size);
        height: var(--cell-size)
    }

    .size-2 {
        width: calc(var(--spacing)*2);
        height: calc(var(--spacing)*2)
    }

    .size-2\.5 {
        width: calc(var(--spacing)*2.5);
        height: calc(var(--spacing)*2.5)
    }

    .size-3 {
        width: calc(var(--spacing)*3);
        height: calc(var(--spacing)*3)
    }

    .size-3\.5 {
        width: calc(var(--spacing)*3.5);
        height: calc(var(--spacing)*3.5)
    }

    .size-4 {
        width: calc(var(--spacing)*4);
        height: calc(var(--spacing)*4)
    }

    .size-6 {
        width: calc(var(--spacing)*6);
        height: calc(var(--spacing)*6)
    }

    .size-7 {
        width: calc(var(--spacing)*7);
        height: calc(var(--spacing)*7)
    }

    .size-8 {
        width: calc(var(--spacing)*8);
        height: calc(var(--spacing)*8)
    }

    .size-9 {
        width: calc(var(--spacing)*9);
        height: calc(var(--spacing)*9)
    }

    .size-10 {
        width: calc(var(--spacing)*10);
        height: calc(var(--spacing)*10)
    }

    .size-12 {
        width: calc(var(--spacing)*12);
        height: calc(var(--spacing)*12)
    }

    .size-auto {
        width: auto;
        height: auto
    }

    .size-full {
        width: 100%;
        height: 100%
    }

    .h-\(--cell-size\) {
        height: var(--cell-size)
    }

    .h-1\.5 {
        height: calc(var(--spacing)*1.5)
    }

    .h-2 {
        height: calc(var(--spacing)*2)
    }

    .h-2\.5 {
        height: calc(var(--spacing)*2.5)
    }

    .h-3 {
        height: calc(var(--spacing)*3)
    }

    .h-4 {
        height: calc(var(--spacing)*4)
    }

    .h-5 {
        height: calc(var(--spacing)*5)
    }

    .h-6 {
        height: calc(var(--spacing)*6)
    }

    .h-7 {
        height: calc(var(--spacing)*7)
    }

    .h-8 {
        height: calc(var(--spacing)*8)
    }

    .h-9 {
        height: calc(var(--spacing)*9)
    }

    .h-10 {
        height: calc(var(--spacing)*10)
    }

    .h-11 {
        height: calc(var(--spacing)*11)
    }

    .h-12 {
        height: calc(var(--spacing)*12)
    }

    .h-14 {
        height: calc(var(--spacing)*14)
    }

    .h-16 {
        height: calc(var(--spacing)*16)
    }

    .h-20 {
        height: calc(var(--spacing)*20)
    }

    .h-24 {
        height: calc(var(--spacing)*24)
    }

    .h-32 {
        height: calc(var(--spacing)*32)
    }

    .h-48 {
        height: calc(var(--spacing)*48)
    }

    .h-64 {
        height: calc(var(--spacing)*64)
    }

    .h-\[1\.15rem\] {
        height: 1.15rem
    }

    .h-\[38px\] {
        height: 38px
    }

    .h-\[200px\] {
        height: 200px
    }

    .h-\[500px\] {
        height: 500px
    }

    .h-\[calc\(100\%-1px\)\] {
        height: calc(100% - 1px)
    }

    .h-\[var\(--radix-navigation-menu-viewport-height\)\] {
        height: var(--radix-navigation-menu-viewport-height)
    }

    .h-\[var\(--radix-select-trigger-height\)\] {
        height: var(--radix-select-trigger-height)
    }

    .h-auto {
        height: auto
    }

    .h-full {
        height: 100%
    }

    .h-px {
        height: 1px
    }

    .h-svh {
        height: 100svh
    }

    .max-h-\(--radix-context-menu-content-available-height\) {
        max-height: var(--radix-context-menu-content-available-height)
    }

    .max-h-\(--radix-dropdown-menu-content-available-height\) {
        max-height: var(--radix-dropdown-menu-content-available-height)
    }

    .max-h-\(--radix-select-content-available-height\) {
        max-height: var(--radix-select-content-available-height)
    }

    .max-h-32 {
        max-height: calc(var(--spacing)*32)
    }

    .max-h-\[300px\] {
        max-height: 300px
    }

    .min-h-0 {
        min-height: calc(var(--spacing)*0)
    }

    .min-h-4 {
        min-height: calc(var(--spacing)*4)
    }

    .min-h-9 {
        min-height: calc(var(--spacing)*9)
    }

    .min-h-16 {
        min-height: calc(var(--spacing)*16)
    }

    .min-h-\[200px\] {
        min-height: 200px
    }

    .min-h-screen {
        min-height: 100vh
    }

    .min-h-svh {
        min-height: 100svh
    }

    .w-\(--cell-size\) {
        width: var(--cell-size)
    }

    .w-\(--sidebar-width\) {
        width: var(--sidebar-width)
    }

    .w-0 {
        width: calc(var(--spacing)*0)
    }

    .w-1 {
        width: calc(var(--spacing)*1)
    }

    .w-1\.5 {
        width: calc(var(--spacing)*1.5)
    }

    .w-1\/2 {
        width: 50%
    }

    .w-2 {
        width: calc(var(--spacing)*2)
    }

    .w-2\.5 {
        width: calc(var(--spacing)*2.5)
    }

    .w-3 {
        width: calc(var(--spacing)*3)
    }

    .w-3\/4 {
        width: 75%
    }

    .w-4 {
        width: calc(var(--spacing)*4)
    }

    .w-5 {
        width: calc(var(--spacing)*5)
    }

    .w-6 {
        width: calc(var(--spacing)*6)
    }

    .w-7 {
        width: calc(var(--spacing)*7)
    }

    .w-8 {
        width: calc(var(--spacing)*8)
    }

    .w-9 {
        width: calc(var(--spacing)*9)
    }

    .w-10 {
        width: calc(var(--spacing)*10)
    }

    .w-12 {
        width: calc(var(--spacing)*12)
    }

    .w-16 {
        width: calc(var(--spacing)*16)
    }

    .w-20 {
        width: calc(var(--spacing)*20)
    }

    .w-24 {
        width: calc(var(--spacing)*24)
    }

    .w-32 {
        width: calc(var(--spacing)*32)
    }

    .w-48 {
        width: calc(var(--spacing)*48)
    }

    .w-64 {
        width: calc(var(--spacing)*64)
    }

    .w-72 {
        width: calc(var(--spacing)*72)
    }

    .w-\[38px\] {
        width: 38px
    }

    .w-\[100px\] {
        width: 100px
    }

    .w-\[280px\] {
        width: 280px
    }

    .w-\[400px\] {
        width: 400px
    }

    .w-auto {
        width: auto
    }

    .w-fit {
        width: fit-content
    }

    .w-full {
        width: 100%
    }

    .w-max {
        width: max-content
    }

    .w-px {
        width: 1px
    }

    .max-w-\(--skeleton-width\) {
        max-width: var(--skeleton-width)
    }

    .max-w-2xl {
        max-width: var(--container-2xl)
    }

    .max-w-3xl {
        max-width: var(--container-3xl)
    }

    .max-w-4xl {
        max-width: var(--container-4xl)
    }

    .max-w-5xl {
        max-width: var(--container-5xl)
    }

    .max-w-6xl {
        max-width: var(--container-6xl)
    }

    .max-w-7xl {
        max-width: var(--container-7xl)
    }

    .max-w-\[80\%\] {
        max-width: 80%
    }

    .max-w-\[calc\(100\%-2rem\)\] {
        max-width: calc(100% - 2rem)
    }

    .max-w-max {
        max-width: max-content
    }

    .max-w-md {
        max-width: var(--container-md)
    }

    .max-w-none {
        max-width: none
    }

    .max-w-sm {
        max-width: var(--container-sm)
    }

    .max-w-xs {
        max-width: var(--container-xs)
    }

    .min-w-\(--cell-size\) {
        min-width: var(--cell-size)
    }

    .min-w-0 {
        min-width: calc(var(--spacing)*0)
    }

    .min-w-5 {
        min-width: calc(var(--spacing)*5)
    }

    .min-w-8 {
        min-width: calc(var(--spacing)*8)
    }

    .min-w-9 {
        min-width: calc(var(--spacing)*9)
    }

    .min-w-10 {
        min-width: calc(var(--spacing)*10)
    }

    .min-w-\[8rem\] {
        min-width: 8rem
    }

    .min-w-\[12rem\] {
        min-width: 12rem
    }

    .min-w-\[var\(--radix-select-trigger-width\)\] {
        min-width: var(--radix-select-trigger-width)
    }

    .flex-1 {
        flex: 1
    }

    .flex-\[0_0_100\%\] {
        flex: 0 0 100%
    }

    .flex-shrink {
        flex-shrink: 1
    }

    .flex-shrink-0 {
        flex-shrink: 0
    }

    .shrink {
        flex-shrink: 1
    }

    .shrink-0 {
        flex-shrink: 0
    }

    .grow {
        flex-grow: 1
    }

    .grow-0 {
        flex-grow: 0
    }

    .basis-full {
        flex-basis: 100%
    }

    .caption-bottom {
        caption-side: bottom
    }

    .border-collapse {
        border-collapse: collapse
    }

    .origin-\(--radix-context-menu-content-transform-origin\) {
        transform-origin: var(--radix-context-menu-content-transform-origin)
    }

    .origin-\(--radix-dropdown-menu-content-transform-origin\) {
        transform-origin: var(--radix-dropdown-menu-content-transform-origin)
    }

    .origin-\(--radix-hover-card-content-transform-origin\) {
        transform-origin: var(--radix-hover-card-content-transform-origin)
    }

    .origin-\(--radix-menubar-content-transform-origin\) {
        transform-origin: var(--radix-menubar-content-transform-origin)
    }

    .origin-\(--radix-popover-content-transform-origin\) {
        transform-origin: var(--radix-popover-content-transform-origin)
    }

    .origin-\(--radix-select-content-transform-origin\) {
        transform-origin: var(--radix-select-content-transform-origin)
    }

    .origin-\(--radix-tooltip-content-transform-origin\) {
        transform-origin: var(--radix-tooltip-content-transform-origin)
    }

    .-translate-x-1\/2 {
        --tw-translate-x: -50%;
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .-translate-x-px {
        --tw-translate-x: -1px;
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .translate-x-\[-50\%\] {
        --tw-translate-x: -50%;
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .translate-x-px {
        --tw-translate-x: 1px;
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .-translate-y-1\/2 {
        --tw-translate-y: -50%;
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .translate-y-0 {
        --tw-translate-y: calc(var(--spacing)*0);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .translate-y-0\.5 {
        --tw-translate-y: calc(var(--spacing)*.5);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .translate-y-8 {
        --tw-translate-y: calc(var(--spacing)*8);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .translate-y-\[-50\%\] {
        --tw-translate-y: -50%;
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .translate-y-\[calc\(-50\%_-_2px\)\] {
        --tw-translate-y: calc(-50% - 2px);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .-rotate-90 {
        rotate: -90deg
    }

    .rotate-45 {
        rotate: 45deg
    }

    .rotate-90 {
        rotate: 90deg
    }

    .transform {
        transform: var(--tw-rotate-x, )var(--tw-rotate-y, )var(--tw-rotate-z, )var(--tw-skew-x, )var(--tw-skew-y, )
    }

    .animate-caret-blink {
        animation: 1.25s ease-out infinite caret-blink
    }

    .animate-in {
        animation: enter var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none)
    }

    .animate-pulse {
        animation: var(--animate-pulse)
    }

    .animate-spin {
        animation: var(--animate-spin)
    }

    .cursor-col-resize {
        cursor: col-resize
    }

    .cursor-default {
        cursor: default
    }

    .cursor-pointer {
        cursor: pointer
    }

    .cursor-text {
        cursor: text
    }

    .touch-none {
        touch-action: none
    }

    .resize {
        resize: both
    }

    .resize-none {
        resize: none
    }

    .scroll-my-1 {
        scroll-margin-block: calc(var(--spacing)*1)
    }

    .scroll-py-1 {
        scroll-padding-block: calc(var(--spacing)*1)
    }

    .list-inside {
        list-style-position: inside
    }

    .list-disc {
        list-style-type: disc
    }

    .list-none {
        list-style-type: none
    }

    .auto-rows-min {
        grid-auto-rows: min-content
    }

    .grid-cols-1 {
        grid-template-columns: repeat(1, minmax(0, 1fr))
    }

    .grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .grid-cols-7 {
        grid-template-columns: repeat(7, minmax(0, 1fr))
    }

    .grid-cols-\[0_1fr\] {
        grid-template-columns: 0 1fr
    }

    .grid-rows-\[auto_auto\] {
        grid-template-rows: auto auto
    }

    .flex-col {
        flex-direction: column
    }

    .flex-col-reverse {
        flex-direction: column-reverse
    }

    .flex-row {
        flex-direction: row
    }

    .flex-wrap {
        flex-wrap: wrap
    }

    .items-center {
        align-items: center
    }

    .items-end {
        align-items: flex-end
    }

    .items-start {
        align-items: flex-start
    }

    .items-stretch {
        align-items: stretch
    }

    .justify-between {
        justify-content: space-between
    }

    .justify-center {
        justify-content: center
    }

    .justify-end {
        justify-content: flex-end
    }

    .justify-start {
        justify-content: flex-start
    }

    .justify-items-start {
        justify-items: start
    }

    .gap-0 {
        gap: calc(var(--spacing)*0)
    }

    .gap-0\.5 {
        gap: calc(var(--spacing)*.5)
    }

    .gap-1 {
        gap: calc(var(--spacing)*1)
    }

    .gap-1\.5 {
        gap: calc(var(--spacing)*1.5)
    }

    .gap-2 {
        gap: calc(var(--spacing)*2)
    }

    .gap-2\.5 {
        gap: calc(var(--spacing)*2.5)
    }

    .gap-3 {
        gap: calc(var(--spacing)*3)
    }

    .gap-4 {
        gap: calc(var(--spacing)*4)
    }

    .gap-6 {
        gap: calc(var(--spacing)*6)
    }

    .gap-7 {
        gap: calc(var(--spacing)*7)
    }

    .gap-8 {
        gap: calc(var(--spacing)*8)
    }

    :where(.space-y-1>:not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(calc(var(--spacing)*1)*var(--tw-space-y-reverse));
        margin-block-end: calc(calc(var(--spacing)*1)*calc(1 - var(--tw-space-y-reverse)))
    }

    :where(.space-y-1\.5>:not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(calc(var(--spacing)*1.5)*var(--tw-space-y-reverse));
        margin-block-end: calc(calc(var(--spacing)*1.5)*calc(1 - var(--tw-space-y-reverse)))
    }

    :where(.space-y-2>:not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(calc(var(--spacing)*2)*var(--tw-space-y-reverse));
        margin-block-end: calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-y-reverse)))
    }

    :where(.space-y-3>:not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(calc(var(--spacing)*3)*var(--tw-space-y-reverse));
        margin-block-end: calc(calc(var(--spacing)*3)*calc(1 - var(--tw-space-y-reverse)))
    }

    :where(.space-y-4>:not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(calc(var(--spacing)*4)*var(--tw-space-y-reverse));
        margin-block-end: calc(calc(var(--spacing)*4)*calc(1 - var(--tw-space-y-reverse)))
    }

    :where(.space-y-6>:not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(calc(var(--spacing)*6)*var(--tw-space-y-reverse));
        margin-block-end: calc(calc(var(--spacing)*6)*calc(1 - var(--tw-space-y-reverse)))
    }

    :where(.space-y-8>:not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(calc(var(--spacing)*8)*var(--tw-space-y-reverse));
        margin-block-end: calc(calc(var(--spacing)*8)*calc(1 - var(--tw-space-y-reverse)))
    }

    :where(.space-y-12>:not(:last-child)) {
        --tw-space-y-reverse: 0;
        margin-block-start: calc(calc(var(--spacing)*12)*var(--tw-space-y-reverse));
        margin-block-end: calc(calc(var(--spacing)*12)*calc(1 - var(--tw-space-y-reverse)))
    }

    :where(.space-x-2>:not(:last-child)) {
        --tw-space-x-reverse: 0;
        margin-inline-start: calc(calc(var(--spacing)*2)*var(--tw-space-x-reverse));
        margin-inline-end: calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-x-reverse)))
    }

    .gap-y-0\.5 {
        row-gap: calc(var(--spacing)*.5)
    }

    :where(.divide-y>:not(:last-child)) {
        --tw-divide-y-reverse: 0;
        border-bottom-style: var(--tw-border-style);
        border-top-style: var(--tw-border-style);
        border-top-width: calc(1px*var(--tw-divide-y-reverse));
        border-bottom-width: calc(1px*calc(1 - var(--tw-divide-y-reverse)))
    }

    :where(.divide-white\/5>:not(:last-child)) {
        border-color: #ffffff0d
    }

    @supports (color:color-mix(in lab, red, red)) {
        :where(.divide-white\/5>:not(:last-child)) {
            border-color: color-mix(in oklab, var(--color-white)5%, transparent)
        }
    }

    .self-start {
        align-self: flex-start
    }

    .self-stretch {
        align-self: stretch
    }

    .justify-self-end {
        justify-self: flex-end
    }

    .truncate {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden
    }

    .overflow-auto {
        overflow: auto
    }

    .overflow-hidden {
        overflow: hidden
    }

    .overflow-x-auto {
        overflow-x: auto
    }

    .overflow-x-hidden {
        overflow-x: hidden
    }

    .overflow-y-auto {
        overflow-y: auto
    }

    .rounded {
        border-radius: .25rem
    }

    .rounded-2xl {
        border-radius: var(--radius-2xl)
    }

    .rounded-\[2px\] {
        border-radius: 2px
    }

    .rounded-\[4px\] {
        border-radius: 4px
    }

    .rounded-\[10px\] {
        border-radius: 10px
    }

    .rounded-\[20px\] {
        border-radius: 20px
    }

    .rounded-\[calc\(var\(--radius\)-5px\)\] {
        border-radius: calc(var(--radius) - 5px)
    }

    .rounded-\[inherit\] {
        border-radius: inherit
    }

    .rounded-full {
        border-radius: 3.40282e38px
    }

    .rounded-lg {
        border-radius: var(--radius-lg)
    }

    .rounded-md {
        border-radius: var(--radius-md)
    }

    .rounded-none {
        border-radius: 0
    }

    .rounded-sm {
        border-radius: var(--radius-sm)
    }

    .rounded-xl {
        border-radius: var(--radius-xl)
    }

    .rounded-xs {
        border-radius: var(--radius-xs)
    }

    .rounded-l-md {
        border-top-left-radius: var(--radius-md);
        border-bottom-left-radius: var(--radius-md)
    }

    .rounded-tl-sm {
        border-top-left-radius: var(--radius-sm)
    }

    .rounded-r-lg {
        border-top-right-radius: var(--radius-lg);
        border-bottom-right-radius: var(--radius-lg)
    }

    .rounded-r-md {
        border-top-right-radius: var(--radius-md);
        border-bottom-right-radius: var(--radius-md)
    }

    .border {
        border-style: var(--tw-border-style);
        border-width: 1px
    }

    .border-0 {
        border-style: var(--tw-border-style);
        border-width: 0
    }

    .border-2 {
        border-style: var(--tw-border-style);
        border-width: 2px
    }

    .border-\[1\.5px\] {
        border-style: var(--tw-border-style);
        border-width: 1.5px
    }

    .border-y {
        border-block-style: var(--tw-border-style);
        border-block-width: 1px
    }

    .border-t {
        border-top-style: var(--tw-border-style);
        border-top-width: 1px
    }

    .border-r {
        border-right-style: var(--tw-border-style);
        border-right-width: 1px
    }

    .border-r-0 {
        border-right-style: var(--tw-border-style);
        border-right-width: 0
    }

    .border-b {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 1px
    }

    .border-l {
        border-left-style: var(--tw-border-style);
        border-left-width: 1px
    }

    .border-l-4 {
        border-left-style: var(--tw-border-style);
        border-left-width: 4px
    }

    .border-dashed {
        --tw-border-style: dashed;
        border-style: dashed
    }

    .border-\(--color-border\) {
        border-color: var(--color-border)
    }

    .border-\[\#c41e3a\] {
        border-color: #c41e3a
    }

    .border-\[rgba\(0\,0\,0\,0\.08\)\] {
        border-color: #00000014
    }

    .border-gray-200 {
        border-color: var(--color-gray-200)
    }

    .border-red-600 {
        border-color: var(--color-red-600)
    }

    .border-transparent {
        border-color: #0000
    }

    .border-white\/10 {
        border-color: #ffffff1a
    }

    @supports (color:color-mix(in lab, red, red)) {
        .border-white\/10 {
            border-color: color-mix(in oklab, var(--color-white)10%, transparent)
        }
    }

    .border-t-transparent {
        border-top-color: #0000
    }

    .border-l-transparent {
        border-left-color: #0000
    }

    .bg-\(--color-bg\) {
        background-color: var(--color-bg)
    }

    .bg-\[\#0a0a0a\] {
        background-color: #0a0a0a
    }

    .bg-\[\#0a0a0a\]\/80 {
        background-color: #0a0a0acc
    }

    .bg-\[\#1a1a19\] {
        background-color: #1a1a19
    }

    .bg-\[\#111\] {
        background-color: #111
    }

    .bg-\[\#c41e3a\] {
        background-color: #c41e3a
    }

    .bg-\[\#f8f8f7\] {
        background-color: #f8f8f7
    }

    .bg-\[\#f8f9fa\] {
        background-color: #f8f9fa
    }

    .bg-\[\#fff5f7\] {
        background-color: #fff5f7
    }

    .bg-\[var\(--goli-burgundy\)\] {
        background-color: var(--goli-burgundy)
    }

    .bg-\[var\(--goli-cream\)\] {
        background-color: var(--goli-cream)
    }

    .bg-\[var\(--goli-pink-light\)\] {
        background-color: var(--goli-pink-light)
    }

    .bg-black {
        background-color: var(--color-black)
    }

    .bg-black\/50 {
        background-color: #00000080
    }

    @supports (color:color-mix(in lab, red, red)) {
        .bg-black\/50 {
            background-color: color-mix(in oklab, var(--color-black)50%, transparent)
        }
    }

    .bg-gray-100 {
        background-color: var(--color-gray-100)
    }

    .bg-gray-200 {
        background-color: var(--color-gray-200)
    }

    .bg-green-500\/80 {
        background-color: #00c758cc
    }

    @supports (color:color-mix(in lab, red, red)) {
        .bg-green-500\/80 {
            background-color: color-mix(in oklab, var(--color-green-500)80%, transparent)
        }
    }

    .bg-orange-100 {
        background-color: var(--color-orange-100)
    }

    .bg-red-100 {
        background-color: var(--color-red-100)
    }

    .bg-transparent {
        background-color: #0000
    }

    .bg-white {
        background-color: var(--color-white)
    }

    .bg-white\/15 {
        background-color: #ffffff26
    }

    @supports (color:color-mix(in lab, red, red)) {
        .bg-white\/15 {
            background-color: color-mix(in oklab, var(--color-white)15%, transparent)
        }
    }

    .bg-white\/\[0\.02\] {
        background-color: #ffffff05
    }

    @supports (color:color-mix(in lab, red, red)) {
        .bg-white\/\[0\.02\] {
            background-color: color-mix(in oklab, var(--color-white)2%, transparent)
        }
    }

    .bg-yellow-100 {
        background-color: var(--color-yellow-100)
    }

    .bg-gradient-to-r {
        --tw-gradient-position: to right in oklab;
        background-image: linear-gradient(var(--tw-gradient-stops))
    }

    .from-\[\#c41e3a\] {
        --tw-gradient-from: #c41e3a;
        --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position))
    }

    .to-\[\#a40011\] {
        --tw-gradient-to: #a40011;
        --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from)var(--tw-gradient-from-position), var(--tw-gradient-to)var(--tw-gradient-to-position))
    }

    .fill-\[var\(--goli-gold\)\] {
        fill: var(--goli-gold)
    }

    .fill-current {
        fill: currentColor
    }

    .object-cover {
        object-fit: cover
    }

    .p-0 {
        padding: calc(var(--spacing)*0)
    }

    .p-1 {
        padding: calc(var(--spacing)*1)
    }

    .p-1\.5 {
        padding: calc(var(--spacing)*1.5)
    }

    .p-2 {
        padding: calc(var(--spacing)*2)
    }

    .p-3 {
        padding: calc(var(--spacing)*3)
    }

    .p-4 {
        padding: calc(var(--spacing)*4)
    }

    .p-5 {
        padding: calc(var(--spacing)*5)
    }

    .p-6 {
        padding: calc(var(--spacing)*6)
    }

    .p-8 {
        padding: calc(var(--spacing)*8)
    }

    .p-10 {
        padding: calc(var(--spacing)*10)
    }

    .p-\[3px\] {
        padding: 3px
    }

    .p-px {
        padding: 1px
    }

    .px-\(--cell-size\) {
        padding-inline: var(--cell-size)
    }

    .px-1 {
        padding-inline: calc(var(--spacing)*1)
    }

    .px-1\.5 {
        padding-inline: calc(var(--spacing)*1.5)
    }

    .px-2 {
        padding-inline: calc(var(--spacing)*2)
    }

    .px-2\.5 {
        padding-inline: calc(var(--spacing)*2.5)
    }

    .px-3 {
        padding-inline: calc(var(--spacing)*3)
    }

    .px-4 {
        padding-inline: calc(var(--spacing)*4)
    }

    .px-5 {
        padding-inline: calc(var(--spacing)*5)
    }

    .px-6 {
        padding-inline: calc(var(--spacing)*6)
    }

    .px-8 {
        padding-inline: calc(var(--spacing)*8)
    }

    .py-0\.5 {
        padding-block: calc(var(--spacing)*.5)
    }

    .py-1 {
        padding-block: calc(var(--spacing)*1)
    }

    .py-1\.5 {
        padding-block: calc(var(--spacing)*1.5)
    }

    .py-2 {
        padding-block: calc(var(--spacing)*2)
    }

    .py-2\.5 {
        padding-block: calc(var(--spacing)*2.5)
    }

    .py-3 {
        padding-block: calc(var(--spacing)*3)
    }

    .py-4 {
        padding-block: calc(var(--spacing)*4)
    }

    .py-5 {
        padding-block: calc(var(--spacing)*5)
    }

    .py-6 {
        padding-block: calc(var(--spacing)*6)
    }

    .py-8 {
        padding-block: calc(var(--spacing)*8)
    }

    .py-12 {
        padding-block: calc(var(--spacing)*12)
    }

    .py-16 {
        padding-block: calc(var(--spacing)*16)
    }

    .pt-0 {
        padding-top: calc(var(--spacing)*0)
    }

    .pt-2 {
        padding-top: calc(var(--spacing)*2)
    }

    .pt-3 {
        padding-top: calc(var(--spacing)*3)
    }

    .pt-4 {
        padding-top: calc(var(--spacing)*4)
    }

    .pt-6 {
        padding-top: calc(var(--spacing)*6)
    }

    .pt-12 {
        padding-top: calc(var(--spacing)*12)
    }

    .pr-1 {
        padding-right: calc(var(--spacing)*1)
    }

    .pr-2 {
        padding-right: calc(var(--spacing)*2)
    }

    .pr-2\.5 {
        padding-right: calc(var(--spacing)*2.5)
    }

    .pr-3 {
        padding-right: calc(var(--spacing)*3)
    }

    .pr-8 {
        padding-right: calc(var(--spacing)*8)
    }

    .pb-3 {
        padding-bottom: calc(var(--spacing)*3)
    }

    .pb-4 {
        padding-bottom: calc(var(--spacing)*4)
    }

    .pb-5 {
        padding-bottom: calc(var(--spacing)*5)
    }

    .pb-6 {
        padding-bottom: calc(var(--spacing)*6)
    }

    .pl-2 {
        padding-left: calc(var(--spacing)*2)
    }

    .pl-3 {
        padding-left: calc(var(--spacing)*3)
    }

    .pl-4 {
        padding-left: calc(var(--spacing)*4)
    }

    .pl-8 {
        padding-left: calc(var(--spacing)*8)
    }

    .pl-16 {
        padding-left: calc(var(--spacing)*16)
    }

    .text-center {
        text-align: center
    }

    .text-left {
        text-align: left
    }

    .text-right {
        text-align: right
    }

    .align-middle {
        vertical-align: middle
    }

    .font-mono {
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace
    }

    .font-sans {
        font-family: Gilroy, sans-serif
    }

    .text-2xl {
        font-size: var(--text-2xl);
        line-height: var(--tw-leading, var(--text-2xl--line-height))
    }

    .text-3xl {
        font-size: var(--text-3xl);
        line-height: var(--tw-leading, var(--text-3xl--line-height))
    }

    .text-4xl {
        font-size: var(--text-4xl);
        line-height: var(--tw-leading, var(--text-4xl--line-height))
    }

    .text-base {
        font-size: var(--text-base);
        line-height: var(--tw-leading, var(--text-base--line-height))
    }

    .text-lg {
        font-size: var(--text-lg);
        line-height: var(--tw-leading, var(--text-lg--line-height))
    }

    .text-sm {
        font-size: var(--text-sm);
        line-height: var(--tw-leading, var(--text-sm--line-height))
    }

    .text-sm\/relaxed {
        font-size: var(--text-sm);
        line-height: var(--leading-relaxed)
    }

    .text-xl {
        font-size: var(--text-xl);
        line-height: var(--tw-leading, var(--text-xl--line-height))
    }

    .text-xs {
        font-size: var(--text-xs);
        line-height: var(--tw-leading, var(--text-xs--line-height))
    }

    .text-\[0\.8rem\] {
        font-size: .8rem
    }

    .text-\[9px\] {
        font-size: var(--fs-badge)
    }

    .text-\[10px\] {
        font-size: var(--fs-xs)
    }

    .leading-5 {
        --tw-leading: calc(var(--spacing)*5);
        line-height: calc(var(--spacing)*5)
    }

    .leading-\[26px\] {
        --tw-leading: 26px;
        line-height: 26px
    }

    .leading-none {
        --tw-leading: 1;
        line-height: 1
    }

    .leading-normal {
        --tw-leading: var(--leading-normal);
        line-height: var(--leading-normal)
    }

    .leading-relaxed {
        --tw-leading: var(--leading-relaxed);
        line-height: var(--leading-relaxed)
    }

    .leading-snug {
        --tw-leading: var(--leading-snug);
        line-height: var(--leading-snug)
    }

    .font-bold {
        --tw-font-weight: var(--font-weight-bold);
        font-weight: var(--font-weight-bold)
    }

    .font-medium {
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium)
    }

    .font-normal {
        --tw-font-weight: var(--font-weight-normal);
        font-weight: var(--font-weight-normal)
    }

    .font-semibold {
        --tw-font-weight: var(--font-weight-semibold);
        font-weight: var(--font-weight-semibold)
    }

    .tracking-\[-0\.44px\] {
        --tw-tracking: -.44px;
        letter-spacing: -.44px
    }

    .tracking-\[-0\.154px\] {
        --tw-tracking: -.154px;
        letter-spacing: -.154px
    }

    .tracking-tight {
        --tw-tracking: var(--tracking-tight);
        letter-spacing: var(--tracking-tight)
    }

    .tracking-wide {
        --tw-tracking: var(--tracking-wide);
        letter-spacing: var(--tracking-wide)
    }

    .tracking-wider {
        --tw-tracking: var(--tracking-wider);
        letter-spacing: var(--tracking-wider)
    }

    .tracking-widest {
        --tw-tracking: var(--tracking-widest);
        letter-spacing: var(--tracking-widest)
    }

    .text-balance {
        text-wrap: balance
    }

    .break-words {
        overflow-wrap: break-word
    }

    .whitespace-break-spaces {
        white-space: break-spaces
    }

    .whitespace-nowrap {
        white-space: nowrap
    }

    .whitespace-pre-wrap {
        white-space: pre-wrap
    }

    .text-\[\#34322d\] {
        color: #34322d
    }

    .text-\[\#50000B\] {
        color: #50000b
    }

    .text-\[\#858481\] {
        color: #858481
    }

    .text-\[\#c41e3a\] {
        color: #c41e3a
    }

    .text-\[var\(--goli-burgundy\)\] {
        color: var(--goli-burgundy)
    }

    .text-\[var\(--goli-gold\)\] {
        color: var(--goli-gold)
    }

    .text-blue-400 {
        color: var(--color-blue-400)
    }

    .text-current {
        color: currentColor
    }

    .text-gray-300 {
        color: var(--color-gray-300)
    }

    .text-gray-400 {
        color: var(--color-gray-400)
    }

    .text-gray-500 {
        color: var(--color-gray-500)
    }

    .text-gray-600 {
        color: var(--color-gray-600)
    }

    .text-gray-700 {
        color: var(--color-gray-700)
    }

    .text-gray-800 {
        color: var(--color-gray-800)
    }

    .text-gray-900 {
        color: var(--color-gray-900)
    }

    .text-green-400 {
        color: var(--color-green-400)
    }

    .text-orange-800 {
        color: var(--color-orange-800)
    }

    .text-red-400 {
        color: var(--color-red-400)
    }

    .text-red-800 {
        color: var(--color-red-800)
    }

    .text-white {
        color: var(--color-white)
    }

    .text-yellow-800 {
        color: var(--color-yellow-800)
    }

    .uppercase {
        text-transform: uppercase
    }

    .italic {
        font-style: italic
    }

    .tabular-nums {
        --tw-numeric-spacing: tabular-nums;
        font-variant-numeric: var(--tw-ordinal, )var(--tw-slashed-zero, )var(--tw-numeric-figure, )var(--tw-numeric-spacing, )var(--tw-numeric-fraction, )
    }

    .line-through {
        text-decoration-line: line-through
    }

    .underline {
        text-decoration-line: underline
    }

    .underline-offset-4 {
        text-underline-offset: 4px
    }

    .opacity-0 {
        opacity: 0
    }

    .opacity-20 {
        opacity: .2
    }

    .opacity-50 {
        opacity: .5
    }

    .opacity-70 {
        opacity: .7
    }

    .opacity-90 {
        opacity: .9
    }

    .opacity-100 {
        opacity: 1
    }

    .shadow {
        --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .shadow-\[0_0_0_1px_hsl\(var\(--sidebar-border\)\)\] {
        --tw-shadow: 0 0 0 1px var(--tw-shadow-color, hsl(var(--sidebar-border)));
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .shadow-\[0px_4px_11px_0px_rgba\(0\,0\,0\,0\.08\)\] {
        --tw-shadow: 0px 4px 11px 0px var(--tw-shadow-color, #00000014);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .shadow-lg {
        --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a), 0 4px 6px -4px var(--tw-shadow-color, #0000001a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .shadow-md {
        --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, #0000001a), 0 2px 4px -2px var(--tw-shadow-color, #0000001a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .shadow-none {
        --tw-shadow: 0 0 #0000;
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .shadow-sm {
        --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .shadow-xl {
        --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, #0000001a), 0 8px 10px -6px var(--tw-shadow-color, #0000001a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .shadow-xs {
        --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, #0000000d);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .ring {
        --tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .ring-0 {
        --tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(0px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .outline-hidden {
        --tw-outline-style: none;
        outline-style: none
    }

    @media (forced-colors:active) {
        .outline-hidden {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .outline {
        outline-style: var(--tw-outline-style);
        outline-width: 1px
    }

    .blur {
        --tw-blur: blur(8px);
        filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
    }

    .filter {
        filter: var(--tw-blur, )var(--tw-brightness, )var(--tw-contrast, )var(--tw-grayscale, )var(--tw-hue-rotate, )var(--tw-invert, )var(--tw-saturate, )var(--tw-sepia, )var(--tw-drop-shadow, )
    }

    .backdrop-blur {
        --tw-backdrop-blur: blur(8px);
        -webkit-backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, );
        backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, )
    }

    .backdrop-blur-2xl {
        --tw-backdrop-blur: blur(var(--blur-2xl));
        -webkit-backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, );
        backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, )
    }

    .backdrop-filter {
        -webkit-backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, );
        backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, )
    }

    .transition {
        transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
        transition-duration: var(--tw-duration, var(--default-transition-duration))
    }

    .transition-\[color\,box-shadow\] {
        transition-property: color, box-shadow;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
        transition-duration: var(--tw-duration, var(--default-transition-duration))
    }

    .transition-\[left\,right\,width\] {
        transition-property: left, right, width;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
        transition-duration: var(--tw-duration, var(--default-transition-duration))
    }

    .transition-\[margin\,opacity\] {
        transition-property: margin, opacity;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
        transition-duration: var(--tw-duration, var(--default-transition-duration))
    }

    .transition-\[width\,height\,padding\] {
        transition-property: width, height, padding;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
        transition-duration: var(--tw-duration, var(--default-transition-duration))
    }

    .transition-\[width\] {
        transition-property: width;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
        transition-duration: var(--tw-duration, var(--default-transition-duration))
    }

    .transition-all {
        transition-property: all;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
        transition-duration: var(--tw-duration, var(--default-transition-duration))
    }

    .transition-colors {
        transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
        transition-duration: var(--tw-duration, var(--default-transition-duration))
    }

    .transition-opacity {
        transition-property: opacity;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
        transition-duration: var(--tw-duration, var(--default-transition-duration))
    }

    .transition-shadow {
        transition-property: box-shadow;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
        transition-duration: var(--tw-duration, var(--default-transition-duration))
    }

    .transition-transform {
        transition-property: transform, translate, scale, rotate;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
        transition-duration: var(--tw-duration, var(--default-transition-duration))
    }

    .transition-none {
        transition-property: none
    }

    .duration-100 {
        --tw-duration: .1s;
        transition-duration: .1s
    }

    .duration-200 {
        --tw-duration: .2s;
        transition-duration: .2s
    }

    .duration-300 {
        --tw-duration: .3s;
        transition-duration: .3s
    }

    .duration-700 {
        --tw-duration: .7s;
        transition-duration: .7s
    }

    .duration-1000 {
        --tw-duration: 1s;
        transition-duration: 1s
    }

    .ease-in {
        --tw-ease: var(--ease-in);
        transition-timing-function: var(--ease-in)
    }

    .ease-in-out {
        --tw-ease: var(--ease-in-out);
        transition-timing-function: var(--ease-in-out)
    }

    .ease-linear {
        --tw-ease: linear;
        transition-timing-function: linear
    }

    .ease-out {
        --tw-ease: var(--ease-out);
        transition-timing-function: var(--ease-out)
    }

    .fade-in-0 {
        --tw-enter-opacity: 0
    }

    .outline-none {
        --tw-outline-style: none;
        outline-style: none
    }

    .select-none {
        -webkit-user-select: none;
        user-select: none
    }

    .zoom-in-95 {
        --tw-enter-scale: .95
    }

    .\[--cell-size\:--spacing\(8\)\] {
        --cell-size: calc(var(--spacing)*8)
    }

    .fade-in {
        --tw-enter-opacity: 0
    }

    .paused {
        animation-play-state: paused
    }

    .running {
        animation-play-state: running
    }

    .group-focus-within\/menu-item\:opacity-100:is(:where(.group\/menu-item):focus-within *) {
        opacity: 1
    }

    @media (hover:hover) {
        .group-hover\/menu-item\:opacity-100:is(:where(.group\/menu-item):hover *) {
            opacity: 1
        }
    }

    .group-has-data-\[sidebar\=menu-action\]\/menu-item\:pr-8:is(:where(.group\/menu-item):has([data-sidebar=menu-action]) *) {
        padding-right: calc(var(--spacing)*8)
    }

    .group-has-\[\[data-orientation\=horizontal\]\]\/field\:text-balance:is(:where(.group\/field):has([data-orientation=horizontal]) *) {
        text-wrap: balance
    }

    .group-has-\[\[data-slot\=item-description\]\]\/item\:translate-y-0\.5:is(:where(.group\/item):has([data-slot=item-description]) *) {
        --tw-translate-y: calc(var(--spacing)*.5);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .group-has-\[\[data-slot\=item-description\]\]\/item\:self-start:is(:where(.group\/item):has([data-slot=item-description]) *) {
        align-self: flex-start
    }

    .group-has-\[\>input\]\/input-group\:pt-2\.5:is(:where(.group\/input-group):has(>input) *) {
        padding-top: calc(var(--spacing)*2.5)
    }

    .group-has-\[\>input\]\/input-group\:pb-2\.5:is(:where(.group\/input-group):has(>input) *) {
        padding-bottom: calc(var(--spacing)*2.5)
    }

    .group-data-\[collapsible\=icon\]\:-mt-8:is(:where(.group)[data-collapsible=icon] *) {
        margin-top: calc(var(--spacing)*-8)
    }

    .group-data-\[collapsible\=icon\]\:hidden:is(:where(.group)[data-collapsible=icon] *) {
        display: none
    }

    .group-data-\[collapsible\=icon\]\:size-8\!:is(:where(.group)[data-collapsible=icon] *) {
        width: calc(var(--spacing)*8) !important;
        height: calc(var(--spacing)*8) !important
    }

    .group-data-\[collapsible\=icon\]\:w-\(--sidebar-width-icon\):is(:where(.group)[data-collapsible=icon] *) {
        width: var(--sidebar-width-icon)
    }

    .group-data-\[collapsible\=icon\]\:w-\[calc\(var\(--sidebar-width-icon\)\+\(--spacing\(4\)\)\)\]:is(:where(.group)[data-collapsible=icon] *) {
        width: calc(var(--sidebar-width-icon) + (calc(var(--spacing)*4)))
    }

    .group-data-\[collapsible\=icon\]\:w-\[calc\(var\(--sidebar-width-icon\)\+\(--spacing\(4\)\)\+2px\)\]:is(:where(.group)[data-collapsible=icon] *) {
        width: calc(var(--sidebar-width-icon) + (calc(var(--spacing)*4)) + 2px)
    }

    .group-data-\[collapsible\=icon\]\:justify-center:is(:where(.group)[data-collapsible=icon] *) {
        justify-content: center
    }

    .group-data-\[collapsible\=icon\]\:overflow-hidden:is(:where(.group)[data-collapsible=icon] *) {
        overflow: hidden
    }

    .group-data-\[collapsible\=icon\]\:p-0\!:is(:where(.group)[data-collapsible=icon] *) {
        padding: calc(var(--spacing)*0) !important
    }

    .group-data-\[collapsible\=icon\]\:p-2\!:is(:where(.group)[data-collapsible=icon] *) {
        padding: calc(var(--spacing)*2) !important
    }

    .group-data-\[collapsible\=icon\]\:opacity-0:is(:where(.group)[data-collapsible=icon] *) {
        opacity: 0
    }

    .group-data-\[collapsible\=offcanvas\]\:right-\[calc\(var\(--sidebar-width\)\*-1\)\]:is(:where(.group)[data-collapsible=offcanvas] *) {
        right: calc(var(--sidebar-width)*-1)
    }

    .group-data-\[collapsible\=offcanvas\]\:left-\[calc\(var\(--sidebar-width\)\*-1\)\]:is(:where(.group)[data-collapsible=offcanvas] *) {
        left: calc(var(--sidebar-width)*-1)
    }

    .group-data-\[collapsible\=offcanvas\]\:w-0:is(:where(.group)[data-collapsible=offcanvas] *) {
        width: calc(var(--spacing)*0)
    }

    .group-data-\[collapsible\=offcanvas\]\:translate-x-0:is(:where(.group)[data-collapsible=offcanvas] *) {
        --tw-translate-x: calc(var(--spacing)*0);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .group-data-\[disabled\=true\]\:pointer-events-none:is(:where(.group)[data-disabled=true] *) {
        pointer-events: none
    }

    .group-data-\[disabled\=true\]\:opacity-50:is(:where(.group)[data-disabled=true] *),
    .group-data-\[disabled\=true\]\/field\:opacity-50:is(:where(.group\/field)[data-disabled=true] *),
    .group-data-\[disabled\=true\]\/input-group\:opacity-50:is(:where(.group\/input-group)[data-disabled=true] *) {
        opacity: .5
    }

    .group-data-\[focused\=true\]\/day\:relative:is(:where(.group\/day)[data-focused=true] *) {
        position: relative
    }

    .group-data-\[focused\=true\]\/day\:z-10:is(:where(.group\/day)[data-focused=true] *) {
        z-index: 10
    }

    .group-data-\[focused\=true\]\/day\:ring-\[3px\]:is(:where(.group\/day)[data-focused=true] *) {
        --tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(3px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .group-data-\[side\=left\]\:-right-4:is(:where(.group)[data-side=left] *) {
        right: calc(var(--spacing)*-4)
    }

    .group-data-\[side\=left\]\:border-r:is(:where(.group)[data-side=left] *) {
        border-right-style: var(--tw-border-style);
        border-right-width: 1px
    }

    .group-data-\[side\=right\]\:left-0:is(:where(.group)[data-side=right] *) {
        left: calc(var(--spacing)*0)
    }

    .group-data-\[side\=right\]\:rotate-180:is(:where(.group)[data-side=right] *) {
        rotate: 180deg
    }

    .group-data-\[side\=right\]\:border-l:is(:where(.group)[data-side=right] *) {
        border-left-style: var(--tw-border-style);
        border-left-width: 1px
    }

    .group-data-\[state\=open\]\:rotate-180:is(:where(.group)[data-state=open] *) {
        rotate: 180deg
    }

    .group-data-\[variant\=floating\]\:rounded-lg:is(:where(.group)[data-variant=floating] *) {
        border-radius: var(--radius-lg)
    }

    .group-data-\[variant\=floating\]\:border:is(:where(.group)[data-variant=floating] *) {
        border-style: var(--tw-border-style);
        border-width: 1px
    }

    .group-data-\[variant\=floating\]\:shadow-sm:is(:where(.group)[data-variant=floating] *) {
        --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .group-data-\[variant\=outline\]\/field-group\:-mb-2:is(:where(.group\/field-group)[data-variant=outline] *) {
        margin-bottom: calc(var(--spacing)*-2)
    }

    .group-data-\[vaul-drawer-direction\=bottom\]\/drawer-content\:block:is(:where(.group\/drawer-content)[data-vaul-drawer-direction=bottom] *) {
        display: block
    }

    .group-data-\[vaul-drawer-direction\=bottom\]\/drawer-content\:text-center:is(:where(.group\/drawer-content)[data-vaul-drawer-direction=bottom] *),
    .group-data-\[vaul-drawer-direction\=top\]\/drawer-content\:text-center:is(:where(.group\/drawer-content)[data-vaul-drawer-direction=top] *) {
        text-align: center
    }

    .group-data-\[viewport\=false\]\/navigation-menu\:top-full:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
        top: 100%
    }

    .group-data-\[viewport\=false\]\/navigation-menu\:mt-1\.5:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
        margin-top: calc(var(--spacing)*1.5)
    }

    .group-data-\[viewport\=false\]\/navigation-menu\:overflow-hidden:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
        overflow: hidden
    }

    .group-data-\[viewport\=false\]\/navigation-menu\:rounded-md:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
        border-radius: var(--radius-md)
    }

    .group-data-\[viewport\=false\]\/navigation-menu\:border:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
        border-style: var(--tw-border-style);
        border-width: 1px
    }

    .group-data-\[viewport\=false\]\/navigation-menu\:shadow:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
        --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .group-data-\[viewport\=false\]\/navigation-menu\:duration-200:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
        --tw-duration: .2s;
        transition-duration: .2s
    }

    .peer-disabled\:cursor-not-allowed:is(:where(.peer):disabled~*) {
        cursor: not-allowed
    }

    .peer-disabled\:opacity-50:is(:where(.peer):disabled~*) {
        opacity: .5
    }

    .peer-data-\[size\=default\]\/menu-button\:top-1\.5:is(:where(.peer\/menu-button)[data-size=default]~*) {
        top: calc(var(--spacing)*1.5)
    }

    .peer-data-\[size\=lg\]\/menu-button\:top-2\.5:is(:where(.peer\/menu-button)[data-size=lg]~*) {
        top: calc(var(--spacing)*2.5)
    }

    .peer-data-\[size\=sm\]\/menu-button\:top-1:is(:where(.peer\/menu-button)[data-size=sm]~*) {
        top: calc(var(--spacing)*1)
    }

    .file\:inline-flex::file-selector-button {
        display: inline-flex
    }

    .file\:h-7::file-selector-button {
        height: calc(var(--spacing)*7)
    }

    .file\:border-0::file-selector-button {
        border-style: var(--tw-border-style);
        border-width: 0
    }

    .file\:bg-transparent::file-selector-button {
        background-color: #0000
    }

    .file\:text-sm::file-selector-button {
        font-size: var(--text-sm);
        line-height: var(--tw-leading, var(--text-sm--line-height))
    }

    .file\:font-medium::file-selector-button {
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium)
    }

    .after\:absolute:after {
        content: var(--tw-content);
        position: absolute
    }

    .after\:-inset-2:after {
        content: var(--tw-content);
        inset: calc(var(--spacing)*-2)
    }

    .after\:inset-y-0:after {
        content: var(--tw-content);
        inset-block: calc(var(--spacing)*0)
    }

    .after\:left-1\/2:after {
        content: var(--tw-content);
        left: 50%
    }

    .after\:w-1:after {
        content: var(--tw-content);
        width: calc(var(--spacing)*1)
    }

    .after\:w-\[2px\]:after {
        content: var(--tw-content);
        width: 2px
    }

    .after\:-translate-x-1\/2:after {
        content: var(--tw-content);
        --tw-translate-x: -50%;
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .group-data-\[collapsible\=offcanvas\]\:after\:left-full:is(:where(.group)[data-collapsible=offcanvas] *):after {
        content: var(--tw-content);
        left: 100%
    }

    .first\:rounded-l-md:first-child {
        border-top-left-radius: var(--radius-md);
        border-bottom-left-radius: var(--radius-md)
    }

    .first\:border-l:first-child {
        border-left-style: var(--tw-border-style);
        border-left-width: 1px
    }

    .last\:mt-0:last-child {
        margin-top: calc(var(--spacing)*0)
    }

    .last\:rounded-r-md:last-child {
        border-top-right-radius: var(--radius-md);
        border-bottom-right-radius: var(--radius-md)
    }

    .last\:border-b-0:last-child {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 0
    }

    @media (hover:hover) {
        .hover\:border-\[var\(--goli-burgundy\)\]:hover {
            border-color: var(--goli-burgundy)
        }

        .hover\:bg-\[\#1a1a19\]\/90:hover {
            background-color: #1a1a19e6
        }

        .hover\:bg-\[var\(--goli-burgundy-dark\)\]:hover {
            background-color: var(--goli-burgundy-dark)
        }

        .hover\:bg-gray-100:hover {
            background-color: var(--color-gray-100)
        }

        .hover\:bg-white\/5:hover {
            background-color: #ffffff0d
        }

        @supports (color:color-mix(in lab, red, red)) {
            .hover\:bg-white\/5:hover {
                background-color: color-mix(in oklab, var(--color-white)5%, transparent)
            }
        }

        .hover\:bg-white\/\[0\.03\]:hover {
            background-color: #ffffff08
        }

        @supports (color:color-mix(in lab, red, red)) {
            .hover\:bg-white\/\[0\.03\]:hover {
                background-color: color-mix(in oklab, var(--color-white)3%, transparent)
            }
        }

        .hover\:text-\[var\(--goli-burgundy\)\]:hover {
            color: var(--goli-burgundy)
        }

        .hover\:text-white:hover {
            color: var(--color-white)
        }

        .hover\:no-underline:hover {
            text-decoration-line: none
        }

        .hover\:underline:hover {
            text-decoration-line: underline
        }

        .hover\:opacity-90:hover {
            opacity: .9
        }

        .hover\:opacity-100:hover {
            opacity: 1
        }

        .hover\:shadow-\[0_0_0_1px_hsl\(var\(--sidebar-accent\)\)\]:hover {
            --tw-shadow: 0 0 0 1px var(--tw-shadow-color, hsl(var(--sidebar-accent)));
            box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
        }

        .hover\:shadow-md:hover {
            --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, #0000001a), 0 2px 4px -2px var(--tw-shadow-color, #0000001a);
            box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
        }

        .hover\:shadow-xl:hover {
            --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, #0000001a), 0 8px 10px -6px var(--tw-shadow-color, #0000001a);
            box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
        }

        .hover\:ring-2:hover {
            --tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
            box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
        }

        .hover\:ring-4:hover {
            --tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(4px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
            box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
        }

        .hover\:ring-red-500:hover {
            --tw-ring-color: var(--color-red-500)
        }
    }

    .focus\:z-10:focus {
        z-index: 10
    }

    .focus\:ring-2:focus {
        --tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .focus\:ring-offset-2:focus {
        --tw-ring-offset-width: 2px;
        --tw-ring-offset-shadow: var(--tw-ring-inset, )0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color)
    }

    .focus\:outline-hidden:focus {
        --tw-outline-style: none;
        outline-style: none
    }

    @media (forced-colors:active) {
        .focus\:outline-hidden:focus {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .focus\:outline-none:focus {
        --tw-outline-style: none;
        outline-style: none
    }

    .focus-visible\:z-10:focus-visible {
        z-index: 10
    }

    .focus-visible\:ring-0:focus-visible {
        --tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(0px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .focus-visible\:ring-1:focus-visible {
        --tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .focus-visible\:ring-2:focus-visible {
        --tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .focus-visible\:ring-4:focus-visible {
        --tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(4px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .focus-visible\:ring-\[3px\]:focus-visible {
        --tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(3px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .focus-visible\:ring-offset-1:focus-visible {
        --tw-ring-offset-width: 1px;
        --tw-ring-offset-shadow: var(--tw-ring-inset, )0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color)
    }

    .focus-visible\:outline-hidden:focus-visible {
        --tw-outline-style: none;
        outline-style: none
    }

    @media (forced-colors:active) {
        .focus-visible\:outline-hidden:focus-visible {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .focus-visible\:outline-1:focus-visible {
        outline-style: var(--tw-outline-style);
        outline-width: 1px
    }

    .disabled\:pointer-events-none:disabled {
        pointer-events: none
    }

    .disabled\:cursor-not-allowed:disabled {
        cursor: not-allowed
    }

    .disabled\:opacity-50:disabled {
        opacity: .5
    }

    :where([data-side=left]) .in-data-\[side\=left\]\:cursor-w-resize {
        cursor: w-resize
    }

    :where([data-side=right]) .in-data-\[side\=right\]\:cursor-e-resize {
        cursor: e-resize
    }

    .has-focus\:ring-\[3px\]:has(:focus) {
        --tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(3px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .has-disabled\:opacity-50:has(:disabled) {
        opacity: .5
    }

    .has-data-\[slot\=card-action\]\:grid-cols-\[1fr_auto\]:has([data-slot=card-action]) {
        grid-template-columns: 1fr auto
    }

    .has-\[\[data-slot\=input-group-control\]\:focus-visible\]\:ring-\[3px\]:has([data-slot=input-group-control]:focus-visible) {
        --tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(3px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .has-\[\>\[data-align\=block-end\]\]\:h-auto:has(>[data-align=block-end]) {
        height: auto
    }

    .has-\[\>\[data-align\=block-end\]\]\:flex-col:has(>[data-align=block-end]) {
        flex-direction: column
    }

    .has-\[\>\[data-align\=block-start\]\]\:h-auto:has(>[data-align=block-start]) {
        height: auto
    }

    .has-\[\>\[data-align\=block-start\]\]\:flex-col:has(>[data-align=block-start]) {
        flex-direction: column
    }

    .has-\[\>\[data-slot\=button-group\]\]\:gap-2:has(>[data-slot=button-group]) {
        gap: calc(var(--spacing)*2)
    }

    .has-\[\>\[data-slot\=checkbox-group\]\]\:gap-3:has(>[data-slot=checkbox-group]) {
        gap: calc(var(--spacing)*3)
    }

    .has-\[\>\[data-slot\=field-content\]\]\:items-start:has(>[data-slot=field-content]) {
        align-items: flex-start
    }

    .has-\[\>\[data-slot\=field\]\]\:w-full:has(>[data-slot=field]) {
        width: 100%
    }

    .has-\[\>\[data-slot\=field\]\]\:flex-col:has(>[data-slot=field]) {
        flex-direction: column
    }

    .has-\[\>\[data-slot\=field\]\]\:rounded-md:has(>[data-slot=field]) {
        border-radius: var(--radius-md)
    }

    .has-\[\>\[data-slot\=field\]\]\:border:has(>[data-slot=field]) {
        border-style: var(--tw-border-style);
        border-width: 1px
    }

    .has-\[\>\[data-slot\=radio-group\]\]\:gap-3:has(>[data-slot=radio-group]) {
        gap: calc(var(--spacing)*3)
    }

    .has-\[\>button\]\:mr-\[-0\.45rem\]:has(>button) {
        margin-right: -.45rem
    }

    .has-\[\>button\]\:ml-\[-0\.45rem\]:has(>button) {
        margin-left: -.45rem
    }

    .has-\[\>kbd\]\:mr-\[-0\.35rem\]:has(>kbd) {
        margin-right: -.35rem
    }

    .has-\[\>kbd\]\:ml-\[-0\.35rem\]:has(>kbd) {
        margin-left: -.35rem
    }

    .has-\[\>svg\]\:grid-cols-\[calc\(var\(--spacing\)\*4\)_1fr\]:has(>svg) {
        grid-template-columns: calc(var(--spacing)*4)1fr
    }

    .has-\[\>svg\]\:gap-x-3:has(>svg) {
        column-gap: calc(var(--spacing)*3)
    }

    .has-\[\>svg\]\:p-0:has(>svg) {
        padding: calc(var(--spacing)*0)
    }

    .has-\[\>svg\]\:px-2:has(>svg) {
        padding-inline: calc(var(--spacing)*2)
    }

    .has-\[\>svg\]\:px-2\.5:has(>svg) {
        padding-inline: calc(var(--spacing)*2.5)
    }

    .has-\[\>svg\]\:px-3:has(>svg) {
        padding-inline: calc(var(--spacing)*3)
    }

    .has-\[\>svg\]\:px-4:has(>svg) {
        padding-inline: calc(var(--spacing)*4)
    }

    .has-\[\>textarea\]\:h-auto:has(>textarea) {
        height: auto
    }

    .aria-disabled\:pointer-events-none[aria-disabled=true] {
        pointer-events: none
    }

    .aria-disabled\:opacity-50[aria-disabled=true] {
        opacity: .5
    }

    .data-\[active\=true\]\:z-10[data-active=true] {
        z-index: 10
    }

    .data-\[active\=true\]\:font-medium[data-active=true] {
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium)
    }

    .data-\[active\=true\]\:ring-\[3px\][data-active=true] {
        --tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(3px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .data-\[disabled\]\:pointer-events-none[data-disabled] {
        pointer-events: none
    }

    .data-\[disabled\]\:opacity-50[data-disabled] {
        opacity: .5
    }

    .data-\[disabled\=true\]\:pointer-events-none[data-disabled=true] {
        pointer-events: none
    }

    .data-\[disabled\=true\]\:opacity-50[data-disabled=true] {
        opacity: .5
    }

    .data-\[inset\]\:pl-8[data-inset] {
        padding-left: calc(var(--spacing)*8)
    }

    .data-\[motion\=from-end\]\:slide-in-from-right-52[data-motion=from-end] {
        --tw-enter-translate-x: calc(52*var(--spacing))
    }

    .data-\[motion\=from-start\]\:slide-in-from-left-52[data-motion=from-start] {
        --tw-enter-translate-x: calc(52*var(--spacing)*-1)
    }

    .data-\[motion\=to-end\]\:slide-out-to-right-52[data-motion=to-end] {
        --tw-exit-translate-x: calc(52*var(--spacing))
    }

    .data-\[motion\=to-start\]\:slide-out-to-left-52[data-motion=to-start] {
        --tw-exit-translate-x: calc(52*var(--spacing)*-1)
    }

    .data-\[motion\^\=from-\]\:animate-in[data-motion^=from-] {
        animation: enter var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none)
    }

    .data-\[motion\^\=from-\]\:fade-in[data-motion^=from-] {
        --tw-enter-opacity: 0
    }

    .data-\[motion\^\=to-\]\:animate-out[data-motion^=to-] {
        animation: exit var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none)
    }

    .data-\[motion\^\=to-\]\:fade-out[data-motion^=to-] {
        --tw-exit-opacity: 0
    }

    .data-\[orientation\=horizontal\]\:h-1\.5[data-orientation=horizontal] {
        height: calc(var(--spacing)*1.5)
    }

    .data-\[orientation\=horizontal\]\:h-full[data-orientation=horizontal] {
        height: 100%
    }

    .data-\[orientation\=horizontal\]\:h-px[data-orientation=horizontal] {
        height: 1px
    }

    .data-\[orientation\=horizontal\]\:w-full[data-orientation=horizontal] {
        width: 100%
    }

    .data-\[orientation\=vertical\]\:h-auto[data-orientation=vertical] {
        height: auto
    }

    .data-\[orientation\=vertical\]\:h-full[data-orientation=vertical] {
        height: 100%
    }

    .data-\[orientation\=vertical\]\:min-h-44[data-orientation=vertical] {
        min-height: calc(var(--spacing)*44)
    }

    .data-\[orientation\=vertical\]\:w-1\.5[data-orientation=vertical] {
        width: calc(var(--spacing)*1.5)
    }

    .data-\[orientation\=vertical\]\:w-auto[data-orientation=vertical] {
        width: auto
    }

    .data-\[orientation\=vertical\]\:w-full[data-orientation=vertical] {
        width: 100%
    }

    .data-\[orientation\=vertical\]\:w-px[data-orientation=vertical] {
        width: 1px
    }

    .data-\[orientation\=vertical\]\:flex-col[data-orientation=vertical] {
        flex-direction: column
    }

    .data-\[panel-group-direction\=vertical\]\:h-px[data-panel-group-direction=vertical] {
        height: 1px
    }

    .data-\[panel-group-direction\=vertical\]\:w-full[data-panel-group-direction=vertical] {
        width: 100%
    }

    .data-\[panel-group-direction\=vertical\]\:flex-col[data-panel-group-direction=vertical] {
        flex-direction: column
    }

    .data-\[panel-group-direction\=vertical\]\:after\:left-0[data-panel-group-direction=vertical]:after {
        content: var(--tw-content);
        left: calc(var(--spacing)*0)
    }

    .data-\[panel-group-direction\=vertical\]\:after\:h-1[data-panel-group-direction=vertical]:after {
        content: var(--tw-content);
        height: calc(var(--spacing)*1)
    }

    .data-\[panel-group-direction\=vertical\]\:after\:w-full[data-panel-group-direction=vertical]:after {
        content: var(--tw-content);
        width: 100%
    }

    .data-\[panel-group-direction\=vertical\]\:after\:translate-x-0[data-panel-group-direction=vertical]:after {
        content: var(--tw-content);
        --tw-translate-x: calc(var(--spacing)*0);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .data-\[panel-group-direction\=vertical\]\:after\:-translate-y-1\/2[data-panel-group-direction=vertical]:after {
        content: var(--tw-content);
        --tw-translate-y: -50%;
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .data-\[range-end\=true\]\:rounded-md[data-range-end=true] {
        border-radius: var(--radius-md)
    }

    .data-\[range-end\=true\]\:rounded-r-md[data-range-end=true] {
        border-top-right-radius: var(--radius-md);
        border-bottom-right-radius: var(--radius-md)
    }

    .data-\[range-middle\=true\]\:rounded-none[data-range-middle=true] {
        border-radius: 0
    }

    .data-\[range-start\=true\]\:rounded-md[data-range-start=true] {
        border-radius: var(--radius-md)
    }

    .data-\[range-start\=true\]\:rounded-l-md[data-range-start=true] {
        border-top-left-radius: var(--radius-md);
        border-bottom-left-radius: var(--radius-md)
    }

    .data-\[selected\=true\]\:rounded-none[data-selected=true] {
        border-radius: 0
    }

    .data-\[side\=bottom\]\:translate-y-1[data-side=bottom] {
        --tw-translate-y: calc(var(--spacing)*1);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .data-\[side\=bottom\]\:slide-in-from-top-2[data-side=bottom] {
        --tw-enter-translate-y: calc(2*var(--spacing)*-1)
    }

    .data-\[side\=left\]\:-translate-x-1[data-side=left] {
        --tw-translate-x: calc(var(--spacing)*-1);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .data-\[side\=left\]\:slide-in-from-right-2[data-side=left] {
        --tw-enter-translate-x: calc(2*var(--spacing))
    }

    .data-\[side\=right\]\:translate-x-1[data-side=right] {
        --tw-translate-x: calc(var(--spacing)*1);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .data-\[side\=right\]\:slide-in-from-left-2[data-side=right] {
        --tw-enter-translate-x: calc(2*var(--spacing)*-1)
    }

    .data-\[side\=top\]\:-translate-y-1[data-side=top] {
        --tw-translate-y: calc(var(--spacing)*-1);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .data-\[side\=top\]\:slide-in-from-bottom-2[data-side=top] {
        --tw-enter-translate-y: calc(2*var(--spacing))
    }

    .data-\[size\=default\]\:h-9[data-size=default] {
        height: calc(var(--spacing)*9)
    }

    .data-\[size\=sm\]\:h-8[data-size=sm] {
        height: calc(var(--spacing)*8)
    }

    .data-\[slot\=checkbox-group\]\:gap-3[data-slot=checkbox-group] {
        gap: calc(var(--spacing)*3)
    }

    :is(.\*\*\:data-\[slot\=command-input-wrapper\]\:h-12 *)[data-slot=command-input-wrapper] {
        height: calc(var(--spacing)*12)
    }

    :is(.\*\*\:data-\[slot\=navigation-menu-link\]\:focus\:ring-0 *)[data-slot=navigation-menu-link]:focus {
        --tw-ring-shadow: var(--tw-ring-inset, )0 0 0 calc(0px + var(--tw-ring-offset-width))var(--tw-ring-color, currentcolor);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    :is(.\*\*\:data-\[slot\=navigation-menu-link\]\:focus\:outline-none *)[data-slot=navigation-menu-link]:focus {
        --tw-outline-style: none;
        outline-style: none
    }

    :is(.\*\:data-\[slot\=select-value\]\:line-clamp-1>*)[data-slot=select-value] {
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        display: -webkit-box;
        overflow: hidden
    }

    :is(.\*\:data-\[slot\=select-value\]\:flex>*)[data-slot=select-value] {
        display: flex
    }

    :is(.\*\:data-\[slot\=select-value\]\:items-center>*)[data-slot=select-value] {
        align-items: center
    }

    :is(.\*\:data-\[slot\=select-value\]\:gap-2>*)[data-slot=select-value] {
        gap: calc(var(--spacing)*2)
    }

    .data-\[state\=active\]\:shadow-sm[data-state=active] {
        --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .data-\[state\=checked\]\:translate-x-\[calc\(100\%-2px\)\][data-state=checked] {
        --tw-translate-x: calc(100% - 2px);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .data-\[state\=closed\]\:animate-accordion-up[data-state=closed] {
        animation: accordion-up var(--tw-animation-duration, var(--tw-duration, .2s))var(--tw-ease, ease-out)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none)
    }

    .data-\[state\=closed\]\:animate-out[data-state=closed] {
        animation: exit var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none)
    }

    .data-\[state\=closed\]\:duration-300[data-state=closed] {
        --tw-duration: .3s;
        transition-duration: .3s
    }

    .data-\[state\=closed\]\:fade-out-0[data-state=closed] {
        --tw-exit-opacity: 0
    }

    .data-\[state\=closed\]\:zoom-out-95[data-state=closed] {
        --tw-exit-scale: .95
    }

    .data-\[state\=closed\]\:slide-out-to-bottom[data-state=closed] {
        --tw-exit-translate-y: 100%
    }

    .data-\[state\=closed\]\:slide-out-to-left[data-state=closed] {
        --tw-exit-translate-x: -100%
    }

    .data-\[state\=closed\]\:slide-out-to-right[data-state=closed] {
        --tw-exit-translate-x: 100%
    }

    .data-\[state\=closed\]\:slide-out-to-top[data-state=closed] {
        --tw-exit-translate-y: -100%
    }

    .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=closed\]\:animate-out:is(:where(.group\/navigation-menu)[data-viewport=false] *)[data-state=closed] {
        animation: exit var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none)
    }

    .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=closed\]\:fade-out-0:is(:where(.group\/navigation-menu)[data-viewport=false] *)[data-state=closed] {
        --tw-exit-opacity: 0
    }

    .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=closed\]\:zoom-out-95:is(:where(.group\/navigation-menu)[data-viewport=false] *)[data-state=closed] {
        --tw-exit-scale: .95
    }

    .data-\[state\=hidden\]\:animate-out[data-state=hidden] {
        animation: exit var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none)
    }

    .data-\[state\=hidden\]\:fade-out[data-state=hidden] {
        --tw-exit-opacity: 0
    }

    .data-\[state\=open\]\:animate-accordion-down[data-state=open] {
        animation: accordion-down var(--tw-animation-duration, var(--tw-duration, .2s))var(--tw-ease, ease-out)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none)
    }

    .data-\[state\=open\]\:animate-in[data-state=open] {
        animation: enter var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none)
    }

    .data-\[state\=open\]\:border-\[var\(--goli-burgundy\)\][data-state=open] {
        border-color: var(--goli-burgundy)
    }

    .data-\[state\=open\]\:opacity-100[data-state=open] {
        opacity: 1
    }

    .data-\[state\=open\]\:duration-500[data-state=open] {
        --tw-duration: .5s;
        transition-duration: .5s
    }

    .data-\[state\=open\]\:fade-in-0[data-state=open] {
        --tw-enter-opacity: 0
    }

    .data-\[state\=open\]\:zoom-in-90[data-state=open] {
        --tw-enter-scale: .9
    }

    .data-\[state\=open\]\:zoom-in-95[data-state=open] {
        --tw-enter-scale: .95
    }

    .data-\[state\=open\]\:slide-in-from-bottom[data-state=open] {
        --tw-enter-translate-y: 100%
    }

    .data-\[state\=open\]\:slide-in-from-left[data-state=open] {
        --tw-enter-translate-x: -100%
    }

    .data-\[state\=open\]\:slide-in-from-right[data-state=open] {
        --tw-enter-translate-x: 100%
    }

    .data-\[state\=open\]\:slide-in-from-top[data-state=open] {
        --tw-enter-translate-y: -100%
    }

    .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=open\]\:animate-in:is(:where(.group\/navigation-menu)[data-viewport=false] *)[data-state=open] {
        animation: enter var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none)
    }

    .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=open\]\:fade-in-0:is(:where(.group\/navigation-menu)[data-viewport=false] *)[data-state=open] {
        --tw-enter-opacity: 0
    }

    .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=open\]\:zoom-in-95:is(:where(.group\/navigation-menu)[data-viewport=false] *)[data-state=open] {
        --tw-enter-scale: .95
    }

    .data-\[state\=unchecked\]\:translate-x-0[data-state=unchecked] {
        --tw-translate-x: calc(var(--spacing)*0);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .data-\[state\=visible\]\:animate-in[data-state=visible] {
        animation: enter var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none)
    }

    .data-\[state\=visible\]\:fade-in[data-state=visible] {
        --tw-enter-opacity: 0
    }

    .data-\[variant\=label\]\:text-sm[data-variant=label] {
        font-size: var(--text-sm);
        line-height: var(--tw-leading, var(--text-sm--line-height))
    }

    .data-\[variant\=legend\]\:text-base[data-variant=legend] {
        font-size: var(--text-base);
        line-height: var(--tw-leading, var(--text-base--line-height))
    }

    .data-\[variant\=outline\]\:border-l-0[data-variant=outline] {
        border-left-style: var(--tw-border-style);
        border-left-width: 0
    }

    .data-\[variant\=outline\]\:shadow-xs[data-variant=outline] {
        --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, #0000000d);
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
    }

    .data-\[variant\=outline\]\:first\:border-l[data-variant=outline]:first-child {
        border-left-style: var(--tw-border-style);
        border-left-width: 1px
    }

    .data-\[vaul-drawer-direction\=bottom\]\:inset-x-0[data-vaul-drawer-direction=bottom] {
        inset-inline: calc(var(--spacing)*0)
    }

    .data-\[vaul-drawer-direction\=bottom\]\:bottom-0[data-vaul-drawer-direction=bottom] {
        bottom: calc(var(--spacing)*0)
    }

    .data-\[vaul-drawer-direction\=bottom\]\:mt-24[data-vaul-drawer-direction=bottom] {
        margin-top: calc(var(--spacing)*24)
    }

    .data-\[vaul-drawer-direction\=bottom\]\:max-h-\[80vh\][data-vaul-drawer-direction=bottom] {
        max-height: 80vh
    }

    .data-\[vaul-drawer-direction\=bottom\]\:rounded-t-lg[data-vaul-drawer-direction=bottom] {
        border-top-left-radius: var(--radius-lg);
        border-top-right-radius: var(--radius-lg)
    }

    .data-\[vaul-drawer-direction\=bottom\]\:border-t[data-vaul-drawer-direction=bottom] {
        border-top-style: var(--tw-border-style);
        border-top-width: 1px
    }

    .data-\[vaul-drawer-direction\=left\]\:inset-y-0[data-vaul-drawer-direction=left] {
        inset-block: calc(var(--spacing)*0)
    }

    .data-\[vaul-drawer-direction\=left\]\:left-0[data-vaul-drawer-direction=left] {
        left: calc(var(--spacing)*0)
    }

    .data-\[vaul-drawer-direction\=left\]\:w-3\/4[data-vaul-drawer-direction=left] {
        width: 75%
    }

    .data-\[vaul-drawer-direction\=left\]\:border-r[data-vaul-drawer-direction=left] {
        border-right-style: var(--tw-border-style);
        border-right-width: 1px
    }

    .data-\[vaul-drawer-direction\=right\]\:inset-y-0[data-vaul-drawer-direction=right] {
        inset-block: calc(var(--spacing)*0)
    }

    .data-\[vaul-drawer-direction\=right\]\:right-0[data-vaul-drawer-direction=right] {
        right: calc(var(--spacing)*0)
    }

    .data-\[vaul-drawer-direction\=right\]\:w-3\/4[data-vaul-drawer-direction=right] {
        width: 75%
    }

    .data-\[vaul-drawer-direction\=right\]\:border-l[data-vaul-drawer-direction=right] {
        border-left-style: var(--tw-border-style);
        border-left-width: 1px
    }

    .data-\[vaul-drawer-direction\=top\]\:inset-x-0[data-vaul-drawer-direction=top] {
        inset-inline: calc(var(--spacing)*0)
    }

    .data-\[vaul-drawer-direction\=top\]\:top-0[data-vaul-drawer-direction=top] {
        top: calc(var(--spacing)*0)
    }

    .data-\[vaul-drawer-direction\=top\]\:mb-24[data-vaul-drawer-direction=top] {
        margin-bottom: calc(var(--spacing)*24)
    }

    .data-\[vaul-drawer-direction\=top\]\:max-h-\[80vh\][data-vaul-drawer-direction=top] {
        max-height: 80vh
    }

    .data-\[vaul-drawer-direction\=top\]\:rounded-b-lg[data-vaul-drawer-direction=top] {
        border-bottom-right-radius: var(--radius-lg);
        border-bottom-left-radius: var(--radius-lg)
    }

    .data-\[vaul-drawer-direction\=top\]\:border-b[data-vaul-drawer-direction=top] {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 1px
    }

    .nth-last-2\:-mt-1:nth-last-child(2) {
        margin-top: calc(var(--spacing)*-1)
    }

    @supports ((-webkit-backdrop-filter:var(--tw)) or (backdrop-filter:var(--tw))) {
        .supports-\[backdrop-filter\]\:backdrop-blur {
            --tw-backdrop-blur: blur(8px);
            -webkit-backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, );
            backdrop-filter: var(--tw-backdrop-blur, )var(--tw-backdrop-brightness, )var(--tw-backdrop-contrast, )var(--tw-backdrop-grayscale, )var(--tw-backdrop-hue-rotate, )var(--tw-backdrop-invert, )var(--tw-backdrop-opacity, )var(--tw-backdrop-saturate, )var(--tw-backdrop-sepia, )
        }
    }

    @media (min-width:40rem) {
        .sm\:block {
            display: block
        }

        .sm\:flex {
            display: flex
        }

        .sm\:w-96 {
            width: calc(var(--spacing)*96)
        }

        .sm\:max-w-lg {
            max-width: var(--container-lg)
        }

        .sm\:max-w-sm {
            max-width: var(--container-sm)
        }

        .sm\:grid-cols-3 {
            grid-template-columns: repeat(3, minmax(0, 1fr))
        }

        .sm\:flex-row {
            flex-direction: row
        }

        .sm\:justify-end {
            justify-content: flex-end
        }

        .sm\:gap-2\.5 {
            gap: calc(var(--spacing)*2.5)
        }

        .sm\:pr-2\.5 {
            padding-right: calc(var(--spacing)*2.5)
        }

        .sm\:pl-2\.5 {
            padding-left: calc(var(--spacing)*2.5)
        }

        .sm\:text-left {
            text-align: left
        }

        .data-\[vaul-drawer-direction\=left\]\:sm\:max-w-sm[data-vaul-drawer-direction=left],
        .data-\[vaul-drawer-direction\=right\]\:sm\:max-w-sm[data-vaul-drawer-direction=right] {
            max-width: var(--container-sm)
        }
    }

    @media (min-width:48rem) {
        .md\:absolute {
            position: absolute
        }

        .md\:block {
            display: block
        }

        .md\:flex {
            display: flex
        }

        .md\:w-\[var\(--radix-navigation-menu-viewport-width\)\] {
            width: var(--radix-navigation-menu-viewport-width)
        }

        .md\:w-auto {
            width: auto
        }

        .md\:grid-cols-2 {
            grid-template-columns: repeat(2, minmax(0, 1fr))
        }

        .md\:grid-cols-3 {
            grid-template-columns: repeat(3, minmax(0, 1fr))
        }

        .md\:grid-cols-4 {
            grid-template-columns: repeat(4, minmax(0, 1fr))
        }

        .md\:flex-row {
            flex-direction: row
        }

        .md\:gap-1\.5 {
            gap: calc(var(--spacing)*1.5)
        }

        .md\:p-8 {
            padding: calc(var(--spacing)*8)
        }

        .md\:p-12 {
            padding: calc(var(--spacing)*12)
        }

        .md\:text-left {
            text-align: left
        }

        .md\:text-sm {
            font-size: var(--text-sm);
            line-height: var(--tw-leading, var(--text-sm--line-height))
        }

        .md\:opacity-0 {
            opacity: 0
        }

        .md\:peer-data-\[variant\=inset\]\:m-2:is(:where(.peer)[data-variant=inset]~*) {
            margin: calc(var(--spacing)*2)
        }

        .md\:peer-data-\[variant\=inset\]\:ml-0:is(:where(.peer)[data-variant=inset]~*) {
            margin-left: calc(var(--spacing)*0)
        }

        .md\:peer-data-\[variant\=inset\]\:rounded-xl:is(:where(.peer)[data-variant=inset]~*) {
            border-radius: var(--radius-xl)
        }

        .md\:peer-data-\[variant\=inset\]\:shadow-sm:is(:where(.peer)[data-variant=inset]~*) {
            --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
            box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
        }

        .md\:peer-data-\[variant\=inset\]\:peer-data-\[state\=collapsed\]\:ml-2:is(:where(.peer)[data-variant=inset]~*):is(:where(.peer)[data-state=collapsed]~*) {
            margin-left: calc(var(--spacing)*2)
        }

        .md\:after\:hidden:after {
            content: var(--tw-content);
            display: none
        }
    }

    @media (min-width:64rem) {
        .lg\:mb-16 {
            margin-bottom: calc(var(--spacing)*16)
        }

        .lg\:grid-cols-3 {
            grid-template-columns: repeat(3, minmax(0, 1fr))
        }

        .lg\:grid-cols-4 {
            grid-template-columns: repeat(4, minmax(0, 1fr))
        }

        .lg\:grid-cols-5 {
            grid-template-columns: repeat(5, minmax(0, 1fr))
        }

        .lg\:py-24 {
            padding-block: calc(var(--spacing)*24)
        }

        .lg\:text-2xl {
            font-size: var(--text-2xl);
            line-height: var(--tw-leading, var(--text-2xl--line-height))
        }

        .lg\:text-5xl {
            font-size: var(--text-5xl);
            line-height: var(--tw-leading, var(--text-5xl--line-height))
        }
    }

    @container field-group (min-width:28rem) {
        .\@md\/field-group\:flex-row {
            flex-direction: row
        }

        .\@md\/field-group\:items-center {
            align-items: center
        }

        .\@md\/field-group\:has-\[\>\[data-slot\=field-content\]\]\:items-start:has(>[data-slot=field-content]) {
            align-items: flex-start
        }
    }

    .dark\:bg-transparent:is(.dark *) {
        background-color: #0000
    }

    .\[\&_\.recharts-dot\[stroke\=\'\#fff\'\]\]\:stroke-transparent .recharts-dot[stroke="#fff"] {
        stroke: #0000
    }

    .\[\&_\.recharts-layer\]\:outline-hidden .recharts-layer {
        --tw-outline-style: none;
        outline-style: none
    }

    @media (forced-colors:active) {
        .\[\&_\.recharts-layer\]\:outline-hidden .recharts-layer {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .\[\&_\.recharts-sector\]\:outline-hidden .recharts-sector {
        --tw-outline-style: none;
        outline-style: none
    }

    @media (forced-colors:active) {
        .\[\&_\.recharts-sector\]\:outline-hidden .recharts-sector {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .\[\&_\.recharts-sector\[stroke\=\'\#fff\'\]\]\:stroke-transparent .recharts-sector[stroke="#fff"] {
        stroke: #0000
    }

    .\[\&_\.recharts-surface\]\:outline-hidden .recharts-surface {
        --tw-outline-style: none;
        outline-style: none
    }

    @media (forced-colors:active) {
        .\[\&_\.recharts-surface\]\:outline-hidden .recharts-surface {
            outline-offset: 2px;
            outline: 2px solid #0000
        }
    }

    .\[\&_\[cmdk-group-heading\]\]\:px-2 [cmdk-group-heading] {
        padding-inline: calc(var(--spacing)*2)
    }

    .\[\&_\[cmdk-group-heading\]\]\:py-1\.5 [cmdk-group-heading] {
        padding-block: calc(var(--spacing)*1.5)
    }

    .\[\&_\[cmdk-group-heading\]\]\:text-xs [cmdk-group-heading] {
        font-size: var(--text-xs);
        line-height: var(--tw-leading, var(--text-xs--line-height))
    }

    .\[\&_\[cmdk-group-heading\]\]\:font-medium [cmdk-group-heading] {
        --tw-font-weight: var(--font-weight-medium);
        font-weight: var(--font-weight-medium)
    }

    .\[\&_\[cmdk-group\]\]\:px-2 [cmdk-group] {
        padding-inline: calc(var(--spacing)*2)
    }

    .\[\&_\[cmdk-group\]\:not\(\[hidden\]\)_\~\[cmdk-group\]\]\:pt-0 [cmdk-group]:not([hidden])~[cmdk-group] {
        padding-top: calc(var(--spacing)*0)
    }

    .\[\&_\[cmdk-input-wrapper\]_svg\]\:h-5 [cmdk-input-wrapper] svg {
        height: calc(var(--spacing)*5)
    }

    .\[\&_\[cmdk-input-wrapper\]_svg\]\:w-5 [cmdk-input-wrapper] svg {
        width: calc(var(--spacing)*5)
    }

    .\[\&_\[cmdk-input\]\]\:h-12 [cmdk-input] {
        height: calc(var(--spacing)*12)
    }

    .\[\&_\[cmdk-item\]\]\:px-2 [cmdk-item] {
        padding-inline: calc(var(--spacing)*2)
    }

    .\[\&_\[cmdk-item\]\]\:py-3 [cmdk-item] {
        padding-block: calc(var(--spacing)*3)
    }

    .\[\&_\[cmdk-item\]_svg\]\:h-5 [cmdk-item] svg {
        height: calc(var(--spacing)*5)
    }

    .\[\&_\[cmdk-item\]_svg\]\:w-5 [cmdk-item] svg {
        width: calc(var(--spacing)*5)
    }

    .\[\&_img\]\:size-full img {
        width: 100%;
        height: 100%
    }

    .\[\&_img\]\:object-cover img {
        object-fit: cover
    }

    .\[\&_p\]\:leading-relaxed p {
        --tw-leading: var(--leading-relaxed);
        line-height: var(--leading-relaxed)
    }

    .\[\&_svg\]\:pointer-events-none svg {
        pointer-events: none
    }

    .\[\&_svg\]\:shrink-0 svg {
        flex-shrink: 0
    }

    .\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-3 svg:not([class*=size-]) {
        width: calc(var(--spacing)*3);
        height: calc(var(--spacing)*3)
    }

    .\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 svg:not([class*=size-]) {
        width: calc(var(--spacing)*4);
        height: calc(var(--spacing)*4)
    }

    .\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-6 svg:not([class*=size-]) {
        width: calc(var(--spacing)*6);
        height: calc(var(--spacing)*6)
    }

    .\[\&_tr\]\:border-b tr {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 1px
    }

    .\[\&_tr\:last-child\]\:border-0 tr:last-child {
        border-style: var(--tw-border-style);
        border-width: 0
    }

    .\[\&\+\[data-slot\=item-content\]\]\:flex-none+[data-slot=item-content] {
        flex: none
    }

    .\[\&\:first-child\[data-selected\=true\]_button\]\:rounded-l-md:first-child[data-selected=true] button {
        border-top-left-radius: var(--radius-md);
        border-bottom-left-radius: var(--radius-md)
    }

    .\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0:has([role=checkbox]) {
        padding-right: calc(var(--spacing)*0)
    }

    .\[\.border-b\]\:pb-3.border-b {
        padding-bottom: calc(var(--spacing)*3)
    }

    .\[\.border-b\]\:pb-6.border-b {
        padding-bottom: calc(var(--spacing)*6)
    }

    .\[\.border-t\]\:pt-3.border-t {
        padding-top: calc(var(--spacing)*3)
    }

    .\[\.border-t\]\:pt-6.border-t {
        padding-top: calc(var(--spacing)*6)
    }

    :is(.rtl\:\*\*\:\[\.rdp-button\\_next\>svg\]\:rotate-180:where(:dir(rtl), [dir=rtl], [dir=rtl] *) *):is(.rdp-button_next>svg),
    :is(.rtl\:\*\*\:\[\.rdp-button\\_previous\>svg\]\:rotate-180:where(:dir(rtl), [dir=rtl], [dir=rtl] *) *):is(.rdp-button_previous>svg) {
        rotate: 180deg
    }

    .\[a\]\:transition-colors:is(a) {
        transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
        transition-duration: var(--tw-duration, var(--default-transition-duration))
    }

    :is(.\*\:\[span\]\:last\:flex>*):is(span):last-child {
        display: flex
    }

    :is(.\*\:\[span\]\:last\:items-center>*):is(span):last-child {
        align-items: center
    }

    :is(.\*\:\[span\]\:last\:gap-2>*):is(span):last-child {
        gap: calc(var(--spacing)*2)
    }

    .\[\&\:last-child\[data-selected\=true\]_button\]\:rounded-r-md:last-child[data-selected=true] button {
        border-top-right-radius: var(--radius-md);
        border-bottom-right-radius: var(--radius-md)
    }

    .\[\&\>\*\]\:w-full>* {
        width: 100%
    }

    .\[\&\>\*\]\:focus-visible\:relative>:focus-visible {
        position: relative
    }

    .\[\&\>\*\]\:focus-visible\:z-10>:focus-visible {
        z-index: 10
    }

    .\[\&\>\*\]\:data-\[slot\=field\]\:p-4>[data-slot=field] {
        padding: calc(var(--spacing)*4)
    }

    @container field-group (min-width:28rem) {
        .\@md\/field-group\:\[\&\>\*\]\:w-auto>* {
            width: auto
        }
    }

    .\[\&\>\*\:not\(\:first-child\)\]\:rounded-t-none>:not(:first-child) {
        border-top-left-radius: 0;
        border-top-right-radius: 0
    }

    .\[\&\>\*\:not\(\:first-child\)\]\:rounded-l-none>:not(:first-child) {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0
    }

    .\[\&\>\*\:not\(\:first-child\)\]\:border-t-0>:not(:first-child) {
        border-top-style: var(--tw-border-style);
        border-top-width: 0
    }

    .\[\&\>\*\:not\(\:first-child\)\]\:border-l-0>:not(:first-child) {
        border-left-style: var(--tw-border-style);
        border-left-width: 0
    }

    .\[\&\>\*\:not\(\:last-child\)\]\:rounded-r-none>:not(:last-child) {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0
    }

    .\[\&\>\*\:not\(\:last-child\)\]\:rounded-b-none>:not(:last-child) {
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0
    }

    .\[\&\>\.sr-only\]\:w-auto>.sr-only {
        width: auto
    }

    .\[\&\>\[data-slot\=field-group\]\]\:gap-4>[data-slot=field-group] {
        gap: calc(var(--spacing)*4)
    }

    .\[\&\>\[data-slot\=field-label\]\]\:flex-auto>[data-slot=field-label] {
        flex: auto
    }

    @container field-group (min-width:28rem) {
        .\@md\/field-group\:\[\&\>\[data-slot\=field-label\]\]\:flex-auto>[data-slot=field-label] {
            flex: auto
        }
    }

    .has-\[select\[aria-hidden\=true\]\:last-child\]\:\[\&\>\[data-slot\=select-trigger\]\:last-of-type\]\:rounded-r-md:has(:is(select[aria-hidden=true]:last-child))>[data-slot=select-trigger]:last-of-type {
        border-top-right-radius: var(--radius-md);
        border-bottom-right-radius: var(--radius-md)
    }

    .\[\&\>\[data-slot\=select-trigger\]\:not\(\[class\*\=\'w-\'\]\)\]\:w-fit>[data-slot=select-trigger]:not([class*=w-]) {
        width: fit-content
    }

    .\[\&\>\[role\=checkbox\]\]\:translate-y-\[2px\]>[role=checkbox] {
        --tw-translate-y: 2px;
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .has-\[\>\[data-slot\=field-content\]\]\:\[\&\>\[role\=checkbox\]\,\[role\=radio\]\]\:mt-px:has(>[data-slot=field-content])>[role=checkbox],
    .has-\[\>\[data-slot\=field-content\]\]\:\[\&\>\[role\=checkbox\]\,\[role\=radio\]\]\:mt-px:has(>[data-slot=field-content]) [role=radio] {
        margin-top: 1px
    }

    @container field-group (min-width:28rem) {

        .\@md\/field-group\:has-\[\>\[data-slot\=field-content\]\]\:\[\&\>\[role\=checkbox\]\,\[role\=radio\]\]\:mt-px:has(>[data-slot=field-content])>[role=checkbox],
        .\@md\/field-group\:has-\[\>\[data-slot\=field-content\]\]\:\[\&\>\[role\=checkbox\]\,\[role\=radio\]\]\:mt-px:has(>[data-slot=field-content]) [role=radio] {
            margin-top: 1px
        }
    }

    .\[\&\>a\]\:underline>a {
        text-decoration-line: underline
    }

    .\[\&\>a\]\:underline-offset-4>a {
        text-underline-offset: 4px
    }

    .\[\&\>button\]\:hidden>button {
        display: none
    }

    .\[\&\>input\]\:flex-1>input {
        flex: 1
    }

    .has-\[\>\[data-align\=block-end\]\]\:\[\&\>input\]\:pt-3:has(>[data-align=block-end])>input {
        padding-top: calc(var(--spacing)*3)
    }

    .has-\[\>\[data-align\=block-start\]\]\:\[\&\>input\]\:pb-3:has(>[data-align=block-start])>input {
        padding-bottom: calc(var(--spacing)*3)
    }

    .has-\[\>\[data-align\=inline-end\]\]\:\[\&\>input\]\:pr-2:has(>[data-align=inline-end])>input {
        padding-right: calc(var(--spacing)*2)
    }

    .has-\[\>\[data-align\=inline-start\]\]\:\[\&\>input\]\:pl-2:has(>[data-align=inline-start])>input {
        padding-left: calc(var(--spacing)*2)
    }

    .\[\&\>kbd\]\:rounded-\[calc\(var\(--radius\)-5px\)\]>kbd {
        border-radius: calc(var(--radius) - 5px)
    }

    .\[\&\>span\]\:text-xs>span {
        font-size: var(--text-xs);
        line-height: var(--tw-leading, var(--text-xs--line-height))
    }

    .\[\&\>span\]\:opacity-70>span {
        opacity: .7
    }

    .\[\&\>span\:last-child\]\:truncate>span:last-child {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden
    }

    .\[\&\>svg\]\:pointer-events-none>svg {
        pointer-events: none
    }

    .\[\&\>svg\]\:size-3>svg {
        width: calc(var(--spacing)*3);
        height: calc(var(--spacing)*3)
    }

    .\[\&\>svg\]\:size-3\.5>svg {
        width: calc(var(--spacing)*3.5);
        height: calc(var(--spacing)*3.5)
    }

    .\[\&\>svg\]\:size-4>svg {
        width: calc(var(--spacing)*4);
        height: calc(var(--spacing)*4)
    }

    .\[\&\>svg\]\:h-2\.5>svg {
        height: calc(var(--spacing)*2.5)
    }

    .\[\&\>svg\]\:h-3>svg {
        height: calc(var(--spacing)*3)
    }

    .\[\&\>svg\]\:w-2\.5>svg {
        width: calc(var(--spacing)*2.5)
    }

    .\[\&\>svg\]\:w-3>svg {
        width: calc(var(--spacing)*3)
    }

    .\[\&\>svg\]\:shrink-0>svg {
        flex-shrink: 0
    }

    .\[\&\>svg\]\:translate-y-0\.5>svg {
        --tw-translate-y: calc(var(--spacing)*.5);
        translate: var(--tw-translate-x)var(--tw-translate-y)
    }

    .\[\&\>svg\]\:text-current>svg {
        color: currentColor
    }

    .\[\&\>svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-3\.5>svg:not([class*=size-]) {
        width: calc(var(--spacing)*3.5);
        height: calc(var(--spacing)*3.5)
    }

    .\[\&\>svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4>svg:not([class*=size-]) {
        width: calc(var(--spacing)*4);
        height: calc(var(--spacing)*4)
    }

    .\[\&\>tr\]\:last\:border-b-0>tr:last-child {
        border-bottom-style: var(--tw-border-style);
        border-bottom-width: 0
    }

    .\[\&\[data-panel-group-direction\=vertical\]\>div\]\:rotate-90[data-panel-group-direction=vertical]>div {
        rotate: 90deg
    }

    .\[\&\[data-state\=open\]\>svg\]\:rotate-180[data-state=open]>svg {
        rotate: 180deg
    }

    [data-side=left][data-collapsible=offcanvas] .\[\[data-side\=left\]\[data-collapsible\=offcanvas\]_\&\]\:-right-2 {
        right: calc(var(--spacing)*-2)
    }

    [data-side=left][data-state=collapsed] .\[\[data-side\=left\]\[data-state\=collapsed\]_\&\]\:cursor-e-resize {
        cursor: e-resize
    }

    [data-side=right][data-collapsible=offcanvas] .\[\[data-side\=right\]\[data-collapsible\=offcanvas\]_\&\]\:-left-2 {
        left: calc(var(--spacing)*-2)
    }

    [data-side=right][data-state=collapsed] .\[\[data-side\=right\]\[data-state\=collapsed\]_\&\]\:cursor-w-resize {
        cursor: w-resize
    }

    [data-slot=card-content] .\[\[data-slot\=card-content\]_\&\]\:bg-transparent,
    [data-slot=popover-content] .\[\[data-slot\=popover-content\]_\&\]\:bg-transparent {
        background-color: #0000
    }

    [data-variant=legend]+.\[\[data-variant\=legend\]\+\&\]\:-mt-1\.5 {
        margin-top: calc(var(--spacing)*-1.5)
    }
}

@property --tw-animation-delay {
    syntax: "*";
    inherits: false;
    initial-value: 0s
}

@property --tw-animation-direction {
    syntax: "*";
    inherits: false;
    initial-value: normal
}

@property --tw-animation-duration {
    syntax: "*";
    inherits: false
}

@property --tw-animation-fill-mode {
    syntax: "*";
    inherits: false;
    initial-value: none
}

@property --tw-animation-iteration-count {
    syntax: "*";
    inherits: false;
    initial-value: 1
}

@property --tw-enter-blur {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-enter-opacity {
    syntax: "*";
    inherits: false;
    initial-value: 1
}

@property --tw-enter-rotate {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-enter-scale {
    syntax: "*";
    inherits: false;
    initial-value: 1
}

@property --tw-enter-translate-x {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-enter-translate-y {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-exit-blur {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-exit-opacity {
    syntax: "*";
    inherits: false;
    initial-value: 1
}

@property --tw-exit-rotate {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-exit-scale {
    syntax: "*";
    inherits: false;
    initial-value: 1
}

@property --tw-exit-translate-x {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-exit-translate-y {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

body {
    font-size: 0 !important
}

body>* {
    font-size: 1.5rem
}

:root {
    --goli-burgundy: #50000b;
    --goli-cream: #fbf7ee;
    --goli-tan: #e8d5c4;
    --goli-gold: #dfce89;
    --goli-red: #a40011;
    --font-heading-family: "Gilroy", sans-serif;
    --font-body-family: "Gilroy", sans-serif;
    --font-nb-architekt: "Gilroy", sans-serif;
    --font-body-style: normal;
    --font-body-weight: 400;
    --font-body-weight-bold: 700;
    --font-heading-style: normal;
    --font-heading-weight: 500;
    --font-body-scale: 1;
    --font-heading-scale: 1;
    --color-background: 255, 255, 255;
    --gradient-background: #fff;
    --color-foreground: 80, 0, 11;
    --color-button: 164, 0, 17;
    --color-button-text: 255, 255, 255;
    --page-width: 150rem
}

.page-width {
    max-width: 1500px;
    margin: 0 auto;
    padding: 0 2rem;
    overflow: visible
}

.header-inner {
    max-width: 1500px;
    margin: 0 auto;
    padding: 0 1.25rem
}

.main-background-wrapper {
    background: #fff top/100% no-repeat;
    width: 100%
}

@media (min-width:750px) {
    .main-background-wrapper {
        background: #fff top/100% no-repeat
    }
}

.product-grid {
    gap: 1.5rem;
    padding-bottom: 3rem;
    display: grid;
    overflow: visible
}

@media (max-width:749px) {
    main.page-width {
        margin-top: 0 !important;
        padding: 0 !important
    }

    .product-grid {
        gap: 0;
        padding: 0
    }

    .product__media-wrapper {
        gap: 6px;
        width: 100vw;
        max-width: 100vw;
        margin: 0 -50vw;
        left: 50%;
        right: 50%;
        margin-top: 0 !important;
        position: relative !important
    }

    .product__media-list,
    .product__media-item,
    .product-media-container--square {
        width: 100%;
        margin: 0;
        padding: 0
    }

    .product-media-container--square .product__media {
        width: 100%;
        margin: 0;
        padding: 0;
        border: none !important;
        border-radius: 0 !important
    }

    .product-media-container--square .product__media img {
        width: 100%;
        height: auto;
        display: block;
        border: none !important;
        border-bottom: 1px solid #d4d4d4 !important;
        border-radius: 0 !important
    }

    .product-media-container--square,
    .product-media-container,
    .product__media,
    .media--transparent {
        overflow: visible;
        border-radius: 0 !important
    }

    .product__info-wrapper {
        margin-top: 1rem;
        padding: 0 1rem
    }

    .thumbnail-slider--mobile {
        padding: .5rem 1rem
    }

    .thumbnail-list {
        -webkit-overflow-scrolling: touch;
        overflow-x: auto;
        flex-wrap: nowrap !important;
        gap: 6px !important
    }

    .thumbnail-list__item {
        flex-shrink: 0;
        width: 48px !important;
        height: 48px !important
    }

    .thumbnail {
        width: 48px !important;
        height: 48px !important
    }
}

@media (min-width:750px) {
    .page-width {
        padding: 0 3rem
    }

    .header-inner {
        padding: 0 1.25rem
    }

    .product-grid.grid--2-col-tablet {
        grid-template-columns: 1fr 1fr;
        gap: 2rem
    }
}

@media (min-width:1024px) {
    .page-width {
        padding: 0 5rem
    }

    .header-inner {
        padding: 0 1.25rem
    }
}

@media (min-width:1440px) {

    .page-width,
    .header-inner {
        padding: 0 50px
    }

    .product-grid.grid--2-col-tablet {
        gap: 3rem
    }
}

.product__description {
    margin-bottom: 1rem
}

.product-form__input {
    margin-bottom: 2rem
}

.form__label {
    width: 100%;
    color: var(--goli-burgundy);
    text-transform: uppercase;
    letter-spacing: .02em;
    justify-content: space-between;
    align-items: center;
    margin-bottom: .75rem;
    font-size: .75rem;
    font-weight: 700;
    display: flex
}

.product-form__input {
    max-width: 100%;
    overflow: visible
}

.format-options-grid {
    grid-template-columns: 1fr;
    gap: .75rem;
    margin-top: 0;
    display: grid
}

@media (min-width:750px) {
    .format-options-grid {
        grid-template-columns: 1fr 1fr
    }
}

@media (min-width:750px) and (max-width:1023px) {
    .format-options-grid {
        gap: .75rem;
        display: flex
    }

    .format-option-wrapper {
        flex: 1
    }

    .format-option-wrapper label {
        height: 100%;
        min-height: 90px
    }

    .product-variant-option-image {
        object-fit: cover;
        align-self: stretch;
        width: 80px;
        height: 100%
    }

    .format-option-content {
        padding: .5rem .75rem .5rem 0
    }
}

@media (min-width:1024px) {
    .format-options-grid {
        gap: .75rem
    }
}

.format-option-wrapper {
    margin-top: 0;
    position: relative;
    overflow: visible
}

.format-option-wrapper label {
    cursor: pointer;
    background: 0 0;
    border: 1px solid #d4d4d4;
    border-radius: .5rem;
    align-items: stretch;
    min-height: 70px;
    padding: 0;
    transition: all .15s;
    display: flex;
    position: relative;
    overflow: visible
}

.format-option-wrapper label:hover {
    background: #f5eaea;
    border-color: #50000b
}

.format-option-wrapper label:focus-within {
    outline-offset: 1px;
    border-color: #50000b;
    outline: 1px solid #50000b
}

.format-option-wrapper label:active {
    border-color: #50000b;
    transform: none
}

.format-option-wrapper input:checked+label {
    background: #f5eaea;
    border-color: #50000b
}

.product-variant-option-image {
    object-fit: cover;
    border-radius: .5rem 0 0 .5rem;
    flex-shrink: 0;
    width: 70px;
    height: 100%;
    margin-right: .875rem
}

.format-option-content {
    flex-direction: column;
    flex: 1;
    justify-content: center;
    min-width: 0;
    padding: .625rem .875rem .625rem 0;
    display: flex
}

.format-option-top {
    margin-bottom: .25rem
}

.format-option-name {
    font-family: var(--font-heading-family);
    color: #50000b;
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.2
}

.format-best-value-badge {
    color: #fff;
    font-family: var(--font-nb-architekt);
    text-transform: uppercase;
    white-space: nowrap;
    z-index: 10;
    background: #c41e3a;
    border-radius: 1.25rem;
    padding: .375rem .75rem;
    font-size: .6875rem;
    font-weight: 700;
    line-height: 1;
    position: absolute;
    top: -10px;
    right: 24px;
    transform: none
}

.format-option-bottom {
    color: #6b7280;
    flex-direction: column;
    gap: .125rem;
    font-size: .875rem;
    line-height: 1.2;
    display: flex
}

.format-serving-price {
    font-family: var(--font-nb-architekt);
    color: #374151;
    font-size: var(--fs-md);
    font-weight: 500
}

.product_variant_options_new {
    flex-direction: column;
    gap: 0;
    display: flex
}

.flavor-selectors {
    gap: 1rem;
    display: flex
}

.flavor-option {
    cursor: pointer;
    background: #fff;
    border: 2px solid #d4d4d4;
    border-radius: .75rem;
    flex: 1;
    padding: .75rem 1rem;
    font-weight: 500;
    transition: all .2s
}

.flavor-option.active {
    border-color: var(--goli-burgundy);
    background: var(--goli-cream);
    color: var(--goli-burgundy)
}

.flavor-option:hover:not(.active) {
    border-color: #9ca3af
}

.product-form__input--plan .product_variant_options_new .quarterly-variant-wrapper {
    order: -1;
    margin-top: 0
}

.product-form__input--plan .product-variant-option-wrapper {
    position: relative;
    overflow: visible
}

.product-form__input--plan .product-variant-option-wrapper input[type=radio] {
    opacity: 0;
    pointer-events: none;
    position: absolute
}

.product-form__input--plan .product-variant-option-wrapper label {
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    background: 0 0;
    border: 1px solid #d4d4d4;
    border-radius: .5rem;
    margin-bottom: 12px;
    padding: 16px;
    transition: all .15s;
    display: block;
    position: relative
}

.product-form__input--plan .product-variant-option-wrapper:last-of-type label {
    margin-bottom: 0;
    padding-bottom: 0
}

.product-form__input--plan .product-variant-option-wrapper label:active {
    transform: none
}

.product-form__input--plan .product-variant-option-wrapper input[type=radio]:checked+label {
    background: #f5eaea;
    border-color: #8b2e3c
}

.product-form__input--plan .product-variant-option-wrapper label:hover {
    border-color: #a0a0a0
}

.product-form__input--plan .quarterly-variant-wrapper input[type=radio]+label {
    padding-top: 20px
}

.variant_option_checkbox {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    flex-shrink: 0;
    width: 24px;
    min-width: 24px;
    height: 24px;
    min-height: 24px;
    transition: all .15s;
    position: absolute;
    top: 20px;
    left: 16px
}

.product-form__input--plan .quarterly-variant-wrapper .variant_option_checkbox {
    top: 24px
}


.variant_option_new {
    padding-left: 36px
}

.ninety-three-badge {
    font-family: var(--font-body-family);
    color: #333;
    text-align: center;
    text-transform: none;
    letter-spacing: 0;
    white-space: nowrap;
    background: 0 0;
    border: 1px solid #d4d4d4;
    border-radius: 999px;
    padding: .375rem .75rem;
    font-size: .75rem;
    font-weight: 600;
    line-height: 1.2;
    display: none
}

.variant_best_value_new {
    font-family: var(--font-nb-architekt);
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0;
    white-space: nowrap;
    z-index: 10;
    background: #c41e3a;
    border-radius: 1.25rem;
    padding: .375rem .75rem;
    font-size: .6875rem;
    font-weight: 700;
    line-height: 1;
    position: absolute;
    top: -10px;
    right: 24px
}

.variant_option_top_new {
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 2px;
    display: flex
}

.variant_name_new {
    font-family: var(--font-heading-family);
    color: #50000b;
    font-size: 20px;
    font-weight: 500
}

.variant_name_new span {
    margin-left: 4px;
    font-weight: 400
}

.variant_option_price {
    font-family: var(--font-body-family);
    color: #50000b;
    white-space: nowrap;
    align-items: baseline;
    gap: 3px;
    font-size: var(--fs-2xl);
    font-weight: 700;
    display: flex
}

.variant_option_price--compare {
    color: #9ca3af;
    font-size: var(--fs-lg);
    font-weight: 700;
    text-decoration: line-through
}

.formatted-price {
    font-weight: 700
}

.variant_price_suffix {
    font-size: 1em;
    font-weight: inherit
}

.variant_option_bottom_new {
    color: #6b7280;
    border-bottom: 1px solid #e5e7eb;
    justify-content: space-between;
    align-items: baseline;
    gap: 4px;
    margin-bottom: 12px;
    padding-bottom: 12px;
    font-size: var(--fs-lg);
    display: flex
}

.variant_servings_new {
    font-family: var(--font-body-family);
    font-size: var(--fs-lg)
}

.variant_servings_price_new {
    font-family: var(--font-nb-architekt);
    white-space: nowrap;
    font-size: var(--fs-md);
    font-weight: 500
}

.variant_option_description {
    color: #374151;
    margin: 0;
    padding: 4px 0 0;
    font-size: var(--fs-lg);
    line-height: 1.6;
    list-style: none
}

.variant_option_description li {
    margin-bottom: 4px
}

.quarterly-variant-wrapper .variant_option_description {
    padding-left: 0
}

.quarterly-variant-wrapper .variant_option_description li {
    margin-left: 0;
    padding-left: 0;
    list-style: none
}

.quarterly-variant-wrapper .variant_option_description li:before {
    content: none;
    display: none
}

.product-form__input--plan .quarterly-variant-wrapper input[type=radio]:checked+label {
    opacity: .85;
    background: linear-gradient(120deg, #f5eaeacc, #fff2ed99);
    border-color: #a40011;
    box-shadow: 0 4px 12px #a4001126
}

.one-time-purchase-standalone {
    text-align: center;
    margin: 12px 0 0;
    padding: 0
}

.one-time-purchase-link {
    color: #50000b;
    text-underline-offset: 3px;
    cursor: pointer;
    font-size: var(--fs-lg);
    font-weight: 500;
    text-decoration: underline;
    transition: opacity .2s;
    display: inline-block
}

.one-time-purchase-link:hover {
    opacity: .7
}

.one-time-purchase-link .otp-price {
    font-weight: 500
}

.product-form__submit {
    color: #fff;
    text-transform: uppercase;
    letter-spacing: .08em;
    cursor: pointer;
    background: #a40011;
    border: none;
    border-radius: 100px;
    width: 100%;
    height: 3.5rem;
    font-size: 1rem;
    font-weight: 600;
    transition: background-color .3s
}

.product-form__submit:hover {
    background: #8a000e
}

.product-trust-badges {
    text-align: center;
    color: #6b7280;
    margin-top: 2rem;
    font-size: .875rem
}

.product-trust-badges p {
    margin: .25rem 0
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 400;
    font-family: Gilroy, sans-serif !important
}

.font-sans h1,
.font-sans h2,
.font-sans h3,
.font-sans h4,
.font-sans h5,
.font-sans h6 {
    font-family: Gilroy, sans-serif !important
}

.product__title h1 {
    letter-spacing: -.04em;
    margin-bottom: 1rem;
    font-size: 2rem;
    font-weight: 400;
    line-height: 1
}

@media (min-width:1024px) {
    .product__title h1 {
        letter-spacing: -.02em;
        font-size: 2.8125rem
    }
}

html {
    box-sizing: border-box;
    scroll-behavior: smooth;
    font-size: calc(var(--font-body-scale)*62.5%) !important
}

*,
:before,
:after {
    box-sizing: inherit
}

body {
    letter-spacing: 0;
    font-size: 1.5rem;
    line-height: calc(1 + .8/var(--font-body-scale));
    font-style: var(--font-body-style);
    font-weight: var(--font-body-weight);
    color: rgb(var(--color-foreground));
    background-color: rgb(var(--color-background));
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: var(--font-body-family) !important
}

.product__info-wrapper {
    max-width: 100%;
    margin-top: .5rem;
    position: relative;
    overflow: visible
}

.product__info-wrapper>* {
    max-width: 100%
}

.product__media-wrapper {
    align-items: flex-start;
    gap: 8px;
    margin-top: .75rem;
    display: flex
}

@media (min-width:750px) {
    .product__media-wrapper {
        align-self: flex-start;
        position: sticky;
        top: calc(40px + 1rem)
    }
}

@media (min-width:750px) and (max-width:1023px) {
    .product__media-wrapper {
        top: calc(40px + 1.5rem)
    }
}

@media (max-width:749px) {
    .product__media-wrapper {
        flex-direction: column;
        gap: 8px;
        align-self: auto !important;
        position: static !important
    }
}

.thumbnail-slider--desktop {
    align-self: flex-start;
    display: none
}

@media (min-width:750px) {
    .thumbnail-slider--desktop {
        flex-shrink: 0;
        width: 64px;
        display: block
    }

    .thumbnail-slider--mobile {
        display: none
    }
}

.thumbnail-slider--mobile {
    display: block
}

@media (min-width:750px) {
    .thumbnail-slider--mobile {
        display: none
    }
}

.thumbnail-list {
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column !important
}

@media (max-width:749px) {
    .thumbnail-list {
        width: 100%;
        overflow-x: auto;
        flex-direction: row !important
    }
}

.thumbnail-list__item {
    width: 64px;
    height: 64px
}

.thumbnail {
    cursor: pointer;
    background: #fff;
    border: 1px solid #d4d4d4;
    border-radius: .8125rem;
    width: 100%;
    height: 100%;
    padding: 0;
    transition: all .2s;
    display: block;
    overflow: hidden
}

.thumbnail:hover {
    border-color: #a0a0a0
}

.thumbnail.active {
    border-width: 2px;
    border-color: #50000b
}

.thumbnail img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.product__media-list {
    flex: 1;
    width: 100%;
    position: relative
}

.product-media-container--square {
    width: 100%;
    line-height: 0;
    position: relative
}

.product-media-container--square .product__media {
    border: 1px solid #d4d4d4;
    border-radius: 1.25rem;
    width: 100%;
    line-height: 0;
    display: inline-block;
    position: relative;
    overflow: hidden
}

.product-media-container--square img {
    vertical-align: top;
    width: 100%;
    height: auto;
    display: block
}

.product-media-container {
    line-height: 0;
    position: relative
}

.media--transparent {
    background: 0 0
}

.slider-buttons {
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-top: .5rem;
    display: flex
}

.slider-controls {
    justify-content: center;
    align-items: center;
    gap: 2rem;
    display: flex
}

.slider-button {
    border: 1px solid var(--goli-burgundy);
    cursor: pointer;
    background: #fff;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    width: 2.25rem;
    height: 2.25rem;
    transition: all .2s;
    display: flex
}

.slider-button:hover {
    background: var(--goli-cream)
}

.slider-button--prev .icon-caret {
    transform: rotate(90deg)
}

.slider-button--next .icon-caret {
    transform: rotate(-90deg)
}

.slider-counter {
    color: var(--goli-burgundy);
    text-align: center;
    min-width: 3rem;
    padding: 0 .5rem;
    font-size: .875rem;
    font-weight: 500
}

.slider-counter span[aria-hidden=true] {
    margin: 0 .25rem
}

.thumbnail-slider {
    margin-top: 0
}

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

.product-form__buttons {
    margin-top: 2rem;
    overflow: visible
}

.button {
    cursor: pointer;
    font-family: var(--font-body-family);
    border: none;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    display: inline-flex;
    position: relative
}

.button--full-width {
    width: 100%
}

.button--primary {
    color: #fff;
    text-transform: uppercase;
    letter-spacing: .08em;
    background: #a40011;
    border-radius: 100px;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 8px;
    min-height: 50px;
    padding: 15px 48px;
    font-size: var(--fs-lg);
    font-weight: 600;
    display: flex
}

.button--primary:hover {
    transition: background-color .3s;
    background: #8a000e !important
}

.button--primary:active {
    transform: translateY(0)
}

.product-form__submit {
    position: relative
}

.product-form__submit .dash_new {
    margin: 0 .5rem
}

.product-form__submit .product_price_new {
    font-weight: 600
}

.product-form__submit.loading .button-text,
.product-form__submit.loading .dash_new,
.product-form__submit.loading .product_price_new {
    visibility: hidden !important;
    display: none !important
}

.product-form__submit.loading .loading__spinner {
    display: flex !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important
}

.loading__spinner,
.loading__spinner.hidden {
    display: none
}

.spinner {
    width: 24px;
    height: 24px;
    animation: 1s linear infinite spinner-rotate
}

.spinner .path {
    stroke: #fff;
    stroke-linecap: round;
    animation: 1.5s ease-in-out infinite spinner-dash
}

@keyframes spinner-rotate {
    to {
        transform: rotate(360deg)
    }
}

@keyframes spinner-dash {
    0% {
        stroke-dasharray: 1 150;
        stroke-dashoffset: 0
    }

    50% {
        stroke-dasharray: 90 150;
        stroke-dashoffset: -35px
    }

    to {
        stroke-dasharray: 90 150;
        stroke-dashoffset: -124px
    }
}

.bfcm-product-banner {
    background: linear-gradient(135deg, var(--bfcm-bg)0%, var(--bfcm-bg)100%);
    margin-top: 16px;
    padding: 14px 18px
}

@supports (color:color-mix(in lab, red, red)) {
    .bfcm-product-banner {
        background: linear-gradient(135deg, var(--bfcm-bg)0%, color-mix(in srgb, var(--bfcm-bg)80%, var(--bfcm-border)20%)100%)
    }
}

.bfcm-product-banner {
    border: 1.5px solid var(--bfcm-border);
    border-radius: 12px;
    align-items: center;
    gap: 12px;
    transition: opacity .3s, max-height .3s;
    display: flex;
    overflow: hidden;
    box-shadow: 0 2px 8px #00000014
}

.bfcm-product-banner.bfcm-hidden {
    opacity: 0;
    border: none;
    max-height: 0;
    margin: 0;
    padding: 0
}

.bfcm-product-banner__icon {
    background: var(--bfcm-icon);
    border-radius: 50%;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 24px;
    display: flex
}

.bfcm-product-banner__icon svg {
    color: #fff;
    width: 14px;
    height: 14px
}

.bfcm-product-banner__text {
    color: var(--bfcm-text);
    font-size: var(--fs-lg);
    font-weight: 500;
    line-height: 1.4
}

.bfcm-product-banner__highlight {
    font-weight: 700
}

@media (max-width:749px) {
    .bfcm-product-banner {
        gap: 10px;
        padding: 12px 14px
    }

    .bfcm-product-banner__text {
        font-size: var(--fs-base)
    }

    .bfcm-product-banner__icon {
        width: 22px;
        height: 22px
    }

    .bfcm-product-banner__icon svg {
        width: 12px;
        height: 12px
    }
}

.hsa-info {
    color: #50000b;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 16px;
    font-size: var(--fs-lg);
    display: flex
}

.hsa-text-highlight {
    color: #50000b;
    font-weight: 700
}

.hsa-info svg {
    flex-shrink: 0
}

.hsa-info__link {
    color: #50000b;
    font-weight: 500;
    text-decoration: underline;
    transition: opacity .2s
}

.hsa-info__link:hover {
    opacity: .7
}

@media (max-width:749px) {
    .hsa-info {
        font-size: var(--fs-base)
    }
}

.product-accordion {
    margin-top: 0;
    padding: 0;
    list-style: none
}

.product-accordion li {
    border-bottom: 1px solid #e5e5e5
}

.product-accordion .question {
    cursor: pointer;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    transition: all .3s;
    display: flex
}

.product-accordion .question:hover {
    opacity: .7
}

.product-accordion .question h4 {
    font-family: var(--font-body-family);
    color: #50000b;
    text-transform: none;
    letter-spacing: normal;
    margin: 0;
    font-size: var(--fs-base);
    font-weight: 500;
    line-height: 1.4
}

.product-accordion .question:after {
    content: "+";
    color: #999;
    flex-shrink: 0;
    margin-left: auto;
    font-size: var(--fs-2xl);
    font-weight: 300;
    transition: transform .3s
}

.product-accordion li.open .question:after {
    content: "−"
}

.product-accordion .answer {
    opacity: 0;
    grid-template-rows: 0fr;
    transition: grid-template-rows .35s cubic-bezier(.4, 0, .2, 1), opacity .25s;
    display: grid
}

.product-accordion .answer>* {
    overflow: hidden
}

.product-accordion li.open .answer {
    opacity: 1;
    grid-template-rows: 1fr;
    padding-top: 2px;
    padding-bottom: 4px
}

.product-accordion .answer p {
    color: #000000;
    line-height: 1.5;
    font-family: var(--font-body-family);
    text-transform: none;
    letter-spacing: normal;
    margin: 0 0 4px;
    font-size: var(--fs-md)
}

.product-accordion .answer ol {
    color: #666;
    line-height: 1.5;
    font-family: var(--font-body-family);
    text-transform: none;
    letter-spacing: normal;
    margin: 0;
    padding-left: 16px;
    font-size: var(--fs-md);
    list-style-type: decimal
}

.product-accordion .answer ol li {
    border: none;
    padding: 2px 0;
    list-style: decimal;
    display: list-item
}

.Meta_supplement_popup_main_acc_1_new {
    margin-top: 4px
}

.supplement-facts-link {
    color: #a40011;
    font-size: var(--fs-sm);
    font-weight: 500;
    font-family: var(--font-body-family);
    text-transform: none;
    letter-spacing: normal;
    text-decoration: underline;
    transition: opacity .2s
}

.supplement-facts-link:hover {
    opacity: .7
}

@media (max-width:749px) {
    .product-accordion .question h4 {
        font-size: var(--fs-lg)
    }

    .product-accordion .question {
        padding: 10px 0
    }

    .product-accordion li.open .answer {
        padding-bottom: 6px
    }
}

.members-only-compact {
    background: linear-gradient(135deg, #f5e6d3, #e8d4b8);
    border: 2px solid #d4b896;
    border-radius: 12px;
    align-items: center;
    min-height: 80px;
    margin-top: 16px;
    margin-bottom: 12px;
    padding: 16px 20px;
    display: flex;
    position: relative
}

.members-badge {
    color: #50000b;
    letter-spacing: .5px;
    text-transform: uppercase;
    background: linear-gradient(90deg, #eeb87a, #dfce89);
    border-radius: 20px;
    align-self: flex-start;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    font-size: var(--fs-sm);
    font-weight: 700;
    display: inline-flex
}

.members-badge svg {
    width: 14px;
    height: 14px
}

.members-content {
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    display: flex
}

.members-text {
    z-index: 1;
    flex-direction: column;
    flex: 1;
    gap: 8px;
    padding-right: 200px;
    display: flex;
    position: relative
}

.members-text h3 {
    font-family: var(--font-heading-family);
    color: #50000b;
    margin: 0 0 4px;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.3
}

.members-text p {
    color: #6b4423;
    margin: 0;
    font-size: var(--fs-base);
    line-height: 1.4
}

.members-faces {
    pointer-events: none;
    flex-direction: row;
    gap: 12px;
    display: flex;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 20px;
    overflow: hidden
}

.face-column {
    will-change: transform;
    flex-direction: column;
    gap: 10px;
    animation: 30s linear infinite floatUp;
    display: flex
}

.face-image {
    object-fit: cover;
    background: #f5f5f5;
    border: 2px solid #d4b896;
    border-radius: 50%;
    flex-shrink: 0;
    width: 48px;
    height: 48px
}

@keyframes shimmer {
    0% {
        left: -100%
    }

    to {
        left: 100%
    }
}

@keyframes floatUp {
    0% {
        transform: translateY(0)
    }

    to {
        transform: translateY(-50%)
    }
}

@media (max-width:749px) {
    .members-only-compact {
        padding: 14px 16px
    }

    .members-badge {
        white-space: nowrap
    }

    .members-text {
        padding-right: 120px
    }

    .members-text h3 {
        font-size: var(--fs-lg)
    }

    .members-text p {
        font-size: var(--fs-md)
    }

    .members-faces {
        gap: 8px;
        right: 16px
    }

    .face-column:nth-child(3) {
        display: none
    }

    .face-image {
        width: 40px;
        height: 40px
    }
}

.checkout-confirmations {
    flex-direction: column;
    align-items: center;
    gap: 8px;
    margin: 16px 0;
    display: flex
}

.checkout-confirmation-item {
    background: #f0fdf4;
    border: 1px solid #d1fae5;
    border-radius: 999px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding: 4px 10px;
    display: flex
}

.checkout-confirmation-item svg {
    flex-shrink: 0
}

.checkout-confirmation-item span {
    color: #374151;
    font-size: var(--fs-base);
    line-height: 1.4
}

.hsa-modal {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    z-index: 9999;
    justify-content: center;
    align-items: center;
    transition: opacity .3s, visibility .3s;
    display: flex;
    position: fixed;
    inset: 0
}

.hsa-modal--open {
    visibility: visible;
    opacity: 1;
    pointer-events: auto
}

.hsa-modal__backdrop {
    opacity: 0;
    background: #000000b3;
    transition: opacity .3s;
    position: fixed;
    inset: 0
}

.hsa-modal--open .hsa-modal__backdrop {
    opacity: 1
}

.hsa-modal__content {
    z-index: 1001;
    text-align: center;
    color: #50000b;
    background: #f5eaea;
    border-radius: 16px;
    max-width: 600px;
    max-height: 90vh;
    padding: 25px 30px;
    position: relative;
    overflow-y: auto;
    box-shadow: 0 10px 30px #0003
}

@media (max-width:749px) {
    .hsa-modal__content {
        max-width: 95%;
        padding: 1.5rem
    }
}

.hsa-modal__close {
    cursor: pointer;
    color: #50000b;
    background: 0 0;
    border: none;
    margin-left: auto;
    padding: 0;
    font-size: 40px;
    line-height: 1;
    display: block
}

.hsa-modal__close:hover {
    opacity: .7
}

.hsa-modal__title {
    font-size: var(--fs-h2);
    font-family: var(--font-heading-family);
    color: #50000b;
    margin: 0 0 10px
}

.hsa-modal__description {
    text-align: left;
    margin-bottom: 20px;
    font-size: var(--fs-2xl)
}

.hsa-modal__steps {
    text-align: left;
    margin-bottom: 20px;
    padding: 0 0 0 16px;
    font-size: var(--fs-2xl);
    list-style-position: outside
}

.hsa-modal__steps li:not(:last-child) {
    border-bottom: 1px solid #50000b;
    margin-bottom: 15px;
    padding-bottom: 15px
}

.hsa-modal__steps li::marker {
    color: #a40011;
    font-weight: 700
}

.hsa-modal__steps li strong {
    color: #a40011;
    font-weight: 700
}

.hsa-modal__steps li p {
    margin: 5px 0 0
}

.hsa-modal__disclaimer {
    text-align: left;
    margin: 0;
    font-size: var(--fs-md);
    line-height: 1.2
}

.product-buy-sticky-container {
    z-index: 100;
    background: #fff;
    border-top: 1px solid #e5e5e5;
    padding: 12px 0;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: visible;
    box-shadow: 0 -2px 10px #0000001a
}

.product-buy-sticky__inner {
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    display: flex;
    overflow: visible
}

.product-details {
    flex: 1;
    align-items: center;
    gap: 16px;
    display: flex
}

.product-image-container {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    position: relative
}

.product-image {
    object-fit: cover;
    border-radius: 8px;
    width: 100%;
    height: 100%
}

.image-glow {
    pointer-events: none;
    background: radial-gradient(circle, #50000b1a, #0000 70%);
    border-radius: 8px;
    position: absolute;
    inset: 0
}

.product-title {
    font-family: var(--font-body-family);
    color: #50000b;
    font-size: var(--fs-lg);
    font-weight: 600;
    line-height: 1.3
}

.product-title__variant {
    color: #666;
    margin-top: 2px;
    font-size: var(--fs-md);
    font-weight: 400
}

.right-aligned {
    align-items: center;
    gap: 16px;
    display: flex
}

.custom-dropdown {
    text-align: left;
    contain: none;
    width: 280px;
    position: relative;
    overflow: visible
}

.dropdown-selected {
    cursor: pointer;
    color: #50000b;
    background-color: #f9f4f4;
    border: 1px solid #50000b;
    border-radius: 20px;
    flex-direction: column;
    justify-content: center;
    min-height: 48px;
    padding: 6px 30px;
    font-weight: 700;
    display: flex;
    position: relative
}

.dropdown-selected__title {
    font-family: var(--font-body-family);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-size: var(--fs-base);
    line-height: 1.2
}

.dropdown-selected__price-per-serving {
    font-family: var(--font-body-family);
    color: #666;
    margin-top: 1px;
    font-size: var(--fs-sm);
    font-weight: 400
}

.dropdown-arrow {
    will-change: transform;
    border-top: 6px solid #50000b;
    border-left: 6px solid #0000;
    border-right: 6px solid #0000;
    width: 0;
    height: 0;
    transition: transform .3s;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%)
}

.dropdown-selected.open .dropdown-arrow {
    transform: translateY(-50%)rotate(180deg)
}

.dropdown-options {
    z-index: 1000;
    background-color: #fff;
    border: 1px solid #50000b;
    border-radius: 20px;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    position: absolute;
    overflow: hidden;
    box-shadow: 0 4px 20px #00000026
}

.dropdown-up {
    margin-bottom: 5px;
    bottom: 100%
}

.dropdown-option {
    cursor: pointer;
    color: #50000b;
    font-weight: 700;
    font-family: var(--font-body-family);
    border-bottom: 1px solid #f2f2f2;
    padding: 10px 20px;
    font-size: var(--fs-lg)
}

.dropdown-option:hover {
    background-color: #f9f4f4
}

.dropdown-option:last-child {
    border-bottom: none
}

.sticky-add-to-cart-btn {
    color: #fff;
    font-family: var(--font-body-family);
    text-transform: uppercase;
    letter-spacing: .5px;
    cursor: pointer;
    white-space: nowrap;
    background: #50000b;
    border: none;
    border-radius: 25px;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding: 12px 32px;
    font-size: var(--fs-lg);
    font-weight: 700;
    transition: all .3s;
    display: flex
}

.sticky-add-to-cart-btn:hover {
    background: #3d0009;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px #50000b4d
}

.sticky-add-to-cart-btn:active {
    transform: translateY(0)
}

@media (min-width:750px) and (max-width:1023px) {
    .product-buy-sticky__inner {
        gap: 16px
    }

    .product-title {
        font-size: var(--fs-lg)
    }
}

@media (max-width:749px) {
    .product-buy-sticky__inner {
        flex-wrap: nowrap;
        align-items: stretch;
        gap: 8px
    }

    .product-details {
        display: none
    }

    .right-aligned {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
        width: 100%
    }

    .custom-dropdown {
        width: 100%
    }

    .sticky-dropdown {
        width: 100%;
        height: 48px;
        min-height: 48px
    }

    .sticky-add-to-cart-btn {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 2px;
        width: 100%;
        height: 48px;
        min-height: 48px;
        padding: 8px 16px;
        font-size: var(--fs-base);
        line-height: 1.3;
        display: flex
    }

    .sticky-add-to-cart-btn .dash_new {
        display: none
    }

    .sticky-add-to-cart-btn .button_text_new,
    .sticky-add-to-cart-btn .product_price_new {
        white-space: nowrap
    }

    .sticky-add-to-cart-btn .product_price_new {
        font-size: var(--fs-xs);
        font-weight: 600
    }
}

.announcement-bar-text {
    display: inline
}

.announcement-bar-arrow {
    vertical-align: middle;
    margin-left: 4px;
    display: inline-block !important
}

@media (max-width:749px) {
    .announcement-bar-content {
        text-align: center;
        flex-direction: column;
        line-height: 1.4;
        gap: 0 !important
    }

    .product-form__submit {
        justify-content: center;
        align-items: center;
        gap: 2px;
        min-height: 60px;
        padding: 12px 24px;
        line-height: 1.3;
        flex-direction: column !important;
        display: flex !important
    }

    .product-form__submit .button-text,
    .product-form__submit .product_price_new {
        white-space: nowrap;
        display: block !important
    }

    .product-form__submit .dash_new {
        display: none !important
    }

    .sticky-add-to-cart-btn {
        min-height: 56px;
        padding: 10px 20px;
        font-size: var(--fs-md)
    }

    .button--primary {
        min-height: 64px;
        font-size: var(--fs-md)
    }
}

@media (min-width:750px) {
    .menu-tablet-desktop {
        display: flex !important
    }

    .burger-mobile-only {
        display: none !important
    }
}

@media (max-width:749px) {
    .menu-tablet-desktop {
        display: none !important
    }

    .burger-mobile-only {
        cursor: pointer;
        background: 0 0;
        padding: 0;
        border: none !important;
        display: block !important
    }
}

.menu-tablet-desktop a {
    text-decoration: none;
    transition: color .3s;
    position: relative
}

.menu-tablet-desktop a:after {
    content: "";
    background-color: #50000b;
    width: 0;
    height: 1px;
    transition: width .3s;
    position: absolute;
    bottom: -2px;
    left: 0
}

.menu-tablet-desktop a:hover:after {
    width: 100%
}

.menu-tablet-desktop a:hover {
    color: #50000b !important
}

@media (max-width:749px) {
    .format-option-wrapper label {
        min-height: 52px
    }

    .product-variant-option-image {
        width: 70px
    }

    .format-option-content {
        padding: .25rem .5rem .25rem 0
    }

    .sticky-dropdown .dropdown-arrow {
        right: 12px
    }
}

.discount-text-mobile {
    display: none
}

@media (max-width:749px) {
    .discount-text-full {
        display: none
    }

    .discount-text-mobile {
        display: inline
    }
}

.quiz-page {
    color: #1a1a1a;
    -webkit-font-smoothing: antialiased;
    background: #fff;
    min-height: 100vh;
    font-size: var(--fs-2xl) !important;
    font-family: "Gilroy", sans-serif !important
}

.quiz-page *,
.quiz-page :before,
.quiz-page :after {
    box-sizing: border-box
}

.quiz-page h1,
.quiz-page h2,
.quiz-page h3,
.quiz-page h4,
.quiz-page h5,
.quiz-page h6,
.quiz-page p,
.quiz-page span,
.quiz-page div,
.quiz-page button,
.quiz-page input {
    font-size: inherit;
    font-family: inherit !important
}

.quiz-main {
    max-width: 640px;
    margin: 0 auto;
    padding: 0 24px 140px
}

@media (max-width:640px) {
    .quiz-main {
        padding: 0 20px 140px
    }
}

.quiz-wrapper {
    width: 100%
}

.quiz-top-bar {
    justify-content: space-between;
    align-items: center;
    padding: 20px 0 8px;
    display: flex
}

.quiz-top-bar__percent {
    color: #a40011;
    letter-spacing: .02em;
    font-weight: 700;
    font-family: Gilroy, sans-serif !important;
    font-size: var(--fs-base) !important
}

.quiz-top-bar__counter {
    color: #bbb;
    letter-spacing: .02em;
    font-weight: 500;
    font-size: var(--fs-base) !important
}

.quiz-progress {
    padding: 0 0 32px
}

.quiz-progress__track {
    background: #f0e8e9;
    border-radius: 2px;
    width: 100%;
    height: 3px;
    overflow: hidden
}

.quiz-progress__fill {
    border-radius: 2px;
    background: #a40011 !important;
    height: 3px !important;
    min-height: 3px !important;
    transition: width .5s !important;
    display: block !important
}

@keyframes quizStepEnter {
    0% {
        opacity: 0;
        transform: translateY(16px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes quizStepExit {
    0% {
        opacity: 1;
        transform: translateY(0)
    }

    to {
        opacity: 0;
        transform: translateY(-12px)
    }
}

.quiz-step--enter {
    animation: .4s forwards quizStepEnter
}

.quiz-step--exit {
    animation: .3s forwards quizStepExit
}

.quiz-content {
    text-align: center
}

.quiz-badge-row {
    text-align: center;
    margin-bottom: 16px
}

.quiz-category-badge {
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #a40011;
    background: #a400110f;
    border-radius: 100px;
    padding: 4px 12px;
    font-weight: 700;
    display: inline-block;
    font-family: Gilroy, sans-serif !important;
    font-size: var(--fs-xs) !important
}

.quiz-title {
    color: #1a1a1a;
    text-transform: uppercase;
    letter-spacing: .02em;
    text-align: center;
    margin: 0 0 8px;
    font-weight: 700;
    line-height: 1.15;
    font-size: var(--fs-h2) !important;
    font-family: "Gilroy", sans-serif !important
}

@media (min-width:641px) {
    .quiz-title {
        font-size: 30px !important
    }
}

.quiz-subtitle {
    color: #888;
    text-align: center;
    margin: 0 0 28px;
    line-height: 1.5;
    font-size: var(--fs-lg) !important
}

.quiz-options-grid {
    text-align: left;
    flex-direction: column;
    gap: 10px;
    display: flex
}

.quiz-option-card {
    text-align: left;
    cursor: pointer;
    color: #1a1a1a;
    background: #fff;
    border: 1.5px solid #e5e0e1;
    border-radius: 10px;
    align-items: center;
    gap: 14px;
    width: 100%;
    padding: 14px 16px;
    font-weight: 500;
    line-height: 1.4;
    transition: all .2s;
    display: flex;
    font-family: "Gilroy", sans-serif !important;
    font-size: var(--fs-xl) !important
}

.quiz-option-card:hover {
    background: #a4001105;
    border-color: #a40011
}

.quiz-option-card--selected {
    background: #a400110a;
    border-color: #a40011;
    box-shadow: 0 0 0 1px #a40011
}

.quiz-option-card__indicator {
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    display: flex
}

.quiz-option-card__emoji {
    flex-shrink: 0;
    line-height: 1;
    font-size: 20px !important
}

.quiz-option-card__text {
    flex: 1;
    min-width: 0
}

.quiz-multiselect-hint {
    text-align: center;
    color: #bbb;
    margin-top: 16px;
    font-size: var(--fs-base) !important
}

.quiz-stat-number {
    letter-spacing: .02em;
    font-weight: 700;
    font-family: Gilroy, sans-serif !important
}

.quiz-insight-card {
    text-align: center;
    background: linear-gradient(135deg, #fdf8f8, #fff5f0);
    border: 1px solid #a4001114;
    border-radius: 16px;
    padding: 40px 28px
}

@media (max-width:640px) {
    .quiz-insight-card {
        padding: 32px 20px
    }
}

.quiz-insight-badge {
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #fff;
    background: #a40011;
    border-radius: 100px;
    padding: 4px 14px;
    font-weight: 700;
    display: inline-block;
    font-family: Gilroy, sans-serif !important;
    font-size: var(--fs-xs) !important
}

.quiz-insight-title {
    color: #1a1a1a;
    text-transform: uppercase;
    letter-spacing: .01em;
    margin: 0 0 12px;
    font-weight: 700;
    line-height: 1.25;
    font-size: var(--fs-h3) !important;
    font-family: "Gilroy", sans-serif !important
}

@media (min-width:641px) {
    .quiz-insight-title {
        font-size: var(--fs-h2-lg) !important
    }
}

.quiz-insight-text {
    color: #555;
    max-width: 480px;
    margin: 0 auto 24px;
    line-height: 1.6;
    font-size: var(--fs-lg) !important
}

.quiz-insight-stats {
    flex-wrap: wrap;
    justify-content: center;
    gap: 24px;
    margin-bottom: 8px;
    display: flex
}

.quiz-insight-stat {
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-width: 80px;
    display: flex
}

.quiz-insight-stat__icon {
    line-height: 1;
    font-size: var(--fs-h3) !important
}

.quiz-insight-stat__value {
    color: #a40011;
    letter-spacing: .02em;
    font-weight: 700;
    line-height: 1;
    font-family: Gilroy, sans-serif !important;
    font-size: var(--fs-h2-lg) !important
}

.quiz-insight-stat__label {
    color: #888;
    text-align: center;
    font-weight: 500;
    line-height: 1.3;
    font-size: var(--fs-sm) !important
}

.quiz-email-card {
    text-align: center
}

.quiz-email-preview {
    justify-content: center;
    margin-bottom: 24px;
    display: flex;
    position: relative
}

.quiz-email-score-circle {
    filter: blur(6px);
    opacity: .5;
    border: 8px solid #e5e7eb;
    border-radius: 50%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 120px;
    height: 120px;
    display: flex
}

.quiz-email-score-number {
    color: #1a1a1a;
    font-weight: 700;
    font-family: Gilroy, sans-serif !important;
    font-size: var(--fs-d1) !important
}

.quiz-email-score-label {
    color: #999;
    font-family: Gilroy, sans-serif !important;
    font-size: var(--fs-lg) !important
}

.quiz-email-score-blur {
    z-index: 2;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: var(--fs-h1) !important
}

.quiz-email-bars {
    filter: blur(4px);
    opacity: .6;
    text-align: left;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 32px;
    display: flex
}

.quiz-email-bar-row {
    align-items: center;
    gap: 12px;
    display: flex
}

.quiz-email-bar-label {
    color: #666;
    flex-shrink: 0;
    width: 80px;
    font-weight: 600;
    font-size: var(--fs-base) !important
}

.quiz-email-bar-track {
    background: #f0e8e9;
    border-radius: 3px;
    flex: 1;
    height: 6px;
    overflow: hidden
}

.quiz-email-bar-fill {
    border-radius: 3px;
    background: #a40011 !important;
    height: 6px !important;
    min-height: 6px !important;
    display: block !important
}

.quiz-email-form-area {
    text-align: center
}

.quiz-email-heading {
    color: #1a1a1a;
    text-transform: uppercase;
    letter-spacing: .02em;
    margin: 0 0 8px;
    font-weight: 700;
    font-size: var(--fs-h3) !important;
    font-family: "Gilroy", sans-serif !important
}

@media (min-width:641px) {
    .quiz-email-heading {
        font-size: var(--fs-h2-lg) !important
    }
}

.quiz-email-desc {
    color: #888;
    max-width: 440px;
    margin: 0 auto 24px;
    line-height: 1.5;
    font-size: var(--fs-lg) !important
}

.quiz-email-form {
    flex-direction: column;
    gap: 12px;
    max-width: 400px;
    margin: 0 auto;
    display: flex
}

.quiz-email-input {
    color: #1a1a1a;
    text-align: center;
    border: 1.5px solid #e5e0e1;
    border-radius: 10px;
    outline: none;
    width: 100%;
    padding: 14px 16px;
    transition: border-color .2s;
    font-size: var(--fs-xl) !important;
    font-family: "Gilroy", sans-serif !important
}

.quiz-email-input:focus {
    border-color: #a40011
}

.quiz-email-input::placeholder {
    color: #bbb
}

.quiz-email-privacy {
    color: #bbb;
    margin-top: 12px;
    font-size: var(--fs-md) !important
}

.quiz-cta-btn {
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #fff;
    cursor: pointer;
    white-space: nowrap;
    background: #a40011;
    border: none;
    border-radius: 100px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding: 14px 32px;
    font-weight: 700;
    transition: background .25s, box-shadow .25s, transform .2s;
    display: inline-flex;
    box-shadow: 0 4px 16px #a4001140;
    font-family: "Gilroy", sans-serif !important;
    font-size: var(--fs-base) !important
}

.quiz-cta-btn:hover {
    background: #8a000e;
    transform: translateY(-1px);
    box-shadow: 0 6px 24px #a4001166
}

.quiz-cta-btn:disabled {
    opacity: .4;
    cursor: not-allowed;
    box-shadow: none;
    transform: none
}

.quiz-cta-btn--full {
    width: 100%;
    padding: 16px 24px
}

.quiz-bottom-nav {
    z-index: 40;
    background: #fff;
    border-top: 1px solid #50000b14;
    padding: 14px 24px;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    box-shadow: 0 -4px 20px #0000000f
}

.quiz-bottom-nav__inner {
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    max-width: 640px;
    margin: 0 auto;
    display: flex
}

.quiz-bottom-nav__left {
    flex: 1;
    min-width: 0
}

.quiz-bottom-nav__right {
    flex-shrink: 0
}

.quiz-back-link {
    cursor: pointer;
    color: #999;
    background: 0 0;
    border: none;
    padding: 4px 0;
    font-weight: 500;
    text-decoration: none;
    transition: color .2s;
    font-size: var(--fs-lg) !important;
    font-family: "Gilroy", sans-serif !important
}

.quiz-back-link:hover {
    color: #666
}

.quiz-results-card {
    text-align: center;
    padding: 20px 0
}

.quiz-results-badge {
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #fff;
    background: #a40011;
    border-radius: 100px;
    padding: 4px 14px;
    font-weight: 700;
    display: inline-block;
    font-family: Gilroy, sans-serif !important;
    font-size: var(--fs-xs) !important
}

.quiz-results-heading {
    color: #1a1a1a;
    text-transform: uppercase;
    letter-spacing: .02em;
    margin: 16px 0 24px;
    font-weight: 700;
    font-size: var(--fs-h2) !important;
    font-family: "Gilroy", sans-serif !important
}

@media (min-width:641px) {
    .quiz-results-heading {
        font-size: var(--fs-h1) !important
    }
}

.quiz-results-gauge {
    justify-content: center;
    align-items: center;
    width: 160px;
    height: 160px;
    margin: 0 auto 20px;
    display: flex;
    position: relative
}

.quiz-results-gauge__value {
    flex-direction: column;
    align-items: center;
    gap: 2px;
    display: flex;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.quiz-results-interpretation {
    color: #666;
    max-width: 440px;
    margin: 0 auto 32px;
    line-height: 1.5;
    font-size: var(--fs-lg) !important
}

.quiz-results-categories {
    text-align: left;
    margin-bottom: 32px
}

.quiz-results-categories__title {
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #999;
    margin: 0 0 16px;
    font-weight: 700;
    font-family: Gilroy, sans-serif !important;
    font-size: var(--fs-md) !important
}

.quiz-results-cat-row {
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    display: flex
}

.quiz-results-cat-row__icon {
    text-align: center;
    flex-shrink: 0;
    width: 24px;
    font-size: var(--fs-h4) !important
}

.quiz-results-cat-row__label {
    color: #1a1a1a;
    flex-shrink: 0;
    width: 80px;
    font-weight: 600;
    font-size: var(--fs-lg) !important
}

.quiz-results-cat-row__bar {
    background: #f0e8e9;
    border-radius: 3px;
    flex: 1;
    height: 6px;
    overflow: hidden
}

.quiz-results-cat-row__fill {
    border-radius: 3px;
    height: 6px !important;
    min-height: 6px !important;
    display: block !important
}

.quiz-results-cat-row__value {
    color: #1a1a1a;
    text-align: right;
    flex-shrink: 0;
    width: 30px;
    font-weight: 700;
    font-size: var(--fs-lg) !important
}

.quiz-results-cta-area {
    text-align: center;
    margin-top: 8px
}

.quiz-results-guarantee {
    color: #bbb;
    margin-top: 12px;
    font-size: var(--fs-md) !important
}

.result-page {
    padding: 48px 24px 64px;
    font-size: var(--fs-2xl) !important;
    font-family: var(--font-body-family) !important
}

.result-page h1,
.result-page h2,
.result-page h3,
.result-page h4,
.result-page h5,
.result-page h6,
.result-page p,
.result-page span,
.result-page div,
.result-page button,
.result-page input {
    font-family: inherit !important
}

@media (min-width:750px) {
    .result-page {
        padding: 64px 32px 80px
    }
}

@media (min-width:990px) {
    .result-page {
        padding: 80px 48px 96px
    }
}

.result-page-content {
    max-width: 1000px;
    margin: 0 auto
}

.result-hero {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
    padding: 48px 0 64px
}

.result-badge {
    letter-spacing: .15em;
    color: #c41e3a;
    background: #c41e3a14;
    border-radius: 32px;
    margin-bottom: 24px;
    padding: 8px 20px;
    display: inline-block;
    font-family: var(--font-nb-architekt) !important;
    font-size: var(--fs-base) !important
}

.result-title {
    color: #1a1a1a;
    margin-bottom: 16px;
    font-weight: 500;
    line-height: 1.2;
    font-family: var(--font-body-family) !important;
    font-size: 40px !important
}

@media (min-width:750px) {
    .result-title {
        font-size: var(--fs-d4) !important
    }
}

.result-subtitle {
    color: #555;
    max-width: 600px;
    margin: 0 auto 40px;
    font-family: var(--font-body-family) !important;
    font-size: 20px !important
}

.result-score-section {
    flex-direction: column;
    align-items: center;
    gap: 32px;
    display: flex
}

.result-score-circle {
    width: 180px;
    height: 180px;
    position: relative
}

.result-score-gauge {
    width: 100%;
    height: 100%
}

.result-score-arc {
    animation: 1.5s ease-out forwards resultScoreFill
}

@keyframes resultScoreFill {
    0% {
        stroke-dasharray: 0 565
    }
}

.result-score-value {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.result-score-value .score-number {
    color: #1a1a1a;
    font-weight: 700;
    line-height: 1;
    display: block;
    font-family: var(--font-nb-architekt) !important;
    font-size: 56px !important
}

.result-score-value .score-label {
    color: #666;
    font-size: var(--fs-2xl) !important
}

.result-score-message {
    max-width: 500px
}

.result-score-message p {
    color: #555;
    line-height: 1.7;
    font-size: var(--fs-h4) !important
}

.result-breakdown {
    background: #f9f9f9;
    margin: 0 -24px;
    padding: 48px 24px
}

@media (min-width:750px) {
    .result-breakdown {
        margin: 0 -32px;
        padding-left: 32px;
        padding-right: 32px
    }
}

@media (min-width:990px) {
    .result-breakdown {
        margin: 0 -48px;
        padding-left: 48px;
        padding-right: 48px
    }
}

.result-breakdown-content {
    max-width: 900px;
    margin: 0 auto
}

.result-breakdown h2 {
    color: #1a1a1a;
    text-align: center;
    margin-bottom: 32px;
    font-weight: 500;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-h1) !important
}

.result-categories {
    gap: 16px;
    display: grid
}

@media (min-width:750px) {
    .result-categories {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px
    }
}

.result-category-card {
    background: #fff;
    border-radius: 12px;
    align-items: center;
    gap: 16px;
    padding: 20px;
    display: flex
}

.category-header {
    align-items: center;
    gap: 12px;
    min-width: 140px;
    display: flex
}

.category-header .category-icon {
    font-size: var(--fs-h2) !important
}

.category-header .category-name {
    color: #333;
    font-weight: 600;
    display: block
}

.category-header .category-desc {
    color: #888;
    display: block;
    font-size: var(--fs-md) !important
}

.category-score-bar {
    background: #e5e7eb;
    border-radius: 4px;
    flex: 1;
    height: 8px;
    overflow: hidden
}

.category-score-fill {
    border-radius: 4px;
    height: 100%;
    transition: width 1s ease-out
}

.category-score-value {
    color: #333;
    text-align: right;
    min-width: 30px;
    font-weight: 600;
    font-family: var(--font-nb-architekt) !important
}

.result-insights {
    padding: 64px 0
}

.result-insights-content {
    max-width: 900px;
    margin: 0 auto
}

.result-insights h2 {
    color: #1a1a1a;
    text-align: center;
    margin-bottom: 40px;
    font-weight: 500;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-h1) !important
}

.insight-cards {
    gap: 24px;
    display: grid
}

@media (min-width:750px) {
    .insight-cards {
        grid-template-columns: repeat(3, 1fr)
    }
}

.insight-card {
    text-align: center;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: 24px
}

.insight-icon {
    margin-bottom: 16px;
    font-size: 40px !important
}

.insight-card h3 {
    color: #1a1a1a;
    margin-bottom: 12px;
    font-weight: 500;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-h4) !important
}

.insight-card p {
    color: #666;
    line-height: 1.6;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-xl) !important
}

.result-comparison {
    background: #f9f9f9;
    margin: 0 -24px;
    padding: 48px 24px
}

@media (min-width:750px) {
    .result-comparison {
        margin: 0 -32px;
        padding-left: 32px;
        padding-right: 32px
    }
}

@media (min-width:990px) {
    .result-comparison {
        margin: 0 -48px;
        padding-left: 48px;
        padding-right: 48px
    }
}

.result-comparison-content {
    max-width: 800px;
    margin: 0 auto
}

.result-comparison h2 {
    color: #1a1a1a;
    text-align: center;
    margin-bottom: 32px;
    font-weight: 500;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-h1) !important
}

.comparison-table {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    overflow: hidden
}

.comparison-header {
    letter-spacing: .05em;
    text-transform: uppercase;
    background: #f3f4f6;
    grid-template-columns: 1.5fr 1fr 1fr;
    display: grid;
    font-family: var(--font-nb-architekt) !important;
    font-size: var(--fs-base) !important
}

.comparison-header .comparison-col {
    color: #666;
    padding: 16px;
    font-weight: 600
}

.comparison-header .comparison-col.highlight {
    color: #c41e3a;
    background: #c41e3a14
}

.comparison-row {
    border-top: 1px solid #e5e7eb;
    grid-template-columns: 1.5fr 1fr 1fr;
    display: grid
}

.comparison-row .comparison-col {
    color: #555;
    padding: 16px;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-xl) !important
}

.comparison-row .comparison-col.metric {
    color: #333;
    font-weight: 500
}

.comparison-row .comparison-col.highlight {
    color: #c41e3a;
    background: #c41e3a0a;
    font-weight: 600
}

.result-testimonial {
    padding: 64px 0
}

.result-testimonial-content {
    text-align: center;
    max-width: 700px;
    margin: 0 auto
}

.result-testimonial blockquote {
    color: #333;
    margin-bottom: 24px;
    font-style: normal;
    line-height: 1.7;
    font-family: var(--font-body-family) !important;
    font-size: 20px !important
}

.testimonial-author {
    justify-content: center;
    align-items: center;
    gap: 16px;
    display: flex
}

.author-avatar {
    color: #fff;
    background: linear-gradient(135deg, #c41e3a, #50000b);
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    width: 48px;
    height: 48px;
    font-weight: 600;
    display: flex;
    font-family: var(--font-nb-architekt) !important
}

.author-info {
    text-align: left
}

.author-name {
    color: #333;
    font-weight: 600;
    display: block
}

.author-detail {
    color: #666;
    display: block;
    font-size: var(--fs-lg) !important
}

.result-product-section {
    opacity: 0;
    background: #fff;
    padding: 64px 0;
    transition: opacity .6s, transform .6s;
    transform: translateY(20px)
}

.result-product-section.visible {
    opacity: 1;
    transform: translateY(0)
}

.result-product-content {
    max-width: 1200px;
    margin: 0 auto
}

.result-product-header {
    text-align: center;
    margin-bottom: 48px
}

.result-product-header h2 {
    color: #1a1a1a;
    margin-bottom: 12px;
    font-weight: 500;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-h1-lg) !important
}

.result-product-header p {
    color: #666;
    font-size: var(--fs-h4) !important
}

.result-final-cta {
    background: linear-gradient(135deg, #50000b, #c41e3a);
    margin: 0 -24px -64px;
    padding: 64px 24px
}

@media (min-width:750px) {
    .result-final-cta {
        margin: 0 -32px -80px;
        padding-left: 32px;
        padding-right: 32px
    }
}

@media (min-width:990px) {
    .result-final-cta {
        margin: 0 -48px -96px;
        padding-left: 48px;
        padding-right: 48px
    }
}

.result-final-cta-content {
    text-align: center;
    color: #fff;
    max-width: 600px;
    margin: 0 auto
}

.result-final-cta h2 {
    margin-bottom: 12px;
    font-weight: 500;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-h1-lg) !important
}

.result-final-cta p {
    opacity: .9;
    margin-bottom: 32px;
    font-size: var(--fs-h4) !important
}

.result-cta-button {
    letter-spacing: .05em;
    color: #c41e3a;
    cursor: pointer;
    background: #fff;
    border: none;
    border-radius: 8px;
    padding: 20px 48px;
    transition: all .2s;
    font-family: var(--font-nb-architekt) !important;
    font-size: var(--fs-2xl) !important
}

.result-cta-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px #0003
}

.result-guarantees {
    opacity: .9;
    flex-wrap: wrap;
    justify-content: center;
    gap: 24px;
    margin-top: 24px;
    display: flex;
    font-size: var(--fs-lg) !important
}

.product-purchase-wrapper {
    padding: 32px 0
}

.product-purchase-grid {
    gap: 32px;
    display: grid
}

@media (min-width:990px) {
    .product-purchase-grid {
        grid-template-columns: 1fr 1fr;
        gap: 48px
    }
}

.product-purchase-gallery {
    position: relative
}

.product-purchase-info {
    padding: 16px 0
}

.product-purchase-persona-message {
    background: #c41e3a0d;
    border-left: 3px solid #c41e3a;
    border-radius: 0 8px 8px 0;
    margin-bottom: 24px;
    padding: 16px 20px
}

.product-purchase-persona-message p {
    color: #555;
    font-style: normal;
    font-size: var(--fs-xl) !important
}

.recommendation-plan-header {
    text-align: center;
    margin-bottom: 24px
}

.recommendation-plan-header h4 {
    margin: 8px 0;
    font-weight: 700;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-h2) !important
}

.plan-format {
    color: #666;
    margin: 0;
    font-size: 14.4px !important
}

.recommendation-plan-image {
    text-align: center;
    margin: 24px 0
}

.recommendation-plan-image img {
    border-radius: 8px;
    max-width: 200px;
    height: auto
}

.recommendation-plan-reasons {
    background: #f9f9f7;
    border-radius: 12px;
    margin-top: 24px;
    padding: 24px
}

.recommendation-plan-reasons h5 {
    color: #333;
    margin: 0 0 16px;
    font-weight: 600;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-2xl) !important
}

.plan-checkmarks {
    margin: 0;
    padding: 0;
    list-style: none
}

.plan-checkmarks li {
    color: #444;
    align-items: flex-start;
    gap: 12px;
    padding: 8px 0;
    line-height: 1.4;
    display: flex;
    font-size: 14.4px !important
}

.plan-checkmarks .checkmark {
    color: #22c55e;
    flex-shrink: 0;
    font-weight: 700;
    font-size: var(--fs-2xl) !important
}

@media (min-width:750px) {
    .recommendation-plan-image img {
        max-width: 250px
    }

    .recommendation-plan-reasons {
        padding: 32px
    }

    .plan-checkmarks li {
        font-size: 15.2px !important
    }
}

.os-section {
    background: linear-gradient(#fdf2f0, #fae8e4, #fdf2f0);
    padding: 80px 0 40px
}

.os-section__header {
    text-align: center;
    max-width: 1200px;
    margin-bottom: 48px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 24px
}

.os-badge {
    letter-spacing: .15em;
    color: #a40011;
    background: #a4001112;
    border-radius: 20px;
    margin-bottom: 16px;
    padding: 5px 16px;
    font-weight: 700;
    display: inline-block;
    font-family: var(--font-nb-architekt) !important;
    font-size: var(--fs-sm) !important
}

.os-title {
    color: #50000b;
    letter-spacing: -.02em;
    text-transform: uppercase; 
    margin: 0 0 12px;
    font-family: var(--font-heading-family) !important;
    font-size: var(--fs-h1-lg) !important;
    font-weight: 700 !important;
    line-height: 1 !important
}

.os-subtitle {
    color: black;
    max-width: 540px;
    margin: 0 auto;
    line-height: 1.6;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-lg) !important
}

.os-layout {
    align-items: flex-start;
    gap: 48px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
    display: flex
}

.os-canvas-col {
    flex: 0 0 42%;
    align-self: stretch;
    max-width: 42%;
    position: relative
}

.os-canvas-sticky {
    opacity: 0;
    flex-direction: column;
    align-items: center;
    width: 100%;
    max-width: 320px;
    margin: 0 auto;
    padding: 20px 0;
    transition: opacity .5s;
    display: flex;
    position: sticky;
    top: 20px
}

.os-canvas-sticky--visible {
    opacity: 1
}

.os-canvas {
    will-change: transform;
    width: 100%;
    max-width: 320px;
    height: auto;
    margin: 0 auto;
    transition: all .8s cubic-bezier(.22, 1, .36, 1);
    display: block
}

.os-body-faded {
    opacity: .08;
    transition: opacity 1s cubic-bezier(.22, 1, .36, 1)
}

.os-canvas-wrapper {
    width: 100%;
    max-width: 320px;
    margin: 0 auto;
    transition: transform .8s cubic-bezier(.22, 1, .36, 1);
    display: block
}

@keyframes osEnterSame {
    0% {
        opacity: 0;
        filter: blur(8px);
        transform: scale(.85)
    }

    50% {
        opacity: .7;
        filter: blur(2px);
        transform: scale(.97)
    }

    to {
        opacity: 1;
        filter: blur();
        transform: scale(1)
    }
}

@keyframes osExitSame {
    0% {
        opacity: 1;
        filter: blur();
        transform: scale(1)
    }

    50% {
        opacity: .4;
        filter: blur(4px);
        transform: scale(1.06)
    }

    to {
        opacity: 0;
        filter: blur(10px);
        transform: scale(1.12)
    }
}

@keyframes osEnterZoomIn {
    0% {
        opacity: 0;
        filter: blur(4px);
        transform: scale(.92)
    }

    to {
        opacity: 1;
        filter: blur();
        transform: scale(1)
    }
}

@keyframes osExitZoomIn {
    0% {
        opacity: 1;
        filter: blur();
        transform: scale(1)
    }

    to {
        opacity: 0;
        filter: blur(4px);
        transform: scale(1.08)
    }
}

@keyframes osEnterZoomOut {
    0% {
        opacity: 0;
        filter: blur(4px);
        transform: scale(1.08)
    }

    to {
        opacity: 1;
        filter: blur();
        transform: scale(1)
    }
}

@keyframes osExitZoomOut {
    0% {
        opacity: 1;
        filter: blur();
        transform: scale(1)
    }

    to {
        opacity: 0;
        filter: blur(4px);
        transform: scale(.92)
    }
}

.os-organ-enter {
    transform-origin: 50%
}

.os-organ-exit {
    transform-origin: 50%;
    pointer-events: none
}

.os-enter-same {
    animation: .7s cubic-bezier(.16, 1, .3, 1) forwards osEnterSame
}

.os-exit-same {
    animation: .45s cubic-bezier(.55, 0, 1, .45) forwards osExitSame
}

.os-enter-zoom-in {
    animation: .85s cubic-bezier(.16, 1, .3, 1) forwards osEnterZoomIn
}

.os-exit-zoom-in {
    animation: .5s cubic-bezier(.55, 0, 1, .45) forwards osExitZoomIn
}

.os-enter-zoom-out {
    animation: .85s cubic-bezier(.16, 1, .3, 1) forwards osEnterZoomOut
}

.os-exit-zoom-out {
    animation: .5s cubic-bezier(.55, 0, 1, .45) forwards osExitZoomOut
}

.os-organ-enter:not(.os-enter-same):not(.os-enter-zoom-in):not(.os-enter-zoom-out) {
    animation: .7s cubic-bezier(.16, 1, .3, 1) forwards osEnterSame
}

.os-organ-exit:not(.os-exit-same):not(.os-exit-zoom-in):not(.os-exit-zoom-out) {
    animation: .45s cubic-bezier(.55, 0, 1, .45) forwards osExitSame
}

.os-organ-enter>* {
    animation: .6s cubic-bezier(.22, 1, .36, 1) both osOrganChildEnter
}

.os-organ-enter>:first-child {
    animation-delay: 50ms
}

.os-organ-enter>:nth-child(2) {
    animation-delay: .1s
}

.os-organ-enter>:nth-child(3) {
    animation-delay: .15s
}

.os-organ-enter>:nth-child(4) {
    animation-delay: .2s
}

.os-organ-enter>:nth-child(5) {
    animation-delay: .25s
}

.os-organ-enter>:nth-child(6) {
    animation-delay: .3s
}

@keyframes osOrganChildEnter {
    0% {
        opacity: 0;
        transform: translateY(8px)scale(.9)
    }

    to {
        opacity: 1;
        transform: translateY(0)scale(1)
    }
}

.os-canvas-label {
    background: #a400110f;
    border: 1px solid #a400111a;
    border-radius: 12px;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
    padding: 10px 20px;
    transition: all .4s;
    animation: .5s cubic-bezier(.22, 1, .36, 1) osFadeIn;
    display: flex
}

.os-icon-inline {
    color: currentColor;
    justify-content: center;
    align-items: center;
    line-height: 0;
    display: inline-flex
}

.os-icon-inline svg {
    width: 100%;
    height: 100%
}

.os-canvas-label__num {
    color: #a4001166;
    letter-spacing: .05em;
    font-weight: 700;
    font-family: var(--font-nb-architekt) !important;
    font-size: var(--fs-sm) !important
}

.os-canvas-label__name {
    color: #50000b;
    font-weight: 600;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-lg) !important
}

.os-progress {
    gap: 6px;
    margin-top: 14px;
    display: flex
}

.os-progress__dot {
    background: #a400111f;
    border-radius: 50%;
    width: 8px;
    height: 8px;
    transition: all .3s
}

.os-progress__dot--active {
    background: #a40011;
    transform: scale(1.3)
}

.os-progress__dot--done {
    background: #a4001159
}

.os-cards-col {
    flex-direction: column;
    flex: 1;
    gap: 16px;
    padding-top: 0;
    padding-bottom: 0;
    display: flex
}

.os-mobile-canvas {
    display: none
}

.os-card {
    opacity: 0;
    cursor: pointer;
    background: #fff;
    border: 1.5px solid #7a1a2e0f;
    border-radius: 16px;
    padding: 24px 24px 20px;
    transition: all .35s cubic-bezier(.4, 0, .2, 1);
    position: relative;
    transform: translateY(20px)
}

.os-card--visible {
    opacity: 1;
    transform: translateY(0)
}

.os-card:hover {
    border-color: #a40011;
    box-shadow: 0 4px 16px #7a1a2e1a
}

.os-card--active {
    background: linear-gradient(135deg, #fff, #fdf2f0);
    border-color: #a40011;
    box-shadow: 0 8px 32px #7a1a2e1a
}

.os-card__plus {
    color: #a40011;
    pointer-events: none;
    background: #a400110f;
    border: 1px solid #a400111f;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    width: 28px;
    height: 28px;
    padding: 0;
    transition: all .25s;
    display: flex;
    position: absolute;
    top: 16px;
    right: 16px
}

.os-card:hover .os-card__plus {
    color: #fff;
    background: #a40011;
    border-color: #a40011
}

.os-card__plus--open {
    color: #fff;
    background: #a40011;
    border-color: #a40011;
    transform: rotate(45deg)
}

.os-card__top {
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
    padding-right: 40px;
    display: flex
}

.os-card__icon {
    color: #a40011;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    width: 36px;
    height: 36px;
    display: flex
}

.os-card__icon svg {
    width: 100%;
    height: 100%
}

.os-card__title {
    color: #3a0d14;
    text-transform: uppercase;
    letter-spacing: .02em;
    margin: 0;
    font-weight: 700;
    line-height: 1.3;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-xl) !important
}

.os-card__pills {
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 10px;
    display: flex
}

.os-card__pill {
    color: #a40011;
    letter-spacing: .02em;
    background: #a400110f;
    border: 1px solid #a4001114;
    border-radius: 20px;
    padding: 3px 10px;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-sm) !important
}

.os-card__desc {
    color: #6b5e5e;
    margin: 0;
    line-height: 1.6;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-base) !important
}

.os-card__expandable {
    max-height: 0;
    transition: max-height .6s cubic-bezier(.05, .8, .15, 1);
    overflow: hidden
}

.os-card__expandable--open {
    max-height: 600px;
    padding-bottom: 8px
}

.os-expand {
    border-top: 1px solid #a4001114;
    margin-top: 14px;
    padding-top: 16px
}

.os-expand__section {
    margin-bottom: 16px
}

.os-expand__section:last-child {
    margin-bottom: 0
}

.os-expand__label {
    color: #a40011;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin: 0 0 8px;
    font-weight: 600;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-sm) !important
}

.os-expand__benefits {
    flex-direction: column;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex
}

.os-expand__benefits li {
    color: #3a0d14;
    align-items: flex-start;
    gap: 8px;
    line-height: 1.4;
    display: flex;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-md) !important
}

.os-expand__benefits li svg {
    flex-shrink: 0;
    margin-top: 1px
}

.os-expand__dosages {
    flex-direction: column;
    gap: 4px;
    display: flex
}

.os-expand__dosage-row {
    background: #a4001108;
    border-left: none;
    border-radius: 0;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    display: flex
}

.os-expand__dosage-num {
    color: #a4001159;
    flex-shrink: 0;
    font-weight: 600;
    font-family: var(--font-nb-architekt) !important;
    font-size: var(--fs-xs) !important
}

.os-expand__dosage-text {
    color: #3a0d14;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-md) !important
}

.os-expand__science {
    color: #4a2028;
    background: #a4001108;
    border: none;
    border-top: 1px solid #a400110f;
    border-radius: 0;
    margin: 0;
    padding: 10px 12px;
    line-height: 1.6;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-md) !important
}

.os-section__footer {
    text-align: center;
    color: #a40011;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 40px;
    font-weight: 500;
    display: flex;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-base) !important
}

@keyframes osPulse {

    0%,
    to {
        opacity: 1;
        transform: scale(1)
    }

    25% {
        opacity: .85;
        transform: scale(1.02)
    }

    50% {
        opacity: .65;
        transform: scale(1.05)
    }

    75% {
        opacity: .85;
        transform: scale(1.02)
    }
}

@keyframes osPulseDelayed {

    0%,
    to {
        opacity: .8;
        transform: scale(1)
    }

    30% {
        opacity: .5;
        transform: scale(.96)
    }

    60% {
        opacity: .7;
        transform: scale(1.02)
    }
}

@keyframes osGlowPulse {

    0%,
    to {
        opacity: .5;
        transform: scale(1)
    }

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

@keyframes osHeartbeat {
    0% {
        transform: scale(1)
    }

    8% {
        transform: scale(1.12)
    }

    16% {
        transform: scale(.97)
    }

    24% {
        transform: scale(1.08)
    }

    32% {
        transform: scale(1)
    }

    to {
        transform: scale(1)
    }
}

@keyframes osVeinFlow {
    0% {
        stroke-dashoffset: 24px;
        opacity: .1
    }

    40% {
        stroke-dashoffset: 4px;
        opacity: .5
    }

    60% {
        stroke-dashoffset: -4px;
        opacity: .5
    }

    to {
        stroke-dashoffset: -24px;
        opacity: .1
    }
}

@keyframes osImmuneParticle {
    0% {
        opacity: .15;
        transform: scale(.6)translateY(0)
    }

    25% {
        opacity: .6;
        transform: scale(1.2)translateY(-3px)
    }

    50% {
        opacity: .8;
        transform: scale(1.5)translateY(-1px)
    }

    75% {
        opacity: .5;
        transform: scale(1.1)translateY(2px)
    }

    to {
        opacity: .15;
        transform: scale(.6)translateY(0)
    }
}

@keyframes osNeuron {

    0%,
    to {
        opacity: .2;
        filter: brightness();
        transform: scale(1)
    }

    15% {
        opacity: .95;
        filter: brightness(1.4);
        transform: scale(1.3)
    }

    30% {
        opacity: .4;
        filter: brightness();
        transform: scale(1.05)
    }

    50% {
        opacity: .85;
        filter: brightness(1.3);
        transform: scale(1.25)
    }

    70% {
        opacity: .3;
        filter: brightness();
        transform: scale(1)
    }
}

@keyframes osSynapse {
    0% {
        stroke-dashoffset: 30px;
        opacity: 0
    }

    15% {
        opacity: .8
    }

    50% {
        opacity: .9;
        stroke-dashoffset: 0
    }

    85% {
        opacity: .8
    }

    to {
        stroke-dashoffset: -30px;
        opacity: 0
    }
}

@keyframes osFadeIn {
    0% {
        opacity: 0;
        transform: translateY(8px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

.os-pulse {
    transform-origin: 50%;
    animation: 2.8s cubic-bezier(.4, 0, .6, 1) infinite osPulse
}

.os-pulse-delayed {
    transform-origin: 50%;
    animation: 3.2s cubic-bezier(.4, 0, .6, 1) infinite osPulseDelayed
}

.os-glow-pulse {
    transform-origin: 50%;
    animation: 3s cubic-bezier(.4, 0, .6, 1) infinite osGlowPulse
}

.os-heartbeat {
    transform-origin: 50%;
    animation: 1.1s cubic-bezier(.4, 0, .2, 1) infinite osHeartbeat
}

.os-vein-flow {
    stroke-dasharray: 12 10;
    animation: 2.2s cubic-bezier(.4, 0, .6, 1) infinite osVeinFlow
}

.os-immune-particle {
    transform-origin: 50%;
    animation: 2.5s cubic-bezier(.4, 0, .6, 1) infinite osImmuneParticle
}

.os-neuron {
    transform-origin: 50%;
    animation: 3s cubic-bezier(.4, 0, .6, 1) infinite osNeuron
}

.os-synapse {
    stroke-dasharray: 8 8;
    animation: 2.4s cubic-bezier(.4, 0, .6, 1) infinite osSynapse
}

@keyframes osNeuronFire {

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

    15% {
        opacity: 1;
        transform: scale(1.8)
    }

    30% {
        opacity: .6;
        transform: scale(1.2)
    }

    50% {
        opacity: .9;
        transform: scale(1.5)
    }

    70% {
        opacity: .3;
        transform: scale(.8)
    }
}

.os-neuron-fire {
    transform-origin: 50%;
    animation: 2.8s cubic-bezier(.4, 0, .6, 1) infinite osNeuronFire
}

@media (max-width:1024px) {
    .os-layout {
        gap: 32px
    }

    .os-canvas-col {
        flex: 0 0 38%;
        max-width: 38%
    }

    .os-canvas,
    .os-canvas-wrapper,
    .os-canvas-sticky {
        max-width: 260px
    }
}

.os-mobile-view {
    display: none
}

@media (max-width:768px) {
    .os-section {
        padding: 48px 0 40px
    }

    .os-section__header {
        margin-bottom: 0
    }

    .os-title {
        font-size: var(--fs-h2) !important
    }

    .os-subtitle {
        font-size: var(--fs-md) !important
    }

    .os-layout {
        display: none
    }

    .os-mobile-view {
        padding: 0 16px;
        display: block
    }

    .os-mobile-icons-wrap {
        z-index: 2;
        margin: 0 -16px;
        padding: 0 0 12px;
        position: relative
    }

    .os-mobile-icons {
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        gap: 6px;
        padding: 4px 16px;
        display: flex;
        overflow-x: auto
    }

    .os-mobile-icons::-webkit-scrollbar {
        display: none
    }

    .os-mobile-icon-btn {
        cursor: pointer;
        background: #fff;
        border: 1.5px solid #a4001114;
        border-radius: 14px;
        flex-direction: column;
        flex-shrink: 0;
        align-items: center;
        gap: 6px;
        width: 72px;
        min-width: 72px;
        padding: 10px 4px 8px;
        transition: all .25s;
        display: flex
    }

    .os-mobile-icon-btn--active {
        background: linear-gradient(135deg, #fff, #fdf2f0);
        border-color: #a40011;
        box-shadow: 0 4px 12px #a400111f
    }

    .os-mobile-icon-svg {
        color: #a4001159;
        width: 28px;
        height: 28px;
        transition: color .25s
    }

    .os-mobile-icon-btn--active .os-mobile-icon-svg {
        color: #a40011
    }

    .os-mobile-icon-label {
        color: #50000b73;
        text-transform: uppercase;
        letter-spacing: .04em;
        white-space: nowrap;
        font-weight: 600;
        transition: color .25s;
        font-family: var(--font-body-family) !important;
        font-size: var(--fs-badge) !important
    }

    .os-mobile-icon-btn--active .os-mobile-icon-label {
        color: #50000b
    }

    .os-mobile-icons-fade {
        pointer-events: none;
        z-index: 2;
        width: 24px;
        position: absolute;
        top: 0;
        bottom: 16px;
        display: block !important
    }

    .os-mobile-icons-fade--left {
        background: linear-gradient(90deg, #fcf8f6, #0000);
        left: 0
    }

    .os-mobile-icons-fade--right {
        background: linear-gradient(-90deg, #fcf8f6, #0000);
        right: 0
    }

    .os-mobile-anim {
        z-index: 0;
        opacity: 1;
        pointer-events: none;
        justify-content: center;
        margin-bottom: -24px;
        padding: 0;
        display: flex;
        position: relative;
        -webkit-mask-image: linear-gradient(#000 0% 85%, #0000 100%);
        mask-image: linear-gradient(#000 0% 85%, #0000)
    }

    .os-mobile-anim .os-canvas-wrapper {
        width: 200px;
        height: 200px
    }

    .os-mobile-anim .os-canvas {
        max-width: 200px
    }

    .os-mobile-detail {
        z-index: 2;
        background: #fff;
        border: 1.5px solid #a400111a;
        border-radius: 16px;
        padding: 20px;
        animation: .35s osFadeIn;
        position: relative
    }

    .os-mobile-detail__header {
        align-items: center;
        gap: 12px;
        margin-bottom: 12px;
        display: flex
    }

    .os-mobile-detail__icon {
        color: #a40011;
        flex-shrink: 0;
        width: 32px;
        height: 32px
    }

    .os-mobile-detail__num {
        color: #a4001159;
        letter-spacing: .05em;
        font-weight: 700;
        display: block;
        font-family: var(--font-nb-architekt) !important;
        font-size: var(--fs-badge) !important
    }

    .os-mobile-detail__title {
        color: #3a0d14;
        text-transform: uppercase;
        letter-spacing: .02em;
        margin: 0;
        font-weight: 700;
        font-family: var(--font-body-family) !important;
        font-size: var(--fs-lg) !important
    }

    .os-mobile-detail .os-card__pills {
        gap: 4px;
        margin-bottom: 8px
    }

    .os-mobile-detail .os-card__pill {
        padding: 2px 8px;
        font-size: var(--fs-xs) !important
    }

    .os-mobile-detail .os-card__desc {
        line-height: 1.5;
        font-size: var(--fs-md) !important
    }

    .os-mobile-detail__expand-btn {
        cursor: pointer;
        color: #a40011;
        background: 0 0;
        border: none;
        align-items: center;
        gap: 6px;
        margin-top: 12px;
        padding: 0;
        font-weight: 600;
        transition: opacity .2s;
        display: flex;
        font-family: var(--font-body-family) !important;
        font-size: var(--fs-md) !important
    }

    .os-mobile-detail__expand-btn:hover {
        opacity: .75
    }

    .os-mobile-detail__expand-btn svg {
        transition: transform .3s
    }

    .os-mobile-detail__expand-btn--open svg {
        transform: rotate(180deg)
    }

    .os-mobile-detail .os-card__expandable {
        max-height: 0;
        transition: max-height .6s cubic-bezier(.05, .8, .15, 1);
        overflow: hidden
    }

    .os-mobile-detail .os-card__expandable--open {
        max-height: 600px;
        padding-bottom: 12px
    }

    .os-expand__benefits li,
    .os-expand__dosage-text,
    .os-expand__science {
        font-size: var(--fs-sm) !important
    }

    .os-expand__label {
        font-size: var(--fs-badge) !important
    }

    .os-expand__dosage-row {
        padding: 6px 8px
    }

    .os-section__footer {
        margin-top: 24px;
        font-size: var(--fs-md) !important
    }
}

.ct-toggle-bar {
    justify-content: center;
    align-items: center;
    padding: 0 0 24px;
    display: flex
}

.ct-pill-toggle {
    background: #a400110d;
    border: 1px solid #a400111a;
    border-radius: 100px;
    gap: 0;
    padding: 4px;
    display: inline-flex;
    position: relative
}

.ct-pill-slider {
    z-index: 1;
    pointer-events: none;
    background: #a40011;
    border-radius: 100px;
    height: calc(100% - 8px);
    position: absolute;
    top: 4px;
    box-shadow: 0 2px 8px #a4001140;
    display: block !important
}

.ct-pill-btn {
    z-index: 2;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #50000b;
    cursor: pointer;
    white-space: nowrap;
    -webkit-user-select: none;
    user-select: none;
    background: 0 0;
    border: none;
    border-radius: 100px;
    justify-content: center;
    align-items: center;
    gap: 5px;
    padding: 10px 24px;
    font-weight: 700;
    transition: color .35s cubic-bezier(.22, 1, .36, 1);
    display: inline-flex;
    position: relative;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-sm) !important
}

.ct-pill-btn:hover {
    color: #a40011
}

.ct-pill-btn--active,
.ct-pill-btn--active:hover {
    color: #fff
}

.ct-td-val--muted {
    color: #888;
    letter-spacing: 0;
    font-weight: 400;
    line-height: 1.4;
    display: block;
    font-size: 12.5px !important
}

.ct-tbody--morphing {
    opacity: 0;
    transition: opacity .2s, transform .2s;
    transform: translateY(6px)
}

.ct-tbody {
    opacity: 1;
    transition: opacity .3s, transform .3s;
    transform: translateY(0)
}

@keyframes ctRowEnter {
    0% {
        opacity: 0;
        transform: translateY(8px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

.ct-tbody:not(.ct-tbody--morphing) .ct-row {
    animation: .35s both ctRowEnter
}

.ct-row--highlight {
    background: #a4001108
}

.ct-row--highlight:hover {
    background: #a400110f
}

.ct-section {
    background: #faf6f4;
    padding: 80px 0
}

.ct-container {
    max-width: 860px;
    margin: 0 auto;
    padding: 0 20px
}

.ct-header {
    text-align: center;
    margin-bottom: 40px
}

.ct-badge {
    letter-spacing: .15em;
    color: #a40011;
    background: #a4001112;
    border-radius: 20px;
    margin-bottom: 16px;
    padding: 5px 16px;
    font-weight: 700;
    display: inline-block;
    font-family: var(--font-nb-architekt) !important;
    font-size: var(--fs-sm) !important
}

.ct-title {
    color: #50000b;
    letter-spacing: -.02em;
    text-transform: uppercase;
    margin: 0 0 12px;
    font-family: var(--font-heading-family) !important;
    font-size: var(--fs-h1-lg) !important;
    font-weight: 700 !important
}

.ct-subtitle {
    color: #6b5e5e;
    max-width: 540px;
    margin: 0 auto;
    line-height: 1.6;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-lg) !important
}

.ct-table-wrap {
    background: #fff;
    border: 1px solid #a4001114;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 2px 20px #50000b0a
}

.ct-thead {
    background: #a4001105;
    border-bottom: 2px solid #a4001114;
    grid-template-columns: 1.2fr 1fr 1fr;
    display: grid
}

.ct-th {
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    padding: 20px 16px;
    display: flex
}

.ct-th--feat {
    display: flex !important
}

.ct-th--goli {
    background: #a4001108;
    border-left: 1px solid #a400110f
}

.ct-th--comp {
    border-left: 1px solid #a400110f
}

.ct-th-img {
    object-fit: contain;
    width: auto;
    height: 56px
}

.ct-th-img--comp {
    opacity: .7;
    height: 44px
}

.ct-th-label {
    letter-spacing: .08em;
    color: #50000b;
    text-transform: uppercase;
    text-align: center;
    font-weight: 700;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-sm) !important
}

.ct-th-label--comp {
    color: #6b6b6b
}

.ct-row {
    border-bottom: 1px solid #a400110d;
    grid-template-columns: 1.2fr 1fr 1fr;
    transition: background .15s;
    display: grid
}

.ct-row:last-child {
    border-bottom: none
}

.ct-row--alt {
    background: #a4001104
}

.ct-row:hover {
    background: #a400110a
}

.ct-td {
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    line-height: 1.4;
    display: flex;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-base) !important
}

.ct-td--feat {
    color: #50000b;
    font-weight: 600;
    font-size: 12.5px !important
}

.ct-td--goli {
    background: #a4001104;
    border-left: 1px solid #a400110f
}

.ct-td--comp {
    color: #555;
    border-left: 1px solid #a400110f
}

.ct-td--miss {
    color: #999
}

.ct-td-info {
    flex-direction: column;
    gap: 1px;
    display: flex
}

.ct-td-val {
    color: #333;
    font-weight: 500;
    font-size: 12.5px !important
}

.ct-td--goli .ct-td-val {
    color: #50000b;
    font-weight: 600
}

.ct-td-sub {
    color: #8b7070;
    font-size: 10.5px !important
}

.ct-td-adv {
    color: #a40011;
    background: #a4001112;
    border-radius: 8px;
    width: fit-content;
    margin-top: 2px;
    padding: 1px 6px;
    font-weight: 700;
    display: inline-block;
    font-size: var(--fs-xs) !important
}

.ct-td-adv.ct-td-adv--hero {
    color: #a40011;
    letter-spacing: -.01em;
    white-space: nowrap;
    background: 0 0;
    border-radius: 0;
    width: auto;
    margin-top: 0;
    margin-bottom: 2px;
    padding: 0;
    font-weight: 800;
    line-height: 1.1;
    display: block;
    font-family: var(--font-nb-architekt) !important;
    font-size: 20px !important
}

.ct-td--miss .ct-td-val {
    color: #999;
    font-weight: 400
}

.ct-toggle {
    cursor: pointer;
    color: #a40011;
    letter-spacing: .04em;
    background: 0 0;
    border: none;
    border-top: 1px solid #a400110f;
    justify-content: center;
    align-items: center;
    gap: 6px;
    width: 100%;
    padding: 14px;
    font-weight: 600;
    transition: background .2s;
    display: flex;
    font-family: var(--font-nb-architekt) !important;
    font-size: var(--fs-md) !important
}

.ct-toggle:hover {
    background: #a4001108
}

.ct-footer {
    text-align: center;
    color: #6b5e5e;
    margin-top: 24px;
    line-height: 1.5;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-base) !important
}

.ct-footer strong {
    color: #50000b
}

@media (max-width:768px) {
    .ct-section {
        padding: 48px 0
    }

    .ct-title {
        font-size: var(--fs-h2) !important
    }

    .ct-subtitle {
        font-size: var(--fs-base) !important
    }

    .ct-thead,
    .ct-row {
        grid-template-columns: 1fr 1fr 1fr
    }

    .ct-th {
        padding: 14px 8px
    }

    .ct-th-img {
        height: 40px
    }

    .ct-th-img--comp {
        height: 32px
    }

    .ct-th-label {
        font-size: var(--fs-badge) !important
    }

    .ct-td {
        gap: 5px;
        padding: 10px 8px;
        font-size: var(--fs-sm) !important
    }

    .ct-td--feat {
        font-size: 10.5px !important
    }

    .ct-td-val {
        font-size: var(--fs-sm) !important
    }

    .ct-td-sub {
        font-size: var(--fs-badge) !important
    }

    .ct-td-adv {
        padding: 1px 4px;
        font-size: var(--fs-badge) !important
    }

    .ct-td svg {
        flex-shrink: 0;
        width: 14px;
        height: 14px
    }

    .ct-toggle-bar {
        padding: 0 0 14px
    }

    .ct-pill-btn {
        padding: 7px 14px;
        font-size: var(--fs-xs) !important
    }

    .ct-td-adv.ct-td-adv--hero {
        font-size: var(--fs-2xl) !important
    }

    .ct-td-val--muted {
        font-size: var(--fs-sm) !important
    }
}

@media (max-width:375px) {

    .ct-td--goli>svg,
    .ct-td--comp>svg {
        display: none
    }

    .ct-td {
        gap: 3px
    }
}

.ct-see-all {
    cursor: pointer;
    color: #a40011;
    letter-spacing: .02em;
    background: 0 0;
    border: none;
    justify-content: center;
    align-items: center;
    gap: 6px;
    width: 100%;
    margin-top: 8px;
    padding: 16px;
    font-weight: 600;
    transition: color .2s, gap .2s;
    display: flex;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-base) !important
}

.ct-see-all:hover {
    color: #50000b;
    gap: 10px
}

.ct-see-all svg {
    transition: transform .2s
}

.ct-see-all:hover svg {
    transform: translate(2px)
}

.ct-modal-overlay {
    z-index: 9999;
    -webkit-backdrop-filter: blur(6px);
    background: #1e0a0c99;
    justify-content: center;
    align-items: center;
    padding: 24px;
    animation: .25s ctModalFadeIn;
    display: flex;
    position: fixed;
    inset: 0
}

@keyframes ctModalFadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.ct-modal {
    background: #faf6f4;
    border-radius: 20px;
    flex-direction: column;
    width: 100%;
    max-width: 900px;
    max-height: calc(100vh - 48px);
    animation: .3s cubic-bezier(.22, 1, .36, 1) ctModalSlideUp;
    display: flex;
    overflow: hidden;
    box-shadow: 0 24px 80px #50000b33, 0 0 0 1px #a4001114
}

@keyframes ctModalSlideUp {
    0% {
        opacity: 0;
        transform: translateY(24px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

.ct-modal-header {
    border-bottom: 1px solid #a4001114;
    flex-shrink: 0;
    justify-content: space-between;
    align-items: flex-start;
    padding: 28px 28px 20px;
    display: flex
}

.ct-modal-title {
    color: #50000b;
    letter-spacing: -.01em;
    text-transform: uppercase;
    margin: 0 0 4px;
    font-family: var(--font-heading-family) !important;
    font-size: var(--fs-h3) !important;
    font-weight: 700 !important
}

.ct-modal-subtitle {
    color: #8b7e7e;
    margin: 0;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-base) !important
}

.ct-modal-close {
    color: #50000b;
    cursor: pointer;
    background: #a400110a;
    border: 1px solid #a400111a;
    border-radius: 50%;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    width: 36px;
    height: 36px;
    margin-left: 16px;
    transition: background .2s, border-color .2s;
    display: flex
}

.ct-modal-close:hover {
    background: #a400111a;
    border-color: #a4001133
}

.ct-modal-body {
    flex: 1;
    min-height: 0;
    overflow-y: auto
}

.ct-modal-thead {
    z-index: 2;
    background: #fff;
    border-bottom: 2px solid #a4001114;
    grid-template-columns: 1.3fr 1fr 1fr;
    display: grid;
    position: sticky;
    top: 0
}

.ct-modal-th {
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #50000b;
    padding: 14px 16px;
    font-weight: 700;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-sm) !important
}

.ct-modal-th--goli {
    background: #a4001108;
    border-left: 1px solid #a400110f
}

.ct-modal-th--comp {
    color: #6b6b6b;
    border-left: 1px solid #a400110f
}

.ct-modal-row {
    border-bottom: 1px solid #a400110a;
    grid-template-columns: 1.3fr 1fr 1fr;
    transition: background .15s;
    display: grid
}

.ct-modal-row:last-child {
    border-bottom: none
}

.ct-modal-row--alt {
    background: #a4001104
}

.ct-modal-row--advantage {
    background: #a400110a
}

.ct-modal-row:hover {
    background: #a400110d
}

.ct-modal-td {
    align-items: flex-start;
    gap: 8px;
    padding: 12px 16px;
    line-height: 1.4;
    display: flex;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-base) !important
}

.ct-modal-td--feat {
    color: #50000b;
    font-weight: 600;
    font-size: 12.5px !important
}

.ct-modal-td--goli,
.ct-modal-td--comp {
    border-left: 1px solid #a400110f
}

.ct-modal-td--miss .ct-modal-td-val {
    color: #999;
    font-weight: 400
}

.ct-modal-td-info {
    flex-direction: column;
    gap: 2px;
    display: flex
}

.ct-modal-td-val {
    color: #333;
    font-weight: 500;
    line-height: 1.3;
    font-size: 12.5px !important
}

.ct-modal-td-sub {
    color: #8b7e7e;
    font-weight: 400;
    font-size: 10.5px !important
}

.ct-modal-td svg {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    margin-top: 1px
}

.ct-modal-footer {
    text-align: center;
    border-top: 1px solid #a4001114;
    flex-shrink: 0;
    padding: 16px 28px
}

.ct-modal-footer p {
    color: #6b5e5e;
    margin: 0;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-md) !important
}

.ct-modal-footer strong {
    color: #50000b
}

@media (max-width:768px) {
    .ct-modal-overlay {
        align-items: flex-end;
        padding: 0
    }

    .ct-modal {
        border-radius: 20px 20px 0 0;
        max-height: 92vh
    }

    .ct-modal-header {
        padding: 20px 20px 16px
    }

    .ct-modal-title {
        font-size: var(--fs-h4) !important
    }

    .ct-modal-thead,
    .ct-modal-row {
        grid-template-columns: 1fr 1fr 1fr
    }

    .ct-modal-th {
        padding: 10px;
        font-size: var(--fs-badge) !important
    }

    .ct-modal-td {
        gap: 5px;
        padding: 10px 8px;
        font-size: var(--fs-sm) !important
    }

    .ct-modal-td--feat {
        font-size: 10.5px !important
    }

    .ct-modal-td-val {
        font-size: var(--fs-sm) !important
    }

    .ct-modal-td-sub {
        font-size: var(--fs-badge) !important
    }

    .ct-modal-td svg {
        width: 14px;
        height: 14px
    }

    .ct-modal-footer {
        padding: 12px 20px
    }
}

@media (max-width:375px) {

    .ct-modal-td--goli>svg,
    .ct-modal-td--comp>svg {
        display: none
    }
}

.ollie-banner {
    will-change: height, opacity;
    background: linear-gradient(135deg, #c9a84c, #dfce89 40%, #e8d5a0, #c9a84c) 0 0/200% 200%;
    animation: 6s ease-in-out infinite bannerShimmer;
    position: relative
}

@keyframes bannerShimmer {

    0%,
    to {
        background-position: 0%
    }

    50% {
        background-position: 100%
    }
}

.ollie-banner__inner {
    justify-content: flex-start;
    align-items: center;
    gap: 24px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 24px 48px;
    display: flex;
    position: relative
}

.ollie-banner__image {
    clip-path: inset(0 0 100%);
    border-radius: 14px;
    flex-shrink: 0;
    width: 280px;
    height: 280px;
    transition: clip-path .7s cubic-bezier(.22, 1, .36, 1);
    overflow: hidden
}

.ollie-banner__image--revealed {
    clip-path: inset(0 0 0%)
}

.ollie-banner__image img {
    object-fit: cover;
    object-position: center center;
    width: 100%;
    height: 100%;
    display: block
}

.ollie-banner__content {
    text-align: left;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    display: flex
}

.ollie-banner__tag {
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--goli-burgundy);
    background: #50000b14;
    border-radius: 2px;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    font-weight: 700;
    display: inline-flex;
    font-family: var(--font-nb-architekt) !important;
    font-size: var(--fs-sm) !important
}

.ollie-banner__tag-dot {
    background: #a40011;
    border-radius: 50%;
    width: 6px;
    height: 6px;
    animation: 1.5s ease-in-out infinite tagPulse
}

@keyframes tagPulse {

    0%,
    to {
        opacity: 1;
        transform: scale(1)
    }

    50% {
        opacity: .5;
        transform: scale(.8)
    }
}

.ollie-banner__headline {
    color: var(--goli-burgundy);
    max-width: 600px;
    margin: 0;
    font-weight: 400;
    line-height: 1.3;
    font-family: var(--font-heading-family) !important;
    font-size: var(--fs-h3) !important
}

.ollie-banner__headline strong {
    font-weight: 600
}

.ollie-banner__subtext {
    color: #50000bb3;
    max-width: 480px;
    margin: 0;
    font-weight: 400;
    line-height: 1.5;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-base) !important
}

.ollie-banner__cta {
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #fff;
    background: var(--goli-burgundy);
    border-radius: 999px;
    align-items: center;
    gap: 2px;
    margin-top: 4px;
    padding: 10px 24px;
    font-weight: 700;
    text-decoration: none;
    transition: background-color .2s, transform .15s;
    display: inline-flex;
    font-family: var(--font-nb-architekt) !important;
    font-size: var(--fs-sm) !important
}

.ollie-banner__cta:hover {
    background: #3a0008;
    transform: translateY(-1px)
}

.ollie-banner__cta:active {
    transform: translateY(0)
}

@media (max-width:749px) {
    .ollie-banner__inner {
        gap: 16px;
        padding: 20px 24px
    }

    .ollie-banner__image {
        border-radius: 10px;
        width: 90px;
        height: 194px
    }

    .ollie-banner__image img {
        object-position: 40% center
    }

    .ollie-banner__headline {
        font-size: var(--fs-h5) !important
    }

    .ollie-banner__subtext {
        font-size: var(--fs-md) !important
    }

    .ollie-banner__cta {
        padding: 8px 18px;
        font-size: var(--fs-xs) !important
    }
}

.r16-section {
    background: #faf6f4;
    padding: 64px 24px 0
}

.r16-container {
    opacity: 0;
    background: #50000b;
    border-radius: 24px;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    max-width: 1100px;
    margin: 0 auto;
    transition: opacity .8s cubic-bezier(.22, 1, .36, 1), transform .8s cubic-bezier(.22, 1, .36, 1);
    display: grid;
    overflow: hidden;
    transform: translateY(30px)
}

.r16-container--visible {
    opacity: 1;
    transform: translateY(0)
}

.r16-left {
    flex-direction: column;
    gap: 20px;
    padding: 40px 40px 32px;
    display: flex;
    position: relative
}

.r16-headline {
    flex-direction: column;
    gap: 20px;
    display: flex
}

.r16-title {
    color: #fff;
    letter-spacing: -.02em;
    text-transform: uppercase;
    margin: 0;
    line-height: 1.15;
    font-family: var(--font-heading-family) !important;
    font-size: var(--fs-h1-lg) !important;
    font-weight: 400 !important
}

.r16-title-accent {
    color: #fff9
}

.r16-cta {
    color: #50000b;
    letter-spacing: .08em;
    text-transform: uppercase;
    cursor: pointer;
    background: #fff;
    border: none;
    border-radius: 999px;
    justify-content: center;
    align-items: center;
    width: fit-content;
    padding: 14px 36px;
    font-weight: 600;
    text-decoration: none;
    transition: all .25s;
    display: inline-flex;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-lg) !important
}

.r16-cta:hover {
    background: #ffffffe6;
    transform: translateY(-1px);
    box-shadow: 0 4px 16px #0003
}

.r16-product-wrap {
    opacity: 0;
    flex-direction: column;
    align-items: center;
    transition: opacity .7s cubic-bezier(.22, 1, .36, 1) .3s, transform .7s cubic-bezier(.22, 1, .36, 1) .3s;
    display: flex;
    position: relative;
    transform: translateY(16px)
}

.r16-product-wrap--visible {
    opacity: 1;
    transform: translateY(0)
}

.r16-savings {
    text-align: center;
    z-index: 2;
    opacity: 0;
    background: linear-gradient(135deg, #b8942e, #dfce89 40%, #c9a84c, #b8942e) 0 0/200% 200%;
    border-radius: 50%;
    flex-direction: column;
    justify-content: center;
    align-self: flex-end;
    align-items: center;
    gap: 3px;
    width: 180px;
    height: 180px;
    margin-bottom: -50px;
    margin-right: -10px;
    transition: opacity .6s cubic-bezier(.22, 1, .36, 1) .5s, transform .6s cubic-bezier(.22, 1, .36, 1) .5s;
    animation: 5s ease-in-out infinite r16SavingsShimmer;
    display: flex;
    position: relative;
    transform: scale(.8);
    box-shadow: 0 6px 24px #a4821e59
}

@keyframes r16SavingsShimmer {

    0%,
    to {
        background-position: 0%
    }

    50% {
        background-position: 100%
    }
}

.r16-savings--visible {
    opacity: 1;
    transform: scale(1)
}

.r16-savings__label {
    letter-spacing: .15em;
    text-transform: uppercase;
    color: #50000b;
    font-weight: 700;
    font-family: var(--font-nb-architekt) !important;
    font-size: var(--fs-badge) !important
}

.r16-savings__amount {
    color: #50000b;
    font-weight: 700;
    line-height: 1.1;
    font-family: Gilroy, sans-serif !important;
    font-size: var(--fs-h1) !important
}

.r16-savings__per {
    color: #50000b;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-lg) !important
}

.r16-savings__note {
    color: #50000b8c;
    margin-top: 2px;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-sm) !important
}

.r16-product__img {
    filter: drop-shadow(0 8px 24px #0000004d);
    z-index: 1;
    width: 100%;
    max-width: 200px;
    height: auto;
    position: relative
}

.r16-right {
    background: #ffffff0a;
    flex-direction: column;
    gap: 12px;
    padding: 40px 40px 36px;
    display: flex
}

.r16-breakdown-title {
    color: #fff;
    letter-spacing: -.02em;
    text-transform: uppercase;
    margin: 0 0 4px;
    font-family: var(--font-heading-family) !important;
    font-size: 20px !important;
    font-weight: 600 !important
}

.r16-items {
    flex-direction: column;
    gap: 0;
    display: flex
}

.r16-item {
    opacity: 0;
    border-bottom: 1px solid #ffffff14;
    align-items: center;
    gap: 12px;
    padding: 8px 0;
    transition: opacity .4s, transform .4s;
    display: flex;
    transform: translate(20px)
}

.r16-item--visible {
    opacity: 1;
    transform: translate(0)
}

.r16-item__dot {
    background: #a40011;
    border-radius: 50%;
    flex-shrink: 0;
    width: 6px;
    height: 6px;
    display: block !important
}

.r16-item__name {
    color: #ffffffd9;
    flex: 1;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-lg) !important
}

.r16-item__price {
    color: #ffffff73;
    flex-shrink: 0;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-lg) !important
}

.r16-item__price s {
    text-decoration: line-through
}

.r16-totals {
    opacity: 0;
    border: 1px solid #ffffff1f;
    border-radius: 12px;
    flex-direction: column;
    gap: 0;
    margin-top: 8px;
    transition: opacity .5s .6s, transform .5s .6s;
    display: flex;
    overflow: hidden;
    transform: translateY(12px)
}

.r16-totals--visible {
    opacity: 1;
    transform: translateY(0)
}

.r16-total-row {
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    display: flex;
    font-family: var(--font-body-family) !important;
    font-size: var(--fs-base) !important
}

.r16-total-row--old {
    color: #fff9;
    background: #ffffff0f
}

.r16-total-row--old .r16-total-row__price s {
    text-decoration: line-through
}

.r16-total-row--goli {
    color: #fff;
    background: #ffffff1f;
    font-weight: 600
}

.r16-total-row__price {
    font-weight: 600
}

@media (max-width:768px) {
    .r16-section {
        padding: 40px 16px 0
    }

    .r16-container {
        border-radius: 20px;
        grid-template-columns: 1fr
    }

    .r16-left {
        text-align: center;
        align-items: center;
        padding: 32px 24px 20px
    }

    .r16-title {
        font-size: var(--fs-h2) !important
    }

    .r16-headline {
        align-items: center
    }

    .r16-product-wrap {
        flex-direction: row;
        justify-content: center;
        align-items: flex-start;
        gap: 0
    }

    .r16-savings {
        aspect-ratio: 1;
        z-index: 2;
        order: 2;
        align-self: flex-start;
        width: auto;
        min-width: 170px;
        height: auto;
        min-height: 170px;
        margin-bottom: 0;
        margin-left: -20px;
        margin-right: -50px;
        padding: 16px 12px
    }

    .r16-savings__amount {
        word-break: break-word;
        overflow-wrap: break-word;
        text-align: center;
        max-width: 160px;
        line-height: 1.15;
        font-size: var(--fs-h5) !important
    }

    .r16-savings__per {
        font-size: var(--fs-sm) !important
    }

    .r16-savings__label {
        letter-spacing: .1em;
        font-size: 7px !important
    }

    .r16-savings__note {
        font-size: var(--fs-badge) !important
    }

    .r16-product__img {
        order: 1;
        max-width: 120px
    }

    .r16-right {
        padding: 24px 20px 28px
    }

    .r16-breakdown-title {
        font-size: var(--fs-2xl) !important
    }

    .r16-item__name {
        font-size: var(--fs-md) !important
    }

    .r16-item {
        padding: 6px 0
    }

    .r16-total-row {
        padding: 10px 14px;
        font-size: var(--fs-md) !important
    }
}

body:not([data-pricing-ready])>#root {
    opacity: 0
}

body[data-pricing-ready]>#root {
    opacity: 1;
    transition: opacity .25s ease-out
}

body[data-pricing-loading] .essentials-plan-card__price,
body[data-pricing-loading] .essentials-plan-card__price-compare,
body[data-pricing-loading] [data-price-text] {
    background: linear-gradient(90deg, #e0e0e0 25%, #f0f0f0, #e0e0e0 75%) 0 0/200% 100%;
    border-radius: 4px;
    min-width: 3em;
    animation: 1.5s ease-in-out infinite price-shimmer;
    display: inline-block;
    color: #0000 !important
}

@keyframes price-shimmer {
    0% {
        background-position: 200% 0
    }

    to {
        background-position: -200% 0
    }
}

.essentials-plan-card__price,
.essentials-plan-card__price-compare,
[data-price-text] {
    transition: color .3s, background .3s
}

body[data-pricing-loading] .dark .essentials-plan-card__price,
body[data-pricing-loading] .dark .essentials-plan-card__price-compare,
body[data-pricing-loading] .dark [data-price-text] {
    background: linear-gradient(90deg, #333 25%, #444, #333 75%) 0 0/200% 100%;
    animation: 1.5s ease-in-out infinite price-shimmer
}

@property --tw-translate-x {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-translate-y {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-translate-z {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-rotate-x {
    syntax: "*";
    inherits: false
}

@property --tw-rotate-y {
    syntax: "*";
    inherits: false
}

@property --tw-rotate-z {
    syntax: "*";
    inherits: false
}

@property --tw-skew-x {
    syntax: "*";
    inherits: false
}

@property --tw-skew-y {
    syntax: "*";
    inherits: false
}

@property --tw-space-y-reverse {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-space-x-reverse {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-divide-y-reverse {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-border-style {
    syntax: "*";
    inherits: false;
    initial-value: solid
}

@property --tw-gradient-position {
    syntax: "*";
    inherits: false
}

@property --tw-gradient-from {
    syntax: "<color>";
    inherits: false;
    initial-value: #0000
}

@property --tw-gradient-via {
    syntax: "<color>";
    inherits: false;
    initial-value: #0000
}

@property --tw-gradient-to {
    syntax: "<color>";
    inherits: false;
    initial-value: #0000
}

@property --tw-gradient-stops {
    syntax: "*";
    inherits: false
}

@property --tw-gradient-via-stops {
    syntax: "*";
    inherits: false
}

@property --tw-gradient-from-position {
    syntax: "<length-percentage>";
    inherits: false;
    initial-value: 0%
}

@property --tw-gradient-via-position {
    syntax: "<length-percentage>";
    inherits: false;
    initial-value: 50%
}

@property --tw-gradient-to-position {
    syntax: "<length-percentage>";
    inherits: false;
    initial-value: 100%
}

@property --tw-leading {
    syntax: "*";
    inherits: false
}

@property --tw-font-weight {
    syntax: "*";
    inherits: false
}

@property --tw-tracking {
    syntax: "*";
    inherits: false
}

@property --tw-ordinal {
    syntax: "*";
    inherits: false
}

@property --tw-slashed-zero {
    syntax: "*";
    inherits: false
}

@property --tw-numeric-figure {
    syntax: "*";
    inherits: false
}

@property --tw-numeric-spacing {
    syntax: "*";
    inherits: false
}

@property --tw-numeric-fraction {
    syntax: "*";
    inherits: false
}

@property --tw-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-shadow-color {
    syntax: "*";
    inherits: false
}

@property --tw-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%
}

@property --tw-inset-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-inset-shadow-color {
    syntax: "*";
    inherits: false
}

@property --tw-inset-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%
}

@property --tw-ring-color {
    syntax: "*";
    inherits: false
}

@property --tw-ring-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-inset-ring-color {
    syntax: "*";
    inherits: false
}

@property --tw-inset-ring-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-ring-inset {
    syntax: "*";
    inherits: false
}

@property --tw-ring-offset-width {
    syntax: "<length>";
    inherits: false;
    initial-value: 0
}

@property --tw-ring-offset-color {
    syntax: "*";
    inherits: false;
    initial-value: #fff
}

@property --tw-ring-offset-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000
}

@property --tw-outline-style {
    syntax: "*";
    inherits: false;
    initial-value: solid
}

@property --tw-blur {
    syntax: "*";
    inherits: false
}

@property --tw-brightness {
    syntax: "*";
    inherits: false
}

@property --tw-contrast {
    syntax: "*";
    inherits: false
}

@property --tw-grayscale {
    syntax: "*";
    inherits: false
}

@property --tw-hue-rotate {
    syntax: "*";
    inherits: false
}

@property --tw-invert {
    syntax: "*";
    inherits: false
}

@property --tw-opacity {
    syntax: "*";
    inherits: false
}

@property --tw-saturate {
    syntax: "*";
    inherits: false
}

@property --tw-sepia {
    syntax: "*";
    inherits: false
}

@property --tw-drop-shadow {
    syntax: "*";
    inherits: false
}

@property --tw-drop-shadow-color {
    syntax: "*";
    inherits: false
}

@property --tw-drop-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%
}

@property --tw-drop-shadow-size {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-blur {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-brightness {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-contrast {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-grayscale {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-hue-rotate {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-invert {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-opacity {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-saturate {
    syntax: "*";
    inherits: false
}

@property --tw-backdrop-sepia {
    syntax: "*";
    inherits: false
}

@property --tw-duration {
    syntax: "*";
    inherits: false
}

@property --tw-ease {
    syntax: "*";
    inherits: false
}

@property --tw-content {
    syntax: "*";
    inherits: false;
    initial-value: ""
}

@keyframes spin {
    to {
        transform: rotate(360deg)
    }
}

@keyframes pulse {
    50% {
        opacity: .5
    }
}

@keyframes enter {
    0% {
        opacity: var(--tw-enter-opacity, 1);
        transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0)scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1))rotate(var(--tw-enter-rotate, 0));
        filter: blur(var(--tw-enter-blur, 0))
    }
}

@keyframes exit {
    to {
        opacity: var(--tw-exit-opacity, 1);
        transform: translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0)scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1))rotate(var(--tw-exit-rotate, 0));
        filter: blur(var(--tw-exit-blur, 0))
    }
}

@keyframes accordion-down {
    0% {
        height: 0
    }

    to {
        height: var(--radix-accordion-content-height, var(--bits-accordion-content-height, var(--reka-accordion-content-height, var(--kb-accordion-content-height, var(--ngp-accordion-content-height, auto)))))
    }
}

@keyframes accordion-up {
    0% {
        height: var(--radix-accordion-content-height, var(--bits-accordion-content-height, var(--reka-accordion-content-height, var(--kb-accordion-content-height, var(--ngp-accordion-content-height, auto)))))
    }

    to {
        height: 0
    }
}

@keyframes caret-blink {

    0%,
    70%,
    to {
        opacity: 1
    }

    20%,
    50% {
        opacity: 0
    }
}

.ollie-f1-life__bg-overlay,
.ollie-shareholder__bg-overlay,
.ollie-hero__overlay {
    display: block !important
}

.ollie-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px
}

@media (min-width: 750px) {
    .ollie-container {
        padding: 0 40px
    }
}

@media (min-width: 1024px) {
    .ollie-container {
        padding: 0 48px
    }
}

.ollie-section {
    padding: 80px 0
}

@media (min-width: 1024px) {
    .ollie-section {
        padding: 120px 0
    }
}

.ollie-section--cream {
    background: #f9f2ed !important
}

.ollie-section--warm {
    background: #f5eaea !important
}

.ollie-fade-in {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .7s ease, transform .7s ease
}

.ollie-fade-in.ollie-visible {
    opacity: 1;
    transform: translateY(0)
}

.ollie-label {
    display: inline-block;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-sm);
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: #a40011;
    background: #a4001114;
    padding: 6px 16px;
    margin-bottom: 20px
}

.ollie-heading {
    font-family: Gilroy, sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #50000b;
    font-size: var(--fs-h1-lg);
    line-height: 1.15;
    margin-bottom: 20px
}

@media (min-width: 750px) {
    .ollie-heading {
        font-size: var(--fs-d3)
    }
}

@media (min-width: 1024px) {
    .ollie-heading {
        font-size: var(--fs-d5)
    }
}

.ollie-section-sub {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-2xl);
    line-height: 1.7;
    color: #50000b99;
    max-width: 560px;
    margin-bottom: 48px
}

.ollie-cta-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-lg);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    text-decoration: none;
    color: #fff;
    background: #a40011;
    padding: 16px 40px;
    border-radius: 100px;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    transition: background .25s ease
}

.ollie-cta-btn:hover {
    background: #8a000e
}

.ollie-cta-btn--secondary {
    background: transparent;
    color: #50000b;
    border: 1.5px solid #50000B
}

.ollie-cta-btn--secondary:hover {
    background: #50000b0d
}

/ .ollie-cta-btn--learn-more {
    background: #a40011;
    color: #fff;
    border: 1.5px solid #a40011
}

.ollie-cta-btn--learn-more:hover {
    background: #8a000e;
    border-color: #8a000e
}

.ollie-hero {
    position: relative;
    min-height: calc(100vh - 92px);
    min-height: calc(100dvh - 92px);
    display: flex;
    align-items: flex-end;
    overflow: hidden
}

.ollie-hero__bg {
    position: absolute;
    inset: 0
}

.ollie-hero__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 20%
}

.ollie-hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, #000000d9, #00000080 40%, #0003, #0000001a)
}

.ollie-hero__content {
    position: relative;
    z-index: 2;
    padding-bottom: 32px;
    padding-top: 32px;
    text-align: left;
    max-width: 1200px
}

@media (min-width: 750px) {
    .ollie-hero__content {
        padding-bottom: 100px;
        padding-top: 120px;
        max-width: 700px;
        margin-left: 48px;
        margin-right: auto
    }
}

@media (min-width: 1024px) {
    .ollie-hero__content {
        padding-bottom: 120px;
        max-width: 680px;
        margin-left: 64px
    }
}

.ollie-hero__content .ollie-label {
    color: var(--goli-gold);
    background: #dfce8926
}

.ollie-hero__title {
    font-family: Gilroy, sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #fff;
    font-size: var(--fs-d1);
    line-height: 1.1;
    margin-bottom: 20px
}

@media (min-width: 750px) {
    .ollie-hero__title {
        font-size: var(--fs-d5)
    }
}

@media (min-width: 1024px) {
    .ollie-hero__title {
        font-size: var(--fs-d6)
    }
}

.ollie-hero__sub {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h4);
    line-height: 1.6;
    color: #ffffffd9;
    margin-bottom: 24px;
    max-width: 560px
}

.ollie-hero__intro {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xl);
    line-height: 1.7;
    color: #ffffffa6;
    margin-bottom: 36px;
    max-width: 540px
}

.ollie-story-grid {
    display: grid;
    gap: 48px;
    margin-bottom: 64px
}

@media (min-width: 1024px) {
    .ollie-story-grid {
        grid-template-columns: 1fr 1fr;
        gap: 64px;
        align-items: start
    }
}

.ollie-story-text p {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-2xl);
    line-height: 1.75;
    color: #50000bb3;
    margin-bottom: 20px
}

.ollie-story-image {
    align-self: start
}

.ollie-story-image img {
    width: 100%;
    object-fit: cover;
    aspect-ratio: 1/1
}

.ollie-timeline {
    display: grid;
    gap: 0;
    border-top: 1px solid rgba(80, 0, 11, .1);
    margin-top: 48px
}

@media (min-width: 750px) {
    .ollie-timeline {
        grid-template-columns: repeat(3, 1fr)
    }
}

@media (min-width: 1024px) {
    .ollie-timeline {
        grid-template-columns: repeat(6, 1fr)
    }
}

.ollie-timeline__item {
    display: flex;
    flex-direction: column;
    padding: 24px 16px;
    border-bottom: 1px solid rgba(80, 0, 11, .1);
    cursor: pointer;
    transition: background .4s ease
}

.ollie-timeline__item:hover {
    background: #a4001108
}

@media (min-width: 750px) {
    .ollie-timeline__item {
        border-bottom: none;
        border-right: 1px solid rgba(80, 0, 11, .1)
    }

    .ollie-timeline__item:last-child {
        border-right: none
    }
}

.ollie-timeline__year {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h1);
    font-weight: 400;
    color: #a40011;
    margin-bottom: 8px
}

.ollie-timeline__event {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    line-height: 1.5;
    color: #50000b99
}

.ollie-f1-life {
    position: relative;
    padding: 80px 0;
    overflow: hidden
}

@media (min-width: 1024px) {
    .ollie-f1-life {
        padding: 120px 0
    }
}

.ollie-f1-life__bg {
    position: absolute;
    inset: 0
}

.ollie-f1-life__bg-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center
}

.ollie-f1-life__bg-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #50000beb, #50000be0, #50000bd1)
}

.ollie-f1-life__content {
    position: relative;
    z-index: 2
}

.ollie-f1-life__content .ollie-label {
    color: var(--goli-gold);
    background: #dfce891f
}

.ollie-f1-life__intro {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h5);
    line-height: 1.7;
    color: #fffc;
    max-width: 560px;
    margin-bottom: 48px
}

.ollie-demands-grid {
    display: grid;
    gap: 16px
}

@media (min-width: 750px) {
    .ollie-demands-grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (min-width: 1024px) {
    .ollie-demands-grid {
        grid-template-columns: repeat(3, 1fr)
    }
}

.ollie-demand-card {
    padding: 32px;
    background: #ffffff0f;
    border: 1px solid rgba(255, 255, 255, .08);
    transition: background .3s ease
}

.ollie-demand-card__icon {
    color: var(--goli-gold);
    margin-bottom: 16px
}

.ollie-demand-card__title {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h5);
    font-weight: 600;
    color: #fff;
    margin-bottom: 10px
}

.ollie-demand-card__desc {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-lg);
    line-height: 1.65;
    color: #ffffffa6
}

.ollie-pullquote {
    border-left: 3px solid #a40011;
    padding: 24px 32px;
    margin: 40px 0;
    background: #a400110a
}

.ollie-pullquote p {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h3);
    font-weight: 400;
    font-style: normal;
    line-height: 1.5;
    color: #50000b;
    margin-bottom: 12px
}

@media (min-width: 750px) {
    .ollie-pullquote p {
        font-size: var(--fs-h2-lg)
    }
}

.ollie-pullquote cite {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    font-style: normal;
    letter-spacing: .08em;
    color: #50000b80
}

.ollie-pullquote--light {
    border-left-color: var(--goli-gold);
    background: #ffffff0f
}

.ollie-pullquote--light p {
    color: #ffffffe6
}

.ollie-pullquote--light cite {
    color: #ffffff80
}

.ollie-why-grid {
    display: grid;
    gap: 48px
}

@media (min-width: 1024px) {
    .ollie-why-grid {
        grid-template-columns: 1fr 1fr;
        gap: 64px;
        align-items: start
    }
}

.ollie-why-text p {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-2xl);
    line-height: 1.75;
    color: #50000bb3;
    margin-bottom: 20px
}

.ollie-why-text h3 {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h4);
    font-weight: 600;
    color: #50000b;
    margin-bottom: 16px;
    margin-top: 32px
}

.ollie-why-image img {
    width: 100%;
    object-fit: cover;
    aspect-ratio: 1/1
}

.ollie-benefits-list {
    display: flex;
    flex-direction: column;
    gap: 10px
}

.ollie-benefit-item {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xl);
    color: #50000bcc;
    padding: 14px 18px;
    background: #a400110a
}

.ollie-benefit-icon {
    color: #a40011;
    flex-shrink: 0
}

.ollie-routine-section {
    background: #f9f2ed !important
}

.ollie-routine-cards {
    display: grid;
    gap: 16px
}

@media (min-width: 750px) {
    .ollie-routine-cards {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (min-width: 1024px) {
    .ollie-routine-cards {
        grid-template-columns: repeat(3, 1fr)
    }
}

.ollie-routine-card {
    background: #fff;
    padding: 28px;
    border: 1px solid rgba(80, 0, 11, .06);
    transition: box-shadow .3s ease
}

.ollie-routine-card--goli {
    border: 1px solid var(--goli-gold);
    background: #fff
}

.ollie-routine-card__time {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-sm);
    font-weight: 700;
    letter-spacing: .12em;
    color: #a40011;
    margin-bottom: 8px
}

.ollie-routine-card__title {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h5);
    font-weight: 600;
    color: #50000b;
    margin-bottom: 8px
}

.ollie-routine-card__desc {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-lg);
    line-height: 1.65;
    color: #50000b8c;
    margin-bottom: 16px
}

.ollie-routine-card__goli {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    background: #dfce891f;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    font-weight: 500;
    color: #50000b
}

.ollie-routine-card__goli-img {
    width: 36px;
    height: 36px;
    object-fit: cover;
    flex-shrink: 0;
    border-radius: 6px
}

.ollie-science-grid {
    display: grid;
    gap: 20px
}

@media (min-width: 750px) {
    .ollie-science-grid {
        grid-template-columns: repeat(3, 1fr)
    }
}

.ollie-science-card {
    text-align: center;
    padding: 48px 28px;
    background: #fff;
    transition: box-shadow .3s ease
}

.ollie-science-card:hover {
    box-shadow: 0 4px 16px #50000b0f
}

.ollie-science-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    background: #50000b;
    color: #fff;
    margin-bottom: 20px
}

.ollie-science-card__title {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h5);
    font-weight: 600;
    color: #50000b;
    margin-bottom: 10px
}

.ollie-science-card__desc {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-lg);
    line-height: 1.65;
    color: #50000b99
}

.ollie-shareholder {
    position: relative;
    padding: 80px 0;
    overflow: hidden
}

.ollie-shareholder__bg {
    position: absolute;
    inset: 0
}

.ollie-shareholder__bg-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 30%
}

.ollie-shareholder__bg-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #50000beb, #50000be0, #50000bd1)
}

.ollie-shareholder__content {
    position: relative;
    z-index: 2
}

.ollie-shareholder__content .ollie-label {
    color: var(--goli-gold);
    background: #dfce891f;
    font-weight: 700
}

.ollie-shareholder__content .ollie-heading {
    color: #fff
}

.ollie-shareholder__text p {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-2xl);
    line-height: 1.8;
    color: #ffffffd9;
    margin-bottom: 20px;
    max-width: 620px
}

@media (min-width: 1024px) {
    .ollie-shareholder {
        padding: 120px 0
    }
}

.ollie-shareholder-points {
    display: grid;
    gap: 10px;
    max-width: 480px
}

.ollie-shareholder-point {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xl);
    color: #ffffffe6;
    padding: 14px 18px;
    background: #ffffff0f;
    border: 1px solid rgba(255, 255, 255, .08)
}

.ollie-cta-section {
    text-align: center;
    position: relative
}

.ollie-cta-section .ollie-section-sub {
    margin-left: auto;
    margin-right: auto
}

.ollie-cta-product {
    display: grid;
    gap: 36px;
    max-width: 880px;
    margin: 0 auto;
    text-align: left;
    padding: 36px;
    background: #fff;
    border: 1px solid rgba(80, 0, 11, .06)
}

@media (min-width: 750px) {
    .ollie-cta-product {
        grid-template-columns: 260px 1fr;
        gap: 48px;
        align-items: center;
        padding: 48px
    }
}

.ollie-cta-product__img {
    width: 100%;
    max-width: 260px;
    margin: 0 auto;
    border-radius: 16px
}

.ollie-cta-product__info h3 {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h1);
    font-weight: 400;
    font-style: normal;
    color: #50000b;
    margin-bottom: 12px
}

.ollie-cta-product__desc {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xl);
    line-height: 1.65;
    color: #50000b99;
    margin-bottom: 24px
}

.ollie-cta-product__price {
    display: flex;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 24px;
    flex-wrap: wrap
}

.ollie-cta-product__price-current {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h2);
    font-weight: 700;
    color: #50000b
}

.ollie-cta-product__price-original {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-2xl);
    color: #50000b59;
    text-decoration: line-through
}

.ollie-cta-product__save {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xs);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #fff;
    background: #a40011;
    padding: 4px 12px;
    border-radius: 100px
}

.ollie-cta-buttons {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 24px
}

@media (min-width: 500px) {
    .ollie-cta-buttons {
        flex-direction: row
    }
}

.ollie-cta-guarantees {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    color: #50000b80
}

.ollie-cta-guarantees span {
    display: inline-flex;
    align-items: center;
    gap: 5px
}

.ollie-cta-guarantees svg {
    color: #22c55e
}

.ollie-best-seller-badge {
    position: absolute;
    top: -12px;
    right: -12px;
    z-index: 10;
    width: 62px;
    height: 62px;
    background: #a40011;
    clip-path: polygon(50% 0%, 85% 15%, 100% 50%, 85% 85%, 50% 100%, 15% 85%, 0% 50%, 15% 15%);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center
}

@media (min-width: 750px) {
    .ollie-best-seller-badge {
        top: -14px;
        right: -14px;
        width: 72px;
        height: 72px
    }
}

.ollie-best-seller-badge__text {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-badge);
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: #fff;
    line-height: 1.25
}

@media (min-width: 750px) {
    .ollie-best-seller-badge__text {
        font-size: 10.5px
    }
}

@media (max-width: 749px) {
    .ollie-hero {
        align-items: center
    }

    .ollie-hero__content {
        padding-top: 16px
    }

    .ollie-hero__title {
        font-size: var(--fs-h1-lg)
    }

    .ollie-hero__sub {
        font-size: var(--fs-xl);
        margin-bottom: 16px;
        line-height: 1.5
    }

    .ollie-hero__intro {
        font-size: var(--fs-base);
        margin-bottom: 24px;
        line-height: 1.6
    }

    .ollie-hero__title {
        margin-bottom: 14px
    }

    .ollie-heading {
        font-size: var(--fs-h1)
    }

    .ollie-pullquote p {
        font-size: 20px
    }

    .ollie-cta-product__info h3 {
        font-size: var(--fs-h2)
    }

    .ollie-cta-btn {
        padding: 14px 28px;
        font-size: var(--fs-base)
    }
}

.ollie-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 9998;
    background: #0000;
    transition: background .35s ease;
    pointer-events: none
}

.ollie-modal-backdrop--open {
    background: #0009;
    pointer-events: auto
}

.ollie-modal-panel {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 9999;
    width: 92%;
    max-width: 450px;
    max-height: 90vh;
    background: #fff;
    border-radius: 12px;
    transform: translate(-50%, -50%) scale(.92);
    opacity: 0;
    transition: transform .45s cubic-bezier(.22, 1, .36, 1), opacity .35s ease;
    overflow-y: auto;
    box-shadow: 0 24px 80px #00000040;
    pointer-events: none
}

.ollie-modal-panel--open {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
    pointer-events: auto
}

@media (max-width: 500px) {
    .ollie-modal-panel {
        width: 100%;
        max-width: 100%;
        max-height: 100vh;
        border-radius: 0;
        top: 0;
        left: 0;
        transform: translateY(100%);
        opacity: 1
    }

    .ollie-modal-panel--open {
        transform: translateY(0)
    }
}

.ollie-modal-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 36px;
    height: 36px;
    border: none;
    background: #ffffffb3;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #50000b;
    font-size: var(--fs-h4);
    transition: background .2s ease;
    z-index: 2;
    box-shadow: 0 2px 8px #0000001a
}

.ollie-modal-close:hover {
    background: #ffffffe6
}

.ollie-modal-image-wrapper {
    position: relative;
    width: 100%;
    height: 240px;
    background: linear-gradient(135deg, #d4a0a0, #c47070, #b85050);
    overflow: hidden
}

.ollie-modal-image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity .5s ease
}

.ollie-modal-image-wrapper img.loaded {
    opacity: 1
}

@media (max-width: 500px) {
    .ollie-modal-image-wrapper {
        height: 220px
    }

    .ollie-modal-panel {
        border-radius: 0
    }
}

.ollie-modal-body {
    padding: 32px 28px 40px
}

.ollie-modal-year {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-d4);
    font-weight: 400;
    color: #a40011;
    line-height: 1;
    margin-bottom: 8px
}

.ollie-modal-title {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h2);
    font-weight: 400;
    color: #50000b;
    line-height: 1.3;
    margin-bottom: 20px
}

.ollie-modal-text {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xl);
    line-height: 1.7;
    color: #50000bb3;
    margin-bottom: 16px
}

.ollie-modal-stat {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-sm);
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #a40011;
    background: #a4001114;
    padding: 8px 16px;
    margin-top: 8px
}

.ollie-timeline__plus {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-md);
    font-weight: 600;
    color: #a40011;
    margin-top: 8px;
    opacity: .5;
    transition: opacity .3s ease
}

@media (min-width: 750px) and (max-width: 1023px) {
    .ollie-timeline__plus {
        opacity: 0
    }

    .ollie-timeline__item:hover .ollie-timeline__plus {
        opacity: .7
    }
}

@media (min-width: 1024px) {
    .ollie-timeline__plus {
        display: none
    }
}

.ollie-numbers {
    padding: 48px 0;
    background: #50000b !important;
    overflow: hidden
}

@media (min-width: 1024px) {
    .ollie-numbers {
        padding: 64px 0
    }
}

.ollie-numbers__header {
    text-align: center;
    margin-bottom: 40px
}

.ollie-numbers__label {
    display: inline-block;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-sm);
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: var(--goli-gold, #DFCE89);
    background: #dfce891f;
    padding: 6px 16px;
    margin-bottom: 16px
}

.ollie-numbers__title {
    font-family: Gilroy, sans-serif;
    font-weight: 400;
    font-size: var(--fs-h1-lg);
    color: #fff;
    line-height: 1.2
}

@media (min-width: 750px) {
    .ollie-numbers__title {
        font-size: var(--fs-d3)
    }
}

.ollie-numbers__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px 24px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px
}

@media (min-width: 750px) {
    .ollie-numbers__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 40px;
        padding: 0 40px
    }
}

@media (min-width: 1024px) {
    .ollie-numbers__grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 48px;
        padding: 0 48px
    }
}

.ollie-numbers__item {
    text-align: center
}

.ollie-numbers__value {
    font-family: Gilroy, sans-serif;
    font-weight: 400;
    font-size: 44px;
    color: #fff;
    line-height: 1;
    margin-bottom: 8px;
    font-variant-numeric: tabular-nums
}

@media (min-width: 750px) {
    .ollie-numbers__value {
        font-size: 56px
    }
}

.ollie-numbers__suffix {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-2xl);
    color: #ffffff80
}

.ollie-numbers__desc {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    line-height: 1.5;
    color: #ffffff80;
    margin-top: 4px
}

.ollie-numbers__divider {
    display: block !important;
    width: 24px;
    height: 2px;
    background: var(--goli-gold, #DFCE89);
    margin: 12px auto 0;
    opacity: .4
}

.ollie-hover-card {
    position: fixed;
    z-index: 9990;
    width: 380px;
    max-height: 480px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 16px 60px #0000002e, 0 4px 16px #00000014;
    overflow: hidden;
    pointer-events: none;
    opacity: 0;
    transform: translateY(12px) scale(.97);
    transition: opacity .25s cubic-bezier(.4, 0, .2, 1), transform .25s cubic-bezier(.4, 0, .2, 1);
    will-change: opacity, transform, top, left, right
}

.ollie-hover-card--visible {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto
}

.ollie-hover-card__image {
    width: 100%;
    height: 180px;
    background: linear-gradient(135deg, #d4a0a0, #c47070, #b85050);
    overflow: hidden
}

.ollie-hover-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity .4s ease
}

.ollie-hover-card__image img.loaded {
    opacity: 1
}

.ollie-hover-card__body {
    padding: 20px
}

.ollie-hover-card__year {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h1-lg);
    font-weight: 400;
    color: #a40011;
    line-height: 1;
    margin-bottom: 4px
}

.ollie-hover-card__title {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h4);
    font-weight: 400;
    color: #50000b;
    line-height: 1.3;
    margin-bottom: 12px
}

.ollie-hover-card__text {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    line-height: 1.6;
    color: #50000ba6;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.ollie-hover-card__stat {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xs);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #a40011;
    background: #a4001114;
    padding: 6px 12px;
    margin-top: 12px
}



/*  */
/*  */
/*  */



      @font-face {
        font-family: 'ABC Arizona Flare';
        src: url("ABCArizonaFlare-Light.woff2") format('woff2');
        font-weight: 300;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: 'ABC Arizona Flare';
        src: url("ABCArizonaFlare-Regular.woff2") format('woff2');
        font-weight: 400;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: 'ABC Arizona Flare';
        src: url("ABCArizonaFlare-Medium.woff2") format('woff2');
        font-weight: 500;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: 'ABC Arizona Flare';
        src: url("ABCArizonaFlare-Bold.woff2") format('woff2');
        font-weight: 700;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: 'Aeonik';
        src: url("Aeonik-Regular.woff2") format('woff2');
        font-weight: 400;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: 'Aeonik';
        src: url("Aeonik-Medium.woff2") format('woff2');
        font-weight: 500;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: 'Aeonik';
        src: url("Aeonik-Bold.woff2") format('woff2');
        font-weight: 700;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: 'Assistant';
        src: url("Assistant-Regular.woff2") format('woff2');
        font-weight: 400;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: 'Assistant';
        src: url("Assistant-Bold.woff2") format('woff2');
        font-weight: 700;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: 'NB Architekt';
        src: url("NB-Architekt-Light.woff2") format('woff2');
        font-weight: 400;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: 'NB Architekt';
        src: url("NB-Architekt-Bold.woff2") format('woff2');
        font-weight: 700;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: 'Gilroy';
        src: url("https://d8ob1wugm1s1u.cloudfront.net/assets/fonts/Gilroy/Gilroy-Regular.woff2") format('woff2'),
             url("https://d8ob1wugm1s1u.cloudfront.net/assets/fonts/Gilroy/Gilroy-Regular.woff") format('woff');
        font-weight: 400;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: 'Gilroy';
        src: url("https://d8ob1wugm1s1u.cloudfront.net/assets/fonts/Gilroy/Gilroy-Medium.woff2") format('woff2'),
             url("https://d8ob1wugm1s1u.cloudfront.net/assets/fonts/Gilroy/Gilroy-Medium.woff") format('woff');
        font-weight: 500;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: 'Gilroy';
        src: url("https://d8ob1wugm1s1u.cloudfront.net/assets/fonts/Gilroy/Gilroy-Semibold.woff2") format('woff2'),
             url("https://d8ob1wugm1s1u.cloudfront.net/assets/fonts/Gilroy/Gilroy-Semibold.woff") format('woff');
        font-weight: 600;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: 'Gilroy';
        src: url("https://d8ob1wugm1s1u.cloudfront.net/assets/fonts/Gilroy/Gilroy-Bold.woff2") format('woff2'),
             url("https://d8ob1wugm1s1u.cloudfront.net/assets/fonts/Gilroy/Gilroy-Bold.woff") format('woff');
        font-weight: 700;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: 'Gilroy';
        src: url("https://d8ob1wugm1s1u.cloudfront.net/assets/fonts/Gilroy/Gilroy-Extrabold.woff2") format('woff2'),
             url("https://d8ob1wugm1s1u.cloudfront.net/assets/fonts/Gilroy/Gilroy-Extrabold.woff") format('woff');
        font-weight: 800;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: 'Gilroy';
        src: url("https://d8ob1wugm1s1u.cloudfront.net/assets/fonts/Gilroy/Gilroy-Heavy.woff2") format('woff2'),
             url("https://d8ob1wugm1s1u.cloudfront.net/assets/fonts/Gilroy/Gilroy-Heavy.woff") format('woff');
        font-weight: 900;
        font-style: normal;
        font-display: swap;
      }

[data-sonner-toaster][dir=ltr],html[dir=ltr]{--toast-icon-margin-start:-3px;--toast-icon-margin-end:4px;--toast-svg-margin-start:-1px;--toast-svg-margin-end:0px;--toast-button-margin-start:auto;--toast-button-margin-end:0;--toast-close-button-start:0;--toast-close-button-end:unset;--toast-close-button-transform:translate(-35%, -35%)}[data-sonner-toaster][dir=rtl],html[dir=rtl]{--toast-icon-margin-start:4px;--toast-icon-margin-end:-3px;--toast-svg-margin-start:0px;--toast-svg-margin-end:-1px;--toast-button-margin-start:0;--toast-button-margin-end:auto;--toast-close-button-start:unset;--toast-close-button-end:0;--toast-close-button-transform:translate(35%, -35%)}[data-sonner-toaster]{position:fixed;width:var(--width);font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;--gray1:hsl(0, 0%, 99%);--gray2:hsl(0, 0%, 97.3%);--gray3:hsl(0, 0%, 95.1%);--gray4:hsl(0, 0%, 93%);--gray5:hsl(0, 0%, 90.9%);--gray6:hsl(0, 0%, 88.7%);--gray7:hsl(0, 0%, 85.8%);--gray8:hsl(0, 0%, 78%);--gray9:hsl(0, 0%, 56.1%);--gray10:hsl(0, 0%, 52.3%);--gray11:hsl(0, 0%, 43.5%);--gray12:hsl(0, 0%, 9%);--border-radius:8px;box-sizing:border-box;padding:0;margin:0;list-style:none;outline:0;z-index:999999999;transition:transform .4s ease}@media (hover:none) and (pointer:coarse){[data-sonner-toaster][data-lifted=true]{transform:none}}[data-sonner-toaster][data-x-position=right]{right:var(--offset-right)}[data-sonner-toaster][data-x-position=left]{left:var(--offset-left)}[data-sonner-toaster][data-x-position=center]{left:50%;transform:translateX(-50%)}[data-sonner-toaster][data-y-position=top]{top:var(--offset-top)}[data-sonner-toaster][data-y-position=bottom]{bottom:var(--offset-bottom)}[data-sonner-toast]{--y:translateY(100%);--lift-amount:calc(var(--lift) * var(--gap));z-index:var(--z-index);position:absolute;opacity:0;transform:var(--y);touch-action:none;transition:transform .4s,opacity .4s,height .4s,box-shadow .2s;box-sizing:border-box;outline:0;overflow-wrap:anywhere}[data-sonner-toast][data-styled=true]{padding:16px;background:var(--normal-bg);border:1px solid var(--normal-border);color:var(--normal-text);border-radius:var(--border-radius);box-shadow:0 4px 12px rgba(0,0,0,.1);width:var(--width);font-size:13px;display:flex;align-items:center;gap:6px}[data-sonner-toast]:focus-visible{box-shadow:0 4px 12px rgba(0,0,0,.1),0 0 0 2px rgba(0,0,0,.2)}[data-sonner-toast][data-y-position=top]{top:0;--y:translateY(-100%);--lift:1;--lift-amount:calc(1 * var(--gap))}[data-sonner-toast][data-y-position=bottom]{bottom:0;--y:translateY(100%);--lift:-1;--lift-amount:calc(var(--lift) * var(--gap))}[data-sonner-toast][data-styled=true] [data-description]{font-weight:400;line-height:1.4;color:#3f3f3f}[data-rich-colors=true][data-sonner-toast][data-styled=true] [data-description]{color:inherit}[data-sonner-toaster][data-sonner-theme=dark] [data-description]{color:#e8e8e8}[data-sonner-toast][data-styled=true] [data-title]{font-weight:500;line-height:1.5;color:inherit}[data-sonner-toast][data-styled=true] [data-icon]{display:flex;height:16px;width:16px;position:relative;justify-content:flex-start;align-items:center;flex-shrink:0;margin-left:var(--toast-icon-margin-start);margin-right:var(--toast-icon-margin-end)}[data-sonner-toast][data-promise=true] [data-icon]>svg{opacity:0;transform:scale(.8);transform-origin:center;animation:sonner-fade-in .3s ease forwards}[data-sonner-toast][data-styled=true] [data-icon]>*{flex-shrink:0}[data-sonner-toast][data-styled=true] [data-icon] svg{margin-left:var(--toast-svg-margin-start);margin-right:var(--toast-svg-margin-end)}[data-sonner-toast][data-styled=true] [data-content]{display:flex;flex-direction:column;gap:2px}[data-sonner-toast][data-styled=true] [data-button]{border-radius:4px;padding-left:8px;padding-right:8px;height:24px;font-size:12px;color:var(--normal-bg);background:var(--normal-text);margin-left:var(--toast-button-margin-start);margin-right:var(--toast-button-margin-end);border:none;font-weight:500;cursor:pointer;outline:0;display:flex;align-items:center;flex-shrink:0;transition:opacity .4s,box-shadow .2s}[data-sonner-toast][data-styled=true] [data-button]:focus-visible{box-shadow:0 0 0 2px rgba(0,0,0,.4)}[data-sonner-toast][data-styled=true] [data-button]:first-of-type{margin-left:var(--toast-button-margin-start);margin-right:var(--toast-button-margin-end)}[data-sonner-toast][data-styled=true] [data-cancel]{color:var(--normal-text);background:rgba(0,0,0,.08)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast][data-styled=true] [data-cancel]{background:rgba(255,255,255,.3)}[data-sonner-toast][data-styled=true] [data-close-button]{position:absolute;left:var(--toast-close-button-start);right:var(--toast-close-button-end);top:0;height:20px;width:20px;display:flex;justify-content:center;align-items:center;padding:0;color:var(--gray12);background:var(--normal-bg);border:1px solid var(--gray4);transform:var(--toast-close-button-transform);border-radius:50%;cursor:pointer;z-index:1;transition:opacity .1s,background .2s,border-color .2s}[data-sonner-toast][data-styled=true] [data-close-button]:focus-visible{box-shadow:0 4px 12px rgba(0,0,0,.1),0 0 0 2px rgba(0,0,0,.2)}[data-sonner-toast][data-styled=true] [data-disabled=true]{cursor:not-allowed}[data-sonner-toast][data-styled=true]:hover [data-close-button]:hover{background:var(--gray2);border-color:var(--gray5)}[data-sonner-toast][data-swiping=true]::before{content:'';position:absolute;left:-100%;right:-100%;height:100%;z-index:-1}[data-sonner-toast][data-y-position=top][data-swiping=true]::before{bottom:50%;transform:scaleY(3) translateY(50%)}[data-sonner-toast][data-y-position=bottom][data-swiping=true]::before{top:50%;transform:scaleY(3) translateY(-50%)}[data-sonner-toast][data-swiping=false][data-removed=true]::before{content:'';position:absolute;inset:0;transform:scaleY(2)}[data-sonner-toast][data-expanded=true]::after{content:'';position:absolute;left:0;height:calc(var(--gap) + 1px);bottom:100%;width:100%}[data-sonner-toast][data-mounted=true]{--y:translateY(0);opacity:1}[data-sonner-toast][data-expanded=false][data-front=false]{--scale:var(--toasts-before) * 0.05 + 1;--y:translateY(calc(var(--lift-amount) * var(--toasts-before))) scale(calc(-1 * var(--scale)));height:var(--front-toast-height)}[data-sonner-toast]>*{transition:opacity .4s}[data-sonner-toast][data-x-position=right]{right:0}[data-sonner-toast][data-x-position=left]{left:0}[data-sonner-toast][data-expanded=false][data-front=false][data-styled=true]>*{opacity:0}[data-sonner-toast][data-visible=false]{opacity:0;pointer-events:none}[data-sonner-toast][data-mounted=true][data-expanded=true]{--y:translateY(calc(var(--lift) * var(--offset)));height:var(--initial-height)}[data-sonner-toast][data-removed=true][data-front=true][data-swipe-out=false]{--y:translateY(calc(var(--lift) * -100%));opacity:0}[data-sonner-toast][data-removed=true][data-front=false][data-swipe-out=false][data-expanded=true]{--y:translateY(calc(var(--lift) * var(--offset) + var(--lift) * -100%));opacity:0}[data-sonner-toast][data-removed=true][data-front=false][data-swipe-out=false][data-expanded=false]{--y:translateY(40%);opacity:0;transition:transform .5s,opacity .2s}[data-sonner-toast][data-removed=true][data-front=false]::before{height:calc(var(--initial-height) + 20%)}[data-sonner-toast][data-swiping=true]{transform:var(--y) translateY(var(--swipe-amount-y,0)) translateX(var(--swipe-amount-x,0));transition:none}[data-sonner-toast][data-swiped=true]{user-select:none}[data-sonner-toast][data-swipe-out=true][data-y-position=bottom],[data-sonner-toast][data-swipe-out=true][data-y-position=top]{animation-duration:.2s;animation-timing-function:ease-out;animation-fill-mode:forwards}[data-sonner-toast][data-swipe-out=true][data-swipe-direction=left]{animation-name:swipe-out-left}[data-sonner-toast][data-swipe-out=true][data-swipe-direction=right]{animation-name:swipe-out-right}[data-sonner-toast][data-swipe-out=true][data-swipe-direction=up]{animation-name:swipe-out-up}[data-sonner-toast][data-swipe-out=true][data-swipe-direction=down]{animation-name:swipe-out-down}@keyframes swipe-out-left{from{transform:var(--y) translateX(var(--swipe-amount-x));opacity:1}to{transform:var(--y) translateX(calc(var(--swipe-amount-x) - 100%));opacity:0}}@keyframes swipe-out-right{from{transform:var(--y) translateX(var(--swipe-amount-x));opacity:1}to{transform:var(--y) translateX(calc(var(--swipe-amount-x) + 100%));opacity:0}}@keyframes swipe-out-up{from{transform:var(--y) translateY(var(--swipe-amount-y));opacity:1}to{transform:var(--y) translateY(calc(var(--swipe-amount-y) - 100%));opacity:0}}@keyframes swipe-out-down{from{transform:var(--y) translateY(var(--swipe-amount-y));opacity:1}to{transform:var(--y) translateY(calc(var(--swipe-amount-y) + 100%));opacity:0}}@media (max-width:600px){[data-sonner-toaster]{position:fixed;right:var(--mobile-offset-right);left:var(--mobile-offset-left);width:100%}[data-sonner-toaster][dir=rtl]{left:calc(var(--mobile-offset-left) * -1)}[data-sonner-toaster] [data-sonner-toast]{left:0;right:0;width:calc(100% - var(--mobile-offset-left) * 2)}[data-sonner-toaster][data-x-position=left]{left:var(--mobile-offset-left)}[data-sonner-toaster][data-y-position=bottom]{bottom:var(--mobile-offset-bottom)}[data-sonner-toaster][data-y-position=top]{top:var(--mobile-offset-top)}[data-sonner-toaster][data-x-position=center]{left:var(--mobile-offset-left);right:var(--mobile-offset-right);transform:none}}[data-sonner-toaster][data-sonner-theme=light]{--normal-bg:#fff;--normal-border:var(--gray4);--normal-text:var(--gray12);--success-bg:hsl(143, 85%, 96%);--success-border:hsl(145, 92%, 87%);--success-text:hsl(140, 100%, 27%);--info-bg:hsl(208, 100%, 97%);--info-border:hsl(221, 91%, 93%);--info-text:hsl(210, 92%, 45%);--warning-bg:hsl(49, 100%, 97%);--warning-border:hsl(49, 91%, 84%);--warning-text:hsl(31, 92%, 45%);--error-bg:hsl(359, 100%, 97%);--error-border:hsl(359, 100%, 94%);--error-text:hsl(360, 100%, 45%)}[data-sonner-toaster][data-sonner-theme=light] [data-sonner-toast][data-invert=true]{--normal-bg:#000;--normal-border:hsl(0, 0%, 20%);--normal-text:var(--gray1)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast][data-invert=true]{--normal-bg:#fff;--normal-border:var(--gray3);--normal-text:var(--gray12)}[data-sonner-toaster][data-sonner-theme=dark]{--normal-bg:#000;--normal-bg-hover:hsl(0, 0%, 12%);--normal-border:hsl(0, 0%, 20%);--normal-border-hover:hsl(0, 0%, 25%);--normal-text:var(--gray1);--success-bg:hsl(150, 100%, 6%);--success-border:hsl(147, 100%, 12%);--success-text:hsl(150, 86%, 65%);--info-bg:hsl(215, 100%, 6%);--info-border:hsl(223, 43%, 17%);--info-text:hsl(216, 87%, 65%);--warning-bg:hsl(64, 100%, 6%);--warning-border:hsl(60, 100%, 9%);--warning-text:hsl(46, 87%, 65%);--error-bg:hsl(358, 76%, 10%);--error-border:hsl(357, 89%, 16%);--error-text:hsl(358, 100%, 81%)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast] [data-close-button]{background:var(--normal-bg);border-color:var(--normal-border);color:var(--normal-text)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast] [data-close-button]:hover{background:var(--normal-bg-hover);border-color:var(--normal-border-hover)}[data-rich-colors=true][data-sonner-toast][data-type=success]{background:var(--success-bg);border-color:var(--success-border);color:var(--success-text)}[data-rich-colors=true][data-sonner-toast][data-type=success] [data-close-button]{background:var(--success-bg);border-color:var(--success-border);color:var(--success-text)}[data-rich-colors=true][data-sonner-toast][data-type=info]{background:var(--info-bg);border-color:var(--info-border);color:var(--info-text)}[data-rich-colors=true][data-sonner-toast][data-type=info] [data-close-button]{background:var(--info-bg);border-color:var(--info-border);color:var(--info-text)}[data-rich-colors=true][data-sonner-toast][data-type=warning]{background:var(--warning-bg);border-color:var(--warning-border);color:var(--warning-text)}[data-rich-colors=true][data-sonner-toast][data-type=warning] [data-close-button]{background:var(--warning-bg);border-color:var(--warning-border);color:var(--warning-text)}[data-rich-colors=true][data-sonner-toast][data-type=error]{background:var(--error-bg);border-color:var(--error-border);color:var(--error-text)}[data-rich-colors=true][data-sonner-toast][data-type=error] [data-close-button]{background:var(--error-bg);border-color:var(--error-border);color:var(--error-text)}.sonner-loading-wrapper{--size:16px;height:var(--size);width:var(--size);position:absolute;inset:0;z-index:10}.sonner-loading-wrapper[data-visible=false]{transform-origin:center;animation:sonner-fade-out .2s ease forwards}.sonner-spinner{position:relative;top:50%;left:50%;height:var(--size);width:var(--size)}.sonner-loading-bar{animation:sonner-spin 1.2s linear infinite;background:var(--gray11);border-radius:6px;height:8%;left:-10%;position:absolute;top:-3.9%;width:24%}.sonner-loading-bar:first-child{animation-delay:-1.2s;transform:rotate(.0001deg) translate(146%)}.sonner-loading-bar:nth-child(2){animation-delay:-1.1s;transform:rotate(30deg) translate(146%)}.sonner-loading-bar:nth-child(3){animation-delay:-1s;transform:rotate(60deg) translate(146%)}.sonner-loading-bar:nth-child(4){animation-delay:-.9s;transform:rotate(90deg) translate(146%)}.sonner-loading-bar:nth-child(5){animation-delay:-.8s;transform:rotate(120deg) translate(146%)}.sonner-loading-bar:nth-child(6){animation-delay:-.7s;transform:rotate(150deg) translate(146%)}.sonner-loading-bar:nth-child(7){animation-delay:-.6s;transform:rotate(180deg) translate(146%)}.sonner-loading-bar:nth-child(8){animation-delay:-.5s;transform:rotate(210deg) translate(146%)}.sonner-loading-bar:nth-child(9){animation-delay:-.4s;transform:rotate(240deg) translate(146%)}.sonner-loading-bar:nth-child(10){animation-delay:-.3s;transform:rotate(270deg) translate(146%)}.sonner-loading-bar:nth-child(11){animation-delay:-.2s;transform:rotate(300deg) translate(146%)}.sonner-loading-bar:nth-child(12){animation-delay:-.1s;transform:rotate(330deg) translate(146%)}@keyframes sonner-fade-in{0%{opacity:0;transform:scale(.8)}100%{opacity:1;transform:scale(1)}}@keyframes sonner-fade-out{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.8)}}@keyframes sonner-spin{0%{opacity:1}100%{opacity:.15}}@media (prefers-reduced-motion){.sonner-loading-bar,[data-sonner-toast],[data-sonner-toast]>*{transition:none!important;animation:none!important}}.sonner-loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transform-origin:center;transition:opacity .2s,transform .2s}.sonner-loader[data-visible=false]{opacity:0;transform:scale(.8) translate(-50%,-50%)}

  /* ─── Ambassador Marquee ─── */
  .essentials-ambassadors-section {
    padding: 48px 0 56px;
    background: #faf8f7;
    overflow: hidden;
  }
  .essentials-marquee-track {
    display: flex;
    width: max-content;
    animation: essentials-marquee 105s linear infinite;
  }
  .essentials-marquee-track:hover {
    animation-play-state: paused;
  }
  @keyframes essentials-marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
  }
  .essentials-marquee-block {
    display: flex;
    gap: 16px;
    padding: 0 8px;
  }

  /* Card: cinematic story-style */
  .essentials-ambassador-card {
    flex-shrink: 0;
    width: 220px;
    aspect-ratio: 9/16;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    background: #1a1a1a;
    box-shadow: 0 2px 8px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.04);
    transition: transform 0.35s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.35s ease;
    will-change: transform;
    cursor: pointer;
  }
  .essentials-ambassador-card:hover {
    transform: translateY(-3px) scale(1.01);
    box-shadow: 0 10px 24px rgba(80,0,11,0.12), 0 0 0 1px rgba(80,0,11,0.06);
    transition: transform 0.2s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.2s ease;
  }

  /* Full-bleed media */
  .essentials-ambassador-media-fill {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
  }

  /* Gradient scrim via ::after */
  .essentials-ambassador-scrim {
    display: none !important;
  }
  .essentials-ambassador-card::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
      linear-gradient(
        to top,
        rgba(0,0,0,0.70) 0%,
        rgba(0,0,0,0.58) 15%,
        rgba(0,0,0,0.38) 32%,
        rgba(0,0,0,0.18) 50%,
        rgba(0,0,0,0.05) 70%,
        rgba(0,0,0,0) 100%
      ),
      radial-gradient(
        ellipse at center,
        rgba(0,0,0,0) 35%,
        rgba(0,0,0,0.20) 100%
      );
    pointer-events: none;
    border-radius: inherit;
  }

  /* Play / close button: centered */
  .essentials-ambassador-play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    line-height: 0;
    filter: drop-shadow(0 2px 6px rgba(0,0,0,0.35));
    transition: transform 0.2s cubic-bezier(0.22,1,0.36,1), opacity 0.2s ease;
    opacity: 0.92;
  }
  .essentials-ambassador-play-btn:hover {
    transform: translate(-50%, -50%) scale(1.12);
    opacity: 1;
  }
  .essentials-ambassador-play-btn.is-playing {
    top: 12px;
    left: auto;
    right: 12px;
    transform: none;
    opacity: 0.7;
  }
  .essentials-ambassador-play-btn.is-playing:hover {
    transform: scale(1.1);
    opacity: 1;
  }

  /* Bottom overlay: name + role on the image */
  .essentials-ambassador-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2;
    padding: 16px 14px 14px;
    pointer-events: none;
  }
  .essentials-ambassador-name-row {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 2px;
  }
  .essentials-ambassador-name {
    font-size: var(--fs-base);
    font-weight: var(--fw-semibold);
    color: #fff;
    font-family: var(--font-body-family);
    letter-spacing: var(--ls-xs);
  }
  .essentials-ambassador-role {
    font-size: var(--fs-xs);
    color: rgba(255,255,255,0.80);
    font-family: var(--font-body-family);
    display: block;
    line-height: 1.4;
    max-height: 40px;
    overflow: hidden;
    transition: max-height 0.3s ease, opacity 0.3s ease;
    opacity: 1;
  }
  .essentials-ambassador-overlay.is-playing .essentials-ambassador-role {
    max-height: 0;
    opacity: 0;
  }

  /* ─── White Testimonial Card ─── */
  .essentials-testimonial-card {
    flex-shrink: 0;
    width: 220px;
    aspect-ratio: 9/16;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08), 0 0 0 1px rgba(0,0,0,0.04);
    transition: transform 0.35s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.35s ease;
    will-change: transform;
    cursor: default;
    display: flex;
    flex-direction: column;
  }
  .essentials-testimonial-card:hover {
    transform: translateY(-3px) scale(1.01);
    box-shadow: 0 10px 24px rgba(80,0,11,0.08), 0 0 0 1px rgba(80,0,11,0.05);
    transition: transform 0.2s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.2s ease;
  }
  .essentials-testimonial-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px 0;
  }
  .essentials-testimonial-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
  }
  .essentials-testimonial-handle {
    font-family: var(--font-body-family);
    font-size: var(--fs-md);
    font-weight: var(--fw-semibold);
    color: #1a1a1a;
    display: block;
    line-height: 1.2;
  }
  .essentials-testimonial-followers {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    color: #888;
    display: block;
    line-height: 1.2;
  }
  .essentials-testimonial-video-wrap {
    width: 100%;
    flex: 1;
    min-height: 0;
    overflow: hidden;
    margin-top: 10px;
    position: relative;
  }
  .essentials-testimonial-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .essentials-testimonial-video-scrim {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(
      to bottom,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,0) 40%,
      rgba(0,0,0,0.08) 65%,
      rgba(0,0,0,0.2) 85%,
      rgba(0,0,0,0.35) 100%
    );
    pointer-events: none;
  }
  .essentials-testimonial-stars {
    padding: 10px 14px 0;
  }
  .essentials-testimonial-text {
    font-family: var(--font-body-family);
    font-size: var(--fs-md);
    line-height: 1.55;
    color: #333;
    padding: 6px 14px 14px;
    margin: 0;
  }

  /* ─── Scientist Card (dark, authority) ─── */
  .essentials-scientist-card {
    flex-shrink: 0;
    width: 220px;
    aspect-ratio: 9/16;
    border-radius: 12px;
    overflow: hidden;
    background: linear-gradient(165deg, #0b1a2e 0%, #0d2240 40%, #0a1628 100%);
    box-shadow: 0 2px 12px rgba(0,0,0,0.25), 0 0 0 1px rgba(255,255,255,0.06);
    transition: transform 0.35s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.35s ease;
    will-change: transform;
    cursor: default;
    display: flex;
    flex-direction: column;
    position: relative;
  }
  .essentials-scientist-card:hover {
    transform: translateY(-3px) scale(1.01);
    box-shadow: 0 10px 24px rgba(0,30,80,0.25), 0 0 0 1px rgba(100,160,255,0.10);
    transition: transform 0.2s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.2s ease;
  }
  .essentials-scientist-card__badge {
    padding: 14px 14px 0;
  }
  .essentials-scientist-card__badge-label {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-3xl);
    text-transform: uppercase;
    color: #6cb4ff;
    background: rgba(100,180,255,0.1);
    border: 1px solid rgba(100,180,255,0.2);
    border-radius: 4px;
    padding: 4px 8px;
    display: inline-block;
  }
  .essentials-scientist-card__photo-wrap {
    flex: 1;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 20px 0;
    position: relative;
  }
  .essentials-scientist-card__photo {
    width: 100%;
    max-width: 160px;
    aspect-ratio: 1;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid rgba(100,180,255,0.25);
    box-shadow: 0 0 30px rgba(60,140,255,0.15);
  }
  .essentials-scientist-card__info {
    padding: 12px 14px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    text-align: center;
  }
  .essentials-scientist-card__logo {
    width: 40px;
    height: 40px;
    object-fit: contain;
    margin-bottom: 4px;
  }
  .essentials-scientist-card__name {
    font-family: var(--font-body-family);
    font-size: var(--fs-lg);
    font-weight: var(--fw-bold);
    color: #fff;
    line-height: 1.2;
  }
  .essentials-scientist-card__title {
    font-family: var(--font-body-family);
    font-size: var(--fs-sm);
    color: rgba(255,255,255,0.6);
    line-height: 1.3;
  }
  .essentials-scientist-card__years {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-2xl);
    text-transform: uppercase;
    color: #6cb4ff;
    margin-top: 4px;
  }

  /* ─── Beckham Gold Card ─── */
  .essentials-beckham-card {
    flex-shrink: 0;
    width: 220px;
    aspect-ratio: 9/16;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    background: #1a1a1a;
    box-shadow: 0 2px 12px rgba(180,140,60,0.2), 0 0 0 1.5px rgba(212,175,55,0.35);
    transition: transform 0.35s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.35s ease;
    will-change: transform;
    cursor: pointer;
  }
  .essentials-beckham-card:hover {
    transform: translateY(-3px) scale(1.01);
    box-shadow: 0 10px 24px rgba(180,140,60,0.25), 0 0 0 2px rgba(212,175,55,0.4);
    transition: transform 0.2s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.2s ease;
  }
  .essentials-beckham-card__scrim {
    display: none !important;
  }
  .essentials-beckham-card::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
      linear-gradient(
        to top,
        rgba(0,0,0,0.70) 0%,
        rgba(0,0,0,0.58) 15%,
        rgba(0,0,0,0.38) 32%,
        rgba(0,0,0,0.18) 50%,
        rgba(0,0,0,0.05) 70%,
        rgba(0,0,0,0) 100%
      ),
      radial-gradient(
        ellipse at center,
        rgba(0,0,0,0) 35%,
        rgba(0,0,0,0.20) 100%
      );
    pointer-events: none;
    border-radius: inherit;
  }
  .essentials-beckham-card__top-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 3;
    font-family: var(--font-body-family);
    font-size: var(--fs-badge);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-3xl);
    text-transform: uppercase;
    color: #1a0f00;
    background: linear-gradient(135deg, #f5d77a 0%, #d4af37 50%, #c49b2a 100%);
    border-radius: 4px;
    padding: 5px 10px;
    box-shadow: 0 2px 8px rgba(180,140,60,0.3);
  }
  .essentials-beckham-card__overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 16px 14px 14px;
    z-index: 2;
    pointer-events: none;
  }
  .essentials-beckham-card__name {
    font-family: var(--font-body-family);
    font-size: var(--fs-xl);
    font-weight: var(--fw-bold);
    color: #f5d77a;
    display: block;
    line-height: 1.2;
    margin-bottom: 3px;
  }
  .essentials-beckham-card__title {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    color: rgba(255,255,255,0.85);
    display: block;
    line-height: 1.35;
  }

  /* ─── Sabalenka Card ─── */
  .essentials-sabalenka-card {
    flex-shrink: 0;
    width: 220px;
    aspect-ratio: 9/16;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    background: #1a1a1a;
    box-shadow: 0 2px 8px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.04);
    transition: transform 0.35s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.35s ease;
    will-change: transform;
    cursor: default;
  }
  .essentials-sabalenka-card:hover {
    transform: translateY(-3px) scale(1.01);
    box-shadow: 0 10px 24px rgba(80,0,11,0.12), 0 0 0 1px rgba(80,0,11,0.06);
    transition: transform 0.2s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.2s ease;
  }
  .essentials-sabalenka-card::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
      linear-gradient(
        to top,
        rgba(0,0,0,0.70) 0%,
        rgba(0,0,0,0.58) 15%,
        rgba(0,0,0,0.38) 32%,
        rgba(0,0,0,0.18) 50%,
        rgba(0,0,0,0.05) 70%,
        rgba(0,0,0,0) 100%
      ),
      radial-gradient(
        ellipse at center,
        rgba(0,0,0,0) 35%,
        rgba(0,0,0,0.20) 100%
      );
    pointer-events: none;
    border-radius: inherit;
  }
  .essentials-sabalenka-card__top-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 3;
    font-family: var(--font-body-family);
    font-size: var(--fs-badge);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-3xl);
    text-transform: uppercase;
    color: #fff;
    background: rgba(164,0,17,0.85);
    border-radius: 4px;
    padding: 5px 10px;
    backdrop-filter: blur(4px);
  }
  .essentials-sabalenka-card__overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 16px 14px 14px;
    z-index: 2;
    pointer-events: none;
  }
  .essentials-sabalenka-card__name {
    font-family: var(--font-body-family);
    font-size: var(--fs-lg);
    font-weight: var(--fw-bold);
    color: #fff;
    line-height: 1.2;
  }
  .essentials-sabalenka-card__title {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    color: rgba(255,255,255,0.85);
    display: block;
    line-height: 1.35;
    margin-top: 3px;
  }
  .essentials-sabalenka-card__handle {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    color: rgba(255,255,255,0.55);
    display: block;
    margin-top: 2px;
  }

  @media (max-width: 600px) {
    .essentials-ambassador-card { width: 170px; border-radius: 8px; }
    .essentials-testimonial-card { width: 170px; border-radius: 8px; }
    .essentials-scientist-card { width: 170px; border-radius: 8px; }
    .essentials-beckham-card { width: 170px; border-radius: 8px; }
    .essentials-sabalenka-card { width: 170px; border-radius: 8px; }
    .essentials-ambassador-play-btn svg { width: 32px; height: 32px; }
    .essentials-ambassador-play-btn.is-playing svg { width: 28px; height: 28px; }
    .essentials-ambassador-overlay { padding: 12px 10px 10px; }
    .essentials-ambassador-name { font-size: var(--fs-base); }
    .essentials-ambassador-role { font-size: var(--fs-xs); }
    .essentials-marquee-track { animation-duration: 65s; }
    .essentials-testimonial-header { padding: 10px 10px 0; gap: 6px; }
    .essentials-testimonial-avatar { width: 26px; height: 26px; }
    .essentials-testimonial-handle { font-size: var(--fs-md); }
    .essentials-testimonial-followers { font-size: var(--fs-xs); }
    .essentials-testimonial-text { font-size: var(--fs-md); padding: 4px 10px 10px; }
    .essentials-testimonial-stars { padding: 8px 10px 0; }
  }

  /* Trustpilot Rated Excellent Badge — top right of ambassador section */
  .essentials-tp-badge {
    position: absolute;
    top: 0;
    right: 20px;
    width: 110px;
    height: auto;
    z-index: 2;
  }
  @media (max-width: 768px) {
    .essentials-tp-badge {
      width: 100px;
      right: 10px;
      top: -4px;
    }
    .essentials-ambassador-title,
    .essentials-ambassador-subtitle {
      max-width: 80% !important;
    }
  }
  @media (max-width: 480px) {
    .essentials-tp-badge {
      width: 80px;
      right: 6px;
    }
  }

  /* Trustpilot dark badge under ambassador cards */
  .essentials-tp-dark-wrap {
    display: flex;
    justify-content: center;
    padding: 44px 20px 0;
  }
  .essentials-tp-dark-badge {
    width: 212px;
    height: auto;
    image-rendering: -webkit-optimize-contrast;
  }
  @media (max-width: 600px) {
    .essentials-tp-dark-badge {
      width: 170px;
    }
  }


/* ─── Ambassador Marquee ─── */
  .essentials-ambassadors-section {
    padding: 48px 0 56px;
    background: #faf8f7;
    overflow: hidden;
  }
  .essentials-marquee-track {
    display: flex;
    width: max-content;
    animation: essentials-marquee 105s linear infinite;
  }
  .essentials-marquee-track:hover {
    animation-play-state: paused;
  }
  @keyframes essentials-marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
  }
  .essentials-marquee-block {
    display: flex;
    gap: 16px;
    padding: 0 8px;
  }

  /* Card: cinematic story-style */
  .essentials-ambassador-card {
    flex-shrink: 0;
    width: 220px;
    aspect-ratio: 9/16;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    background: #1a1a1a;
    box-shadow: 0 2px 8px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.04);
    transition: transform 0.35s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.35s ease;
    will-change: transform;
    cursor: pointer;
  }
  .essentials-ambassador-card:hover {
    transform: translateY(-3px) scale(1.01);
    box-shadow: 0 10px 24px rgba(80,0,11,0.12), 0 0 0 1px rgba(80,0,11,0.06);
    transition: transform 0.2s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.2s ease;
  }

  /* Full-bleed media */
  .essentials-ambassador-media-fill {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
  }

  /* Gradient scrim via ::after */
  .essentials-ambassador-scrim {
    display: none !important;
  }
  .essentials-ambassador-card::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
      linear-gradient(
        to top,
        rgba(0,0,0,0.70) 0%,
        rgba(0,0,0,0.58) 15%,
        rgba(0,0,0,0.38) 32%,
        rgba(0,0,0,0.18) 50%,
        rgba(0,0,0,0.05) 70%,
        rgba(0,0,0,0) 100%
      ),
      radial-gradient(
        ellipse at center,
        rgba(0,0,0,0) 35%,
        rgba(0,0,0,0.20) 100%
      );
    pointer-events: none;
    border-radius: inherit;
  }

  /* Play / close button: centered */
  .essentials-ambassador-play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    line-height: 0;
    filter: drop-shadow(0 2px 6px rgba(0,0,0,0.35));
    transition: transform 0.2s cubic-bezier(0.22,1,0.36,1), opacity 0.2s ease;
    opacity: 0.92;
  }
  .essentials-ambassador-play-btn:hover {
    transform: translate(-50%, -50%) scale(1.12);
    opacity: 1;
  }
  .essentials-ambassador-play-btn.is-playing {
    top: 12px;
    left: auto;
    right: 12px;
    transform: none;
    opacity: 0.7;
  }
  .essentials-ambassador-play-btn.is-playing:hover {
    transform: scale(1.1);
    opacity: 1;
  }

  /* Bottom overlay: name + role on the image */
  .essentials-ambassador-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2;
    padding: 16px 14px 14px;
    pointer-events: none;
  }
  .essentials-ambassador-name-row {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 2px;
  }
  .essentials-ambassador-name {
    font-size: var(--fs-base);
    font-weight: var(--fw-semibold);
    color: #fff;
    font-family: var(--font-body-family);
    letter-spacing: var(--ls-xs);
  }
  .essentials-ambassador-role {
    font-size: var(--fs-xs);
    color: rgba(255,255,255,0.80);
    font-family: var(--font-body-family);
    display: block;
    line-height: 1.4;
    max-height: 40px;
    overflow: hidden;
    transition: max-height 0.3s ease, opacity 0.3s ease;
    opacity: 1;
  }
  .essentials-ambassador-overlay.is-playing .essentials-ambassador-role {
    max-height: 0;
    opacity: 0;
  }

  /* ─── White Testimonial Card ─── */
  .essentials-testimonial-card {
    flex-shrink: 0;
    width: 220px;
    aspect-ratio: 9/16;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08), 0 0 0 1px rgba(0,0,0,0.04);
    transition: transform 0.35s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.35s ease;
    will-change: transform;
    cursor: default;
    display: flex;
    flex-direction: column;
  }
  .essentials-testimonial-card:hover {
    transform: translateY(-3px) scale(1.01);
    box-shadow: 0 10px 24px rgba(80,0,11,0.08), 0 0 0 1px rgba(80,0,11,0.05);
    transition: transform 0.2s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.2s ease;
  }
  .essentials-testimonial-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px 0;
  }
  .essentials-testimonial-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
  }
  .essentials-testimonial-handle {
    font-family: var(--font-body-family);
    font-size: var(--fs-md);
    font-weight: var(--fw-semibold);
    color: #1a1a1a;
    display: block;
    line-height: 1.2;
  }
  .essentials-testimonial-followers {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    color: #888;
    display: block;
    line-height: 1.2;
  }
  .essentials-testimonial-video-wrap {
    width: 100%;
    flex: 1;
    min-height: 0;
    overflow: hidden;
    margin-top: 10px;
    position: relative;
  }
  .essentials-testimonial-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .essentials-testimonial-video-scrim {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(
      to bottom,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,0) 40%,
      rgba(0,0,0,0.08) 65%,
      rgba(0,0,0,0.2) 85%,
      rgba(0,0,0,0.35) 100%
    );
    pointer-events: none;
  }
  .essentials-testimonial-stars {
    padding: 10px 14px 0;
  }
  .essentials-testimonial-text {
    font-family: var(--font-body-family);
    font-size: var(--fs-md);
    line-height: 1.55;
    color: #333;
    padding: 6px 14px 14px;
    margin: 0;
  }

  /* ─── Scientist Card (dark, authority) ─── */
  .essentials-scientist-card {
    flex-shrink: 0;
    width: 220px;
    aspect-ratio: 9/16;
    border-radius: 12px;
    overflow: hidden;
    background: linear-gradient(165deg, #0b1a2e 0%, #0d2240 40%, #0a1628 100%);
    box-shadow: 0 2px 12px rgba(0,0,0,0.25), 0 0 0 1px rgba(255,255,255,0.06);
    transition: transform 0.35s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.35s ease;
    will-change: transform;
    cursor: default;
    display: flex;
    flex-direction: column;
    position: relative;
  }
  .essentials-scientist-card:hover {
    transform: translateY(-3px) scale(1.01);
    box-shadow: 0 10px 24px rgba(0,30,80,0.25), 0 0 0 1px rgba(100,160,255,0.10);
    transition: transform 0.2s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.2s ease;
  }
  .essentials-scientist-card__badge {
    padding: 14px 14px 0;
  }
  .essentials-scientist-card__badge-label {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-3xl);
    text-transform: uppercase;
    color: #6cb4ff;
    background: rgba(100,180,255,0.1);
    border: 1px solid rgba(100,180,255,0.2);
    border-radius: 4px;
    padding: 4px 8px;
    display: inline-block;
  }
  .essentials-scientist-card__photo-wrap {
    flex: 1;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 20px 0;
    position: relative;
  }
  .essentials-scientist-card__photo {
    width: 100%;
    max-width: 160px;
    aspect-ratio: 1;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid rgba(100,180,255,0.25);
    box-shadow: 0 0 30px rgba(60,140,255,0.15);
  }
  .essentials-scientist-card__info {
    padding: 12px 14px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    text-align: center;
  }
  .essentials-scientist-card__logo {
    width: 40px;
    height: 40px;
    object-fit: contain;
    margin-bottom: 4px;
  }
  .essentials-scientist-card__name {
    font-family: var(--font-body-family);
    font-size: var(--fs-lg);
    font-weight: var(--fw-bold);
    color: #fff;
    line-height: 1.2;
  }
  .essentials-scientist-card__title {
    font-family: var(--font-body-family);
    font-size: var(--fs-sm);
    color: rgba(255,255,255,0.6);
    line-height: 1.3;
  }
  .essentials-scientist-card__years {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-2xl);
    text-transform: uppercase;
    color: #6cb4ff;
    margin-top: 4px;
  }

  /* ─── Beckham Gold Card ─── */
  .essentials-beckham-card {
    flex-shrink: 0;
    width: 220px;
    aspect-ratio: 9/16;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    background: #1a1a1a;
    box-shadow: 0 2px 12px rgba(180,140,60,0.2), 0 0 0 1.5px rgba(212,175,55,0.35);
    transition: transform 0.35s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.35s ease;
    will-change: transform;
    cursor: pointer;
  }
  .essentials-beckham-card:hover {
    transform: translateY(-3px) scale(1.01);
    box-shadow: 0 10px 24px rgba(180,140,60,0.25), 0 0 0 2px rgba(212,175,55,0.4);
    transition: transform 0.2s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.2s ease;
  }
  .essentials-beckham-card__scrim {
    display: none !important;
  }
  .essentials-beckham-card::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
      linear-gradient(
        to top,
        rgba(0,0,0,0.70) 0%,
        rgba(0,0,0,0.58) 15%,
        rgba(0,0,0,0.38) 32%,
        rgba(0,0,0,0.18) 50%,
        rgba(0,0,0,0.05) 70%,
        rgba(0,0,0,0) 100%
      ),
      radial-gradient(
        ellipse at center,
        rgba(0,0,0,0) 35%,
        rgba(0,0,0,0.20) 100%
      );
    pointer-events: none;
    border-radius: inherit;
  }
  .essentials-beckham-card__top-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 3;
    font-family: var(--font-body-family);
    font-size: var(--fs-badge);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-3xl);
    text-transform: uppercase;
    color: #1a0f00;
    background: linear-gradient(135deg, #f5d77a 0%, #d4af37 50%, #c49b2a 100%);
    border-radius: 4px;
    padding: 5px 10px;
    box-shadow: 0 2px 8px rgba(180,140,60,0.3);
  }
  .essentials-beckham-card__overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 16px 14px 14px;
    z-index: 2;
    pointer-events: none;
  }
  .essentials-beckham-card__name {
    font-family: var(--font-body-family);
    font-size: var(--fs-xl);
    font-weight: var(--fw-bold);
    color: #f5d77a;
    display: block;
    line-height: 1.2;
    margin-bottom: 3px;
  }
  .essentials-beckham-card__title {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    color: rgba(255,255,255,0.85);
    display: block;
    line-height: 1.35;
  }

  /* ─── Sabalenka Card ─── */
  .essentials-sabalenka-card {
    flex-shrink: 0;
    width: 220px;
    aspect-ratio: 9/16;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    background: #1a1a1a;
    box-shadow: 0 2px 8px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.04);
    transition: transform 0.35s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.35s ease;
    will-change: transform;
    cursor: default;
  }
  .essentials-sabalenka-card:hover {
    transform: translateY(-3px) scale(1.01);
    box-shadow: 0 10px 24px rgba(80,0,11,0.12), 0 0 0 1px rgba(80,0,11,0.06);
    transition: transform 0.2s cubic-bezier(0.25,0.46,0.45,0.94), box-shadow 0.2s ease;
  }
  .essentials-sabalenka-card::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
      linear-gradient(
        to top,
        rgba(0,0,0,0.70) 0%,
        rgba(0,0,0,0.58) 15%,
        rgba(0,0,0,0.38) 32%,
        rgba(0,0,0,0.18) 50%,
        rgba(0,0,0,0.05) 70%,
        rgba(0,0,0,0) 100%
      ),
      radial-gradient(
        ellipse at center,
        rgba(0,0,0,0) 35%,
        rgba(0,0,0,0.20) 100%
      );
    pointer-events: none;
    border-radius: inherit;
  }
  .essentials-sabalenka-card__top-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 3;
    font-family: var(--font-body-family);
    font-size: var(--fs-badge);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-3xl);
    text-transform: uppercase;
    color: #fff;
    background: rgba(164,0,17,0.85);
    border-radius: 4px;
    padding: 5px 10px;
    backdrop-filter: blur(4px);
  }
  .essentials-sabalenka-card__overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 16px 14px 14px;
    z-index: 2;
    pointer-events: none;
  }
  .essentials-sabalenka-card__name {
    font-family: var(--font-body-family);
    font-size: var(--fs-lg);
    font-weight: var(--fw-bold);
    color: #fff;
    line-height: 1.2;
  }
  .essentials-sabalenka-card__title {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    color: rgba(255,255,255,0.85);
    display: block;
    line-height: 1.35;
    margin-top: 3px;
  }
  .essentials-sabalenka-card__handle {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    color: rgba(255,255,255,0.55);
    display: block;
    margin-top: 2px;
  }

  @media (max-width: 600px) {
    .essentials-ambassador-card { width: 170px; border-radius: 8px; }
    .essentials-testimonial-card { width: 170px; border-radius: 8px; }
    .essentials-scientist-card { width: 170px; border-radius: 8px; }
    .essentials-beckham-card { width: 170px; border-radius: 8px; }
    .essentials-sabalenka-card { width: 170px; border-radius: 8px; }
    .essentials-ambassador-play-btn svg { width: 32px; height: 32px; }
    .essentials-ambassador-play-btn.is-playing svg { width: 28px; height: 28px; }
    .essentials-ambassador-overlay { padding: 12px 10px 10px; }
    .essentials-ambassador-name { font-size: var(--fs-base); }
    .essentials-ambassador-role { font-size: var(--fs-xs); }
    .essentials-marquee-track { animation-duration: 65s; }
    .essentials-testimonial-header { padding: 10px 10px 0; gap: 6px; }
    .essentials-testimonial-avatar { width: 26px; height: 26px; }
    .essentials-testimonial-handle { font-size: var(--fs-md); }
    .essentials-testimonial-followers { font-size: var(--fs-xs); }
    .essentials-testimonial-text { font-size: var(--fs-md); padding: 4px 10px 10px; }
    .essentials-testimonial-stars { padding: 8px 10px 0; }
  }

  /* Trustpilot Rated Excellent Badge — top right of ambassador section */
  .essentials-tp-badge {
    position: absolute;
    top: 0;
    right: 20px;
    width: 110px;
    height: auto;
    z-index: 2;
  }
  @media (max-width: 768px) {
    .essentials-tp-badge {
      width: 100px;
      right: 10px;
      top: -4px;
    }
    .essentials-ambassador-title,
    .essentials-ambassador-subtitle {
      max-width: 80% !important;
    }
  }
  @media (max-width: 480px) {
    .essentials-tp-badge {
      width: 80px;
      right: 6px;
    }
  }

  /* Trustpilot dark badge under ambassador cards */
  .essentials-tp-dark-wrap {
    display: flex;
    justify-content: center;
    padding: 44px 20px 0;
  }
  .essentials-tp-dark-badge {
    width: 212px;
    height: auto;
    image-rendering: -webkit-optimize-contrast;
  }
  @media (max-width: 600px) {
    .essentials-tp-dark-badge {
      width: 170px;
    }
  }
/* ─── Organ Systems mobile icon buttons ─── */
.os-mobile-icon-btn {
  border-radius: 14px !important;
  background-color: rgb(255, 255, 255) !important;
  background-image: none !important;
  border: 1.5px solid rgba(164, 0, 17, 0.08) !important;
  box-shadow: none !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.os-mobile-icon-btn.os-mobile-icon-btn--active {
  background-image: linear-gradient(135deg, rgb(255, 255, 255), rgb(253, 242, 240)) !important;
  background-color: transparent !important;
  border-color: rgb(164, 0, 17) !important;
  box-shadow: rgba(164, 0, 17, 0.12) 0px 4px 12px 0px !important;
}

/* ── Scroll-reveal animation ── */
.reveal-on-scroll {
  opacity: 0;
  transform: translateY(32px);
  transition: opacity 0.65s ease, transform 0.65s ease;
}
.reveal-on-scroll.is-visible {
  opacity: 1;
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
  .reveal-on-scroll {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* ── Plan Cards ── */
.essentials-plan-card {
  margin-bottom: 10px;
  position: relative;
  cursor: pointer;
  border: 1.5px solid rgb(224, 224, 224);
  border-radius: 12px;
  padding: 16px;
  background: rgb(255, 255, 255);
  transition: border-color 0.15s;
}
.essentials-plan-card + .essentials-plan-card {
  margin-bottom: 12px;
}
.essentials-plan-card--active {
  border-color: rgb(164, 0, 17);
}

.essentials-plan-card__badge-pill {
  color: rgb(255, 255, 255);
  background-color: rgb(164, 0, 17);
  border-radius: 8px;
  font-family: var(--font-body-family);
  font-weight: var(--fw-bold);
  letter-spacing: 0.48px;
  text-transform: uppercase;
}

.essentials-savings-banner--top {
  margin: -16px -16px 10px;
  border-radius: 10px 10px 0 0;
}
.essentials-savings-banner__text {
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  color: rgb(22, 163, 74);
  font-family: var(--font-body-family);
  letter-spacing: var(--ls-md);
  text-transform: uppercase;
}

.essentials-plan-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: var(--font-body-family);
}
.essentials-plan-card__header-left {
  display: flex;
  align-items: center;
  gap: 10px;
}
.essentials-plan-card__radio {
  flex-shrink: 0;
}
.essentials-radio-icon__ring {
  fill: transparent;
}
.essentials-radio-icon__dot {
  fill: transparent;
}
.essentials-radio-icon--selected .essentials-radio-icon__ring {
  fill: white;
}
.essentials-radio-icon--selected .essentials-radio-icon__dot {
  fill: #A40011;
}
.essentials-plan-card__header-right {
  text-align: right;
}

.essentials-plan-card__name {
  color: rgb(26, 26, 26);
  font-family: var(--font-body-family);
  font-weight: var(--fw-bold);
  text-transform: uppercase;
}
.essentials-plan-card__name-save {
  color: rgb(22, 163, 74);
}
.essentials-plan-card__name-save--muted {
  color: rgb(102, 102, 102);
}

.essentials-plan-card__price {
  color: rgb(26, 26, 26);
  font-family: var(--font-body-family);
  font-weight: var(--fw-bold);
}
.essentials-plan-card__price-compare {
  color: rgb(153, 153, 153);
  font-family: var(--font-body-family);
  font-weight: var(--fw-regular);
  text-decoration: line-through;
}
.essentials-plan-card__price-suffix {
  color: rgb(102, 102, 102);
  font-family: var(--font-body-family);
  font-weight: var(--fw-regular);
}

.essentials-plan-card__billing {
  color: rgb(136, 136, 136);
  font-family: var(--font-body-family);
  font-weight: var(--fw-regular);
}
.essentials-plan-card__serving {
  color: rgb(68, 68, 68);
  font-family: var(--font-body-family);
  font-weight: var(--fw-regular);
  letter-spacing: 0.4px;
  text-transform: uppercase;
}

.essentials-savings-collapse {
  font-family: var(--font-body-family);
}
.essentials-savings-banner--collapse {
  background-color: rgba(22, 163, 74, 0.08);
  border-width: 0 0 1px;
  border-style: solid;
  border-color: rgba(22, 163, 74, 0.15);
  border-radius: 10px 10px 0 0;
}

.essentials-benefits-collapse {
  font-family: var(--font-body-family);
}
.essentials-plan-card__divider {
  height: 1px;
  background-color: rgb(238, 238, 238);
  margin: 8px 0;
}
.essentials-plan-card__benefits {
  list-style: none;
  margin: 0;
  padding: 0;
  font-family: var(--font-body-family);
}
.essentials-plan-card__benefits li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: rgb(68, 68, 68);
  font-family: var(--font-body-family);
}
.essentials-plan-card__benefits svg {
  flex-shrink: 0;
  color: rgb(187, 187, 187);
}

/* OTP */
.essentials-otp-wrapper { text-align: center; }
.essentials-otp-btn { background: none; border: none; cursor: pointer; font-family: var(--font-body-family); font-size: var(--fs-lg); color: rgb(80, 0, 11); text-decoration: underline; text-underline-offset: 3px; font-weight: var(--fw-regular); padding: 8px 0; transition: opacity 0.2s; }
/* CTA */
.essentials-cta-button { margin-top: 8px; }
/* Trust bar */
.essentials-trust-bar { border-top: 1px solid rgba(80,0,11,0.08); border-bottom: 1px solid rgba(80,0,11,0.08); }
.essentials-trust-bar__item { color: rgb(80,0,11); font-family: var(--font-body-family); font-weight: var(--fw-bold); letter-spacing: 0.6px; }
.essentials-trust-bar__sep { color: rgba(80,0,11,0.2); font-weight: 300; }
/* Gives back */
.essentials-gives-back { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding: 10px 14px; background: rgb(250,248,246); border: 1px solid rgb(232,226,220); border-radius: 10px; }
.essentials-gives-back__img { width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0; object-fit: cover; }
.essentials-gives-back__text { margin: 0; font-family: var(--font-body-family); font-size: var(--fs-sm); color: rgb(102,102,102); line-height: 1.5; }
.essentials-gives-back__label { font-family: var(--font-body-family); font-size: var(--fs-xs); font-weight: var(--fw-bold); letter-spacing: var(--ls-md); color: rgb(164,0,17); }
.essentials-gives-back__strong { font-weight: var(--fw-bold); color: rgb(80,0,11); }
/* CPR card */
.cpr-card { border-radius: 16px; padding: 20px 20px 16px; background: #a40011; margin-top: 16px; }
.cpr-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.cpr-header h3 { font-family: var(--font-body-family); font-size: var(--fs-2xl); font-weight: var(--fw-semibold); color: rgb(255,255,255); margin: 0; }
.cpr-badge { font-size: var(--fs-sm); font-weight: var(--fw-bold); color: rgb(255,255,255); background: rgba(255,255,255,0.12); padding: 3px 10px; border-radius: 10px; letter-spacing: var(--ls-sm); }
.cpr-badge-short { display: none; }
.cpr-benefits-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 8px; margin-bottom: 12px; }
.cpr-stat { display: flex; flex-direction: column; align-items: flex-start; }
.cpr-stat__number-row { display: flex; align-items: center; gap: 4px; margin-bottom: 4px; }
.cpr-stat__icon { font-size: var(--fs-2xl); line-height: 1; }
.cpr-stat__number { color: rgb(255,255,255); font-family: var(--font-body-family); font-size: var(--fs-stat); font-weight: var(--fw-bold); line-height: 1; }
.cpr-stat__label { font-size: var(--fs-md); font-weight: var(--fw-medium); color: rgba(255,255,255,0.6); line-height: 1.3; font-family: var(--font-body-family); }
.cpr-footnote { font-size: var(--fs-sm); color: rgba(255,255,255,0.45); margin-top: 30px; font-style: italic; font-family: var(--font-body-family); }
.cpr-footer-row { border-top: 1px solid rgba(255,255,255,0.1); padding-top: 12px; display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; }
.cpr-footer-left { flex: 1 1 0%; }
.cpr-study-btn { background: none; border: none; padding: 0; cursor: pointer; font-family: var(--font-body-family); font-size: var(--fs-md); font-weight: var(--fw-medium); color: rgb(255,255,255); text-decoration: underline; text-underline-offset: 3px; display: flex; align-items: center; gap: 6px; transition: opacity 0.2s; }
.cpr-study-btn svg { width: 10px; height: 10px; color: rgb(255,255,255); transition: transform 0.3s; }
.cpr-study-expand { max-height: 0; overflow: hidden; transition: max-height 0.4s, opacity 0.3s, margin 0.3s; opacity: 0; margin-top: 0; }
.cpr-study-expand p { font-size: var(--fs-md); line-height: 1.6; color: rgba(255,255,255,0.65); max-width: 480px; margin: 0; font-family: var(--font-body-family); }
.cpr-cert-badges { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.cpr-cert-badges img { height: 40px; width: auto; object-fit: contain; filter: brightness(0) invert(1); }
/* Tabs */
.essentials-tabs-container { border: 1px solid rgba(164,0,17,0.12); border-radius: 16px; background: rgb(255,255,255); margin-top: 16px; overflow: hidden; scroll-margin-top: 20px; }
.essentials-tabs-nav { display: flex; border-bottom: 1px solid rgba(164,0,17,0.1); }
.essentials-tab-btn { flex: 1 1 0%; padding: 14px 16px; background: rgba(164,0,17,0.03); border: none; border-bottom: 2px solid transparent; cursor: pointer; font-family: var(--font-body-family); font-size: var(--fs-md); font-weight: var(--fw-semibold); color: rgb(153,153,153); letter-spacing: var(--ls-sm); transition: 0.2s; }
.essentials-tab-btn--active { background: rgb(255,255,255); border-bottom-color: rgb(164,0,17); color: rgb(80,0,11); }
.essentials-tab-btn__num { opacity: 0.4; margin-right: 4px; font-size: var(--fs-xs); }
.essentials-tab-panel { padding: 16px 20px 20px; }
.essentials-tab-panel--hidden { display: none; }
.essentials-tab-panel--program { background: linear-gradient(rgba(223,206,137,0.06) 0%, rgba(223,206,137,0.02) 100%); }
.essentials-tab-panel__header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.essentials-tab-panel__title { font-family: var(--font-body-family); font-size: var(--fs-2xl); font-weight: var(--fw-semibold); color: rgb(80,0,11); margin: 0; }
.essentials-tab-panel__badge { font-size: var(--fs-sm); font-weight: var(--fw-bold); color: rgb(164,0,17); background: rgba(164,0,17,0.06); padding: 3px 10px; border-radius: 10px; letter-spacing: var(--ls-sm); }
.essentials-tab-panel__subtitle { font-size: var(--fs-md); color: black; margin: 0 0 14px; line-height: 1.5; font-family: var(--font-body-family); }
.essentials-steps-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; }
.essentials-step { display: flex; flex-direction: column; align-items: center; }
.essentials-step__video-wrap { width: 100%; aspect-ratio: 3/4; border-radius: 10px; overflow: hidden; background: rgb(245,240,237); margin-bottom: 8px; }
.essentials-step__video-wrap video { width: 100%; height: 100%; object-fit: cover; display: block; }
.essentials-step__label { font-family: var(--font-body-family); font-size: var(--fs-xs); font-weight: var(--fw-bold); color: rgb(164,0,17); letter-spacing: var(--ls-xl); margin-bottom: 3px; text-transform: uppercase; }
.essentials-step__desc { font-family: var(--font-body-family); font-size: var(--fs-md); color: rgb(80,0,11); line-height: 1.4; margin: 0; font-weight: var(--fw-medium); text-align: center; }
.essentials-accordion-row { border-bottom: 1px solid rgba(164,0,17,0.1); }
.essentials-accordion-row--last { border-bottom: none; }
.essentials-accordion-btn { width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 10px 0; background: none; border: none; cursor: pointer; gap: 12px; }
.essentials-accordion-btn__left { display: flex; align-items: center; gap: 10px; }
.essentials-accordion-btn__icon { font-size: var(--fs-h4); }
.essentials-accordion-btn__label { font-family: var(--font-body-family); font-size: var(--fs-lg); font-weight: var(--fw-semibold); color: rgb(80,0,11); letter-spacing: var(--ls-xs); }
.essentials-accordion-btn__right { display: flex; align-items: center; gap: 8px; }
.essentials-accordion-btn__count { font-size: var(--fs-sm); font-weight: var(--fw-semibold); color: rgb(164,0,17); background: rgba(164,0,17,0.06); padding: 2px 8px; border-radius: 10px; }
.essentials-accordion-btn__chevron { width: 16px; height: 16px; color: rgb(164,0,17); transition: transform 0.3s; }
.essentials-accordion-body { display: grid; grid-template-rows: 0fr; opacity: 0; transition: grid-template-rows 0.35s cubic-bezier(0.4,0,0.2,1), opacity 0.25s; }
.essentials-accordion-body > div { overflow: hidden; }
.essentials-accordion-body p { font-size: var(--fs-md); line-height: 1.7; color: rgb(102,102,102); padding: 0 0 16px 28px; margin: 0; font-family: var(--font-body-family); }
.essentials-experts-grid { display: grid; grid-template-columns: 1fr; gap: 8px; margin-bottom: 14px; font-family: var(--font-body-family); }
.essentials-expert-card { display: flex; align-items: top; gap: 8px; padding: 8px 10px; border-radius: 10px; background: rgb(255,255,255); border: 1px solid rgba(223,206,137,0.25); }
.essentials-expert-card__img { width: 48px; height: 48px; border-radius: 50%; flex-shrink: 0; object-fit: cover; border: 2px solid rgba(223,206,137,0.4); }
.essentials-expert-card__info { min-width: 0; }
.essentials-expert-card__name { font-family: var(--font-body-family); font-size: var(--fs-md); font-weight: var(--fw-semibold); color: rgb(80,0,11); line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.essentials-expert-card__role { font-family: var(--font-body-family); font-size: var(--fs-sm); color: rgb(136,136,136); line-height: 1.4; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.essentials-program-link { font-family: var(--font-body-family); font-size: var(--fs-md); font-weight: var(--fw-medium); color: rgb(139,116,36); text-decoration: underline; text-underline-offset: 2px; transition: opacity 0.15s; }
.essentials-tasting-footer { font-size: var(--fs-md); color: rgb(136,136,136); margin-top: 8px; }
.essentials-doctor-review__highlights {
display: flex;
gap:0.5em;
}
.essentials-doctor-review__headline{
  font-size: var(--fs-base);
}
.essentials-doctor-review__highlights li{
  font-size: var(--fs-md);
  background-color: #50000B;
  color: #fff;
  border-radius: 25px;
  text-align: center;
  padding: 4px 8px;
}
.essentials-doctor-review__product{
  font-size: var(--fs-md);
  font-weight: var(--fw-semibold);
}
.essentials-doctor-review__text{
  font-size: var(--fs-md);

}
.essentials-doctor-review__meta{
  font-size: var(--fs-sm);
}

.essentials-clinicians-v2{
  display: flex;
  flex-direction: column;
}
.essentials-clinicians-v2__img { width: 100%; height: auto; display: block; }
.essentials-clinicians-v2__img--mobile { display: none; }
@media (max-width: 767px) {
  .essentials-clinicians-v2__img--desktop { display: none; }
  .essentials-clinicians-v2__img--mobile { display: block; }
}

.essentials-page-bg {
    background: #fff no-repeat top center;
    background-size: 100% auto;
    overflow-x: clip
}

@media (min-width: 750px) {
    .essentials-page-bg {
        background: #fff no-repeat top center;
        background-size: 100% auto
    }
}

.essentials-announcement {
    position: sticky;
    top: 0;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
}

.essentials-announcement__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex-wrap: nowrap;
    white-space: nowrap
}

@media (max-width: 480px) {
    .essentials-announcement__inner {
        gap: 4px
    }

    .essentials-announcement__inner>span:first-child {
        font-size: var(--fs-xs) !important
    }

    .essentials-announcement__inner>span:last-of-type {
        font-size: var(--fs-sm) !important
    }
}

.essentials-thumbs::-webkit-scrollbar {
    display: none
}

.essentials-gallery-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #80808040;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .2s ease;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    z-index: 5
}

.essentials-gallery-arrow:hover {
    background: #80808073
}

.essentials-gallery-arrow--left {
    left: 10px
}

.essentials-gallery-arrow--right {
    right: 10px
}

.essentials-badge-wrapper {
    position: absolute;
    top: -41px;
    right: -41px;
    z-index: 20;
    width: 82px;
    height: 82px;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transform: scale(.3) rotate(-20deg);
    transition: opacity .6s cubic-bezier(.34, 1.56, .64, 1), transform .6s cubic-bezier(.34, 1.56, .64, 1);
    pointer-events: none
}

.essentials-badge-wrapper--visible {
    opacity: 1;
    transform: scale(1) rotate(0)
}

.essentials-badge-octagon {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #a40011;
    clip-path: polygon(50% 0%, 85% 15%, 100% 50%, 85% 85%, 50% 100%, 15% 85%, 0% 50%, 15% 15%);
    animation: essentials-badge-spin 20s linear infinite
}

.essentials-badge-text {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1;
    text-align: center;
    color: #fff;
    font-family: Gilroy, sans-serif;
    text-transform: uppercase
}

.essentials-badge-text__free {
    font-size: var(--fs-h5);
    font-weight: 800;
    letter-spacing: .08em;
    line-height: 1
}

.essentials-badge-text__sub {
    font-size: 8.5px;
    font-weight: 700;
    letter-spacing: .06em;
    line-height: 1.3
}

@keyframes essentials-badge-spin {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

.essentials-format-selector {
    display: flex;
    gap: 8px;
    position: relative;
    overflow: visible
}

.essentials-format-selector__btn {
    flex: 1;
    display: flex;
    align-items: stretch;
    gap: 0;
    padding: 0;
    background: #fff;
    border: 1.5px solid #e0e0e0;
    border-radius: 10px;
    cursor: pointer;
    transition: all .2s ease;
    text-align: left;
    position: relative;
    overflow: visible;
    min-height: 48px
}

.essentials-format-selector__btn--active {
    border-color: #a40011;
    background: #a4001105
}

.essentials-format-selector__img-wrap {
    width: 56px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f8f6f5;
    overflow: hidden;
    border-radius: 8px 0 0 8px
}

.essentials-format-selector__img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.essentials-format-selector__info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 8px 12px;
    gap: 2px;
    flex: 1;
    min-width: 0
}

.essentials-format-selector__label {
    font-size: var(--fs-xl);
    font-weight: 700;
    color: #1a1a1a;
    font-family: var(--font-heading-family);
    text-transform: uppercase;
    white-space: nowrap
}

.essentials-format-selector__btn--active .essentials-format-selector__label {
    color: #a40011
}

.essentials-format-selector__price-mobile {
    display: none;
    font-size: var(--fs-sm);
    font-weight: 600;
    color: #1a1a1a;
    font-family: var(--font-body-family)
}

@media (max-width: 600px) {
    .essentials-format-selector__price-mobile {
        display: block
    }
}

.essentials-format-selector__serving {
    font-size: var(--fs-xs);
    color: #444;
    font-family: var(--font-body-family);
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap
}

.essentials-format-selector__badge {
    position: absolute;
    top: -8px;
    right: 8px;
    background: #a40011;
    color: #fff;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .06em;
    padding: 2px 8px;
    border-radius: 8px;
    font-family: var(--font-body-family);
    text-transform: uppercase
}

.essentials-plan-card {
    border: 1.5px solid #e0e0e0;
    border-radius: 12px;
    padding: 16px;
    cursor: pointer;
    transition: all .2s ease;
    background: #fff;
    overflow: visible
}

.essentials-plan-card:hover {
    border-color: #ccc
}

.essentials-plan-card--active {
    border-color: #a40011;
    background: #fff
}

.essentials-plan-card--active:hover {
    border-color: #a40011
}

.essentials-plan-card__badge-pill {
    position: absolute;
    top: -8px;
    right: 8px;
    background: #a40011;
    color: #fff;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .06em;
    padding: 2px 8px;
    border-radius: 8px;
    font-family: var(--font-body-family);
    text-transform: uppercase
}

.essentials-plan-card__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
    transition: padding-top .3s cubic-bezier(.4, 0, .2, 1)
}

.essentials-plan-card__radio {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 2px solid #ccc;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all .2s ease
}

.essentials-plan-card__radio--active {
    border-color: #a40011
}

.essentials-plan-card__radio-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #a40011
}

.essentials-plan-card__name {
    font-size: var(--fs-xl);
    font-weight: 700;
    color: #1a1a1a;
    font-family: var(--font-heading-family);
    text-transform: uppercase
}

.essentials-plan-card__price {
    font-size: var(--fs-h4);
    font-weight: 700;
    color: #1a1a1a;
    font-family: var(--font-body-family)
}

.essentials-plan-card__price-compare {
    font-size: var(--fs-base);
    color: #999;
    text-decoration: line-through;
    margin-left: 6px;
    font-family: var(--font-body-family)
}

.essentials-plan-card__price-suffix {
    font-size: var(--fs-base);
    color: #666;
    margin-left: 2px;
    font-family: var(--font-body-family)
}

.essentials-plan-card__billing {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: var(--fs-md);
    color: black;
    font-family: var(--font-body-family);
    margin-bottom: 12px
}

.essentials-plan-card__serving {
    font-size: var(--fs-xs);
    color: #444;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-family: var(--font-body-family)
}

.essentials-plan-card__divider {
    height: 1px;
    background: #eee;
    margin-bottom: 12px;
    display: block !important
}

.essentials-plan-card__benefits {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 6px
}

.essentials-savings-collapse {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows .3s cubic-bezier(.4, 0, .2, 1);
    margin: -16px -16px 0
}

.essentials-savings-collapse__inner {
    overflow: hidden
}

.essentials-savings-collapse--open {
    grid-template-rows: 1fr
}

.essentials-savings-collapse:not(.essentials-savings-collapse--open)+.essentials-plan-card__header {
    padding-top: 16px
}

.essentials-savings-collapse--open+.essentials-plan-card__header {
    padding-top: 10px
}

.essentials-savings-banner {
    padding: 5px 16px;
    background: #16a34a14;
    border-bottom: 1px solid rgba(22, 163, 74, .15);
    text-align: center;
    border-radius: 10px 10px 0 0
}

.essentials-savings-collapse--open .essentials-savings-banner {
    margin-bottom: 10px
}

.essentials-benefits-collapse {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    margin-top: -12px;
    transition: max-height .35s cubic-bezier(.4, 0, .2, 1), opacity .25s ease, margin-top .35s ease
}

.essentials-benefits-collapse--open {
    max-height: 300px;
    opacity: 1;
    margin-top: 0
}

.essentials-plan-card__benefits li {
    font-size: var(--fs-base);
    color: black;
    font-family: var(--font-body-family);
    line-height: 1.5;
    display: flex;
    align-items: flex-start;
    gap: 8px
}

.essentials-plan-card__benefit-emoji {
    flex-shrink: 0;
    width: 18px;
    text-align: center
}

.essentials-info-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #dfce89;
    color: #50000b;
    font-size: var(--fs-xs);
    font-weight: 700;
    cursor: pointer;
    flex-shrink: 0;
    font-family: Gilroy, sans-serif;
    font-style: italic;
    line-height: 1;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease
}

.essentials-info-icon:hover {
    transform: scale(1.2);
    box-shadow: 0 2px 8px #dfce8980;
    background: #d4c06e
}

.essentials-cta-button {
    width: 100%;
    padding: 16px 24px;
    border-radius: 50px;
    border: none;
    background: #a40011;
    color: #fff;
    font-size: var(--fs-base);
    font-weight: 700;
    font-family: var(--font-body-family);
    letter-spacing: .02em;
    cursor: pointer;
    transition: all .3s ease;
    box-shadow: 0 4px 16px #a400114d;
    text-transform: uppercase
}

.essentials-cta-button:hover {
    background: #8a000e;
    box-shadow: 0 6px 24px #a4001173;
    transform: translateY(-1px)
}

.essentials-tags-row {
    flex-wrap: nowrap !important;
    overflow: visible
}

.essentials-tag-pill {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xs);
    padding: 3px 10px;
    white-space: nowrap;
    flex-shrink: 0;
    border-radius: 20px;
    background: #a400110f;
    color: #a40011;
    font-weight: 600;
    letter-spacing: .02em;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    transition: all .3s cubic-bezier(.34, 1.56, .64, 1);
    transform-origin: center
}

.essentials-tag-pill:hover {
    background: #a40011;
    color: #fff;
    transform: scale(1.06);
    box-shadow: 0 4px 12px #a4001140
}

.essentials-tag-pill:active {
    transform: scale(.97)
}

.essentials-tag-pill--acai {
    background: #fff;
    border: 1px solid rgba(164, 0, 17, .2)
}

.essentials-tag-pill--acai:hover {
    background: #a40011;
    color: #fff;
    border-color: #a40011
}

@media (max-width: 380px) {
    .essentials-tag-pill {
        font-size: var(--fs-badge);
        padding: 3px 7px
    }
}

.essentials-acai-link {
    font-size: var(--fs-sm);
    font-weight: 500;
    color: #a40011;
    text-decoration: none;
    border-bottom: none;
    font-family: var(--font-body-family);
    cursor: pointer;
    transition: all .2s ease;
    letter-spacing: .01em
}

.essentials-acai-link:hover {
    color: #50000b
}

.essentials-acai-link:active {
    opacity: .7
}

.essentials-flavor-dropdown-trigger {
    width: 100%;
    display: flex;
    align-items: stretch;
    gap: 0;
    padding: 0;
    background: transparent;
    border: 1px solid #d4d4d4;
    border-radius: .5rem;
    cursor: pointer;
    transition: all .15s ease;
    text-align: left;
    font-family: inherit;
    min-height: 56px;
    overflow: hidden
}

.essentials-flavor-dropdown-trigger:hover {
    border-color: #d4d4d4
}

.essentials-flavor-dropdown-trigger.essentials-flavor-dropdown-trigger--open {
    border-color: #8b2e3c;
    background: #f5eaea
}

.essentials-flavor-img-wrap {
    width: 64px;
    height: 56px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #a400110a;
    overflow: hidden;
    border-radius: 0
}

.essentials-flavor-img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.essentials-flavor-info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 8px 12px;
    gap: 2px;
    flex: 1;
    min-width: 0
}

.essentials-flavor-label {
    font-size: var(--fs-xl);
    font-weight: 700;
    color: #1a1a1a;
    font-family: var(--font-heading-family);
    text-transform: uppercase;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 6px;
    line-height: 1.3
}

.essentials-flavor-dropdown-trigger--open .essentials-flavor-label,
.essentials-flavor-dropdown-item--active .essentials-flavor-label {
    color: #8b2e3c
}

.essentials-flavor-desc {
    font-size: var(--fs-md);
    font-weight: 400;
    color: #888;
    font-family: var(--font-body-family);
    line-height: 1.4;
    white-space: nowrap
}

.essentials-flavor-dropdown-menu {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #d4d4d4;
    border-radius: .5rem;
    box-shadow: 0 8px 32px #0000001f;
    z-index: 50;
    overflow: hidden;
    animation: essentials-flavor-dropdown-in .15s ease-out
}

@keyframes essentials-flavor-dropdown-in {
    0% {
        opacity: 0;
        transform: translateY(-4px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

.essentials-flavor-dropdown-item {
    width: 100%;
    display: flex;
    align-items: stretch;
    gap: 0;
    padding: 0;
    background: transparent;
    border: none;
    border-bottom: 1px solid #f0f0f0;
    cursor: pointer;
    transition: background .15s ease;
    text-align: left;
    font-family: inherit;
    min-height: 56px
}

.essentials-flavor-dropdown-item:last-child {
    border-bottom: none
}

.essentials-flavor-dropdown-item:hover {
    background: #a400110a
}

.essentials-flavor-dropdown-item--active {
    background: #f5eaea
}

.essentials-flavor-badge {
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .06em;
    padding: 2px 6px;
    border-radius: 6px;
    background: #a40011;
    color: #fff;
    text-transform: uppercase;
    font-family: var(--font-body-family);
    white-space: nowrap
}

@media (max-width: 480px) {
    .essentials-flavor-dropdown-trigger {
        min-height: 48px
    }

    .essentials-flavor-img-wrap {
        width: 52px;
        height: 48px
    }

    .essentials-flavor-info {
        padding: 6px 10px
    }

    .essentials-flavor-label {
        font-size: var(--fs-base);
        gap: 5px
    }

    .essentials-flavor-desc {
        font-size: var(--fs-sm)
    }

    .essentials-flavor-badge {
        font-size: 7px;
        padding: 1.5px 5px
    }

    .essentials-flavor-dropdown-item {
        min-height: 48px
    }

    .essentials-flavor-dropdown-menu {
        border-radius: 10px
    }
}

.essentials-flavor-select {
    font-size: var(--fs-md);
    font-weight: 500;
    font-family: var(--font-body-family);
    color: #50000b;
    background: #fff;
    border: 1px solid rgba(164, 0, 17, .2);
    border-radius: 6px;
    padding: 4px 28px 4px 10px;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2350000B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 8px center;
    background-size: 12px;
    transition: all .2s ease;
    letter-spacing: .01em;
    outline: none
}

.essentials-flavor-select:hover {
    border-color: #a40011
}

.essentials-flavor-select:focus {
    border-color: #a40011;
    box-shadow: 0 0 0 2px #a400111a
}

.essentials-tag-card {
    position: fixed;
    z-index: 9990;
    width: 320px;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 16px 60px #0000002e, 0 4px 16px #00000014;
    pointer-events: none;
    opacity: 0;
    transform: translateY(12px) scale(.97);
    transition: opacity .25s cubic-bezier(.4, 0, .2, 1), transform .25s cubic-bezier(.4, 0, .2, 1);
    will-change: opacity, transform, top, left, right
}

.essentials-tag-card--visible {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto
}

.essentials-tag-card__body {
    padding: 20px
}

.essentials-tag-card__title {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h4);
    font-weight: 400;
    color: #50000b;
    line-height: 1.3;
    margin: 0 0 10px
}

.essentials-tag-card__text {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    line-height: 1.6;
    color: #50000ba6;
    margin: 0 0 12px;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.essentials-tag-card__stat {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xs);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #a40011;
    background: #a4001114;
    padding: 6px 12px
}

.essentials-mobile-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: #00000080;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    animation: essentials-fade-in .2s ease
}

.essentials-mobile-modal {
    background: #fff;
    border-radius: 16px;
    padding: 24px;
    max-width: 400px;
    width: 100%;
    position: relative;
    animation: essentials-slide-up .3s ease
}

.essentials-mobile-modal__close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #50000b0f;
    border: none;
    cursor: pointer;
    font-size: var(--fs-lg);
    color: #50000b;
    display: flex;
    align-items: center;
    justify-content: center
}

.essentials-mobile-modal__title {
    font-family: Gilroy, sans-serif;
    font-size: 20px;
    font-weight: 400;
    color: #50000b;
    margin: 0 0 12px;
    padding-right: 32px
}

.essentials-mobile-modal__text {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-lg);
    line-height: 1.6;
    color: #50000ba6;
    margin: 0 0 16px
}

.essentials-mobile-modal__stat {
    display: inline-flex;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xs);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #a40011;
    background: #a4001114;
    padding: 6px 12px
}

@keyframes essentials-fade-in {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes essentials-slide-up {
    0% {
        opacity: 0;
        transform: translateY(20px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

.essentials-grid>* {
    min-width: 0;
    max-width: 100%
}

.essentials-product-info-col {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box
}

.essentials-gallery-col {
    overflow: visible
}

@media (min-width: 768px) {
    .essentials-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 48px !important;
        align-items: start
    }

    .essentials-gallery-col {
        overflow: visible
    }

    .essentials-grid>div:first-child {
        position: sticky;
        top: 52px;
        align-self: start
    }
}

@keyframes galleryFadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.essentials-gallery-viewport img {
    transition: opacity .3s ease-in-out
}

.essentials-gallery-viewport img[data-crossfade] {
    animation: galleryFadeIn .35s ease-in-out
}

@media (max-width: 767px) {
    .essentials-grid>div:first-child {
        position: static !important;
        align-self: auto !important
    }

    .essentials-badge-wrapper {
        display: none !important
    }

    .welcome-kit-badge {
        top: -30px !important;
        right: 8px !important;
        width: 64px !important;
        height: 64px !important
    }

    .welcome-kit-badge span:first-child {
        font-size: var(--fs-xl) !important
    }

    .welcome-kit-badge span:nth-child(2),
    .welcome-kit-badge span:nth-child(3) {
        font-size: 8px !important
    }

    .essentials-gallery-col {
        width: calc(100% + 40px) !important;
        max-width: none !important;
        margin-left: -20px !important;
        margin-right: -20px !important;
        margin-top: -24px !important;
        overflow-x: visible !important;
        overflow-y: visible !important;
        box-sizing: border-box !important
    }

    .essentials-gallery-viewport {
        border-radius: 0 !important;
        border: none !important;
        touch-action: pan-y pinch-zoom !important
    }

    .essentials-gallery-inner,
    .essentials-gallery-outer {
        touch-action: pan-y pinch-zoom !important
    }

    .essentials-gallery-viewport img {
        touch-action: pan-y pinch-zoom !important;
        pointer-events: none !important;
        -webkit-user-drag: none !important;
        -webkit-user-select: none !important;
        user-select: none !important
    }

    .essentials-gallery-viewport>div {
        touch-action: pan-y pinch-zoom !important
    }

    .essentials-tabs-container,
    .essentials-tabs-container * {
        touch-action: manipulation !important
    }

    .essentials-thumbs {
        margin-top: 8px !important;
        margin-bottom: 0 !important;
        padding: 0 16px !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: visible !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch;
        scroll-behavior: smooth;
        scrollbar-width: none !important;
        touch-action: manipulation !important
    }

    .essentials-thumbs button {
        touch-action: manipulation !important
    }

    .essentials-thumbs img {
        pointer-events: none !important;
        touch-action: manipulation !important
    }

    .essentials-thumbs::-webkit-scrollbar {
        display: none !important
    }

    .essentials-gallery-badge {
        top: -30px !important;
        right: 8px !important;
        width: 64px !important;
        height: 64px !important
    }

    .essentials-gallery-badge span:first-child {
        font-size: var(--fs-xl) !important
    }

    .essentials-gallery-badge span:nth-child(2),
    .essentials-gallery-badge span:nth-child(3) {
        font-size: 8px !important
    }

    .essentials-hero-section {
        max-width: 100vw !important;
        box-sizing: border-box !important
    }

    .essentials-product-info-col {
        width: calc(100vw - 40px) !important;
        max-width: calc(100vw - 40px) !important;
        box-sizing: border-box !important;
        overflow: visible !important
    }

    .essentials-plan-card,
    .essentials-format-selector {
        max-width: 100% !important;
        box-sizing: border-box !important
    }

    .essentials-hsa-block {
        flex-wrap: wrap !important;
        justify-content: flex-start !important
    }

    .essentials-grid {
        gap: 8px !important
    }

    .essentials-gallery-col+div {
        margin-top: 0 !important
    }
}

.cpr-badge-short {
    display: none
}

@media (max-width: 600px) {
    .essentials-tabs-container {
        border-radius: 0 !important;
        border-left: none !important;
        border-right: none !important;
        margin-left: -20px !important;
        margin-right: -20px !important;
        width: calc(100% + 40px) !important
    }

    .essentials-tabs-container button {
        padding-left: 8px !important;
        padding-right: 8px !important;
        font-size: var(--fs-md) !important
    }

    .cpr-benefits-grid {
        grid-template-columns: repeat(2, 1fr) !important
    }

    .cpr-footer-row {
        flex-direction: column !important;
        align-items: flex-start !important
    }

    .cpr-badge-full {
        display: none
    }

    .cpr-badge-short {
        display: inline
    }

    .essentials-plan-card__name {
        font-size: var(--fs-base)
    }

    .essentials-plan-card__benefits li {
        font-size: var(--fs-md)
    }

    .essentials-plan-card__price {
        font-size: var(--fs-2xl)
    }

    .essentials-plan-card__header {
        gap: 4px
    }

    .essentials-cta-button {
        font-size: var(--fs-base);
        padding: 14px 16px
    }

    .essentials-format-selector__label {
        font-size: var(--fs-md)
    }

    .essentials-plan-card__serving {
        font-size: var(--fs-sm)
    }

    .essentials-plan-card__billing {
        font-size: var(--fs-base)
    }

    .essentials-format-selector__info {
        padding: 6px 8px
    }
}

@media (min-width: 414px) and (max-width: 767px) {
    .essentials-plan-card__benefits li {
        font-size: var(--fs-md)
    }

    .essentials-plan-card__name {
        font-size: var(--fs-lg)
    }

    .essentials-plan-card__price {
        font-size: var(--fs-h5)
    }

    .essentials-plan-card__billing {
        font-size: var(--fs-base)
    }

    .essentials-plan-card__serving {
        font-size: var(--fs-sm)
    }

    .essentials-cta-button {
        font-size: var(--fs-base);
        padding: 15px 18px
    }

    .essentials-format-selector__label {
        font-size: var(--fs-md)
    }
}

@media (max-width: 380px) {
    .essentials-plan-card {
        padding: 12px
    }

    .essentials-plan-card__name {
        font-size: var(--fs-md)
    }

    .essentials-plan-card__price {
        font-size: var(--fs-xl)
    }

    .essentials-cta-button {
        font-size: var(--fs-md);
        padding: 13px 14px
    }
}

.essentials-ambassadors-section {
    padding: 48px 0 56px;
    background: #faf8f7;
    overflow: hidden
}

.essentials-marquee-track {
    display: flex;
    width: max-content;
    animation: essentials-marquee 105s linear infinite
}

.essentials-marquee-track:hover {
    animation-play-state: paused
}

@keyframes essentials-marquee {
    0% {
        transform: translate(0)
    }

    to {
        transform: translate(-50%)
    }
}

.essentials-marquee-block {
    display: flex;
    gap: 16px;
    padding: 0 8px
}

.essentials-ambassador-card {
    flex-shrink: 0;
    width: 220px;
    aspect-ratio: 9/16;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    background: #1a1a1a;
    box-shadow: 0 2px 8px #0000001f, 0 0 0 1px #0000000a;
    transition: transform .35s cubic-bezier(.25, .46, .45, .94), box-shadow .35s ease;
    will-change: transform;
    cursor: pointer
}

.essentials-ambassador-card:hover {
    transform: translateY(-3px) scale(1.01);
    box-shadow: 0 10px 24px #50000b1f, 0 0 0 1px #50000b0f;
    transition: transform .2s cubic-bezier(.25, .46, .45, .94), box-shadow .2s ease
}

.essentials-ambassador-media-fill {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0
}

.essentials-ambassador-scrim {
    display: none
}

.essentials-ambassador-card:after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(to top, #000000b3, #00000094 15%, #00000061 32%, #0000002e 50%, #0000000d 70%, #0000), radial-gradient(ellipse at center, #0000 35%, #0003);
    pointer-events: none;
    border-radius: inherit
}

.essentials-ambassador-play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    line-height: 0;
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .35));
    transition: transform .2s cubic-bezier(.22, 1, .36, 1), opacity .2s ease;
    opacity: .92
}

.essentials-ambassador-play-btn:hover {
    transform: translate(-50%, -50%) scale(1.12);
    opacity: 1
}

.essentials-ambassador-play-btn.is-playing {
    top: 12px;
    left: auto;
    right: 12px;
    transform: none;
    opacity: .7
}

.essentials-ambassador-play-btn.is-playing:hover {
    transform: scale(1.1);
    opacity: 1
}

.essentials-ambassador-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2;
    padding: 16px 14px 14px;
    pointer-events: none
}

.essentials-ambassador-name-row {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 2px
}

.essentials-ambassador-name {
    font-size: var(--fs-base);
    font-weight: 600;
    color: #fff;
    font-family: var(--font-body-family);
    letter-spacing: .01em
}

.essentials-ambassador-role {
    font-size: var(--fs-xs);
    color: #fffc;
    font-family: var(--font-body-family);
    display: block;
    line-height: 1.4;
    max-height: 40px;
    overflow: hidden;
    transition: max-height .3s ease, opacity .3s ease;
    opacity: 1
}

.essentials-ambassador-overlay.is-playing .essentials-ambassador-role {
    max-height: 0;
    opacity: 0
}

.essentials-testimonial-card {
    flex-shrink: 0;
    width: 220px;
    aspect-ratio: 9/16;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 2px 8px #00000014, 0 0 0 1px #0000000a;
    transition: transform .35s cubic-bezier(.25, .46, .45, .94), box-shadow .35s ease;
    will-change: transform;
    cursor: default;
    display: flex;
    flex-direction: column
}

.essentials-testimonial-card:hover {
    transform: translateY(-3px) scale(1.01);
    box-shadow: 0 10px 24px #50000b14, 0 0 0 1px #50000b0d;
    transition: transform .2s cubic-bezier(.25, .46, .45, .94), box-shadow .2s ease
}

.essentials-testimonial-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px 0
}

.essentials-testimonial-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0
}

.essentials-testimonial-handle {
    font-family: var(--font-body-family);
    font-size: var(--fs-md);
    font-weight: 600;
    color: #1a1a1a;
    display: block;
    line-height: 1.2
}

.essentials-testimonial-followers {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    color: #888;
    display: block;
    line-height: 1.2
}

.essentials-testimonial-video-wrap {
    width: 100%;
    flex: 1;
    min-height: 0;
    overflow: hidden;
    margin-top: 10px;
    position: relative
}

.essentials-testimonial-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block
}

.essentials-testimonial-video-scrim {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(to bottom, #0000 0% 40%, #00000014 65%, #0003 85%, #00000059);
    pointer-events: none
}

.essentials-testimonial-stars {
    padding: 10px 14px 0
}

.essentials-testimonial-text {
    font-family: var(--font-body-family);
    font-size: var(--fs-md);
    line-height: 1.55;
    color: #333;
    padding: 6px 14px 14px;
    margin: 0
}

.essentials-scientist-card {
    flex-shrink: 0;
    width: 220px;
    aspect-ratio: 9/16;
    border-radius: 12px;
    overflow: hidden;
    background: linear-gradient(165deg, #0b1a2e, #0d2240 40%, #0a1628);
    box-shadow: 0 2px 12px #00000040, 0 0 0 1px #ffffff0f;
    transition: transform .35s cubic-bezier(.25, .46, .45, .94), box-shadow .35s ease;
    will-change: transform;
    cursor: default;
    display: flex;
    flex-direction: column;
    position: relative
}

.essentials-scientist-card:hover {
    transform: translateY(-3px) scale(1.01);
    box-shadow: 0 10px 24px #001e5040, 0 0 0 1px #64a0ff1a;
    transition: transform .2s cubic-bezier(.25, .46, .45, .94), box-shadow .2s ease
}

.essentials-scientist-card__badge {
    padding: 14px 14px 0
}

.essentials-scientist-card__badge-label {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xs);
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #6cb4ff;
    background: #64b4ff1a;
    border: 1px solid rgba(100, 180, 255, .2);
    border-radius: 4px;
    padding: 4px 8px;
    display: inline-block
}

.essentials-scientist-card__photo-wrap {
    flex: 1;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 20px 0;
    position: relative
}

.essentials-scientist-card__photo {
    width: 100%;
    max-width: 160px;
    aspect-ratio: 1;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid rgba(100, 180, 255, .25);
    box-shadow: 0 0 30px #3c8cff26
}

.essentials-scientist-card__info {
    padding: 12px 14px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    text-align: center
}

.essentials-scientist-card__logo {
    width: 40px;
    height: 40px;
    object-fit: contain;
    margin-bottom: 4px
}

.essentials-scientist-card__name {
    font-family: var(--font-body-family);
    font-size: var(--fs-lg);
    font-weight: 700;
    color: #fff;
    line-height: 1.2
}

.essentials-scientist-card__title {
    font-family: var(--font-body-family);
    font-size: var(--fs-sm);
    color: #fff9;
    line-height: 1.3
}

.essentials-scientist-card__years {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xs);
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #6cb4ff;
    margin-top: 4px
}

.essentials-beckham-card {
    flex-shrink: 0;
    width: 220px;
    aspect-ratio: 9/16;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    background: #1a1a1a;
    box-shadow: 0 2px 12px #b48c3c33, 0 0 0 1.5px #d4af3759;
    transition: transform .35s cubic-bezier(.25, .46, .45, .94), box-shadow .35s ease;
    will-change: transform;
    cursor: pointer
}

.essentials-beckham-card:hover {
    transform: translateY(-3px) scale(1.01);
    box-shadow: 0 10px 24px #b48c3c40, 0 0 0 2px #d4af3766;
    transition: transform .2s cubic-bezier(.25, .46, .45, .94), box-shadow .2s ease
}

.essentials-beckham-card__scrim {
    display: none
}

.essentials-beckham-card:after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(to top, #000000b3, #00000094 15%, #00000061 32%, #0000002e 50%, #0000000d 70%, #0000), radial-gradient(ellipse at center, #0000 35%, #0003);
    pointer-events: none;
    border-radius: inherit
}

.essentials-beckham-card__top-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 3;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-badge);
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #1a0f00;
    background: linear-gradient(135deg, #f5d77a, #d4af37, #c49b2a);
    border-radius: 4px;
    padding: 5px 10px;
    box-shadow: 0 2px 8px #b48c3c4d
}

.essentials-beckham-card__overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 16px 14px 14px;
    z-index: 2;
    pointer-events: none
}

.essentials-beckham-card__name {
    font-family: var(--font-body-family);
    font-size: var(--fs-xl);
    font-weight: 700;
    color: #f5d77a;
    display: block;
    line-height: 1.2;
    margin-bottom: 3px
}

.essentials-beckham-card__title {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    color: #ffffffd9;
    display: block;
    line-height: 1.35
}

.essentials-sabalenka-card {
    flex-shrink: 0;
    width: 220px;
    aspect-ratio: 9/16;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    background: #1a1a1a;
    box-shadow: 0 2px 8px #0000001f, 0 0 0 1px #0000000a;
    transition: transform .35s cubic-bezier(.25, .46, .45, .94), box-shadow .35s ease;
    will-change: transform;
    cursor: default
}

.essentials-sabalenka-card:hover {
    transform: translateY(-3px) scale(1.01);
    box-shadow: 0 10px 24px #50000b1f, 0 0 0 1px #50000b0f;
    transition: transform .2s cubic-bezier(.25, .46, .45, .94), box-shadow .2s ease
}

.essentials-sabalenka-card:after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(to top, #000000b3, #00000094 15%, #00000061 32%, #0000002e 50%, #0000000d 70%, #0000), radial-gradient(ellipse at center, #0000 35%, #0003);
    pointer-events: none;
    border-radius: inherit
}

.essentials-sabalenka-card__top-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 3;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-badge);
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #fff;
    background: #a40011d9;
    border-radius: 4px;
    padding: 5px 10px;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px)
}

.essentials-sabalenka-card__overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 16px 14px 14px;
    z-index: 2;
    pointer-events: none
}

.essentials-sabalenka-card__name {
    font-family: var(--font-body-family);
    font-size: var(--fs-lg);
    font-weight: 700;
    color: #fff;
    line-height: 1.2
}

.essentials-sabalenka-card__title {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    color: #ffffffd9;
    display: block;
    line-height: 1.35;
    margin-top: 3px
}

.essentials-sabalenka-card__handle {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    color: #ffffff8c;
    display: block;
    margin-top: 2px
}

@media (max-width: 600px) {

    .essentials-ambassador-card,
    .essentials-testimonial-card,
    .essentials-scientist-card,
    .essentials-beckham-card,
    .essentials-sabalenka-card {
        width: 170px;
        border-radius: 8px
    }

    .essentials-ambassador-play-btn svg {
        width: 32px;
        height: 32px
    }

    .essentials-ambassador-play-btn.is-playing svg {
        width: 28px;
        height: 28px
    }

    .essentials-ambassador-overlay {
        padding: 12px 10px 10px
    }

    .essentials-ambassador-name {
        font-size: var(--fs-base)
    }

    .essentials-ambassador-role {
        font-size: var(--fs-xs)
    }

    .essentials-marquee-track {
        animation-duration: 65s
    }

    .essentials-testimonial-header {
        padding: 10px 10px 0;
        gap: 6px
    }

    .essentials-testimonial-avatar {
        width: 26px;
        height: 26px
    }

    .essentials-testimonial-handle {
        font-size: var(--fs-md)
    }

    .essentials-testimonial-followers {
        font-size: var(--fs-xs)
    }

    .essentials-testimonial-text {
        font-size: var(--fs-md);
        padding: 4px 10px 10px
    }

    .essentials-testimonial-stars {
        padding: 8px 10px 0
    }
}

.essentials-tp-badge {
    position: absolute;
    top: 0;
    right: 20px;
    width: 110px;
    height: auto;
    z-index: 2
}

@media (max-width: 768px) {
    .essentials-tp-badge {
        width: 100px;
        right: 10px;
        top: -4px
    }

    .essentials-ambassador-title,
    .essentials-ambassador-subtitle {
        max-width: 80% !important
    }
}

@media (max-width: 480px) {
    .essentials-tp-badge {
        width: 80px;
        right: 6px
    }
}

.essentials-tp-dark-wrap {
    display: flex;
    justify-content: center;
    padding: 44px 20px 0
}

.essentials-tp-dark-badge {
    width: 250px;
    height: auto;
    image-rendering: -webkit-optimize-contrast
}

@media (max-width: 600px) {
    .essentials-tp-dark-badge {
        width: 200px
    }
}

.essentials-fw-trust-bar {
    width: 100%;
    background: linear-gradient(135deg, #a400110a, #a4001114 40%, #a400110d);
    padding: 16px 0;
    position: relative;
    overflow: hidden
}

.essentials-fw-trust-bar:before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 30% 50%, rgba(255, 255, 255, .5) 0%, transparent 70%);
    pointer-events: none
}

.essentials-fw-trust-bar__sparkles {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0
}

.essentials-fw-trust-bar__sparkle {
    position: absolute;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #fffc;
    animation: trustSparkle 3s ease-in-out infinite
}

.essentials-fw-trust-bar__sparkle--0 {
    top: 20%;
    left: 5%;
    animation-delay: 0s
}

.essentials-fw-trust-bar__sparkle--1 {
    top: 60%;
    left: 12%;
    animation-delay: .4s;
    width: 2px;
    height: 2px
}

.essentials-fw-trust-bar__sparkle--2 {
    top: 30%;
    left: 22%;
    animation-delay: .8s
}

.essentials-fw-trust-bar__sparkle--3 {
    top: 70%;
    left: 32%;
    animation-delay: 1.2s;
    width: 2px;
    height: 2px
}

.essentials-fw-trust-bar__sparkle--4 {
    top: 15%;
    left: 42%;
    animation-delay: .2s
}

.essentials-fw-trust-bar__sparkle--5 {
    top: 55%;
    left: 52%;
    animation-delay: 1.6s;
    width: 2px;
    height: 2px
}

.essentials-fw-trust-bar__sparkle--6 {
    top: 25%;
    left: 62%;
    animation-delay: .6s
}

.essentials-fw-trust-bar__sparkle--7 {
    top: 65%;
    left: 72%;
    animation-delay: 1s;
    width: 2px;
    height: 2px
}

.essentials-fw-trust-bar__sparkle--8 {
    top: 35%;
    left: 80%;
    animation-delay: 1.4s
}

.essentials-fw-trust-bar__sparkle--9 {
    top: 50%;
    left: 88%;
    animation-delay: .3s;
    width: 2px;
    height: 2px
}

.essentials-fw-trust-bar__sparkle--10 {
    top: 20%;
    left: 95%;
    animation-delay: 1.8s
}

.essentials-fw-trust-bar__sparkle--11 {
    top: 75%;
    left: 48%;
    animation-delay: 2.2s;
    width: 2px;
    height: 2px
}

@keyframes trustSparkle {

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

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

.essentials-fw-trust-bar__desktop {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    align-items: center;
    gap: 32px;
    position: relative;
    z-index: 1
}

.essentials-fw-trust-bar__mobile-marquee {
    display: none
}

.essentials-fw-trust-bar__badges {
    display: flex;
    gap: 12px;
    flex-shrink: 0
}

.essentials-fw-trust-bar__badge-box {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border: 1px solid rgba(164, 0, 17, .2);
    border-radius: 6px;
    background: #fff9
}

.essentials-fw-trust-bar__badge-label {
    font-family: Gilroy, sans-serif;
    font-size: 7px;
    font-weight: 700;
    line-height: 1.2;
    color: #50000b;
    letter-spacing: .04em;
    text-transform: uppercase
}

.essentials-fw-trust-bar__items {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: nowrap;
    overflow: hidden
}

.essentials-fw-trust-bar__item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-family: var(--font-body-family);
    font-size: var(--fs-base);
    font-weight: 500;
    color: #50000b;
    white-space: nowrap;
    flex-shrink: 0
}

@media (max-width: 767px) {
    .essentials-hero-section {
        padding-bottom: 20px !important
    }

    .essentials-fw-trust-bar {
        padding: 10px 0;
        margin-top: 0
    }

    .essentials-fw-trust-bar__desktop {
        display: none
    }

    .essentials-fw-trust-bar__mobile-marquee {
        display: block;
        overflow: hidden;
        position: relative;
        z-index: 1
    }

    .essentials-fw-trust-bar__track {
        display: flex;
        width: max-content;
        animation: trustBarMarquee 40s linear infinite
    }

    .essentials-fw-trust-bar__block {
        display: flex;
        align-items: center;
        gap: 16px;
        padding-right: 32px;
        flex-shrink: 0
    }

    .essentials-fw-trust-bar__badges {
        gap: 8px
    }

    .essentials-fw-trust-bar__badge-box {
        padding: 3px 6px;
        gap: 4px
    }

    .essentials-fw-trust-bar__badge-label {
        font-size: 7px;
        line-height: 1.1
    }

    .essentials-fw-trust-bar__item {
        font-size: var(--fs-sm);
        gap: 5px
    }
}

@keyframes trustBarMarquee {
    0% {
        transform: translate(0)
    }

    to {
        transform: translate(-50%)
    }
}

.essentials-hsa-block {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid #eee;
    cursor: pointer;
    position: relative;
    transition: background .2s ease
}

.essentials-hsa-block:hover {
    background: #50000b05
}

.essentials-hsa-hover-card {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    z-index: 50;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 8px 32px #0000001a;
    animation: fadeInUp .2s ease
}

.essentials-trust-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 14px 0;
    flex-wrap: wrap;
    border-top: 1px solid rgba(80, 0, 11, .08);
    border-bottom: 1px solid rgba(80, 0, 11, .08);
    margin-top: 16px
}

.essentials-trust-bar__item {
    font-size: var(--fs-xs);
    color: #50000b;
    font-weight: 700;
    font-family: Gilroy, sans-serif;
    letter-spacing: .06em;
    white-space: nowrap
}

.essentials-trust-bar__sep {
    font-size: var(--fs-md);
    color: #50000b33;
    flex-shrink: 0;
    font-weight: 300
}

@media (max-width: 600px) {
    .essentials-trust-bar {
        gap: 6px;
        row-gap: 2px;
        padding: 12px 0;
        text-align: center
    }

    .essentials-trust-bar__item {
        font-size: 8px
    }

    .essentials-trust-bar__sep {
        font-size: var(--fs-xs)
    }
}

.essentials-social-proof-row {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    flex-wrap: wrap
}

.essentials-social-proof-desktop {
    display: inline-flex;
    align-items: center;
    gap: 6px
}

.essentials-social-proof-mobile {
    display: none;
    align-items: center;
    gap: 6px
}

@media (max-width: 767px) {
    .essentials-social-proof-desktop {
        display: none
    }

    .essentials-social-proof-mobile {
        display: inline-flex
    }
}

.essentials-social-proof-cycle {
    position: relative;
    display: inline-block;
    height: 1.2em;
    overflow: hidden
}

.essentials-social-proof-cycle__a,
.essentials-social-proof-cycle__b {
    display: block;
    font-size: var(--fs-sm);
    color: #a40011;
    font-weight: 600;
    font-family: var(--font-body-family);
    animation: socialProofCycle 6s ease-in-out infinite;
    line-height: 1.2
}

.essentials-social-proof-cycle__b {
    animation-delay: 3s
}

@keyframes socialProofCycle {

    0%,
    40% {
        opacity: 1;
        transform: translateY(0)
    }

    45%,
    50% {
        opacity: 0;
        transform: translateY(-6px)
    }

    55%,
    95% {
        opacity: 0;
        transform: translateY(6px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

.essentials-benefit-text-mobile {
    display: none
}

@media (max-width: 600px) {
    .essentials-benefit-text-desktop {
        display: none
    }

    .essentials-benefit-text-mobile {
        display: inline
    }
}

@media (max-width: 500px) {
    .essentials-experts-grid {
        grid-template-columns: 1fr !important
    }
}

@media (min-width: 768px) {
    .essentials-format-selector__btn {
        min-height: 48px !important
    }
}

.essentials-faq-section {
    background: #a40011;
    padding: 22px 0
}

.essentials-faq-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: start
}

.essentials-faq-title {
    font-family: Gilroy, sans-serif !important;
    font-size: var(--fs-d4);
    font-weight: 400 !important;
    color: #fff;
    margin: 0 0 32px;
    letter-spacing: -.02em
}

.essentials-faq-accordion {
    display: flex;
    flex-direction: column
}

.essentials-faq-item {
    border-top: 1px solid rgba(255, 255, 255, .2)
}

.essentials-faq-item:last-child {
    border-bottom: 1px solid rgba(255, 255, 255, .2)
}

.essentials-faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 18px 0;
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
    gap: 16px
}

.essentials-faq-question h4 {
    font-family: var(--font-body-family);
    font-size: var(--fs-xl);
    font-weight: 600;
    color: #fff;
    margin: 0;
    line-height: 1.4
}

.essentials-faq-icon {
    font-size: 20px;
    color: #ffffffb3;
    flex-shrink: 0;
    width: 24px;
    text-align: center;
    transition: transform .3s ease
}

.essentials-faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height .4s ease, padding .4s ease;
    padding: 0
}

.essentials-faq-item.open .essentials-faq-answer {
    max-height: 400px;
    padding-bottom: 18px
}

.essentials-faq-answer p {
    font-family: var(--font-body-family);
    font-size: var(--fs-lg);
    color: #ffffffb3;
    line-height: 1.7;
    margin: 0 0 12px
}

.essentials-faq-answer p:last-child {
    margin-bottom: 0
}

.essentials-faq-cta {
    display: inline-flex;
    align-items: center;
    margin-top: 24px;
    font-family: var(--font-body-family);
    font-size: var(--fs-base);
    font-weight: 600;
    color: #fff;
    text-decoration: none;
    letter-spacing: .02em;
    padding: 10px 20px;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 6px;
    transition: all .2s ease
}

.essentials-faq-cta:hover {
    background: #ffffff1a;
    border-color: #ffffff80
}

.essentials-faq-right {
    position: sticky;
    top: 40px
}

.essentials-faq-image {
    width: 100%;
    height: auto;
    border-radius: 12px;
    object-fit: cover
}

.essentials-faq-image--mobile {
    display: none
}

@media (max-width: 768px) {
    .essentials-faq-section {
        padding: 22px 0
    }

    .essentials-faq-inner {
        grid-template-columns: 1fr;
        gap: 32px;
        padding: 0 20px
    }

    .essentials-faq-title {
        font-size: var(--fs-h1-lg);
        margin-bottom: 20px
    }

    .essentials-faq-question h4 {
        font-size: var(--fs-lg)
    }

    .essentials-faq-answer p {
        font-size: var(--fs-base)
    }

    .essentials-faq-image--desktop {
        display: none
    }

    .essentials-faq-image--mobile {
        display: block
    }

    .essentials-faq-right {
        position: static
    }
}

.product-match-desktop {
    display: grid !important
}

.product-match-mobile {
    display: none
}

@media (max-width: 768px) {
    .product-match-desktop {
        display: none !important
    }

    .product-match-mobile {
        display: block
    }

    .product-match-mobile>div:first-child::-webkit-scrollbar {
        display: none
    }
}

@media (min-width: 641px) and (max-width: 820px) {
    .product-match-desktop {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 10px !important
    }
}

.results-sticky-cta {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100;
    background: #fffffff7;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-top: 1px solid rgba(0, 0, 0, .08);
    padding: 12px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    transform: translateY(100%);
    opacity: 0;
    transition: transform .35s cubic-bezier(.4, 0, .2, 1), opacity .3s ease;
    box-shadow: 0 -4px 20px #0000000f
}

.results-sticky-cta--visible {
    transform: translateY(0);
    opacity: 1
}

.results-sticky-cta__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 28px;
    border-radius: 50px;
    border: none;
    background: #a40011;
    color: #fff;
    font-family: var(--font-body-family), "Gilroy", sans-serif;
    font-size: var(--fs-sm);
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    cursor: pointer;
    transition: opacity .2s ease;
    white-space: nowrap
}

.results-sticky-cta__btn:hover {
    opacity: .9
}

.results-sticky-cta__text {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-md);
    font-weight: 500;
    color: #666
}

@media (max-width: 768px) {
    .results-hero-compact {
        padding-top: 36px !important;
        padding-bottom: 48px !important
    }

    .results-breakdown-compact {
        padding-top: 36px !important;
        padding-bottom: 40px !important
    }

    .results-persona-compact {
        padding-top: 40px !important;
        padding-bottom: 32px !important
    }

    .result-insights-grid {
        gap: 10px !important
    }

    .results-objections-compact {
        padding-top: 40px !important;
        padding-bottom: 40px !important
    }
}

@keyframes checkout-spin {
    to {
        transform: rotate(360deg)
    }
}

.checkout-spinner {
    animation: checkout-spin .8s linear infinite
}

.essentials-cta-button:disabled {
    opacity: .85;
    cursor: wait
}

.product-form__submit:disabled {
    opacity: .85;
    cursor: wait
}

.sticky-add-to-cart-btn:disabled {
    opacity: .85;
    cursor: wait
}

.tasting-notes-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px
}

.tasting-note-card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    border: 1px solid rgba(164, 0, 17, .12);
    border-radius: 10px;
    background: #a4001105;
    transition: background .2s ease
}

.tasting-note-card:hover {
    background: #a400110d
}

.tasting-note-img {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    object-fit: cover;
    flex-shrink: 0
}

.tasting-note-info {
    flex: 1;
    min-width: 0
}

.tasting-note-name {
    display: block;
    font-family: var(--font-heading-family);
    font-size: var(--fs-md);
    font-weight: 700;
    text-transform: uppercase;
    color: #50000b;
    letter-spacing: .03em;
    line-height: 1.3;
    margin-bottom: 2px
}

.tasting-note-desc {
    font-family: var(--font-body-family);
    font-size: var(--fs-sm);
    line-height: 1.4;
    color: #50000b99;
    margin: 0
}

@media (max-width: 480px) {
    .tasting-notes-grid {
        grid-template-columns: 1fr;
        gap: 8px
    }

    .tasting-note-card {
        padding: 8px
    }

    .tasting-note-img {
        width: 40px;
        height: 40px
    }

    .tasting-note-name {
        font-size: var(--fs-sm)
    }

    .tasting-note-desc {
        font-size: var(--fs-xs)
    }
}

.en-dark-product .essentials-fw-trust-bar {
    background: linear-gradient(135deg, #faf5f0, #f8ede5 40%, #faf5f0) !important;
    border-top: none !important;
    border-bottom: none !important;
    position: relative !important
}

.en-dark-product .essentials-fw-trust-bar:before {
    background: radial-gradient(ellipse at 30% 50%, rgba(255, 255, 255, .5) 0%, transparent 70%) !important
}

.en-dark-product .essentials-fw-trust-bar__badge-box {
    background: #fff9 !important;
    border: 1px solid rgba(164, 0, 17, .2) !important
}

.en-dark-product .essentials-fw-trust-bar__badge-label,
.en-dark-product .essentials-fw-trust-bar__item {
    color: #50000b !important
}

.en-dark-product .essentials-fw-trust-bar__item svg circle {
    fill: #a40011 !important
}

.en-dark-product .essentials-fw-trust-bar__sparkle {
    background: #fffc !important
}

.en-dark-product .tasting-note-card,
.fc-dark-product .tasting-note-card,
.art-dark-product .tasting-note-card,
.drj-dark-product .tasting-note-card,
.lp-dark-product .tasting-note-card {
    border-color: #ffffff26;
    background: #ffffff0f
}

.en-dark-product .tasting-note-card:hover,
.fc-dark-product .tasting-note-card:hover,
.art-dark-product .tasting-note-card:hover,
.drj-dark-product .tasting-note-card:hover,
.lp-dark-product .tasting-note-card:hover {
    background: #ffffff1a
}

.en-dark-product .tasting-note-name,
.fc-dark-product .tasting-note-name,
.art-dark-product .tasting-note-name,
.drj-dark-product .tasting-note-name,
.lp-dark-product .tasting-note-name {
    color: #ffffffe6 !important
}

.en-dark-product .tasting-note-desc,
.fc-dark-product .tasting-note-desc,
.art-dark-product .tasting-note-desc,
.drj-dark-product .tasting-note-desc,
.lp-dark-product .tasting-note-desc {
    color: #fff9 !important
}

.drj-thumbs-scroll::-webkit-scrollbar {
    display: none
}

.drj-thumbs-scroll {
    scrollbar-width: none;
    -ms-overflow-style: none
}

.drj-bio-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    background: linear-gradient(135deg, #faf5f0, #f5ede4);
    border: 1px solid rgba(164, 0, 17, .15);
    border-radius: 12px;
    margin-bottom: 12px;
    cursor: pointer;
    transition: background .2s ease, border-color .2s ease
}

.drj-bio-strip:hover {
    background: linear-gradient(135deg, #f5ede4, #efe3d8);
    border-color: #a4001140
}

.drj-bio-strip__left {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    min-width: 0
}

.drj-bio-strip__avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid rgba(164, 0, 17, .2);
    flex-shrink: 0
}

.drj-bio-strip__info {
    min-width: 0;
    flex: 1
}

.drj-bio-strip__name-row {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 1px;
    flex-wrap: nowrap
}

.drj-bio-strip__name {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-md);
    font-weight: 700;
    color: #50000b;
    letter-spacing: .02em;
    white-space: nowrap
}

.drj-bio-strip__check {
    flex-shrink: 0;
    vertical-align: middle;
    position: relative;
    top: -.5px
}

.drj-bio-strip__subtitle {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    color: #50000b8c;
    margin-bottom: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.drj-bio-strip__stats {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
    align-items: center
}

.drj-bio-strip__stat {
    font-family: var(--font-body-family);
    font-size: var(--fs-xs);
    color: #50000b8c;
    white-space: nowrap
}

.drj-bio-strip__stat strong {
    color: #50000b;
    font-weight: 700
}

.drj-bio-strip__dot {
    margin: 0 3px;
    color: #50000b40
}

.drj-bio-strip__cta {
    display: inline-flex;
    align-items: center;
    font-family: var(--font-body-family);
    font-size: var(--fs-sm);
    font-weight: 600;
    color: #a40011;
    white-space: nowrap;
    flex-shrink: 0
}

@media (max-width: 420px) {
    .drj-bio-strip {
        padding: 8px 10px;
        gap: 8px
    }

    .drj-bio-strip__left {
        gap: 8px
    }

    .drj-bio-strip__avatar {
        width: 38px;
        height: 38px
    }

    .drj-bio-strip__name {
        font-size: 10.5px
    }

    .drj-bio-strip__check {
        width: 12px;
        height: 12px
    }

    .drj-bio-strip__subtitle {
        font-size: var(--fs-badge)
    }

    .drj-bio-strip__stats {
        display: none
    }

    .drj-bio-strip__cta {
        font-size: var(--fs-xs)
    }
}

@media (min-width: 421px) and (max-width: 639px) {
    .drj-bio-strip__stat {
        font-size: var(--fs-badge)
    }

    .drj-bio-strip__name {
        font-size: var(--fs-sm)
    }
}

.ga-hero__bg-overlay {
    display: block !important
}

.ga-announce-short {
    display: none
}

.ga-announce-full {
    display: inline
}

@media (max-width: 640px) {
    .ga-announce-short {
        display: inline
    }

    .ga-announce-full {
        display: none
    }
}

.ga-page {
    --ga-red: #a40011;
    --ga-dark: #50000B;
    --ga-cream: #FBF7EE;
    --ga-warm: #f5f0e8;
    --ga-tan: #E8D5C4;
    --ga-gold: #DFCE89;
    --ga-text: #1a1a1a;
    --ga-muted: #666;
    --ga-border: #e8e0d6;
    font-family: Gilroy, sans-serif;
    color: var(--ga-text);
    background: var(--ga-cream);
    overflow: clip
}

.ga-progress-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    z-index: 10000;
    background: transparent;
    pointer-events: none
}

.ga-progress-bar__fill {
    height: 100%;
    background: linear-gradient(90deg, var(--ga-red), var(--ga-gold));
    transition: width .1s linear;
    border-radius: 0 2px 2px 0
}

.ga-seen-in {
    background: #fafaf9;
    border-bottom: 1px solid rgba(0, 0, 0, .05);
    padding: 14px 20px
}

.ga-seen-in__inner {
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px
}

.ga-seen-in__label {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-badge);
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: #aaa;
    white-space: nowrap;
    flex-shrink: 0
}

.ga-seen-in__divider {
    width: 1px;
    height: 20px;
    background: #0000001a;
    flex-shrink: 0
}

.ga-seen-in__logos {
    display: flex;
    align-items: center;
    gap: 28px;
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none
}

.ga-seen-in__logos::-webkit-scrollbar {
    display: none
}

.ga-seen-in__logo-img {
    height: 18px;
    width: auto;
    object-fit: contain;
    flex-shrink: 0;
    opacity: .45;
    filter: grayscale(100%);
    transition: opacity .25s ease, filter .25s ease
}

.ga-seen-in__logo-img:hover {
    opacity: .7;
    filter: grayscale(50%)
}

.ga-seen-in__logo-img--square {
    height: 22px
}

.ga-seen-in__logo-img--vogue {
    height: 26px
}

@media (max-width: 640px) {
    .ga-seen-in {
        padding: 10px 16px
    }

    .ga-seen-in__inner {
        gap: 14px
    }

    .ga-seen-in__logos {
        gap: 18px
    }

    .ga-seen-in__logo-img {
        height: 14px
    }

    .ga-seen-in__logo-img--square {
        height: 18px
    }

    .ga-seen-in__logo-img--vogue {
        height: 22px
    }
}

.ga-author-byline {
    background: var(--ga-cream);
    padding: 24px 0 0
}

.ga-author-byline__inner {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--ga-border)
}

.ga-author-byline__avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid rgba(164, 0, 17, .15);
    flex-shrink: 0
}

.ga-author-byline__info {
    display: flex;
    flex-direction: column;
    gap: 2px
}

.ga-author-byline__name {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xl);
    font-weight: 600;
    color: var(--ga-text)
}

.ga-author-byline__meta {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    color: var(--ga-muted)
}

.ga-container {
    max-width: 720px;
    margin: 0 auto;
    padding: 0 24px
}

@media (max-width: 640px) {
    .ga-container {
        padding: 0 20px
    }
}

.ga-section {
    padding: 80px 0
}

.ga-section--cream {
    background: var(--ga-cream)
}

.ga-section--warm {
    background: var(--ga-warm)
}

.ga-section--dark {
    background: var(--ga-dark);
    color: #fff
}

@media (max-width: 640px) {
    .ga-section {
        padding: 56px 0
    }
}

.ga-eyebrow {
    display: inline-block;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-sm);
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ga-red);
    margin-bottom: 16px;
    padding: 6px 16px;
    background: #a400110f;
    border-radius: 100px
}

.ga-eyebrow--light {
    color: var(--ga-gold);
    background: #dfce891f
}

.ga-eyebrow--gold {
    color: #f5e6a3;
    background: #f5e6a326;
    text-shadow: 0 0 12px rgba(245, 230, 163, .5);
    border: 1px solid rgba(245, 230, 163, .25)
}

.ga-section-heading {
    font-family: Gilroy, sans-serif;
    font-weight: 400;
    font-size: clamp(28px, 5vw, 42px);
    line-height: 1.2;
    color: var(--ga-text);
    margin: 0 0 32px;
    letter-spacing: -.01em
}

.ga-section-heading--light {
    color: #fff
}

.ga-subheading {
    font-family: Gilroy, sans-serif;
    font-weight: 400;
    font-size: clamp(22px, 3.5vw, 30px);
    line-height: 1.25;
    color: var(--ga-text);
    margin: 0 0 20px
}

.ga-story-block {
    margin-bottom: 40px
}

.ga-story-block p {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h5);
    line-height: 1.75;
    color: var(--ga-text);
    margin: 0 0 20px
}

.ga-story-block p:last-child {
    margin-bottom: 0
}

.ga-story-block--light p {
    color: #ffffffd9
}

.ga-quote {
    margin: 64px 0;
    padding: 48px 0;
    border: none;
    position: relative;
    text-align: center
}

.ga-quote:before {
    content: "“";
    font-family: Gilroy, sans-serif;
    font-size: 120px;
    color: var(--ga-gold);
    opacity: .35;
    position: absolute;
    top: -10px;
    left: 50%;
    transform: translate(-50%);
    line-height: 1
}

.ga-quote p {
    font-family: Gilroy, sans-serif;
    font-size: clamp(24px, 4vw, 36px);
    font-style: italic;
    line-height: 1.5;
    color: var(--ga-text);
    margin: 0;
    padding: 0 16px;
    border-left: none
}

@media (min-width: 768px) {
    .ga-quote {
        margin: 80px auto;
        max-width: 800px
    }

    .ga-quote:before {
        font-size: 160px
    }
}

.ga-section--dark .ga-quote p {
    color: #ffffffe6
}

.ga-image-block {
    margin: 40px 0;
    border-radius: 12px;
    overflow: hidden
}

.ga-image-block__img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    border-radius: 12px
}

.ga-image-block--portrait {
    max-width: 480px;
    margin-left: auto;
    margin-right: auto
}

.ga-product-photos {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin: 40px 0
}

.ga-product-photos__item {
    border-radius: 12px;
    overflow: hidden;
    margin: 0
}

.ga-product-photos__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block
}

@media (max-width: 480px) {
    .ga-product-photos {
        grid-template-columns: 1fr 1fr;
        gap: 8px
    }
}

.ga-hero-wrapper {
    background: var(--ga-cream);
    padding: 0
}

.ga-hero {
    position: relative;
    height: 85vh;
    max-height: 700px;
    min-height: 500px;
    display: flex;
    align-items: flex-end;
    padding-bottom: 40px;
    overflow: hidden
}

@media (min-width: 769px) {
    .ga-hero-wrapper {
        padding: 24px 24px 0
    }

    .ga-hero {
        max-width: 900px;
        margin: 0 auto;
        height: 70vh;
        max-height: 640px;
        min-height: 420px;
        border-radius: 16px;
        padding-bottom: 60px
    }
}

.ga-hero__bg {
    position: absolute;
    inset: 0;
    z-index: 0
}

.ga-hero__bg-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 20%
}

.ga-hero__bg-overlay {
    position: absolute;
    inset: 0;
    background: #000000a6
}

.ga-hero__content {
    position: relative;
    z-index: 1
}

.ga-hero__title {
    font-family: Gilroy, sans-serif;
    font-weight: 400;
    font-size: clamp(28px, 5vw, 48px);
    line-height: 1.15;
    color: #fff;
    margin: 16px 0 24px;
    letter-spacing: -.02em
}

.ga-hero__title em {
    font-style: italic;
    color: var(--ga-gold)
}

.ga-hero__subtitle {
    font-family: Gilroy, sans-serif;
    font-size: clamp(15px, 2.2vw, 19px);
    line-height: 1.6;
    color: #fffc;
    max-width: 520px;
    margin: 0 0 24px
}

.ga-hero__byline {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px
}

.ga-hero__byline-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid rgba(255, 255, 255, .3)
}

.ga-hero__byline-info {
    display: flex;
    flex-direction: column;
    gap: 2px
}

.ga-hero__byline-name {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-lg);
    font-weight: 600;
    color: #fff
}

.ga-hero__byline-meta {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-md);
    color: #ffffff8c
}

.ga-hero__ctas {
    display: flex;
    align-items: center;
    gap: 16px
}

.ga-cta-btn--hero {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #a40011;
    color: #fff;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    padding: 16px 36px;
    border: none;
    border-radius: 100px;
    cursor: pointer;
    transition: background .2s, transform .15s
}

.ga-cta-btn--hero:hover {
    background: #8a000e;
    transform: translateY(-1px)
}

.ga-cta-btn--hero-secondary {
    background: none;
    border: none;
    border-radius: 0;
    padding: 0;
    margin: 0;
    font-family: var(--ga-font-body);
    font-size: var(--fs-xl);
    font-weight: 400;
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-thickness: 1px;
    text-decoration-color: #fff9;
    transition: opacity .2s ease, text-decoration-color .2s ease;
    white-space: nowrap;
    cursor: pointer;
    text-transform: none;
    letter-spacing: normal;
    line-height: 1;
    display: inline
}

.ga-cta-btn--hero-secondary:hover {
    background: none;
    opacity: .85;
    text-decoration-color: #fff
}

@media (max-width: 640px) {
    .ga-hero {
        height: auto;
        min-height: 0;
        padding-top: 48px;
        padding-bottom: 28px
    }

    .ga-hero__title {
        font-size: var(--fs-h2-lg);
        margin: 10px 0 14px
    }

    .ga-hero__subtitle {
        font-size: var(--fs-lg);
        line-height: 1.5;
        margin-bottom: 18px
    }

    .ga-hero__byline-avatar {
        width: 36px;
        height: 36px
    }

    .ga-hero__ctas {
        flex-direction: column;
        align-items: stretch;
        gap: 8px
    }

    .ga-cta-btn--hero {
        width: 100%;
        text-align: center;
        justify-content: center;
        padding: 12px 24px;
        font-size: var(--fs-lg)
    }

    .ga-cta-btn--hero-secondary {
        text-align: center;
        font-size: var(--fs-lg);
        padding: 0;
        display: block;
        margin-top: 4px
    }

    .ga-eyebrow {
        font-size: var(--fs-badge);
        padding: 5px 12px;
        margin-bottom: 10px
    }
}

.ga-stats-bar {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    background: #ffffff1a;
    border-radius: 12px;
    overflow: hidden;
    margin: 48px 0 0
}

.ga-stats-bar__item {
    background: #ffffff0d;
    padding: 24px 16px;
    text-align: center
}

.ga-stats-bar__value {
    font-family: Gilroy, sans-serif;
    font-size: clamp(28px, 4vw, 40px);
    font-weight: 700;
    color: var(--ga-gold);
    line-height: 1;
    margin-bottom: 8px
}

.ga-stats-bar__label {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xs);
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #fff9
}

@media (max-width: 640px) {
    .ga-stats-bar {
        grid-template-columns: repeat(2, 1fr)
    }
}

.ga-video-wrapper {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    margin: 32px auto 0;
    background: #000
}

.ga-video-wrapper--vertical {
    max-width: 400px;
    aspect-ratio: 9 / 16
}

.ga-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    cursor: pointer
}

.ga-video__play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: #a40011d9;
    border: 2px solid rgba(255, 255, 255, .3);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform .2s, background .2s;
    z-index: 2
}

.ga-video__play-btn:hover {
    transform: translate(-50%, -50%) scale(1.08);
    background: #a40011
}

@media (max-width: 480px) {
    .ga-video-wrapper--vertical {
        max-width: 100%
    }
}

.ga-timeline-wrapper {
    max-width: 900px;
    margin: 0 auto;
    padding: 0 24px
}

@media (max-width: 500px) {
    .giannis-modal-panel {
        width: 100%;
        max-width: 100%;
        max-height: 85vh;
        border-radius: 16px 16px 0 0;
        top: auto;
        bottom: 0;
        left: 0;
        transform: translateY(100%);
        opacity: 1
    }

    .giannis-modal-panel--open {
        transform: translateY(0)
    }

    .giannis-modal-close {
        position: sticky;
        top: 0;
        right: 0;
        margin: 12px 12px -48px auto;
        z-index: 10
    }
}

@media (max-width: 500px) {
    .giannis-modal-image-wrapper {
        height: 220px
    }
}

.ga-scientists-section {
    padding-bottom: 80px
}

.ga-scientists-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px
}

.ga-scientist-card {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 2px 16px #0000000f;
    transition: transform .3s ease, box-shadow .3s ease
}

.ga-scientist-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 32px #0000001a
}

.ga-scientist-card__img-wrap {
    width: 100%;
    aspect-ratio: 1;
    overflow: hidden;
    background: linear-gradient(135deg, #e8d5c4, #d4c4b0)
}

.ga-scientist-card__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: grayscale(20%);
    transition: filter .3s ease
}

.ga-scientist-card:hover .ga-scientist-card__img {
    filter: grayscale(0%)
}

.ga-scientist-card__info {
    padding: 20px
}

.ga-scientist-card__name {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h4);
    font-weight: 400;
    color: var(--ga-text);
    margin: 0 0 4px;
    line-height: 1.3
}

.ga-scientist-card__title {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xs);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--ga-red);
    display: block;
    margin-bottom: 12px
}

.ga-scientist-card__bio {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    line-height: 1.5;
    color: var(--ga-muted);
    margin: 0
}

@media (max-width: 900px) {
    .ga-scientists-grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (max-width: 640px) {
    .ga-scientists-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px
    }

    .ga-scientist-card__info {
        padding: 12px
    }

    .ga-scientist-card__name {
        font-size: var(--fs-lg)
    }

    .ga-scientist-card__bio {
        font-size: var(--fs-sm);
        line-height: 1.4
    }

    .ga-scientist-card__title {
        font-size: 8px;
        margin-bottom: 6px
    }
}

.ga-ambassador-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin: 32px 0 0
}

.ga-ambassador-card__overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 8px 12px;
    background: linear-gradient(transparent, #0009)
}

.ga-ambassador-card__sport {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-badge);
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #ffffffe6
}

.ga-ambassador-card__info {
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 2px
}

.ga-ambassador-card__name {
    font-family: Gilroy, sans-serif;
    font-weight: 600;
    font-size: var(--fs-base);
    color: var(--ga-text)
}

@media (max-width: 640px) {
    .ga-ambassador-grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

.ga-numbers-section {
    padding: 80px 0 64px
}

.ga-section--dark.ga-numbers-section .ga-numbers-grid {
    border-radius: 0;
    background: #ffffff14
}

.ga-section--dark.ga-numbers-section .ga-badge {
    color: #fffc;
    border-color: #fff3
}

.ga-numbers-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: var(--ga-dark);
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 40px
}

.ga-numbers-grid__item {
    background: #ffffff0d;
    padding: 40px 24px;
    text-align: center
}

.ga-numbers-grid__value {
    font-family: Gilroy, sans-serif;
    font-size: clamp(36px, 6vw, 56px);
    font-weight: 700;
    color: var(--ga-gold);
    line-height: 1;
    margin-bottom: 12px
}

.ga-numbers-grid__label {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-lg);
    color: #ffffffb3;
    line-height: 1.4
}

.ga-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-top: 32px
}

.ga-badge {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xs);
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ga-dark);
    padding: 8px 16px;
    border: 1px solid rgba(80, 0, 11, .15);
    border-radius: 100px
}

@media (max-width: 640px) {
    .ga-numbers-grid {
        grid-template-columns: 1fr
    }

    .ga-numbers-grid__item {
        padding: 28px 20px
    }
}

.ga-cta-section {
    background: var(--ga-cream);
    padding: 80px 0 0
}

@media (max-width: 640px) {
    .ga-cta-section {
        padding: 56px 0 0
    }
}

.ga-coupon-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #a4001114;
    border: 1.5px dashed var(--ga-red);
    border-radius: 100px;
    padding: 10px 24px;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-lg);
    color: var(--ga-red);
    cursor: pointer;
    transition: background .2s
}

.ga-coupon-btn:hover {
    background: #a4001124
}

.ga-coupon-btn__icon {
    font-size: var(--fs-lg)
}

.ga-coupon-btn__code {
    font-family: Gilroy, sans-serif;
    font-weight: 700;
    font-size: var(--fs-lg);
    letter-spacing: .06em;
    background: var(--ga-red);
    color: #fff;
    padding: 3px 12px;
    border-radius: 6px
}

.ga-cta-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: var(--ga-red);
    color: #fff;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: 14px 28px;
    border-radius: 100px;
    border: none;
    cursor: pointer;
    transition: background .2s
}

.ga-cta-btn:hover {
    background: var(--ga-dark)
}

.ga-cta-btn--sm {
    padding: 10px 20px;
    font-size: var(--fs-sm)
}

.ga-closing {
    background: #2a0a10;
    padding: 80px 0;
    margin-top: 0
}

.ga-closing__quote {
    text-align: center;
    margin: 0;
    padding: 0;
    border: none
}

.ga-closing__quote p {
    font-family: Gilroy, sans-serif;
    font-size: clamp(18px, 3.5vw, 30px);
    font-weight: 700;
    font-style: normal;
    line-height: 1.6;
    letter-spacing: .04em;
    color: var(--ga-gold);
    margin: 0 0 24px
}

.ga-closing__quote cite {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-md);
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #ffffff80;
    font-style: normal
}

@media (max-width: 640px) {
    .ga-closing {
        padding: 56px 0
    }
}

.ga-modal-overlay {
    position: fixed;
    inset: 0;
    background: #00000080;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px
}

.ga-modal {
    background: #fff;
    border-radius: 16px;
    max-width: 520px;
    width: 100%;
    max-height: 85vh;
    overflow-y: auto;
    position: relative
}

.ga-modal__close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #0000000d;
    border: none;
    cursor: pointer;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ga-text);
    transition: background .2s
}

.ga-modal__close:hover {
    background: #0000001a
}

.ga-coupon-popup {
    padding: 32px
}

.ga-coupon-popup h3 {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-2xl);
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--ga-text);
    margin: 0 0 12px
}

.ga-coupon-popup>p {
    font-size: var(--fs-lg);
    color: var(--ga-muted);
    margin: 0 0 20px;
    line-height: 1.5
}

.ga-coupon-popup__calc {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 20px
}

.ga-coupon-popup__row {
    background: var(--ga-cream);
    border: 1px solid var(--ga-border);
    border-radius: 12px;
    padding: 16px
}

.ga-coupon-popup__row>span:first-child {
    display: block;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-sm);
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ga-text);
    margin-bottom: 6px
}

.ga-coupon-popup__row>div {
    display: flex;
    align-items: baseline;
    gap: 10px
}

.ga-coupon-popup__old {
    font-size: var(--fs-2xl);
    color: var(--ga-muted);
    text-decoration: line-through
}

.ga-coupon-popup__new {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h3);
    font-weight: 700;
    color: var(--ga-red)
}

.ga-coupon-popup__save {
    display: block;
    font-size: var(--fs-md);
    color: var(--ga-red);
    font-weight: 500;
    margin-top: 4px
}

.ga-coupon-popup__code {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    background: var(--ga-cream);
    border: 1.5px dashed var(--ga-red);
    border-radius: 10px;
    padding: 14px
}

.ga-coupon-popup__code span {
    font-size: var(--fs-base);
    color: var(--ga-muted)
}

.ga-coupon-popup__code strong {
    font-family: Gilroy, sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: var(--ga-red);
    letter-spacing: .08em
}

.ga-sticky-cta {
    position: fixed;
    bottom: 16px;
    left: 50%;
    transform: translate(-50%);
    z-index: 1000;
    animation: ga-slideUp .3s ease-out;
    opacity: 1;
    transition: opacity .35s ease, transform .35s ease;
    pointer-events: auto
}

.ga-sticky-cta--hidden {
    opacity: 0;
    transform: translate(-50%) translateY(20px);
    pointer-events: none
}

.ga-sticky-cta__inner {
    display: flex;
    align-items: center;
    gap: 16px;
    background: var(--ga-dark);
    border-radius: 100px;
    padding: 8px 8px 8px 16px;
    box-shadow: 0 8px 32px #00000040, 0 2px 8px #00000026;
    border: 1px solid rgba(255, 255, 255, .08)
}

.ga-sticky-cta__left {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0
}

.ga-sticky-cta__avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    border: 1.5px solid rgba(255, 255, 255, .2);
    flex-shrink: 0
}

.ga-sticky-cta__text {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0
}

.ga-sticky-cta__label {
    font-family: Gilroy, sans-serif;
    font-weight: 700;
    font-size: var(--fs-sm);
    letter-spacing: .06em;
    color: var(--ga-gold);
    white-space: nowrap
}

.ga-sticky-cta__price {
    font-size: var(--fs-sm);
    color: #fff9;
    white-space: nowrap
}

.ga-cta-btn--sticky {
    border-radius: 100px;
    padding: 12px 24px;
    font-size: var(--fs-sm);
    flex-shrink: 0;
    white-space: nowrap
}

@media (max-width: 640px) {
    .ga-sticky-cta {
        bottom: 12px;
        left: 12px;
        right: 12px;
        transform: none
    }

    .ga-sticky-cta__inner {
        width: 100%;
        justify-content: space-between
    }

    .ga-sticky-cta__avatar {
        display: none
    }
}

@keyframes ga-slideUp {
    0% {
        transform: translate(-50%) translateY(100%);
        opacity: 0
    }

    to {
        transform: translate(-50%) translateY(0);
        opacity: 1
    }
}

@media (max-width: 640px) {
    @keyframes ga-slideUp {
        0% {
            transform: translateY(100%);
            opacity: 0
        }

        to {
            transform: translateY(0);
            opacity: 1
        }
    }
}

@media (min-width: 1024px) {
    .danny-timeline {
        grid-template-columns: repeat(5, 1fr) !important
    }

    .danny-timeline .giannis-timeline__item {
        border-bottom: 1px solid rgba(80, 0, 11, .1);
        border-right: 1px solid rgba(80, 0, 11, .1)
    }

    .danny-timeline .giannis-timeline__item:nth-child(5n) {
        border-right: none
    }

    .danny-timeline .giannis-timeline__item:nth-child(n+6) {
        border-bottom: none
    }
}

@media (min-width: 750px) and (max-width: 1023px) {
    .danny-timeline {
        grid-template-columns: repeat(3, 1fr)
    }

    .danny-timeline .giannis-timeline__item {
        border-bottom: 1px solid rgba(80, 0, 11, .1);
        border-right: 1px solid rgba(80, 0, 11, .1)
    }

    .danny-timeline .giannis-timeline__item:nth-child(3n) {
        border-right: none
    }

    .danny-timeline .giannis-timeline__item:nth-last-child(-n+1) {
        border-bottom: none
    }
}

.ga-champion-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    margin: 48px 0;
    border: 1px solid var(--ga-border);
    border-radius: 12px;
    overflow: hidden;
    background: #fff
}

.ga-champion-stats__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 32px 16px;
    text-align: center;
    border-right: 1px solid var(--ga-border)
}

.ga-champion-stats__item:last-child {
    border-right: none
}

.ga-champion-stats__value {
    font-family: Gilroy, sans-serif;
    font-size: clamp(28px, 5vw, 48px);
    font-weight: 400;
    color: var(--ga-dark);
    line-height: 1.1
}

.ga-champion-stats__label {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xs);
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ga-muted);
    margin-top: 8px
}

@media (max-width: 640px) {
    .ga-champion-stats {
        grid-template-columns: repeat(2, 1fr)
    }

    .ga-champion-stats__item {
        padding: 24px 12px
    }

    .ga-champion-stats__item:nth-child(2) {
        border-right: none
    }

    .ga-champion-stats__item:nth-child(1),
    .ga-champion-stats__item:nth-child(2) {
        border-bottom: 1px solid var(--ga-border)
    }
}

.ga-ambassador-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin: 40px 0 0
}

.ga-ambassador-card {
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 2px 12px #0000000f;
    transition: transform .3s
}

.ga-ambassador-card:hover {
    transform: translateY(-4px)
}

.ga-ambassador-card__img-wrap {
    position: relative;
    aspect-ratio: 3 / 4;
    overflow: hidden
}

.ga-ambassador-card__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block
}

.ga-ambassador-card__info {
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 2px
}

.ga-ambassador-card__name {
    font-family: Gilroy, sans-serif;
    font-weight: 600;
    font-size: var(--fs-lg);
    color: var(--ga-text)
}

.ga-ambassador-card__role {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xs);
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ga-red)
}

@media (max-width: 640px) {
    .ga-ambassador-cards {
        grid-template-columns: 1fr;
        gap: 16px
    }

    .ga-ambassador-card {
        display: grid;
        grid-template-columns: 100px 1fr
    }

    .ga-ambassador-card__img-wrap {
        aspect-ratio: 1
    }

    .ga-ambassador-card__info {
        display: flex;
        flex-direction: column;
        justify-content: center
    }
}

.ga-what-i-feel {
    margin: 48px 0;
    padding: 40px;
    background: #fff;
    border-radius: 12px;
    border: 1px solid var(--ga-border)
}

.ga-what-i-feel__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 16px
}

.ga-what-i-feel__list li {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-2xl);
    line-height: 1.6;
    color: var(--ga-text);
    padding-left: 28px;
    position: relative
}

.ga-what-i-feel__list li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 10px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--ga-gold)
}

.ga-routine {
    margin: 64px 0 0
}

.ga-routine__timeline {
    display: flex;
    flex-direction: column;
    gap: 0;
    border-left: 2px solid var(--ga-gold);
    margin-left: 20px
}

.ga-routine__item {
    display: flex;
    gap: 24px;
    padding: 24px 0 24px 32px;
    position: relative;
    border-bottom: 1px solid var(--ga-border)
}

.ga-routine__item:last-child {
    border-bottom: none
}

.ga-routine__item:before {
    content: "";
    position: absolute;
    left: -7px;
    top: 30px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--ga-gold);
    border: 2px solid var(--ga-cream)
}

.ga-routine__time {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-md);
    font-weight: 700;
    letter-spacing: .05em;
    color: var(--ga-red);
    white-space: nowrap;
    min-width: 80px;
    padding-top: 2px
}

.ga-routine__content {
    flex: 1
}

.ga-routine__title {
    font-family: Gilroy, sans-serif;
    font-weight: 600;
    font-size: var(--fs-h5);
    color: var(--ga-text);
    margin: 0 0 6px
}

.ga-routine__desc {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xl);
    line-height: 1.6;
    color: var(--ga-muted);
    margin: 0
}

@media (max-width: 640px) {
    .ga-routine__timeline {
        margin-left: 10px
    }

    .ga-routine__item {
        flex-direction: column;
        gap: 4px;
        padding: 20px 0 20px 24px
    }

    .ga-routine__time {
        min-width: auto
    }
}

.ga-what-i-feel__list--checks li:before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    width: auto;
    height: auto;
    border-radius: 0;
    background: none;
    font-size: var(--fs-h4);
    font-weight: 700;
    color: var(--ga-gold);
    line-height: 1.6
}

.ga-quote {
    background: linear-gradient(135deg, #4a0010, #7a0020 40%, #5a0015);
    border-radius: 16px;
    padding: 56px 40px 48px;
    margin: 48px 0;
    position: relative;
    text-align: center
}

.ga-quote:before {
    content: "“";
    font-family: Gilroy, sans-serif;
    font-size: 120px;
    color: var(--ga-gold);
    opacity: .5;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%);
    line-height: 1
}

.ga-quote p {
    font-family: Gilroy, sans-serif;
    font-size: clamp(22px, 3.5vw, 32px);
    font-style: italic;
    line-height: 1.55;
    color: #fffffff2;
    margin: 0;
    padding: 0 16px;
    border-left: none
}

@media (min-width: 768px) {
    .ga-quote {
        margin: 64px auto;
        max-width: 800px;
        padding: 64px 56px 56px
    }

    .ga-quote:before {
        font-size: 160px
    }
}

.ga-section--dark .ga-quote p {
    color: #fffffff2
}

.ga-section--dark .ga-quote:before {
    color: var(--ga-gold)
}

.ga-dream-photos {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin: 40px 0 0
}

.ga-dream-photos__item {
    margin: 0;
    overflow: hidden;
    border-radius: 12px
}

.ga-dream-photos__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 3/4
}

.ga-quote.ga-quote--gold {
    background: linear-gradient(135deg, #3a2a10, #5c3d14, #3a2a10);
    border-color: #c19a544d
}

.ga-quote.ga-quote--gold:before {
    color: #ffffff4d
}

.ga-quote.ga-quote--gold p {
    color: #f5e6c8
}

.ga-image-block--square {
    max-width: 500px;
    margin: 32px auto
}

.ga-image-block--square .ga-image-block__img {
    border-radius: 12px
}

@media (max-width: 600px) {
    .ga-dream-photos {
        gap: 10px;
        margin: 28px 0 0
    }

    .ga-dream-photos__item {
        border-radius: 8px
    }

    .ga-image-block--square {
        max-width: 100%;
        margin: 24px auto
    }
}

.ga-quote--sidebar {
    margin: 48px 0;
    padding: 24px 0 24px 28px;
    border: none;
    border-left: 3px solid var(--ga-gold);
    background: none;
    text-align: left;
    position: relative;
    border-radius: 0
}

.ga-quote--sidebar:before {
    display: none
}

.ga-quote--sidebar p {
    font-family: Gilroy, sans-serif;
    font-size: clamp(17px, 2.5vw, 22px);
    font-style: italic;
    line-height: 1.65;
    color: var(--ga-text);
    margin: 0;
    padding: 0
}

@media (min-width: 768px) {
    .ga-quote--sidebar {
        margin: 56px 0;
        padding-left: 36px
    }
}

.ga-routine-list {
    max-width: 640px;
    margin: 0 auto;
    display: flex;
    flex-direction: column
}

.ga-routine-list__item {
    display: flex;
    gap: 20px;
    padding: 20px 0;
    border-bottom: 1px solid var(--ga-border);
    align-items: flex-start
}

.ga-routine-list__item:first-child {
    padding-top: 0
}

.ga-routine-list__item:last-child {
    border-bottom: none
}

.ga-routine-list__item--goli {
    position: relative
}

.ga-routine-list__item--goli:after {
    content: "goli";
    position: absolute;
    top: 20px;
    right: 0;
    font-family: Gilroy, sans-serif;
    font-weight: 700;
    letter-spacing: .08em;
    color: var(--ga-red);
    background: #8b00001a;
    padding: 4px 10px;
    border-radius: 4px;
    border: 1px solid rgba(139, 0, 0, .25);
    font-size: var(--fs-xs)
}

.ga-routine-list__item--goli:first-child:after {
    top: 0
}

.ga-routine-list__time {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-sm);
    font-weight: 700;
    letter-spacing: .08em;
    color: var(--ga-red);
    white-space: nowrap;
    min-width: 70px;
    padding-top: 3px
}

.ga-routine-list__content {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0
}

.ga-routine-list__title {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-2xl);
    font-weight: 600;
    color: var(--ga-dark)
}

.ga-routine-list__desc {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-lg);
    line-height: 1.6;
    color: var(--ga-muted)
}

.ga-page .giannis-cta-section {
    text-align: center;
    position: relative
}

.ga-page .giannis-cta-product {
    display: grid;
    gap: 36px;
    max-width: 880px;
    margin: 0 auto;
    text-align: left;
    padding: 36px;
    background: #fff;
    border: 1px solid rgba(80, 0, 11, .06)
}

@media (min-width: 750px) {
    .ga-page .giannis-cta-product {
        grid-template-columns: 260px 1fr;
        gap: 48px;
        align-items: center;
        padding: 48px
    }
}

.ga-page .giannis-cta-product__img {
    width: 100%;
    max-width: 260px;
    margin: 0 auto;
    border-radius: 16px
}

.ga-page .giannis-cta-product__info h3 {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h1);
    font-weight: 400;
    font-style: normal;
    color: var(--ga-dark);
    margin-bottom: 12px
}

.ga-page .giannis-cta-product__desc {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xl);
    line-height: 1.65;
    color: var(--ga-muted);
    margin-bottom: 24px
}

.ga-page .giannis-cta-product__price {
    display: flex;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 24px;
    flex-wrap: wrap
}

.ga-page .giannis-cta-product__price-current {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h2);
    font-weight: 700;
    color: var(--ga-dark)
}

.ga-page .giannis-cta-product__price-original {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-2xl);
    color: #50000b59;
    text-decoration: line-through
}

.ga-page .giannis-cta-product__save {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xs);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #fff;
    background: var(--ga-red);
    padding: 4px 12px;
    border-radius: 100px
}

.ga-page .giannis-cta-buttons {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 24px
}

@media (min-width: 500px) {
    .ga-page .giannis-cta-buttons {
        flex-direction: row
    }
}

.ga-page .giannis-cta-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: var(--ga-red);
    color: #fff;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 14px 28px;
    border-radius: 100px;
    border: none;
    cursor: pointer;
    transition: background .2s
}

.ga-page .giannis-cta-btn:hover {
    background: var(--ga-dark)
}

.ga-page .giannis-cta-guarantees {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    color: var(--ga-muted)
}

.ga-page .giannis-cta-guarantees span {
    display: inline-flex;
    align-items: center;
    gap: 5px
}

.ga-page .giannis-cta-guarantees svg {
    color: #22c55e
}

.ga-page .giannis-best-seller-badge {
    position: absolute;
    top: -12px;
    right: -12px;
    z-index: 10;
    width: 62px;
    height: 62px;
    background: var(--ga-red);
    clip-path: polygon(50% 0%, 85% 15%, 100% 50%, 85% 85%, 50% 100%, 15% 85%, 0% 50%, 15% 15%);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center
}

@media (min-width: 750px) {
    .ga-page .giannis-best-seller-badge {
        top: -14px;
        right: -14px;
        width: 72px;
        height: 72px
    }
}

.ga-page .giannis-best-seller-badge__text {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-badge);
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: #fff;
    line-height: 1.25
}

@media (min-width: 750px) {
    .ga-page .giannis-best-seller-badge__text {
        font-size: 10.5px
    }
}

@media (max-width: 767px) {
    .ga-quote {
        margin: 32px -20px;
        border-radius: 0;
        padding-left: 24px;
        padding-right: 24px
    }

    .ga-quote.ga-quote--gold {
        margin: 32px -20px;
        border-radius: 0
    }
}

.danny-hero {
    background: linear-gradient(135deg, #50000b, #3a0008 60%, #2a0006);
    padding: 56px 0 64px
}

.danny-hero__box {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 32px
}

.danny-hero__grid {
    display: grid;
    grid-template-columns: 1fr minmax(0, 480px);
    gap: 40px;
    align-items: center
}

.danny-hero__content {
    display: flex;
    flex-direction: column;
    min-width: 0
}

.danny-hero__badge {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 6px;
    background: #ffffff1a;
    color: #fff;
    font-size: var(--fs-sm);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .1em;
    padding: 6px 14px;
    border-radius: 100px;
    margin-bottom: 24px;
    font-family: Gilroy, sans-serif
}

.danny-hero__headline {
    font-family: Gilroy, sans-serif;
    font-size: 46px;
    font-weight: 600;
    line-height: 1.08;
    color: #fff;
    margin: 0 0 20px;
    text-transform: uppercase;
    letter-spacing: -.02em
}

.danny-hero__sub {
    font-size: var(--fs-xl);
    line-height: 1.7;
    color: #ffffffb8;
    margin: 0 0 32px;
    max-width: 540px
}

.danny-hero__cta-group {
    display: flex;
    align-items: center;
    gap: 16px
}

.danny-hero__cta {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 8px;
    background: #a40011;
    color: #fff;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    padding: 16px 36px;
    border: none;
    border-radius: 100px;
    cursor: pointer;
    transition: background .2s, transform .15s
}

.danny-hero__cta:hover {
    background: #8a000e;
    transform: translateY(-1px)
}

.danny-hero__cta-secondary {
    background: none;
    border: none;
    font-family: var(--font-body-family, "Gilroy", sans-serif);
    font-size: var(--fs-lg);
    font-weight: 500;
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: #fff6;
    cursor: pointer;
    transition: opacity .2s ease, text-decoration-color .2s ease;
    white-space: nowrap;
    padding: 0
}

.danny-hero__cta-secondary:hover {
    opacity: .8;
    text-decoration-color: #ffffffb3
}

.danny-hero__image-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    min-width: 0
}

.danny-hero__gallery {
    position: relative;
    width: 100%;
    max-width: 480px;
    border-radius: 12px;
    overflow: hidden
}

.danny-hero__gallery-viewport {
    overflow: hidden;
    border-radius: 12px
}

.danny-hero__gallery-container {
    display: flex
}

.danny-hero__gallery-slide {
    flex: 0 0 100%;
    min-width: 0;
    position: relative
}

.danny-hero__image {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 0
}

.danny-hero__image--top {
    object-position: top
}

.danny-hero__gallery-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 4;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #00000059;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, .15);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .2s, transform .15s;
    padding: 0
}

.danny-hero__gallery-arrow:hover {
    background: #0000008c
}

.danny-hero__gallery-arrow--prev {
    left: 10px
}

.danny-hero__gallery-arrow--next {
    right: 10px
}

.danny-hero__gallery-dots {
    position: absolute;
    bottom: 16px;
    left: 50%;
    transform: translate(-50%);
    display: flex;
    gap: 6px;
    z-index: 4;
    padding: 6px 10px;
    background: #00000040;
    border-radius: 20px;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px)
}

.danny-hero__gallery-dot {
    width: 24px;
    height: 4px;
    border-radius: 2px;
    background: #ffffff59;
    border: none;
    padding: 0;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition: background .3s ease, width .35s ease;
    box-shadow: none
}

.danny-hero__gallery-dot--active {
    width: 36px;
    background: #ffffff40
}

.danny-hero__gallery-dot-progress {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 0%;
    background: #fff;
    border-radius: 2px
}

.danny-hero__gallery-dot-progress--filling {
    width: 100%;
    transition: width 4.5s linear
}

@media (max-width: 1100px) and (min-width: 769px) {
    .danny-hero__grid {
        grid-template-columns: 1fr minmax(0, 380px);
        gap: 28px
    }

    .danny-hero__headline {
        font-size: var(--fs-d1)
    }
}

@media (max-width: 768px) {
    .danny-hero {
        padding: 0 0 28px;
        overflow: hidden;
        max-width: 100vw
    }

    .danny-hero__box {
        padding: 0;
        max-width: 100%;
        overflow: hidden
    }

    .danny-hero__grid {
        grid-template-columns: 1fr;
        gap: 16px;
        max-width: 100%
    }

    .danny-hero__content {
        max-width: 100%;
        overflow: hidden;
        padding: 0 16px
    }

    .danny-hero__image-wrap {
        order: -1;
        max-width: none;
        width: 100%
    }

    .danny-hero__gallery {
        max-width: 100%;
        width: 100%;
        border-radius: 0
    }

    .danny-hero__gallery-viewport {
        border-radius: 0
    }

    .danny-hero__gallery-slide {
        aspect-ratio: 1
    }

    .danny-hero__image {
        max-width: 100%;
        aspect-ratio: 1 !important;
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 0;
        margin: 0 auto
    }

    .danny-hero__gallery-arrow {
        width: 30px;
        height: 30px
    }

    .danny-hero__gallery-arrow--prev {
        left: 6px
    }

    .danny-hero__gallery-arrow--next {
        right: 6px
    }

    .danny-hero__badge {
        font-size: var(--fs-xs);
        padding: 5px 12px;
        margin-bottom: 8px
    }

    .danny-hero__headline {
        font-size: var(--fs-h2-lg);
        margin-bottom: 8px
    }

    .danny-hero__sub {
        font-size: var(--fs-base);
        line-height: 1.55;
        margin-bottom: 12px
    }

    .danny-hero__cta-group {
        flex-direction: column;
        align-items: stretch;
        gap: 8px
    }

    .danny-hero__cta {
        width: 100%;
        text-align: center;
        justify-content: center;
        padding: 12px 24px;
        font-size: var(--fs-lg)
    }

    .danny-hero__cta-secondary {
        text-align: center;
        font-size: var(--fs-base)
    }
}

.lp-content-box {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 24px
}

.lp-offer {
    padding: 0;
    position: relative
}

.lp-offer__gradient {
    background: linear-gradient(180deg, #50000b, #3a0008);
    padding: 64px 0 48px
}

.lp-offer__header {
    text-align: center
}

.lp-offer__pill {
    display: inline-block;
    background: #ffffff1f;
    color: #fff;
    font-size: var(--fs-sm);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .1em;
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 20px;
    font-family: Gilroy, sans-serif
}

.lp-offer__headline {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-d2);
    font-weight: 600;
    color: #fff;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: -.01em
}

.lp-offer__desc {
    font-size: var(--fs-xl);
    line-height: 1.7;
    color: #ffffffb3;
    margin: 16px auto 0;
    max-width: 560px
}

@media (max-width: 768px) {
    .lp-offer__gradient {
        padding: 40px 0 32px
    }

    .lp-offer__headline {
        font-size: var(--fs-h2)
    }

    .lp-offer__desc {
        font-size: var(--fs-lg)
    }
}

.lp-dark-product .essentials-page-bg {
    background: linear-gradient(180deg, #3a0008, #50000b 8% 92%, #3a0008) !important
}

.lp-dark-product .essentials-hero-section {
    padding-top: 40px !important
}

.lp-dark-product .essentials-social-proof-row span {
    color: #ffffffd9 !important
}

.lp-dark-product .essentials-social-proof-row .essentials-social-proof-desktop span,
.lp-dark-product .essentials-social-proof-cycle__a,
.lp-dark-product .essentials-social-proof-cycle__b {
    color: #fff9 !important
}

.lp-dark-product h2 {
    color: #fff !important
}

.lp-dark-product .essentials-product-info-col>p {
    color: #fff9 !important
}

.lp-dark-product .essentials-tag-pill {
    background: #ffffff1f !important;
    color: #fff !important;
    border-color: #fff3 !important
}

.lp-dark-product .essentials-tag-pill:hover {
    background: #ffffff40 !important;
    color: #fff !important
}

.lp-dark-product .essentials-tag-pill--acai {
    background: #ffffff1f !important;
    border-color: #fff3 !important
}

.lp-dark-product .essentials-product-info-col>div>span,
.lp-dark-product .essentials-product-info-col>div>div>span {
    color: #ffffffd9 !important
}

.lp-dark-product .essentials-format-selector__btn {
    border-color: #ffffff26 !important;
    background: #ffffff0d !important
}

.lp-dark-product .essentials-format-selector__btn--active {
    border-color: #fff !important;
    background: #ffffff1a !important
}

.lp-dark-product .essentials-format-selector__label {
    color: #ffffffd9 !important
}

.lp-dark-product .essentials-format-selector__btn--active .essentials-format-selector__label {
    color: #fff !important
}

.lp-dark-product .essentials-format-selector__serving {
    color: #ffffff80 !important
}

.lp-dark-product .essentials-format-selector__badge {
    background: #fff !important;
    color: #a40011 !important
}

.lp-dark-product .essentials-acai-link {
    color: #fff9 !important
}

.lp-dark-product .essentials-product-info-col p {
    color: #ffffffd9 !important
}

.lp-dark-product .essentials-plan-card {
    background: #ffffff0d !important;
    border-color: #ffffff26 !important
}

.lp-dark-product .essentials-plan-card--active {
    background: #ffffff1a !important;
    border-color: #fff !important
}

.lp-dark-product .essentials-plan-card__name {
    color: #ffffffe6 !important
}

.lp-dark-product .essentials-plan-card__name span {
    color: #4ade80 !important
}

.lp-dark-product .essentials-plan-card__price {
    color: #fff !important
}

.lp-dark-product .essentials-plan-card__price-compare {
    color: #fff6 !important
}

.lp-dark-product .essentials-plan-card__price-suffix,
.lp-dark-product .essentials-plan-card__billing,
.lp-dark-product .essentials-plan-card__billing span,
.lp-dark-product .essentials-plan-card__serving {
    color: #ffffff80 !important
}

.lp-dark-product .essentials-plan-card__divider {
    background: #ffffff1a !important
}

.lp-dark-product .essentials-plan-card__benefits li {
    color: #ffffffb3 !important
}

.lp-dark-product .essentials-plan-card__benefits li svg path {
    fill: none !important;
    stroke: #ffffffb3 !important
}

.lp-dark-product .essentials-plan-card__benefits li svg circle {
    stroke: #ffffffb3 !important;
    fill: none !important
}

.lp-dark-product .essentials-savings-banner {
    background: #16a34a26 !important
}

.lp-dark-product .essentials-savings-banner span {
    color: #4ade80 !important
}

.lp-dark-product .essentials-plan-card__badge-pill {
    background: #fff !important;
    color: #a40011 !important
}

.lp-dark-product .essentials-plan-card__plus-text {
    color: #fff !important
}

.lp-dark-product .essentials-plan-card__plus-line {
    background: #fff3 !important
}

.lp-dark-product .essentials-plan-card svg circle {
    stroke: #ffffff80 !important;
    fill: none !important
}

.lp-dark-product .essentials-plan-card--active svg circle {
    stroke: #fff !important;
    fill: none !important
}

.lp-dark-product .essentials-plan-card--active svg circle:last-child {
    fill: #fff !important
}

.lp-dark-product .essentials-gallery-inner>div:first-child {
    display: none !important
}

.lp-dark-product .essentials-flavor-dropdown-trigger,
.lp-dark-product .essentials-flavor-dropdown-trigger:hover {
    background: #ffffff0d !important;
    border-color: #ffffff26 !important
}

.lp-dark-product .essentials-flavor-dropdown-trigger.essentials-flavor-dropdown-trigger--open {
    background: #ffffff1a !important;
    border-color: #fff !important
}

.lp-dark-product .essentials-flavor-label,
.lp-dark-product .essentials-flavor-dropdown-trigger--open .essentials-flavor-label {
    color: #fff !important
}

.lp-dark-product .essentials-flavor-desc {
    color: #ffffff80 !important
}

.lp-dark-product .essentials-flavor-img-wrap {
    background: #ffffff0f !important
}

.lp-dark-product .essentials-flavor-badge {
    background: #fff !important;
    color: #a40011 !important
}

.lp-dark-product .essentials-flavor-dropdown-menu {
    background: #280006f2 !important;
    border-color: #ffffff26 !important;
    box-shadow: 0 8px 32px #0006 !important
}

.lp-dark-product .essentials-flavor-dropdown-item {
    border-color: #ffffff14 !important
}

.lp-dark-product .essentials-flavor-dropdown-item:hover {
    background: #ffffff0d !important
}

.lp-dark-product .essentials-flavor-dropdown-item--active {
    background: #ffffff1a !important
}

.lp-dark-product .essentials-flavor-dropdown-item--active .essentials-flavor-label {
    color: #fff !important
}

.lp-dark-product .essentials-flavor-dropdown-item .essentials-flavor-label {
    color: #ffffffd9 !important
}

.lp-dark-product .essentials-flavor-dropdown-item .essentials-flavor-desc {
    color: #fff6 !important
}

.lp-dark-product .essentials-flavor-dropdown-trigger svg {
    color: #fff9 !important
}

.lp-dark-product .essentials-cta-button {
    background: #fff !important;
    color: #a40011 !important;
    box-shadow: 0 4px 16px #0003 !important
}

.lp-dark-product .essentials-cta-button:hover {
    background: #f5f5f5 !important;
    color: #a40011 !important;
    box-shadow: 0 6px 24px #0000004d !important
}

.lp-dark-product .essentials-trust-bar {
    border-color: #ffffff1f !important
}

.lp-dark-product .essentials-trust-bar__item {
    color: #ffffffb3 !important
}

.lp-dark-product .essentials-trust-bar__sep {
    color: #fff3 !important
}

.lp-dark-product .essentials-hsa-block {
    border-color: #ffffff1f !important
}

.lp-dark-product .essentials-hsa-block span {
    color: #ffffffb3 !important
}

.lp-dark-product .essentials-hsa-block svg path {
    fill: #ffffffb3 !important
}

.lp-dark-product .essentials-hsa-block:hover {
    background: #ffffff0a !important
}

.lp-dark-product .essentials-tabs-container {
    background: #ffffff0f !important;
    border-color: #ffffff1f !important
}

.lp-dark-product .essentials-tabs-container button {
    background: transparent !important;
    color: #ffffff80 !important
}

.lp-dark-product .essentials-tabs-container button[style*="border-bottom: 2px solid rgb(164, 0, 17)"],
.lp-dark-product .essentials-tabs-container button[style*="border-bottom: 2px solid #a40011"],
.lp-dark-product .essentials-tabs-container h3 {
    color: #fff !important
}

.lp-dark-product .essentials-tabs-container p {
    color: #fff9 !important
}

.lp-dark-product .essentials-tabs-container span[style*="color: rgb(164, 0, 17)"],
.lp-dark-product .essentials-tabs-container span[style*="color: #a40011"] {
    color: #fffc !important;
    background: #ffffff1a !important
}

.lp-dark-product .essentials-tabs-container div[style*="border-bottom: 1px solid rgba(164, 0, 17"] {
    border-color: #ffffff1a !important
}

.lp-dark-product .essentials-experts-grid>div {
    background: #ffffff0f !important;
    border-color: #ffffff1a !important
}

.lp-dark-product .essentials-experts-grid>div div[style*="color: rgb(80, 0, 11)"],
.lp-dark-product .essentials-experts-grid>div div[style*="color: #50000B"] {
    color: #fff !important
}

.lp-dark-product .essentials-experts-grid>div div[style*="color: #888"] {
    color: #ffffff80 !important
}

.lp-dark-product .essentials-tabs-container a {
    color: #dfce89cc !important
}

.lp-dark-product .essentials-tabs-container video {
    border-radius: 10px
}

.lp-dark-product .essentials-tabs-container div[style*="font-weight: 700"][style*="color: rgb(164, 0, 17)"] {
    color: #ffffffb3 !important
}

.lp-dark-product .essentials-tabs-container span[style*="color: rgb(80, 0, 11)"],
.lp-dark-product .essentials-tabs-container span[style*="color: #50000B"] {
    color: #fff !important
}

.lp-dark-product .essentials-tabs-container svg[style*="color: rgb(164, 0, 17)"] {
    color: #fff9 !important
}

.lp-dark-product .essentials-tabs-container div[style*="color: rgb(164, 0, 17)"][style*="text-transform: uppercase"] {
    color: #ffffffb3 !important
}

.lp-dark-product .essentials-tabs-container p[style*="color: rgb(80, 0, 11)"],
.lp-dark-product .essentials-tabs-container p[style*="color: #50000B"] {
    color: #ffffffd9 !important
}

.lp-dark-product .product-accordion li {
    border-color: #ffffff1a !important
}

.lp-dark-product .product-accordion .question h4 {
    color: #ffffffd9 !important
}

.lp-dark-product .product-accordion .answer p {
    color: black !important
}

.lp-dark-product .product-accordion .question:after {
    color: #fff6 !important
}

.lp-dark-product .product-accordion .answer span,
.lp-dark-product .product-accordion .answer .metafield-rich_text_field div {
    color: #fff9 !important
}

.lp-dark-product .essentials-fw-trust-bar {
    background: linear-gradient(135deg, #50000b08, #a400110f 40%, #50000b08) !important
}

.lp-dark-product .essentials-fw-trust-bar:before {
    background: linear-gradient(90deg, rgba(164, 0, 17, .04), transparent 20%, transparent 80%, rgba(164, 0, 17, .04)) !important
}

.lp-dark-product .essentials-fw-trust-bar__item {
    color: #50000b !important
}

.lp-dark-product .essentials-fw-trust-bar__item svg circle {
    fill: #a40011 !important
}

.lp-dark-product .essentials-fw-trust-bar__badge-label {
    color: #50000b !important
}

.lp-dark-product .essentials-fw-trust-bar__badge-box svg {
    stroke: #a40011 !important
}

.lp-dark-product .essentials-fw-trust-bar__badge-box svg *[stroke] {
    stroke: #a40011 !important
}

.lp-dark-product .essentials-fw-trust-bar__sparkle {
    background: #a400114d !important
}

.lp-dark-product .essentials-nsf-badge {
    background: #ffffff0f !important;
    border-color: #ffffff1f !important
}

.lp-dark-product .essentials-nsf-badge div[style*="color: #a40011"],
.lp-dark-product .essentials-nsf-badge div[style*="color: rgb(164, 0, 17)"] {
    color: #ffffffd9 !important
}

.lp-dark-product .essentials-nsf-badge div[style*="color: #666"] {
    color: #fff !important
}

.lp-dark-product .essentials-nsf-badge div[style*="color: #999"] {
    color: #ffffff73 !important
}

.lp-dark-product .essentials-nsf-badge div[style*="color: rgb(80, 0, 11)"],
.lp-dark-product .essentials-nsf-badge div[style*="color: #50000B"] {
    color: #fffc !important
}

.lp-dark-product .essentials-product-info-col button[style*="text-decoration: underline"] {
    color: #fff9 !important
}

.lp-dark-product .essentials-social-proof-row svg {
    filter: brightness(1.3)
}

.danny-athletes-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin: 32px 0 8px
}

.danny-athletes-grid__item {
    margin: 0;
    overflow: hidden;
    border-radius: 8px
}

.danny-athletes-grid__item img {
    width: 100%;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    display: block;
    border-radius: 8px
}

.danny-athletes-grid__item figcaption {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-md);
    color: #999;
    text-align: center;
    padding: 10px 0 0;
    font-style: italic
}

.danny-athletes-marquee {
    display: none
}

@media (max-width: 768px) {
    .danny-athletes-grid {
        display: none !important
    }

    .danny-athletes-marquee {
        display: block;
        overflow: hidden;
        width: 100vw;
        margin-left: calc(-50vw + 50%);
        margin-top: 24px;
        margin-bottom: 8px
    }

    .danny-athletes-marquee__track {
        display: flex;
        width: max-content;
        animation: danny-marquee-scroll 20s linear infinite
    }

    .danny-athletes-marquee__set {
        display: flex;
        gap: 12px;
        padding-right: 12px
    }

    .danny-athletes-marquee__item {
        margin: 0;
        flex-shrink: 0;
        width: 260px
    }

    .danny-athletes-marquee__item img {
        width: 100%;
        aspect-ratio: 4 / 5;
        object-fit: cover;
        display: block;
        border-radius: 8px
    }

    .danny-athletes-marquee__item figcaption {
        font-family: Gilroy, sans-serif;
        font-size: var(--fs-sm);
        color: #999;
        text-align: center;
        padding: 8px 0 0;
        font-style: italic
    }

    @keyframes danny-marquee-scroll {
        0% {
            transform: translate(0)
        }

        to {
            transform: translate(-50%)
        }
    }
}

.giannis-f1-life__bg-overlay,
.giannis-shareholder__bg-overlay {
    display: block !important
}

.giannis-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px
}

@media (min-width: 750px) {
    .giannis-container {
        padding: 0 40px
    }
}

@media (min-width: 1024px) {
    .giannis-container {
        padding: 0 48px
    }
}

.giannis-section {
    padding: 80px 0
}

@media (min-width: 1024px) {
    .giannis-section {
        padding: 120px 0
    }
}

.giannis-section--cream {
    background: #f9f2ed !important
}

.giannis-section--warm {
    background: #f5eaea !important
}

.giannis-fade-in {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .7s ease, transform .7s ease
}

.giannis-fade-in.giannis-visible {
    opacity: 1;
    transform: translateY(0)
}

.giannis-label {
    display: inline-block;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-sm);
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: #a40011;
    background: #a4001114;
    padding: 6px 16px;
    margin-bottom: 20px
}

.giannis-heading {
    font-family: Gilroy, sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #50000b;
    font-size: var(--fs-h1-lg);
    line-height: 1.15;
    margin-bottom: 20px
}

@media (min-width: 750px) {
    .giannis-heading {
        font-size: var(--fs-d3)
    }
}

@media (min-width: 1024px) {
    .giannis-heading {
        font-size: var(--fs-d5)
    }
}

.giannis-section-sub {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-2xl);
    line-height: 1.7;
    color: #50000b99;
    max-width: 560px;
    margin-bottom: 48px
}

.giannis-cta-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-lg);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    text-decoration: none;
    color: #fff;
    background: #a40011;
    padding: 16px 40px;
    border-radius: 100px;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    transition: background .25s ease, color .25s ease, border-color .25s ease
}

.giannis-cta-btn:hover {
    background: #8a000e
}

.giannis-cta-btn--secondary {
    background: transparent;
    color: #50000b;
    border: 1.5px solid #50000B
}

.giannis-cta-btn--secondary:hover {
    background: #50000b0d
}

.giannis-cta-btn--hero-secondary {
    color: #ffffffe6;
    border-color: #fff6;
    background: transparent
}

.giannis-cta-btn--hero-secondary:hover {
    background: #ffffff1a;
    border-color: #fff9;
    color: #fff
}

.giannis-hero {
    position: relative;
    display: flex;
    align-items: flex-end;
    min-height: 85vh;
    overflow: hidden;
    background: #0a0a0a
}

.giannis-hero__image-col {
    position: absolute;
    inset: 0
}

.giannis-hero__overlay {
    display: block !important;
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(to top, #000000eb, #000000bf 35%, #0006 60%, #00000026)
}

.giannis-hero__img {
    width: 100%;
    height: 100%;
    display: none;
    object-fit: cover;
    object-position: center top
}

.giannis-hero__img--mobile {
    display: block;
    object-position: center 30%
}

.giannis-hero__img--desktop {
    display: none
}

.giannis-hero__text-col {
    position: relative;
    z-index: 2;
    padding: 120px 20px 40px;
    color: #fff
}

@media (min-width: 750px) {
    .giannis-hero {
        flex-direction: row;
        align-items: stretch;
        min-height: 600px;
        max-height: 85vh
    }

    .giannis-hero__image-col {
        position: relative;
        flex: 0 0 45%
    }

    .giannis-hero__overlay {
        background: linear-gradient(to right, #0a0a0a00, #0a0a0a99 60%, #0a0a0af2)
    }

    .giannis-hero__img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center 20%
    }

    .giannis-hero__img--mobile {
        display: none
    }

    .giannis-hero__img--desktop {
        display: block
    }

    .giannis-hero__text-col {
        position: relative;
        z-index: auto;
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 60px 48px;
        background: linear-gradient(to right, #0a0a0a4d, #0a0a0ad9 25%, #0a0a0af2)
    }
}

@media (min-width: 1024px) {
    .giannis-hero {
        min-height: 640px
    }

    .giannis-hero__image-col {
        flex: 0 0 42%
    }

    .giannis-hero__text-col {
        padding: 80px 64px
    }
}

.giannis-hero__text-col .giannis-label {
    color: var(--goli-gold);
    background: #dfce8926
}

.giannis-hero__title {
    font-family: Gilroy, sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #fff;
    font-size: var(--fs-d1);
    line-height: 1.1;
    margin-bottom: 20px
}

@media (min-width: 750px) {
    .giannis-hero__title {
        font-size: var(--fs-d5)
    }
}

@media (min-width: 1024px) {
    .giannis-hero__title {
        font-size: var(--fs-d6)
    }
}

.giannis-hero__sub {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h4);
    line-height: 1.6;
    color: #ffffffd9;
    margin-bottom: 16px;
    max-width: 560px
}

.giannis-hero__intro {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xl);
    line-height: 1.7;
    color: #ffffffa6;
    margin-bottom: 8px;
    max-width: 560px
}

.giannis-hero__quote {
    margin: 16px 0 0;
    padding: 0;
    border: none;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xl);
    font-style: italic;
    color: #ffffff8c;
    letter-spacing: .01em;
    line-height: 1.5;
    max-width: 560px
}

.giannis-hero__quote p {
    margin: 0
}

.giannis-story-grid {
    display: grid;
    gap: 48px;
    margin-bottom: 64px
}

@media (min-width: 1024px) {
    .giannis-story-grid {
        grid-template-columns: 1fr 1fr;
        gap: 64px;
        align-items: start
    }
}

.giannis-story-text p {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-2xl);
    line-height: 1.75;
    color: #50000bb3;
    margin-bottom: 20px
}

.giannis-story-image {
    align-self: start
}

.giannis-story-image img {
    width: 100%;
    object-fit: cover;
    aspect-ratio: 1/1
}

.giannis-timeline {
    display: grid;
    gap: 0;
    border-top: 1px solid rgba(80, 0, 11, .1);
    margin-top: 48px
}

@media (min-width: 750px) {
    .giannis-timeline {
        grid-template-columns: repeat(3, 1fr)
    }
}

@media (min-width: 1024px) {
    .giannis-timeline {
        grid-template-columns: repeat(6, 1fr)
    }
}

.giannis-timeline__item {
    display: flex;
    flex-direction: column;
    padding: 24px 16px;
    border-bottom: 1px solid rgba(80, 0, 11, .1);
    cursor: pointer;
    transition: background .4s ease
}

.giannis-timeline__item:hover {
    background: #a4001108
}

@media (min-width: 750px) {
    .giannis-timeline__item {
        border-bottom: none;
        border-right: 1px solid rgba(80, 0, 11, .1)
    }

    .giannis-timeline__item:last-child {
        border-right: none
    }
}

.giannis-timeline__year {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h1);
    font-weight: 400;
    color: #a40011;
    margin-bottom: 8px
}

.giannis-timeline__event {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    line-height: 1.5;
    color: #50000b99
}

.giannis-timeline__plus {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-md);
    font-weight: 600;
    color: #a40011;
    margin-top: 8px;
    opacity: .5;
    transition: opacity .3s ease
}

@media (min-width: 750px) and (max-width: 1023px) {
    .giannis-timeline__plus {
        opacity: 0
    }

    .giannis-timeline__item:hover .giannis-timeline__plus {
        opacity: .7
    }
}

@media (min-width: 1024px) {
    .giannis-timeline__plus {
        display: none
    }
}

.giannis-f1-life {
    position: relative;
    padding: 80px 0;
    overflow: hidden
}

@media (min-width: 1024px) {
    .giannis-f1-life {
        padding: 120px 0
    }
}

.giannis-f1-life__bg {
    position: absolute;
    inset: 0
}

.giannis-f1-life__bg-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center
}

.giannis-f1-life__bg-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #50000beb, #50000be0, #50000bd1)
}

.giannis-f1-life__content {
    position: relative;
    z-index: 2
}

.giannis-f1-life__content .giannis-label {
    color: var(--goli-gold);
    background: #dfce891f
}

.giannis-f1-life__intro {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h5);
    line-height: 1.7;
    color: #fffc;
    max-width: 560px;
    margin-bottom: 48px
}

.giannis-demands-grid {
    display: grid;
    gap: 16px
}

@media (min-width: 750px) {
    .giannis-demands-grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (min-width: 1024px) {
    .giannis-demands-grid {
        grid-template-columns: repeat(3, 1fr)
    }
}

.giannis-demand-card {
    padding: 32px;
    background: #ffffff0f;
    border: 1px solid rgba(255, 255, 255, .08);
    transition: background .3s ease
}

.giannis-demand-card__icon {
    color: var(--goli-gold);
    margin-bottom: 16px
}

.giannis-demand-card__title {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h5);
    font-weight: 600;
    color: #fff;
    margin-bottom: 10px
}

.giannis-demand-card__desc {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-lg);
    line-height: 1.65;
    color: #ffffffa6
}

.giannis-pullquote {
    border-left: 3px solid #a40011;
    padding: 24px 32px;
    margin: 40px 0;
    background: #a400110a
}

.giannis-pullquote p {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h3);
    font-weight: 400;
    font-style: normal;
    line-height: 1.5;
    color: #50000b;
    margin-bottom: 12px
}

@media (min-width: 750px) {
    .giannis-pullquote p {
        font-size: var(--fs-h2-lg)
    }
}

.giannis-pullquote cite {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    font-style: normal;
    letter-spacing: .08em;
    color: #50000b80
}

.giannis-pullquote--light {
    border-left-color: var(--goli-gold);
    background: #ffffff0f
}

.giannis-pullquote--light p {
    color: #ffffffe6
}

.giannis-pullquote--light cite {
    color: #ffffff80
}

.giannis-why-grid {
    display: grid;
    gap: 48px
}

@media (min-width: 1024px) {
    .giannis-why-grid {
        grid-template-columns: 1fr 1fr;
        gap: 64px;
        align-items: start
    }
}

.giannis-why-text p {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-2xl);
    line-height: 1.75;
    color: #50000bb3;
    margin-bottom: 20px
}

.giannis-why-text h3 {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h4);
    font-weight: 600;
    color: #50000b;
    margin-bottom: 16px;
    margin-top: 32px
}

.giannis-why-image img {
    width: 100%;
    object-fit: cover;
    aspect-ratio: 1/1
}

@media (min-width: 1024px) {
    .giannis-why-image img {
        aspect-ratio: auto;
        max-height: 600px
    }
}

.giannis-benefits-list {
    display: flex;
    flex-direction: column;
    gap: 10px
}

.giannis-benefit-item {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xl);
    color: #50000bcc;
    padding: 14px 18px;
    background: #a400110a
}

.giannis-benefit-icon {
    color: #a40011;
    flex-shrink: 0
}

.giannis-routine-section {
    background: #f9f2ed !important
}

.giannis-routine-cards {
    display: grid;
    gap: 16px;
    max-width: 100%;
    overflow: hidden
}

@media (min-width: 750px) {
    .giannis-routine-cards {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (min-width: 1024px) {
    .giannis-routine-cards {
        grid-template-columns: repeat(4, 1fr)
    }
}

.giannis-routine-card {
    background: #fff;
    padding: 20px;
    border: 1px solid rgba(80, 0, 11, .06);
    transition: box-shadow .3s ease;
    aspect-ratio: 1 / 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden
}

.giannis-routine-card--no-hover:hover {
    box-shadow: none
}

.giannis-routine-card--goli {
    border: 1px solid var(--goli-gold);
    background: #fff
}

.giannis-routine-card__time {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xs);
    font-weight: 700;
    letter-spacing: .12em;
    color: #a40011;
    margin-bottom: 6px
}

.giannis-routine-card__title {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-lg);
    font-weight: 600;
    color: #50000b;
    margin-bottom: 6px
}

.giannis-routine-card__desc {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-md);
    line-height: 1.5;
    color: #50000b8c;
    margin-bottom: 8px;
    flex: 1;
    overflow: hidden
}

.giannis-routine-card__goli {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px;
    background: #dfce891f;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-sm);
    font-weight: 500;
    color: #50000b;
    margin-top: auto;
    line-height: 1.4
}

.giannis-routine-card__goli-img {
    width: 24px;
    height: 24px;
    object-fit: cover;
    flex-shrink: 0;
    border-radius: 4px
}

.giannis-science-grid {
    display: grid;
    gap: 20px
}

@media (min-width: 750px) {
    .giannis-science-grid {
        grid-template-columns: repeat(3, 1fr)
    }
}

.giannis-science-card {
    text-align: center;
    padding: 48px 28px;
    background: #fff;
    transition: box-shadow .3s ease
}

.giannis-science-card:hover {
    box-shadow: 0 4px 16px #50000b0f
}

.giannis-science-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    background: #50000b;
    color: #fff;
    margin-bottom: 20px
}

.giannis-science-card__title {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h5);
    font-weight: 600;
    color: #50000b;
    margin-bottom: 10px
}

.giannis-science-card__desc {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-lg);
    line-height: 1.65;
    color: #50000b99
}

.giannis-shareholder {
    position: relative;
    padding: 80px 0;
    overflow: hidden
}

.giannis-shareholder__bg {
    position: absolute;
    inset: 0
}

.giannis-shareholder__bg-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 30%
}

.giannis-shareholder__bg-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #50000beb, #50000be0, #50000bd1)
}

.giannis-shareholder__content {
    position: relative;
    z-index: 2
}

.giannis-shareholder__content .giannis-label {
    color: var(--goli-gold);
    background: #dfce891f;
    font-weight: 700
}

.giannis-shareholder__content .giannis-heading {
    color: #fff
}

.giannis-shareholder__text p {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-2xl);
    line-height: 1.8;
    color: #ffffffd9;
    margin-bottom: 20px;
    max-width: 620px
}

@media (min-width: 1024px) {
    .giannis-shareholder {
        padding: 120px 0
    }
}

.giannis-shareholder-points {
    display: grid;
    gap: 10px;
    max-width: 480px
}

.giannis-shareholder-point {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xl);
    color: #ffffffe6;
    padding: 14px 18px;
    background: #ffffff0f;
    border: 1px solid rgba(255, 255, 255, .08)
}

.giannis-cta-section {
    text-align: center;
    position: relative
}

.giannis-cta-section .giannis-section-sub {
    margin-left: auto;
    margin-right: auto
}

.giannis-cta-product {
    display: grid;
    gap: 36px;
    max-width: 880px;
    margin: 0 auto;
    text-align: left;
    padding: 36px;
    background: #fff;
    border: 1px solid rgba(80, 0, 11, .06)
}

@media (min-width: 750px) {
    .giannis-cta-product {
        grid-template-columns: 260px 1fr;
        gap: 48px;
        align-items: center;
        padding: 48px
    }
}

.giannis-cta-product__img {
    width: 100%;
    max-width: 260px;
    margin: 0 auto;
    border-radius: 16px
}

.giannis-cta-product__info h3 {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h1);
    font-weight: 400;
    font-style: normal;
    color: #50000b;
    margin-bottom: 12px
}

.giannis-cta-product__desc {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xl);
    line-height: 1.65;
    color: #50000b99;
    margin-bottom: 24px
}

.giannis-cta-product__price {
    display: flex;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 24px;
    flex-wrap: wrap
}

.giannis-cta-product__price-current {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h2);
    font-weight: 700;
    color: #50000b
}

.giannis-cta-product__price-original {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-2xl);
    color: #50000b59;
    text-decoration: line-through
}

.giannis-cta-product__save {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xs);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #fff;
    background: #a40011;
    padding: 4px 12px;
    border-radius: 100px
}

.giannis-cta-buttons {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 24px
}

@media (min-width: 500px) {
    .giannis-cta-buttons {
        flex-direction: row
    }
}

.giannis-cta-guarantees {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    color: #50000b80
}

.giannis-cta-guarantees span {
    display: inline-flex;
    align-items: center;
    gap: 5px
}

.giannis-cta-guarantees svg {
    color: #22c55e
}

.giannis-best-seller-badge {
    position: absolute;
    top: -12px;
    right: -12px;
    z-index: 10;
    width: 62px;
    height: 62px;
    background: #a40011;
    clip-path: polygon(50% 0%, 85% 15%, 100% 50%, 85% 85%, 50% 100%, 15% 85%, 0% 50%, 15% 15%);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center
}

@media (min-width: 750px) {
    .giannis-best-seller-badge {
        top: -14px;
        right: -14px;
        width: 72px;
        height: 72px
    }
}

.giannis-best-seller-badge__text {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-badge);
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: #fff;
    line-height: 1.25
}

@media (min-width: 750px) {
    .giannis-best-seller-badge__text {
        font-size: 10.5px
    }
}

@media (max-width: 749px) {
    .giannis-hero__text-col {
        padding-top: 120px
    }

    .giannis-hero__title {
        font-size: var(--fs-h1-lg)
    }

    .giannis-hero__sub {
        font-size: var(--fs-xl);
        margin-bottom: 12px;
        line-height: 1.5
    }

    .giannis-hero__intro {
        font-size: var(--fs-base);
        margin-bottom: 6px;
        line-height: 1.6
    }

    .giannis-hero__title {
        margin-bottom: 14px
    }

    .giannis-heading {
        font-size: var(--fs-h1)
    }

    .giannis-pullquote p {
        font-size: 20px
    }

    .giannis-cta-product__info h3 {
        font-size: var(--fs-h2)
    }

    .giannis-cta-btn {
        padding: 14px 28px;
        font-size: var(--fs-base)
    }

    .giannis-routine-card {
        aspect-ratio: auto
    }
}

.giannis-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 9998;
    background: #0000;
    transition: background .35s ease;
    pointer-events: none
}

.giannis-modal-backdrop--open {
    background: #0009;
    pointer-events: auto
}

.giannis-modal-panel {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 9999;
    width: 92%;
    max-width: 450px;
    max-height: 90vh;
    background: #fff;
    border-radius: 12px;
    transform: translate(-50%, -50%) scale(.92);
    opacity: 0;
    transition: transform .45s cubic-bezier(.22, 1, .36, 1), opacity .35s ease;
    overflow-y: auto;
    box-shadow: 0 24px 80px #00000040;
    pointer-events: none
}

.giannis-modal-panel--open {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
    pointer-events: auto
}

@media (max-width: 500px) {
    .giannis-modal-panel {
        width: 100%;
        max-width: 100%;
        max-height: 100vh;
        border-radius: 0;
        top: 0;
        left: 0;
        transform: translateY(100%);
        opacity: 1
    }

    .giannis-modal-panel--open {
        transform: translateY(0)
    }
}

.giannis-modal-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 36px;
    height: 36px;
    border: none;
    background: #ffffffb3;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #50000b;
    font-size: var(--fs-h4);
    transition: background .2s ease;
    z-index: 2;
    box-shadow: 0 2px 8px #0000001a
}

.giannis-modal-close:hover {
    background: #ffffffe6
}

.giannis-modal-image-wrapper {
    position: relative;
    width: 100%;
    height: 240px;
    background: linear-gradient(135deg, #d4a0a0, #c47070, #b85050);
    overflow: hidden
}

.giannis-modal-image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity .5s ease
}

.giannis-modal-image-wrapper img.loaded {
    opacity: 1
}

@media (max-width: 500px) {
    .giannis-modal-image-wrapper {
        height: 220px
    }

    .giannis-modal-panel {
        border-radius: 0
    }
}

.giannis-modal-body {
    padding: 32px 28px 40px
}

.giannis-modal-year {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-d4);
    font-weight: 400;
    color: #a40011;
    line-height: 1;
    margin-bottom: 8px
}

.giannis-modal-title {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h2);
    font-weight: 400;
    color: #50000b;
    line-height: 1.3;
    margin-bottom: 20px
}

.giannis-modal-text {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xl);
    line-height: 1.7;
    color: #50000bb3;
    margin-bottom: 16px
}

.giannis-modal-stat {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-sm);
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #a40011;
    background: #a4001114;
    padding: 8px 16px;
    margin-top: 8px
}

.giannis-numbers {
    padding: 48px 0;
    background: #50000b !important;
    overflow: hidden
}

@media (min-width: 1024px) {
    .giannis-numbers {
        padding: 64px 0
    }
}

.giannis-numbers__header {
    text-align: center;
    margin-bottom: 40px
}

.giannis-numbers__label {
    display: inline-block;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-sm);
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: var(--goli-gold, #DFCE89);
    background: #dfce891f;
    padding: 6px 16px;
    margin-bottom: 16px
}

.giannis-numbers__title {
    font-family: Gilroy, sans-serif;
    font-weight: 400;
    font-size: var(--fs-h1-lg);
    color: #fff;
    line-height: 1.2
}

@media (min-width: 750px) {
    .giannis-numbers__title {
        font-size: var(--fs-d3)
    }
}

.giannis-numbers__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px 24px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px
}

@media (min-width: 750px) {
    .giannis-numbers__grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 40px;
        padding: 0 40px
    }
}

@media (min-width: 1024px) {
    .giannis-numbers__grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 48px;
        padding: 0 48px
    }
}

.giannis-numbers__item {
    text-align: center
}

.giannis-numbers__value {
    font-family: Gilroy, sans-serif;
    font-weight: 400;
    font-size: 44px;
    color: #fff;
    line-height: 1;
    margin-bottom: 8px;
    font-variant-numeric: tabular-nums
}

@media (min-width: 750px) {
    .giannis-numbers__value {
        font-size: 56px
    }
}

.giannis-numbers__suffix {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-2xl);
    color: #ffffff80
}

.giannis-numbers__desc {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    line-height: 1.5;
    color: #ffffff80;
    margin-top: 4px
}

.giannis-numbers__divider {
    display: block !important;
    width: 24px;
    height: 2px;
    background: var(--goli-gold, #DFCE89);
    margin: 12px auto 0;
    opacity: .4
}

.giannis-hover-card {
    position: fixed;
    z-index: 9990;
    width: 380px;
    max-height: 480px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 16px 60px #0000002e, 0 4px 16px #00000014;
    overflow: hidden;
    pointer-events: none;
    opacity: 0;
    transform: translateY(12px) scale(.97);
    transition: opacity .25s cubic-bezier(.4, 0, .2, 1), transform .25s cubic-bezier(.4, 0, .2, 1);
    will-change: opacity, transform, top, left, right
}

.giannis-hover-card--visible {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto
}

.giannis-hover-card__image {
    width: 100%;
    height: 180px;
    background: linear-gradient(135deg, #d4a0a0, #c47070, #b85050);
    overflow: hidden
}

.giannis-hover-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity .4s ease
}

.giannis-hover-card__image img.loaded {
    opacity: 1
}

.giannis-hover-card__body {
    padding: 20px
}

.giannis-hover-card__year {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h1-lg);
    font-weight: 400;
    color: #a40011;
    line-height: 1;
    margin-bottom: 4px
}

.giannis-hover-card__title {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-h4);
    font-weight: 400;
    color: #50000b;
    line-height: 1.3;
    margin-bottom: 12px
}

.giannis-hover-card__text {
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-base);
    line-height: 1.6;
    color: #50000ba6;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.giannis-hover-card__stat {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: Gilroy, sans-serif;
    font-size: var(--fs-xs);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #a40011;
    background: #a4001114;
    padding: 6px 12px;
    margin-top: 12px
}
/* ─── zsv3 typography utilities ─────────────────────────────────────────── */

/* Announcement bar */
.zsv3-announcement__badge {
  font-family: var(--font-body-family);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-lg);
  text-transform: uppercase;
  white-space: nowrap;
}
.zsv3-announcement__text {
  font-family: var(--font-body-family);
  font-size: var(--fs-base);
  font-weight: var(--fw-regular);
  white-space: nowrap;
}

/* Rating / social proof row */
.zsv3-rating__score {
  font-family: var(--font-body-family);
  font-size: var(--fs-base);
  font-weight: var(--fw-semibold);
  color: #1a1a1a;
}
.zsv3-rating__count {
  font-family: var(--font-body-family);
  font-size: var(--fs-md);
  font-weight: var(--fw-regular);
  color: #1a1a1a;
}
.zsv3-proof__sep {
  font-size: var(--fs-sm);
  color: #ccc;
}
.zsv3-proof__stat {
  font-family: var(--font-body-family);
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  color: var(--goli-red);
}

/* Product title / subtitle / description */
.zsv3-product__title {
  font-family: var(--font-body-family);
  font-size: var(--fs-h2-lg);
  font-weight: var(--fw-semibold);
  line-height: 1.15;
  margin: 0 0 4px;
  color: #1a1a1a;
}
.zsv3-product__subtitle {
  font-family: var(--font-body-family);
  font-size: var(--fs-xl);
  font-weight: var(--fw-regular);
  color: #888;
  margin: 0 0 6px;
  letter-spacing: var(--ls-xs);
}
.zsv3-product__desc {
  font-family: var(--font-body-family);
  font-size: var(--fs-lg);
  color: black;
  margin: 0 0 10px;
  line-height: 1.6;
}

/* Welcome kit badge text */
.zsv3-badge__big {
  font-size: var(--fs-h4);
  font-weight: var(--fw-extrabold);
  letter-spacing: var(--ls-xl);
  line-height: 1;
}
.zsv3-badge__small {
  font-size: var(--fs-badge);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-lg);
  line-height: 1.3;
}

/* Subscribe & save heading */
.zsv3-subscribe-save {
  font-family: var(--font-body-family);
  font-size: var(--fs-base);
  font-weight: var(--fw-semibold);
  margin-bottom: 10px;
  color: var(--goli-burgundy);
  letter-spacing: var(--ls-sm);
}

/* One-time purchase button */
.zsv3-otp-btn {
  background: none;
  border: none;
  cursor: pointer;
  font-family: var(--font-body-family);
  font-size: var(--fs-lg);
  color: var(--goli-burgundy);
  text-decoration: underline;
  text-underline-offset: 3px;
  font-weight: var(--fw-regular);
  padding: 8px 0;
  transition: opacity 0.2s;
}

/* Expert card (zsv3-hero-part5) */
.zsv3-expert__name {
  font-family: var(--font-body-family);
  font-size: var(--fs-md);
  font-weight: var(--fw-semibold);
  color: var(--goli-burgundy);
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.zsv3-expert__role {
  font-family: var(--font-body-family);
  font-size: var(--fs-sm);
  color: #888;
  line-height: 1.4;
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.zsv3-expert__desc {
  font-family: var(--font-body-family);
  font-size: var(--fs-md);
  color: #666;
  margin: 0 0 14px;
  line-height: 1.6;
}
.zsv3-expert__link {
  font-family: var(--font-body-family);
  font-size: var(--fs-md);
  font-weight: var(--fw-medium);
  color: #8b7424;
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: opacity 0.15s;
}

/* CPR section additions */
.cpr-header__title {
  font-family: var(--font-body-family);
  font-size: var(--fs-2xl);
  font-weight: var(--fw-semibold);
  color: #fff;
  margin: 0;
}
.cpr-study-note {
  font-family: var(--font-body-family);
  font-size: var(--fs-sm);
  color: rgba(255,255,255,0.45);
  margin-bottom: 12px;
  font-style: italic;
}

/* Tab button active state */
.essentials-tab-btn--active {
  background: #fff;
  color: var(--goli-burgundy);
  border-bottom-color: var(--goli-red);
}

/* ── Announcement bar ── */
.essentials-product-info-col .essentials-plan-card__radio {
  width: auto !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.essentials-page-bg {
  padding-top: 37px;
}

.essentials-announcement {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
}

.essentials-announcement__bar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 9px 20px;
  background: #a40011;
  color: #fff;
  transition: opacity 0.25s, transform 0.25s;
}

.essentials-announcement__pill {
  display: none;
  align-items: center;
  gap: 10px;
  padding: 11px 24px;
  background: #a40011;
  color: #fff;
  border-radius: 28px;
  font-family: var(--font-body-family);
  font-size: var(--fs-lg);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--ls-xs);
  white-space: normal;
  max-width: 320px;
  text-align: center;
  line-height: 1.35;
  box-shadow: 0 4px 24px rgba(164,0,17,0.35);
  animation: zsv3-pill-pulse 2.8s ease-in-out infinite;
  transform-origin: center;
}

.essentials-announcement__pill-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
}

.essentials-announcement__pill-line1 {
  font-size: var(--fs-lg);
  font-weight: var(--fw-semibold);
  line-height: 1.2;
}

.essentials-announcement__pill-line2 {
  font-size: var(--fs-md);
  font-weight: var(--fw-medium);
  opacity: 0.85;
  line-height: 1.2;
}

.essentials-announcement__pill svg {
  animation: zsv3-arrow-nudge 1.6s ease-in-out infinite;
}

.essentials-announcement__pill:hover svg {
  animation: none;
  transform: translateX(6px);
  transition: transform 0.18s ease;
}

.essentials-announcement--scrolled {
  background: transparent;
  padding: 10px 0;
  top: 4px;
}

.essentials-announcement--scrolled .essentials-announcement__bar {
  display: none;
}

.essentials-announcement--scrolled .essentials-announcement__pill {
  display: flex;
}

@keyframes zsv3-arrow-nudge {
  0%, 100% { transform: translateX(0);   opacity: 1; }
  40%       { transform: translateX(5px); opacity: 1; }
  55%       { transform: translateX(2px); opacity: 0.7; }
  70%       { transform: translateX(6px); opacity: 1; }
  85%       { transform: translateX(0);   opacity: 1; }
}

@keyframes zsv3-pill-pulse {
  0%, 100% { box-shadow: 0 4px 24px rgba(164,0,17,0.35), 0 0 0 0 rgba(164,0,17,0.18); }
  50%       { box-shadow: 0 4px 24px rgba(164,0,17,0.35), 0 0 0 9px rgba(164,0,17,0); }
}

/* ── Reviews Masonry (zsv3-mark05) ── */
.rm-section {
  padding: 56px 0 48px;
  background: #f4f1ee;
  color: var(--goli-burgundy);
  font-family: var(--font-body-family);
}
.rm-header {
  text-align: center;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}
.rm-section .os-badge {
  display: inline-block;
  color: var(--goli-red);
  background-color: rgba(164, 0, 17, 0.07);
  border-radius: 20px;
  font-weight: var(--fw-bold);
  letter-spacing: 1.65px;
}
.rm-section .os-title {
  font-size: var(--fs-h1-lg);
  margin: 0 0 4px;
  color: var(--goli-burgundy);
  font-weight: var(--fw-bold);
  letter-spacing: -0.64px;
  text-transform: uppercase;
}
.rm-header__desc {
  font-size: var(--fs-2xl);
  margin: 0 0 12px;
  color: rgba(80, 0, 11, 0.55);
  letter-spacing: var(--ls-sm);
}
.rm-section .os-subtitle {
  margin: 0 auto 16px;
  color: rgba(80, 0, 11, 0.6);
}
.rm-trustpilot-header {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 32px;
}
.rm-tp-dark-badge {
  width: 250px;
  height: auto;
  image-rendering: -webkit-optimize-contrast;
}
.rm-masonry-wrap {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}
.rm-masonry {
  columns: 4;
  column-gap: 16px;
}
.rm-blur-overlay {
  display: block !important;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 120px;
  background: linear-gradient(to bottom, rgba(244,241,238,0) 0%, rgba(244,241,238,0.7) 40%, rgba(244,241,238,1) 100%);
  pointer-events: none;
  z-index: 2;
}
.rm-card {
  break-inside: avoid;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.rm-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0,0,0,0.08);
}
.rm-card__stars {
  display: flex;
  align-items: center;
  line-height: 1;
}
.rm-card__quote {
  font-family: var(--font-body-family);
  font-size: var(--fs-base);
  line-height: 1.65;
  color: rgb(68, 68, 68);
  margin: 0;
}
.rm-card__footer {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-top: 10px;
  border-top: 1px solid #f0f0f0;
}
.rm-card__avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-family: var(--font-body-family);
  font-size: var(--fs-md);
  font-weight: var(--fw-bold);
  flex-shrink: 0;
}
.rm-card__author-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.rm-card__author-name {
  font-family: var(--font-body-family);
  font-size: var(--fs-base);
  font-weight: var(--fw-semibold);
  color: var(--goli-burgundy);
}
.rm-card__verified {
  display: flex;
  align-items: center;
  gap: 4px;
  font-family: var(--font-body-family);
  font-size: var(--fs-sm);
  color: rgb(17, 17, 17);
  font-weight: var(--fw-medium);
}
.rm-footer {
  text-align: center;
  margin-top: 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  position: relative;
  z-index: 3;
}
.rm-show-more {
  color: var(--goli-red);
  background: transparent;
  border: 1.5px solid var(--goli-red);
  border-radius: 50px;
  font-family: var(--font-body-family);
  font-weight: var(--fw-semibold);
  letter-spacing: 0.48px;
  text-transform: uppercase;
  padding: 10px 22px;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.rm-show-more:hover {
  background-color: var(--goli-red);
  color: #fff;
}
.rm-show-more:disabled {
  opacity: 0.65;
  cursor: wait;
}
@media (min-width: 769px) {
  .rm-section .os-title { font-size: var(--fs-d1); }
  .rm-header__desc      { font-size: var(--fs-h5); }
  .rm-section .os-subtitle { font-size: var(--fs-lg); }
  .rm-card__quote       { font-size: var(--fs-lg); }
  .rm-card__author-name { font-size: var(--fs-lg); }
  .rm-card__verified    { font-size: var(--fs-md); }
}
@media (max-width: 1024px) {
  .rm-masonry { columns: 3; }
}
@media (max-width: 768px) {
  .rm-section { padding: 40px 0 36px; }
  .rm-masonry { columns: 2; column-gap: 12px; }
  .rm-card { padding: 16px; border-radius: 8px; }
  .rm-card__quote { font-size: var(--fs-md); }
  .rm-card__avatar { width: 28px; height: 28px; font-size: var(--fs-xs); }
  .rm-blur-overlay { height: 90px; }
  #yotpo-masonry:not(.rm-masonry--expanded) .rm-card:nth-child(n+6) { display: none; }
}
@media (max-width: 480px) {
  .rm-masonry { columns: 1; }
}