/** Shopify CDN: Minification failed Line 1569:0 Unexpected "}" Line 2499:0 Unexpected "}" **/ /* ==== BEGIN cleanuv-ghost-fibers-css-late.css ==== */ /* late UNIFY frost removed — chrome FAB/ann restored inline for cascade */ /* ===== CLEANUV_CHROME_FAB_v1 — restored from pre-cleanup late CSS (no frost UNIFY) ===== */ /* ===== CLEANUV chrome-free header + FAB from hamburger (mobile preview) ===== */ /* Glass bug note: milky background-image (white 0.5–0.72) was killing backdrop-filter. Keep fills low-alpha so blur can read the page behind. */ #cleanuv-fab, #cleanuv-glass-cart { display: none; } @media screen and (max-width: 999px) { .shopify-section--header, #shopify-section-header, header.header, .shopify-section--header .header { display: none !important; height: 0 !important; min-height: 0 !important; overflow: hidden !important; visibility: hidden !important; pointer-events: none !important; } :root { --cleanuv-chrome-top: calc(0.45rem + env(safe-area-inset-top, 0px)); --cleanuv-fab-glass-fill: rgba(255, 255, 255, 0.14); --cleanuv-fab-glass-blur: blur(0px) saturate(180%) brightness(105%); } #cleanuv-fab { display: flex; flex-direction: column; align-items: flex-start; gap: 0.6rem; position: fixed; top: var(--cleanuv-chrome-top); left: calc(0.75rem + env(safe-area-inset-left, 0px)); right: auto; bottom: auto; z-index: 80; pointer-events: none; } #cleanuv-fab > * { pointer-events: auto; } #cleanuv-fab__toggle, #cleanuv-glass-cart, #cleanuv-fab__actions a { background: var(--cleanuv-fab-glass-fill) !important; background-color: var(--cleanuv-fab-glass-fill) !important; background-image: none !important; /* opaque gradients were blocking glass */ -webkit-backdrop-filter: var(--cleanuv-fab-glass-blur) !important; backdrop-filter: var(--cleanuv-fab-glass-blur) !important; border: 1px solid rgba(255, 255, 255, 0.55) !important; box-shadow: 0 10px 28px rgba(30, 16, 45, 0.12), 0 1px 4px rgba(30, 16, 45, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.75), inset 0 0 0 0.5px rgba(255, 255, 255, 0.35) !important; } #cleanuv-fab__toggle { width: 2.85rem; height: 2.85rem; border-radius: 999px; color: #1d1d1f; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 0; transition: transform 0.2s ease, background 0.2s ease, backdrop-filter 0.2s ease; } #cleanuv-fab__toggle svg { width: 1.15rem; height: 1.15rem; display: block; } #cleanuv-fab.is-open #cleanuv-fab__toggle { background: rgba(255, 255, 255, 0.22) !important; background-color: rgba(255, 255, 255, 0.22) !important; } #cleanuv-fab__actions { display: flex; flex-direction: column; align-items: flex-start; gap: 0.5rem; opacity: 0; visibility: hidden; /* avoid transform on the glass chips themselves — keeps backdrop-filter healthy */ transform: translateY(-0.35rem); transform-origin: top left; transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s; pointer-events: none; } #cleanuv-fab.is-open #cleanuv-fab__actions { opacity: 1; visibility: visible; transform: translateY(0); pointer-events: auto; } #cleanuv-fab__actions a { display: inline-flex; align-items: center; justify-content: center; min-height: 2.85rem; padding: 0 1.2rem; border-radius: 999px; color: #1d1d1f !important; text-decoration: none !important; font-family: var(--heading-font-family, inherit); font-size: 1.2rem !important; /* larger letters */ font-weight: 650; letter-spacing: -0.02em; line-height: 1.1; white-space: nowrap; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.35); } #cleanuv-glass-cart { display: inline-flex; align-items: center; justify-content: center; position: fixed; top: var(--cleanuv-chrome-top); right: calc(0.75rem + env(safe-area-inset-right, 0px)); z-index: 80; width: 2.85rem; height: 2.85rem; border-radius: 999px; color: #1d1d1f; text-decoration: none !important; } #cleanuv-glass-cart svg { width: 1.2rem; height: 1.2rem; display: block; } #cleanuv-glass-cart__count { position: absolute; top: -0.15rem; right: -0.15rem; min-width: 1.05rem; height: 1.05rem; padding: 0 0.25rem; border-radius: 999px; background: #1d1d1f; color: #fff; font-size: 0.65rem; font-weight: 700; line-height: 1.05rem; text-align: center; } #cleanuv-glass-cart__count.is-empty { display: none; } } #cleanuv-liquid-menu { display: none !important; } /* ===== Fix stuck reveal-on-scroll titles (Impact leaves opacity:0 until JS) ===== */ html body #main .section-header h2[reveal-on-scroll="true"], html body #main .section-header h2[reveal-on-scroll="true"] *, html body #main [id*="more-than-one"] .section-header h2, html body #main .shopify-section--featured-collection .section-header h2 { opacity: 1 !important; visibility: visible !important; transform: none !important; color: #000000 !important; -webkit-text-fill-color: #000000 !important; } /* Hero — tiny positive gap under menu; force overlay grid (last-wins) */ html body #main > [id$="__hero"], html body #main > .shopify-section--image-with-text-overlay { margin-block-start: 0.75rem !important; margin-top: 0.75rem !important; padding-block-start: 0 !important; padding-top: 0 !important; } @media screen and (min-width: 1000px) { html body #main > [id$="__hero"], html body #main > .shopify-section--image-with-text-overlay { margin-block-start: 0.85rem !important; margin-top: 0.85rem !important; } } html body #main > [id$="__hero"] .content-over-media, html body #main > [id$="__hero"] image-banner.content-over-media, html body #main > .shopify-section--image-with-text-overlay .content-over-media { display: grid !important; } html body #main > [id$="__hero"] .content-over-media > :not(img, video, iframe, svg, video-media, picture), html body #main > .shopify-section--image-with-text-overlay .content-over-media > :not(img, video, iframe, svg, video-media, picture) { grid-area: 1 / 1 / -1 / -1 !important; place-self: end start !important; z-index: 2 !important; position: relative !important; } /* ===== CLEANUV_ANN_BAR_v1 — short free-shipping bar, no marquee gap ===== */ html body .shopify-section--announcement-bar, html body .announcement-bar { min-height: 0 !important; height: auto !important; padding-block: 0.35rem !important; padding-top: 0.35rem !important; padding-bottom: 0.35rem !important; background: transparent !important; background-color: transparent !important; background-image: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; box-shadow: none !important; border: none !important; } html body .announcement-bar__container, html body .announcement-bar__wrapper { max-width: none !important; min-height: 0 !important; gap: 0 !important; margin: 0 auto !important; padding-inline: 0.75rem !important; } html body .announcement-bar__item { animation: none !important; grid-auto-columns: auto !important; min-height: 0 !important; } html body .announcement-bar, html body .announcement-bar a, html body .announcement-bar p, html body .announcement-bar span, html body .announcement-bar .text-base { color: #fff !important; -webkit-text-fill-color: #fff !important; font-weight: 600 !important; letter-spacing: 0.01em; } /* Kill empty second marquee slides that inflate the bar */ html body .announcement-bar__item:empty, html body .announcement-bar__item:has(:empty):not(:has(a, p, span, .prose)) { display: none !important; } /* ===== CLEANUV_CHROME_SPACER_v1 — no phantom header gap when FAB hides header ===== */ @media screen and (max-width: 999px) { html body .shopify-section--header, html body #shopify-section-header, html body .shopify-section-group-header-group > .shopify-section--header, html body .shopify-section-group-index-header-group > .shopify-section--header, html body [id*="header-group"] .shopify-section--header, html body [class*="header-group"] .shopify-section--header { display: none !important; height: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; visibility: hidden !important; pointer-events: none !important; } /* Theme often leaves --header-height / sticky spacer after hide */ html body { --header-height: 0px !important; --header-height-with-bottom: 0px !important; } html body .header, html body .header__wrapper { height: 0 !important; min-height: 0 !important; } } /* Reviews: contain overflow so no full-bleed banner rides over the carousel */ html body #main .shopify-section:has(.jdgm-carousel), html body #main .shopify-section:has(.jdgm-rev-widg), html body #main .shopify-section:has([class*="jdgm-"]) { overflow: hidden !important; isolation: isolate !important; } html body #main .shopify-section:has(.jdgm-carousel) > .section, html body #main .shopify-section:has(.jdgm-rev-widg) > .section { overflow: hidden !important; position: relative !important; z-index: 1 !important; } /* ==== END cleanuv-ghost-fibers-css-late.css ==== */ /* ==== BEGIN cleanuv-runtime.css ==== */ /* CLEANUV_RUNTIME v3-light — chrome FAB + ann bar restored */ /* Consolidated winning CleanUV look: sharp clear glass panes, soft BG blur, footer no-square, light reviews. Replaces inline style blocks that were stacking/conflicting in theme.liquid. */ :root { --cleanuv-glass-blur: blur(0px) saturate(180%) brightness(105%) !important; --cleanuv-glass: rgba(255, 255, 255, 0.08) !important; --cleanuv-glass-card: rgba(255, 255, 255, 0.08) !important; --cleanuv-glass-border: rgba(255, 255, 255, 0.50) !important; } /* Background wash: soft blur behind everything (NOT frosted panes) */ html body #cleanuv-ghost-fibers { -webkit-filter: blur(28px) saturate(140%) !important; filter: blur(28px) saturate(140%) !important; transform: scale(1.08) !important; } /* ===== Section shells — sharp thin clear glass ===== */ html body #main .shopify-section > .section, html body #main .shopify-section > .section.section-full, html body #main .shopify-section > .section.bg-gradient, html body #main .shopify-section > .section.bg-custom, html body #main .shopify-section > .section-stack, html body #main [id*="more-than-one"] > .section, html body #main [id*="related-products"] > .section, html body #main .shopify-section--featured-collection > .section, html body #main .shopify-section--featured-product > .section, html body #main .shopify-section--rich-text > .section, html body #main .shopify-section--multi-column > .section, html body #main .shopify-section--multicolumn > .section, html body #main .shopify-section--apps > .section, html body #main .shopify-section--related-products > .section, html body #main .shopify-section:has(.jdgm-carousel) > .section, html body #main .shopify-section:has(.jdgm-rev-widg) > .section, html body #main .shopify-section:has([class*="jdgm-"]) > .section, html body #main [id*="review"] > .section { background: rgba(255, 255, 255, 0.08) !important; background-color: rgba(255, 255, 255, 0.08) !important; background-image: none !important; --gradient: transparent !important; -webkit-backdrop-filter: blur(0px) saturate(140%) brightness(100%) !important; backdrop-filter: blur(0px) saturate(140%) brightness(100%) !important; border: none !important; border-radius: 28px !important; box-shadow: none !important; -webkit-box-shadow: none !important; overflow: visible !important; } /* ===== Product cards — same sharp thin glass ===== */ html body #main product-card.product-card, html body #main product-card.product-card.product-card--blends, html body #main .product-card.product-card--blends, html body #main .product-card, html body #main product-card, html body #main .shopify-section product-card, html body #main .shopify-section .product-card, html body #main .shopify-section--featured-collection product-card, html body #main .shopify-section--featured-collection .product-card, html body #main .shopify-section--related-products product-card, html body #main .shopify-section--related-products .product-card, html body #main [id*="more-than-one"] product-card, html body #main [id*="more-than-one"] .product-card, html body #main [id*="related-products"] product-card, html body #main [id*="related-products"] .product-card { --cleanuv-glass-blur: blur(0px) saturate(180%) brightness(105%) !important; background: rgba(255, 255, 255, 0.08) !important; background-color: rgba(255, 255, 255, 0.08) !important; background-image: none !important; -webkit-backdrop-filter: blur(0px) saturate(140%) brightness(100%) !important; backdrop-filter: blur(0px) saturate(140%) brightness(100%) !important; border: none !important; border-radius: 24px !important; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.10) !important; -webkit-filter: none !important; filter: none !important; overflow: visible !important; } /* Between-cards hairline: keep product lists from clipping */ html body #main .shopify-section[id*="more-than-one"] .product-list, html body #main .shopify-section[id*="more-than-one"] scroll-carousel, html body #main .shopify-section[id*="more-than-one"] .scroll-area, html body #main .shopify-section.shopify-section--featured-collection .product-list, html body #main .shopify-section.shopify-section--featured-collection scroll-carousel, html body #main .shopify-section.shopify-section--featured-collection .scroll-area, html body #main .shopify-section--related-products .product-list { overflow: visible !important; } /* Hero stays transparent (no glass) */ html body #main > [id$="__hero"] > .section, html body #main > .shopify-section--image-with-text-overlay > .section, html body #main .shopify-section--cleanuv-logo-shine-hero > .section { background: transparent !important; background-color: transparent !important; background-image: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; border: none !important; box-shadow: none !important; } /* Desktop side margins ~1.25rem; no 1100px section cap */ @media screen and (min-width: 1000px) { :root { --container-gutter: 1.25rem !important; --section-outer-spacing-inline: 1.25rem !important; } html body #main .shopify-section > .section, html body #main .shopify-section > .section.section-full, html body #main .shopify-section > .section.section-blends, html body #main .shopify-section > .section.section-full.section-blends, html body #main .shopify-section > .section.bg-gradient, html body #main .shopify-section > .section.bg-custom, html body #main .shopify-section--featured-collection > .section, html body #main .shopify-section--featured-product > .section, html body #main .shopify-section--rich-text > .section, html body #main .shopify-section--multi-column > .section, html body #main .shopify-section--multicolumn > .section, html body #main .shopify-section--apps > .section, html body #main [id*="more-than-one"] > .section { max-width: none !important; width: calc(100% - 2.5rem) !important; margin-left: 1.25rem !important; margin-right: 1.25rem !important; margin-inline: 1.25rem !important; box-sizing: border-box !important; } html body #main > [id$="__hero"] > .section, html body #main .shopify-section--cleanuv-logo-shine-hero > .section { max-width: none !important; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; margin-inline: 0 !important; } } /* ===== Footer: outer SECTION transparent; only inner > .section is rounded glass ===== */ html body #main .shopify-section.shopify-section--blocks.shopify-section-group-index-footer-group, html body #main .shopify-section.shopify-section--blocks[class*="footer-group"], html body #main .shopify-section[class*="footer-group"], html body #main .shopify-section.shopify-section-group-index-footer-group, html body #main .shopify-section.shopify-section-group-footer-group, html body #main .shopify-section[class*="section-group"][class*="footer"], html body #main .shopify-section[id*="ftr_"], html body #main .shopify-section[id*="__ftr_"], html body #main section.shopify-section[id*="ftr_"], html body #main section.shopify-section[id*="__ftr_"], html body #main .shopify-section[id*="footer"], html body #shopify-section-group-index-footer-group, html body #shopify-section-group-footer-group, html body [id^="shopify-section-group"][id*="footer"] { background: transparent !important; background-color: transparent !important; background-image: none !important; border: 0 none transparent !important; box-shadow: none !important; outline: none !important; border-radius: 0 !important; clip-path: none !important; -webkit-clip-path: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; overflow: visible !important; max-width: none !important; width: auto !important; margin-left: 0 !important; margin-right: 0 !important; } /* Single rounded glass pane = the inner .section only */ html body #main .shopify-section[id*="ftr_"] > .section, html body #main .shopify-section[id*="__ftr_"] > .section, html body #main .shopify-section[class*="footer-group"] > .section, html body #main .shopify-section.shopify-section--blocks[class*="footer-group"] > .section, html body #main .shopify-section.shopify-section-group-index-footer-group > .section, html body #main .shopify-section.shopify-section-group-footer-group > .section, html body #main .shopify-section[class*="section-group"][class*="footer"] > .section, html body #main section.shopify-section[id*="ftr_"] > .section, html body #main section.shopify-section[id*="__ftr_"] > .section, html body #main .shopify-section[id*="ftr_"] > .section.section-full, html body #main .shopify-section[id*="ftr_"] > .section.section-blends { border-radius: 41px !important; overflow: hidden !important; isolation: isolate !important; clip-path: inset(0 round 41px) !important; -webkit-clip-path: inset(0 round 41px) !important; background: rgba(255, 255, 255, 0.08) !important; background-color: rgba(255, 255, 255, 0.08) !important; background-image: none !important; border: 0.5px solid rgba(255, 255, 255, 0.50) !important; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12) !important; -webkit-backdrop-filter: blur(0px) saturate(180%) brightness(105%) !important; backdrop-filter: blur(0px) saturate(180%) brightness(105%) !important; margin-left: 22px !important; margin-right: 22px !important; margin-bottom: 1.25rem !important; width: calc(100% - 44px) !important; max-width: none !important; box-sizing: border-box !important; } @media screen and (min-width: 1000px) { html body #main .shopify-section[id*="ftr_"] > .section, html body #main .shopify-section[id*="__ftr_"] > .section, html body #main .shopify-section[class*="footer-group"] > .section, html body #main .shopify-section.shopify-section-group-index-footer-group > .section, html body #main .shopify-section.shopify-section-group-footer-group > .section { margin-left: 1.25rem !important; margin-right: 1.25rem !important; width: calc(100% - 2.5rem) !important; } } /* No second plates inside footer */ html body #main .shopify-section[id*="ftr_"] .footer, html body #main .shopify-section[id*="ftr_"] footer, html body #main .shopify-section[id*="ftr_"] [class*="ai_gen"], html body #main .shopify-section[id*="ftr_"] [class*="ai-gradient"], html body #main .shopify-section[class*="footer-group"] .footer, html body #main .shopify-section[class*="footer-group"] [class*="ai_gen"], html body #main .shopify-section[class*="footer-group"] [class*="ai-gradient"], html body [id^="shopify-section-group"][id*="footer"] .footer, html body [id^="shopify-section-group"][id*="footer"] footer.footer, html body [id^="shopify-section-group"][id*="footer"] .footer__aside, html body [id^="shopify-section-group"][id*="footer"] .footer__aside-bottom, html body [id^="shopify-section-group"][id*="footer"] [class*="ai_gen"], html body [id^="shopify-section-group"][id*="footer"] [class*="ai-gradient"] { background: transparent !important; background-image: none !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; clip-path: none !important; } /* Review section shells: match clear-glass neighbors (no join band) */ html body #main .shopify-section:has(.jdgm-carousel) > .section, html body #main .shopify-section:has(.jdgm-rev-widg) > .section, html body #main .shopify-section:has([class*="jdgm-"]) > .section, html body #main [id*="review"] > .section, html body #main .shopify-section--apps > .section, html body #main [id*="1788032682a9637e93"] > .section { background: rgba(255, 255, 255, 0.08) !important; background-color: rgba(255, 255, 255, 0.08) !important; background-image: none !important; -webkit-backdrop-filter: blur(0px) saturate(140%) brightness(100%) !important; backdrop-filter: blur(0px) saturate(140%) brightness(100%) !important; } /* Judge.me review cards: frosted cards; shell stays clear elsewhere */ html body .jdgm-review-snippet-widget, html body .jdgm-rev-snippet-widget-v2__inner, html body .jdgm-carousel__item, html body .jdgm-rev, html body .jdgm-rev-widg .jdgm-rev, html body [class*="jdgm"] [class*="card"] { background: rgba(255, 255, 255, 0.72) !important; background-color: rgba(255, 255, 255, 0.72) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; filter: none !important; opacity: 1 !important; color: #1B1D23 !important; } @media (prefers-reduced-transparency: reduce) { html body #main .shopify-section > .section, html body #main .shopify-section > .section.section-full, html body #main [id*="more-than-one"] > .section, html body #main .shopify-section[id*="ftr_"] > .section { background: #ababaf !important; background-color: #ababaf !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; } } /* ===== Fix stuck reveal-on-scroll titles (Impact leaves opacity:0 until JS) ===== */ html body #main .section-header h2[reveal-on-scroll="true"], html body #main .section-header h2[reveal-on-scroll="true"] *, html body #main [id*="more-than-one"] .section-header h2, html body #main .shopify-section--featured-collection .section-header h2 { opacity: 1 !important; visibility: visible !important; transform: none !important; color: #000000 !important; -webkit-text-fill-color: #000000 !important; } /* Hero — tiny positive gap under menu; force overlay grid (last-wins) */ html body #main > [id$="__hero"], html body #main > .shopify-section--image-with-text-overlay { margin-block-start: 0.75rem !important; margin-top: 0.75rem !important; padding-block-start: 0 !important; padding-top: 0 !important; } @media screen and (min-width: 1000px) { html body #main > [id$="__hero"], html body #main > .shopify-section--image-with-text-overlay { margin-block-start: 0.85rem !important; margin-top: 0.85rem !important; } } html body #main > [id$="__hero"] .content-over-media, html body #main > [id$="__hero"] image-banner.content-over-media, html body #main > .shopify-section--image-with-text-overlay .content-over-media { display: grid !important; } html body #main > [id$="__hero"] .content-over-media > :not(img, video, iframe, svg, video-media, picture), html body #main > .shopify-section--image-with-text-overlay .content-over-media > :not(img, video, iframe, svg, video-media, picture) { grid-area: 1 / 1 / -1 / -1 !important; place-self: end start !important; z-index: 2 !important; position: relative !important; } /* ===== CLEANUV_ANN_BAR_v1 — short free-shipping bar, no marquee gap ===== */ html body .shopify-section--announcement-bar, html body .announcement-bar { min-height: 0 !important; height: auto !important; padding-block: 0.35rem !important; padding-top: 0.35rem !important; padding-bottom: 0.35rem !important; background: transparent !important; background-color: transparent !important; background-image: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; box-shadow: none !important; border: none !important; } html body .announcement-bar__container, html body .announcement-bar__wrapper { max-width: none !important; min-height: 0 !important; gap: 0 !important; margin: 0 auto !important; padding-inline: 0.75rem !important; } html body .announcement-bar__item { animation: none !important; grid-auto-columns: auto !important; min-height: 0 !important; } html body .announcement-bar, html body .announcement-bar a, html body .announcement-bar p, html body .announcement-bar span, html body .announcement-bar .text-base { color: #fff !important; -webkit-text-fill-color: #fff !important; font-weight: 600 !important; letter-spacing: 0.01em; } /* Kill empty second marquee slides that inflate the bar */ html body .announcement-bar__item:empty, html body .announcement-bar__item:has(:empty):not(:has(a, p, span, .prose)) { display: none !important; } /* ===== CLEANUV_CHROME_SPACER_v1 — no phantom header gap when FAB hides header ===== */ @media screen and (max-width: 999px) { html body .shopify-section--header, html body #shopify-section-header, html body .shopify-section-group-header-group > .shopify-section--header, html body .shopify-section-group-index-header-group > .shopify-section--header, html body [id*="header-group"] .shopify-section--header, html body [class*="header-group"] .shopify-section--header { display: none !important; height: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; visibility: hidden !important; pointer-events: none !important; } /* Theme often leaves --header-height / sticky spacer after hide */ html body { --header-height: 0px !important; --header-height-with-bottom: 0px !important; } html body .header, html body .header__wrapper { height: 0 !important; min-height: 0 !important; } } /* Reviews: contain overflow so no full-bleed banner rides over the carousel */ html body #main .shopify-section:has(.jdgm-carousel), html body #main .shopify-section:has(.jdgm-rev-widg), html body #main .shopify-section:has([class*="jdgm-"]) { overflow: visible !important; isolation: auto !important; } html body #main .shopify-section:has(.jdgm-carousel) > .section, html body #main .shopify-section:has(.jdgm-rev-widg) > .section { overflow: hidden !important; position: relative !important; z-index: 1 !important; isolation: auto !important; clip-path: none !important; } /* REVIEW_BANNER_CLIP_v2 */ html body #main .shopify-section:has(.jdgm-carousel), html body #main .shopify-section:has(.jdgm-rev-widg), html body #main .shopify-section:has([class*="jdgm-"]) { overflow: hidden !important; } html body #main .shopify-section:has(.jdgm-carousel) > .section, html body #main .shopify-section:has(.jdgm-rev-widg) > .section, html body #main .shopify-section:has([class*="jdgm-"]) > .section { overflow: hidden !important; clip-path: none; /* was inset round — caused corner shade */ } html body #main .jdgm-carousel-wrapper, html body #main .jdgm-carousel, html body #main .jdgm-carousel__item { max-width: 100% !important; overflow: hidden !important; } /* ===== FAB_SCROLLING_LOGO_CLIP — crop logo banner inside apps/reviews section ===== */ html body #main .shopify-section:has([id*="fab_scrolling"]), html body #main .shopify-section:has([class*="fab-scrolling"]), html body #main .shopify-section:has([class*="fab_scrolling"]), html body #main .shopify-section--apps, html body #main [id*="1788032682a9637e93"] { overflow: hidden !important; } html body #main .shopify-section:has([id*="fab_scrolling"]) > .section, html body #main .shopify-section:has([class*="fab-scrolling"]) > .section, html body #main .shopify-section--apps > .section, html body #main [id*="1788032682a9637e93"] > .section { overflow: hidden !important; position: relative !important; isolation: auto !important; border-radius: 28px !important; clip-path: none !important; -webkit-clip-path: none !important; box-shadow: none !important; -webkit-box-shadow: none !important; border: none !important; } html body #main [class*="fab-scrolling"], html body #main [class*="fab_scrolling"], html body #main [id*="fab_scrolling"], html body #main [id*="fab-scrolling"] { overflow: hidden !important; max-width: 100% !important; width: 100% !important; box-sizing: border-box !important; } /* The Range / hook titles: Satoshi headings (not Playfair / not Inter) */ html body.template-collection .hook-big, html body.template-collection .hook-sub, html body .hook-gradient .hook-big, html body .hook-gradient .hook-sub { font-family: var(--heading-font-family), "Satoshi", "General Sans", system-ui, sans-serif !important; -webkit-text-stroke: 0 !important; } /* PDP_GALLERY_INSET — tiny white-card frame around PDP media (padding only; no overflow/clip changes) */ html body #main .shopify-section--main-product .product-gallery { margin-top: 0; } html body #main .shopify-section--featured-product .product-gallery { margin-top: -23px; } /* PDP — locked inset Bruno liked */ html body #main .shopify-section--main-product .product-gallery__media { padding: 18px 10px 10px; box-sizing: border-box; } /* Homepage featured GO — a little higher in the glass (less top gap) */ html body #main .shopify-section--featured-product .product-gallery__media { /* equal top+side inset; corners match section glass */ padding: 0 12px 12px; box-sizing: border-box; } html body #main .shopify-section--main-product .product-gallery__media img, html body #main .shopify-section--main-product .product-gallery__media > video-media, html body #main .shopify-section--main-product .product-gallery__media > .media { border-radius: 28px !important; -webkit-transform: scale(1.08) !important; transform: scale(1.08) !important; -webkit-transform-origin: center center !important; transform-origin: center center !important; } /* Homepage GO — equal inset; corners concentric with section glass (41px - 12px) */ html body #main .shopify-section--featured-product .product-gallery__media { overflow: hidden !important; } html body #main .shopify-section--featured-product .product-gallery__media img, html body #main .shopify-section--featured-product .product-gallery__media > video-media, html body #main .shopify-section--featured-product .product-gallery__media > .media { border-radius: 29px !important; -webkit-transform: scale(1.03) !important; transform: scale(1.03) !important; -webkit-transform-origin: center center !important; transform-origin: center center !important; } @media screen and (min-width: 1000px) { html body #main .shopify-section--main-product .product-gallery { margin-top: 0; } html body #main .shopify-section--featured-product .product-gallery { /* desktop: nudge down so photo sits inside section glass (mobile keeps -23px) */ margin-top: 12px; } html body #main .shopify-section--main-product .product-gallery__media { padding: 20px 12px 12px; } html body #main .shopify-section--featured-product .product-gallery__media { padding: 22px 12px 12px; } } /* Homepage featured GO — nudge title a little down (info column only; PDPs untouched) CLEANUV_GO_TITLE_NUDGE_v2 */ html body #main .shopify-section--featured-product .product-info__title { padding-top: 22px; } /* ===== CLEANUV_LOGO_HERO_SHRINK_v1 — shorter logo hero so products start sooner ===== Section liquid uses 100svh/100dvh; override modestly (~18% less). Keep centered lockup + shine. */ html body #main .shopify-section--cleanuv-logo-shine-hero, html body #main > [id$="__hero"].shopify-section--cleanuv-logo-shine-hero { min-height: 82svh !important; min-height: 82dvh !important; height: auto !important; } html body #main .shopify-section--cleanuv-logo-shine-hero .cleanuv-logo-shine-hero, html body #main > [id$="__hero"] .cleanuv-logo-shine-hero { min-height: 82svh !important; min-height: 82dvh !important; height: 82svh !important; height: 82dvh !important; padding-top: max(2rem, env(safe-area-inset-top)) !important; padding-bottom: max(2rem, env(safe-area-inset-bottom)) !important; } @media screen and (max-width: 999px) { html body #main .shopify-section--cleanuv-logo-shine-hero .cleanuv-logo-shine-hero, html body #main > [id$="__hero"] .cleanuv-logo-shine-hero { padding-top: 0 !important; padding-bottom: 0 !important; } } /* Slightly smaller wordmark so lockup fits the shorter stage */ html body #main .shopify-section--cleanuv-logo-shine-hero .cleanuv-logo-shine-hero__wordmark { font-size: clamp(2.45rem, 9.2vw, 4.85rem) !important; } @media screen and (max-width: 749px) { html body #main .shopify-section--cleanuv-logo-shine-hero .cleanuv-logo-shine-hero__wordmark { font-size: clamp(2.1rem, 11vw, 3.4rem) !important; } } /* CLEANUV_FONTS_SATOSHI_INTER_v1 — locked store fonts: Satoshi headings + Inter body (override theme pickers) */ :root { --heading-font-family: "Satoshi", "General Sans", system-ui, -apple-system, sans-serif !important; --heading-font-weight: 700; --text-font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important; --text-font-weight: 400; } html body, html body .text-body, html body .prose, html body p, html body li, html body input, html body textarea, html body select, html body button, html body .btn, html body .button { font-family: var(--text-font-family) !important; } html body h1, html body h2, html body h3, html body h4, html body h5, html body h6, html body .h1, html body .h2, html body .h3, html body .h4, html body .h5, html body .h6, html body .h0, html body .product-title, html body .product-card__title, html body .section-header__title, html body .heading, html body .cleanuv-logo-shine-hero__wordmark { font-family: var(--heading-font-family) !important; } /* CUV_QUICKADD_ICON_RESTORE_v1 Cause: cleanuv-buy-liquid-glass.css applied pill padding (0.65rem 1.15rem) to .product-card__mobile-quick-buy-button while theme keeps ~2.25rem circle + overflow:hidden → flex content width collapses to 0 → cart SVG invisible (empty pink ring). Restore fixed circle + zero padding so glyph fits. */ html body #main .product-card__mobile-quick-buy-button, html body #main .product-card__quick-buy .product-card__mobile-quick-buy-button, html body #main .product-card__quick-buy button.product-card__mobile-quick-buy-button, html body #main .product-card__quick-buy [is="custom-button"].product-card__mobile-quick-buy-button { width: 2.75rem !important; height: 2.75rem !important; min-width: 2.75rem !important; min-height: 2.75rem !important; max-width: 2.75rem !important; max-height: 2.75rem !important; padding: 0 !important; box-sizing: border-box !important; overflow: visible !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; color: #0a0a0a !important; -webkit-text-fill-color: #0a0a0a !important; } html body #main .product-card__mobile-quick-buy-button > svg, html body #main .product-card__mobile-quick-buy-button .icon, html body #main .product-card__mobile-quick-buy-button .icon-quick-buy-cart { display: block !important; width: 16px !important; height: 14px !important; min-width: 16px !important; max-width: none !important; opacity: 1 !important; visibility: visible !important; color: #0a0a0a !important; fill: none !important; stroke: #0a0a0a !important; flex-shrink: 0 !important; } html body #main .product-card__mobile-quick-buy-button > svg path, html body #main .product-card__mobile-quick-buy-button .icon-quick-buy-cart path { stroke: #0a0a0a !important; fill: none !important; opacity: 1 !important; visibility: visible !important; } /* CUV_BUY_DISCOVER_ORDER_v1 — Discover left; Buy = black + pink label */ html body .cleanuv-buy-discover { display: flex !important; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: center; } html body .cleanuv-buy-discover .cleanuv-buy-go-btn { background: #0a0a0a !important; background-color: #0a0a0a !important; color: #f90dfd !important; -webkit-text-fill-color: #f90dfd !important; border-color: transparent !important; box-shadow: 0 0 10px 2px rgba(255, 0, 199, 0.18), 0 0 22px 4px rgba(230, 0, 170, 0.10), 0 10px 22px rgba(180, 0, 120, 0.16), 0 3px 8px rgba(40, 10, 30, 0.10) !important; } html body .cleanuv-buy-discover .cleanuv-buy-go-btn:hover, html body .cleanuv-buy-discover .cleanuv-buy-go-btn:focus { background: #111 !important; color: #ff4df5 !important; -webkit-text-fill-color: #ff4df5 !important; } /* CUV_DISCOVER_MENU_GLASS_v1 — Discover UV matches hamburger drawer glass fill */ html body #main .cleanuv-buy-discover-row .cleanuv-discover-btn, html body #main .cleanuv-buy-discover-row a.cleanuv-discover-btn.button { background: rgba(186, 160, 255, 0.48) !important; background-color: rgba(186, 160, 255, 0.48) !important; background-image: none !important; border: 1.5px solid rgba(255, 255, 255, 0.88) !important; color: #1b1d23 !important; -webkit-text-fill-color: #1b1d23 !important; -webkit-backdrop-filter: saturate(160%) blur(18px) !important; backdrop-filter: saturate(160%) blur(18px) !important; box-shadow: 0 0 10px 2px rgba(255, 0, 199, 0.18), 0 0 22px 4px rgba(230, 0, 170, 0.10), 0 10px 22px rgba(180, 0, 120, 0.16), 0 3px 8px rgba(40, 10, 30, 0.10) !important; } html body #main .cleanuv-buy-discover-row .cleanuv-discover-btn:hover, html body #main .cleanuv-buy-discover-row .cleanuv-discover-btn:focus { background: rgba(170, 140, 255, 0.58) !important; background-color: rgba(170, 140, 255, 0.58) !important; color: #1b1d23 !important; -webkit-text-fill-color: #1b1d23 !important; filter: none !important; transform: none !important; } /* CUV_BUY_DISCOVER_INVERSE_GLOW_v3 — Discover keeps pink halo; Buy gets violet halo only */ html body #main .cleanuv-buy-discover-row .cleanuv-discover-btn { box-shadow: 0 0 10px 2px rgba(255, 0, 199, 0.22), 0 0 22px 4px rgba(230, 0, 170, 0.12), 0 10px 22px rgba(180, 0, 120, 0.16), 0 3px 8px rgba(40, 10, 30, 0.10) !important; } html body #main .cleanuv-buy-discover-row .cleanuv-buy-go-btn { box-shadow: 0 0 12px 3px rgba(186, 160, 255, 0.55), 0 0 28px 6px rgba(140, 100, 255, 0.35), 0 12px 26px rgba(100, 60, 220, 0.28), 0 4px 10px rgba(40, 20, 80, 0.16) !important; } /* ===== CLEANUV_DESKTOP_CHROME_FAB_v1 — match mobile cleaner FAB chrome on desktop ===== Live FAB CSS in theme.liquid is mobile-only (max-width:999). Desktop still shows Impact header bar (logo + icons). Extend same glass hamburger + cart chips to desktop and hide traditional header so chrome aligns with mobile. */ @media screen and (min-width: 1000px) { html body .shopify-section--header, html body #shopify-section-header, html body .shopify-section-group-header-group > .shopify-section--header, html body .shopify-section-group-index-header-group > .shopify-section--header, html body [id*="header-group"] .shopify-section--header, html body [class*="header-group"] .shopify-section--header, html body header.header, html body .shopify-section--header .header { display: none !important; height: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; visibility: hidden !important; pointer-events: none !important; } html body { --header-height: 0px !important; --header-height-with-bottom: 0px !important; } html body .header, html body .header__wrapper { height: 0 !important; min-height: 0 !important; } :root { --cleanuv-chrome-top: calc(0.45rem + env(safe-area-inset-top, 0px)); --cleanuv-fab-glass-fill: rgba(255, 255, 255, 0.14); --cleanuv-fab-glass-blur: blur(0px) saturate(140%) brightness(100%); } html body #cleanuv-fab { display: flex !important; flex-direction: column; align-items: flex-start; gap: 0.6rem; position: fixed; top: var(--cleanuv-chrome-top); left: calc(0.75rem + env(safe-area-inset-left, 0px)); right: auto; bottom: auto; z-index: 120; pointer-events: none; } html body #cleanuv-fab > * { pointer-events: auto; } html body #cleanuv-fab__toggle, html body #cleanuv-glass-cart, html body #cleanuv-fab__actions a { background: var(--cleanuv-fab-glass-fill) !important; background-color: var(--cleanuv-fab-glass-fill) !important; background-image: none !important; -webkit-backdrop-filter: var(--cleanuv-fab-glass-blur) !important; backdrop-filter: var(--cleanuv-fab-glass-blur) !important; border: 1px solid rgba(255, 255, 255, 0.55) !important; box-shadow: 0 10px 28px rgba(30, 16, 45, 0.12), 0 1px 4px rgba(30, 16, 45, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.75), inset 0 0 0 0.5px rgba(255, 255, 255, 0.35) !important; } html body #cleanuv-fab__toggle { width: 2.85rem; height: 2.85rem; border-radius: 999px; color: #1d1d1f; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 0; transition: transform 0.2s ease, background 0.2s ease, backdrop-filter 0.2s ease; } html body #cleanuv-fab__toggle svg { width: 1.15rem; height: 1.15rem; display: block; } html body #cleanuv-fab.is-open #cleanuv-fab__toggle { background: rgba(255, 255, 255, 0.22) !important; background-color: rgba(255, 255, 255, 0.22) !important; } html body #cleanuv-fab__actions { display: flex; flex-direction: column; align-items: flex-start; gap: 0.5rem; opacity: 0; visibility: hidden; transform: translateY(-0.35rem); transform-origin: top left; transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s; pointer-events: none; } html body #cleanuv-fab.is-open #cleanuv-fab__actions { opacity: 1; visibility: visible; transform: translateY(0); pointer-events: auto; } html body #cleanuv-fab__actions a { display: inline-flex; align-items: center; justify-content: center; min-height: 2.85rem; padding: 0 1.2rem; border-radius: 999px; color: #1d1d1f !important; text-decoration: none !important; font-family: var(--heading-font-family, inherit); font-size: 1.2rem !important; font-weight: 650; letter-spacing: -0.02em; line-height: 1.1; white-space: nowrap; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.35); } html body #cleanuv-glass-cart { display: inline-flex !important; align-items: center; justify-content: center; position: fixed; top: var(--cleanuv-chrome-top); right: calc(0.75rem + env(safe-area-inset-right, 0px)); z-index: 120; width: 2.85rem; height: 2.85rem; border-radius: 999px; color: #1d1d1f; text-decoration: none !important; } html body #cleanuv-glass-cart svg { width: 1.2rem; height: 1.2rem; display: block; } html body #cleanuv-glass-cart__count { position: absolute; top: -0.15rem; right: -0.15rem; min-width: 1.05rem; height: 1.05rem; padding: 0 0.25rem; border-radius: 999px; background: #1d1d1f; color: #fff; font-size: 0.65rem; font-weight: 700; line-height: 1.05rem; text-align: center; } html body #cleanuv-glass-cart__count.is-empty { display: none; } } /* ===== CLEANUV_DESKTOP_CHROME_FAB_ZFIX — beat glass-surface-mock prior hide + ann stacking ===== */ html body #cleanuv-fab, html body #cleanuv-glass-cart { display: flex !important; width: auto !important; height: auto !important; max-width: none !important; max-height: none !important; min-width: 0 !important; overflow: visible !important; pointer-events: none !important; z-index: 120 !important; position: fixed !important; } html body #cleanuv-glass-cart { display: inline-flex !important; width: 2.85rem !important; height: 2.85rem !important; min-width: 2.85rem !important; min-height: 2.85rem !important; max-width: 2.85rem !important; max-height: 2.85rem !important; pointer-events: auto !important; } html body #cleanuv-fab > * { pointer-events: auto !important; } html body #cleanuv-fab__toggle { width: 2.85rem !important; height: 2.85rem !important; display: inline-flex !important; } /* CLEANUV_APPS_CORNER_SHADE_KILL v3+companion-v4 — must load last in runtime (beats earlier glass shadow) */ html body #main .shopify-section--apps > .section, html body #main #shopify-section-1788032682a9637e93 > .section, html body #main [id*="1788032682a9637e93"] > .section, html body #main .shopify-section--apps > .section.section-full, html body #main .shopify-section--apps > .section.bg-gradient { box-shadow: none !important; -webkit-box-shadow: none !important; filter: none !important; /* border can read as dark curve on pink wash — match clean sections without shade */ border: none !important; outline: none !important; } /* Desktop: same tint, slightly denser so product grid behind can’t punch through */ @media screen and (min-width: 1000px) { html body #header-sidebar-menu.drawer::part(content), html body x-drawer#header-sidebar-menu.drawer::part(content), html body #header-sidebar-menu::part(content) { --menu-card-fill: rgba(255, 236, 245, 0.50) !important; background: rgba(255, 236, 245, 0.50) !important; background-color: rgba(255, 236, 245, 0.50) !important; background-image: linear-gradient( 160deg, rgba(255, 236, 245, 0.72) 0%, rgba(255, 210, 230, 0.60) 42%, rgba(248, 220, 240, 0.56) 72%, rgba(245, 228, 255, 0.62) 100% ) !important; } } /* CUV_DRAWER_GLASS_TINT_v3 — force pink frost on hamburger drawer (mobile + desktop) */ html body #header-sidebar-menu.drawer, html body x-drawer#header-sidebar-menu.drawer, html body #header-sidebar-menu { --menu-card-fill: rgba(255, 236, 245, 0.42) !important; --dialog-background: 255, 255, 255 !important; } html body #header-sidebar-menu.drawer::part(content), html body x-drawer#header-sidebar-menu.drawer::part(content), html body #header-sidebar-menu::part(content) { --menu-card-fill: rgba(255, 236, 245, 0.42) !important; --dialog-background: 255, 255, 255 !important; background: rgba(255, 236, 245, 0.42) !important; background-color: rgba(255, 236, 245, 0.42) !important; background-image: linear-gradient( 160deg, rgba(255, 236, 245, 0.64) 0%, rgba(255, 210, 230, 0.52) 42%, rgba(248, 220, 240, 0.48) 72%, rgba(245, 228, 255, 0.54) 100% ) !important; -webkit-backdrop-filter: saturate(185%) blur(22px) !important; backdrop-filter: saturate(185%) blur(22px) !important; border: 1px solid rgba(255, 190, 215, 0.55) !important; border-radius: 24px !important; box-shadow: 0 10px 32px rgba(80, 40, 120, 0.07), 0 1px 3px rgba(40, 20, 60, 0.04), inset 0 1px 0 rgba(255, 255, 255, 0.85) !important; mix-blend-mode: normal !important; filter: none !important; } @media screen and (min-width: 1000px) { html body #header-sidebar-menu.drawer::part(content), html body x-drawer#header-sidebar-menu.drawer::part(content), html body #header-sidebar-menu::part(content) { --menu-card-fill: rgba(255, 236, 245, 0.50) !important; background: rgba(255, 236, 245, 0.50) !important; background-color: rgba(255, 236, 245, 0.50) !important; background-image: linear-gradient( 160deg, rgba(255, 236, 245, 0.72) 0%, rgba(255, 210, 230, 0.60) 42%, rgba(248, 220, 240, 0.56) 72%, rgba(245, 228, 255, 0.62) 100% ) !important; } } /* the-range-bundles-tight */ /* Shop the-range: kill count already in liquid; pull bundles under grid */ html body.template-collection #main .shopify-section:has(.collection__results) { margin-bottom: 0 !important; padding-bottom: 0.15rem !important; } html body.template-collection #main .shopify-section:has(.collection__results) + .shopify-section { margin-top: 0 !important; padding-top: 0 !important; } @media screen and (max-width: 699px) { html body.template-collection #main .shopify-section:has(.collection__results) { padding-bottom: 0 !important; } } /* the-range-bundles-same-gap */ /* Collection → bundles: no extra section chrome; card gap handled in cleanuv-bundles */ html body.template-collection #main .shopify-section:has(.collection__results) { margin-bottom: 0 !important; padding-bottom: 0 !important; } html body.template-collection #main .shopify-section:has(.collection__results) .section-spacing, html body.template-collection #main .shopify-section:has(.collection__results) .section { margin-bottom: 0 !important; padding-bottom: 0 !important; } html body.template-collection #main .shopify-section:has(.collection__results) + .shopify-section { margin-top: 0 !important; padding-top: 0 !important; } /* MOBILE_NO_DRIFT 1789379747 */ @media screen and (max-width: 999px) { html body #cleanuv-ghost-fibers { animation: none !important; transform: none !important; will-change: auto !important; } } /* CLEANUV_HIW_CENTER_v1 */ /* How it works: force centered heading + columns (3 equal spans fill row) */ html body #main .shopify-section--multi-column[id*="how-it-works"] .section-header, html body #main .shopify-section--multi-column[id*="how-it-works"] .section-header .prose, html body #main .shopify-section--multi-column[id*="how-it-works"] .multi-column__item, html body #main .shopify-section--multi-column[id*="how-it-works"] .multi-column__item .v-stack, html body #main .shopify-section--multi-column[id*="how-it-works"] .multi-column__item .prose { text-align: center !important; justify-content: center !important; justify-items: center !important; } html body #main .shopify-section--multi-column[id*="how-it-works"] .multi-column { justify-content: center !important; } @media screen and (min-width: 700px) { html body #main .shopify-section--multi-column[id*="how-it-works"] .multi-column { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: var(--multi-column-list-gap, var(--grid-gutter)); } html body #main .shopify-section--multi-column[id*="how-it-works"] .multi-column__item { grid-column: auto !important; width: 100% !important; max-width: none !important; } } /* CLEANUV_PDP_PHOTO_FILL v4 — keep photo big; modest even inset (shift down, not shrink) */ html body #main [id*="related-products"] .product-card, html body #main [id*="related-products"] product-card, html body #main .shopify-section--related-products-page .product-card { padding-top: 18px !important; padding-inline: 10px !important; overflow: hidden !important; } html body #main [id*="related-products"] .product-card__figure, html body #main .shopify-section--related-products-page .product-card__figure { width: 100% !important; max-width: none !important; margin: 0 !important; border-radius: 18px !important; overflow: hidden !important; } html body #main [id*="related-products"] .product-card__image, html body #main [id*="related-products"] .product-card__image--primary, html body #main [id*="related-products"] .product-card__image--secondary, html body #main .shopify-section--related-products-page .product-card__image { width: 100% !important; border-radius: 18px !important; -webkit-transform: scale(1.08) !important; transform: scale(1.08) !important; -webkit-transform-origin: center center !important; transform-origin: center center !important; object-fit: cover !important; } /* photo-shift-down 1789390847 home-equal-inset */ /* home-equal-inset 1789390978 up-a-bit */ /* home-up-bit 1789390978 */ /* home-up-bit 1789390995 */ /* home-up-bit 1789391028 */ /* home-up-touch 1789391042 */ /* home-up-tiny 1789391081 */ /* home-up-tinytiny 1789391182 */ /* CLEANUV_HOME_DESK_GO_DOWN_v6_1789420975 */ /* ==== END cleanuv-runtime.css ==== */ /* ==== BEGIN cleanuv-apps-corner-fix.css ==== */ /* CLEANUV_APPS_CORNER_SHADE_KILL v5 — no corner shade; do not crush gaps */ html body #main .shopify-section--apps > .section, html body #main [id*="1788032682a9637e93"] > .section, html body #main .shopify-section:has(.jdgm-carousel) > .section { box-shadow: none !important; -webkit-box-shadow: none !important; filter: none !important; border: none !important; outline: none !important; clip-path: none !important; -webkit-clip-path: none !important; } html body #main .shopify-section--apps > .section::before, html body #main .shopify-section--apps > .section::after, html body #main [id*="1788032682a9637e93"] > .section::before, html body #main [id*="1788032682a9637e93"] > .section::after { content: none !important; display: none !important; } /* ==== END cleanuv-apps-corner-fix.css ==== */ /* ==== BEGIN cleanuv-section-join.css ==== */ /* CLEANUV_SECTION_JOIN v10 — comfortable gap like other sections; full rounds; no hairline */ html body #main .shopify-section--multi-column, html body #main .shopify-section--apps, html body #main .shopify-section--featured-collection, html body #main [id*="1788032682a9637e93"], html body #main [id*="__more-than-one"], html body #main .shopify-section:has(.jdgm-carousel), html body #main .shopify-section:has([class*="jdgm-"]) { padding-block: 0.75rem !important; margin: 0 !important; background: transparent !important; border: none !important; box-shadow: none !important; isolation: auto !important; } html body #main .shopify-section--multi-column > .section, html body #main .shopify-section--apps > .section, html body #main .shopify-section--featured-collection > .section, html body #main [id*="1788032682a9637e93"] > .section, html body #main [id*="__more-than-one"] > .section, html body #main .shopify-section:has(.jdgm-carousel) > .section, html body #main .shopify-section:has([class*="jdgm-"]) > .section { border-radius: 28px !important; background: rgba(255, 255, 255, 0.08) !important; background-color: rgba(255, 255, 255, 0.08) !important; background-image: none !important; --gradient: transparent !important; border: none !important; box-shadow: none !important; -webkit-box-shadow: none !important; filter: none !important; outline: none !important; clip-path: none !important; -webkit-clip-path: none !important; } html body #main .shopify-section--multi-column::before, html body #main .shopify-section--multi-column::after, html body #main .shopify-section--apps::before, html body #main .shopify-section--apps::after, html body #main .shopify-section--featured-collection::before, html body #main .shopify-section--featured-collection::after, html body #main [id*="1788032682a9637e93"]::before, html body #main [id*="1788032682a9637e93"]::after, html body #main .shopify-section--multi-column > .section::before, html body #main .shopify-section--multi-column > .section::after, html body #main .shopify-section--apps > .section::before, html body #main .shopify-section--apps > .section::after, html body #main [id*="1788032682a9637e93"] > .section::before, html body #main [id*="1788032682a9637e93"] > .section::after { content: none !important; display: none !important; } html body #main .shopify-section--multi-column + .shopify-section--apps, html body #main .shopify-section--apps + .shopify-section--featured-collection { margin-top: 0 !important; border-top: none !important; } /* v10b PDP + fringe */ html body #main .shopify-section--main-product, html body #main .shopify-section--rich-text, html body #main .shopify-section--related-products-page, html body #main [id*="judgeme-reviews"] { padding-block: 0.75rem !important; background: transparent !important; border: none !important; box-shadow: none !important; } html body #main .shopify-section--main-product > .section, html body #main .shopify-section--rich-text > .section, html body #main .shopify-section--related-products-page > .section, html body #main [id*="judgeme-reviews"] > .section, html body #main .shopify-section--multi-column > .section, html body #main .shopify-section--apps > .section { background-clip: padding-box !important; box-shadow: none !important; border: none !important; outline: none !important; } html body #main .shopify-section + .shopify-section { border-top: 0 !important; } /* CUV_HAIRLINE_KILL_v11_asset — product gap line was box-shadow + border on .section--tight.bg-gradient */ html body #main .shopify-section > .section, html body #main .shopify-section > .section.section-full, html body #main .shopify-section > .section.bg-gradient, html body #main .shopify-section > .section.section--tight, html body #main .shopify-section > .section.section--tight.section-full.bg-gradient, html body #main .shopify-section--main-product > .section, html body #main .shopify-section--main-product > .section.section--tight, html body #main .shopify-section--main-product > .section.section--tight.section-full.bg-gradient, html body #main .shopify-section--apps > .section, html body #main .shopify-section--rich-text > .section, html body #main .shopify-section--multi-column > .section, html body #main .shopify-section--featured-collection > .section, html body #main .shopify-section--related-products-page > .section, html body #main [id*="judgeme-reviews"] > .section, html body #main [id*="1788032682a9637e93"] > .section { border: 0 !important; border-top: 0 !important; border-bottom: 0 !important; border-left: 0 !important; border-right: 0 !important; border-color: transparent !important; box-shadow: none !important; -webkit-box-shadow: none !important; filter: none !important; outline: none !important; --shadow: none !important; --border-color: transparent !important; } /* ==== END cleanuv-section-join.css ==== */ /* ==== BEGIN cleanuv-fibers-motion.css ==== */ /* cleanuv-fibers-motion v5 — clearer drift (still transform-only, no blur animation) */ #cleanuv-ghost-fibers { inset: -160px !important; will-change: transform !important; background-size: 165% 165% !important; pointer-events: none !important; z-index: 0 !important; backface-visibility: hidden !important; -webkit-backface-visibility: hidden !important; isolation: isolate !important; animation-name: cleanuv-fibers-drift !important; animation-duration: 8s, 9s !important; animation-timing-function: ease-in-out, ease-in-out !important; animation-iteration-count: infinite, infinite !important; animation-direction: alternate, alternate !important; animation-fill-mode: both, both !important; } @keyframes cleanuv-fibers-drift { from { transform: translate3d(-18%, -12%, 0) scale(1.16) rotate(-2.4deg); } to { transform: translate3d(18%, 14%, 0) scale(1.28) rotate(2.4deg); } } @keyframes cleanuv-fibers-shift { from{transform:translate3d(0,0,0)} to{transform:translate3d(0,0,0)} } to { background-position: 95% 92%; } } @media (prefers-reduced-motion: reduce) { #cleanuv-ghost-fibers { animation: none !important; transform: none !important; background-size: 100% 100% !important; background-position: center !important; inset: -40px !important; } } html, body { overflow-x: clip !important; overscroll-behavior-x: none !important; } html body #main { position: relative !important; z-index: 1 !important; isolation: isolate !important; transform: translateZ(0); } /* MOBILE_NO_DRIFT 1789379747 — Safari was flashing edges + lagging from drift */ @media screen and (max-width: 999px) { #cleanuv-ghost-fibers { animation: none !important; transform: none !important; will-change: auto !important; background-size: 140% 140% !important; background-position: center center !important; inset: -40px !important; filter: blur(28px) !important; -webkit-filter: blur(28px) !important; } } /* ==== END cleanuv-fibers-motion.css ==== */ /* ==== BEGIN cleanuv-home-mobile.css ==== */ /* Homepage mobile: GO size + how-it-works only. Wash from backup fibers. */ @media screen and (max-width: 749px) { #shopify-section-how-it-works .multi-column, #shopify-section-how-it-works .section { row-gap: 0.75rem !important; } #shopify-section-how-it-works .multi-column__item { margin-bottom: 0.35rem !important; padding-block: 0.35rem !important; } html body #main [id*="__featured-pro"] > .section, html body #main .shopify-section--featured-product > .section { overflow: hidden !important; padding-top: 0.35rem !important; } html body #main [id*="__featured-pro"] { --section-spacing-block-start: 0.35rem !important; } html body #main [id*="__featured-pro"] .product-gallery, html body #main .shopify-section--featured-product .product-gallery, html body #main [id*="__featured-pro"] .product-gallery--mobile-contained { width: calc(100% + 1.6rem) !important; max-width: none !important; margin-left: -0.8rem !important; margin-right: -0.8rem !important; margin-top: 0.15rem !important; border-radius: 26px !important; overflow: hidden !important; } html body #main [id*="__featured-pro"] .product-gallery__media, html body #main .shopify-section--featured-product .product-gallery__media { border-radius: 26px !important; overflow: hidden !important; min-height: 70vw !important; } html body #main [id*="__featured-pro"] .product-gallery__media img, html body #main .shopify-section--featured-product .product-gallery__media img { border-radius: 26px !important; width: 100% !important; height: 100% !important; min-height: 70vw !important; object-fit: cover !important; object-position: center 20% !important; transform: scale(1.06) translateY(1.5%) !important; transform-origin: center top !important; } } /* ==== END cleanuv-home-mobile.css ==== */ /* ==== BEGIN cleanuv-top-lit.css ==== */ /* Announcement: black text, no pink wash; marquee must scroll */ html body .shopify-section--announcement-bar { position: relative !important; z-index: 40 !important; background: transparent !important; background-color: transparent !important; background-image: none !important; overflow: visible !important; } html body .shopify-section--announcement-bar::before, #cleanuv-announce-wash { content: none !important; display: none !important; } html body .shopify-section--announcement-bar .announcement-bar, html body .announcement-bar { background: transparent !important; background-color: transparent !important; background-image: none !important; padding-top: 0.35rem !important; padding-bottom: 0.4rem !important; min-height: 0 !important; box-shadow: none !important; border: none !important; } html body .announcement-bar__scrolling-list, html body marquee-text { overflow: hidden !important; } html body .announcement-bar p, html body .announcement-bar a, html body .announcement-bar .bold, html body .announcement-bar__item, html body .announcement-bar__gap { color: #0a0a0a !important; -webkit-text-fill-color: #0a0a0a !important; opacity: 1 !important; text-shadow: none !important; line-height: 1.4 !important; font-size: 0.9rem !important; margin: 0 !important; } #cleanuv-top-lit { display: none !important; } html body footer.footer, html body .footer, #shopify-section-group-footer-group .section, #shopify-section-group-footer-group .footer, html body [id^="shopify-section-group"][id*="footer"] .section, html body [id^="shopify-section-group"][id*="footer"] .footer { border-radius: 24px !important; overflow: hidden !important; } html, body { overflow-x: clip !important; overscroll-behavior-x: none !important; } html body #main { position: relative !important; z-index: 1 !important; isolation: isolate !important; transform: none !important; } /* Hero center only — do NOT touch wordmark border or line transforms (shine needs them) */ @media screen and (max-width: 999px) { .shopify-section--cleanuv-logo-shine-hero { min-height: 100svh !important; min-height: 100dvh !important; } .shopify-section--cleanuv-logo-shine-hero > .cleanuv-logo-shine-hero, .shopify-section--cleanuv-logo-shine-hero .cleanuv-logo-shine-hero[data-cleanuv-logo-shine-hero] { display: flex !important; align-items: center !important; justify-content: center !important; min-height: 100svh !important; min-height: 100dvh !important; height: 100svh !important; height: 100dvh !important; max-height: none !important; padding: 0 1.25rem !important; box-sizing: border-box !important; } .shopify-section--cleanuv-logo-shine-hero .cleanuv-logo-shine-hero__lockup { height: auto !important; min-height: 0 !important; max-height: none !important; } } /* ==== END cleanuv-top-lit.css ==== */ /* ==== BEGIN cleanuv-buy-liquid-glass.css ==== */ /* CUV_BTN_CENTER_v1 — pink glass; centered labels; loaders absolute; no glare */ html body #main a.button, html body #main button.button, html body #main .button, html body #main .btn, html body #main .button--primary, html body #main button[name="add"], html body #main .product-form__submit, html body #main .shopify-payment-button__button--unbranded, html body #main .buy-buttons .button, html body #main .featured-product .button, html body #main .shopify-section--featured-product .button, html body #main [id*="featured-pro"] .button, html body #main [id$="__hero"] .button, html body #main .shopify-section--image-with-text-overlay .button, html body #main .product-card__quick-buy .button, html body #main .product-card__quick-buy a.button, html body #main .product-card__quick-buy button, html body #main .product-card__quick-buy [is="custom-button"], html body #main .product-card__mobile-quick-buy-button { position: relative !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; text-align: center !important; isolation: isolate !important; overflow: hidden !important; min-height: 3.2rem !important; border-radius: 999px !important; padding: 1rem 2.05rem !important; border: 1.5px solid rgba(255, 255, 255, 0.88) !important; background: rgba(255, 40, 180, 0.52) !important; background-color: rgba(255, 40, 180, 0.52) !important; background-image: none !important; -webkit-backdrop-filter: blur(20px) saturate(180%) !important; backdrop-filter: blur(20px) saturate(180%) !important; color: #0a0a0a !important; -webkit-text-fill-color: #0a0a0a !important; font-weight: 700 !important; letter-spacing: -0.01em !important; text-shadow: none !important; box-shadow: 0 0 10px 2px rgba(255, 0, 199, 0.18), 0 0 22px 4px rgba(230, 0, 170, 0.10), 0 10px 22px rgba(180, 0, 120, 0.16), 0 3px 8px rgba(40, 10, 30, 0.10) !important; animation: none !important; transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.18s ease, filter 0.2s ease !important; z-index: 1 !important; gap: 0 !important; } html body #main a.button::before, html body #main button.button::before, html body #main .button::before, html body #main .btn::before, html body #main .button--primary::before, html body #main button[name="add"]::before, html body #main .product-form__submit::before, html body #main .shopify-payment-button__button--unbranded::before, html body #main .buy-buttons .button::before, html body #main .featured-product .button::before, html body #main .product-card__quick-buy .button::before, html body #main .product-card__quick-buy button::before, html body #main a.button::after, html body #main button.button::after, html body #main .button::after, html body #main .button--primary::after, html body #main button[name="add"]::after, html body #main .product-form__submit::after { content: none !important; display: none !important; background: none !important; background-image: none !important; box-shadow: none !important; opacity: 0 !important; width: 0 !important; height: 0 !important; pointer-events: none !important; } html body #main a.button > *:not(.button__loader):not(.button__feedback), html body #main button.button > *:not(.button__loader):not(.button__feedback), html body #main .button > *:not(.button__loader):not(.button__feedback), html body #main .button--primary > *:not(.button__loader):not(.button__feedback), html body #main button[name="add"] > *:not(.button__loader):not(.button__feedback), html body #main .product-form__submit > *:not(.button__loader):not(.button__feedback), html body #main .product-card__quick-buy .button > *:not(.button__loader):not(.button__feedback), html body #main .product-card__quick-buy button > *:not(.button__loader):not(.button__feedback), html body #main a.button .text-with-icon, html body #main button.button .text-with-icon, html body #main .button .text-with-icon, html body #main .button .button__text, html body #main .product-form__submit .text-with-icon { position: relative !important; z-index: 1 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; text-align: center !important; margin: 0 !important; width: auto !important; max-width: 100% !important; grid-column: auto !important; color: #0a0a0a !important; -webkit-text-fill-color: #0a0a0a !important; fill: #0a0a0a !important; stroke: #0a0a0a !important; gap: 0.35rem !important; } html body #main a.button > .button__loader, html body #main button.button > .button__loader, html body #main .button > .button__loader, html body #main .button > .button__feedback, html body #main button.button > .button__feedback, html body #main a.button > .button__feedback, html body #main .product-form__submit > .button__loader, html body #main .product-form__submit > .button__feedback, html body #main .product-card__quick-buy .button > .button__loader, html body #main .product-card__quick-buy .button > .button__feedback, html body #main .product-card__quick-buy button > .button__loader, html body #main .product-card__mobile-quick-buy-button > .button__loader { position: absolute !important; inset: 0 !important; top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; margin: 0 !important; width: auto !important; height: auto !important; pointer-events: none !important; z-index: 2 !important; } html body #main a.button:hover, html body #main button.button:hover, html body #main .button--primary:hover, html body #main button[name="add"]:hover, html body #main .product-form__submit:hover, html body #main .shopify-payment-button__button--unbranded:hover, html body #main .buy-buttons .button:hover, html body #main .product-card__quick-buy .button:hover, html body #main .product-card__quick-buy button:hover { background: rgba(255, 50, 190, 0.60) !important; background-color: rgba(255, 50, 190, 0.60) !important; background-image: none !important; filter: brightness(1.03) !important; transform: translateY(-1px) !important; box-shadow: 0 0 12px 2px rgba(255, 0, 199, 0.22), 0 0 24px 4px rgba(230, 0, 170, 0.12), 0 12px 24px rgba(180, 0, 120, 0.18) !important; } html body #main a.button:active, html body #main button.button:active, html body #main .button--primary:active, html body #main button[name="add"]:active, html body #main .product-form__submit:active, html body #main .shopify-payment-button__button--unbranded:active, html body #main .buy-buttons .button:active, html body #main a.button.is-pressed, html body #main button.button.is-pressed, html body #main .product-form__submit.is-pressed { background: rgba(220, 0, 160, 0.64) !important; background-color: rgba(220, 0, 160, 0.64) !important; background-image: none !important; transform: translateY(1px) scale(0.985) !important; } html body #main .product-card__quick-buy .button, html body #main .product-card__quick-buy a.button, html body #main .product-card__quick-buy button, html body #main .product-card__quick-buy [is="custom-button"], html body #main .product-card__mobile-quick-buy-button { min-height: 2.5rem !important; padding: 0.65rem 1.15rem !important; } /* ==== END cleanuv-buy-liquid-glass.css ==== */ /* ==== BEGIN cleanuv-hero-fixed-v5.css ==== */ /* hero-fixed: leave announcement room — no full-bleed dvh fight */ @media screen and (max-width:999px){ .shopify-section--cleanuv-logo-shine-hero .cleanuv-logo-shine-hero__wordmark{ border-bottom:none!important;padding-bottom:0!important; } } /* ==== END cleanuv-hero-fixed-v5.css ==== */ /* ==== BEGIN cleanuv-between-cards-line-v1.css ==== */ /* disabled — not on backup */ /* ==== END cleanuv-between-cards-line-v1.css ==== */ /* ==== BEGIN cleanuv-glass-surface-mock.css ==== */ /* cleanuv-glass-surface-mock v11-center — pink frost buttons only (no SVG warp; no desktop cart blow-up) */ :root { --cuv-gs-blur-fallback: 14px; } /* Primary buy / CTA pills inside #main only */ html body #main a.button, html body #main button.button, html body #main .button, html body #main .btn, html body #main .button--primary, html body #main button[name="add"], html body #main .product-form__submit, html body #main .shopify-payment-button__button--unbranded, html body #main .buy-buttons .button, html body #main .featured-product .button, html body #main [id$="__hero"] .button, html body #main .shopify-section--image-with-text-overlay .button { position: relative !important; isolation: isolate !important; overflow: hidden !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; text-align: center !important; border-radius: 999px !important; border: 1px solid rgba(255, 255, 255, 0.75) !important; color: #0a0a0a !important; -webkit-text-fill-color: #0a0a0a !important; text-shadow: none !important; background: rgba(255, 70, 190, 0.32) !important; background-color: rgba(255, 70, 190, 0.32) !important; background-image: none !important; -webkit-backdrop-filter: blur(var(--cuv-gs-blur-fallback)) saturate(1.85) !important; backdrop-filter: blur(var(--cuv-gs-blur-fallback)) saturate(1.85) !important; box-shadow: 0 8px 28px rgba(30, 16, 45, 0.14) !important; padding-left: 1.35rem !important; padding-right: 1.35rem !important; } html body #main a.button .text-with-icon, html body #main button.button .text-with-icon, html body #main .button .text-with-icon, html body #main .button .button__text { display: inline-flex !important; align-items: center !important; justify-content: center !important; margin: 0 !important; text-align: center !important; } /* Quick add: pill only, brighter pink hover, never the wrapper */ html body #main .product-card__quick-buy { background: transparent !important; border: none !important; box-shadow: none !important; outline: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; } html body #main .product-card__quick-buy .button, html body #main .product-card__quick-buy a.button, html body #main .product-card__quick-buy button.button, html body #main .product-card__quick-buy button, html body #main .product-card__quick-buy [is="custom-button"], html body #main .product-card__mobile-quick-buy-button { background: rgba(255, 90, 200, 0.42) !important; background-color: rgba(255, 90, 200, 0.42) !important; background-image: none !important; border-radius: 999px !important; -webkit-backdrop-filter: blur(12px) saturate(1.6) brightness(1.05) !important; backdrop-filter: blur(12px) saturate(1.6) brightness(1.05) !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; text-align: center !important; } html body #main .product-card__quick-buy .button:hover, html body #main .product-card__quick-buy button:hover, html body #main .product-card__quick-buy [is="custom-button"]:hover, html body #main .product-card__mobile-quick-buy-button:hover { background: rgba(255, 110, 210, 0.62) !important; background-color: rgba(255, 110, 210, 0.62) !important; -webkit-backdrop-filter: blur(10px) saturate(1.5) brightness(1.12) !important; backdrop-filter: blur(10px) saturate(1.5) brightness(1.12) !important; } /* FAB / cart: glass chips on ALL viewports (desktop matches cleaner mobile chrome) */ #cleanuv-fab { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 0.6rem !important; position: fixed !important; top: calc(0.45rem + env(safe-area-inset-top, 0px)) !important; left: calc(0.75rem + env(safe-area-inset-left, 0px)) !important; right: auto !important; bottom: auto !important; width: auto !important; height: auto !important; min-width: 0 !important; min-height: 0 !important; max-width: none !important; max-height: none !important; overflow: visible !important; z-index: 120 !important; pointer-events: none !important; } #cleanuv-fab > * { pointer-events: auto !important; } #cleanuv-fab__toggle, #cleanuv-fab__actions a { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 2.85rem !important; height: 2.85rem !important; max-width: 2.85rem !important; max-height: 2.85rem !important; border-radius: 999px !important; background: rgba(255, 255, 255, 0.18) !important; background-image: none !important; border: 1px solid rgba(255, 255, 255, 0.55) !important; -webkit-backdrop-filter: blur(14px) saturate(1.8) brightness(1.08) !important; backdrop-filter: blur(14px) saturate(1.8) brightness(1.08) !important; color: #1d1d1f !important; box-sizing: border-box !important; } #cleanuv-fab__actions a { width: auto !important; max-width: none !important; min-height: 2.85rem !important; height: auto !important; padding: 0 1.2rem !important; font-weight: 650 !important; } #cleanuv-glass-cart { display: inline-flex !important; align-items: center !important; justify-content: center !important; position: fixed !important; top: calc(0.45rem + env(safe-area-inset-top, 0px)) !important; right: calc(0.75rem + env(safe-area-inset-right, 0px)) !important; left: auto !important; width: 2.85rem !important; height: 2.85rem !important; max-width: 2.85rem !important; max-height: 2.85rem !important; min-width: 2.85rem !important; min-height: 2.85rem !important; border-radius: 999px !important; background: rgba(255, 255, 255, 0.18) !important; background-image: none !important; border: 1px solid rgba(255, 255, 255, 0.55) !important; -webkit-backdrop-filter: blur(14px) saturate(1.8) brightness(1.08) !important; backdrop-filter: blur(14px) saturate(1.8) brightness(1.08) !important; color: #1d1d1f !important; z-index: 120 !important; box-sizing: border-box !important; overflow: visible !important; transform: none !important; pointer-events: auto !important; } /* label centering — exclude loaders from flow */ html body #main a.button > .button__loader, html body #main button.button > .button__loader, html body #main .button > .button__loader, html body #main .button > .button__feedback, html body #main button.button > .button__feedback, html body #main a.button > .button__feedback, html body #main .product-form__submit > .button__loader, html body #main .product-form__submit > .button__feedback, html body #main .product-card__quick-buy .button > .button__loader, html body #main .product-card__quick-buy button > .button__loader { position: absolute !important; inset: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; pointer-events: none !important; } html body #main a.button .text-with-icon, html body #main button.button .text-with-icon, html body #main .button .text-with-icon, html body #main .button .button__text, html body #main .product-form__submit .text-with-icon { display: inline-flex !important; align-items: center !important; justify-content: center !important; text-align: center !important; margin: 0 auto !important; grid-column: auto !important; width: auto !important; } /* ==== END cleanuv-glass-surface-mock.css ==== */ /* ==== BEGIN cleanuv-glass-restore-v20.css ==== */ /* neutralized — keep dialed-in menu from backup */ /* ==== END cleanuv-glass-restore-v20.css ==== */ /* ==== BEGIN cleanuv-section-pad-v2.css ==== */ html body #main [id*="__how-it-works"] > .section, html body #main [id*="how-it-works"] > .section, html body #main .shopify-section--multi-column > .section, html body #main [id*="__the-problem"] > .section, html body #main [id*="the-problem"] > .section, html body #main .shopify-section--rich-text > .section { padding-top: clamp(1.05rem, 1.8vw, 1.55rem) !important; padding-bottom: clamp(1.05rem, 1.8vw, 1.55rem) !important; } html body #main [id*="__how-it-works"] .section-header, html body #main [id*="how-it-works"] .section-header, html body #main [id*="__the-problem"] .section-header, html body #main [id*="the-problem"] .section-header { margin-top: 0 !important; margin-bottom: clamp(0.65rem, 1.2vw, 1rem) !important; padding-top: 0 !important; } html body #main [id*="__how-it-works"] .multi-column, html body #main [id*="how-it-works"] .multi-column { padding-bottom: 0.15rem !important; margin-top: 0 !important; } html body #main [id*="__more-than-one"] > .section, html body #main [id*="more-than-one"] > .section, html body #main .shopify-section--featured-collection > .section { padding-top: clamp(2.4rem, 4vw, 3.4rem) !important; padding-bottom: clamp(1.6rem, 3vw, 2.4rem) !important; } html body #main [id*="__more-than-one"] .section-header, html body #main [id*="more-than-one"] .section-header { margin-top: 0.15rem !important; margin-bottom: clamp(1.1rem, 2vw, 1.6rem) !important; } /* ==== END cleanuv-section-pad-v2.css ==== */ /* ==== BEGIN cleanuv-home-edu-violet-v1.css ==== */ html body #main [id*="featured-pro"] .cleanuv-pdp-cta-edu a.button, html body #main [id*="featured-pro"] .cleanuv-pdp-cta-edu .button, html body #main .shopify-section--featured-product .cleanuv-pdp-cta-edu a.button, html body #main .shopify-section--featured-product .cleanuv-pdp-cta-edu .button { background: rgba(186, 160, 255, 0.48) !important; background-color: rgba(186, 160, 255, 0.48) !important; background-image: none !important; border: 1.5px solid rgba(255, 255, 255, 0.88) !important; color: #1b1d23 !important; -webkit-text-fill-color: #1b1d23 !important; -webkit-backdrop-filter: saturate(160%) blur(18px) !important; backdrop-filter: saturate(160%) blur(18px) !important; box-shadow: 0 0 10px 2px rgba(255, 0, 199, 0.18), 0 0 22px 4px rgba(230, 0, 170, 0.10), 0 10px 22px rgba(180, 0, 120, 0.14), 0 3px 8px rgba(40, 10, 30, 0.08) !important; filter: none !important; } html body #main [id*="featured-pro"] .cleanuv-pdp-cta-edu a.button:hover, html body #main [id*="featured-pro"] .cleanuv-pdp-cta-edu .button:hover { background: rgba(170, 140, 255, 0.58) !important; background-color: rgba(170, 140, 255, 0.58) !important; } /* ==== END cleanuv-home-edu-violet-v1.css ==== */ /* ==== BEGIN cleanuv-more-brushes-header-v1.css ==== */ /* More brushes — center title + subtitle (was left-hugging on desktop) */ @media (min-width: 750px) { html body #main [id*="__more-than-one"] .section-header, html body #main [id*="more-than-one"] .section-header, html body #main .shopify-section--featured-collection[id*="more-than-one"] .section-header { display: grid !important; justify-items: center !important; justify-content: center !important; text-align: center !important; width: 100% !important; margin-inline: auto !important; padding-inline: clamp(1.5rem, 4vw, 3rem) !important; } html body #main [id*="__more-than-one"] .section-header .prose, html body #main [id*="more-than-one"] .section-header .prose { text-align: center !important; margin-inline: auto !important; max-width: min(42rem, 100%) !important; } html body #main [id*="__more-than-one"] .section-header h2, html body #main [id*="more-than-one"] .section-header h2, html body #main [id*="__more-than-one"] .section-header .h2, html body #main [id*="more-than-one"] .section-header .h2, html body #main [id*="__more-than-one"] .section-header .prose p, html body #main [id*="more-than-one"] .section-header .prose p { text-align: center !important; margin-inline: auto !important; } } /* Mobile too — keep consistent with How it works */ @media (max-width: 749px) { html body #main [id*="__more-than-one"] .section-header, html body #main [id*="more-than-one"] .section-header { text-align: center !important; justify-items: center !important; } html body #main [id*="__more-than-one"] .section-header .prose, html body #main [id*="more-than-one"] .section-header .prose { text-align: center !important; } } /* ==== END cleanuv-more-brushes-header-v1.css ==== */ /* ==== BEGIN cleanuv-safari-wash.css ==== */ /* cleanuv-safari-wash v4 1789379747 — static wash on iOS; no drift flash */ @supports (-webkit-touch-callout: none) { html { background-color: #f6cff4 !important; background: #f6cff4 !important; } body { background: transparent !important; background-color: transparent !important; } #cleanuv-ghost-fibers { animation: none !important; -webkit-animation: none !important; transform: none !important; -webkit-transform: translateZ(0) !important; will-change: auto !important; inset: -40px !important; background-position: center center !important; background-size: 140% 140% !important; } } @media screen and (max-width: 999px) { #cleanuv-ghost-fibers { animation: none !important; transform: none !important; will-change: auto !important; } } /* ==== END cleanuv-safari-wash.css ==== */ /* CUV_HEADER_LOGO_LINE_KILL_v1 — mobile Safari: kill black+pink lines under header CleanUV Co. wordmark */ @media screen and (max-width: 999px) { html body .header__logo, html body .header__logo a, html body .header__logo .header__logo-text, html body .header__logo .cleanuv-logo-mock, html body .header__logo .cleanuv-logo-mock__co { text-decoration: none !important; text-decoration-line: none !important; border: 0 !important; border-bottom: 0 !important; box-shadow: none !important; background-image: none !important; -webkit-text-decoration-line: none !important; } html body .header__logo::before, html body .header__logo::after, html body .header__logo a::before, html body .header__logo a::after, html body .header__logo .header__logo-text::before, html body .header__logo .header__logo-text::after, html body .header__logo .cleanuv-logo-mock::before, html body .header__logo .cleanuv-logo-mock::after { content: none !important; display: none !important; width: 0 !important; height: 0 !important; margin: 0 !important; border: 0 !important; background: none !important; box-shadow: none !important; } html body .shopify-section--header, html body .shopify-section--header .header, html body .header__wrapper { border-bottom: 0 !important; box-shadow: none !important; } html body .shopify-section--header::before, html body .shopify-section--header::after, html body .shopify-section--header .header::before, html body .shopify-section--header .header::after, html body .header__wrapper::before, html body .header__wrapper::after { content: none !important; display: none !important; border: 0 !important; box-shadow: none !important; background: none !important; height: 0 !important; } } /* CUV_HEADER_H1_UNDERLINE_KILL_v1 — header logo is sometimes

; do not inherit page-title pink ::after */ html body h1.header__logo::before, html body h1.header__logo::after, html body .header__logo.h1::before, html body .header__logo.h1::after, html body .header h1.header__logo::before, html body .header h1.header__logo::after, html body .shopify-section--header h1::before, html body .shopify-section--header h1::after, html body store-header h1::before, html body store-header h1::after { content: none !important; display: none !important; width: 0 !important; height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; box-shadow: none !important; } html body h1.header__logo, html body .header h1.header__logo { border-bottom: 0 !important; box-shadow: none !important; text-decoration: none !important; background-image: none !important; } /* CUV_CHROME_LIVE_JOIN_v1 — header/announcement join live fibers */ html body .shopify-section--announcement-bar, html body .announcement-bar, html body .announcement-bar__container, html body .shopify-section--header, html body .header, html body .header__wrapper, html body .shopify-section--header .header, html body [id^="shopify-section-group"][id*="header"], html body [id^="shopify-section-group"][id*="header"] .header, html body [id^="shopify-section-group"][id*="header"] .header__wrapper { background: transparent !important; background-color: transparent !important; background-image: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; border: 0 !important; border-bottom: 0 !important; box-shadow: none !important; --header-background-opacity: 0 !important; } /* CUV_FOOTER_LIVE_JOIN_v2 — kill footer card plate/radius (#ababaf / frost / 24px/41px clip) */ html body [id^="shopify-section-group"][id*="footer"], html body [id^="shopify-section-group"][id*="footer"] .shopify-section, html body [id^="shopify-section-group"][id*="footer"] .section, html body [id^="shopify-section-group"][id*="footer"] .footer, html body [id^="shopify-section-group"][id*="footer"] .footer__aside, html body [id^="shopify-section-group"][id*="footer"] .footer__aside-bottom, html body .shopify-section-group-index-footer-group, html body .shopify-section-group-index-footer-group .shopify-section, html body .shopify-section-group-index-footer-group .section, html body .shopify-section-group-index-footer-group .footer, html body .shopify-section-group-footer-group, html body .shopify-section-group-footer-group .section, html body .shopify-section-group-footer-group .footer, html body #shopify-section-group-footer-group, html body #shopify-section-group-footer-group .section, html body #shopify-section-group-footer-group .footer, html body .shopify-section--footer, html body .shopify-section--footer > .section, html body footer.footer, html body .footer, html body [id*="ftr_"].shopify-section, html body [id*="ftr_"] > .section, html body #main [id*="ftr_"] > .section, html body .shopify-section:has([class*="ai-gradient-footer"]), html body .shopify-section:has([class*="ai-gradient-footer"]) > .section, html body .shopify-section:has([class*="ai-gradient-footer"]) > .section.bg-gradient { background: transparent !important; background-color: transparent !important; background-image: none !important; --background: 255 255 255 / 0 !important; --gradient: none !important; --gradient-background: transparent !important; border: 0 !important; border-top: 0 !important; border-radius: 0 !important; overflow: visible !important; box-shadow: none !important; -webkit-box-shadow: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; filter: none !important; outline: none !important; } html body [id^="shopify-section-group"][id*="footer"]::before, html body [id^="shopify-section-group"][id*="footer"]::after, html body [id^="shopify-section-group"][id*="footer"] .section::before, html body [id^="shopify-section-group"][id*="footer"] .section::after, html body footer.footer::before, html body footer.footer::after, html body .footer::before, html body .footer::after, html body [id*="ftr_"]::before, html body [id*="ftr_"]::after, html body [id*="ftr_"] > .section::before, html body [id*="ftr_"] > .section::after { content: none !important; display: none !important; background: none !important; box-shadow: none !important; border: 0 !important; height: 0 !important; opacity: 0 !important; } /* CUV_EDGE_WASH_v3 — Bruno: top+bottom seams went WHITE after chrome went fully clear. Keep header/footer transparent (fibers show through), but put a fibers-matched wash on html/body so iOS safe-area / overscroll never flashes bare white. */ html, body { background-color: #f6cff4 !important; background: #f6cff4 !important; } @supports (-webkit-touch-callout: none) { html, body { background-color: #f6cff4 !important; background: #f6cff4 !important; } #cleanuv-ghost-fibers { inset: -80px !important; background-color: #f6cff4 !important; } } @media screen and (max-width: 999px) { #cleanuv-ghost-fibers { inset: -80px !important; background-color: #f6cff4 !important; } /* Kill 1px white hairlines at viewport chrome edges */ html body::before, html body::after { content: none !important; display: none !important; } html body .shopify-section-group-index-header-group, html body [id^="shopify-section-group"][id*="header"], html body [id^="shopify-section-group"][id*="footer"], html body .shopify-section-group-index-footer-group { border: 0 !important; box-shadow: none !important; outline: none !important; } } html body #main { isolation: auto !important; background: transparent !important; background-color: transparent !important; } /* CUV_MOBILE_SOFT_DRIFT_v6 — REAL motion: do NOT set transform:!important (kills keyframes). Beats MOBILE_NO_DRIFT + safari-wash. Pink underlay stays for edge fill. */ @keyframes cleanuv-fibers-drift-soft { from { transform: translate3d(-26%, -18%, 0) scale(1.22) rotate(-3.2deg); } to { transform: translate3d(26%, 20%, 0) scale(1.38) rotate(3.2deg); } } @keyframes cleanuv-fibers-shift-soft { from{transform:translate3d(0,0,0)} to{transform:translate3d(0,0,0)} } to { background-position: 100% 100%; } } html, body { background-color: #f6cff4 !important; background: #f6cff4 !important; } @media screen and (max-width: 999px) { html body #cleanuv-ghost-fibers { animation-name: cleanuv-fibers-drift-soft !important; animation-duration: 6.5s, 7.5s !important; animation-timing-function: ease-in-out, ease-in-out !important; animation-iteration-count: infinite, infinite !important; animation-direction: alternate, alternate !important; animation-fill-mode: both, both !important; animation-play-state: running !important; -webkit-animation-name: cleanuv-fibers-drift-soft !important; -webkit-animation-duration: 6.5s, 7.5s !important; -webkit-animation-timing-function: ease-in-out, ease-in-out !important; -webkit-animation-iteration-count: infinite, infinite !important; -webkit-animation-direction: alternate, alternate !important; -webkit-animation-fill-mode: both, both !important; -webkit-animation-play-state: running !important; will-change: transform !important; inset: -200px !important; top: -200px !important; right: -200px !important; bottom: -200px !important; left: -200px !important; background-size: 180% 180% !important; background-color: #f6cff4 !important; filter: blur(28px) !important; -webkit-filter: blur(28px) !important; } } @supports (-webkit-touch-callout: none) { html, body { background-color: #f6cff4 !important; background: #f6cff4 !important; } html body #cleanuv-ghost-fibers { animation-name: cleanuv-fibers-drift-soft !important; animation-duration: 6.5s, 7.5s !important; animation-timing-function: ease-in-out, ease-in-out !important; animation-iteration-count: infinite, infinite !important; animation-direction: alternate, alternate !important; animation-fill-mode: both, both !important; animation-play-state: running !important; -webkit-animation-name: cleanuv-fibers-drift-soft !important; -webkit-animation-duration: 6.5s, 7.5s !important; -webkit-animation-timing-function: ease-in-out, ease-in-out !important; -webkit-animation-iteration-count: infinite, infinite !important; -webkit-animation-direction: alternate, alternate !important; -webkit-animation-fill-mode: both, both !important; -webkit-animation-play-state: running !important; will-change: transform !important; inset: -200px !important; top: -200px !important; right: -200px !important; bottom: -200px !important; left: -200px !important; background-size: 180% 180% !important; background-color: #f6cff4 !important; } }