/* =============================================================================
   StickersFox "Forest Fox" design tokens (storefront + shared app.css)
   ============================================================================= */
:root {
    --color-nav: #1E3A2F;
    --color-nav-hover: #2A4F40;
    --color-brand: #E8581A;
    --color-brand-hover: #D04D15;
    --color-brand-pressed: #B84412;
    --color-accent: #F5A623;
    --color-page: #FAF8F5;
    --color-surface: #FFFFFF;
    --color-surface-subtle: #F4F1EC;
    --color-brand-tint: #FEF0EA;
    --color-ink: #1A1A1A;
    --color-ink-soft: #2D2D2D;
    --color-ink-muted: #6B6B6B;
    --color-ink-faint: #999999;
    --color-border: #E5E0D8;
    --color-border-alpha: rgba(26, 26, 26, 0.08);
    --sf-brand-rgb: 232, 88, 26;
    --sf-accent-rgb: 245, 166, 35;
    --sf-ink-rgb: 26, 26, 26;
    --bs-primary: #E8581A;
    --bs-primary-rgb: 232, 88, 26;
}


/* Hero: override orange gradient with Forest Fox nav green (desktop + mobile) */
.hero-main-box.bg-gradient {
    background: var(--color-nav) !important;
}body {
    background-color: var(--color-page);
    color: var(--color-ink);
}

/* bootstrap.min.css (v5 beta2) hardcodes legacy orange on .btn-primary; sync to Forest Fox tokens */
.btn-primary {
    color: var(--color-surface);
    background-color: var(--color-brand);
    background-image: none;
    border-color: var(--color-brand);
}

.btn-primary:hover {
    color: var(--color-surface);
    background-color: var(--color-brand-hover);
    border-color: var(--color-brand-hover);
}

.btn-primary:active,
.btn-primary.active,
.show > .btn-primary.dropdown-toggle {
    color: var(--color-surface);
    background-color: var(--color-brand-pressed);
    border-color: var(--color-brand-pressed);
}

.btn-primary:focus {
    color: var(--color-surface);
    background-color: var(--color-brand);
    border-color: var(--color-brand);
    box-shadow: 0 0 0 0.2rem rgba(var(--sf-brand-rgb), 0.35);
}

.btn-primary:disabled,
.btn-primary.disabled {
    color: var(--color-surface);
    background-color: var(--color-ink-faint);
    border-color: var(--color-ink-faint);
}

.btn-primary-light,
.btn-primary-light:focus,
.btn-primary-light:hover {
    color: var(--color-brand);
    background-color: rgba(var(--sf-brand-rgb), 0.08);
}

.btn-outline-primary {
    border-color: var(--color-brand);
    color: var(--color-brand);
}

.btn-outline-primary:hover {
    color: var(--color-surface);
    background-color: var(--color-brand);
    border-color: var(--color-brand);
}

.text-primary,
a.text-primary:hover {
    color: var(--color-brand);
}

.block-link {
    text-decoration: none;
    color: inherit;
}

/* Product page (#product): Inter stack, clean rendering (product + deal templates only) */
#product {
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-feature-settings: normal;
}

#product .product-page-intro,
#product .product-page-intro__rating,
#product .product-page-intro__lede,
#product .product-learn-more {
    font-family: inherit;
    font-feature-settings: normal;
}

#product .product-learn-more {
    letter-spacing: normal;
}

/* Review badge: subtle pill, [stars] 5.0 · 20 reviews — no monospace */
#product .product-page-intro__rating.shop-rating-data {
    display: inline-block;
    max-width: 100%;
}

#product .product-page-intro__rating .product-page-intro__rating-inner {
    display: inline-flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0.4375rem;
    max-width: 100%;
    padding: 0.375rem 0.625rem;
    border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, 0.04);
    background: rgba(0, 0, 0, 0.025);
    box-sizing: border-box;
    line-height: 1;
    box-shadow: none;
}

#product .product-page-intro__rating .product-page-intro__stars.rating-stars {
    display: inline-flex;
    align-items: center;
    font-size: 0.8125rem;
    line-height: 1;
    margin: 0;
    letter-spacing: normal;
    flex-shrink: 0;
}

#product .product-page-intro__rating .product-page-intro__stars .icon-star:not(.text-light) {
    color: var(--color-brand);
    opacity: 0.92;
}

#product .product-page-intro__rating .product-page-intro__score {
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1;
    color: var(--color-ink-soft);
    letter-spacing: normal;
    font-feature-settings: normal;
    flex-shrink: 0;
}

#product .product-page-intro__rating .product-page-intro__rating-sep {
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1;
    color: var(--color-ink-faint);
    letter-spacing: normal;
    font-feature-settings: normal;
    padding: 0 0.04rem;
    flex-shrink: 0;
}

#product .product-page-intro__rating .product-page-intro__reviews-meta {
    color: var(--color-ink-muted);
    font-weight: 400;
    line-height: 1;
    font-size: 0.8125rem;
    letter-spacing: normal;
    font-feature-settings: normal;
    white-space: nowrap;
    min-width: 0;
}

/* Product page: mobile intro above gallery; md+ CSS grid matches col-md-6 / col-lg-7|5 */
@media (max-width: 991.98px) {
    #product .product-page-intro__title.product-heading {
        font-size: 1.35rem;
        font-weight: 700;
        letter-spacing: -0.02em;
        line-height: 1.2;
        margin-bottom: 0.45rem;
        color: var(--color-ink-soft);
    }

    #product .product-page-intro__rating.shop-rating-data {
        margin-bottom: 0.45rem !important;
    }

    #product .product-page-intro__rating .product-page-intro__rating-inner {
        gap: 0.4375rem;
        padding: 0.375rem 0.625rem;
    }

    #product .product-page-intro__rating .product-page-intro__stars.rating-stars {
        font-size: 0.75rem;
    }

    #product .product-page-intro__rating .product-page-intro__score {
        font-size: 0.75rem;
    }

    #product .product-page-intro__rating .product-page-intro__rating-sep {
        font-size: 0.75rem;
    }

    #product .product-page-intro__rating .product-page-intro__reviews-meta {
        font-size: 0.75rem;
    }

    #product .product-page-intro__lede {
        /* Show the full short description on mobile (was clamped to 2 lines,
           which hid copy from customers and weakened on-page SEO). Variant B:
           compact 13px, tight leading; "Learn more" flows inline at the end of
           the paragraph (see below) to save a line of height. */
        display: inline;
        font-size: 0.8125rem;
        font-weight: 400;
        line-height: 1.45;
        color: var(--color-ink-muted);
        letter-spacing: normal;
        font-feature-settings: normal;
    }

    /* the wrap becomes the paragraph; lede + learn-more sit in one flow */
    #product .product-page-intro__description-wrap {
        margin-bottom: 0;
        font-size: 0.8125rem;
        line-height: 1.45;
    }

    /* "Learn more →" continues on the same line as the last sentence */
    #product .product-page-intro__description-wrap .product-learn-more {
        display: inline;
        margin-left: 0.3rem;
        white-space: nowrap;
        font-size: 0.8125rem;
        vertical-align: baseline;
    }
}

@media (min-width: 768px) {
    #product .product-page-intro__title.product-heading {
        font-weight: 700;
        letter-spacing: -0.015em;
        line-height: 1.22;
        color: var(--color-ink-soft);
        margin-bottom: 0.5rem;
    }

    #product .product-page-intro__lede {
        font-size: 1rem;
        font-weight: 400;
        line-height: 1.5;
        color: var(--color-ink-muted);
        margin-bottom: 0.5rem;
        letter-spacing: normal;
        font-feature-settings: normal;
    }
}

.product-learn-more {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    font-size: 0.8125rem;
    font-weight: 500;
    text-decoration: none !important;
    color: var(--color-ink-muted) !important;
    letter-spacing: 0.02em;
    border: 0;
    background: transparent;
    padding: 0;
    box-shadow: none;
}

.product-learn-more:hover,
.product-learn-more:focus-visible {
    color: var(--color-brand-hover) !important;
    text-decoration: none !important;
}

.product-learn-more:focus-visible {
    outline: 2px solid rgba(var(--sf-brand-rgb), 0.35);
    outline-offset: 2px;
    border-radius: 2px;
}

.product-learn-more__arrow {
    font-size: 0.95em;
    opacity: 0.85;
    transform: translateY(0.5px);
}

@media (min-width: 768px) and (max-width: 991.98px) {
    #product .product-page-head-row {
        display: grid !important;
        grid-template-columns: repeat(12, minmax(0, 1fr));
        grid-template-rows: auto auto;
        column-gap: 1rem;
        row-gap: 1rem;
        align-items: start;
    }

    #product .product-page-head-row > .product-page-gallery {
        grid-column: 1 / span 6;
        grid-row: 1 / span 2;
        width: 100% !important;
        max-width: none !important;
    }

    #product .product-page-head-row > .product-page-intro {
        grid-column: 7 / span 6;
        grid-row: 1;
        width: 100% !important;
        max-width: none !important;
    }

    #product .product-page-head-row > .product-page-purchase {
        grid-column: 7 / span 6;
        grid-row: 2;
        width: 100% !important;
        max-width: none !important;
    }
}

@media (min-width: 992px) {
    #product .product-page-head-row {
        display: grid !important;
        grid-template-columns: repeat(12, minmax(0, 1fr));
        grid-template-rows: auto auto;
        column-gap: 1.5rem;
        row-gap: 1rem;
        align-items: start;
    }

    #product .product-page-head-row > .product-page-gallery {
        grid-column: 1 / span 7;
        grid-row: 1 / span 2;
        width: 100% !important;
        max-width: none !important;
    }

    #product .product-page-head-row > .product-page-intro {
        grid-column: 8 / span 5;
        grid-row: 1;
        width: 100% !important;
        max-width: none !important;
    }

    #product .product-page-head-row > .product-page-purchase {
        grid-column: 8 / span 5;
        grid-row: 2;
        width: 100% !important;
        max-width: none !important;
    }
}


.subheading {
    font-size: 1.125rem
}

.zig-zag {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjMiIGhlaWdodD0iMTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMi43MzIgMS4yMzJhMi41IDIuNSAwIDAgMSAzLjUzNiAwTDI2IDEwLjk2NGw5LjczMi05LjczMmEyLjUgMi41IDAgMCAxIDMuNTM2IDBMNDkgMTAuOTY0bDkuNzMyLTkuNzMyYTIuNSAyLjUgMCAwIDEgMy41MzYgMy41MzZsLTExLjUgMTEuNWEyLjUgMi41IDAgMCAxLTMuNTM2IDBMMzcuNSA2LjUzNmwtOS43MzIgOS43MzJhMi41IDIuNSAwIDAgMS0zLjUzNiAwTDE0LjUgNi41MzZsLTkuNzMyIDkuNzMyYTIuNSAyLjUgMCAwIDEtMy41MzYtMy41MzZsMTEuNS0xMS41WiIgZmlsbD0iI0ZBODk0MyIvPjwvc3ZnPg==);
    background-position: center bottom .1em;
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    height: 1em;
    margin-left: .5em;
    width: 2em
}

.h2 .zig-zag,
h2 .zig-zag {
    height: .7em;
    width: 1.4em
}

.underline {
    display: inline-block;
    position: relative
}

.underline:after {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjU0IiBoZWlnaHQ9IjExIiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIG9wYWNpdHk9Ii4xIiBkPSJNMS41IDkuNUM5MC43NC4yIDE0NC4xMjEtMS4zOSAyNTIgOS41IiBzdHJva2U9IiMwMDAiIHN0cm9rZS13aWR0aD0iMyIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+PC9zdmc+) 50% no-repeat;
    background-size: 100% 100%;
    content: "";
    display: block;
    height: 8px;
    margin-top: -.1em;
    position: absolute;
    top: 100%;
    width: 100%
}

.nav-link.current {
    color: var(--color-brand)
}

.slick-track-start .slick-track {
    margin-left: 0
}

.hide-slides-before-init:not(.slick-initialized)>:not(:first-child) {
    display: none
}

.slick-visible .slick-list {
    overflow: visible
}

.btn-slick.disabled {
    border-color: transparent;
    opacity: .5
}

.slick-custom-dots {
    padding-bottom: 4px;
    padding-top: 4px
}

.slick-custom-dot {
    border: 2px solid var(--color-surface)
}

.slick-custom-dot.active {
    box-shadow: 0 0 0 2px var(--color-border)
}

.slick-custom-dot.active .slick-custom-dot-image {
    opacity: .5
}

.slick-flex {
    height: 100%
}

.slick-flex .slick-list {
    display: flex;
    height: 100%
}

@media (max-width:767.98px) {
    .subheading {
        font-size: 1rem
    }
}

/* Desktop polish: purchase section visual hierarchy */
@media (min-width:768px) {
  .add-to-cart-form .product-upload-ui--v2 .product-artwork.mb-4 {
    margin-top: 0.04rem !important;
    margin-bottom: 0.82rem !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-shell:not(.upload-action-shell--hero) {
    border-radius: 20px !important;
    border-color: rgba(236, 232, 227, 0.78) !important;
    box-shadow: 0 2px 10px rgba(17, 24, 39, 0.05) !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) {
    min-height: 66px !important;
    padding: 9px 11px 6px !important;
    gap: 8px !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__main {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__icon {
    flex: 0 0 44px !important;
    width: 44px !important;
    height: 44px !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__icon::before {
    border-left-width: 3px !important;
    border-top-width: 3px !important;
    width: 10px !important;
    height: 10px !important;
    margin-top: -3px !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__icon::after {
    width: 4px !important;
    height: 13px !important;
    top: 15px !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__title {
    font-size: 16px !important;
    line-height: 1.16 !important;
    color: var(--color-ink-soft) !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__subtitle {
    font-size: 12.5px !important;
    line-height: 1.2 !important;
    color: var(--color-ink-muted) !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__helper {
    font-size: 12px !important;
    line-height: 1.28 !important;
    padding: 4px 1px 0 !important;
    margin-top: -7px !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .product-note.mb-3 {
    margin-top: 0.34rem !important;
    margin-bottom: 0.76rem !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3.product-add-card {
    margin-top: 0.95rem !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__btn {
    height: 70px !important;
    min-height: 70px !important;
    max-height: 70px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(17, 24, 39, 0.08) !important;
    box-shadow: 0 8px 20px rgba(17, 24, 39, 0.12) !important;
    /* Safety gradient on container removes any visible center gap */
    background: linear-gradient(90deg, var(--color-brand) 0%, var(--color-brand) 44%, var(--color-surface-subtle) 44%, var(--color-surface-subtle) 100%) !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: stretch !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__cta {
    flex: 0 0 44% !important;
    max-width: 44% !important;
    width: 44% !important;
    height: 100% !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: linear-gradient(94deg, var(--color-brand-hover) 0%, var(--color-brand) 46%, var(--color-accent) 100%) !important;
    display: flex !important;
    align-items: stretch !important;
    justify-content: center !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__left {
    width: 100% !important;
    padding: 0 12px !important;
    background: transparent !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__icon {
    width: 28px !important;
    height: 28px !important;
    margin-right: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__icon .icon {
    font-size: 20px !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__text {
    font-size: 16px !important;
    line-height: 1.1 !important;
    font-weight: 700 !important;
    display: inline-flex !important;
    align-items: center !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__right {
    flex: 1 0 56% !important;
    max-width: none !important;
    min-width: 0 !important;
    padding: 9px 10px !important;
    background: var(--color-surface-subtle) !important;
    border-left: 0 !important;
    box-shadow: none !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 3px !important;
    text-align: center !important;
    overflow: visible !important;
    position: relative;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__right::before {
    content: none !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__right .product-add-card__price {
    font-size: 23px !important;
    line-height: 1 !important;
    color: var(--color-brand) !important;
    font-weight: 800 !important;
    text-align: center !important;
    width: 100% !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__right .product-add-card__meta {
    font-size: 11.5px !important;
    line-height: 1.15 !important;
    color: rgba(30, 37, 48, 0.58) !important;
    margin-top: 0 !important;
    white-space: nowrap !important;
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    overflow: visible !important;
  }
}

/* UX v3: Split CTA — rounded rectangle, premium hierarchy (visual-only) */
.ux-cart-integrated--v3.product-add-card {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin-top: 1rem !important;
    border-radius: 0 !important;
    overflow: visible !important;
}

.ux-cart-integrated--v3 .product-add-card__body {
    gap: 0 !important;
    padding: 0 !important;
}

.ux-cart-integrated--v3 .ux-cart-integrated__btn {
    margin: 0 !important;
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    background: transparent !important;
    background-image: none !important;
    color: inherit !important;
    box-shadow: 0 6px 18px rgba(16, 24, 40, 0.12) !important;
    overflow: hidden !important;
    border-radius: 999px !important;
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
}

.ux-cart-integrated--v3 .ux-cart-integrated__cta {
    flex: 0 0 44% !important;
    max-width: 44% !important;
    min-width: 0 !important;
}

.ux-cart-integrated--v3 .ux-cart-integrated__left {
    flex: 1 1 auto !important;
    max-width: none !important;
    width: 100% !important;
    background: linear-gradient(92deg, var(--color-brand) 0%, var(--color-brand) 38%, var(--color-accent) 72%, var(--color-accent) 100%) !important;
    padding: 0 14px !important;
    border-radius: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
}

.ux-cart-integrated--v3 .ux-cart-integrated__right {
    flex: 0 0 56% !important;
    min-width: 0;
    max-width: 56%;
    background: var(--color-surface) !important;
    padding: 10px 14px !important;
    box-shadow: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    text-align: center !important;
}

.ux-cart-integrated--v3 .ux-cart-integrated__icon {
    width: 32px !important;
    height: 32px !important;
    margin-right: 0 !important;
    border-radius: 0 !important;
    flex-shrink: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.ux-cart-integrated--v3 .ux-cart-integrated__icon .icon {
    font-size: 23px !important;
    display: block !important;
    line-height: 1 !important;
}

.ux-cart-integrated--v3 .ux-cart-integrated__text {
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.22 !important;
    color: var(--color-surface) !important;
    letter-spacing: -0.015em;
    display: inline-flex !important;
    align-items: center !important;
}

.ux-cart-integrated--v3 .ux-cart-integrated__right .product-add-card__price {
    font-size: 28px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--color-brand) !important;
    display: block;
    letter-spacing: -0.02em;
    text-align: center !important;
    width: 100% !important;
}

.ux-cart-integrated--v3 .ux-cart-integrated__right .product-add-card__meta {
    font-size: 13px !important;
    line-height: 1.25 !important;
    font-weight: 500 !important;
    margin: 0 !important;
    padding: 0 !important;
    color: rgba(30, 37, 48, 0.52) !important;
    opacity: 1 !important;
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    overflow: visible;
    white-space: nowrap !important;
}

@media (max-width:991.98px) {
    .ux-cart-integrated--v3.product-add-card {
        margin-top: 1.2rem !important;
    }

    .ux-cart-integrated--v3 .ux-cart-integrated__btn {
        height: 58px !important;
        min-height: 58px !important;
        max-height: 58px !important;
        border-radius: 999px !important;
    }

    .ux-cart-integrated--v3 .ux-cart-integrated__cta {
        flex: 0 0 44% !important;
        max-width: 44% !important;
    }

    .ux-cart-integrated--v3 .ux-cart-integrated__left {
        flex: 1 1 auto !important;
        max-width: none !important;
        width: 100% !important;
        padding: 0 10px !important;
        justify-content: center !important;
        gap: 0.45rem !important;
    }

    .ux-cart-integrated--v3 .ux-cart-integrated__right {
        flex: 0 0 56% !important;
        max-width: 56%;
        padding: 8px 9px !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 3px !important;
        text-align: center !important;
    }

    .ux-cart-integrated--v3 .ux-cart-integrated__right .product-add-card__price {
        font-size: 24px !important;
        text-align: center !important;
        width: 100% !important;
    }

    .ux-cart-integrated--v3 .ux-cart-integrated__right .product-add-card__meta {
        font-size: 12px !important;
        white-space: nowrap !important;
        text-align: center !important;
    }

    .ux-cart-integrated--v3 .ux-cart-integrated__text {
        font-size: 16px !important;
        display: inline-flex !important;
        align-items: center !important;
    }

    .ux-cart-integrated--v3 .ux-cart-integrated__icon .icon {
        font-size: 20px !important;
    }
}

/* v3 integrated sticky CTA pending/ready: right side mutually-exclusive rendering */
.add-to-cart-form .ux-cart-integrated--v3.ux-cart-integrated--cta-pending .btn-add-to-cart:disabled {
    cursor: not-allowed !important;
    opacity: 1 !important;
}

.ux-cart-integrated--v3 .product-add-card__helper {
    display: none !important; /* default: hide helper in ready state */
    margin: 0 !important;
    padding: 0 12px !important;
    width: 100%;
    max-width: 18rem;
    font-size: 12.75px !important;
    font-weight: 600 !important;
    line-height: 1.28 !important; /* tighter two-line wrap */
    letter-spacing: 0.01em !important;
    color: rgba(55, 60, 68, 0.78) !important;
    text-align: center !important;
    position: relative;
    top: auto;
    left: auto;
    right: auto;
}

.ux-cart-integrated--v3 .ux-cart-integrated__right--pending {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    min-height: 64px !important; /* vertically center helper like the button height */
    background: linear-gradient(180deg, var(--color-surface-subtle) 0%, var(--color-surface-subtle) 100%) !important;
}

.ux-cart-integrated--v3 .ux-cart-integrated__right--pending .product-add-card__helper {
    display: block !important;
}

.ux-cart-integrated--v3 .ux-cart-integrated__right--pending .product-add-card__price,
.ux-cart-integrated--v3 .ux-cart-integrated__right--pending .product-add-card__meta {
    display: none !important; /* pending state: no price, no per-unit meta */
}

@media (max-width: 991.98px) {
    .ux-cart-integrated--v3 .product-add-card__helper {
        font-size: 11.9px !important;
        line-height: 1.25 !important;
        padding: 0 10px !important;
        max-width: 14.5rem;
    }

    .ux-cart-integrated--v3 .ux-cart-integrated__right--pending {
        min-height: 58px !important;
    }
}

.site-header {
    position: sticky;
    top: 0;
    transition: .5s;
    width: 100%;
    z-index: 99
}

/* Forest Fox: storefront header on deep green (layout unchanged) */
.site-header.navbar.bg-white,
.site-header.navbar {
    background-color: var(--color-nav) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.site-header .nav-link,
.site-header .btn-default {
    color: rgba(255, 255, 255, 0.9) !important;
}

.site-header .nav-link:hover,
.site-header .nav-link:focus,
.site-header .btn-default:hover {
    color: var(--color-surface) !important;
}

.site-header .nav-link.current {
    color: var(--color-accent) !important;
}

/* Dropdown panels are white; undo header nav-link white text inside them (Products submenu, account menu, etc.) */
.site-header .dropdown-menu .nav-link,
.site-header .dropdown-menu .nav-dd-link {
    color: var(--color-ink) !important;
}

.site-header .dropdown-menu .nav-link:hover,
.site-header .dropdown-menu .nav-link:focus,
.site-header .dropdown-menu .nav-dd-link:hover,
.site-header .dropdown-menu .nav-dd-link:focus {
    color: var(--color-brand) !important;
}

.site-header .dropdown-menu .nav-link.current,
.site-header .dropdown-menu .nav-dd-link.current {
    color: var(--color-brand) !important;
}

.site-header .menu-sep {
    border-left: 1px solid rgba(255, 255, 255, 0.22);
    height: 30px
}

.sticky-header:not(.fs-active) .site-header {
    background-color: var(--color-nav) !important;
    box-shadow: 0 1px 15px rgba(0, 0, 0, .22)
}

.site-header .fullscreen-menu-toggler span {
    background-color: rgba(255, 255, 255, 0.92);
}

.site-header .icon {
    font-size: 1.4rem;
    vertical-align: -.25rem
}

@media (min-width: 992px) {
    .site-header .navbar-brand {
        display: inline-flex;
        align-items: center;
        gap: 0.62rem;
    }

    .site-header .navbar-brand .navbar-brand-image {
        width: 46px;
        height: auto;
    }

    .site-header .navbar-brand-text {
        color: rgba(255, 255, 255, 0.94);
        font-family: "Nunito", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
        font-weight: 800;
        font-size: 1.325rem;
        line-height: 1;
        letter-spacing: -0.01em;
        white-space: nowrap;
    }

    .site-header .navbar-brand-text-fox {
        color: #d58938;
    }

    .site-header .site-header-nav {
        flex-wrap: nowrap;
    }

    .site-header .site-header-nav > .nav-item {
        white-space: nowrap;
    }
}

.account-name-box .icon {
    font-size: 1.5rem;
    vertical-align: -.2rem
}

.account-menu .icon {
    font-size: 1.2rem;
    margin-right: .35rem;
    vertical-align: -.125rem
}

.account .account-menu .nav-link {
    border-right: 4px solid transparent;
    margin-bottom: .2rem;
    margin-top: .2rem
}

.account .account-menu .current>.nav-link {
    border-color: var(--color-brand);
    color: var(--color-brand)
}

.account .account-menu .icon {
    font-size: 1.4rem;
    vertical-align: -.225rem
}

.site-main-content {
    padding-top: 2.5rem
}

.cart-products-qty {
    background-color: var(--color-brand);
    border-radius: 9rem;
    color: var(--color-surface);
    font-size: 12px;
    line-height: 1;
    padding: 2px 6px
}

.modal .btn.btn-checkout {
    display: block !important
}

/* Promo ribbon only (Bootstrap .bg-primary / .text-white on #header-promo-ribbon) */
.header-promo-ribbon.bg-primary,
#header-promo-ribbon.bg-primary {
    background: linear-gradient(
        90deg,
        #0F3D2E 0%,
        #145A42 50%,
        #0F3D2E 100%
    ) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.header-promo-ribbon .header-promo-ribbon-item,
.header-promo-ribbon .deal-label {
    color: #EAF4EF;
}

.header-promo-ribbon .deal-label b {
    background: #FF6A2B;
    color: #ffffff;
    font-weight: 600;
    border-radius: 6px;
    padding: 2px 8px;
}

.header-promo-ribbon .deal-button {
    color: #FFB36B;
    font-weight: 500;
    transition: color 0.2s ease;
}

.header-promo-ribbon .deal-button:hover {
    color: #FFD2A3;
}

.header-promo-ribbon .header-promo-ribbon-button {
    color: #EAF4EF;
}

.header-promo-ribbon-item {
    display: block;
    width: 100%;
    font-weight: 500;
}

.header-promo-slider .header-promo-ribbon-item {
    padding-left: 2.325rem;
    padding-right: 2.325rem;
    position: absolute;
    top: 0;
    transition: 0.5s opacity, 0.4s transform;
    opacity: 0;
    transform: translateY(6px);
}

.header-promo-ribbon-item:focus-visible {
    outline: auto;
}

.header-promo-ribbon-item.active {
    opacity: 1;
    position: relative;
    transform: translateY(0);
}

.header-promo-ribbon-item.inactive {
    opacity: 0;
    position: relative;
    transform: translateY(-6px);
}

.header-promo-ribbon-button {
    height: 100%;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 2.325rem;
    line-height: 0;
    font-size: 1.425rem;
    color: #EAF4EF;
}

.header-promo-ribbon-button:hover {
    background-color: rgba(0, 0, 0, 0.1);
    color: #EAF4EF;
}

/* Click-to-copy coupon ribbon slide (WELCOME20 etc.) */
.header-promo-ribbon-item--copy {
    appearance: none;
    -webkit-appearance: none;
    background: transparent;
    border: 0;
    color: #EAF4EF;
    cursor: pointer;
    text-align: center;
    line-height: 1.35;
    font-weight: 500;
    width: 100%;
    transition: background-color 0.15s ease;
    position: relative;
}

.header-promo-ribbon-item--copy:hover {
    background-color: rgba(255, 255, 255, 0.06);
}

/* The coupon code "pill" — `button_title` text wrapped by the Blade as <strong class="deal-button"> */
.header-promo-ribbon-item--copy .deal-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255, 106, 43, 0.15);
    border: 1px solid #FF6A2B;
    color: #FFB36B;
    padding: 2px 10px;
    margin-left: 6px;
    border-radius: 5px;
    font-family: ui-monospace, Menlo, "SF Mono", Consolas, monospace;
    font-size: 12px;
    letter-spacing: 0.5px;
    font-weight: 500;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.header-promo-ribbon-item--copy:hover .deal-button {
    background: rgba(255, 106, 43, 0.25);
    color: #FFD2A3;
}

.header-promo-ribbon-copy-icon {
    font-size: 11px;
    opacity: 0.85;
    line-height: 1;
}

/* "Copied!" toast — appears briefly on click, overlays the label */
.header-promo-ribbon-copied {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) translateY(4px);
    background: #FF6A2B;
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    padding: 4px 14px;
    border-radius: 5px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
    white-space: nowrap;
}

.header-promo-ribbon-item--copy[data-copied="1"] .header-promo-ribbon-copied {
    opacity: 1;
    transform: translate(-50%, -50%) translateY(0);
}

/* Mobile: compact one-line ribbon */
@media (max-width: 575.98px) {
    .header-promo-ribbon-item--copy {
        padding: 6px 10px !important;
        font-size: 12.5px;
        line-height: 1.2;
        white-space: nowrap;
    }
    .header-promo-ribbon-item--copy .deal-label {
        white-space: nowrap;
    }
    .header-promo-ribbon-item--copy .deal-button {
        padding: 1px 7px;
        font-size: 11px;
        margin-left: 4px;
    }
    .header-promo-ribbon-copy-icon {
        font-size: 10px;
    }
    /* Slider navigation arrows — smaller on mobile so they don't squeeze the text */
    .header-promo-slider .header-promo-ribbon-item {
        padding-left: 1.75rem !important;
        padding-right: 1.75rem !important;
    }
}

.header-promo-ribbon-button:focus,
.header-promo-ribbon:hover .header-promo-ribbon-button {
    opacity: 1
}

/* ============================================================
   Click-to-apply coupon ribbon variant (.header-promo-ribbon-item--apply)
   Renders for header deals that include a coupon_code (e.g. WELCOME20).
   Slimmer than the default ribbon, no aggressive orange $30 chip — only
   bold accent on the dollar amount and a small monospace WELCOME20 pill.
   JS in app.js drives data-state attribute through pending / applied / copied.
   ============================================================ */
.header-promo-ribbon-item--apply {
    appearance: none;
    -webkit-appearance: none;
    background: transparent;
    border: 0;
    color: #EAF4EF;
    cursor: pointer;
    text-align: center;
    line-height: 1.35;
    font-weight: 500;
    font-size: 13px;
    letter-spacing: 0.01em;
    padding: 6px 14px !important;
    width: 100%;
    position: relative;
    transition: background-color 0.15s ease;
}
.header-promo-ribbon-item--apply:hover {
    background-color: rgba(255, 255, 255, 0.05);
}
.header-promo-ribbon-item--apply:focus-visible {
    outline: 2px solid rgba(255, 179, 107, 0.6);
    outline-offset: -3px;
}

/* Kill the bright orange $30 chip used by the default ribbon — inside the
   --apply variant we want $30 to read as a refined bold accent, not a pill. */
.header-promo-ribbon-item--apply .deal-label b {
    background: transparent !important;
    color: #FFB36B !important;
    font-weight: 700 !important;
    border-radius: 0 !important;
    padding: 0 !important;
}

/* The coupon code pill — small monospace tag, mirror of --copy variant but
   a touch lighter so it doesn't compete with the heading. */
.header-promo-ribbon-item--apply .deal-button {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: rgba(255, 106, 43, 0.12);
    border: 1px solid rgba(255, 106, 43, 0.55);
    color: #FFB36B;
    padding: 1px 9px;
    margin-left: 8px;
    border-radius: 4px;
    font-family: ui-monospace, Menlo, "SF Mono", Consolas, monospace;
    font-size: 11.5px;
    letter-spacing: 0.5px;
    font-weight: 600;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.header-promo-ribbon-item--apply .deal-button .icon-arrow-right {
    font-size: 10px;
    opacity: 0.85;
}
.header-promo-ribbon-item--apply:hover .deal-button {
    background: rgba(255, 106, 43, 0.22);
    color: #FFD2A3;
    border-color: rgba(255, 106, 43, 0.8);
}

/* Overlay states — sit on top of the default heading row when active.
   Three overlays for three explicit UX outcomes:
     applied — backend confirmed coupon is on the cart
     saved   — cart not ready yet; intent stored, floating-chip will apply
     copied  — fallback only; AJAX failed or coupon truly unusable */
.header-promo-ribbon-item--apply .header-promo-ribbon-applied,
.header-promo-ribbon-item--apply .header-promo-ribbon-saved,
.header-promo-ribbon-item--apply .header-promo-ribbon-copied {
    position: absolute;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 13px;
    line-height: 1.2;
    letter-spacing: 0.01em;
    white-space: nowrap;
    padding: 0 18px;
    text-align: center;
}

/* Pending — soft fade while AJAX is in flight */
.header-promo-ribbon-item--apply[data-state="pending"] {
    opacity: 0.7;
    cursor: default;
}

/* Applied — full row tints green with a check; hides the original heading */
.header-promo-ribbon-item--apply[data-state="applied"] {
    background-color: rgba(47, 125, 79, 0.30);
    cursor: default;
}
.header-promo-ribbon-item--apply[data-state="applied"] .deal-label,
.header-promo-ribbon-item--apply[data-state="applied"] .deal-button {
    visibility: hidden;
}
.header-promo-ribbon-item--apply[data-state="applied"] .header-promo-ribbon-applied {
    display: flex;
    color: #C8F0D6;
}

/* Saved — same green tint as applied (it's a success-flavored state); customer
   asked to apply on an empty cart, intent is stored for first add-to-cart. */
.header-promo-ribbon-item--apply[data-state="saved"] {
    background-color: rgba(47, 125, 79, 0.30);
    cursor: default;
}
.header-promo-ribbon-item--apply[data-state="saved"] .deal-label,
.header-promo-ribbon-item--apply[data-state="saved"] .deal-button {
    visibility: hidden;
}
.header-promo-ribbon-item--apply[data-state="saved"] .header-promo-ribbon-saved {
    display: flex;
    color: #C8F0D6;
}

/* Copied (clipboard fallback) — short-lived toast, no green tint (it's a soft
   failure / unable-to-apply path; we don't want to imply success). */
.header-promo-ribbon-item--apply[data-state="copied"] .deal-label,
.header-promo-ribbon-item--apply[data-state="copied"] .deal-button {
    visibility: hidden;
}
.header-promo-ribbon-item--apply[data-state="copied"] .header-promo-ribbon-copied {
    display: flex;
    color: #FFE8C9;
}

/* Mobile — slimmer geometry. NO overflow:hidden / text-overflow:ellipsis on the
   parent: absolute-positioned overlays inside an `overflow:hidden` ancestor can
   clip or render blank on mobile Safari/iOS Chrome. Overlay text fits at 12px
   for messages up to ~38 chars at 360px viewport. */
@media (max-width: 575.98px) {
    .header-promo-ribbon-item--apply {
        padding: 5px 10px !important;
        font-size: 12px;
    }
    .header-promo-ribbon-item--apply .deal-button {
        padding: 1px 7px;
        margin-left: 6px;
        font-size: 10.5px;
    }
    .header-promo-ribbon-item--apply .header-promo-ribbon-applied,
    .header-promo-ribbon-item--apply .header-promo-ribbon-saved,
    .header-promo-ribbon-item--apply .header-promo-ribbon-copied {
        font-size: 12px;
        padding: 0 10px;
    }
}

@media (max-width:576.98px) {
    #account-dropdown:after {
        display: none
    }
}

@media (max-width:991.98px) {
    .site-header .navbar-brand {
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
        max-width: none;
    }

    .site-header .navbar-brand .navbar-brand-image {
        width: 32px;
        height: auto;
        flex-shrink: 0;
    }

    .site-header .navbar-brand-text {
        font-family: "Nunito", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
        font-size: 18.75px;
        font-weight: 800;
        line-height: 1;
        white-space: nowrap;
        color: rgba(255, 255, 255, 0.94);
    }

    .site-header .navbar-brand-text-fox {
        color: #d58938;
    }

    .account .account-menu .nav-link {
        border-bottom: 3px solid transparent;
        border-right: none;
        font-size: 14px;
        margin-bottom: 15px;
        margin-right: 1rem;
        padding-left: 0;
        padding-right: 0
    }

    .account .account-menu .icon {
        font-size: 1.2rem;
        margin-right: 2px
    }

    .site-main-content {
        padding-top: 1rem
    }

    .site-header .btn {
        padding-left: .5rem;
        padding-right: .5rem
    }

    .cart-products-qty {
        padding: 2px 6px
    }

    .header-promo-ribbon-item {
        font-size: 14px;
    }
}

.product-faqs .page-builder-accordion.loading {
    animation: loading-pulse 1.1s ease-in-out infinite;
}

@keyframes loading-pulse {
    0% {
        opacity: .7;
    }

    50% {
        opacity: .3;
    }

    100% {
        opacity: .7;
    }
}

/* Product page FAQs (#panel-faqs): card-style accordion, scoped — markup unchanged */
#panel-faqs.product-faqs {
    background-color: var(--color-surface-subtle) !important;
}

#panel-faqs > .container > h2 {
    text-align: center;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--color-ink-soft);
    margin-bottom: 1.25rem !important;
    font-size: clamp(1.2rem, 1.05rem + 0.42vw, 1.35rem);
    line-height: 1.22;
}

@media (min-width: 992px) {
    #panel-faqs > .container > h2 {
        margin-bottom: 1.5rem !important;
    }
}

#panel-faqs .faq-filter-box {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.5rem;
}

#panel-faqs .page-builder-accordion {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

#panel-faqs .page-builder-accordion.faq-list-collapsed .accordion-item:nth-child(n + 5) {
    display: none !important;
}

#panel-faqs .accordion-item {
    margin-bottom: 0 !important;
    background: var(--color-surface);
    border-radius: 14px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    box-shadow: none;
    overflow: hidden;
}

#panel-faqs .accordion-button {
    align-items: center;
    padding: 0.9rem 1rem 0.9rem 1.05rem;
    font-size: 0.9375rem;
    line-height: 1.45;
    font-weight: 600;
    color: var(--color-ink-soft);
    border-radius: 0;
    gap: 0.75rem;
}

#panel-faqs .accordion-button:hover {
    background-color: rgba(var(--sf-brand-rgb), 0.05);
}

#panel-faqs .accordion-button > span:first-child {
    flex: 1;
    min-width: 0;
}

#panel-faqs .accordion-button-icon {
    flex-shrink: 0;
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    margin: 0;
    border-radius: 50%;
    font-size: 1.05rem !important;
    line-height: 1;
    background-color: rgba(17, 24, 39, 0.06);
    color: rgba(31, 35, 40, 0.65);
    transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

#panel-faqs .accordion-button:hover .accordion-button-icon {
    transform: scale(1.05);
    background-color: rgba(17, 24, 39, 0.09);
}

#panel-faqs .accordion-button[aria-expanded="true"] .accordion-button-icon {
    transform: rotate(180deg);
    background-color: rgba(var(--sf-brand-rgb), 0.14);
    color: var(--color-brand-hover);
}

#panel-faqs .accordion-button[aria-expanded="true"]:hover .accordion-button-icon {
    transform: rotate(180deg) scale(1.05);
}

#panel-faqs .accordion-body {
    padding: 0 1.05rem 1rem;
    margin: 0;
    font-size: 0.9375rem;
    line-height: 1.55;
    color: rgba(31, 35, 40, 0.88);
    border-top: 1px solid rgba(17, 24, 39, 0.05);
    background: var(--color-surface);
}

#panel-faqs .accordion-body .pb-3 {
    padding-bottom: 0.25rem !important;
}

#panel-faqs .faq-load-more-wrap {
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    position: absolute !important;
    width: 1px !important;
}

#panel-faqs .product-faqs__preview-controls {
    margin-top: 1.5rem;
}

#panel-faqs .product-faqs__preview-btn {
    background: var(--color-surface) !important;
    border: 1px solid rgba(17, 24, 39, 0.12) !important;
    color: var(--color-brand-hover) !important;
    font-weight: 600;
    font-size: 0.875rem;
    padding: 0.5rem 1.35rem;
    border-radius: 999px;
    box-shadow: none !important;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

#panel-faqs .product-faqs__preview-btn:hover,
#panel-faqs .product-faqs__preview-btn:focus-visible {
    background: rgba(var(--sf-brand-rgb), 0.08) !important;
    border-color: rgba(var(--sf-brand-rgb), 0.35) !important;
    color: var(--color-brand-pressed) !important;
}

#panel-faqs .product-faqs__preview-btn:focus-visible {
    outline: 2px solid rgba(var(--sf-brand-rgb), 0.35);
    outline-offset: 2px;
}

#panel-faqs .faq-load-more-btn.btn {
    background: var(--color-surface) !important;
    border: 1px solid rgba(17, 24, 39, 0.12) !important;
    color: var(--color-brand-hover) !important;
    font-weight: 600;
    font-size: 0.875rem;
    padding: 0.5rem 1.35rem;
    border-radius: 999px;
    box-shadow: none !important;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

#panel-faqs .faq-load-more-btn.btn:hover,
#panel-faqs .faq-load-more-btn.btn:focus-visible {
    background: rgba(var(--sf-brand-rgb), 0.08) !important;
    border-color: rgba(var(--sf-brand-rgb), 0.35) !important;
    color: var(--color-brand-pressed) !important;
}

#panel-faqs .faq-load-more-btn.btn:focus-visible {
    outline: 2px solid rgba(var(--sf-brand-rgb), 0.35);
    outline-offset: 2px;
}

@media (min-width: 768px) {
    #panel-faqs .accordion-button {
        font-size: 1rem;
        padding: 1rem 1.15rem;
    }

    #panel-faqs .page-builder-accordion {
        gap: 0.85rem;
    }
}

/* Related products / Other Products: same letterbox treatment as home grid */
#panel-products .product-related-products__card .ratio {
    background: transparent;
    border-bottom: none;
}

/* Product page — related products: mobile 2-col grid (Bootstrap row fix); card chrome matches home */
@media (max-width: 767.98px) {
    /*
     * Use CSS Grid here: this theme’s Bootstrap sets `.row > * { width: 100%; max-width: 100%; }`,
     * which can override `.col-6` and force a single column. Grid ignores column width classes.
     */
    #panel-products .product-related-products__row {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 0.65rem;
        row-gap: 0.75rem;
        margin-left: 0;
        margin-right: 0;
    }

    #panel-products .product-related-products__col {
        width: 100% !important;
        max-width: none !important;
        flex: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-bottom: 0 !important;
        min-width: 0;
    }

    #panel-products .product-related-products__card.card {
        border: none;
        box-shadow: none;
        border-radius: 12px;
        background-color: transparent;
        padding: 0;
        height: 100%;
        transition: background-color 0.18s ease, transform 0.2s ease;
    }

    #panel-products .product-related-products__card.card:hover {
        background-color: rgba(var(--sf-brand-rgb), 0.05);
        transform: translateY(-3px);
    }

    /* Shorter media box than 16:9 for a denser card (icon unchanged) */
    #panel-products .ratio.ratio-16x9::before {
        padding-top: 70% !important;
    }

    #panel-products .product-related-products__card .ratio {
        border-radius: 8px;
        overflow: hidden;
    }
}

.fullscreen-menu-toggler span {
    background-color: var(--color-ink);
    display: block;
    height: 3px;
    margin-bottom: 8px;
    margin-top: 8px;
    transition: .3s;
    width: 31px
}

.fullscreen-menu-toggler .s-1 {
    opacity: 1;
    transform: translateX(0);
    transition-delay: .4s
}

.fullscreen-menu-toggler.active .s-1 {
    opacity: 0;
    transform: translateX(-20px);
    transition-delay: 0s
}

.fullscreen-menu-toggler .s-2 {
    opacity: 1;
    transform: translateX(0);
    transition-delay: .5s
}

.fullscreen-menu-toggler.active .s-2 {
    opacity: 0;
    transform: translateX(20px);
    transition-delay: .1s
}

.fullscreen-menu-toggler .s-3 {
    bottom: -17px;
    opacity: 0;
    position: relative;
    transform: rotate(45deg) translateX(-40px);
    transition-delay: 0s
}

.fullscreen-menu-toggler.active .s-3 {
    opacity: 1;
    transform: rotate(45deg) translateX(0);
    transition-delay: .3s
}

.fullscreen-menu-toggler .s-4 {
    opacity: 0;
    position: relative;
    top: -16px;
    transform: rotate(-45deg) translateX(40px);
    transition-delay: .1s
}

.fullscreen-menu-toggler.active .s-4 {
    opacity: 1;
    transform: rotate(-45deg) translateX(0);
    transition-delay: .4s
}

.fullscreen-menu {
    display: none;
    position: fixed;
    top: 0;
    z-index: 98
}

.fullscreen-menu>.fs-box {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate3d(-50%, -50%, 0);
    width: 90%
}

.fullscreen-lang-menu-box .active {
    background-color: var(--color-brand);
    border-radius: .5rem;
    color: var(--color-surface)
}

.fullscreen-menu .fs-display {
    opacity: 0;
    transform: translateY(20px);
    transition: .4s
}

.fullscreen-menu .fs-display.ready {
    opacity: 1;
    transform: translateY(0)
}

.fullscreen-menu .dropdown-menu {
    background-color: transparent;
    box-shadow: none;
    display: none;
    margin: 0 !important;
    opacity: 1;
    padding: 0;
    position: relative;
    text-align: center;
    transform: none;
    transition: none
}

.fullscreen-menu .fullscreen-nav li .icon {
    margin-left: -5px;
    transition: .35s;
    vertical-align: -.1em
}

.fullscreen-menu .fullscreen-nav .show .icon {
    transform: rotate(180deg)
}

.fullscreen-nav .nav-link {
    font-size: 1.2rem;
    font-weight: 700
}

.fullscreen-nav .nav-sublink {
    font-size: 1rem;
    font-weight: 400
}

.hero .subheading {
    max-width: 360px
}

.hero-video-box .icon {
    font-size: 2.6rem;
    left: 50%;
    top: 50%;
    transform: translate3d(-50%, -50%, 0)
}

.hero-testimonials-slider .slick-list {
    margin-bottom: -1.5rem;
    margin-top: -1.5rem;
    transition: height 0.35s ease;
}

/* Slick .slick-track is flex + default align-items: stretch — every slide matched tallest review; break that so adaptiveHeight measures real content */
.hero-testimonials-slider .slick-track {
    padding-bottom: 1.5rem;
    padding-top: 1.5rem;
    align-items: flex-start;
}

.hero-testimonials-slider .slick-slide {
    transition: .3s;
    align-self: flex-start;
    height: auto;
}

/* Hero quotes: card height follows copy; long text wraps without clipping */
.hero-testimonials-slider .slick-slide.item.testimonial {
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: auto;
}

.hero-testimonials-slider .slick-slide.box-shadow:not(.slick-active) {
    box-shadow: none
}

@media (min-width:768px) {
    .hero-video-box .icon {
        font-size: 4rem
    }
}

@media (max-width:991.98px) {

    .hero-slider-mobile-box,
    .hero-video-box {
        margin: -15px -30px -40px;
        width: auto;
        z-index: 1
    }
}

@media (min-width:992px) {
    .hero-main-box {
        width: 115%
    }

    .hero-testimonials-slider {
        margin-bottom: -75px;
        opacity: 0;
        transform: translateY(20px);
        transition: .3s
    }

    .hero-testimonials-slider.slick-initialized {
        opacity: 1;
        transform: translateY(0)
    }

    .hero-testimonials-slider-quote-icon-box {
        opacity: 0;
        transform: translate3d(50%, 15px, 0);
        transition: .3s;
        transition-delay: .4s
    }

    .hero-testimonials-slider.slick-initialized+.hero-testimonials-slider-quote-icon-box {
        opacity: 1;
        transform: translate3d(50%, 0, 0)
    }
}

/* Slick testimonial cards: footer in normal flow; margin-top auto pins stars row when slides share one height */
.testimonials-slider .slick-slide.item.testimonial {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

@media (max-width: 575.98px) {
    .testimonials-slider .slick-track {
        align-items: flex-start;
    }

    .testimonials-slider .slick-slide {
        align-self: flex-start;
        height: auto;
    }

    .testimonials-slider .slick-slide.item.testimonial {
        height: auto;
    }
}

.testimonial-footer {
    position: static;
    margin-top: auto;
    width: 100%;
    padding: 0;
    padding-top: 0.75rem;
    flex-shrink: 0;
}

.hero-testimonials-slider .testimonial blockquote,
.hero-testimonials-slider .testimonial > .blockquote,
.testimonials-slider .testimonial blockquote,
.testimonials-slider .testimonial > .blockquote {
    padding-bottom: 0;
    margin-bottom: 0;
    flex: 0 1 auto;
    min-height: 0;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
}

/* Product listing cards: semantic <img> inside Bootstrap .ratio (replaces background-image tiles) */
.ratio > img.product-card-thumb-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* Home + /products grids: neutral letterbox + divider (matches related products) */
section.products a.card.block-link .ratio {
    background: transparent;
    border-bottom: none;
}

/* Custom Stickers product card: SVG thumb + label (scoped to .product-card-custom-stickers only) */
a.card.product-card-custom-stickers .product-card-custom-stickers__figure {
    display: flex;
    align-items: center;
    justify-content: center;
}

a.card.product-card-custom-stickers .product-card-custom-stickers__svg {
    max-width: 100%;
    width: auto;
    height: auto;
    max-height: 76%;
    object-fit: contain;
    object-position: center;
}

a.card.product-card-custom-stickers .product-card-title {
    font-family: inherit;
    font-size: 0.9375rem;
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.35;
    color: var(--color-ink-soft);
    text-align: center;
    margin-top: 0.5rem;
    margin-bottom: 0;
    padding: 0 0.5rem 0.5rem;
}

@media (min-width: 992px) {
    a.card.product-card-custom-stickers .product-card-custom-stickers__svg {
        max-height: 80%;
    }

    a.card.product-card-custom-stickers .product-card-title {
        font-size: 1rem;
        margin-top: 0.625rem;
    }
}

/* Product grid links only (not auth/checkout cards): token borders + hover softer than primary CTA */
a.card {
    border-color: var(--color-border);
}

a.card:hover {
    border-color: rgba(var(--sf-brand-rgb), 0.3);
}

/* ============================================================
   HOME: Our Products grid — premium UX polish
   ============================================================ */

/* No borders + hover lift affordance */
section.products a.card.block-link {
    border: none;
    box-shadow: none;
    border-radius: 12px;
    background-color: transparent;
    transition: background-color 0.18s ease, transform 0.2s ease;
}

section.products a.card.block-link:hover {
    background-color: rgba(var(--sf-brand-rgb), 0.05);
    transform: translateY(-3px);
}

/* Unified title: same font system for ALL 6 cards (h6 + product-card-title) */
section.products a.card.block-link h6,
section.products a.card.block-link .product-card-title {
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: -0.015em;
    line-height: 1.3;
    color: var(--color-ink-soft);
    text-align: center;
    padding: 0.35rem 0.5rem 0.5rem;
    margin: 0;
}

/* Mobile 2-col: compact font so titles don't wrap to 2 lines */
@media (max-width: 575.98px) {
    section.products a.card.block-link h6,
    section.products a.card.block-link .product-card-title {
        font-size: 0.7rem;
        letter-spacing: -0.01em;
        padding: 0.2rem 0.2rem 0.35rem;
    }
}

/* Desktop: refined scale */
@media (min-width: 992px) {
    section.products a.card.block-link h6,
    section.products a.card.block-link .product-card-title {
        font-size: 0.9375rem;
        padding: 0.5rem 0.75rem 0.625rem;
    }
}

/* Product page: less air between add-to-cart (#product .pb-5 was 3rem) and reviews */
#product.single-product.panel {
    padding-bottom: 1.25rem;
}

@media (min-width: 992px) {
    #product.single-product.panel {
        padding-bottom: 1.5rem;
    }
}

/* Product page reviews: header, cards, expand/collapse (UI only; scoped .product-page-reviews) */
section.testimonials.product-page-reviews {
    padding-top: 0.7rem;
}

@media (min-width: 992px) {
    section.testimonials.product-page-reviews {
        padding-top: 1rem;
    }
}

.product-page-reviews .reviews-heading {
    margin-bottom: 1.375rem;
}

@media (min-width: 992px) {
    .product-page-reviews .reviews-heading {
        margin-bottom: 1.75rem;
    }
}

.product-page-reviews .reviews-heading__title {
    font-weight: 600;
    letter-spacing: -0.025em;
    color: var(--color-ink-soft);
    margin-bottom: 0;
}

.product-page-reviews .reviews-heading__title.h2 {
    font-size: clamp(1.2rem, 1.05rem + 0.42vw, 1.35rem);
    line-height: 1.22;
}

.product-page-reviews .reviews-heading__stars .icon-star {
    font-size: 1rem;
    vertical-align: -0.06em;
}

.product-page-reviews .reviews-heading__meta {
    font-size: 0.8125rem;
    line-height: 1.35;
}

.product-page-reviews .testimonials-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.product-page-reviews .testimonial {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: none !important;
    background: var(--color-surface);
    border-radius: 14px;
    padding: 0.9rem 1.05rem !important;
    box-shadow: 0 2px 14px rgba(17, 24, 39, 0.055);
    border: 1px solid rgba(17, 24, 39, 0.06);
    transition: box-shadow 0.2s ease;
}

.product-page-reviews .testimonial-text {
    font-size: 0.9375rem;
    line-height: 1.55;
    color: rgba(31, 35, 40, 0.9);
    font-weight: 400;
}

.product-page-reviews .testimonial-rating {
    margin-bottom: 0.375rem !important;
}

.product-page-reviews .testimonial-rating .icon-star {
    font-size: 1rem !important;
}

.product-page-reviews .testimonial-item-footer {
    margin-top: 0.5rem !important;
}

.product-page-reviews .testimonial-author-name {
    font-size: 0.8125rem;
    font-weight: 600;
}

.product-page-reviews .testimonial-date,
.product-page-reviews .testimonial-author-source {
    font-size: 0.8125rem;
    line-height: 1.35;
}

.product-page-reviews .testimonial:hover {
    box-shadow: 0 4px 20px rgba(17, 24, 39, 0.07);
}

.product-page-reviews .reviews-container {
    position: relative;
}

/* Scrollport: min-height:0 helps nested flex/overflow; width for full-bleed overlay alignment */
.product-page-reviews .reviews-scroll {
    width: 100%;
    min-height: 0;
    box-sizing: border-box;
}

.product-page-reviews .reviews-container.reviews-collapsed .testimonials-list .testimonial:nth-child(n + 4) {
    display: none !important;
}

/* Collapsed: ~3 full cards (thumb + body); old clamp(16.5rem,46vw,22.5rem) was ~1 card tall */
.product-page-reviews .reviews-container.reviews-collapsed .reviews-scroll {
    max-height: clamp(25.5rem, 62vh, 36rem);
    overflow: hidden;
}

/* Expanded: tall enough to scroll on mobile; all list nodes scroll inside this box */
.product-page-reviews .reviews-container.reviews-expanded .reviews-scroll {
    max-height: min(82vh, 42rem);
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-y;
    scrollbar-gutter: stable;
    /* Room so last cards can scroll above bottom Show less overlay */
    padding-bottom: 3.25rem;
}

.product-page-reviews .reviews-reveal {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    min-height: 5.25rem;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: 0.2rem;
    pointer-events: none;
    z-index: 2;
}

.product-page-reviews .reviews-reveal__fade {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 252, 248, 0.45) 28%,
        rgba(255, 238, 220, 0.82) 68%,
        rgba(255, 244, 234, 0.97) 100%
    );
    pointer-events: none;
}

.product-page-reviews .reviews-container.reviews-expanded .reviews-reveal__fade {
    background: linear-gradient(
        to bottom,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 252, 248, 0.35) 40%,
        rgba(255, 236, 216, 0.75) 100%
    );
}

.product-page-reviews .reviews-reveal__toggle {
    position: relative;
    z-index: 1;
    pointer-events: auto;
    margin: 0;
    padding: 0.4rem 1rem 0.5rem;
    border: none;
    background: transparent;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: 0.02em;
    color: var(--color-brand-hover);
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.85);
    cursor: pointer;
    transition: color 0.15s ease, transform 0.12s ease;
}

.product-page-reviews .reviews-reveal__toggle:hover,
.product-page-reviews .reviews-reveal__toggle:focus-visible {
    color: var(--color-brand-hover);
}

.product-page-reviews .reviews-reveal__toggle:active {
    transform: translateY(1px);
}

.product-page-reviews .reviews-reveal__toggle:focus-visible {
    outline: 2px solid rgba(var(--sf-brand-rgb), 0.4);
    outline-offset: 2px;
    border-radius: 6px;
}

/* Product reviews mobile premium styles: public/assets/css/product-reviews.css */

.adv-icon-box {
    font-size: 1.7rem;
    line-height: 1;
    padding: 15px 17px
}

@media (min-width:768px) {
    .adv-icon-box {
        font-size: 3.4rem;
        padding: 25px 27px
    }
}

.product-gallery-thumbs-slider .slick-arrow {
    width: auto
}

.product-gallery-thumbs-slider .slick-arrow.slick-prev {
    left: -17px
}

.product-gallery-thumbs-slider .slick-arrow.slick-next {
    right: -3px
}

.product-gallery-thumbs-slider .slick-list {
    margin-left: -7.5px !important;
    margin-right: -7.5px !important
}

.product-gallery-thumbs-slider {
    margin-left: -7.5px;
    margin-right: -7.5px
}

.product-gallery-thumbs-slider.slick-initialized {
    margin-left: 0;
    margin-right: -15px
}

.product-gallery-thumbs-item-wrapper {
    cursor: pointer;
    margin-bottom: 5px;
    margin-top: 5px;
    padding-left: 7.5px;
    padding-right: 7.5px
}

.slick-initialized .product-gallery-thumbs-item-wrapper {
    margin-left: 7.5px !important;
    margin-right: 7.5px !important;
    padding-left: 0;
    padding-right: 0
}

.product-gallery-thumbs-item-wrapper.active .product-gallery-thumbs-item {
    box-shadow: 0 0 0 5px var(--color-brand);
    cursor: default
}

.product-gallery-thumbs-item-wrapper.active .image-container {
    box-shadow: 0 0 0 3px var(--color-surface)
}

.product-gallery-thumbs-item {
    border-radius: 3px
}

.choose-file-label .btn {
    min-width: 160px
}

.product-upload-ui .upload-action-shell {
    background: linear-gradient(180deg, var(--color-brand-tint) 0%, var(--color-surface-subtle) 100%) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 18px !important;
    box-shadow: 0 1px 1px rgba(14, 18, 28, 0.015), 0 12px 24px rgba(14, 18, 28, 0.05) !important;
    overflow: hidden;
    transition: background-color .18s ease, border-color .18s ease, transform .12s ease, box-shadow .18s ease;
}

.product-upload-ui .upload-action-shell:hover {
    background: linear-gradient(180deg, var(--color-brand-tint) 0%, var(--color-surface-subtle) 100%);
    border-color: var(--color-border);
    box-shadow: 0 1px 2px rgba(14, 18, 28, 0.03), 0 12px 26px rgba(14, 18, 28, 0.065);
}

.product-upload-ui .upload-action-shell:active {
    transform: scale(.998);
}

.product-upload-ui .upload-action-card {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 0;
    color: var(--color-ink-soft);
    cursor: pointer;
    display: flex;
    flex-wrap: wrap;
    gap: 14px !important;
    min-height: 112px !important;
    padding: 16px 18px 11px !important;
    text-align: left;
    transition: none;
    width: 100%;
    /* touch-action: manipulation — eliminates ~50-100ms double-tap-zoom
       detection delay on mobile browsers. Without it, fast taps near edges
       can be classified by browser as start-of-scroll or double-tap-zoom
       attempt, suppressing the click event entirely — file picker never
       opens. With it, every tap fires click immediately and pinch-zoom
       on the rest of the page still works. May 19 2026 follow-up to the
       <button> -> <label for=> fix; real-device test showed picker opened
       "почти всегда" but not on fast edge taps — this closes that gap. */
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

.product-upload-ui .upload-action-card:focus,
.product-upload-ui .upload-action-card:focus-visible {
    outline: none;
}

.product-upload-ui .upload-action-card__icon {
    align-items: center;
    background: linear-gradient(145deg, var(--color-accent) 0%, var(--color-brand) 52%, var(--color-brand-hover) 100%);
    border-radius: 14px;
    box-shadow: 0 5px 10px rgba(var(--sf-brand-rgb), 0.2);
    color: var(--color-surface);
    display: inline-flex;
    flex: 0 0 40px !important;
    height: 40px !important;
    justify-content: center;
    line-height: 1;
    opacity: 1;
    position: relative;
    width: 40px !important;
}

.product-upload-ui .upload-action-card__icon::before {
    border-left: 3px solid var(--color-surface);
    border-top: 3px solid var(--color-surface);
    content: "";
    display: block;
    height: 10px;
    position: absolute;
    transform: rotate(45deg) translateY(1px);
    width: 10px;
}

.product-upload-ui .upload-action-card__icon::after {
    background: var(--color-surface);
    border-radius: 2px;
    content: "";
    display: block;
    height: 13px;
    position: absolute;
    top: 16px;
    width: 4px;
}

.product-upload-ui .upload-action-card__text {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
    padding-top: 1px;
    width: calc(100% - 54px);
}

.product-upload-ui .upload-action-card__title {
    color: var(--color-ink-soft);
    display: block;
    font-size: 15px !important;
    font-weight: 600;
    letter-spacing: .001em;
    line-height: 1.18
}

.product-upload-ui .upload-action-card__subtitle {
    color: var(--color-ink-muted);
    display: block;
    font-size: 11px !important;
    font-weight: 400;
    line-height: 1.2
}

.product-upload-ui .upload-action-card__helper {
    align-items: center;
    border-top: 1px solid var(--color-border);
    color: var(--color-ink-muted);
    display: inline-flex;
    flex: 0 0 100%;
    font-size: 12px !important;
    font-weight: 400;
    line-height: 1.3;
    margin-top: 0;
    padding: 11px 2px 2px;
    width: 100%;
}

.product-upload-ui .upload-action-card__helper-icon {
    background: #dce9d6;
    border-radius: 999px;
    color: #7d9876;
    font-size: 8px;
    height: 18px;
    line-height: 18px;
    margin-right: 8px;
    opacity: .95;
    text-align: center;
    width: 18px;
}

.product-upload-ui .product-note {
    margin-top: 10px;
    margin-bottom: 5px !important
}

.product-upload-ui .product-note__summary {
    align-items: center;
    color: var(--color-ink-soft);
    background: linear-gradient(180deg, var(--color-brand-tint) 0%, var(--color-surface-subtle) 100%);
    border: 1px solid var(--color-border);
    border-radius: 18px;
    box-shadow: 0 1px 1px rgba(14, 18, 28, 0.015), 0 10px 20px rgba(14, 18, 28, 0.04);
    cursor: pointer;
    display: flex;
    font-size: 14px !important;
    font-weight: 600;
    gap: 10px;
    justify-content: flex-start;
    list-style: none;
    min-height: 54px !important;
    padding: 0 15px;
    transition: background-color .16s ease, border-color .16s ease, color .16s ease, transform .1s ease, box-shadow .18s ease;
    user-select: none
}

.product-upload-ui .product-note__summary::-webkit-details-marker {
    display: none
}

.product-upload-ui .product-note__summary::after {
    margin-left: auto;
    color: var(--color-ink-faint);
    content: "›";
    font-size: 24px !important;
    font-weight: 600;
    line-height: 1;
    transform: translateY(-1px);
    transition: transform .16s ease, color .16s ease, opacity .16s ease;
}

.product-upload-ui .product-note[open] .product-note__summary::after {
    opacity: .9;
    transform: translateY(-1px);
}

.product-upload-ui .product-note__summary:hover {
    background: linear-gradient(180deg, var(--color-brand-tint) 0%, var(--color-surface-subtle) 100%);
    border-color: var(--color-border);
    box-shadow: 0 7px 18px rgba(22, 28, 45, 0.045);
    color: var(--color-ink-soft);
}

.product-upload-ui .product-note__summary:active {
    transform: scale(.998);
}

.product-upload-ui .product-note__icon {
    display: none !important;
}

.product-upload-ui .product-note__body {
    margin-top: 6px;
    padding: 0 2px
}

.product-upload-ui .product-note .form-control {
    background: var(--color-surface-subtle);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    box-shadow: none;
    font-size: 14px;
    line-height: 1.35;
    min-height: 42px;
    padding: 10px 12px
}

.product-upload-ui .product-note .form-control:focus {
    border-color: var(--color-border);
    box-shadow: 0 0 0 3px rgba(31, 34, 40, 0.04)
}

.product-upload-ui .product-artwork.mb-4 {
    margin-bottom: 8px !important
}

.product-upload-ui .product-note__label {
    display: inline-flex;
    gap: 5px;
    position: relative;
    padding-left: 25px;
}

.product-upload-ui .product-note__label-main {
    color: var(--color-ink-soft);
    font-weight: 600;
}

.product-upload-ui .product-note__label-optional {
    color: var(--color-ink-muted);
    font-size: .93em;
    font-weight: 400;
}

.product-upload-ui .product-option-label {
    display: none !important;
}

.product-upload-ui .product-note__label::before {
    align-items: center;
    background: linear-gradient(145deg, var(--color-accent) 0%, var(--color-brand) 52%, var(--color-brand-hover) 100%);
    border-radius: 999px;
    box-shadow: 0 3px 8px rgba(var(--sf-brand-rgb), 0.22);
    color: var(--color-surface);
    content: "✎";
    display: inline-flex;
    font-size: 11px;
    font-weight: 700;
    height: 18px;
    justify-content: center;
    left: 0;
    line-height: 1;
    position: absolute;
    top: 50%;
    transform: translateY(-52%);
    width: 18px;
}

/* Upload UI v2: fully isolated visual layer */
.product-upload-ui--v2 .text-muted {
    color: inherit !important;
    opacity: 1 !important;
}

.product-upload-ui--v2 .product-artwork.mb-4 {
    margin: 0 0 10px !important;
}

.product-upload-ui--v2 .product-note.mb-3 {
    margin: 0 !important;
}

.product-upload-ui--v2 .upload-action-shell,
.product-upload-ui--v2 .upload-action-card,
.product-upload-ui--v2 .product-note__summary {
    box-shadow: none !important;
}

.product-upload-ui--v2 .upload-action-shell {
    background: linear-gradient(165deg, var(--color-brand-tint) 0%, var(--color-surface-subtle) 48%, var(--color-surface-subtle) 100%) !important;
    border: 1px solid rgba(236, 232, 227, 0.7) !important;
    border-radius: 20px !important;
    box-shadow: 0 1px 0 rgba(17, 24, 39, 0.015), 0 3px 10px rgba(17, 24, 39, 0.03) !important;
    overflow: hidden;
}

.product-upload-ui--v2 .upload-action-card {
    align-items: center;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: var(--color-ink-soft) !important;
    cursor: pointer;
    display: flex;
    flex-wrap: wrap;
    gap: 14px !important;
    min-height: 114px !important;
    padding: 16px 18px 12px !important;
    text-align: left;
    width: 100% !important;
}

.product-upload-ui--v2 .upload-action-card:focus,
.product-upload-ui--v2 .upload-action-card:focus-visible {
    outline: none !important;
}

.product-upload-ui--v2 .upload-action-card__icon {
    align-items: center;
    background: radial-gradient(120% 120% at 28% 18%, var(--color-accent) 0%, var(--color-brand) 45%, var(--color-brand) 100%) !important;
    border-radius: 50% !important;
    box-shadow: 0 8px 20px rgba(var(--sf-brand-rgb), 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.35) !important;
    display: inline-flex;
    flex: 0 0 52px !important;
    height: 52px !important;
    justify-content: center;
    position: relative;
    width: 52px !important;
}

.product-upload-ui--v2 .upload-action-card__icon::before {
    border-left: 3.5px solid var(--color-surface);
    border-top: 3.5px solid var(--color-surface);
    content: "";
    display: block;
    height: 11px;
    position: absolute;
    transform: rotate(45deg) translateY(-1px);
    width: 11px;
}

.product-upload-ui--v2 .upload-action-card__icon::after {
    background: var(--color-surface);
    border-radius: 2px;
    content: "";
    display: block;
    height: 15px;
    position: absolute;
    top: 19px;
    width: 4px;
}

.product-upload-ui--v2 .upload-action-card__text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    width: calc(100% - 65px);
}

.product-upload-ui--v2 .upload-action-card__title {
    color: var(--color-ink-soft);
    font-size: 17px !important;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.18;
}

.product-upload-ui--v2 .upload-action-card__subtitle {
    color: var(--color-ink-muted);
    font-size: 13px !important;
    font-weight: 400;
    line-height: 1.2;
}

.product-upload-ui--v2 .upload-action-card__title .upload-action-card__subtitle {
    display: inline !important;
}

.product-upload-ui--v2 .upload-action-card__helper {
    align-items: center;
    border-top: 1px solid var(--color-border) !important;
    color: var(--color-ink-muted) !important;
    display: inline-flex;
    flex: 0 0 100%;
    font-size: 13px !important;
    font-weight: 400;
    line-height: 1.3;
    margin-top: 0;
    padding: 10px 1px 2px;
    width: 100%;
}

.product-upload-ui--v2 .upload-action-card__helper-icon {
    background: #dce8d7 !important;
    border-radius: 999px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
    color: #789272 !important;
    flex: 0 0 18px;
    font-size: 8px;
    height: 18px;
    line-height: 18px;
    margin-right: 8px;
    text-align: center;
    width: 18px;
}

.product-upload-ui--v2 .product-note {
    margin-top: 8px !important;
}

.product-upload-ui--v2 .product-note__summary {
    align-items: center;
    background: linear-gradient(165deg, var(--color-brand-tint) 0%, var(--color-surface-subtle) 54%, var(--color-surface-subtle) 100%) !important;
    border: 1px solid rgba(236, 232, 227, 0.7) !important;
    border-radius: 18px !important;
    box-shadow: 0 1px 0 rgba(17, 24, 39, 0.015), 0 3px 10px rgba(17, 24, 39, 0.03) !important;
    color: var(--color-ink-soft) !important;
    display: flex;
    font-size: 15px !important;
    font-weight: 600;
    gap: 10px;
    min-height: 54px !important;
    padding: 0 15px;
}

.product-upload-ui--v2 .product-note__summary::after {
    color: var(--color-ink-faint) !important;
    font-size: 24px !important;
    margin-left: auto;
}

.product-upload-ui--v2 .product-note__icon {
    display: none !important;
}

.product-upload-ui--v2 .product-note__label {
    display: inline-flex;
    gap: 5px;
    padding-left: 25px;
    position: relative;
}

.product-upload-ui--v2 .product-note__label-main {
    color: var(--color-ink-soft);
    font-weight: 600;
}

.product-upload-ui--v2 .product-note__label-optional {
    color: var(--color-ink-muted);
    font-size: .93em;
    font-weight: 400;
}

.product-upload-ui--v2 .product-note__label::before {
    align-items: center;
    background: radial-gradient(130% 120% at 20% 14%, var(--color-accent) 0%, var(--color-brand) 42%, var(--color-brand-hover) 100%);
    border-radius: 999px;
    box-shadow: 0 3px 8px rgba(var(--sf-brand-rgb), 0.23);
    color: var(--color-surface);
    content: "✎";
    display: inline-flex;
    font-size: 11px;
    font-weight: 700;
    height: 18px;
    justify-content: center;
    left: 0;
    line-height: 1;
    position: absolute;
    top: 50%;
    transform: translateY(-52%);
    width: 18px;
}

.product-upload-ui--v2 .product-note .form-control {
    background: var(--color-surface-subtle) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}

/* iOS Safari: font-size < 16px on text fields triggers zoom on focus; zoom may not reset after blur. */
@media (max-width: 991.98px) {
    .product-upload-ui--v2 .product-note textarea.form-control,
    .product-upload-ui--v2 .product-note__body textarea.form-control,
    #order-count-products .form-product-item textarea.form-control.auto-height {
        font-size: 16px !important;
        line-height: 1.4;
    }
}

/* Upload v2 hero — horizontal list row (optional step, checkout-adjacent rhythm) */
.product-upload-ui--v2 .ux-upload-note-card:has(.ux-upload-hero-card) {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

.product-upload-ui--v2 .ux-upload-hero-card {
    background: var(--color-surface-subtle);
    border: 1px solid rgba(17, 24, 39, 0.07);
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(17, 24, 39, 0.04);
    overflow: hidden;
}

.product-upload-ui--v2 .upload-action-shell--hero {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}

.product-upload-ui--v2 .upload-action-card--hero.upload-action-card--hero-row,
.product-upload-ui--v2 .upload-action-card--hero {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: left !important;
    gap: 0 !important;
    min-height: 0 !important;
    width: 100% !important;
    padding: 0.7rem 0.85rem 0.7rem 0.75rem !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    border-bottom: 1px solid rgba(17, 24, 39, 0.06);
    -webkit-tap-highlight-color: rgba(var(--sf-brand-rgb), 0.14);
    transition: background-color 0.18s ease, transform 0.18s ease;
}

@media (hover: hover) {
    .product-upload-ui--v2 .upload-action-card--hero.upload-action-card--hero-row:hover,
    .product-upload-ui--v2 .upload-action-card--hero:hover {
        background: rgba(var(--sf-brand-rgb), 0.065) !important;
        transform: scale(1.004);
    }
}

.product-upload-ui--v2 .upload-action-card--hero:active {
    background: rgba(var(--sf-brand-rgb), 0.1) !important;
    transform: scale(0.992);
}

/* Reliable upload (May 28 2026 rebuild): native <label> WRAPS the <input type=file>.
   The label (.upload-action-card--hero) is the tap target and a tap activates the
   CONTAINED input directly — no for= forwarding at a distance, no transparent overlay
   (both were unreliable on iOS WebKit: every-other-tap / won't re-open). The input is
   sr-only-clipped and kept in the layout tree (never opacity:0, never pointer-events:none
   — both of those broke iOS). Rich card content stays inside the label. */
.product-upload-ui--v2 .upload-action-shell--hero {
    position: relative;
}
.product-upload-ui--v2 .upload-action-card--hero.choose-file-button {
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}
.product-upload-ui--v2 .upload-hero-sr-input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.product-upload-ui--v2 .file-upload-label-box:active .upload-action-card--hero {
    background: rgba(var(--sf-brand-rgb), 0.1) !important;
    transform: scale(0.992);
}

.product-upload-ui--v2 .upload-action-card__hero-row-inner {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    gap: 0.65rem;
    min-width: 0;
}

.product-upload-ui--v2 .upload-action-card__hero-icon {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-brand);
    line-height: 0;
    border-radius: 12px;
    background: rgba(var(--sf-brand-rgb), 0.1);
}

.product-upload-ui--v2 .upload-action-card__hero-icon-svg {
    width: 24px;
    height: 24px;
    display: block;
    flex-shrink: 0;
}

.product-upload-ui--v2 .upload-action-card__hero-text {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 0.1rem;
    text-align: left;
}

.product-upload-ui--v2 .upload-action-card__hero-title {
    display: block;
    width: 100%;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--color-ink-soft);
    letter-spacing: -0.01em;
    line-height: 1.28;
    margin: 0;
}

.product-upload-ui--v2 .upload-action-card__hero-formats {
    display: block;
    width: 100%;
    font-size: 0.6875rem;
    font-weight: 400;
    line-height: 1.32;
    color: var(--color-ink-faint);
    margin: 0;
}

.product-upload-ui--v2 .upload-action-card__hero-later {
    display: block;
    width: 100%;
    font-size: 0.65625rem;
    font-weight: 400;
    line-height: 1.32;
    color: var(--color-ink-faint);
    margin: 0;
}

.product-upload-ui--v2 .upload-action-card__hero-chevron {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-ink-faint);
    line-height: 0;
    margin-left: 0.15rem;
}

.product-upload-ui--v2 .upload-action-card__hero-chevron svg {
    display: block;
    width: 20px;
    height: 20px;
}

.product-upload-ui--v2 .upload-action-card--hero:focus,
.product-upload-ui--v2 .upload-action-card--hero:focus-visible {
    outline: 2px solid rgba(var(--sf-brand-rgb), 0.25) !important;
    outline-offset: 2px;
}

.product-upload-ui--v2 .ux-upload-hero-card .product-note--hero-card {
    margin: 0 !important;
    border-top: none;
}

.product-upload-ui--v2 .ux-upload-hero-card .product-note__summary {
    margin: 0.35rem 0 0 !important;
    padding: 0.45rem 0.15rem 0.45rem 0.65rem !important; /* align with upload hero row padding */
    min-height: 0 !important;
    border-radius: 0 !important;
    border: none !important;
    border-top: 1px solid rgba(17, 24, 39, 0.07) !important;
    background: transparent !important;
    box-shadow: none !important;
    gap: 0.5rem !important;
    align-items: center !important;
    font-size: 0.8125rem !important;
    font-weight: 500 !important;
}

.product-upload-ui--v2 .ux-upload-hero-card .product-note__icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: center !important;
    width: 1.125rem !important;
    height: 1.125rem !important;
    flex: 0 0 1.125rem !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--color-ink-muted) !important;
    margin: 0 !important;
}

.product-upload-ui--v2 .ux-upload-hero-card .product-note__icon-svg {
    width: 100%;
    height: 100%;
    display: block;
    flex-shrink: 0;
}

.product-upload-ui--v2 .ux-upload-hero-card .product-note__label-optional {
    color: var(--color-ink-faint);
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.3;
}

.product-upload-ui--v2 .ux-upload-hero-card .product-note__label {
    display: inline-flex !important;
    align-items: center !important;
    flex-wrap: wrap;
    gap: 0.2em 0.45rem;
    padding-left: 0 !important;
    flex: 1 1 auto;
    justify-content: flex-start !important;
    align-self: center !important;
}

.product-upload-ui--v2 .ux-upload-hero-card .product-note__label-main {
    line-height: 1.3;
    font-weight: 500;
    color: var(--color-ink-muted);
}

.product-upload-ui--v2 .ux-upload-hero-card .product-note__label::before {
    display: none !important;
    content: none !important;
}

.product-upload-ui--v2 .ux-upload-hero-card .product-note__summary::after {
    content: "\203A";
    margin-left: auto;
    align-self: center;
    font-size: 1.2rem;
    font-weight: 400;
    color: var(--color-ink-faint);
    line-height: 1;
    opacity: 0.9;
}

.product-upload-ui--v2 .ux-upload-hero-card .product-note__body {
    padding: 0 0 0.65rem;
}

.label-primary {
    background-color: var(--color-surface-subtle);
    border-radius: 5px;
    cursor: pointer;
    padding: 5px 10px
}

/* Product calculator: card panels + button grid layout (StickersFox colors; no logic changes) */
.add-to-cart-form .calculator-panel {
    background-color: var(--color-surface);
    border: 1px solid rgba(0, 0, 0, 0.05);
    border-radius: 18px;
    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.03);
    padding: 1.1rem 1.25rem 1.35rem;
    box-sizing: border-box
}

.add-to-cart-form .calculator-panel.calculator-shape-section {
    background-color: var(--color-surface)
}

.add-to-cart-form .calculator-panel--qty .product-quantity {
    margin-bottom: 0 !important
}

/* Wraps pill + guarantee; desktop/tablet: no layout box (children stay direct flow). Purchase-desktop is a real box on lg+. */
.add-to-cart-form .product-trust-cluster:not(.product-trust-cluster--purchase-desktop) {
    display: contents;
}

/* Trust pill: Free proof | 48h turnaround (custom stickers qty panel) */
.add-to-cart-form .product-trust-pill {
    display: inline-flex;
    align-items: center;
    flex-wrap: nowrap;
    max-width: 100%;
    margin-top: 1rem;
    padding: 0.9rem 1.65rem;
    background: linear-gradient(180deg, rgba(255, 253, 251, 0.98) 0%, rgba(255, 246, 236, 0.92) 100%);
    border: none;
    border-radius: 999px;
    box-shadow: 0 2px 10px rgba(17, 24, 39, 0.045);
    box-sizing: border-box;
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    letter-spacing: normal;
    transition: background 0.22s ease, box-shadow 0.22s ease;
}

@media (hover: hover) {
    .add-to-cart-form .product-trust-pill:hover {
        background: linear-gradient(180deg, var(--color-brand-tint) 0%, var(--color-brand-tint) 100%);
        box-shadow: 0 3px 14px rgba(17, 24, 39, 0.055);
    }

    .add-to-cart-form .product-trust-pill:active {
        box-shadow: 0 1px 6px rgba(17, 24, 39, 0.04);
    }
}

.add-to-cart-form .product-trust-pill__cell {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
    color: var(--color-ink-soft);
    font-size: 0.9375rem;
    font-weight: 500;
    line-height: 1.35;
}

.add-to-cart-form .product-trust-pill__text {
    white-space: normal;
    min-width: 0;
    text-wrap: balance;
}

.add-to-cart-form .product-trust-pill__cell:not(.product-trust-pill__cell--clock) {
    flex-shrink: 0;
}

.add-to-cart-form .product-trust-pill__icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-brand);
    line-height: 0;
}

.add-to-cart-form .product-trust-pill__icon svg {
    display: block;
    width: 22px;
    height: 22px;
}

.add-to-cart-form .product-trust-pill__divider {
    flex: 0 0 auto;
    width: 1px;
    height: 1.35rem;
    margin: 0 1.25rem;
    background: rgba(var(--sf-brand-rgb), 0.14);
    border-radius: 1px;
    align-self: center;
}

@media (max-width: 575.98px) {
    .add-to-cart-form .product-trust-pill {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        width: 100%;
        justify-content: space-between;
        padding: 0.75rem 1.05rem;
        column-gap: 0.35rem;
    }

    .add-to-cart-form .product-trust-pill__cell {
        font-size: 0.875rem;
        line-height: 1.28;
        flex: 0 1 auto;
    }

    .add-to-cart-form .product-trust-pill__cell--clock .product-trust-pill__text {
        max-width: min(9.5rem, 42vw);
    }

    .add-to-cart-form .product-trust-pill__divider {
        flex-shrink: 0;
        margin: 0 0.5rem;
        align-self: center;
    }

    .add-to-cart-form .product-trust-pill__icon svg {
        width: 20px;
        height: 20px;
    }
}

/* Satisfaction — compact horizontal badge (low height, quick scan) */
.add-to-cart-form .product-trust-satisfaction {
    position: relative;
    display: block;
    margin-top: 0.4rem;
    margin-bottom: 0.45rem;
    padding: 0;
    max-width: 100%;
    box-sizing: border-box;
    border: none;
    background: transparent;
    box-shadow: none;
    border-radius: 0;
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    letter-spacing: normal;
    text-align: left;
    overflow: visible;
}

.add-to-cart-form .product-trust-satisfaction__badge {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    max-width: 100%;
    padding: 0.38rem 0.62rem;
    border-radius: 10px;
    background: linear-gradient(180deg, rgba(255, 253, 251, 0.98) 0%, rgba(255, 246, 236, 0.92) 100%);
    border: 1px solid rgba(var(--sf-brand-rgb), 0.14);
    box-shadow: 0 1px 3px rgba(17, 24, 39, 0.035);
    box-sizing: border-box;
}

.add-to-cart-form .product-trust-satisfaction__text {
    min-width: 0;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    justify-content: center;
}

.add-to-cart-form .product-trust-satisfaction__emblem {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 1.375rem;
    height: 1.375rem;
    color: var(--color-brand);
    line-height: 0;
}

.add-to-cart-form .product-trust-satisfaction__icon {
    display: block;
    width: 20px;
    height: 20px;
}

.add-to-cart-form .product-trust-satisfaction__title {
    margin: 0;
    padding: 0;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.28;
    color: var(--color-ink-soft);
    letter-spacing: normal;
}

.add-to-cart-form .product-trust-satisfaction__subtitle {
    margin: 0;
    padding: 0;
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.35;
    color: var(--color-ink-muted);
    text-wrap: balance;
}

@media (min-width: 576px) {
    .add-to-cart-form .product-trust-satisfaction {
        margin-top: 0.5rem;
        margin-bottom: 0.5rem;
    }

    .add-to-cart-form .product-trust-satisfaction__badge {
        padding: 0.42rem 0.72rem;
        gap: 0.5rem;
        border-radius: 11px;
    }

    .add-to-cart-form .product-trust-satisfaction__emblem {
        width: 1.5rem;
        height: 1.5rem;
    }

    .add-to-cart-form .product-trust-satisfaction__icon {
        width: 22px;
        height: 22px;
    }

    .add-to-cart-form .product-trust-satisfaction__title {
        font-size: 0.9375rem;
        font-weight: 500;
        line-height: 1.35;
    }

    .add-to-cart-form .product-trust-satisfaction__subtitle {
        font-size: 0.875rem;
    }
}

/* md+: hide duplicate trust in form except desktop purchase strip (mobile block uses d-md-none) */
@media (min-width: 768px) {
    .add-to-cart-form .product-trust-cluster:not(.product-trust-cluster--purchase-desktop) {
        display: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }
}

/* Desktop (lg+): one-line trust bar in purchase column (3 equal slots: proof | 48h | guarantee) */
@media (min-width: 992px) {
    #product .add-to-cart-form .product-trust-cluster--purchase-desktop {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: space-evenly;
        gap: 0;
        margin-top: 0 !important;
        margin-bottom: 0.45rem !important;
        padding: 0.34rem 0.42rem 0.36rem;
        background: linear-gradient(180deg, var(--color-brand-tint) 0%, var(--color-brand-tint) 24%, var(--color-surface) 58%, var(--color-surface-subtle) 100%);
        border: 1px solid rgba(15, 23, 42, 0.07);
        border-radius: 12px;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.95),
            0 1px 3px rgba(17, 24, 39, 0.04);
    }

    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-pill {
        display: contents !important;
        margin-top: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        border: none;
        border-radius: 0;
        box-shadow: none !important;
    }

    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-pill__divider {
        display: none !important;
    }

    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-pill__cell {
        flex: 1 1 0;
        min-width: 0;
        display: flex !important;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 0.3rem;
        padding: 0 0.28rem;
        margin: 0;
        border: none;
        border-radius: 0;
        background: transparent !important;
        box-shadow: none !important;
        height: auto;
        position: relative;
    }

    /* Soft separators between the three items */
    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-pill__cell:first-of-type::after,
    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-pill__cell--clock::after {
        content: "";
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 1px;
        height: 1.05rem;
        background: linear-gradient(
            180deg,
            transparent 0%,
            rgba(var(--sf-brand-rgb), 0.18) 22%,
            rgba(var(--sf-brand-rgb), 0.18) 78%,
            transparent 100%
        );
        pointer-events: none;
    }

    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-satisfaction {
        flex: 1 1 0;
        min-width: 0;
        margin: 0 !important;
        padding: 0;
        display: flex !important;
        align-items: center;
        justify-content: center;
        background: transparent;
        border: none;
        border-radius: 0;
        box-shadow: none;
    }

    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-satisfaction__badge {
        display: flex !important;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: center;
        gap: 0.3rem;
        width: 100%;
        max-width: 100%;
        padding: 0 0.28rem !important;
        margin: 0;
        border: none !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-satisfaction__text {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        gap: 0;
        min-width: 0;
    }

    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-satisfaction__subtitle {
        display: none !important;
    }

    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-pill__text,
    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-satisfaction__title {
        font-size: 0.71875rem;
        font-weight: 600;
        line-height: 1.22;
        color: var(--color-ink-soft);
        text-wrap: balance;
        letter-spacing: -0.01em;
    }

    @media (min-width: 1200px) {
        #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-pill__text,
        #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-satisfaction__title {
            font-size: 0.78125rem;
        }

        #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-pill__cell,
        #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-satisfaction__badge {
            gap: 0.38rem;
            padding-left: 0.38rem;
            padding-right: 0.38rem;
        }
    }

    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-pill__icon,
    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-satisfaction__emblem {
        flex-shrink: 0;
        color: rgba(var(--sf-brand-rgb), 0.88);
    }

    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-pill__icon svg,
    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-satisfaction__icon {
        display: block;
        width: 16px;
        height: 16px;
    }

    @media (min-width: 1200px) {
        #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-pill__icon svg,
        #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-satisfaction__icon {
            width: 17px;
            height: 17px;
        }
    }

    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-satisfaction__title {
        margin: 0;
        padding: 0;
    }

    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-pill:hover,
    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .product-trust-pill:active {
        background: transparent !important;
        box-shadow: none !important;
    }

    /* Custom stickers desktop: subtitle under 48h (lg+ only; partial not used for custom on mobile) */
    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .trust-item-desktop {
        align-items: flex-start;
    }

    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .trust-item-desktop .product-trust-pill__icon {
        margin-top: 1px;
    }

    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .trust-item-desktop .trust-text {
        display: flex;
        flex-direction: column;
        gap: 0;
        min-width: 0;
        text-align: left;
    }

    #product .add-to-cart-form .product-trust-cluster--purchase-desktop .trust-item-desktop .trust-sub {
        font-size: 11px;
        color: #888780;
        margin-top: 2px;
        line-height: 1.3;
        font-weight: 400;
    }
}

/* Mobile: single unified trust surface (no nested “second card” for guarantee) */
@media (max-width: 575.98px) {
    .add-to-cart-form .product-trust-cluster:not(.product-trust-cluster--purchase-desktop) {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        margin-top: 0.6rem;
        margin-bottom: 0.45rem;
        padding: 0.4rem 0.55rem 0.52rem;
        background: linear-gradient(180deg, var(--color-brand-tint) 0%, var(--color-brand-tint) 22%, var(--color-surface) 58%, var(--color-surface-subtle) 100%);
        border: 1px solid rgba(0, 0, 0, 0.06);
        border-radius: 16px;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 1),
            0 1px 6px rgba(0, 0, 0, 0.035),
            0 3px 14px rgba(17, 24, 39, 0.04);
    }

    .add-to-cart-form .product-trust-cluster:not(.product-trust-cluster--purchase-desktop) .product-trust-pill {
        margin-top: 0;
        padding: 0.52rem 0.65rem 0.55rem;
        background: transparent;
        border-radius: 0;
        box-shadow: none;
        border-bottom: 1px solid rgba(var(--sf-brand-rgb), 0.12);
    }

    .add-to-cart-form .product-trust-cluster:not(.product-trust-cluster--purchase-desktop) .product-trust-satisfaction {
        margin-top: 0;
        margin-bottom: 0;
        padding: 0;
        background: transparent;
        border: none;
        border-radius: 0;
        box-shadow: none;
    }

    .add-to-cart-form .product-trust-cluster:not(.product-trust-cluster--purchase-desktop) .product-trust-satisfaction__badge {
        padding: 0.38rem 0.35rem 0.4rem;
        background: transparent;
        border: none;
        box-shadow: none;
        border-radius: 0;
        gap: 0.5rem;
    }

}

.add-to-cart-form .calculator-trust-row {
    align-items: start;
    border-top: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 22px;
    row-gap: 11px;
    justify-content: stretch;
    line-height: 1.45;
    margin-top: 18px;
    padding-top: 8px;
    text-align: left
}

.add-to-cart-form .calculator-trust-item {
    align-items: center;
    display: inline-flex;
    min-width: 0;
}

.add-to-cart-form .calculator-trust-item + .calculator-trust-item::before {
    content: none;
    display: none;
}

.add-to-cart-form .calculator-trust-label {
    color: var(--color-ink-soft);
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.01em;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 0;
    padding: 0;
    border: 0;
    background: transparent;
    line-height: 1.5;
    transition: color 0.18s ease, opacity 0.18s ease;
}

.add-to-cart-form .calculator-trust-icon {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: var(--color-brand);
    line-height: 1;
    opacity: 0.86;
    margin-top: 0;
}

.add-to-cart-form .calculator-trust-label:hover {
    color: var(--color-ink-soft);
    opacity: 1;
}

.add-to-cart-form .calculator-trust-label:active {
    transform: none;
}

/* Quantity list: first 4 tiles + in-card “More quantities” + tail (tail hidden on mobile when collapsed) */
.add-to-cart-form .product-qty-options {
    display: flex;
    flex-direction: column;
    width: 100%
}

.add-to-cart-form .product-qty-more {
    position: relative;
    width: 100%;
    margin-top: 0;
}

.add-to-cart-form .product-qty-more__list {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.add-to-cart-form .product-qty-more__tail {
    display: flex;
    flex-direction: column;
    width: 100%;
}

@media (max-width: 767px) {
    .add-to-cart-form .product-qty-more--collapsed .product-qty-more__tail {
        display: none !important;
    }
}

.add-to-cart-form .product-qty-more__reveal {
    position: static;
    width: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    display: block;
    pointer-events: auto;
    z-index: auto;
}

/* Size options: 3-column button grid (form calculator only; not FAQ filters) */
.add-to-cart-form .product-size .product-size-options {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(3, 1fr)
}

.add-to-cart-form .product-size .product-size-options .product-size-label {
    align-items: center;
    border: 1px solid var(--color-border);
    border-radius: 12px;
    box-sizing: border-box;
    display: flex;
    font-size: 13px;
    justify-content: center;
    line-height: 1.2;
    margin-bottom: 0 !important;
    min-height: calc(4 * 1.2em + 12px);
    padding: 6px 8px;
    text-align: center;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    word-break: break-word;
    /* iOS Safari fast-edge-tap fix: mirror of the proven .upload-action-card
       treatment — touch-action:manipulation stops double-tap-zoom / scroll
       detection from eating the first tap near the button edges. */
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

.add-to-cart-form .product-size .size-radio:checked + .product-size-label {
    border-color: var(--color-brand);
    box-shadow: 0 0 0 2px rgba(var(--sf-brand-rgb), 0.12);
}

.add-to-cart-form .product-size .product-size-options .custom,
.add-to-cart-form .product-size .product-size-options #size-custom-input {
    grid-column: 1 / -1
}

.add-to-cart-form .product-size .product-size-options #size-custom-input {
    justify-self: stretch
}

/* Custom wrapper: span full calculator grid row only. No flex/display here — parent is flex on mobile (≤768); grid-column is ignored then. */
.add-to-cart-form .product-size .product-size-options .product-size-custom-group {
    grid-column: 1 / -1;
}

/* Mobile: center the last row when there are 2 items (e.g. 5×4 + 6×5, 5×5 + 6×6) */
@media (max-width: 768px) {
    .add-to-cart-form .product-size .product-size-options {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
    }

    .add-to-cart-form .product-size .product-size-options .product-size-label {
        flex: 0 0 calc(33.333% - 6px);
        max-width: calc(33.333% - 6px);
    }

    .add-to-cart-form .product-size .product-size-options .custom,
    .add-to-cart-form .product-size .product-size-options #size-custom-input {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .add-to-cart-form .product-size .product-size-options .product-size-custom-group {
        flex: 0 0 100%;
        max-width: 100%;
        width: 100%;
        box-sizing: border-box;
    }

    /* Restore pre-wrapper full-width custom label + panel (they are no longer direct flex children of .product-size-options) */
    .add-to-cart-form .product-size .product-size-options .product-size-custom-group > .product-size-label.custom,
    .add-to-cart-form .product-size .product-size-options .product-size-custom-group > #size-custom-input {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* Custom size (mobile-only): compact width × height inputs, no big orange block */
    .add-to-cart-form .product-size .product-size-options .product-size-label.custom {
        min-height: 44px;
        padding: 6px 10px;
        font-size: 14px;
        font-weight: 500;
        line-height: 1.2;
    }

    /* Keep the Custom label visible even when selected */
    .size-radio:checked + label #size-custom-text {
        display: inline !important;
    }

    .size-radio:checked + label.label-custom-value {
        display: flex !important;
    }

    /* Expanded custom input row */
    .size-radio:checked + label + #size-custom-input {
        display: flex !important;
    }

    #size-custom-input {
        width: 100%;
        background: transparent !important;
        border: 0 !important;
        padding: 8px 0 0;
        box-sizing: border-box;
        display: none !important;
    }

    #size-custom-input .size-custom-ui-row {
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: flex-start;
        gap: 10px;
        padding: 0 6px;
    }

    #size-custom-input .size-custom-ui-field {
        flex: 1 1 0;
        max-width: 150px;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    #size-custom-input .size-custom-ui-unit {
        font-size: 12px;
        font-weight: 600;
        line-height: 1.1;
        color: rgba(0, 0, 0, 0.6);
        width: 100%;
        text-align: center;
        margin-bottom: 6px;
    }

    #size-custom-input .size-custom-ui-inch {
        display: inline-block;
        padding-bottom: 1px;
        border-bottom: 2px solid rgba(var(--sf-brand-rgb), 0.35);
        transform: translateY(-1px);
    }

    #size-custom-input .size-custom-input {
        width: 100%;
        height: 46px; /* ~44–48px */
        border-radius: 12px; /* match buttons */
        border: 1px solid var(--color-border);
        background: var(--color-surface);
        font-size: 16px;
        font-weight: 600;
        text-align: center;
        padding: 8px 10px;
        color: var(--color-ink);
        box-sizing: border-box;
        outline: none;
    }

    #size-custom-input .size-custom-input:focus {
        border-color: rgba(var(--sf-brand-rgb), 0.9);
        box-shadow: 0 0 0 3px rgba(var(--sf-brand-rgb), 0.16);
    }

    #size-custom-input .size-custom-sep {
        font-size: 20px;
        font-weight: 700;
        line-height: 1;
        color: rgba(0, 0, 0, 0.55);
        user-select: none;
        padding-top: 26px; /* centers ÷ between inputs + unit label */
        flex: 0 0 auto;
    }
}

.add-to-cart-form .product-size .product-size-select {
    border-radius: 12px;
    min-height: 48px
}

/* Quantity: selectable rows (button-like), brand accent when checked */
.add-to-cart-form .product-qty-options .qty-option {
    align-items: center;
    background: var(--color-surface-subtle);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 6px !important;
    padding: 10px 12px
}

.add-to-cart-form .product-qty-options .qty-option:has(.qty-radio:checked) {
    background: linear-gradient(90deg, rgba(var(--sf-brand-rgb), 0.14) 0%, rgba(var(--sf-brand-rgb), 0.05) 100%);
    border-color: var(--color-brand)
}

/* TZ-A2 Layer 1 (May 28 2026) — Upload Artwork mobile tap fix.
   Replaces `.d-none` (display:none) on the <input type="file">. iOS Safari
   has a known intermittent failure to trigger the file picker via <label for=>
   when the input itself, or any ancestor, is display:none. The
   .visually-hidden-input pattern keeps the input renderable in the layout
   tree but invisible/non-interactive to the user, so WebKit can always
   traverse to it from the label click.
   Real-customer evidence: Clarity vrqf5bajpg/rf4zbo/zwbb8q (12m19s mobile
   Bing session, 2+ min struggle, dead-click hashes 781x593ue / 781x58uwr /
   83tt5f6tp). Applied to product/show.blade.php and the two reusable
   product-upload partials. */
.visually-hidden-input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
    opacity: 0;
    /* No pointer-events:none here. That property on the hidden input intermittently
       breaks iOS Safari <label for=> activation (every-other-tap: press flashes the
       :active state but the click/picker doesn't fire). The working qty control uses
       d-none and has no such rule; the canonical .visually-hidden / .sr-only pattern
       omits pointer-events too. Removed May 28 2026 after touch-action (#137) alone
       did not fix size + upload edge/repeat taps on iPhone 17 Safari. */
}

/* Wave 4a — Upload Artwork loading state (PDP).
   Legacy JS wrote progress text into a .status element that no longer exists in the
   redesigned product-upload-block markup, so users saw NO feedback for 5-7 seconds
   between file pick and thumbnail appearance. This adds a spinner overlay + dimmed
   label-box + live progress % while the simpleUpload XHR is in flight.
   Class .uploading is toggled by app.js start/success/error callbacks. */
.file-upload-label-box.uploading {
    position: relative;
    pointer-events: none;
    opacity: 0.55;
    transition: opacity 0.15s ease-out;
}

.file-upload-label-box.uploading::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 36px;
    height: 36px;
    margin: -18px 0 0 -18px;
    border: 3px solid rgba(var(--sf-brand-rgb), 0.22);
    border-top-color: var(--color-brand);
    border-radius: 50%;
    animation: sf-upload-spin 0.7s linear infinite;
    z-index: 2;
    pointer-events: none;
}

.file-upload-label-box.uploading[data-upload-progress]::before {
    content: attr(data-upload-progress) '%';
    position: absolute;
    top: calc(50% + 26px);
    left: 50%;
    transform: translateX(-50%);
    font-size: 13px;
    font-weight: 600;
    color: var(--color-brand);
    z-index: 2;
    pointer-events: none;
    background: rgba(255, 255, 255, 0.85);
    padding: 1px 6px;
    border-radius: 4px;
}

@keyframes sf-upload-spin {
    to { transform: rotate(360deg); }
}

/* TZ-A1 — full-row tap affordance for qty selector (PDP mobile).
   JS click handler already delegates from .qty-option (app.js:2064), so functional
   selection has always worked anywhere in the row. This adds the missing visual cue:
   cursor:pointer + subtle hover tint on non-selected rows. WCAG hitbox already met
   (~55px row height ≥ 48px minimum). No markup or JS changes. */
.add-to-cart-form .product-qty-options .qty-option {
    cursor: pointer
}

.add-to-cart-form .product-qty-options .qty-option:hover:not(:has(.qty-radio:checked)) {
    background: rgba(var(--sf-brand-rgb), 0.05)
}

.add-to-cart-form .product-qty-options .label-qty {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    gap: 0.5rem;
    margin-bottom: 0 !important;
    min-width: 0;
    opacity: 1;
    order: 1;
    font-weight: 600
}

.add-to-cart-form .product-qty-options .qty-price {
    align-items: flex-end;
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-left: auto;
    order: 2;
    text-align: right
}

.add-to-cart-form .product-qty-options .qty-option #qty-custom-input {
    flex: 1 0 100%;
    margin-top: 4px;
    max-width: 100%;
    order: 3
}

.add-to-cart-form .qty-price .raw-price {
    font-size: 16px;
    font-weight: 600
}

.add-to-cart-form .qty-price .raw-ea-price {
    font-size: 12px;
    font-weight: 400;
    opacity: 0.6
}

.add-to-cart-form .qty-price > small.text-muted {
    font-weight: 400 !important
}

/* Desktop (≥992px): classic StickersFox quantity list — flat rows, full option list, no “Show more” curtain;
   reference layout pre–Mar 2026 card-style rows (e.g. 36c2a38). Mobile + tablet rules unchanged. */
@media (min-width: 992px) {
    .add-to-cart-form .calculator-panel--qty {
        background: transparent;
        border: none;
        box-shadow: none;
        padding: 0;
        border-radius: 0;
    }

    .add-to-cart-form .product-qty-more {
        position: static;
    }

    .add-to-cart-form .product-qty-more__tail {
        display: flex !important;
        flex-direction: column;
        width: 100%;
    }

    .add-to-cart-form .product-qty-more__reveal {
        display: none !important;
    }

    .add-to-cart-form .product-qty-options .qty-option {
        align-items: center;
        background: transparent;
        border: none;
        border-bottom: 1px solid var(--color-border);
        border-radius: 0;
        box-sizing: border-box;
        display: flex;
        flex-wrap: nowrap;
        gap: 0.5rem;
        justify-content: space-between;
        margin-bottom: 0 !important;
        padding: 0.65rem 0.15rem 0.7rem;
    }

    .add-to-cart-form .product-qty-options .qty-option:last-child {
        border-bottom: none;
    }

    .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio:checked) {
        background: transparent;
        border-bottom-color: var(--color-border);
        box-shadow: inset 3px 0 0 var(--color-brand);
    }

    .add-to-cart-form .product-qty-options .label-qty {
        flex: 1 1 auto;
        font-weight: 400;
        gap: 0.6rem;
        min-width: 0;
        opacity: 0.78;
        order: 1;
    }

    .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio:checked) .label-qty {
        font-weight: 600;
        opacity: 1;
    }

    .add-to-cart-form .product-qty-options .qty-option #qty-custom-input {
        flex: 0 0 auto;
        margin-top: 0 !important;
        max-width: 5.5rem;
        order: 2;
        width: 5rem;
    }

    .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) {
        grid-template-columns: minmax(94px, 112px) 1fr !important;
        row-gap: 2px;
        column-gap: 12px;
        padding: 11px 16px !important;
        border: 1.5px solid #E8711A !important;
        border-radius: 10px !important;
        background: #FFF !important;
    }

    .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-row-left,
    .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .label-qty .radio-primary {
        display: none !important;
    }

    .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .label-qty {
        display: contents !important;
    }

    .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-row-center {
        grid-column: 1;
        grid-row: 2;
        align-items: flex-start;
    }

    .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) #qty-custom-text {
        display: none !important;
    }

    .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-custom-active-label {
        display: inline-block !important;
        font-size: 12px;
        color: #E8711A;
        opacity: 0.85;
        font-weight: 500;
        line-height: 1.2;
    }

    .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) #qty-custom-input:not(.d-none) {
        grid-column: 1;
        grid-row: 1;
        width: 80px !important;
        max-width: 80px !important;
        margin-top: 0 !important;
        border: 1px solid rgba(232, 113, 26, 0.4);
        border-radius: 6px;
        padding: 5px 10px;
        background: #FFF7F0;
        font-size: 16px;
        font-weight: 500;
        color: #1a2e1a;
        text-align: left;
        -moz-appearance: textfield;
    }

    .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) #qty-custom-input:focus {
        border-color: #E8711A;
        background: #FFF;
        box-shadow: 0 0 0 2px rgba(232, 113, 26, 0.15);
        outline: none;
    }

    .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-price {
        grid-column: 2;
        grid-row: 1 / span 2;
        display: inline-flex !important;
        flex-direction: column;
        align-items: flex-end;
        gap: 1px;
    }

    .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-price .raw-price {
        font-size: 16px !important;
        font-weight: 700 !important;
        color: #E8711A !important;
        line-height: 1.2;
    }

    .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-price > small.text-muted {
        font-size: 12px !important;
        color: rgba(30, 37, 48, 0.55) !important;
        opacity: 1 !important;
    }

    .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) #qty-custom-input.is-invalid-min {
        border-color: #D35454 !important;
        background: #FFF5F5 !important;
        box-shadow: 0 0 0 2px rgba(211, 84, 84, 0.14) !important;
    }

    .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-custom-min-hint {
        grid-column: 1;
        grid-row: 2;
        margin-top: 12px;
    }

    .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) #qty-custom-input.is-invalid-min + .qty-custom-min-hint {
        display: inline-block !important;
    }

    .add-to-cart-form .product-qty-options .qty-price {
        align-items: flex-end;
        flex-direction: column;
        flex-shrink: 0;
        gap: 0.15rem;
        margin-left: 0;
        order: 3;
        text-align: right;
    }

    .add-to-cart-form .qty-price .raw-price {
        color: var(--color-brand);
        font-size: 16px;
        font-weight: 700;
    }

    .add-to-cart-form .qty-price > small.text-muted {
        font-size: 12px;
        font-weight: 600;
        letter-spacing: 0.01em;
        line-height: 1.2;
        opacity: 0.88;
    }
}

/* Custom sticker calculator — filled shape glyphs (reference-style gradient + outline), site orange when selected */
.calculator-shape-section {
    background-color: var(--color-surface);
}

.custom-sticker-calculator-option {
    text-align: left;
}

.custom-sticker-calculator-option .calculator-shape-pick.calculator-shape-btn {
    --csg-stroke: var(--color-ink-muted);
    --csg-inner: var(--color-surface);
    --csg-fill-top: var(--color-surface-subtle);
    --csg-fill-bot: #c5bfb6;
}

.custom-sticker-calculator-option .calculator-shape-pick.calculator-shape-btn.is-selected {
    --csg-stroke: var(--color-brand);
    --csg-inner: var(--color-brand-tint);
    --csg-fill-top: var(--color-brand-tint);
    --csg-fill-bot: #f0c9b4;
}

.custom-sticker-calculator-option .calculator-shape-pick.calculator-shape-btn:not(.is-selected):hover {
    --csg-stroke: var(--color-ink-soft);
    --csg-inner: var(--color-surface-subtle);
    --csg-fill-top: #e2ddd4;
    --csg-fill-bot: #a8a29a;
}

.calculator-shape-silhouettes {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: auto;
    gap: 0.025rem 0.018rem;
    padding: 0.02rem 0.006rem 0.005rem;
    background: transparent;
    text-align: left;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.calculator-shape-silhouettes::-webkit-scrollbar {
    display: none;
}

@media (min-width: 576px) {
    .calculator-shape-silhouettes {
        gap: 0.025rem 0.022rem;
    }
}

@media (min-width: 900px) {
    .calculator-shape-silhouettes {
        flex-wrap: nowrap;
        gap: 0.025rem 0.028rem;
    }
}

.calculator-shape-silhouettes--finish {
    max-width: 100%;
}

.calculator-shape-pick.calculator-shape-btn {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    flex: 0 0 auto;
    gap: 0.018rem;
    box-sizing: border-box;
    width: 4.75rem;
    max-width: calc(50% - 0.018rem);
    margin: 0;
    padding: 0.006rem 0.006rem 0.018rem;
    min-width: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    text-align: center;
    background: none !important;
    background-color: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    color: var(--color-ink);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
    transition: color 0.2s ease;
    vertical-align: top;
}

.calculator-shape-pick--wide.calculator-shape-btn {
    width: 6.25rem;
    max-width: calc(50% - 0.018rem);
}

@media (min-width: 620px) {
    .calculator-shape-pick.calculator-shape-btn {
        max-width: none;
        width: 4.85rem;
    }

    .calculator-shape-pick--wide.calculator-shape-btn {
        max-width: none;
        width: 6.55rem;
    }
}

.calculator-shape-pick.calculator-shape-btn:hover,
.calculator-shape-pick.calculator-shape-btn:focus {
    background: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

.calculator-shape-silhouette__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 100%;
    line-height: 0;
    margin: 0;
    min-height: calc(clamp(44px, 10vw, 54px) + 2px);
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.04));
}

.calculator-shape-silhouette__icon svg.calculator-shape-icon {
    display: block;
    margin: 0 auto;
    width: clamp(44px, 10vw, 54px);
    height: clamp(44px, 10vw, 54px);
    overflow: visible;
}

/* Desktop (≥768px): compact shape / finish / size stack; quantity offset toward gallery trust band */
@media (min-width: 768px) {
    .add-to-cart-form .calculator-panel:not(.calculator-panel--qty) {
        padding: 0.5rem 0.75rem 0.45rem;
    }

    #custom-sticker-calculator-shape.calculator-panel,
    #custom-sticker-calculator-finish.calculator-panel {
        padding-bottom: 0.15rem !important;
    }

    .add-to-cart-form .calculator-panel.mb-4:not(.calculator-panel--qty) {
        margin-bottom: 0.45rem !important;
    }

    .add-to-cart-form .calculator-panel .product-option-label {
        margin-bottom: 0.35rem !important;
    }

    .add-to-cart-form .product-size .product-size-options {
        gap: 6px;
    }

    .add-to-cart-form .product-size .product-size-options .product-size-label {
        padding: 8px 12px;
        min-height: auto;
        font-size: 12.5px;
        line-height: 1.2;
    }

    .add-to-cart-form .calculator-panel--qty.mb-4 {
        margin-top: clamp(1.25rem, 2.8vw, 2.5rem) !important;
    }
}

/* Mobile + tablet UX polish for Shape/Finish (Custom Stickers calculator only) */
@media (max-width: 991.98px) {
    /* Slightly tighter cards on mobile */
    .add-to-cart-form .calculator-panel {
        padding: 0.72rem 0.85rem 0.82rem;
    }

    .add-to-cart-form .calculator-panel.mb-4 {
        margin-bottom: 0.72rem !important;
    }

    /* Reduce label spacing inside panels (Bootstrap mb-3 is a bit large on mobile) */
    .add-to-cart-form .calculator-panel .product-option-label {
        margin-bottom: 0.52rem !important;
        font-size: 14px;
        line-height: 1.2;
    }

    /* SHAPE: one balanced row, premium spacing, secondary labels */
    #custom-sticker-calculator-shape .calculator-shape-silhouettes {
        justify-content: space-between;
        gap: 12px;
        padding: 0 4px;
        overflow-x: hidden;
    }

    #custom-sticker-calculator-shape .calculator-shape-pick.calculator-shape-btn,
    #custom-sticker-calculator-shape .calculator-shape-pick--wide.calculator-shape-btn {
        flex: 1 1 0;
        width: auto;
        max-width: none;
        padding: 4px 2px 7px;
        gap: 7px; /* ~6–8px between icon and label */
        min-height: 84px; /* consistent height across items */
    }

    #custom-sticker-calculator-shape .calculator-shape-silhouette__icon {
        min-height: calc(clamp(40px, 7.6vw, 46px) + 2px);
    }

    #custom-sticker-calculator-shape .calculator-shape-silhouette__icon svg.calculator-shape-icon {
        width: clamp(40px, 7.6vw, 46px);
        height: clamp(40px, 7.6vw, 46px);
    }

    #custom-sticker-calculator-shape .calculator-shape-silhouette__label {
        font-size: 12.5px; /* 12–13px */
        font-weight: 500; /* 400–500 */
        line-height: 1.25; /* ~1.2–1.3 */
        letter-spacing: 0;
        color: rgba(var(--sf-ink-rgb), 0.92);
        border-bottom-width: 1px;
        padding-bottom: 2px;
        max-width: 74px; /* force clean wrapping */
        margin-left: auto;
        margin-right: auto;
        min-height: 2.6em; /* stable row height when wrapping */
        white-space: normal;
        text-wrap: balance;
    }

    #custom-sticker-calculator-shape .calculator-shape-silhouette__label--long {
        font-size: 12px;
        font-weight: 500;
        line-height: 1.2;
        max-width: 78px;
    }

    #custom-sticker-calculator-shape .csg-nowrap {
        white-space: nowrap;
    }

    /* FINISH (mobile): legacy compact-pill rules removed — superseded by the
       ultra-minimal inline "● Glossy · ● Matte" block further down (single
       source of truth). Keeping them caused the old swatch/indicator + capsule
       to render on top of the minimal dots. */

    /* Size chips: cleaner and less bulky */
    .add-to-cart-form .product-size .product-size-options {
        gap: 6px;
    }

    .add-to-cart-form .product-size .product-size-options .product-size-label {
        min-height: 52px;
        padding: 6px 8px;
        border-radius: 10px;
        font-size: 13px;
        line-height: 1.15;
        font-weight: 600;
    }

    .add-to-cart-form .product-size .size-radio:checked + .product-size-label {
        box-shadow: 0 0 0 2px rgba(var(--sf-brand-rgb), 0.12);
    }

    /* Quantity cards: compact hierarchy and cleaner rows */
    .add-to-cart-form .product-qty-options .qty-option {
        padding: 8px 10px;
        border-radius: 10px;
        margin-bottom: 5px !important;
    }

    .add-to-cart-form .product-qty-options .label-qty {
        gap: 0.45rem;
        font-size: 13px;
        font-weight: 600;
    }

    .add-to-cart-form .qty-price .raw-price {
        font-size: 15px;
        font-weight: 700;
        line-height: 1.05;
    }

    .add-to-cart-form .qty-price > small.text-muted {
        font-size: 11px;
        line-height: 1.15;
        opacity: 0.72;
    }

    .add-to-cart-form .product-qty-more__reveal {
        min-height: 0;
    }

    /* Trust: exactly like reference (clean text grid) */
    .add-to-cart-form .calculator-trust-row {
        column-gap: 24px;
        row-gap: 12px;
        margin-top: 16px;
        padding-top: 14px;
        padding-bottom: 16px;
        border-top-color: transparent;
        border-bottom: 1px solid rgba(0, 0, 0, 0.06);
        overflow: visible;
    }

    .add-to-cart-form .calculator-trust-row::-webkit-scrollbar {
        display: none;
    }

    .add-to-cart-form .calculator-trust-item {
        min-width: 0;
        align-items: center;
    }

    .add-to-cart-form .calculator-trust-label {
        width: 100%;
        justify-content: flex-start;
        text-align: left;
        gap: 11px;
        font-size: 15px;
        font-weight: 500;
        letter-spacing: 0.008em;
        line-height: 1.48;
        opacity: 1;
        min-height: 0;
        padding: 0;
        cursor: default;
        color: var(--color-ink-muted);
        align-items: center;
    }

    .add-to-cart-form .calculator-trust-label:hover,
    .add-to-cart-form .calculator-trust-label:active {
        color: var(--color-ink-soft);
        opacity: 1;
    }

    .add-to-cart-form .calculator-trust-icon {
        font-size: 15px;
        width: 19px;
        height: 19px;
        flex: 0 0 19px;
        margin-top: 0;
        opacity: 0.84;
        color: var(--color-brand);
    }

    .add-to-cart-form .calculator-trust-text {
        display: inline;
        line-height: 1.48;
        text-align: left;
        white-space: normal;
    }

    /* Vertical rhythm: quantity → trust → upload → note → CTA */
    .add-to-cart-form .calculator-panel--qty.mb-4 {
        margin-bottom: 2.35rem !important;
    }

    .add-to-cart-form .product-upload-ui--v2 {
        margin-top: 0.75rem;
    }

    .add-to-cart-form .product-upload-ui--v2 .product-artwork.mb-4 {
        margin-bottom: 1.75rem !important;
    }

    .add-to-cart-form .product-upload-ui--v2 .product-note.mb-3 {
        margin-top: 0.65rem !important;
        margin-bottom: 1.6rem !important;
    }
}

/* Desktop: Finish as compact cards — CSS indicator + title/subtitle.
   Start at 992px so it does NOT overlap the mobile ultra-minimal block
   (max-width:991.98px). At 768–991 the two used to collide → old capsule
   + swatch rendered on top of the minimal dots. */
@media (min-width: 992px) {
    #custom-sticker-calculator-finish > .product-option-label.bold {
        margin-bottom: 0.3rem !important;
    }

    #custom-sticker-calculator-finish .calculator-finish-chip__body {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: 0.15rem;
        min-width: 0;
        flex: 1 1 auto;
        text-align: left;
    }

    #custom-sticker-calculator-finish .calculator-shape-silhouettes--finish {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: stretch;
        justify-content: flex-start;
        gap: 9px;
        padding: 0;
        overflow-x: visible;
    }

    #custom-sticker-calculator-finish .calculator-shape-silhouettes--finish .calculator-shape-btn[data-finish="glossy"] {
        order: 1;
    }

    #custom-sticker-calculator-finish .calculator-shape-silhouettes--finish .calculator-shape-btn[data-finish="matte"] {
        order: 2;
    }

    #custom-sticker-calculator-finish .calculator-finish-chip.calculator-shape-pick.calculator-shape-btn {
        position: relative;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: flex-start;
        gap: 8px;
        flex: 1 1 0;
        width: auto;
        max-width: none;
        min-width: 0;
        min-height: 46px;
        padding: 7px 13px 7px 10px !important;
        margin: 0;
        text-align: left;
        border: 1px solid rgba(var(--sf-ink-rgb), 0.12) !important;
        border-radius: 12px !important;
        background: rgba(255, 255, 255, 0.94) !important;
        box-shadow: none !important;
        -webkit-box-shadow: none !important;
        transition: border-color 0.15s ease, background-color 0.15s ease;
    }

    #custom-sticker-calculator-finish .calculator-finish-chip .calculator-shape-silhouette__icon {
        display: none !important;
    }

    #custom-sticker-calculator-finish .calculator-finish-card__indicator {
        position: relative;
        flex-shrink: 0;
        width: 14px;
        height: 14px;
        border-radius: 50%;
        border: 1px solid rgba(var(--sf-ink-rgb), 0.14);
        box-sizing: border-box;
        overflow: hidden;
    }

    #custom-sticker-calculator-finish .calculator-finish-card__indicator--glossy {
        background: linear-gradient(155deg, var(--color-surface-subtle) 0%, var(--color-border) 42%, #c5bfb6 100%);
        box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.7), 0 0 1px rgba(0, 0, 0, 0.05);
    }

    #custom-sticker-calculator-finish .calculator-finish-card__indicator--glossy::after {
        content: '';
        position: absolute;
        top: 2px;
        left: 2px;
        width: 6px;
        height: 3px;
        border-radius: 50%;
        background: linear-gradient(125deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0));
        transform: rotate(-32deg);
        pointer-events: none;
    }

    #custom-sticker-calculator-finish .calculator-finish-card__indicator--matte {
        background: linear-gradient(180deg, #c9c4bc 0%, #a8a29a 100%);
        box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.16);
    }

    #custom-sticker-calculator-finish .calculator-finish-chip.calculator-shape-btn.is-selected .calculator-finish-card__indicator {
        border-color: rgba(var(--sf-brand-rgb), 0.55);
        box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.5), 0 0 0 1px rgba(var(--sf-brand-rgb), 0.2);
    }

    #custom-sticker-calculator-finish .calculator-finish-chip.calculator-shape-btn.is-selected .calculator-finish-card__indicator--matte {
        box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(var(--sf-brand-rgb), 0.2);
    }

    #custom-sticker-calculator-finish .calculator-shape-silhouette__label {
        grid-column: unset;
        grid-row: unset;
        font-size: 0.8125rem;
        font-weight: 600;
        line-height: 1.2;
        text-align: left !important;
        padding-bottom: 0;
        margin: 0;
        border-bottom: 0 !important;
        max-width: none;
        min-height: 0;
    }

    #custom-sticker-calculator-finish .calculator-finish-chip.calculator-shape-btn .calculator-shape-silhouette__label,
    #custom-sticker-calculator-finish .calculator-finish-chip.calculator-shape-btn.is-selected .calculator-shape-silhouette__label {
        color: var(--color-ink-soft) !important;
    }

    #custom-sticker-calculator-finish .calculator-shape-silhouette__desc {
        grid-column: unset;
        grid-row: unset;
        font-size: 0.6875rem;
        font-weight: 400;
        line-height: 1.25;
        color: rgba(var(--sf-ink-rgb), 0.65);
        text-align: left !important;
        margin: 0;
        max-width: none;
        letter-spacing: 0;
    }

    #custom-sticker-calculator-finish .calculator-finish-chip.calculator-shape-btn.is-selected .calculator-shape-silhouette__desc {
        color: rgba(var(--sf-ink-rgb), 0.82);
    }

    #custom-sticker-calculator-finish .calculator-shape-pick.calculator-shape-btn.is-selected {
        border-color: rgba(var(--sf-brand-rgb), 0.52) !important;
        background: rgba(var(--sf-brand-rgb), 0.09) !important;
        box-shadow: none !important;
    }

    #custom-sticker-calculator-finish .calculator-finish-chip.calculator-shape-btn.is-selected::after {
        content: '';
        position: absolute;
        top: 8px;
        right: 9px;
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: var(--color-brand);
        box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.85);
        pointer-events: none;
    }

    #custom-sticker-calculator-finish .calculator-shape-pick.calculator-shape-btn:hover {
        border-color: rgba(var(--sf-ink-rgb), 0.22) !important;
        background: var(--color-surface) !important;
    }

    #custom-sticker-calculator-finish .calculator-shape-pick.calculator-shape-btn.is-selected:hover {
        border-color: rgba(var(--sf-brand-rgb), 0.65) !important;
        background: rgba(var(--sf-brand-rgb), 0.11) !important;
    }

    /* Desktop: Shape — compact visual cards (icon centered, label below; after mobile rules) */
    #custom-sticker-calculator-shape > .product-option-label.bold {
        margin-bottom: 0.3rem !important;
    }

    #custom-sticker-calculator-shape .calculator-shape-silhouettes {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: stretch;
        justify-content: flex-start;
        gap: 8px;
        padding: 0;
        overflow-x: visible;
    }

    #custom-sticker-calculator-shape .calculator-shape-chip.calculator-shape-pick.calculator-shape-btn {
        display: inline-flex !important;
        flex-direction: column !important;
        align-items: center;
        justify-content: center;
        flex: 1 1 0;
        width: auto;
        min-width: 0;
        max-width: 5.85rem;
        min-height: 4.35rem;
        padding: 7px 6px 8px !important;
        margin: 0;
        gap: 5px;
        border: 1px solid rgba(var(--sf-ink-rgb), 0.12) !important;
        border-radius: 12px !important;
        background: rgba(255, 255, 255, 0.94) !important;
        box-shadow: none !important;
        -webkit-box-shadow: none !important;
        --csg-stroke: rgba(var(--sf-ink-rgb), 0.52);
        --csg-inner: var(--color-surface-subtle);
        --csg-fill-top: var(--color-surface-subtle);
        --csg-fill-bot: var(--color-border);
        transition: border-color 0.15s ease, background-color 0.15s ease;
    }

    #custom-sticker-calculator-shape .calculator-shape-pick--wide.calculator-shape-chip.calculator-shape-pick.calculator-shape-btn {
        max-width: 6.35rem;
    }

    #custom-sticker-calculator-shape .calculator-shape-chip .calculator-shape-silhouette__icon {
        display: flex !important;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: 100%;
        min-height: 0 !important;
        margin: 0;
        line-height: 0;
        filter: none;
    }

    #custom-sticker-calculator-shape .calculator-shape-chip .calculator-shape-silhouette__icon svg.calculator-shape-icon {
        width: 26px;
        height: 26px;
        display: block;
        margin: 0 auto;
    }

    #custom-sticker-calculator-shape .calculator-shape-silhouette__label,
    #custom-sticker-calculator-shape .calculator-shape-silhouette__label--long {
        display: block;
        width: 100%;
        max-width: none;
        min-height: 0;
        margin: 0;
        padding: 0 !important;
        font-size: 0.75rem;
        font-weight: 500;
        line-height: 1.2;
        letter-spacing: 0.01em;
        text-align: center !important;
        border-bottom: 0 !important;
        color: var(--color-ink-soft) !important;
        white-space: normal;
    }

    #custom-sticker-calculator-shape .calculator-shape-card__title {
        display: block;
        font-size: 0.75rem;
        font-weight: 500;
        line-height: 1.2;
        color: inherit;
    }

    #custom-sticker-calculator-shape .calculator-shape-card__subtitle {
        display: block;
        font-size: 0.625rem;
        font-weight: 400;
        line-height: 1.2;
        color: rgba(var(--sf-ink-rgb), 0.65);
        letter-spacing: 0.01em;
    }

    #custom-sticker-calculator-shape .calculator-shape-chip.calculator-shape-pick.calculator-shape-btn.is-selected .calculator-shape-card__subtitle {
        color: rgba(var(--sf-brand-rgb), 0.82);
    }

    #custom-sticker-calculator-shape .calculator-shape-chip.calculator-shape-pick.calculator-shape-btn.is-selected {
        border-color: rgba(var(--sf-brand-rgb), 0.52) !important;
        background: rgba(var(--sf-brand-rgb), 0.08) !important;
        box-shadow: none !important;
        color: var(--color-ink-soft) !important;
        --csg-stroke: var(--color-brand);
        --csg-inner: var(--color-brand-tint);
        --csg-fill-top: var(--color-brand-tint);
        --csg-fill-bot: #f0c9b4;
    }

    #custom-sticker-calculator-shape .calculator-shape-chip.calculator-shape-pick.calculator-shape-btn.is-selected .calculator-shape-silhouette__label,
    #custom-sticker-calculator-shape .calculator-shape-chip.calculator-shape-pick.calculator-shape-btn.is-selected .calculator-shape-silhouette__label--long {
        color: var(--color-ink-soft) !important;
    }

    #custom-sticker-calculator-shape .calculator-shape-chip.calculator-shape-pick.calculator-shape-btn:hover {
        border-color: rgba(var(--sf-ink-rgb), 0.22) !important;
        background: var(--color-surface) !important;
    }

    #custom-sticker-calculator-shape .calculator-shape-chip.calculator-shape-pick.calculator-shape-btn.is-selected:hover {
        border-color: rgba(var(--sf-brand-rgb), 0.65) !important;
        background: rgba(var(--sf-brand-rgb), 0.1) !important;
    }
}

/* Custom shape: stack title + subtitle (mobile + desktop; no layout change vs former Custom<br>(Die Cut)) */
#custom-sticker-calculator-shape .calculator-shape-card__labels {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
    width: 100%;
}

.calculator-shape-silhouette__label {
    display: block;
    width: 100%;
    flex-shrink: 0;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-size: 0.9375rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.01em;
    text-align: center !important;
    color: var(--color-ink-soft);
    border-bottom: 2px solid transparent;
    padding-bottom: 2px;
    transition: border-color 0.2s ease, color 0.2s ease;
}

.calculator-shape-silhouette__label--long {
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: 0;
}

.calculator-shape-silhouette__desc {
    display: block;
    width: 100%;
    max-width: 9.5rem;
    margin: 0.02rem auto 0;
    padding: 0 0.025rem;
    box-sizing: border-box;
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1.25;
    letter-spacing: 0.01em;
    text-align: center;
    color: var(--color-ink-muted);
}

.calculator-shape-pick.calculator-shape-btn.is-selected .calculator-shape-silhouette__desc {
    color: var(--color-brand-hover);
}

.calculator-shape-pick.calculator-shape-btn:not(.is-selected):hover .calculator-shape-silhouette__desc {
    color: var(--color-ink-muted);
}

.calculator-shape-pick.calculator-shape-btn.is-selected {
    color: var(--color-brand-hover);
    cursor: default;
}

.calculator-shape-pick.calculator-shape-btn.is-selected .calculator-shape-silhouette__label {
    color: var(--color-brand-pressed);
    border-bottom-color: rgba(var(--sf-brand-rgb), 0.45);
}

.calculator-shape-pick.calculator-shape-btn:not(.is-selected) .calculator-shape-silhouette__label {
    color: var(--color-ink-soft);
}

.calculator-shape-pick.calculator-shape-btn:not(.is-selected):hover {
    color: var(--color-ink);
}

.calculator-shape-pick.calculator-shape-btn:not(.is-selected):hover .calculator-shape-silhouette__label {
    color: var(--color-ink);
}

.calculator-shape-pick.calculator-shape-btn:focus {
    outline: none;
}

.calculator-shape-pick.calculator-shape-btn:focus-visible .calculator-shape-silhouette__label {
    text-decoration: underline;
    text-decoration-color: rgba(var(--sf-brand-rgb), 0.75);
    text-underline-offset: 3px;
}

input:checked+.label-primary,
input:checked+.label-primary+.label-primary {
    background-color: var(--color-brand);
    color: var(--color-surface);
    cursor: default
}

input:checked+.label-stripe {
    background-color: #635bff
}

input:checked+.label-paypal {
    background-color: #0079c1
}

input:checked+.label-paypal path,
input:checked+.label-stripe path {
    fill: var(--color-surface)
}

.payment-method-badge {
    align-items: center;
    border: 1px solid var(--color-border);
    border-radius: 5px;
    display: flex;
    font-size: .75rem;
    line-height: 1;
    padding: .25rem
}

.payment-method-badge .icon {
    font-size: 1rem
}

.radio-primary {
    background-color: var(--color-surface-subtle);
    border-radius: 5px;
    color: transparent;
    cursor: pointer;
    display: inline-block;
    height: 1.8rem;
    padding-top: .3rem;
    text-align: center;
    width: 1.8rem
}

input:checked+label .radio-primary {
    background-color: var(--color-brand);
    color: var(--color-surface);
    cursor: default
}

.qty-radio:checked+label #qty-custom-text,
.size-radio:checked+label #size-custom-text,
.size-radio:checked+label.label-custom-value {
    display: none
}

.qty-radio:checked+label+#qty-custom-input,
.size-radio:checked+label+#size-custom-input {
    display: inline-block !important
}

.qty-custom-active-label {
    display: none;
}

.qty-custom-min-hint {
    display: none;
    font-size: 11px;
    color: #D35454;
    line-height: 1.2;
}

.qty-price {
    display: inline-block;
    opacity: 0;
    transform: translateY(10px);
    transition: .4s
}

.qty-price.ready {
    opacity: 1;
    transform: translateY(0)
}

.product-qty-options .label-qty {
    font-size: calc(1em - 1px);
    font-weight: 400 !important;
    opacity: .7
}

.product-qty-options .qty-price {
    font-weight: 400
}

.product-qty-options .qty-price.font-14 .raw-price {
    font-size: 16px;
    font-weight: 700 !important
}

.product-qty-options .qty-price > small.text-muted {
    font-weight: bolder
}

.old-price {
    color: var(--color-ink-muted);
    display: block;
    font-size: .625em;
    font-weight: 400;
    margin-bottom: -.3em
}

.countdown-item {
    background-color: var(--color-brand-tint);
    border: 1px solid rgba(var(--sf-brand-rgb), 0.28);
    line-height: 1;
    min-width: 2.625rem;
    padding-bottom: 4px;
    padding-top: 4px
}

.countdown-item-value {
    font-size: 1.225rem
}

.countdown-item-label {
    font-size: .825rem
}

.add-to-cart-form .artwork-box {
    max-width: 60px
}

.artwork-box .artwork-remove {
    padding: 0 8px;
    position: absolute;
    right: -12px;
    top: -12px;
    z-index: 2
}

.video-player.fullscreen .ratio .rounded,
.video-player.fullscreen .ratio.rounded {
    border-radius: 0
}

.modal-image-link:not(.modal-image-nav-link):hover {
    cursor: zoom-in
}

@media (max-width:991.98px) {
    .product-gallery-thumbs-slider:not(.slick-initialized) .product-gallery-thumbs-item-wrapper:nth-child(n+5) {
        display: none
    }
}

@media (min-width:992px) and (max-width:1199.98px) {
    .product-gallery-thumbs-slider:not(.slick-initialized) .product-gallery-thumbs-item-wrapper:nth-child(n+6) {
        display: none
    }
}

@media (min-width:1200px) {
    .product-gallery-thumbs-slider:not(.slick-initialized) .product-gallery-thumbs-item-wrapper:nth-child(n+7) {
        display: none
    }
}

.product-add-card {
    background-color: var(--color-surface);
    border: 1px solid rgba(0, 0, 0, .06);
    border-radius: 12px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, .06);
    margin-top: .25rem;
    padding: 1.25rem 1.5rem
}

/* UX-only: optimize Add to Cart block (visual hierarchy + compact layout) */
.ux-cart-optimized {
    background: var(--color-surface);
    border: 1px solid rgba(0, 0, 0, 0.05);
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
    margin-top: 0.2rem !important;
    padding: 0.95rem 1rem !important;
}

.ux-cart-optimized.ux-cart-integrated {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* UX: Integrated Add to Cart CTA (visual-only) */
.ux-cart-integrated {
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 !important;
    margin-top: 0.85rem !important;
}

.ux-cart-integrated__body {
    padding: 0 !important;
    margin: 0 !important;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.ux-cart-integrated__btn {
    border-radius: 18px !important;
    width: 100% !important;
    gap: 0 !important;
    padding: 0 !important;
    min-height: 52px;
    display: flex !important;
    align-items: stretch !important;
    background: transparent !important;
    border: 1px solid rgba(0, 0, 0, 0.04) !important;
    box-shadow: 0 6px 14px rgba(16, 24, 40, 0.06) !important;
    overflow: hidden;
}

.ux-cart-integrated__btn:hover {
    filter: brightness(1.02);
}

.ux-cart-integrated__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 10px;
    background: transparent;
    margin-right: 10px;
}

.ux-cart-integrated__icon .icon {
    font-size: 18px;
    color: var(--color-surface);
}

.ux-cart-integrated__text {
    font-weight: 600;
    color: var(--color-surface);
    font-size: 16px;
    white-space: nowrap;
    margin-right: 0;
    flex: 0 0 auto;
}

.ux-cart-integrated__left {
    flex: 0 0 60%;
    background: var(--color-brand);
    display: flex;
    align-items: center;
    padding: 0 15px;
}

.ux-cart-integrated__right {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    background: var(--color-surface-subtle);
    padding: 8px 16px 8px 16px;
    /* subtle separation without a visible vertical border */
    box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.04);
    flex: 0 0 40%;
}

.ux-cart-integrated__right .product-add-card__price {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 26px !important;
    line-height: 1.05 !important;
    letter-spacing: -0.01em;
    color: var(--color-brand) !important;
    font-weight: 900;
}

.ux-cart-integrated__right .product-add-card__meta {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 12.8px !important;
    line-height: 1.12 !important;
    color: rgba(30, 37, 48, 0.78) !important;
    font-weight: 500;
    white-space: nowrap;
    /* allow 2-line readability like reference */
    white-space: normal !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media (max-width:991.98px) {
    .ux-cart-integrated__btn {
        min-height: 50px;
        padding: 9px 10px !important;
    }

    .ux-cart-integrated__left {
        padding: 0 13px;
    }

    .ux-cart-integrated__right {
        padding: 8px 12px;
    }

    .ux-cart-integrated {
        margin-top: 0.75rem !important;
    }

    .ux-cart-integrated__text {
        font-size: 15.5px;
    }

    .ux-cart-integrated__right .product-add-card__price {
        font-size: 24px !important;
    }

    .ux-cart-integrated__right .product-add-card__meta {
        font-size: 12.5px !important;
    }

    .ux-cart-integrated__icon {
        width: 30px;
        height: 30px;
        margin-right: 8px;
    }
}

.ux-cart-optimized__body {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.ux-cart-optimized__summary {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
}

.ux-cart-optimized .product-add-card__price {
    margin-bottom: 0 !important;
    font-size: 1.6rem;
    line-height: 1.05;
    letter-spacing: -0.015em;
}

.ux-cart-optimized .product-add-card__meta {
    margin-bottom: 0 !important;
    font-size: 0.95rem;
    opacity: 0.78;
}

.ux-cart-optimized .btn-add-to-cart {
    height: 44px;
    padding-bottom: 0.55rem;
    padding-top: 0.55rem;
    font-size: 0.95rem;
    font-weight: 700;
    border-radius: 14px;
    box-shadow: 0 6px 16px rgba(var(--sf-brand-rgb), 0.18);
    transition: transform .12s ease, box-shadow .18s ease, filter .18s ease;
}

.ux-cart-optimized .btn-add-to-cart:hover {
    filter: brightness(1.02);
    box-shadow: 0 10px 22px rgba(var(--sf-brand-rgb), 0.22);
}

.ux-cart-optimized .btn-add-to-cart:active {
    transform: translateY(1px);
}

/* Desktop: make price + CTA feel like a single action row */
@media (min-width:768px) {
    .ux-cart-optimized__body {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
    }

    .ux-cart-optimized__summary {
        flex: 1 1 auto;
        gap: 0.2rem;
    }

    .ux-cart-optimized .btn-add-to-cart {
        width: auto !important;
        flex: 0 0 auto;
        padding-left: 1.1rem;
        padding-right: 1.1rem;
    }
}

@media (max-width:991.98px) {
    /* Keep full-width button on mobile, but reduce overall height */
    .ux-cart-optimized__body {
        gap: 0.65rem;
    }

    .ux-cart-optimized .btn-add-to-cart {
        width: 100% !important;
    }

    .ux-cart-optimized .product-add-card__price {
        font-size: 1.55rem;
    }

    .ux-cart-optimized .product-add-card__meta {
        font-size: 0.92rem;
    }
}

.product-add-card__body {
    display: flex;
    flex-direction: column;
    gap: 0
}

.product-add-card__price {
    font-size: 1.75rem;
    font-weight: 700;
    letter-spacing: -.02em;
    line-height: 1.15;
    margin-bottom: .5rem
}

.product-add-card__meta {
    color: inherit;
    font-size: .875rem;
    font-weight: 400;
    line-height: 1.4;
    margin-bottom: 1.125rem;
    opacity: .7
}

.product-add-card .btn-add-to-cart {
    font-size: .9375rem;
    font-weight: 600;
    padding-bottom: .65rem;
    padding-top: .65rem
}

@media (max-width:991.98px) {
    .btn-add-to-cart,
    .product-upload-ui .upload-action-card,
    .product-upload-ui .upload-action-shell {
        width: 100%
    }

    .product-upload-ui .upload-action-shell {
        border-radius: 18px;
    }

    .product-upload-ui .upload-action-card {
        gap: 12px;
        min-height: 112px;
        padding: 15px 14px 11px;
    }

    .product-upload-ui .upload-action-card__icon {
        flex-basis: 40px;
        height: 40px;
        width: 40px;
    }

    .product-upload-ui .upload-action-card__title {
        font-size: 14px;
    }

    .product-upload-ui .upload-action-card__subtitle {
        font-size: 11px;
    }

    .product-upload-ui .upload-action-card__helper {
        font-size: 12px;
        padding: 10px 1px 2px;
    }

    /* Calculator: tighter panels on small screens */
    .add-to-cart-form .calculator-panel {
        border-radius: 16px;
        padding: 0.9rem 1rem 1rem
    }

    .add-to-cart-form .calculator-panel .calculator-shape-silhouettes {
        justify-content: center;
        margin-left: auto;
        margin-right: auto;
        width: 100%
    }

    .add-to-cart-form .product-option-group,
    .add-to-cart-form .product-size.calculator-panel {
        margin-bottom: 16px !important
    }

    .add-to-cart-form .calculator-panel--qty {
        margin-bottom: 2rem !important;
    }

    .product-upload-ui .product-artwork.mb-4 {
        margin-top: 0.5rem
    }

    .product-upload-ui .product-note {
        margin-top: 0.5rem;
        margin-bottom: 1.35rem !important;
    }

    .add-to-cart-form .product-add-card:not(.ux-cart-integrated--v3) {
        margin-top: .45rem
    }
}

@media (max-width:767.98px) {
    .product-upload-ui--v2 .upload-action-shell,
    .product-upload-ui--v2 .upload-action-card {
        width: 100% !important;
    }

    .product-upload-ui--v2 .upload-action-card {
        gap: 14px !important;
        min-height: 106px !important;
        padding: 14px 15px 10px !important;
    }

    .product-upload-ui--v2 .upload-action-card__icon {
        flex-basis: 52px !important;
        height: 52px !important;
        width: 52px !important;
    }

    .product-upload-ui--v2 .upload-action-card__title {
        font-size: 15px !important;
        font-weight: 600 !important;
        letter-spacing: -0.01em;
    }

    .product-upload-ui--v2 .upload-action-card__subtitle {
        font-size: 11.75px !important;
        opacity: 0.88;
    }

    .product-upload-ui--v2 .upload-action-card__helper {
        font-size: 12.25px !important;
        padding: 9px 1px 1px !important;
        line-height: 1.35 !important;
    }

    .product-upload-ui--v2 .product-artwork.mb-4 {
        margin-top: 0.5rem !important;
        margin-bottom: 1.5rem !important;
    }

    .product-upload-ui--v2 .product-note {
        margin-top: 0.5rem !important;
        margin-bottom: 1.35rem !important;
    }
}

@media (min-width:768px) {
    .product-gallery-thumbs-slider {
        margin-right: -15px
    }
}

.cart-products .order-product.loading {
    opacity: .3
}

.qty-input {
    border: 1px solid var(--color-border);
    border-radius: 0;
    padding: 10px;
    width: 90px
}

.qty-btn:first-child {
    border-radius: 5px 0 0 5px
}

.qty-btn:last-child {
    border-radius: 0 5px 5px 0
}

.order-product-thumb-box {
    max-width: 44px;
    min-width: 44px
}

.remove-product-thumb {
    margin-left: -5px;
    margin-top: -5px
}

.order-product-thumb {
    background-image: url(/assets/images/no-img.svg);
    border: 1px solid var(--color-border)
}

.order-product-upload-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    height: 44px;
    border: 1px dashed var(--color-border);
    color: #5f5e5a;
    cursor: pointer;
    text-align: center;
    line-height: 1.05;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation
}

.order-product-upload-tile:hover {
    border-color: var(--color-brand);
    color: var(--color-brand)
}

.order-product-upload-tile .upload-tile-icon {
    opacity: .85
}

.order-product-upload-tile .upload-tile-label {
    font-size: 10px;
    font-weight: 500
}

.order-items-artwork-note {
    gap: 7px;
    font-size: 12px;
    line-height: 1.3
}

.order-items-artwork-note .artwork-note-check {
    flex: none;
    color: #1d9e75
}

.cart-products .order-product-comment {
    max-width: 200px
}

#checkout-cart-html .order-product-qty-box {
    display: none;
}

#checkout-cart-html .item-checkout-details,
#checkout-cart-html .item-checkout-item-subtotal {
    display: inline-block !important;
}

.checkout-group-heading:after {
    background-color: var(--color-brand);
    border-radius: 3px;
    content: "";
    display: block;
    height: 4px;
    margin-bottom: 20px;
    margin-top: 5px;
    width: 30px
}

/* Checkout 2026 visual polish — scoped to .checkout so other pages keep their styles.
   Lighter: hairline sections (no drop-shadow), calmer headings, no repeated accent bar
   (kept only on the page title zig-zag), tighter fields. Mobile-first (90% of traffic). */
.checkout .checkout-group {
    background: transparent;
    box-shadow: none;
    border: 0;
    border-top: 1px solid var(--color-border);
    border-radius: 0;
    padding: 22px 0;
    margin-bottom: 0
}

.checkout .checkout-group:first-of-type {
    border-top: 0;
    padding-top: 0
}

.checkout .checkout-group-heading {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 14px
}

.checkout .checkout-group label.bold {
    font-weight: 500
}

.checkout .checkout-group-heading:after {
    display: none
}

.checkout-form h1 {
    font-size: 32px;
    font-weight: 700
}

.checkout .form-control {
    border-radius: 8px
}

.checkout input.form-control,
.checkout select.form-control {
    height: 48px
}

.checkout .express-or-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 18px;
    font-size: 13px
}

.checkout .express-or-divider:before,
.checkout .express-or-divider:after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--color-border)
}

/* Inline card field (B2.1): style the Stripe Card Element as a clean input box
   matching the borderless-premium checkout (the element itself is borderless). */
.checkout .stripe-field {
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: 10px;
    padding: 14px;
    transition: border-color .15s ease, box-shadow .15s ease
}

.checkout .stripe-field.StripeElement--focus {
    border-color: #1a1a1a;
    box-shadow: 0 0 0 3px rgba(26, 26, 26, .08)
}

.checkout .stripe-field.StripeElement--invalid {
    border-color: #d64545
}

.checkout #stripe-card-error {
    margin-top: 6px
}

/* PayPal fast button (B2c): sits with the wallets, above the "or pay with card" divider. */
.checkout-paypal-wrap {
    margin: 0 0 16px
}

.checkout-paypal-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    margin-top: 5px;
    height: 44px;
    border: 0;
    border-radius: 8px;
    background: #ffc439;
    color: #142c8e;
    font-weight: 700;
    font-size: 15px;
    cursor: pointer;
    transition: background .15s ease
}

.checkout-paypal-btn:hover {
    background: #f0b92e
}

.checkout-paypal-btn .icon-paypal {
    font-size: 18px
}

/* Card is the default method (its field is shown above) + PayPal has its own button, so the
   summary's Credit-card/PayPal radio list is redundant ON CHECKOUT. Hidden here only; the
   order page (#order-hash, not .checkout) still shows it for switching payment method. */
.checkout .order-payment-methods-wrap {
    display: none
}

.checkout .checkout-coupon-hint {
    display: inline-block;
    margin-top: 10px;
    padding: 0;
    border: 0;
    background: none;
    color: #6b7280;
    font-size: 13px;
    line-height: 1.4;
    text-align: left;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation
}

.checkout .checkout-coupon-hint strong {
    font-weight: 600
}

.checkout .checkout-coupon-hint:hover {
    text-decoration: underline
}

/* Coupon Apply is secondary so it doesn't compete with the orange pay CTA. */
.checkout #apply-coupon-btn {
    background: #fff;
    border: 1px solid var(--color-border);
    color: #1a1a1a
}

.checkout #apply-coupon-btn:hover {
    background: #f3f3f3
}

/* Collapsible Order notes — clean tappable row with a rotating chevron. */
.checkout-notes-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    list-style: none;
    font-weight: 500;
    font-size: 15px;
    color: #1a1a1a
}

.checkout-notes-summary::-webkit-details-marker {
    display: none
}

.checkout-notes-summary:after {
    content: "";
    width: 9px;
    height: 9px;
    border-right: 2px solid #8a887f;
    border-bottom: 2px solid #8a887f;
    transform: rotate(45deg);
    transition: transform .15s ease
}

.checkout-notes[open] .checkout-notes-summary:after {
    transform: rotate(-135deg)
}

/* Order notes — thin elegant pill toggle (collapsed = pill, open = rounded box). */
.checkout-note-pill {
    border: 0.5px solid var(--color-border);
    border-radius: 999px;
    padding: 9px 16px;
    margin-bottom: 16px
}

.checkout-note-pill[open] {
    border-radius: 12px
}

.checkout-note-pill__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    list-style: none;
    font-weight: 500;
    font-size: 14px;
    color: #5a584f
}

.checkout-note-pill__summary::-webkit-details-marker {
    display: none
}

.checkout-note-pill__summary:after {
    content: "";
    width: 8px;
    height: 8px;
    border-right: 2px solid #8a887f;
    border-bottom: 2px solid #8a887f;
    transform: rotate(45deg);
    transition: transform .15s ease
}

.checkout-note-pill[open] .checkout-note-pill__summary:after {
    transform: rotate(-135deg)
}

/* Floating-label fields (premium compact) — pure CSS via :placeholder-shown.
   Inputs carry placeholder=" " so the label sits centered when empty and floats
   up small when focused or filled. */
.checkout .ff {
    position: relative
}

.checkout .ff>.form-control,
.checkout .ff .search-input-box>.form-control,
.checkout .ff>.form-select {
    height: 54px;
    padding: 20px 12px 6px
}

.checkout .ff>label,
.checkout .ff .search-input-box>label {
    position: absolute;
    left: 13px;
    top: 16px;
    margin: 0;
    font-weight: 400;
    font-size: 15px;
    color: #8a887f;
    pointer-events: none;
    transition: top .12s ease, font-size .12s ease
}

.checkout .ff>.form-control:focus~label,
.checkout .ff>.form-control:not(:placeholder-shown)~label,
.checkout .ff .search-input-box>.form-control:focus~label,
.checkout .ff .search-input-box>.form-control:not(:placeholder-shown)~label,
.checkout .ff--select>label {
    top: 7px;
    font-size: 11px
}

/* Wallet loading skeleton (flat, no gradient). */
.express-loading {
    height: 44px;
    border-radius: 9px;
    background: #f0efe9;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #8a887f;
    font-size: 13px
}

.order-totals-item+.order-totals-item {
    border-top: 1px dotted var(--color-border);
    padding-top: .5rem
}

.order-totals-coupon {
    background-color: var(--color-brand-tint);
    border-radius: .25rem;
    color: var(--color-brand);
    display: inline-block;
    font-size: .65rem;
    padding: 2px 20px 2px 5px;
    position: relative
}

.order-totals-coupon .remove-coupon-btn {
    bottom: 0;
    opacity: .6;
    padding: 0 5px;
    position: absolute;
    right: 0;
    top: 0
}

.order-totals-coupon .remove-coupon-btn:hover {
    opacity: 1
}

.coupon-message>.alert {
    margin-top: .5rem
}

.search-input-dropdown {
    background-color: var(--color-surface);
    border-radius: 0 0 5px 5px;
    box-shadow: 0 0 5px rgba(0, 0, 0, .15);
    left: -99rem;
    margin-top: -3px;
    max-height: 220px;
    overflow: scroll;
    position: absolute;
    top: 100%;
    transition: left .01ms;
    transition-delay: .05s;
    width: 100%;
    z-index: 2
}

.search-input-box input:focus+.search-input-dropdown {
    left: 0;
    transition-delay: 0s
}

.search-input-dropdown a {
    border-bottom: 1px solid var(--color-border);
    color: var(--color-ink);
    display: block;
    line-height: 100%;
    padding: 7px;
    text-decoration: none
}

.search-input-dropdown a:hover {
    background-color: var(--color-surface-subtle);
    color: var(--color-brand)
}

@media (min-width:768px) {
    .checkout-order-total-box {
        position: sticky;
        top: 130px
    }
}

.my-order-product-thumb-box {
    max-width: 60px;
    min-width: 60px
}

.my-order-product-end {
    min-width: 160px
}

.my-order-product-end .btn-outline-secondary {
    border-width: 1px;
    padding: .35rem .6rem
}

@media (min-width:992px) {
    .my-order-header-element+.my-order-header-element:not(:last-child) {
        border-left: 1px solid var(--color-border);
        margin-left: 1rem;
        padding-left: 1rem
    }
}

.wysiwyg {
    line-height: 1.6
}

.wysiwyg h3:not(:first-child),
.wysiwyg h4:not(:first-child) {
    margin-top: 1em
}

.wysiwyg ul {
    list-style: none;
    padding: 0
}

.wysiwyg ul li {
    border-left: 2px solid var(--color-brand);
    margin-bottom: 1rem;
    margin-top: 1rem;
    padding-left: 1rem
}

.footer-brand {
    margin-top: -2rem
}

.site-footer .nav-item:first-child .nav-link {
    padding-left: 0
}

.page-link,
.pagination-item {
    height: 36px;
    padding: 3px 2px;
    text-align: center;
    width: 36px
}

.page-item.active span.page-link,
.pagination-item.current {
    cursor: default
}

.page-item.disabled {
    display: none
}

.status-dot {
    background-color: var(--color-border);
    border-radius: 9px;
    display: inline-block;
    height: 8px;
    margin-right: 4px;
    vertical-align: middle;
    width: 8px
}

.file-status-waiting-for-proof .status-dot,
.order-status-custom .status-dot,
.order-status-new .status-dot {
    background-color: var(--color-brand)
}

.file-status-approved .status-dot,
.order-status-complete .status-dot {
    background-color: #97bf61
}

.file-status-changes-requested .status-dot {
    background-color: #ff6b6b
}

.global-alert {
    background-color: rgba(33, 33, 33, .8);
    border-radius: 3px;
    color: var(--color-surface);
    font-size: 14px;
    left: 50%;
    opacity: 0;
    padding: 5px 12px;
    position: fixed;
    top: 5px;
    transform: translateX(-50%);
    transition: .5s;
    z-index: 99
}

.global-alert.ready {
    opacity: 1;
    top: 20px
}

@media (max-width:767.98px) {
    .hor-scroll-xs {
        -webkit-overflow-scrolling: touch;
        display: block;
        margin-left: -1rem;
        margin-right: -1rem;
        overflow: scroll;
        overflow-x: scroll;
        overflow-y: hidden;
        padding-left: 1rem;
        white-space: nowrap
    }

    .hor-scroll-xs>* {
        display: inline-block
    }

    .hor-scroll-xs>:last-child {
        margin-right: 1rem
    }
}

@media (min-width:364px) and (max-width:575.98px) {
    .hor-scroll-xs {
        margin-left: -1.8rem;
        margin-right: -1.8rem;
        padding-left: 1.8rem
    }

    .hor-scroll-xs>:last-child {
        margin-right: 1.8rem
    }
}

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

/* Accordion */

.accordion-item {
    background-color: var(--color-surface-subtle);
    border-radius: 0.25rem;
}

.bg-primary .accordion-item,
.bg-light .accordion-item {
    background-color: var(--color-surface);
}

.accordion-button {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    border: none;
    font-size: 1rem;
    background-color: transparent;
    font-weight: 600;
    text-align: left;
    padding: 1rem 1rem 1rem 1.5rem;
    border-radius: 0.25rem;
    transition: 0.15s background-color, 0.15s color;
}

.accordion-button-icon {
  border-radius: 5rem;
  background-color: var(--color-surface-subtle);
  transition: 0.2s;
}

.accordion-button:hover .accordion-button-icon {
  transform: scale(1.2);
}

.accordion-body {
    padding-left: 1.5rem;
    padding-right: 1rem;
}

.accordion-button[aria-expanded="true"] .accordion-button-icon {
  transform: rotate(180deg);
  background-color: var(--color-brand);
  color: var(--color-surface);
}

@media (min-width: 768px) {
  .accordion-button {
    font-size: 1.125rem;
  }
}

/* Product options — shape group as cards (slug "shape" only) */
.product-option-group--shape .product-shape-cards .product-shape-card {
  cursor: pointer;
  border: 2px solid var(--color-border);
  border-radius: 0.5rem;
  padding: 1rem 0.75rem;
  min-height: 5.5rem;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
  background: var(--color-surface);
}

.product-shape-option-radio:checked + .product-shape-card {
  border-color: var(--color-brand);
  background-color: rgba(var(--sf-brand-rgb), 0.08);
  box-shadow: 0 0 0 1px var(--color-brand);
}

.product-shape-option-radio:focus-visible + .product-shape-card {
  outline: 2px solid var(--color-brand);
  outline-offset: 2px;
}

@media (max-width:991.98px) {
  /* Final lock: reference-aligned mobile purchase block */
  .add-to-cart-form .calculator-panel {
    border-color: rgba(17, 24, 39, 0.05) !important;
    box-shadow: 0 1px 8px rgba(17, 24, 39, 0.03) !important;
    padding: 0.95rem 1.06rem 1.08rem !important;
  }

  /* 1) Quantity rows */
  .add-to-cart-form .product-qty-options .qty-option {
    min-height: 58px !important;
    border-radius: 16px !important;
    background: var(--color-surface-subtle) !important;
    border: 1px solid var(--color-border) !important;
    padding: 9px 13px !important;
    margin-bottom: 6px !important;
    display: grid !important;
    grid-template-columns: auto 1fr auto;
    align-items: center !important;
    gap: 0 8px;
  }

  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio:checked) {
    border-color: rgba(var(--sf-brand-rgb), 0.9) !important;
    background: linear-gradient(90deg, rgba(var(--sf-brand-rgb), 0.08) 0%, rgba(var(--sf-brand-rgb), 0.025) 100%) !important;
  }

  .add-to-cart-form .product-qty-options .label-qty {
    font-size: 17px !important;
    font-weight: 500 !important;
    line-height: 1.08 !important;
    gap: 0.6rem !important;
    display: flex !important;
    align-items: center !important;
    grid-column: 1 / 3;
    min-width: 0;
  }

  .add-to-cart-form .product-qty-options .qty-row-left {
    width: 34px;
    flex: 0 0 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .add-to-cart-form .product-qty-options .qty-row-center {
    min-width: 0;
    display: inline-flex;
    align-items: center;
  }

  .add-to-cart-form .product-qty-options .qty-price {
    text-align: right !important;
    grid-column: 3;
    justify-self: end;
  }

  .add-to-cart-form .qty-price .raw-price {
    font-size: 17px !important;
    font-weight: 800 !important;
    color: var(--color-brand) !important;
    line-height: 1 !important;
  }

  .add-to-cart-form .qty-price > small.text-muted {
    font-size: 11px !important;
    color: rgba(30, 37, 48, 0.45) !important;
    line-height: 1.08 !important;
  }

  .add-to-cart-form .product-qty-options .label-qty .radio-primary {
    width: 32px !important;
    height: 32px !important;
    border-radius: 12px !important;
    padding-top: 7px !important;
    background: var(--color-surface-subtle) !important;
  }

  .add-to-cart-form .product-qty-options .qty-radio:checked + .label-qty .radio-primary,
  .add-to-cart-form .product-qty-options input:checked + .label-qty .radio-primary {
    background: var(--color-brand) !important;
    color: var(--color-surface) !important;
    box-shadow: 0 0 0 2px rgba(var(--sf-brand-rgb), 0.13) !important;
  }

  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) {
    grid-template-columns: minmax(94px, 112px) 1fr !important;
    align-items: center !important;
    border: 1.5px solid #E8711A !important;
    border-radius: 10px !important;
    background: #FFF !important;
    padding: 11px 16px !important;
    gap: 2px 12px !important;
  }

  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-row-left,
  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .label-qty .radio-primary {
    display: none !important;
  }

  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .label-qty {
    display: contents !important;
  }

  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-row-center {
    grid-column: 1;
    grid-row: 2;
    align-items: flex-start !important;
  }

  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) #qty-custom-text {
    display: none !important;
  }

  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-custom-active-label {
    display: inline-block !important;
    font-size: 12px;
    color: #E8711A;
    opacity: 0.85;
    font-weight: 500;
    line-height: 1.2;
  }

  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) #qty-custom-input:not(.d-none) {
    grid-column: 1;
    grid-row: 1;
    width: 80px !important;
    max-width: 80px !important;
    margin-top: 0 !important;
    border: 1px solid rgba(232, 113, 26, 0.4) !important;
    border-radius: 6px !important;
    padding: 5px 10px !important;
    background: #FFF7F0 !important;
    font-size: 17px !important;
    font-weight: 500 !important;
    color: #1a2e1a !important;
    text-align: left !important;
    -moz-appearance: textfield;
  }

  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) #qty-custom-input:focus {
    border-color: #E8711A !important;
    background: #FFF !important;
    box-shadow: 0 0 0 2px rgba(232, 113, 26, 0.15) !important;
    outline: none !important;
  }

  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) #qty-custom-input::-webkit-outer-spin-button,
  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) #qty-custom-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-price {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    gap: 1px !important;
  }

  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-price .raw-price {
    font-size: 17px !important;
    font-weight: 800 !important;
    color: #E8711A !important;
    line-height: 1.2 !important;
  }

  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-price > small.text-muted {
    font-size: 12px !important;
    color: rgba(30, 37, 48, 0.55) !important;
    opacity: 1 !important;
  }

  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-custom-min-hint {
    grid-column: 1;
    grid-row: 2;
    margin-top: 12px;
  }

  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) #qty-custom-input.is-invalid-min {
    border-color: #D35454 !important;
    background: #FFF5F5 !important;
    box-shadow: 0 0 0 2px rgba(211, 84, 84, 0.14) !important;
  }

  .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) #qty-custom-input.is-invalid-min + .qty-custom-min-hint {
    display: inline-block !important;
  }

  /* 2) Quantity “more” toggle (compact; full list on desktop) */
  .add-to-cart-form .product-qty-more__reveal {
    min-height: 0 !important;
  }

  /* 3) Trust block */
  .add-to-cart-form .calculator-trust-row {
    grid-template-columns: 1fr 1fr !important;
    column-gap: 20px !important;
    row-gap: 10px !important;
    margin-top: 11px !important;
    padding-top: 10px !important;
    padding-bottom: 3px !important;
    border-bottom: 1px solid rgba(17, 24, 39, 0.07) !important;
    align-items: center !important;
  }

  .add-to-cart-form .calculator-trust-label {
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.34 !important;
    gap: 8px !important;
    color: var(--color-ink-soft) !important;
    letter-spacing: 0 !important;
    align-items: center !important;
  }

  .add-to-cart-form .calculator-trust-icon {
    width: 15px !important;
    height: 15px !important;
    flex: 0 0 15px !important;
    font-size: 14px !important;
    opacity: 1 !important;
    margin-top: 0 !important;
  }

  .add-to-cart-form .calculator-trust-emoji {
    font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif !important;
    font-size: 14px !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Keep "100% Satisfaction" on its own lower row, left-aligned like reference */
  .add-to-cart-form .calculator-trust-row .calculator-trust-item:nth-child(5) {
    grid-column: 1 / -1;
    justify-content: flex-start;
    margin-top: 1px;
  }

  .add-to-cart-form .calculator-trust-row .calculator-trust-item:nth-child(5) .calculator-trust-label {
    width: auto !important;
    justify-content: flex-start !important;
    text-align: left !important;
  }

  /* 4) Upload block */
  .add-to-cart-form .product-upload-ui--v2 {
    margin-top: -0.34rem !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .product-artwork.mb-4 {
    margin-top: -0.04rem !important;
    margin-bottom: 0.84rem !important;
  }

  .product-upload-ui--v2 .upload-action-shell:not(.upload-action-shell--hero) {
    border-radius: 21px !important;
    border-color: rgba(236, 232, 227, 0.74) !important;
    box-shadow: 0 1px 0 rgba(17, 24, 39, 0.015), 0 3px 10px rgba(17, 24, 39, 0.03) !important;
    background: linear-gradient(180deg, var(--color-surface) 0%, var(--color-surface-subtle) 100%) !important;
    margin-top: 0.04rem !important;
  }

  .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) {
    min-height: 112px !important;
    padding: 14px 16px 10px !important;
  }

  .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__main {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
  }

  .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__icon {
    flex: 0 0 52px !important;
    width: 52px !important;
    height: 52px !important;
    box-shadow: 0 6px 12px rgba(var(--sf-brand-rgb), 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.36) !important;
  }

  .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__title {
    font-size: 16px !important;
    line-height: 1.14 !important;
    color: var(--color-ink-soft) !important;
    font-weight: 600 !important;
  }

  .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__subtitle {
    font-size: 12px !important;
    color: var(--color-ink-muted) !important;
    line-height: 1.2 !important;
  }

  .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__helper {
    font-size: 12px !important;
    line-height: 1.25 !important;
    padding: 10px 1px 1px !important;
    border-top-color: rgba(17, 24, 39, 0.06) !important;
    color: var(--color-ink-muted) !important;
  }

  .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__helper-icon {
    background: #dce8d7 !important;
    color: #86a082 !important;
    width: 19px !important;
    height: 19px !important;
    flex: 0 0 19px !important;
    line-height: 19px !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .product-note.mb-3 {
    margin-top: 0.30rem !important;
    margin-bottom: 0.62rem !important;
  }

  /* 5) CTA (highest priority) */
  .add-to-cart-form .ux-cart-integrated--v3.product-add-card {
    margin-top: 0.75rem !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__btn {
    height: clamp(72px, 18.5vw, 76px) !important;
    min-height: 72px !important;
    max-height: 76px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(17, 24, 39, 0.07) !important;
    box-shadow: 0 8px 20px rgba(17, 24, 39, 0.12) !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: stretch !important;
    /* Safety gradient on container removes any visible center gap */
    background: linear-gradient(90deg, var(--color-brand) 0%, var(--color-brand) 44%, var(--color-surface-subtle) 44%, var(--color-surface-subtle) 100%) !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__cta {
    flex: 0 0 44% !important;
    max-width: 44% !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: linear-gradient(94deg, var(--color-brand-hover) 0%, var(--color-brand) 46%, var(--color-accent) 100%) !important;
    display: flex !important;
    align-items: stretch !important;
    justify-content: center !important;
    width: 44% !important;
    height: 100% !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__left {
    flex: 1 1 auto !important;
    width: 100% !important;
    max-width: none !important;
    padding: 0 10px !important;
    background: transparent !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.45rem !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__right {
    flex: 1 0 56% !important;
    max-width: none !important;
    min-width: 0 !important;
    padding: 9px 10px 8px !important;
    background: var(--color-surface-subtle) !important;
    border-left: 0 !important;
    box-shadow: none !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 3px !important;
    text-align: center !important;
    overflow: visible !important;
    position: relative;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__right::before {
    content: none !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__icon {
    width: 26px !important;
    height: 26px !important;
    margin-right: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__icon .icon {
    font-size: 18px !important;
    display: block !important;
    line-height: 1 !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__text {
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    letter-spacing: 0.001em !important;
    display: inline-flex !important;
    align-items: center !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__right .product-add-card__price {
    font-size: 23px !important;
    line-height: 1 !important;
    letter-spacing: -0.005em !important;
    color: var(--color-brand) !important;
    font-weight: 800 !important;
    text-align: center !important;
    width: 100% !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__right .product-add-card__meta {
    font-size: clamp(10.5px, 2.35vw, 11.5px) !important;
    line-height: 1.14 !important;
    color: rgba(30, 37, 48, 0.55) !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
    margin-top: 0 !important;
    max-width: 100% !important;
    display: block !important;
    width: 100% !important;
    text-align: center !important;
  }

  /* Very narrow phones: keep CTA readable and fully filled */
  @media (max-width:389.98px) {
    .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__cta {
      flex-basis: 44% !important;
      max-width: 44% !important;
      width: 44% !important;
    }

    .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__right {
      flex-basis: 56% !important;
      max-width: 56% !important;
      min-width: 0 !important;
      padding: 8px 8px 7px !important;
      align-items: center !important;
      gap: 2px !important;
      text-align: center !important;
    }

    .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__text {
      font-size: 14px !important;
    }

    .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__right .product-add-card__price {
      font-size: 19px !important;
    }

    .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__right .product-add-card__meta {
      font-size: 10px !important;
      white-space: nowrap !important;
      line-height: 1.12 !important;
      overflow: visible !important;
    }
  }
}
@media (max-width: 991.98px) {
  .add-to-cart-form .calculator-panel--qty.mb-4 {
    margin-bottom: 0.75rem !important;
  }

  .add-to-cart-form .calculator-trust-row {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  .add-to-cart-form .product-upload-ui--v2 {
    margin-top: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .product-artwork.mb-4 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .product-artwork .product-option-label.bold.mb-2 {
    margin-bottom: 0.35rem !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .ux-upload-note-card:not(:has(.ux-upload-hero-card)) {
    border-radius: 18px !important;
    border: 1px solid rgba(220, 226, 234, 0.65) !important;
    background: linear-gradient(180deg, var(--color-surface-subtle) 0%, var(--color-surface-subtle) 100%) !important;
    box-shadow: 0 3px 10px rgba(20, 28, 45, 0.04) !important;
    padding: 0 5px 0 !important;
    margin-bottom: 2px !important;
    overflow: hidden !important;
    position: relative;
    z-index: 1;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-shell:not(.upload-action-shell--hero) {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) {
    position: relative;
    min-height: 0 !important;
    align-items: flex-start !important;
    align-content: flex-start !important;
    padding-top: 6px !important;
    padding-bottom: 5px !important;
    padding-left: 6px !important;
    padding-right: 32px !important;
    gap: 0 !important;
    row-gap: 3px !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero)::after {
    content: "\203A";
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-52%);
    font-size: 18px;
    line-height: 1;
    color: var(--color-ink-faint);
    font-weight: 400;
    pointer-events: none;
    opacity: 0.85;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__main {
    gap: 4px !important;
    align-items: center !important;
    width: 100% !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__icon {
    width: 36px !important;
    height: 36px !important;
    flex: 0 0 36px !important;
    background: radial-gradient(130% 130% at 28% 22%, var(--color-surface-subtle) 0%, #e8e3db 55%, #c5bfb6 100%) !important;
    border: 1px solid rgba(var(--sf-ink-rgb), 0.1) !important;
    box-shadow: 0 1px 3px rgba(30, 40, 62, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.45) !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__icon::before {
    border-left: 2.5px solid rgba(255, 255, 255, 0.95) !important;
    border-top: 2.5px solid rgba(255, 255, 255, 0.95) !important;
    width: 8px !important;
    height: 8px !important;
    transform: rotate(45deg) translateY(0) !important;
    margin-top: -2px !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__icon::after {
    width: 3px !important;
    height: 11px !important;
    border-radius: 2px !important;
    top: 12px !important;
    background: rgba(255, 255, 255, 0.95) !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__title {
    font-size: 15px !important;
    line-height: 1.22 !important;
    font-weight: 600 !important;
    color: var(--color-ink-soft) !important;
    margin-bottom: 0 !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__subtitle {
    display: block !important;
    margin-top: 0 !important;
    font-size: 11.5px !important;
    line-height: 1.2 !important;
    color: var(--color-ink-muted) !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__title .upload-action-card__subtitle {
    display: inline !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__text {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    gap: 1px !important;
    row-gap: 1px !important;
    align-items: flex-start !important;
    text-align: left !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__helper {
    border-top: 0 !important;
    border-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    font-size: 10.75px !important;
    line-height: 1.25 !important;
    color: var(--color-ink-muted) !important;
    padding-left: 0 !important;
    padding-right: 6px !important;
    display: block !important;
    flex: 0 0 auto !important;
    width: calc(100% - 40px) !important;
    max-width: calc(100% - 40px) !important;
    margin-left: 40px !important;
    margin-right: 0 !important;
    text-align: left !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card:not(.upload-action-card--hero) .upload-action-card__helper-icon {
    display: none !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .ux-upload-note-card .product-note:not(.product-note--hero-card) {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: hidden !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .ux-upload-note-card .product-note:not(.product-note--hero-card) .product-note__summary {
    min-height: 0 !important;
    margin-top: -2px !important;
    /* prior align minus 2ch, +1ch right (net −1ch); floor 0 */
    padding: 2px 8px 2px max(0px, calc(20px - 1ch)) !important;
    border-top: 1px solid rgba(var(--sf-ink-rgb), 0.12) !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    justify-content: flex-start !important;
    align-items: center !important;
    text-align: left !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .ux-upload-note-card .product-note:not(.product-note--hero-card) .product-note__label {
    padding-left: 0 !important;
    justify-content: flex-start !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .ux-upload-note-card .product-note:not(.product-note--hero-card) .product-note__label-main {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: var(--color-ink-muted) !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .ux-upload-note-card .product-note:not(.product-note--hero-card) .product-note__label-optional {
    display: inline !important;
    font-size: 0.82em !important;
    color: var(--color-ink-muted) !important;
    position: relative;
    top: 1px;
  }

  .add-to-cart-form .product-upload-ui--v2 .ux-upload-note-card .product-note:not(.product-note--hero-card) .product-note__icon {
    display: inline-flex !important;
    width: 18px !important;
    height: 18px !important;
    flex: 0 0 18px !important;
    border-radius: 999px !important;
    background: var(--color-surface-subtle) !important;
    color: var(--color-ink-muted) !important;
    font-size: 9px !important;
    line-height: 18px !important;
    text-align: center !important;
    margin-left: 2px !important;
    margin-right: 6px !important;
    position: relative;
  }

  .add-to-cart-form .product-upload-ui--v2 .ux-upload-note-card .product-note:not(.product-note--hero-card) .product-note__icon::before {
    content: "\270E" !important;
    font-family: inherit !important;
    font-size: 9px !important;
    line-height: 1 !important;
    color: var(--color-ink-muted) !important;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) rotate(-12deg);
  }

  .add-to-cart-form .product-upload-ui--v2 .ux-upload-note-card .product-note:not(.product-note--hero-card) .product-note__label::before {
    display: none !important;
    content: none !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .ux-upload-note-card .product-note:not(.product-note--hero-card) .product-note__summary::after {
    font-size: 17px !important;
    color: var(--color-ink-faint) !important;
    opacity: 0.85 !important;
  }

  /* Upload hero — horizontal row (mobile) */
  .add-to-cart-form .product-upload-ui--v2 .ux-upload-note-card:has(.ux-upload-hero-card) {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin-bottom: 8px !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .ux-upload-hero-card {
    border-radius: 12px !important;
    box-shadow: 0 1px 2px rgba(17, 24, 39, 0.04) !important;
    background: var(--color-surface-subtle) !important;
    border: 1px solid rgba(17, 24, 39, 0.07) !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-shell--hero {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card--hero {
    flex-direction: row !important;
    align-items: center !important;
    text-align: left !important;
    padding: 0.65rem 0.75rem 0.65rem 0.65rem !important;
    min-height: 0 !important;
    gap: 0 !important;
    row-gap: 0 !important;
    transition: background-color 0.18s ease, transform 0.18s ease !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card--hero:active {
    transform: scale(0.992) !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card--hero::after {
    content: none !important;
    display: none !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card__hero-row-inner {
    gap: 0.55rem !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card__hero-icon {
    width: 36px !important;
    height: 36px !important;
    border-radius: 12px !important;
    background: rgba(var(--sf-brand-rgb), 0.1) !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card__hero-icon-svg {
    width: 22px !important;
    height: 22px !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card__hero-text {
    gap: 0.08rem !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card__hero-title {
    font-size: 0.84375rem !important;
    font-weight: 600 !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card__hero-formats {
    font-size: 0.625rem !important;
    line-height: 1.3 !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card__hero-later {
    font-size: 0.625rem !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .upload-action-card__hero-chevron svg {
    width: 18px !important;
    height: 18px !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .ux-upload-hero-card .product-note__summary {
    margin: 0.3rem 0 0 !important;
    padding: 0.4rem 0.1rem 0.4rem 0.65rem !important; /* align with upload hero row icon */
    border: none !important;
    border-top: 1px solid rgba(17, 24, 39, 0.07) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    align-items: center !important;
    font-size: 0.8125rem !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .ux-upload-hero-card .product-note__body {
    padding: 0 0 8px !important;
  }

  .add-to-cart-form .product-upload-ui--v2 .ux-upload-hero-card .product-note__icon-svg {
    width: 1.0625rem !important;
    height: 1.0625rem !important;
    color: var(--color-ink-muted) !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3.product-add-card {
    margin-top: 8px !important;
    border-radius: 24px !important;
    border: 1px solid rgba(216, 221, 229, 0.72) !important;
    background: linear-gradient(180deg, var(--color-surface) 0%, var(--color-surface-subtle) 100%) !important;
    box-shadow: 0 8px 22px rgba(20, 28, 45, 0.08) !important;
    padding: 12px !important;
    /* position/z-index: set in #product … fixed bar rule below (avoid relative here — breaks viewport-fixed on some mobile browsers) */
  }

  .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__btn {
    height: 66px !important;
    min-height: 66px !important;
    max-height: 66px !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 10px rgba(18, 24, 39, 0.12) !important;
    border: 1px solid rgba(210, 215, 224, 0.85) !important;
    position: relative;
    z-index: 4;
    pointer-events: auto !important;
  }

  .add-to-cart-form .ux-cart-integrated--v3 .btn-add-to-cart {
    position: relative;
    z-index: 5;
    pointer-events: auto !important;
  }
}

/* Mobile: fixed add-to-cart bar on product page (v3 CTA only); reserve scroll space below content */
@media (max-width: 991.98px) {
  #product .add-to-cart-form .ux-cart-integrated--v3.product-add-card {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    top: auto !important;
    /* Above .site-header (99) and fullscreen menu (98); below Bootstrap modals (~1055) */
    z-index: 1030;
    width: 100%;
    max-width: none;
    margin-top: 0 !important;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0 !important;
    box-sizing: border-box;
    padding-top: 12px !important;
    padding-left: max(12px, env(safe-area-inset-left, 0px)) !important;
    padding-right: max(12px, env(safe-area-inset-right, 0px)) !important;
    padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    /* Own compositing layer — reduces iOS/Safari glitches where fixed footers vanish while scrolling */
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    pointer-events: auto;
  }

  /* Reserve scroll room ABOVE the mobile footer so last content clears the fixed v3 CTA.
     Padding lives on <main>, not <body> — otherwise body padding shows a cream strip
     below the green .sf-footer-mob (the old .site-footer that used to absorb it is d-none). */
  main.site-main-content:has(#product .add-to-cart-form .ux-cart-integrated--v3.product-add-card) {
    padding-bottom: calc(8.75rem + env(safe-area-inset-bottom, 0px));
  }

  html:has(#product .add-to-cart-form .ux-cart-integrated--v3.product-add-card) {
    scroll-padding-bottom: calc(8.75rem + env(safe-area-inset-bottom, 0px));
  }

  /* Strip the card tray — only the pill floats above content */
  #product .add-to-cart-form .ux-cart-integrated--v3.product-add-card {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
  }

  /* Compensate: pill itself gets a stronger shadow so it reads on any bg */
  #product .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__btn {
    box-shadow: 0 4px 28px rgba(16, 24, 40, 0.22) !important;
  }

  /* Hide the fixed v3 CTA while the mobile fullscreen menu is open
     (body gets .fs-active from app.js — CTA shouldn't overlap the nav list) */
  body.fs-active #product .add-to-cart-form .ux-cart-integrated--v3.product-add-card {
    display: none !important;
  }
}

/* #product desktop (lg+): size panel matches .calculator-panel (Shape/Finish) — white card, site orange, tight rhythm */
@media (min-width: 992px) {
    #product .add-to-cart-form .product-size.calculator-panel {
        padding: 0.5rem 0.75rem 0.55rem;
        border-radius: 18px;
        border: 1px solid rgba(0, 0, 0, 0.05);
        background-color: var(--color-surface);
        box-shadow: 0 1px 8px rgba(0, 0, 0, 0.03);
        box-sizing: border-box;
    }

    #product .add-to-cart-form .product-size .product-size-heading {
        margin-bottom: 0.35rem !important;
    }

    #product .add-to-cart-form .product-size .product-size-options {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 6px;
        align-items: stretch;
    }

    #product .add-to-cart-form .product-size .product-size-options .product-size-label.product-size-preset-card {
        position: relative;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        gap: 4px;
        min-height: 0;
        padding: 8px 5px 7px;
        margin-bottom: 0 !important;
        border: 2px solid var(--color-border);
        border-radius: 12px;
        background: var(--color-surface);
        box-shadow: none;
        font-size: 0.8125rem;
        font-weight: 500;
        line-height: 1.2;
        color: rgba(var(--sf-ink-rgb), 0.95);
        text-align: center;
        cursor: pointer;
        transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
    }

    #product .add-to-cart-form .product-size .product-size-label.product-size-preset-card:hover {
        border-color: rgba(var(--sf-brand-rgb), 0.35);
        background: rgba(var(--sf-brand-rgb), 0.08);
    }

    #product .add-to-cart-form .product-size .product-size-preset-card__vis {
        height: 34px;
        display: flex;
        align-items: flex-end;
        justify-content: center;
        width: 100%;
    }

    #product .add-to-cart-form .product-size .product-size-preset-card__shape {
        display: block;
        border: 1px solid rgba(0, 0, 0, 0.1);
        border-radius: 3px;
        background: var(--color-surface-subtle);
        flex-shrink: 0;
        transition: border-color 0.15s ease, background 0.15s ease;
        box-sizing: border-box;
    }

    #product .add-to-cart-form .product-size .product-size-preset-card__measure {
        display: block;
        max-width: 100%;
        word-break: break-word;
        font-size: 12.5px;
        font-weight: 600;
        color: rgba(var(--sf-ink-rgb), 0.95);
        letter-spacing: -0.01em;
    }

    #product .add-to-cart-form .product-size .product-size-preset-card__sub {
        font-size: 11px;
        font-weight: 500;
        color: rgba(var(--sf-ink-rgb), 0.42);
        line-height: 1.2;
        margin-top: 0;
    }

    #product .add-to-cart-form .product-size .product-size-preset-card__pop {
        position: absolute;
        top: -9px;
        left: 50%;
        transform: translateX(-50%);
        z-index: 2;
        background: rgba(var(--sf-accent-rgb), 0.22);
        color: var(--color-ink-soft);
        font-size: 9px;
        font-weight: 700;
        letter-spacing: 0.04em;
        padding: 2px 8px;
        border-radius: 20px;
        white-space: nowrap;
        text-transform: uppercase;
        line-height: 1.2;
        pointer-events: none;
        box-shadow: 0 1px 2px rgba(var(--sf-ink-rgb), 0.08);
    }

    #product .add-to-cart-form .product-size .product-size-preset-card__pop[hidden] {
        display: none !important;
    }

    #product .add-to-cart-form .product-size .size-radio:checked + .product-size-label.product-size-preset-card {
        border-color: var(--color-brand);
        background-color: rgba(var(--sf-brand-rgb), 0.1);
        box-shadow: none;
        color: inherit;
    }

    #product .add-to-cart-form .product-size .size-radio:checked + .product-size-label.product-size-preset-card .product-size-preset-card__measure {
        color: rgba(var(--sf-ink-rgb), 0.95);
        font-weight: 600;
    }

    #product .add-to-cart-form .product-size .size-radio:checked + .product-size-label.product-size-preset-card .product-size-preset-card__sub {
        color: rgba(var(--sf-brand-rgb), 0.88);
    }

    #product .add-to-cart-form .product-size .size-radio:checked + .product-size-label.product-size-preset-card .product-size-preset-card__shape {
        border-color: rgba(var(--sf-brand-rgb), 0.45);
        background: rgba(var(--sf-brand-rgb), 0.1);
    }

    #product .add-to-cart-form .product-size .size-radio:focus-visible + .product-size-label.product-size-preset-card {
        outline: 2px solid rgba(var(--sf-brand-rgb), 0.45);
        outline-offset: 2px;
    }

    #product .add-to-cart-form .product-size .product-size-select {
        min-height: 44px;
        font-size: 0.8125rem;
        padding: 0.4rem 2.25rem 0.4rem 0.75rem;
        border-radius: 12px;
        border: 1px solid rgba(0, 0, 0, 0.08);
        background: var(--color-surface);
    }

    /*
     * Custom: one full-width thin row under the 4 cards (reference).
     * Active state: same row height — inputs overlay the slot (absolute), no second block, no vertical growth.
     */
    #product .add-to-cart-form .product-size .product-size-custom-group {
        order: 10;
        grid-column: 1 / -1;
        justify-self: stretch;
        width: 100%;
        max-width: 100%;
        position: relative;
        height: 40px;
        min-height: 40px;
        max-height: 40px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: stretch;
        gap: 0;
        margin-top: 0;
        padding: 0;
        border: none;
        box-sizing: border-box;
        overflow: visible;
    }

    #product .add-to-cart-form .product-size .product-size-custom-group::before {
        display: none;
        content: none;
    }

    #product .add-to-cart-form .product-size-custom-group:not(:has(> .size-radio:checked)) .product-size-label.custom.product-size-custom-btn {
        display: flex !important;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 8px;
        width: 100%;
        height: 40px;
        min-height: 40px;
        max-height: 40px;
        box-sizing: border-box;
        padding: 0 11px;
        margin-bottom: 0 !important;
        border: 2px solid var(--color-border);
        border-radius: 12px;
        background: var(--color-surface);
        font-size: 12.5px;
        font-weight: 600;
        color: rgba(var(--sf-ink-rgb), 0.72);
        letter-spacing: -0.01em;
        box-shadow: none;
        cursor: pointer;
        transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
    }

    #product .add-to-cart-form .product-size-custom-group:not(:has(> .size-radio:checked)) .product-size-label.custom.product-size-custom-btn:hover {
        border-color: rgba(var(--sf-brand-rgb), 0.45);
        color: rgba(var(--sf-ink-rgb), 0.9);
        background: rgba(var(--sf-brand-rgb), 0.04);
    }

    #product .add-to-cart-form .product-size-custom-group:not(:has(> .size-radio:checked)) .product-size-label.custom.product-size-custom-btn #size-custom-text {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        min-width: 0;
    }

    #product .add-to-cart-form .product-size-custom__icon {
        color: rgba(var(--sf-ink-rgb), 0.38);
        flex-shrink: 0;
    }

    #product .add-to-cart-form .product-size-custom-group:not(:has(> .size-radio:checked)) .size-radio:focus-visible + .product-size-label.custom {
        outline: 2px solid rgba(var(--sf-brand-rgb), 0.45);
        outline-offset: 2px;
    }

    #product .add-to-cart-form .product-size-custom-group:has(> .size-radio:checked) .product-size-label.custom {
        display: none !important;
    }

    #product .add-to-cart-form .product-size-custom-group:not(:has(> .size-radio:checked)) #size-custom-input {
        display: none !important;
    }

    #product .add-to-cart-form .product-size-custom-group:has(> .size-radio:checked) #size-custom-input {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        display: flex !important;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
        max-width: 100%;
        height: 40px;
        min-height: 40px;
        max-height: 40px;
        margin: 0 !important;
        padding: 0 10px !important;
        border: 2px solid var(--color-brand) !important;
        border-radius: 12px;
        background-color: rgba(var(--sf-brand-rgb), 0.08) !important;
        box-shadow: 0 0 0 1px var(--color-brand) !important;
        box-sizing: border-box;
        z-index: 2;
    }

    #product .add-to-cart-form .product-size-custom-group #size-custom-input .size-custom-ui-row {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: center;
        gap: 6px;
        padding: 0;
        width: 100%;
    }

    #product .add-to-cart-form .product-size-custom-group #size-custom-input .size-custom-w-label,
    #product .add-to-cart-form .product-size-custom-group #size-custom-input .size-custom-h-label {
        display: none !important;
    }

    #product .add-to-cart-form .product-size-custom-group #size-custom-input .size-custom-ui-field {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 0;
        flex: 0 0 auto;
        max-width: none;
    }

    #product .add-to-cart-form .product-size-custom-group #size-custom-input .size-custom-ui-unit {
        display: none !important;
    }

    #product .add-to-cart-form .product-size-custom-group #size-custom-input .size-custom-ui-field::after {
        content: none !important;
    }

    #product .add-to-cart-form .product-size-custom-group #size-custom-input .size-custom-input {
        width: 48px;
        min-width: 44px;
        max-width: 52px;
        height: 28px;
        padding: 2px 6px;
        font-size: 12.5px;
        font-weight: 600;
        line-height: 1.2;
        text-align: center;
        border-radius: 8px;
        border: 1px solid rgba(0, 0, 0, 0.1);
        background: var(--color-surface);
        box-sizing: border-box;
        color: rgba(var(--sf-ink-rgb), 0.95);
    }

    #product .add-to-cart-form .product-size-custom-group #size-custom-input .size-custom-input:focus {
        border-color: var(--color-brand);
        box-shadow: 0 0 0 2px rgba(var(--sf-brand-rgb), 0.18);
        outline: none;
    }

    #product .add-to-cart-form .product-size-custom-group #size-custom-input .size-custom-sep {
        font-size: 12.5px;
        font-weight: 600;
        line-height: 1;
        color: rgba(var(--sf-ink-rgb), 0.45);
        padding: 0 2px;
        flex: 0 0 auto;
        user-select: none;
    }

    #product .add-to-cart-form .product-size-custom-group #size-custom-input .size-custom-ui-row::after {
        content: attr(data-unit-suffix);
        font-size: 11.5px;
        font-weight: 600;
        color: rgba(var(--sf-ink-rgb), 0.42);
        margin-left: 2px;
        align-self: center;
        line-height: 1;
        flex: 0 0 auto;
    }

    /* Presets without new card class (edge cases): keep readable chip */
    #product .add-to-cart-form .product-size .product-size-options .product-size-label:not(.custom):not(.product-size-preset-card) {
        min-height: 4.5rem;
        padding: 0.45rem 0.35rem;
        border-radius: 12px;
        border: 1px solid rgba(15, 23, 42, 0.12);
        background: var(--color-surface);
        margin-bottom: 0 !important;
        font-size: 0.8125rem;
        font-weight: 600;
    }

    #product .add-to-cart-form .product-size .size-radio:checked + .product-size-label:not(.custom):not(.product-size-preset-card) {
        border-color: rgba(var(--sf-brand-rgb), 0.92);
        color: var(--color-brand-pressed);
        background: linear-gradient(180deg, var(--color-brand-tint) 0%, var(--color-brand-tint) 100%);
        box-shadow: 0 0 0 2px rgba(var(--sf-brand-rgb), 0.16);
    }

    /* Custom stickers: desktop only — hide 6×6 when shape ≠ rectangle (four presets + custom row) */
    #product[data-cs-shape]:not([data-cs-shape="rectangle"]) .add-to-cart-form .product-size-options > input.size-radio[value="6x6"],
    #product[data-cs-shape]:not([data-cs-shape="rectangle"]) .add-to-cart-form .product-size-options > input.size-radio[value="6x6"] + label.product-size-label {
        display: none !important;
    }
}

/* Custom stickers: mobile only — hide 6×5 when shape = rectangle (visual cleanup, calculator untouched) */
@media (max-width: 991.98px) {
    #product[data-cs-shape="rectangle"] .add-to-cart-form .product-size-options > input.size-radio[value="6x5"],
    #product[data-cs-shape="rectangle"] .add-to-cart-form .product-size-options > input.size-radio[value="6x5"] + label.product-size-label {
        display: none !important;
    }
}

/* #product desktop (≥992px): one rhythm for calculator titles — Shape, Finish, Size, Quantity (readable, compact; not mobile) */
@media (min-width: 992px) {
    #product .add-to-cart-form #custom-sticker-calculator-shape > .product-option-label.bold,
    #product .add-to-cart-form #custom-sticker-calculator-finish > .product-option-label.bold,
    #product .add-to-cart-form .calculator-panel--qty .product-option-label.bold {
        font-size: 0.8125rem;
        font-weight: 600;
        line-height: 1.3;
        letter-spacing: -0.012em;
        color: rgba(var(--sf-ink-rgb), 0.92);
        margin-bottom: 0.35rem !important;
        text-transform: none;
    }

    #product .add-to-cart-form .product-size .product-size-heading__kicker {
        font-size: 0.8125rem;
        font-weight: 600;
        line-height: 1.3;
        letter-spacing: -0.012em;
        color: rgba(var(--sf-ink-rgb), 0.92);
        text-transform: none;
    }
}

/* #product desktop (≥992px): premium quantity rows (reference-aligned grid, per-unit + badges; isolated from mobile) */
@media (min-width: 992px) {
    /* Pull quantity panel up vs Size: overrides wide tablet/desktop margin-top from (min-width: 768px) */
    #product .add-to-cart-form .calculator-panel--qty.mb-4 {
        margin-top: 0.35rem !important;
    }

    #product .add-to-cart-form .calculator-panel--qty.calculator-panel {
        background-color: var(--color-surface);
        border: 1px solid rgba(0, 0, 0, 0.06);
        border-radius: 18px;
        box-shadow: 0 1px 10px rgba(0, 0, 0, 0.04);
        padding: 0.65rem 0.85rem 0.7rem;
        box-sizing: border-box;
    }

    #product .add-to-cart-form .product-qty-heading {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 0.65rem;
        margin-bottom: 0.5rem !important;
        padding-bottom: 0.15rem;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    }

    /* Title typography matches Shape / Finish / Size (0.8125rem block above); only layout tweaks here */
    #product .add-to-cart-form .product-qty-heading .product-option-label.bold.product-qty-heading__title {
        margin-bottom: 0 !important;
    }

    #product .add-to-cart-form .product-qty-heading__hint {
        font-size: 11px;
        font-weight: 600;
        line-height: 1.25;
        color: var(--color-brand);
        letter-spacing: -0.01em;
        text-align: right;
        flex-shrink: 0;
        max-width: 12rem;
    }

    #product .add-to-cart-form .product-qty-options {
        gap: 5px;
    }

    #product .add-to-cart-form .product-qty-more__list {
        display: flex;
        flex-direction: column;
        gap: 5px;
    }

    #product .add-to-cart-form .product-qty-options .qty-option {
        display: grid !important;
        grid-template-columns:
            28px
            minmax(2.25rem, 3rem)
            minmax(4.25rem, 1fr)
            auto
            minmax(4.5rem, max-content);
        align-items: center;
        column-gap: 12px;
        row-gap: 6px;
        padding: 9px 14px !important;
        margin-bottom: 0 !important;
        border: 1.5px solid var(--color-border) !important;
        border-radius: 11px !important;
        background: var(--color-surface) !important;
        box-shadow: none !important;
        transition: border-color 0.14s ease, box-shadow 0.14s ease, background 0.14s ease;
    }

    #product .add-to-cart-form .product-qty-options .qty-option:hover {
        border-color: rgba(var(--sf-brand-rgb), 0.42) !important;
        background: var(--color-brand-tint) !important;
    }

    #product .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio:checked) {
        border-color: var(--color-brand) !important;
        border-width: 2px !important;
        background: var(--color-surface) !important;
        box-shadow: 0 0 0 1px rgba(var(--sf-brand-rgb), 0.06) !important;
    }

    #product .add-to-cart-form .product-qty-options .label-qty {
        display: contents !important;
        flex: unset !important;
        opacity: 1 !important;
        font-weight: 500 !important;
        order: unset !important;
    }

    #product .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio:checked) .label-qty {
        font-weight: 600 !important;
    }

    #product .add-to-cart-form .product-qty-options .qty-row-left {
        grid-column: 1;
        grid-row: 1;
        width: 28px;
        justify-self: center;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
    }

    #product .add-to-cart-form .product-qty-options .qty-row-center {
        grid-column: 2;
        grid-row: 1;
        font-size: 13px;
        font-weight: 600;
        line-height: 1.2;
        color: var(--color-ink);
        justify-self: start;
        min-width: 0;
    }

    #product .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio:checked) .qty-row-center {
        color: var(--color-brand-hover);
        font-weight: 700;
    }

    #product .add-to-cart-form .product-qty-options .label-qty .radio-primary {
        width: 15px !important;
        height: 15px !important;
        min-width: 15px;
        min-height: 15px;
        padding: 0 !important;
        margin: 0;
        border-radius: 50% !important;
        border: 1.5px solid var(--color-border) !important;
        background: var(--color-surface) !important;
        box-sizing: border-box;
        position: relative;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
    }

    #product .add-to-cart-form .product-qty-options .label-qty .radio-primary .icon-checkmark {
        display: none !important;
    }

    #product .add-to-cart-form .product-qty-options .qty-radio:checked + .label-qty .radio-primary,
    #product .add-to-cart-form .product-qty-options input:checked + .label-qty .radio-primary {
        border-color: var(--color-brand) !important;
        border-width: 2px !important;
        background: var(--color-surface) !important;
        box-shadow: none !important;
        color: transparent !important;
    }

    #product .add-to-cart-form .product-qty-options .qty-radio:checked + .label-qty .radio-primary::after,
    #product .add-to-cart-form .product-qty-options input:checked + .label-qty .radio-primary::after {
        content: '';
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: var(--color-brand);
        pointer-events: none;
    }

    #product .add-to-cart-form .product-qty-options .qty-price {
        display: contents !important;
        margin-left: 0 !important;
        text-align: unset;
        order: unset !important;
    }

    #product .add-to-cart-form .product-qty-options .qty-price .raw-ea-price {
        grid-column: 3;
        grid-row: 1;
        display: inline !important;
        justify-self: start;
        align-self: center;
        font-size: 11px !important;
        font-weight: 500 !important;
        line-height: 1.2 !important;
        color: var(--color-ink-muted) !important;
        opacity: 1 !important;
    }

    #product .add-to-cart-form .product-qty-options .qty-price .raw-ea-price::after {
        content: ' ea';
        font-weight: 500;
        color: inherit;
    }

    #product .add-to-cart-form .product-qty-options .qty-price > small.qty-econ-badge,
    #product .add-to-cart-form .product-qty-options .qty-price > small.text-muted.qty-econ-badge {
        grid-column: 4;
        grid-row: 1;
        justify-self: center;
        margin: 0 !important;
        padding: 3px 8px !important;
        font-size: 10px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        letter-spacing: 0.02em;
        border-radius: 999px !important;
        white-space: nowrap;
        opacity: 1 !important;
    }

    #product .add-to-cart-form .product-qty-options .qty-econ-badge--base {
        color: var(--color-surface) !important;
        background: var(--color-ink-muted) !important;
    }

    #product .add-to-cart-form .product-qty-options .qty-econ-badge--save {
        color: var(--color-surface) !important;
        background: var(--color-brand) !important;
    }

    #product .add-to-cart-form .product-qty-options .qty-price .raw-price {
        grid-column: 5;
        grid-row: 1;
        justify-self: center;
        align-self: center;
        text-align: right;
        font-size: 13px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        color: var(--color-ink) !important;
        font-variant-numeric: tabular-nums;
    }

    #product .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio:checked) .qty-price .raw-price {
        color: var(--color-brand-hover) !important;
    }

    #product .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio:checked) .qty-price .raw-ea-price {
        color: var(--color-brand-hover) !important;
    }

    #product .add-to-cart-form .product-qty-options .qty-option #qty-custom-input:not(.d-none) {
        grid-column: 1 / -1;
        grid-row: 2;
        width: 100%;
        max-width: 8rem;
        margin-top: 2px !important;
        justify-self: start;
        border-radius: 9px;
        border: 1px solid rgba(0, 0, 0, 0.1);
        padding: 7px 11px;
        font-size: 13px;
        font-weight: 600;
        text-align: center;
    }

    #product .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) {
        border-color: var(--color-brand) !important;
        border-width: 2px !important;
        background: var(--color-surface) !important;
    }

    #product[data-sticker-min-qty="25"] .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) {
        grid-template-columns: minmax(94px, 112px) 1fr !important;
        row-gap: 2px !important;
        column-gap: 14px !important;
        padding: 11px 16px !important;
        border: 1.5px solid #E8711A !important;
        border-radius: 10px !important;
    }

    #product[data-sticker-min-qty="25"] .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-row-left,
    #product[data-sticker-min-qty="25"] .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .label-qty .radio-primary {
        display: none !important;
    }

    #product[data-sticker-min-qty="25"] .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .label-qty {
        display: contents !important;
    }

    #product[data-sticker-min-qty="25"] .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-row-center {
        grid-column: 1 !important;
        grid-row: 2 !important;
        align-items: flex-start !important;
    }

    #product[data-sticker-min-qty="25"] .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) #qty-custom-text {
        display: none !important;
    }

    #product[data-sticker-min-qty="25"] .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-custom-active-label {
        display: inline-block !important;
        font-size: 12px !important;
        color: #E8711A !important;
        opacity: 0.85;
        font-weight: 500 !important;
        line-height: 1.2 !important;
    }

    #product[data-sticker-min-qty="25"] .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) #qty-custom-input:not(.d-none) {
        grid-column: 1 !important;
        grid-row: 1 !important;
        width: 80px !important;
        max-width: 80px !important;
        margin-top: 0 !important;
        border: 1px solid rgba(232, 113, 26, 0.4) !important;
        border-radius: 6px !important;
        padding: 5px 10px !important;
        background: #FFF7F0 !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        color: #1a2e1a !important;
        text-align: left !important;
    }

    #product[data-sticker-min-qty="25"] .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) #qty-custom-input:focus {
        border-color: #E8711A !important;
        background: #FFF !important;
        box-shadow: 0 0 0 2px rgba(232, 113, 26, 0.15) !important;
        outline: none !important;
    }

    #product[data-sticker-min-qty="25"] .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-price {
        grid-column: 2 !important;
        grid-row: 1 / span 2 !important;
        display: inline-flex !important;
        flex-direction: column !important;
        align-items: flex-end !important;
        gap: 1px !important;
    }

    #product[data-sticker-min-qty="25"] .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-price .raw-price {
        font-size: 13px !important;
        font-weight: 700 !important;
        color: #E8711A !important;
        line-height: 1.2 !important;
    }

    #product[data-sticker-min-qty="25"] .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-price .raw-ea-price {
        grid-column: auto !important;
        grid-row: auto !important;
        justify-self: auto !important;
        color: rgba(30, 37, 48, 0.55) !important;
        opacity: 1 !important;
    }

    #product[data-sticker-min-qty="25"] .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-price > small.text-muted {
        font-size: 12px !important;
        color: rgba(30, 37, 48, 0.55) !important;
        opacity: 1 !important;
    }

    #product[data-sticker-min-qty="25"] .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) #qty-custom-input.is-invalid-min {
        border-color: #D35454 !important;
        background: #FFF5F5 !important;
        box-shadow: 0 0 0 2px rgba(211, 84, 84, 0.14) !important;
    }

    #product[data-sticker-min-qty="25"] .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) .qty-custom-min-hint {
        grid-column: 1 !important;
        grid-row: 2 !important;
        margin-top: 12px;
    }

    #product[data-sticker-min-qty="25"] .add-to-cart-form .product-qty-options .qty-option:has(.qty-radio[value="custom"]:checked) #qty-custom-input.is-invalid-min + .qty-custom-min-hint {
        display: inline-block !important;
    }

    #product .add-to-cart-form .product-qty-savings-nudge {
        align-items: center;
        gap: 7px;
        margin-top: 10px;
        padding: 8px 12px;
        background: #ecf8f0;
        border: 1px solid #c5e6d4;
        border-radius: 9px;
        font-size: 11px;
        font-weight: 600;
        line-height: 1.4;
        color: #1f7a4d;
    }

    #product .add-to-cart-form .product-qty-savings-nudge.product-qty-savings-nudge--inactive {
        display: none !important;
    }

    #product .add-to-cart-form .product-qty-savings-nudge__dot {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #2d9e5f;
        flex-shrink: 0;
    }

    #product .add-to-cart-form .product-qty-savings-nudge__text {
        flex: 1;
        min-width: 0;
    }
}

/* Custom stickers — Rectangle: extra presets hidden via JS (.cs-rect-hidden); wins over .show() / flex */
.add-to-cart-form .product-size .product-size-options .product-size-label.cs-rect-hidden,
.add-to-cart-form .product-size .product-size-options input.size-radio.cs-rect-hidden {
    display: none !important;
}

/* Homepage trust strip (replaces Why Choose Us) */
/* ===== TRUST STRIP — clean rewrite ===== */
.ts-strip {
    background: var(--color-surface);
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
    padding: 0.625rem 0;
}
.ts-row {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
}
.ts-item {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0 1.1rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--color-ink-soft);
    white-space: nowrap;
    flex-shrink: 0;
}
.ts-item + .ts-item {
    border-left: 1px solid var(--color-border);
}
.ts-item svg {
    color: var(--color-brand);
    flex-shrink: 0;
}
/* Desktop-only elements: hidden on mobile */
.ts-desktop-only {
    display: none;
}
@media (min-width: 768px) {
    .ts-desktop-only {
        display: inline;
    }
    .ts-item.ts-desktop-only {
        display: flex;
    }
}
/* Mobile adjustments */
@media (max-width: 767.98px) {
    .ts-item {
        font-size: 0.75rem;
        padding: 0 0.75rem;
    }
}


/* ============================================================
   Homepage reviews — photo wall + quote cards (Variant B final)
   12 square photo tiles (2×6 desktop) open a lightbox with the full review.
   3 quote cards sit below. All tokens scoped to .hp-reviews — safe to drop in.
   ============================================================ */
.hp-reviews {
  --hpr-brand: #E8581A;
  --hpr-brand-2: #e8711a;
  --hpr-ink: #1a2e1a;
  --hpr-ink-2: #3d4d3d;
  --hpr-ink-3: #5f5e5a;
  --hpr-ink-4: #888780;
  --hpr-page: #fbf8f1;
  --hpr-surface: #ffffff;
  --hpr-border: #ece8e0;
  --hpr-border-soft: #f5f1e8;
  --hpr-green: #4A7C3A;

  padding: 44px 24px 48px;
  background: var(--hpr-page);
  color: var(--hpr-ink);
}
.hp-reviews__wrap { max-width: 1320px; margin: 0 auto; }

.hp-reviews .hpr-head { text-align: center; margin-bottom: 40px; }
.hp-reviews .hpr-head__eyebrow {
  font-size: 11px; font-weight: 700; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--hpr-ink-3); margin-bottom: 14px;
}
.hp-reviews .hpr-head__title {
  font-size: 36px; font-weight: 600; margin: 0 0 14px;
  letter-spacing: -0.7px; color: var(--hpr-ink); line-height: 1.2;
}
.hp-reviews .hpr-head__title em { font-style: normal; color: var(--hpr-brand); font-weight: 600; }
.hp-reviews .hpr-head__sub {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 14px; color: var(--hpr-ink-3);
  flex-wrap: wrap; justify-content: center;
}
.hp-reviews .hpr-head__sub .stars { color: var(--hpr-brand-2); letter-spacing: 2.5px; font-size: 16px; line-height: 1; }
.hp-reviews .hpr-head__sub b { color: var(--hpr-brand); font-weight: 700; }
.hp-reviews .hpr-head__sub .dot { width: 3px; height: 3px; border-radius: 50%; background: var(--hpr-ink-4); display: inline-block; margin: 0 2px; }

.hp-reviews .hpr-wall {
  display: grid; grid-template-columns: repeat(6, 1fr);
  gap: 10px; margin-bottom: 48px;
}
.hp-reviews .hpr-tile {
  aspect-ratio: 1; border-radius: 12px; overflow: hidden;
  background: var(--hpr-border-soft); cursor: zoom-in; position: relative;
  transition: transform .25s, box-shadow .25s;
}
.hp-reviews .hpr-tile:hover { transform: translateY(-3px); box-shadow: 0 14px 28px -18px rgba(26,46,26,.25); }
.hp-reviews .hpr-tile:focus-visible { outline: 2px solid var(--hpr-brand); outline-offset: 3px; }
.hp-reviews .hpr-tile img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s; }
.hp-reviews .hpr-tile:hover img { transform: scale(1.05); }
.hp-reviews .hpr-tile::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 55%, rgba(0,0,0,.5));
  opacity: 0; transition: opacity .2s; pointer-events: none;
}
.hp-reviews .hpr-tile:hover::after { opacity: 1; }
.hp-reviews .hpr-tile__star {
  position: absolute; top: 10px; right: 10px;
  color: #fff; background: rgba(0,0,0,.42);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  font-size: 11px; padding: 4px 9px; border-radius: 99px;
  font-weight: 700; letter-spacing: 0.5px; z-index: 2;
}
.hp-reviews .hpr-tile__hint {
  position: absolute; left: 12px; right: 12px; bottom: 12px;
  color: #fff; font-size: 11px; font-weight: 700;
  letter-spacing: 0.5px; text-transform: uppercase;
  opacity: 0; transform: translateY(4px);
  transition: opacity .2s, transform .2s;
  pointer-events: none; z-index: 2;
}
.hp-reviews .hpr-tile:hover .hpr-tile__hint { opacity: 1; transform: translateY(0); }
/* No-JS fallback: tiles 13+ hidden (kept so search engines still see first batch) */
.hp-reviews .hpr-tile--more { display: none; }
/* With JS: visibility is controlled tile-by-tile via .is-visible (progressive pagination) */
.hp-reviews .hpr-wall.is-js .hpr-tile { display: none; }
.hp-reviews .hpr-wall.is-js .hpr-tile.is-visible { display: block; animation: hpr-tile-in .28s ease-out both; }
@keyframes hpr-tile-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.hp-reviews .hpr-quotes {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 20px; margin-bottom: 28px;
}
.hp-reviews .hpr-quote {
  background: var(--hpr-surface); border: 1px solid var(--hpr-border);
  border-radius: 16px; padding: 30px 28px 24px;
  position: relative; display: flex; flex-direction: column;
  transition: border-color .2s, transform .2s, box-shadow .2s, opacity .14s ease;
}
/* Fade-swap during desktop rotation on Show more click. */
.hp-reviews .hpr-quote.is-swapping { opacity: 0; }
.hp-reviews .hpr-quote:hover {
  border-color: rgba(232,88,26,.28);
  transform: translateY(-2px);
  box-shadow: 0 14px 28px -18px rgba(26,46,26,.2);
}
.hp-reviews .hpr-quote__mark {
  position: absolute; top: 18px; right: 22px;
  width: 34px; height: 34px; color: var(--hpr-brand);
  opacity: .12; pointer-events: none;
}
.hp-reviews .hpr-quote__stars {
  color: var(--hpr-brand-2); font-size: 13px;
  letter-spacing: 1.8px; line-height: 1;
  margin-bottom: 14px; position: relative; z-index: 1;
}
.hp-reviews .hpr-quote__stars .is-empty { opacity: .28; }
.hp-reviews .hpr-quote__text {
  font-size: 15.5px; line-height: 1.6; color: var(--hpr-ink);
  margin: 0 0 22px; font-weight: 500;
  position: relative; z-index: 1; flex: 1;
  display: -webkit-box; -webkit-line-clamp: 6;
  -webkit-box-orient: vertical; overflow: hidden;
}
.hp-reviews .hpr-quote__foot {
  display: flex; align-items: center; justify-content: space-between;
  padding-top: 14px; border-top: 1px solid var(--hpr-border-soft);
  font-size: 11.5px; font-weight: 700; color: var(--hpr-ink-2);
  letter-spacing: 0.6px; text-transform: uppercase;
}
.hp-reviews .hpr-quote__author { display: inline-flex; align-items: center; gap: 6px; }
.hp-reviews .hpr-check { width: 11px; height: 11px; flex: 0 0 11px; }
.hp-reviews .hpr-quote__date { color: var(--hpr-ink-4); font-weight: 600; font-size: 11px; }

.hp-reviews .hpr-cta { text-align: center; }
/* Target .hpr-cta__toggle directly so styles apply to both <a> and <button>. */
.hp-reviews .hpr-cta .hpr-cta__toggle {
  display: inline-flex; align-items: center; gap: 10px;
  color: var(--hpr-ink); font-size: 14px; font-weight: 700;
  letter-spacing: 0.3px; text-decoration: none;
  padding: 14px 30px; border-radius: 999px;
  border: 1.5px solid var(--hpr-ink); background: transparent;
  font-family: inherit; line-height: 1.2;
  cursor: pointer; appearance: none; -webkit-appearance: none;
  transition: background-color .2s, color .2s;
}
.hp-reviews .hpr-cta .hpr-cta__toggle:hover,
.hp-reviews .hpr-cta .hpr-cta__toggle:focus-visible { background: var(--hpr-ink); color: #fff; }
.hp-reviews .hpr-cta .hpr-cta__toggle:focus { outline: none; }
.hp-reviews .hpr-cta .hpr-cta__toggle:focus-visible { outline: 2px solid var(--hpr-ink); outline-offset: 3px; }
.hp-reviews .hpr-cta .hpr-cta__toggle svg { width: 14px; height: 14px; transition: transform .2s; }
.hp-reviews .hpr-cta .hpr-cta__toggle:hover svg { transform: translateX(2px); }
/* Show-less state: rotate arrow 180° (down→up) to telegraph collapse */
.hp-reviews .hpr-cta.is-collapsing .hpr-cta__toggle svg { transform: rotate(-90deg); }
.hp-reviews .hpr-cta.is-collapsing .hpr-cta__toggle:hover svg { transform: rotate(-90deg) translateX(2px); }
/* Mobile-only CTA is hidden on desktop — used when all photo tiles already fit */
.hp-reviews .hpr-cta--mobile-only { display: none; }
@media (max-width: 760px) { .hp-reviews .hpr-cta--mobile-only { display: block; } }

/* Lightbox lives outside .hp-reviews — styles are intentionally top-level. */
.hpr-lb {
  position: fixed; inset: 0; background: rgba(0,0,0,.9);
  display: none; align-items: center; justify-content: center;
  z-index: 9999; padding: 40px 20px; cursor: zoom-out;
}
.hpr-lb.is-open { display: flex; }
.hpr-lb__inner {
  max-width: 620px; width: 100%;
  display: flex; flex-direction: column; align-items: center;
  gap: 18px; cursor: default;
}
.hpr-lb img { max-width: 100%; max-height: 62vh; border-radius: 12px; display: block; }
.hpr-lb__card {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 12px; padding: 20px 24px;
  color: #fff; width: 100%; text-align: center;
}
.hpr-lb__stars { color: #e8711a; font-size: 14px; letter-spacing: 2px; margin-bottom: 10px; }
.hpr-lb__quote { font-size: 15px; line-height: 1.6; color: rgba(255,255,255,.92); font-weight: 400; margin: 0 0 14px; }
.hpr-lb__who {
  font-size: 11px; font-weight: 700; letter-spacing: 0.8px;
  text-transform: uppercase; color: rgba(255,255,255,.7);
  display: inline-flex; align-items: center; gap: 8px;
  flex-wrap: wrap; justify-content: center;
}
.hpr-lb__who .dot { width: 3px; height: 3px; border-radius: 50%; background: rgba(255,255,255,.35); }

/* Product attribution chip inside the review lightbox.
   "Ambient" pill — no border, subtle background, product thumb + name + arrow.
   Clickable when product is active; static (non-interactive) when inactive. */
.hpr-lb__product {
  display: inline-flex; align-items: center; gap: 10px;
  margin-top: 14px; padding: 6px 14px 6px 6px;
  border-radius: 999px;
  background: rgba(255,255,255,.05);
  border: 0;
  color: #fff; text-decoration: none;
  max-width: 100%;
  transition: background-color .2s ease, transform .2s ease;
}
.hpr-lb__product[hidden] { display: none; }
.hpr-lb__product:hover {
  background: rgba(255,255,255,.1);
  color: #fff;
}
.hpr-lb__product:hover .hpr-lb__product-arrow { transform: translateX(3px); }
.hpr-lb__product.is-static { cursor: default; }
.hpr-lb__product.is-static:hover { background: rgba(255,255,255,.05); }
.hpr-lb__product.is-static .hpr-lb__product-arrow { display: none; }
.hpr-lb__product-thumb {
  flex: 0 0 auto;
  width: 32px; height: 32px; border-radius: 999px;
  background: rgba(255,255,255,.08) center/cover no-repeat;
}
.hpr-lb__product-thumb.has-img { background-color: #fff; }
/* SVG product icons (transparent bg, padded artwork) need "contain" sizing
   on a white disc — otherwise "cover" crops the artwork into a colored blob. */
.hpr-lb__product-thumb.is-svg {
  background-color: #fff;
  background-size: 72%;
  background-position: center;
  background-repeat: no-repeat;
}
.hpr-lb__product-name {
  font-size: 14px; font-weight: 600; color: #fff;
  letter-spacing: -0.1px; line-height: 1.2;
  max-width: 280px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.hpr-lb__product-arrow {
  flex: 0 0 auto;
  width: 16px; height: 16px; margin-left: 2px;
  color: rgba(255,255,255,.7);
  transition: transform .2s ease;
}
@media (max-width: 520px) {
  .hpr-lb__product { margin-top: 12px; padding: 5px 12px 5px 5px; gap: 8px; }
  .hpr-lb__product-thumb { width: 28px; height: 28px; }
  .hpr-lb__product-thumb.is-svg { background-size: 74%; }
  .hpr-lb__product-name { font-size: 13px; max-width: 180px; }
}
.hpr-lb__close {
  position: absolute; top: 24px; right: 24px;
  width: 44px; height: 44px; border-radius: 50%;
  background: rgba(255,255,255,.1); border: none; color: #fff;
  font-size: 26px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .15s;
}
.hpr-lb__close:hover { background: rgba(255,255,255,.18); }

@media (max-width: 1100px) {
  .hp-reviews .hpr-wall { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 760px) {
  .hp-reviews { padding: 32px 22px 36px; }
  .hp-reviews .hpr-head__title { font-size: 26px; letter-spacing: -0.4px; }
  .hp-reviews .hpr-head__sub { font-size: 13px; }
  /* Softer tile treatment on mobile — more breathing room, gentler borders,
     slight desaturation so product photos don't shout. No hover transforms on touch. */
  .hp-reviews .hpr-wall { grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 36px; }
  .hp-reviews .hpr-tile {
    border-radius: 14px;
    border: 1px solid rgba(26, 46, 26, 0.06);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35), 0 2px 6px -4px rgba(26, 46, 26, 0.12);
  }
  .hp-reviews .hpr-tile img { filter: saturate(0.96); }
  .hp-reviews .hpr-tile:hover { transform: none; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35), 0 2px 6px -4px rgba(26, 46, 26, 0.12); }
  .hp-reviews .hpr-tile:hover img { transform: none; }
  .hp-reviews .hpr-tile:active { transform: scale(0.98); transition: transform .12s; }
  .hp-reviews .hpr-tile__star { font-size: 10px; padding: 3px 7px; top: 8px; right: 8px; }
  /* Mobile reviews — list rows (no cards), 2026 density-first pattern.
     Saves ~100px per item vs. card layout, fits ~5 reviews in same scroll. */
  .hp-reviews .hpr-quotes {
    grid-template-columns: 1fr;
    gap: 0;
    margin-bottom: 22px;
  }
  .hp-reviews .hpr-quote {
    background: transparent;
    border: 0;
    border-top: 1px solid rgba(26, 46, 26, 0.08);
    border-radius: 0;
    padding: 14px 0;
    transition: none;
  }
  .hp-reviews .hpr-quote:first-child { border-top: 0; padding-top: 4px; }
  .hp-reviews .hpr-quote:last-child  { padding-bottom: 4px; }
  .hp-reviews .hpr-quote:hover {
    border-color: rgba(26, 46, 26, 0.08);
    transform: none; box-shadow: none;
  }
  .hp-reviews .hpr-quote__mark { display: none; }
  .hp-reviews .hpr-quote__stars {
    font-size: 13px; letter-spacing: 1.2px;
    margin-bottom: 6px;
  }
  .hp-reviews .hpr-quote__text {
    font-size: 14.5px; line-height: 1.45;
    margin: 0 0 6px; font-weight: 500;
    -webkit-line-clamp: 4;
  }
  .hp-reviews .hpr-quote__foot {
    padding-top: 0; border-top: 0;
    justify-content: flex-start; gap: 6px;
    font-size: 11px; letter-spacing: 0.4px;
    color: var(--hpr-ink-3);
  }
  .hp-reviews .hpr-quote__author { gap: 5px; }
  .hp-reviews .hpr-quote__foot::after {
    content: none;
  }
  /* visual separator "·" between author and date */
  .hp-reviews .hpr-quote__date::before {
    content: "·"; margin-right: 6px; opacity: .5;
  }
  .hp-reviews .hpr-quote__date {
    font-size: 11px; font-weight: 600;
  }
}
@media (max-width: 420px) {
  .hp-reviews .hpr-wall { grid-template-columns: repeat(2, 1fr); }
  .hp-reviews .hpr-head__title { font-size: 22px; }
}

/* Home: normalize visual size of new product-card SVGs to match Custom Stickers scale */
.product-card-thumb-img[src*="/Poster.svg"],
.product-card-thumb-img[src*="/StaticCling.svg"] {
    padding: 10% 12%;
    box-sizing: border-box;
}
/* Holographic: квадратный viewBox — нужен меньший padding чтобы не выглядел мельче других */
.product-card-thumb-img[src*="/Holographic.svg"] {
    padding: 6% 8%;
    box-sizing: border-box;
}


/* ═══════════════════════════════════════════════════════════
   Desktop CTA redesign — full-orange unified button (≥1024px)
   Only visual CSS — no HTML, no JS, no calculator touched
   ═══════════════════════════════════════════════════════════ */
@media (min-width: 1024px) {

  /* Card wrapper */
  #product .add-to-cart-form .ux-cart-integrated--v3.product-add-card {
    position: relative !important;
    margin-bottom: 28px !important;
  }

  /* Pill → rounded rect, solid brand orange */
  #product .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__btn {
    height: 60px !important;
    min-height: 60px !important;
    max-height: 60px !important;
    border-radius: 12px !important;
    background: var(--color-brand) !important;
    box-shadow: 0 4px 14px rgba(232, 88, 26, 0.28) !important;
    border: none !important;
    transition: background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease !important;
  }

  #product .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__btn:hover {
    background: var(--color-brand-hover) !important;
    box-shadow: 0 6px 18px rgba(232, 88, 26, 0.4) !important;
    transform: translateY(-1px) !important;
  }

  #product .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__btn:active {
    transform: translateY(0) scale(0.99) !important;
    box-shadow: 0 2px 6px rgba(232, 88, 26, 0.25) !important;
  }

  /* Left CTA: transparent, inherits orange from pill */
  #product .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__cta {
    background: transparent !important;
  }

  #product .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__left {
    background: transparent !important;
  }

  #product .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__text {
    color: #fff !important;
    font-size: 17px !important;
    font-weight: 600 !important;
  }

  /* Right panel: transparent bg, white separator */
  #product .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__right {
    background: transparent !important;
    border-left: 1px solid rgba(255, 255, 255, 0.3) !important;
  }

  /* Pending state: orange, white helper text */
  #product .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__right--pending {
    background: transparent !important;
  }

  #product .add-to-cart-form .ux-cart-integrated--v3 .product-add-card__helper {
    color: rgba(255, 255, 255, 0.92) !important;
  }

  /* Price: white on orange */
  #product .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__right .product-add-card__price {
    color: #fff !important;
    font-size: 20px !important;
  }

  /* Meta (per-unit label): soft white */
  #product .add-to-cart-form .ux-cart-integrated--v3 .ux-cart-integrated__right .product-add-card__meta {
    color: rgba(255, 255, 255, 0.88) !important;
  }

  /* Trust line below button — no HTML change */
  #product .add-to-cart-form .ux-cart-integrated--v3.product-add-card::after {
    content: "\2713 We won\0027t print a single sticker until you approve the proof";
    display: block;
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    color: #16a34a;
    margin-top: 10px;
    letter-spacing: 0.01em;
  }
}

/* ═══════════════════════════════════════════════════════════
   Qty “More quantities” — pill form aligned with quantity tiles
   ═══════════════════════════════════════════════════════════ */

.add-to-cart-form .more-quantities-toggle {
  width: 100%;
  background: transparent;
  border: 1px dashed #D9CFC0;
  border-radius: 999px;
  padding: 14px 18px;
  margin-top: 0;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  cursor: pointer;
  transition: all 0.15s ease;
  font-family: inherit;
}
.add-to-cart-form .more-quantities-toggle:hover,
.add-to-cart-form .more-quantities-toggle:focus-visible {
  background: #FDF4EC;
  border-color: #E8B88A;
  border-style: solid;
}
.add-to-cart-form .more-quantities-toggle:active { transform: scale(0.99); }

.add-to-cart-form .mq-label {
  color: #5F5E5A;
  font-size: 13px;
  font-weight: 400;
  white-space: nowrap;
}
.add-to-cart-form .mq-chips {
  display: flex;
  gap: 6px;
  align-items: center;
  transition: opacity 0.2s ease;
}
.add-to-cart-form .mq-chip {
  background: #EEEBE3;
  color: #E8711A;
  border: none;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
}
.add-to-cart-form .mq-chevron {
  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  flex-shrink: 0;
  stroke: #888780;
  margin-left: 4px;
}
.add-to-cart-form .more-quantities-toggle[aria-expanded="true"] .mq-chevron {
  transform: rotate(180deg);
}

.add-to-cart-form .more-quantities-toggle[aria-expanded="true"] {
  display: none;
}
@media (max-width: 991.98px) {

.add-to-cart-form #qty-extra-tiles {
  display: flex !important;
  flex-direction: column;
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.25s ease;
}

.add-to-cart-form #qty-extra-tiles.is-open {
  max-height: 600px;
  opacity: 1;
}
}

.add-to-cart-form .qty-show-less {
  width: 100%;
  background: transparent;
  border: none;
  padding: 14px 0 4px;
  margin-top: 2px;
  color: #6b6b6b;
  font-size: 13px;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  transition: color 0.15s ease;
}

.add-to-cart-form .qty-show-less:hover,
.add-to-cart-form .qty-show-less:focus-visible {
  color: #1a2e1a;
}

.add-to-cart-form .qty-show-less:focus-visible {
  outline: 2px solid #E8711A;
  outline-offset: 2px;
  border-radius: 6px;
}

/* Custom stickers: trust strip inside quantity card (premium hierarchy + alignment) */
.add-to-cart-form .qty-trust-divider {
  height: 1px;
  background: #eeebe3;
  margin: 12px 0;
}
.add-to-cart-form .trust-strip {
  padding: 0 4px;
  display: flex;
  flex-direction: column;
}
.add-to-cart-form .trust-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px 20px;
  margin-bottom: 14px;
}
.add-to-cart-form .trust-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.add-to-cart-form .trust-item svg,
.add-to-cart-form .trust-guarantee svg {
  color: #1a2e1a;
  opacity: 0.85;
  flex-shrink: 0;
  margin-top: 1px;
}
.add-to-cart-form .trust-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.add-to-cart-form .trust-title {
  color: #1a2e1a;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: -0.1px;
  line-height: 1.2;
}
.add-to-cart-form .trust-sub {
  color: #888780;
  font-size: 11px;
  line-height: 1.3;
}
.add-to-cart-form .trust-guarantee {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding-top: 12px;
  border-top: 1px solid #f5f1e8;
}
.add-to-cart-form .trust-text-center {
  align-items: center;
  text-align: center;
  gap: 1px;
}
@media (max-width: 340px) {
  .add-to-cart-form .trust-grid {
    grid-template-columns: 1fr;
  }
}

/* Mobile: toggle in document flow inside quantity card */
@media (max-width: 767px) {
  .add-to-cart-form .product-qty-more__reveal {
    position: static !important;
    min-height: 0 !important;
    padding: 0 !important;
    pointer-events: auto !important;
    display: block !important;
  }
}

/* Starter sub-label: center-align JS-added text under $19.00 price (mobile only) */
@media (max-width: 991.98px) {
  .add-to-cart-form .qty-option-min-dynamic .qty-price > small.text-muted {
    align-self: center;
  }
}

/* FINAL custom qty tile states */
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) {
  background: #FBF7EE !important;
  border-radius: 10px !important;
  padding: 14px 16px !important;
  margin-bottom: 6px !important;
  min-height: 62px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer;
  border: 1.5px solid transparent !important;
  transition: border-color 0.15s ease, background 0.15s ease;
  box-sizing: border-box;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)):hover {
  border-color: rgba(232, 113, 26, 0.35) !important;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-row-left,
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-price,
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) #qty-custom-input,
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-tile__suffix {
  display: none !important;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-row-center {
  justify-content: center !important;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-tile__custom-label {
  font-size: 15px !important;
  font-weight: 500 !important;
  color: #1a2e1a !important;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) {
  background: #FFF !important;
  border: 1.5px solid #E8711A !important;
  border-radius: 10px !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 11px 16px !important;
  margin-bottom: 6px !important;
  min-height: 56px;
  box-sizing: border-box;
  transition: border-color 0.15s ease;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-row-left,
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .label-qty .radio-primary,
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) #qty-custom-text,
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-tile__label {
  display: none !important;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .label-qty {
  display: none !important;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-tile__right {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 2px !important;
  margin-left: auto !important;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-custom-input {
  width: 74px !important;
  height: 34px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #1a2e1a !important;
  border: 1px solid rgba(232, 113, 26, 0.35) !important;
  border-radius: 6px !important;
  padding: 0 10px !important;
  background: #FFF7F0 !important;
  font-family: inherit !important;
  outline: none !important;
  box-sizing: border-box !important;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease !important;
  -moz-appearance: textfield;
  appearance: textfield;
  margin-right: 10px !important;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-custom-input::-webkit-outer-spin-button,
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-custom-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-custom-input:focus,
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-custom-input:focus-visible {
  border-color: #E8711A !important;
  background: #FFF !important;
  box-shadow: 0 0 0 3px rgba(232, 113, 26, 0.15) !important;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-custom-input:invalid {
  box-shadow: none !important;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-tile__suffix {
  display: inline-flex !important;
  align-items: center !important;
  font-size: 12px !important;
  color: #1a2e1a !important;
  opacity: 0.55 !important;
  line-height: 1 !important;
  margin-right: auto !important;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-tile__right .raw-price {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #E8711A !important;
  line-height: 1 !important;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-tile__right > small {
  font-size: 11px !important;
  color: #1a2e1a !important;
  opacity: 0.5 !important;
  font-weight: 400 !important;
  line-height: 1 !important;
}

#product .add-to-cart-form .product-qty-options .qty-custom-hint {
  font-size: 11px;
  color: #1a2e1a;
  padding: 5px 4px 0;
  line-height: 1.3;
  display: flex;
  align-items: center;
  gap: 5px;
}

#product .add-to-cart-form .product-qty-options .qty-custom-hint[hidden] {
  display: none;
}

#product .add-to-cart-form .product-qty-options .qty-custom-hint__icon {
  flex-shrink: 0;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom.is-active.has-error {
  border-color: #D4912A !important;
}

#product .add-to-cart-form .qty-custom-input.has-error {
  border-color: #D4912A !important;
  background: #FFF8EC !important;
}

#product .add-to-cart-form .qty-custom-input.has-error:focus,
#product .add-to-cart-form .qty-custom-input.has-error:focus-visible {
  border-color: #D4912A !important;
  box-shadow: 0 0 0 3px rgba(212, 145, 42, 0.15) !important;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom.is-active.has-error .qty-price .raw-price,
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom.is-active.has-error .qty-price > small {
  opacity: 0.3 !important;
  color: #1a2e1a !important;
}

#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom.is-active.has-error + .qty-custom-hint {
  color: #B8651A;
}

.btn-add-to-cart.is-disabled,
.btn-add-to-cart:disabled {
  background: #B8B8B8 !important;
  cursor: not-allowed;
  opacity: 0.7;
  pointer-events: auto;
}

.btn-add-to-cart.is-disabled:hover,
.btn-add-to-cart:disabled:hover {
  background: #B8B8B8 !important;
}

/* ============================================================
   Variant 1 — quiet desktop qty tiles
   Black prices, orange only on Save% pill + active border.
   Desktop only (>= 992px). Does NOT touch mobile or Custom qty.
   ============================================================ */
@media (min-width: 992px) {
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) {
    padding: 12px 18px !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    transition: border-color 0.14s ease, background 0.14s ease !important;
  }
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom):hover {
    border-color: rgba(232, 113, 26, 0.35) !important;
    background: var(--color-surface) !important;
  }
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom):has(.qty-radio:checked) {
    border: 1.5px solid #E8711A !important;
    background: rgba(232, 113, 26, 0.04) !important;
    box-shadow: none !important;
  }
  /* Center qty number — neutral, tabular-nums */
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) .qty-row-center {
    color: #1a2e1a !important;
    font-weight: 500 !important;
    font-variant-numeric: tabular-nums !important;
  }
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom):has(.qty-radio:checked) .qty-row-center {
    color: #1a2e1a !important;
    font-weight: 600 !important;
  }
  /* ea price — muted gray, tabular-nums */
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) .qty-price .raw-ea-price {
    color: #8a8a8a !important;
    font-weight: 500 !important;
    font-variant-numeric: tabular-nums !important;
  }
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom):has(.qty-radio:checked) .qty-price .raw-ea-price {
    color: #8a8a8a !important;
  }
  /* Total price — black, tabular-nums, no orange */
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) .qty-price .raw-price {
    color: #1a2e1a !important;
    font-weight: 600 !important;
    font-variant-numeric: tabular-nums !important;
  }
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom):has(.qty-radio:checked) .qty-price .raw-price {
    color: #1a2e1a !important;
    font-weight: 700 !important;
  }
  /* Save% pill — soft peach by default */
  #product .add-to-cart-form .product-qty-options .qty-econ-badge--save {
    background: #FEECE0 !important;
    color: #B8651A !important;
    font-weight: 600 !important;
  }
  /* Starter pill — neutral beige */
  #product .add-to-cart-form .product-qty-options .qty-econ-badge--base {
    background: #EAE6DF !important;
    color: #5a5652 !important;
    font-weight: 600 !important;
  }
  /* Radio circle — orange only when checked */
  #product .add-to-cart-form .product-qns .qty-option:not(.qty-tile--custom) .label-qty .radio-primary {
    border-color: rgba(0, 0, 0, 0.18) !important;
  }
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) .qty-radio:checked + .label-qty .radio-primary,
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) input:checked + .label-qty .radio-primary {
    border-color: #E8711A !important;
  }
}

/* ============================================================
   Variant 1 — polish pass v2 (flexible, narrow-safe)
   No fixed px widths. Grid uses fr + auto so prices never overflow.
   Below 1200px: hide ea price column, give more room to main fields.
   ============================================================ */
@media (min-width: 992px) {
  /* Row gap */
  #product .add-to-cart-form .product-qty-options,
  #product .add-to-cart-form .product-qty-more__list {
    gap: 7px !important;
  }
  /* Flexible grid: radio | qty | ea (flex) | save pill | price */
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) {
    grid-template-columns: auto auto 1fr auto auto !important;
    column-gap: 14px !important;
    padding: 13px 18px !important;
    align-items: center !important;
  }
  /* Radio 18px */
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) .label-qty .radio-primary {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    border-width: 1.5px !important;
  }
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) .qty-radio:checked + .label-qty .radio-primary::after,
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) input:checked + .label-qty .radio-primary::after {
    width: 8px !important;
    height: 8px !important;
  }
  /* ea price — tabular nums, sits in flex column, left-aligned */
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) .qty-price .raw-ea-price {
    justify-self: start !important;
  }
  /* Save% / Starter pill — compact, no min-width (flex layout) */
  #product .add-to-cart-form .product-qty-options .qty-price > small.qty-econ-badge,
  #product .add-to-cart-form .product-qty-options .qty-price > small.text-muted.qty-econ-badge {
    justify-self: end !important;
    padding: 4px 10px !important;
    font-size: 10.5px !important;
    font-weight: 600 !important;
    border-radius: 999px !important;
    letter-spacing: 0.01em !important;
    white-space: nowrap !important;
  }
  /* Price — right aligned, no min-width */
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) .qty-price .raw-price {
    justify-self: end !important;
    text-align: right !important;
    font-size: 14.5px !important;
    white-space: nowrap !important;
  }
  /* Active row — cleaner Starter on tinted bg */
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom):has(.qty-radio:checked) {
    background: rgba(232, 113, 26, 0.055) !important;
  }
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom):has(.qty-radio:checked) .qty-econ-badge--base {
    background: #FFF !important;
    color: #5a5652 !important;
    border: 1px solid rgba(0, 0, 0, 0.12) !important;
  }
  /* Hide mobile Show less on desktop */
  #product .add-to-cart-form #product-qty-show-less {
    display: none !important;
  }
}

/* Below 1200px (narrow panel area) — hide ea price to prevent squeeze */
@media (min-width: 992px) and (max-width: 1199.98px) {
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) .qty-price .raw-ea-price {
    display: none !important;
  }
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) {
    grid-template-columns: auto 1fr auto auto !important;
  }
}

/* ============================================================
   VARIANT A — Desktop Custom Qty Tile (Smart Entry)
   Dashed border closed → inline stepper open.
   Desktop only (≥ 992px). Mobile untouched.
   ============================================================ */

/* 1. Hide all new VA elements by default (mobile safe) */
.qty-tile__va-closed,
.qty-tile__va-open-hdr,
.qty-stepper-btn {
  display: none !important;
}

@media (min-width: 992px) {

  /* ---- CLOSED STATE — Variant A Quiet Row ---- */
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) {
    display: flex !important;
    align-items: stretch !important;
    background: #FAFAF7 !important;
    border: 1px solid rgba(0,0,0,.08) !important;
    border-radius: 12px !important;
    padding: 0 !important;
    cursor: pointer;
    transition: border-color .15s, background .15s;
    box-shadow: none !important;
  }
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)):hover {
    border-color: rgba(232,113,26,.35) !important;
    background: #FBF7EE !important;
    box-shadow: none !important;
  }

  /* Hide original elements in closed state */
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .label-qty,
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-row-left,
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-price,
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-tile__suffix,
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-tile__va-open-hdr,
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-stepper-btn {
    display: none !important;
  }

  /* Closed: grid matching other qty rows */
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-tile__va-closed {
    display: grid !important;
    grid-template-columns: 20px 52px 1fr auto auto;
    column-gap: 14px;
    align-items: center;
    width: 100%;
    padding: 11px 16px;
  }

  /* "More quantities" row: icon + title/subtitle + chevron only (3 children) — full middle column */
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-tile__va-closed:has(.qty-tile__va-body) {
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    column-gap: 14px;
    align-items: center;
  }

  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-tile__va-body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 4px;
    min-width: 0;
  }

  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-tile__va-title {
    font-size: 14px;
    font-weight: 600;
    color: #1a2e1a;
    line-height: 1.25;
  }

  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-tile__va-body .qty-tile__va-sub {
    font-size: 12.5px;
    font-weight: 500;
    color: #6b6b6b;
    line-height: 1.35;
  }

  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-tile__va-arrow {
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    color: #9a9a94;
  }

  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-tile__va-arrow svg {
    display: block;
  }

  /* Pencil icon — replacing radio circle */
  .qty-tile__va-icon {
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ccc;
    flex-shrink: 0;
    transition: color .15s;
  }
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)):hover .qty-tile__va-icon {
    color: #E8711A;
  }

  /* "Custom" label — same weight/size as qty numbers */
  .qty-tile__va-label {
    font-size: 14px;
    font-weight: 500;
    color: #1a2e1a;
  }

  /* "any amount" — same muted style as ea price */
  .qty-tile__va-sub {
    font-size: 12.5px;
    color: #bbb;
  }

  /* "enter qty →" pill — replaces Save% badge */
  .qty-tile__va-pill {
    font-size: 11px;
    font-weight: 600;
    color: #ccc;
    background: rgba(0,0,0,.04);
    border-radius: 20px;
    padding: 3px 9px;
    white-space: nowrap;
    transition: color .15s, background .15s;
  }
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)):hover .qty-tile__va-pill {
    color: #E8711A;
    background: rgba(232,113,26,.1);
  }

  /* "—" dash — replaces price column */
  .qty-tile__va-dash {
    font-size: 14px;
    color: #ddd;
    text-align: right;
  }

  /* ---- OPEN STATE ---- */
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    background: #fff !important;
    border: 1.5px solid #E8711A !important;
    border-radius: 12px !important;
    padding: 14px 18px !important;
    gap: 0 !important;
    box-shadow: 0 0 0 3px rgba(232,113,26,.10) !important;
  }

  /* Hide original label content in open state */
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .label-qty,
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-row-left,
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-tile__va-closed {
    display: none !important;
  }

  /* Show open-state header (CSS order puts it first as full-width row) */
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-tile__va-open-hdr {
    display: flex !important;
    align-items: center;
    gap: 7px;
    flex: 0 0 100%;
    order: -1;
    margin-bottom: 6px;
  }
  .qty-tile__va-open-label {
    font-size: 11px;
    font-weight: 700;
    color: #E8711A;
    text-transform: uppercase;
    letter-spacing: .06em;
  }

  /* CSS order for desktop open layout: [header row] [−][input][+] stickers   $price */
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-stepper-btn--minus {
    order: 1;
  }
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-custom-input {
    order: 2;
  }
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-stepper-btn--plus {
    order: 3;
  }
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-tile__suffix {
    order: 4;
  }
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-tile__right {
    order: 5;
  }

  /* Show stepper buttons */
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-stepper-btn {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 38px;
    background: #fafaf8;
    border: 1.5px solid #e2d9cc;
    cursor: pointer;
    font-size: 20px;
    font-weight: 300;
    color: #888;
    transition: background .15s, color .15s, border-color .15s;
    flex-shrink: 0;
    line-height: 1;
    padding: 0;
  }
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-stepper-btn:hover {
    background: rgba(232,113,26,.08);
    color: #E8711A;
    border-color: rgba(232,113,26,.4);
  }
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-stepper-btn--minus {
    border-radius: 9px 0 0 9px;
    border-right: none !important;
  }
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-stepper-btn--plus {
    border-radius: 0 9px 9px 0;
    border-left: none !important;
    margin-right: 10px !important;
  }

  /* Input — visual slot between stepper buttons (order:2 places it between − and +) */
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-custom-input:not(.d-none) {
    width: 58px !important;
    height: 38px !important;
    max-width: 58px !important;
    text-align: center !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #1a2e1a !important;
    border: 1.5px solid #e2d9cc !important;
    border-left: none !important;
    border-right: none !important;
    border-radius: 0 !important;
    background: #fafaf8 !important;
    outline: none !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    flex-shrink: 0 !important;
    display: inline-block !important;
    -moz-appearance: textfield;
    appearance: textfield;
  }
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-custom-input:not(.d-none)::-webkit-outer-spin-button,
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-custom-input:not(.d-none)::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-custom-input:not(.d-none):focus {
    border-color: #E8711A !important;
    border-left: none !important;
    border-right: none !important;
    background: #fff9f5 !important;
    outline: none !important;
    box-shadow: none !important;
  }

  /* "stickers" suffix */
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-tile__suffix {
    font-size: 13px !important;
    color: #888 !important;
    opacity: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    margin-top: 0 !important;
    flex: none !important;
    margin-right: auto !important;
  }

  /* Price — right side, large and bold */
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-tile__right {
    margin-left: 0 !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    gap: 2px !important;
    flex-shrink: 0 !important;
    display: flex !important;
  }
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-tile__right .raw-price {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #1a2e1a !important;
    line-height: 1 !important;
  }
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-tile__right > small {
    font-size: 11px !important;
    color: #888 !important;
    opacity: 1 !important;
    font-weight: 400 !important;
  }
}

/* ============================================================
   Variant 1 — final polish
   Stable columns (no dance), quiet header hint.
   ============================================================ */
@media (min-width: 992px) {
  /* Header hint "More = cheaper per sticker" — quiet muted style */
  #product .add-to-cart-form .product-qty-heading__hint {
    color: #8a8a8a !important;
    font-weight: 400 !important;
    font-size: 11.5px !important;
    letter-spacing: 0 !important;
  }
  /* Stable grid — fixed ch-based widths so columns don't dance */
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) {
    grid-template-columns: 18px 4ch 1fr 8ch 8ch !important;
    column-gap: 16px !important;
  }
  /* qty number — right-aligned within its fixed column */
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) .qty-row-center {
    justify-self: start !important;
    text-align: lortant;
  }
  /* ea price — left-aligned in flex column, fixed width to prevent jumping */
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) .qty-price .raw-ea-price {
    justify-self: start !important;
    text-align: left !important;
    min-width: 6ch !important;
  }
  /* Save% pill — fixed column width, centered inside */
  #product .add-to-cart-form .product-qty-options .qty-price > small.qty-econ-badge,
  #product .add-to-cart-form .product-qty-options .qty-price > small.text-muted.qty-econ-badge {
    justify-self: stretch !important;
    text-align: center !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  /* Price — right-aligned within fixed column */
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) .qty-price .raw-price {
    justify-self: end !important;
    text-align: right !important;
    min-width: 8ch !important;
  }
}

/* Below 1200px — 4 columns (hide ea), still stable */
@media (min-width: 992px) and (max-width: 1199.98px) {
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) {
    grid-template-columns: 18px 4ch 1fr 8ch !important;
  }
}

/* ============================================================
   Variant 1 — alignment & gap fixes
   Price column starts at same vertical position for all rows.
   Gap applied to tail container (200-1000) too.
   ============================================================ */
@media (min-width: 992px) {
  /* Gap for ALL qty containers including tail */
  #product .add-to-cart-form .product-qty-more__tail {
    display: flex !important;
    flex-direction: column !important;
    gap: 7px !important;
    margin-top: 7px !important;
  }
  /* Price column — wider min-width fits $260.00 with padding */
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) {
    grid-template-columns: 18px 4ch 1fr 8ch 9ch !important;
  }
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) .qty-price .raw-price {
    min-width: 9ch !important;
    display: inline-block !important;
  }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
  #product .add-to-cart-form .product-qty-options .qty-option:not(.qty-tile--custom) {
    grid-template-columns: 18px 4ch 1fr 8ch 9ch !important;
  }
}

/* iOS Safari: custom qty — 16px minimum (loads last on narrow viewports; :focus included so zoom cannot return on focus) */
@media (max-width: 991.98px) {
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-custom-input,
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) #qty-custom-input,
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-custom-input:focus,
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:has(.qty-radio:checked) .qty-custom-input:focus-visible {
    font-size: 16px !important;
  }
}

/* ============================================================
   Custom qty tile — CLOSED state "Variant A" field affordance.
   Unified mobile + desktop: the closed tile reads as an input
   (small caption + dashed "10+" field + "stickers", with a "—"
   price slot on the right), so it clearly invites typing a custom
   amount. OPEN state (:has(.qty-radio:checked)) is untouched.
   Appended last so it overrides the earlier closed-state rules at
   both breakpoints.
   ============================================================ */
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) {
  display: flex !important;
  align-items: center !important;
  justify-content: stretch !important;
  padding: 12px 16px !important;
}
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .label-qty,
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-tile__custom-label,
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-tile__va-open-hdr,
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-stepper-btn {
  display: none !important;
}
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-tile__va-closed {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  padding: 0 !important;
  grid-template-columns: none !important;
}
.qty-tile__va-main {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  min-width: 0;
}
.qty-tile__va-caption {
  font-size: 12px;
  font-weight: 500;
  color: #8a8780;
  line-height: 1.2;
}
.qty-tile__va-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.qty-tile__va-fauxinput {
  display: inline-flex;
  align-items: center;
  border: 1.5px dashed #E8711A;
  background: #FCF4EC;
  border-radius: 8px;
  padding: 5px 12px;
  transition: background 0.15s ease;
}
.qty-tile__va-ph {
  font-size: 15px;
  font-weight: 500;
  color: #C9874A;
  line-height: 1;
}
.qty-tile__va-unit {
  font-size: 13px;
  color: #8a8780;
}
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)) .qty-tile__va-dash {
  font-size: 15px;
  font-weight: 500;
  color: #b4b2a9;
  flex: none;
  text-align: right;
}
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--custom:not(:has(.qty-radio:checked)):hover .qty-tile__va-fauxinput {
  background: #FAE6D2;
}

/* ============================================================
   "Most Popular" quantity tile — single anchor on the 100 step.
   Soft highlight + badge on both breakpoints. On MOBILE the per-unit
   price is revealed ONLY on this tile (others stay compact) so the
   recommended card answers "how much per sticker" without clutter.
   Does NOT touch the selection (radio) state — purely additive.
   ============================================================ */
/* "Most Popular" badge — overhangs the top edge of the 100 row (like the
   original), but semi-transparent/soft AND with NO margin-top, so it sits in
   the existing inter-row gap and never shifts the row rhythm or changes height. */
#product .add-to-cart-form .product-qty-options .qty-option.qty-tile--popular {
  position: relative;
  overflow: visible !important;
}
.qty-popular-badge {
  position: absolute;
  top: -8px;
  left: 14px;
  z-index: 3;
  background: rgba(232, 88, 26, 0.12);
  color: #C2410C;
  border: 1px solid rgba(232, 88, 26, 0.35);
  font-size: 9.5px;
  font-weight: 500;
  letter-spacing: .3px;
  text-transform: uppercase;
  padding: 1px 8px;
  border-radius: 20px;
  white-space: nowrap;
  line-height: 1.5;
}
@media (max-width: 991.98px) {
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--popular .raw-ea-price {
    display: block !important;
    text-align: right;
    font-size: 12px;
    color: #1e7d4f;
    font-weight: 500;
  }
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--popular .raw-ea-price::before { content: "$"; }
  #product .add-to-cart-form .product-qty-options .qty-option.qty-tile--popular .raw-ea-price::after { content: " each"; }
}

/* ============================================================
   Trust block "Connected journey" — 4-step band on the PDP.
   Brand colors (panel = site dark green, circles = CTA orange) so
   it reads as native. Always one row of 4 (never wraps). Static.
   ============================================================ */
.sf-journey {
  max-width: 440px;
  margin: 0 auto;
  background: #fff;
  border: 0.5px solid rgba(0, 0, 0, .1);
  border-radius: 14px;
  padding: 16px 12px 12px;
}
.sf-journey__row {
  position: relative;
  display: flex;
  justify-content: space-between;
}
.sf-journey__line {
  position: absolute;
  left: 12%;
  right: 12%;
  top: 19px;
  height: 2px;
  background: linear-gradient(90deg, #E8581A, #F6A467);
  z-index: 0;
}
.sf-journey__step {
  position: relative;
  z-index: 1;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.sf-journey__circle {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #E8581A;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 3px 9px -2px rgba(232, 88, 26, .45);
  flex: none;
}
.sf-journey__circle svg {
  width: 21px;
  height: 21px;
  color: #fff;
}
.sf-journey__label {
  font-size: 10px;
  line-height: 1.3;
  color: #1a2e1a;
  font-weight: 500;
  text-align: center;
  margin-top: 6px;
}
@media (max-width: 360px) {
  .sf-journey { padding: 14px 10px 11px; }
  .sf-journey__circle { width: 36px; height: 36px; }
  .sf-journey__circle svg { width: 19px; height: 19px; }
  .sf-journey__label { font-size: 9.5px; }
  .sf-journey__line { top: 17px; }
}

/* ============================================================
   Custom-size field (desktop) — fix vertical alignment. The field was
   forced to 40px while it contains the W×H row + "Min size" hint
   (~49px), so the hint overflowed below the orange border and the row
   sat off-centre. Let the selected field grow to its content and flow
   normally (not absolute) so both lines sit centred inside the border.
   ============================================================ */
@media (min-width: 992px) {
  #product .add-to-cart-form .product-size-custom-group:has(> .size-radio:checked) {
    height: auto !important;
    min-height: 40px;
    max-height: none !important;
  }
  #product .add-to-cart-form .product-size-custom-group:has(> .size-radio:checked) #size-custom-input {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    height: auto !important;
    min-height: 40px;
    max-height: none !important;
    padding: 7px 12px !important;
    gap: 2px;
  }
  #product .add-to-cart-form .product-size-custom-group #size-custom-input .size-custom-min-hint {
    margin-top: 3px !important;
    text-align: center;
  }
}

/* ============================================================
   Compact mobile Shape + Finish (reuse the existing engine buttons;
   visual-only, ≤991px). Shape = icon segment-bar; Finish = inline
   ultra-minimal row. Desktop and the calculator JS are untouched.
   ============================================================ */
@media (max-width: 991.98px) {
  /* ---- STRIP the white panel wrapper off Shape & Finish ----
     The engine markup wraps each in a .calculator-panel (white card: bg,
     border, shadow, 1.1rem padding). On mobile we want NO outer card —
     just the grey segment track (Shape) and the bare dot-row (Finish),
     exactly like the mock. Remove the card; keep only inner content.
     This kills the "panel inside a panel" double-border look. */
  #product .add-to-cart-form #custom-sticker-calculator-shape.calculator-panel,
  #product .add-to-cart-form #custom-sticker-calculator-finish.calculator-panel {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
  }
  #product #custom-sticker-calculator-shape.calculator-panel { margin-bottom: 1rem !important; }
  #product #custom-sticker-calculator-finish.calculator-panel { margin-bottom: 1.1rem !important; }

  /* ---- SHAPE: clean-outline icon segment bar ----
     #product prefix raises specificity above the 768px desktop Shape rules
     so this wins cleanly in the 768–991 overlap zone. */
  #product #custom-sticker-calculator-shape .calculator-shape-silhouettes {
    display: flex !important;
    gap: 4px !important;
    background: #F2F0EB;
    border-radius: 14px;
    padding: 5px;
    justify-content: stretch !important;
    overflow-x: visible !important;
  }
  #product #custom-sticker-calculator-shape .calculator-shape-btn {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    min-height: 58px !important;
    margin: 0 !important;
    padding: 6px 2px 5px !important;
    border: 0 !important;
    background: transparent !important;
    border-radius: 11px !important;
    box-shadow: none !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    color: #9A9690 !important;
    transition: background .16s, box-shadow .16s, color .16s;
  }
  /* hide the heavy gradient silhouette + Custom subtitle on mobile; show the
     clean mini icon + a tiny caption under it (reuse the engine's label text) */
  #custom-sticker-calculator-shape .calculator-shape-silhouette__icon,
  #custom-sticker-calculator-shape .calculator-shape-card__subtitle {
    display: none !important;
  }
  #custom-sticker-calculator-shape .sf-shape-mini {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
  }
  #custom-sticker-calculator-shape .sf-shape-mini svg {
    width: 24px;
    height: 24px;
    display: block;
  }
  #custom-sticker-calculator-shape .sf-shape-mini svg [data-fill] { fill: transparent; }
  /* the tiny caption: works for both .__label (Square/Circle/…) and the
     Custom button's .__card__title ("Custom") */
  #custom-sticker-calculator-shape .calculator-shape-btn .calculator-shape-silhouette__label,
  #custom-sticker-calculator-shape .calculator-shape-btn .calculator-shape-card__labels {
    display: block !important;
    font-size: 9px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    letter-spacing: .1px !important;
    text-align: center !important;
    color: inherit !important;
    max-width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    white-space: nowrap !important;
    overflow: visible !important;
  }
  #custom-sticker-calculator-shape .calculator-shape-btn .calculator-shape-card__title {
    font-size: 9px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
  }
  #custom-sticker-calculator-shape .calculator-shape-btn.is-selected {
    background: #fff !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .10) !important;
    color: #E8581A !important;
  }
  #custom-sticker-calculator-shape .calculator-shape-btn.is-selected .sf-shape-mini svg [data-fill] {
    fill: #FBDECF;
  }

  /* ---- FINISH: inline ultra-minimal — no capsule, just dot + word ---- */
  #custom-sticker-calculator-finish {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px;
    flex-wrap: wrap;
    background: transparent;
    overflow: visible !important;
  }
  #custom-sticker-calculator-finish .product-option-label {
    margin-bottom: 0 !important;
  }
  #custom-sticker-calculator-finish .calculator-shape-silhouettes--finish {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    width: auto !important;
    background: transparent !important;
    padding-left: 5px !important;   /* room so the active dot's ring isn't clipped on the left */
    overflow: visible !important;
  }
  /* Glossy first, Matte second (visual order, like the mock) */
  #custom-sticker-calculator-finish .calculator-finish-chip[data-finish="glossy"] { order: 1; }
  #custom-sticker-calculator-finish .calculator-finish-chip[data-finish="matte"]  { order: 2; }
  /* kill the old chip card entirely (bg, border, shadow, padding) */
  #custom-sticker-calculator-finish .calculator-finish-chip {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 7px !important;
  }
  /* hide the heavy material SVG on mobile; show the simple dot */
  #custom-sticker-calculator-finish .calculator-finish-chip .calculator-shape-silhouette__icon,
  #custom-sticker-calculator-finish .calculator-finish-card__indicator,
  #custom-sticker-calculator-finish .calculator-shape-silhouette__desc {
    display: none !important;
  }
  #custom-sticker-calculator-finish .sf-fin-dot {
    display: inline-block !important;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    flex: 0 0 auto;
  }
  #custom-sticker-calculator-finish .sf-fin-dot--gloss {
    background: linear-gradient(135deg, #fff, #cfcfcf);
    box-shadow: inset 0 1px 2px rgba(255, 255, 255, .9), inset 0 -1px 2px rgba(0, 0, 0, .18);
  }
  #custom-sticker-calculator-finish .sf-fin-dot--matte { background: #B6B4AE; }
  #custom-sticker-calculator-finish .calculator-finish-chip.is-selected .sf-fin-dot {
    /* ring via box-shadow (not outline) so it never gets clipped and
       doesn't push layout; 1.5px gap + 2px ring around the 13px dot */
    box-shadow: 0 0 0 1.5px #fff, 0 0 0 3.5px #E8581A;
  }
  #custom-sticker-calculator-finish .calculator-finish-chip { overflow: visible !important; }
  #custom-sticker-calculator-finish .calculator-finish-chip__body {
    display: inline !important;
  }
  #custom-sticker-calculator-finish .calculator-finish-chip .calculator-shape-silhouette__label {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #B0ACA4 !important;
  }
  #custom-sticker-calculator-finish .calculator-finish-chip.is-selected .calculator-shape-silhouette__label {
    color: #1E3A2F !important;
    font-weight: 700 !important;
  }
  /* dot separator between the two finish words — sits before the
     visually-second chip (Matte, order:2), regardless of DOM order */
  #custom-sticker-calculator-finish .calculator-finish-chip[data-finish="matte"]::before {
    content: "";
    display: inline-block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #D8D5CE;
    margin-right: 14px;
    flex: 0 0 auto;
    order: -1;
  }
}

/* ============================================================
   Homepage hero — keep right slider proportional on wide screens.
   Without this, .hero-slider-box (position-absolute end-0 w-lg-50)
   is 50% of the viewport. On 4K / ultrawide / browser zoom-out,
   the "Bakery" image visually outgrows the centered text panel.
   Fix: cap the hero section at container width and center it,
   so the absolute slider is 50% of the container, not the viewport.
   ============================================================ */
@media (min-width: 1400px) {
  .hero {
    max-width: 1320px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media (min-width: 1600px) {
  .hero {
    max-width: 1500px;
  }
}




/* ============================================================
   WELCOME20 sticky promo ribbon — header
   Always visible, click/tap copies the code to clipboard.
   Renders as a single horizontal bar with brand orange background.
   ============================================================ */
/* Variant 1 — dark green ribbon, matches site header. NOT sticky (scrolls away naturally). */
#welcome-promo-ribbon.welcome-promo-ribbon {
  position: relative !important;
  width: 100% !important;
  z-index: 1 !important;
  font-size: 12px !important;
  line-height: 1.3 !important;
  text-align: center !important;
  color: #fff !important;
  background: #1a3d2e !important; /* matches existing site-header dark green */
  cursor: pointer !important;
  user-select: none !important;
  -webkit-tap-highlight-color: transparent !important;
  margin: 0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}
#welcome-promo-ribbon.welcome-promo-ribbon:hover {
  background: #224d3a !important;
}
#welcome-promo-ribbon .welcome-promo-ribbon__btn {
  display: block !important;
  width: 100% !important;
  padding: 7px 16px !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #fff !important;
  font-weight: 500 !important;
  font-size: inherit !important;
  letter-spacing: 0.01em !important;
  cursor: pointer !important;
  text-align: center !important;
}
#welcome-promo-ribbon .welcome-promo-ribbon__btn:focus-visible {
  outline: 2px solid #fa8543 !important;
  outline-offset: -3px !important;
}
#welcome-promo-ribbon .welcome-promo-ribbon__icon {
  display: inline-block !important;
  margin-right: 6px !important;
  color: #fa8543 !important;
  font-size: 13px !important;
  vertical-align: middle !important;
}
#welcome-promo-ribbon .welcome-promo-ribbon__text {
  color: #fff !important;
}
#welcome-promo-ribbon .welcome-promo-ribbon__sep {
  display: inline-block !important;
  margin: 0 8px !important;
  opacity: 0.5 !important;
  color: #fff !important;
}
#welcome-promo-ribbon .welcome-promo-ribbon__label {
  color: #fff !important;
  opacity: 0.85 !important;
}
#welcome-promo-ribbon .welcome-promo-ribbon__code {
  display: inline-block !important;
  background: rgba(250, 133, 67, 0.22) !important;
  border: 1px dashed rgba(250, 175, 100, 0.7) !important;
  border-radius: 3px !important;
  padding: 1px 8px !important;
  margin: 0 4px !important;
  color: #ffb480 !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  transition: background 0.15s ease, transform 0.15s ease, color 0.15s ease !important;
}
#welcome-promo-ribbon .welcome-promo-ribbon__btn:hover .welcome-promo-ribbon__code {
  background: rgba(250, 133, 67, 0.35) !important;
  color: #fff !important;
  transform: scale(1.04) !important;
}
#welcome-promo-ribbon .welcome-promo-ribbon__hint {
  display: inline !important;
  opacity: 0.5 !important;
  font-size: 11px !important;
  margin-left: 6px !important;
  font-weight: 400 !important;
  color: #fff !important;
}
#welcome-promo-ribbon .welcome-promo-ribbon__feedback {
  display: inline-block !important;
  color: #7bd99a !important;
  font-weight: 600 !important;
  margin-left: 8px !important;
  animation: welcomePromoFlash 1.6s ease !important;
}
/* [hidden] must beat the inline-block above */
#welcome-promo-ribbon .welcome-promo-ribbon__feedback[hidden],
#welcome-promo-ribbon .welcome-promo-ribbon__hint[hidden] {
  display: none !important;
}
#welcome-promo-ribbon.welcome-promo-ribbon.is-copied .welcome-promo-ribbon__code {
  background: rgba(123, 217, 154, 0.25) !important;
  border-color: rgba(123, 217, 154, 0.7) !important;
  color: #7bd99a !important;
}
@keyframes welcomePromoFlash {
  0%   { transform: scale(0.8); opacity: 0; }
  20%  { transform: scale(1.1); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}
@media (max-width: 575.98px) {
  #welcome-promo-ribbon.welcome-promo-ribbon {
    font-size: 11px !important;
  }
  #welcome-promo-ribbon .welcome-promo-ribbon__btn {
    padding: 6px 10px !important;
  }
  #welcome-promo-ribbon .welcome-promo-ribbon__icon {
    font-size: 12px !important;
    margin-right: 4px !important;
  }
  #welcome-promo-ribbon .welcome-promo-ribbon__code {
    padding: 1px 6px !important;
    margin: 0 3px !important;
  }
  /* On narrow screens hide the long bits — keep only "20% off · WELCOME20" */
  #welcome-promo-ribbon .welcome-promo-ribbon__sep,
  #welcome-promo-ribbon .welcome-promo-ribbon__label,
  #welcome-promo-ribbon .welcome-promo-ribbon__hint {
    display: none !important;
  }
}