/** Shopify CDN: Minification failed

Line 13:35361 Unexpected "$"
Line 553:14 Unexpected "2026"

**/

@font-face{font-family:'Silk Serif Text';src:url(//zendwellness.com/cdn/shop/t/63/assets/SilkSerifText-Regular.woff2?v=121761141441539522031790888243) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Assistant';src:url(//zendwellness.com/cdn/shop/t/63/assets/Assistant-Regular.woff2?v=139933315576396517991790887939) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Assistant';src:url(//zendwellness.com/cdn/shop/t/63/assets/Assistant-Regular.woff2?v=139933315576396517991790887939) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Assistant';src:url(//zendwellness.com/cdn/shop/t/63/assets/Assistant-Bold.woff2?v=118094235551713650731790887939) format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Assistant';src:url(//zendwellness.com/cdn/shop/t/63/assets/Assistant-Bold.woff2?v=118094235551713650731790887939) format('woff2');font-weight:700;font-style:normal;font-display:swap}
:root{}@layer{[data-react-aria-pressable]{touch-action:pan-x pan-y pinch-zoom}}body{transition:opacity ease-in 0.2s}*,:before,:after,::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0#0000;--tw-ring-shadow:0 0#0000;--tw-shadow:0 0#0000;--tw-shadow-colored:0 0#0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border:0 solid #e5e7eb}:before,:after{--tw-content:""}html,:host{-webkit-text-size-adjust:100%;tab-size:4;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}body{margin:0}hr{color:inherit;border-top-width:1px}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}strong{font-weight:bolder}button,input{font-feature-settings:inherit;font-variation-settings:inherit;font-family:inherit;font-weight:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button{-webkit-appearance:button;background-color:#0000;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}h1,h2,h3,h4,hr,p{margin:0}ul{margin:0;padding:0;list-style:none}input::-moz-placeholder{opacity:1;color:#9ca3af}textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,iframe{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}:root{color:hsl(var(--heroui-foreground));background-color:hsl(var(--heroui-background))}.border{border-color:hsl(var(--heroui-border-color));border-left-width:var(--heroui-border-width)!important;border-right-width:var(--heroui-border-width)!important;border-top-width:var(--heroui-border-width)!important;border-bottom-width:var(--heroui-border-width)!important}.border-t{border-color:hsl(var(--heroui-border-color));border-top-width:var(--heroui-border-width)!important}.\!rounded-button{border-radius:var(--heroui-radius-button,var(--heroui-radius-medium))!important}.rounded-button{border-radius:var(--heroui-radius-button,var(--heroui-radius-medium))}.shadow-button{box-shadow:var(--heroui-button-shadow,none)}.bg-button{background-color:hsl(var(--heroui-button-primary-background,var(--heroui-primary)))}.text-button-foreground{color:hsl(var(--heroui-button-primary-foreground,var(--heroui-primary-foreground)))}.bg-surface{background-color:hsl(var(--jurni-surface1Bg,var(--heroui-surface-background,0 0% 100%)))}.product-bg-background{background-color:hsl(var(--heroui-product-background,0 0% 100%))}.text-product-foreground{color:hsl(var(--heroui-product-foreground,0 0% 0%))}.border-button{border-color:hsl(var(--heroui-button-border-color,0 0% 0%));border-width:var(--heroui-button-border-width,1px)}.text-foreground-hero{color:hsl(var(--heroui-hero-foreground))}.border-announcement-bar{border-bottom-width:1px}.bg-footer{background-color:hsl(var(--heroui-footer-background))}.text-foreground-footer{color:hsl(var(--heroui-footer-foreground))}.border-footer{border-color:hsl(var(--heroui-footer-border-color));border-top-width:1px}.bg-navbar{background-color:hsl(var(--heroui-navbar-background))}.text-foreground-navbar{color:hsl(var(--heroui-navbar-foreground))}.border-navbar{border-color:hsl(var(--heroui-navbar-border-color))}.bg-faq{background-color:hsl(var(--heroui-faq-background,var(--heroui-background)))}.text-foreground-faq{color:hsl(var(--heroui-faq-foreground,var(--heroui-foreground)))}.border-image{border-color:hsl(var(--heroui-image-border-color,0 0% 0%/0%))}.pointer-events-none{pointer-events:none}.\!static{position:static!important}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0}.inset-x-0{left:0;right:0}.bottom-0{bottom:0}.left-0{left:0}.left-1\/2{left:50%}.left-2{left:.5rem}.right-3{right:.75rem}.top-0{top:0}.top-1\/2{top:50%}.top-2{top:.5rem}.\!z-auto{z-index:auto!important}.z-0{z-index:0}.z-10{z-index:10}.z-20{z-index:20}.z-40{z-index:40}.z-50{z-index:50}.z-\[1\]{z-index:1}.m-0{margin:0}.mx-auto{margin-left:auto;margin-right:auto}.-ml-4{margin-left:-1rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.box-border{box-sizing:border-box}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.aspect-auto{aspect-ratio:auto}.h-1{height:.25rem}.h-10{height:2.5rem}.h-16{height:4rem}.h-20{height:5rem}.h-5{height:1.25rem}.h-7{height:1.75rem}.h-8{height:2rem}.h-\[18px\]{height:18px}.h-\[1px\]{height:1px}.h-\[2px\]{height:2px}.h-\[350px\]{height:350px}.h-\[55px\]{height:55px}.h-\[var\(--navbar-height\)\]{height:var(--navbar-height)}.h-auto{height:auto}.h-divider{height:var(--heroui-divider-weight)}.h-full{height:100%}.max-h-\[100px\]{max-height:100px}.max-h-\[200px\]{max-height:200px}.max-h-\[450px\]{max-height:450px}.max-h-\[75vh\]{max-height:75vh}.max-h-\[800px\]{max-height:800px}.min-h-12{min-height:3rem}.min-h-8{min-height:2rem}.min-h-\[200px\]{min-height:200px}.min-h-\[500px\]{min-height:500px}.w-16{width:4rem}.w-5{width:1.25rem}.w-7{width:1.75rem}.w-8{width:2rem}.w-\[18px\]{width:18px}.w-\[55px\]{width:55px}.w-auto{width:auto}.w-fit{width:fit-content}.w-full{width:100%}.min-w-0{min-width:0}.min-w-16{min-width:4rem}.min-w-6{min-width:1.5rem}.min-w-\[min\(180px\,100\%\)\]{min-width:min(180px,100%)}.max-w-\[1140px\]{max-width:1140px}.max-w-\[1280px\]{max-width:1280px}.max-w-\[1400px\]{max-width:1400px}.max-w-\[200px\]{max-width:200px}.max-w-\[400px\]{max-width:400px}.max-w-\[800px\]{max-width:800px}.max-w-\[calc\(100\%-12px\)\]{max-width:calc(100% - 12px)}.max-w-fit{max-width:fit-content}.max-w-none{max-width:none}.flex-1{flex:1}.flex-\[0_0_100\%\]{flex:0 0 100%}.flex-shrink-0,.shrink-0{flex-shrink:0}.flex-grow{flex-grow:1}.basis-0{flex-basis:0}.-translate-x-1\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-45{--tw-rotate:45deg}.transform-gpu{transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes appearance-in{0%{opacity:0;transform:translateZ(0) scale(.95)}60%{opacity:.75;backface-visibility:hidden;webkit-font-smoothing:antialiased;transform:translateZ(0) scale(1.05)}to{opacity:1;transform:translateZ(0) scale(1)}}@keyframes blink{0%{opacity:.2}20%{opacity:1}to{opacity:.2}}@keyframes drip-expand{0%{opacity:.2;transform:scale(0)}to{opacity:0;transform:scale(2)}}@keyframes fade-out{0%{opacity:1}to{opacity:.15}}@keyframes indeterminate-bar{0%{transform:translate(-50%) scaleX(.2)}to{transform:translate(100%) scaleX(1)}}@keyframes infinite-slider-ltr{0%{transform:translate(0)}to{transform:translate(calc(-50% - 28px))}}@keyframes infinite-slider-rtl{0%{transform:translate(0)}to{transform:translate(calc(50% + 28px))}}@keyframes pulse{50%{opacity:.5}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes spinner-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes sway{0%{transform:translate(0)}50%{transform:translateY(-150%)}to{transform:translate(0)}}.cursor-grab{cursor:grab}.cursor-pointer{cursor:pointer}.touch-pan-y{--tw-pan-y:pan-y;touch-action:var(--tw-pan-x) var(--tw-pan-y) var(--tw-pinch-zoom)}.select-none{-webkit-user-select:none;user-select:none}.scroll-m-20{scroll-margin:5rem}.list-none{list-style-type:none}.appearance-none{appearance:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.items-start{align-items:flex-start}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.justify-items-center{justify-items:center}.\!gap-0{gap:0!important}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-20{gap:5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.space-y-10>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(2.5rem*calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(2.5rem*var(--tw-space-y-reverse))}.self-center{align-self:center}.overflow-hidden{overflow:hidden}.overflow-visible{overflow:visible}.\!truncate{text-overflow:ellipsis!important;white-space:nowrap!important;overflow:hidden!important}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.whitespace-normal{white-space:normal}.whitespace-nowrap{white-space:nowrap}.whitespace-pre-line{white-space:pre-line}.rounded-full{border-radius:9999px}.rounded-large{border-radius:var(--heroui-radius-large)}.rounded-none{border-radius:0}.rounded-small{border-radius:var(--heroui-radius-small)}.border{border-width:1px}.border-medium{border-width:var(--heroui-border-width-medium)}.border-b-1{border-bottom-width:1px}.border-solid{border-style:solid}.border-none{border-style:none}.border-default{--tw-border-opacity:1;border-color:hsl(var(--heroui-default)/var(--heroui-default-opacity,var(--tw-border-opacity)))}.border-foreground\/20{border-color:hsl(var(--heroui-foreground)/.2)}.border-transparent{border-color:#0000}.bg-\[hsl\(var\(--heroui-footer-foreground\)\)\]{background-color:hsl(var(--heroui-footer-foreground))}.bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0/var(--tw-bg-opacity,1))}.bg-black\/50{background-color:#00000080}.bg-default-300\/50{background-color:hsl(var(--heroui-default-300)/.5)}.bg-divider{--tw-bg-opacity:1}.bg-inherit{background-color:inherit}.bg-neutral-100{--tw-bg-opacity:1;background-color:rgb(245 245 245/var(--tw-bg-opacity,1))}.bg-primary{--tw-bg-opacity:1}.bg-transparent{background-color:#0000}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.bg-opacity-50{--tw-bg-opacity:.5}.fill-\[hsl\(var\(--heroui-star-color\)\)\]{fill:hsl(var(--heroui-star-color))}.fill-white{fill:#fff}.object-contain{-o-object-fit:contain;object-fit:contain}.object-cover{-o-object-fit:cover;object-fit:cover}.object-top{-o-object-position:top;object-position:top}.p-0{padding:0}.p-0\.5{padding:.125rem}.p-10{padding:2.5rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.px-0{padding-left:0;padding-right:0}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.pb-4{padding-bottom:1rem}.pl-4{padding-left:1rem}.text-center{text-align:center}.text-start{text-align:start}.\!text-medium{font-size:var(--heroui-font-size-medium)!important;line-height:var(--heroui-line-height-medium)!important}.\!text-small{font-size:var(--heroui-font-size-small)!important;line-height:var(--heroui-line-height-small)!important}.\!text-tiny{font-size:var(--heroui-font-size-tiny)!important;line-height:var(--heroui-line-height-tiny)!important}.\!text-xs{font-size:.75rem!important;line-height:1rem!important}.text-\[100\%\]{font-size:100%}.text-medium{font-size:var(--heroui-font-size-medium);line-height:var(--heroui-line-height-medium)}.text-small{font-size:var(--heroui-font-size-small);line-height:var(--heroui-line-height-small)}.text-tiny{font-size:var(--heroui-font-size-tiny);line-height:var(--heroui-line-height-tiny)}.text-xs{font-size:.75rem;line-height:1rem}.\!font-medium{font-weight:500!important}.\!font-normal{font-weight:400!important}.font-bold{font-weight:700}.font-light{font-weight:300}.font-medium{font-weight:500}.font-normal{font-weight:400}.uppercase{text-transform:uppercase}.leading-\[1\.15\]{line-height:1.15}.text-\[hsl\(var\(--heroui-star-color\)\)\]{color:hsl(var(--heroui-star-color))}.text-current{color:currentColor}.text-default-foreground{--tw-text-opacity:1;color:hsl(var(--heroui-default-foreground)/var(--heroui-default-foreground-opacity,var(--tw-text-opacity)))}.text-foreground{--tw-text-opacity:1;color:hsl(var(--heroui-foreground)/var(--heroui-foreground-opacity,var(--tw-text-opacity)))}.text-primary-foreground{--tw-text-opacity:1}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.no-underline{text-decoration-line:none}.underline-offset-4{text-underline-offset:4px}.subpixel-antialiased{-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto}.opacity-0{opacity:0}.opacity-100{opacity:1}.opacity-20{opacity:.2}.opacity-60{opacity:.6}.opacity-70{opacity:.7}.opacity-75{opacity:.75}.opacity-\[0\.0001\]{opacity:.0001}.shadow-none{--tw-shadow:0 0#0000;--tw-shadow-colored:0 0#0000;box-shadow:var(--tw-ring-offset-shadow,0 0#0000),var(--tw-ring-shadow,0 0#0000),var(--tw-shadow)}.outline-none{outline-offset:2px;outline:2px solid #0000}.backdrop-blur-lg{--tw-backdrop-blur:blur(16px)}.backdrop-blur-sm{--tw-backdrop-blur:blur(4px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.backdrop-saturate-150{--tw-backdrop-saturate:saturate(1.5);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.\!transition-none{transition-property:none!important}.transition-all{transition-property:all;transition-duration:.25s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-duration:.25s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-none{transition-property:none}.transition-opacity{transition-property:opacity;transition-duration:.25s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--heroui-background:210 40% 98.04%;--heroui-foreground-50:0 0% 98.04%;--heroui-foreground-100:240 4.76% 95.88%;--heroui-foreground-200:240 5.88% 90%;--heroui-foreground-300:240 4.88% 83.92%;--heroui-foreground-400:240 5.03% 64.9%;--heroui-foreground-500:240 3.83% 46.08%;--heroui-foreground-600:240 5.2% 33.92%;--heroui-foreground-700:240 5.26% 26.08%;--heroui-foreground-800:240 3.7% 15.88%;--heroui-foreground-900:240 5.88% 10%;--heroui-foreground:201.82 24.44% 8.82%;--heroui-divider:0 0% 6.67%;--heroui-divider-opacity:.15;--heroui-focus:212.02 100% 46.67%;--heroui-overlay:0 0% 0%;--heroui-content1:0 0% 100%;--heroui-content1-foreground:201.82 24.44% 8.82%;--heroui-content2:240 4.76% 95.88%;--heroui-content2-foreground:240 3.7% 15.88%;--heroui-content3:240 5.88% 90%;--heroui-content3-foreground:240 5.26% 26.08%;--heroui-content4:240 4.88% 83.92%;--heroui-content4-foreground:240 5.2% 33.92%;--heroui-default-50:0 0% 98.04%;--heroui-default-100:240 4.76% 95.88%;--heroui-default-200:240 5.88% 90%;--heroui-default-300:240 4.88% 83.92%;--heroui-default-400:240 5.03% 64.9%;--heroui-default-500:240 3.83% 46.08%;--heroui-default-600:240 5.2% 33.92%;--heroui-default-700:240 5.26% 26.08%;--heroui-default-800:240 3.7% 15.88%;--heroui-default-900:240 5.88% 10%;--heroui-default-foreground:0 0% 0%;--heroui-default:240 4.88% 83.92%;--heroui-primary-50:210 40% 98.04%;--heroui-primary-100:210 40% 96.08%;--heroui-primary-200:214.29 31.82% 91.37%;--heroui-primary-300:212.73 26.83% 83.92%;--heroui-primary-400:215 20.22% 65.1%;--heroui-primary-500:215.38 16.32% 46.86%;--heroui-primary-600:215.29 19.32% 34.51%;--heroui-primary-700:215.29 25% 26.67%;--heroui-primary-800:217.24 32.58% 17.45%;--heroui-primary-900:222.22 47.37% 11.18%;--heroui-primary-foreground:0 0% 100%;--heroui-primary:0 0% 0%;--heroui-secondary-50:270 61.54% 94.9%;--heroui-secondary-100:270 59.26% 89.41%;--heroui-secondary-200:270 59.26% 78.82%;--heroui-secondary-300:270 59.26% 68.24%;--heroui-secondary-400:270 59.26% 57.65%;--heroui-secondary-500:270 66.67% 47.06%;--heroui-secondary-600:270 66.67% 37.65%;--heroui-secondary-700:270 66.67% 28.24%;--heroui-secondary-800:270 66.67% 18.82%;--heroui-secondary-900:270 66.67% 9.41%;--heroui-secondary-foreground:0 0% 100%;--heroui-secondary:140 80.49% 24.12%;--heroui-success-50:146.67 64.29% 94.51%;--heroui-success-100:145.71 61.4% 88.82%;--heroui-success-200:146.2 61.74% 77.45%;--heroui-success-300:145.79 62.57% 66.47%;--heroui-success-400:146.01 62.45% 55.1%;--heroui-success-500:145.96 79.46% 43.92%;--heroui-success-600:146.01 79.89% 35.1%;--heroui-success-700:145.79 79.26% 26.47%;--heroui-success-800:146.2 79.78% 17.45%;--heroui-success-900:145.71 77.78% 8.82%;--heroui-success-foreground:0 0% 100%;--heroui-success:145.96 79.46% 43.92%;--heroui-warning-50:54.55 91.67% 95.29%;--heroui-warning-100:37.14 91.3% 90.98%;--heroui-warning-200:37.14 91.3% 81.96%;--heroui-warning-300:36.96 91.24% 73.14%;--heroui-warning-400:37.01 91.26% 64.12%;--heroui-warning-500:37.03 91.27% 55.1%;--heroui-warning-600:37.01 74.22% 44.12%;--heroui-warning-700:36.96 73.96% 33.14%;--heroui-warning-800:37.14 75% 21.96%;--heroui-warning-900:37.14 75% 10.98%;--heroui-warning-foreground:0 0% 0%;--heroui-warning:37.03 91.27% 55.1%;--heroui-danger-50:339.13 92% 95.1%;--heroui-danger-100:340 91.84% 90.39%;--heroui-danger-200:339.33 90% 80.39%;--heroui-danger-300:339.11 90.6% 70.78%;--heroui-danger-400:339 90% 60.78%;--heroui-danger-500:339.2 90.36% 51.18%;--heroui-danger-600:339 86.54% 40.78%;--heroui-danger-700:339.11 85.99% 30.78%;--heroui-danger-800:339.33 86.54% 20.39%;--heroui-danger-900:340 84.91% 10.39%;--heroui-danger-foreground:0 0% 100%;--heroui-danger:339.2 90.36% 51.18%;--heroui-divider-weight:1px;--heroui-disabled-opacity:.5;--heroui-font-size-tiny:.75rem;--heroui-font-size-small:.875rem;--heroui-font-size-medium:1rem;--heroui-font-size-large:1.125rem;--heroui-line-height-tiny:1rem;--heroui-line-height-small:1.25rem;--heroui-line-height-medium:1.5rem;--heroui-line-height-large:1.75rem;--heroui-radius-small:8px;--heroui-radius-medium:12px;--heroui-radius-large:14px;--heroui-border-width-small:1px;--heroui-border-width-medium:2px;--heroui-border-width-large:3px;--heroui-box-shadow-small:0px 2px 15px -6px #0000001a;--heroui-box-shadow-medium:0px 0px 15px 0px #00000008,0px 2px 30px 0px #00000014,0px 0px 1px 0px #0000004d;--heroui-box-shadow-large:0px 0px 30px 0px #0000000a,0px 30px 60px 0px #0000001f,0px 0px 1px 0px #0000004d;--heroui-hover-opacity:.8}.tap-highlight-transparent{-webkit-tap-highlight-color:transparent}.transition-transform-colors{transition-property:transform,color,background,background-color,border-color,text-decoration-color,fill,stroke;transition-duration:.25s;transition-timing-function:ease}.transition-transform-colors-opacity{transition-property:transform,color,background,background-color,border-color,text-decoration-color,fill,stroke,opacity;transition-duration:.25s;transition-timing-function:ease}body{font-size:var(--text-paragraph-fontSize);font-family:var(--text-paragraph-fontFamily);font-weight:var(--text-paragraph-fontWeight);text-transform:var(--text-paragraph-textTransform);line-height:var(--text-paragraph-lineHeight,28px);letter-spacing:var(--text-paragraph-letterSpacing,0);-webkit-font-smoothing:antialiased}h1{text-transform:var(--text-heading1-textTransform);letter-spacing:var(--text-heading1-letterSpacing,-.025em)}h2{font-size:var(--text-heading2-fontSize);font-family:var(--text-heading2-fontFamily);font-weight:var(--text-heading2-fontWeight);text-transform:var(--text-heading2-textTransform);line-height:var(--text-heading2-lineHeight,36px);letter-spacing:var(--text-heading2-letterSpacing,-.025em)}h4{text-transform:var(--text-heading4-textTransform);letter-spacing:var(--text-heading4-letterSpacing,0)}p{text-transform:var(--text-paragraph-textTransform);letter-spacing:var(--text-paragraph-letterSpacing,0)}button{font-size:var(--text-button-fontSize);font-family:var(--text-button-fontFamily);font-weight:var(--text-button-fontWeight);text-transform:var(--text-button-textTransform);line-height:var(--text-button-lineHeight,24px);letter-spacing:var(--text-button-letterSpacing,0)}@keyframes accordion-down{0%{height:0}to{height:var(--radix-accordion-content-height)}}@keyframes accordion-up{0%{height:var(--radix-accordion-content-height)}to{height:0}}.before\:top-\[calc\(-1\*var\(--top-extension\,16px\)\)\]:before{content:var(--tw-content);top:calc(-1*var(--top-extension,16px))}.before\:h-\[var\(--top-extension\,16px\)\]:before{content:var(--tw-content);height:var(--top-extension,16px)}@keyframes shimmer{to{content:var(--tw-content);transform:translate(100%)}}.after\:bottom-\[calc\(-1\*var\(--bottom-extension\,16px\)\)\]:after{content:var(--tw-content);bottom:calc(-1*var(--bottom-extension,16px))}.after\:h-\[var\(--bottom-extension\,16px\)\]:after{content:var(--tw-content);height:var(--bottom-extension,16px)}.after\:shadow-\[0_1px_0px_0_rgba\(0\,0\,0\,0\.05\)\]:after{content:var(--tw-content);--tw-shadow:0 1px 0px 0#0000000d;--tw-shadow-colored:0 1px 0px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0#0000),var(--tw-ring-shadow,0 0#0000),var(--tw-shadow)}.hover\:scale-105:hover{--tw-scale-x:1.05;--tw-scale-y:1.05;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:underline:hover{text-decoration-line:underline}.hover\:opacity-80:hover{opacity:.8}.hover\:opacity-hover:hover{opacity:var(--heroui-hover-opacity)}.active\:opacity-disabled:active{opacity:var(--heroui-disabled-opacity)}.disabled\:cursor-default:disabled{cursor:default}.data-\[justify\=end\]\:flex-grow[data-justify=end]{flex-grow:1}.data-\[justify\=end\]\:basis-0[data-justify=end]{flex-basis:0}.data-\[orientation\=horizontal\]\:flex-row[data-orientation=horizontal]{flex-direction:row}.data-\[justify\=end\]\:justify-end[data-justify=end]{justify-content:flex-end}.data-\[selected\]\:border-foreground[data-selected]{--tw-border-opacity:1;border-color:hsl(var(--heroui-foreground)/var(--heroui-foreground-opacity,var(--tw-border-opacity)))}.group[data-selected=true] .group-data-\[selected\=true\]\:border-primary{--tw-border-opacity:1;border-color:hsl(var(--heroui-primary)/var(--heroui-primary-opacity,var(--tw-border-opacity)))}.group[data-selected] .group-data-\[selected\]\:text-primary-foreground{--tw-text-opacity:1;color:hsl(var(--heroui-primary-foreground)/var(--heroui-primary-foreground-opacity,var(--tw-text-opacity)))}@media (prefers-reduced-motion:reduce){.motion-reduce\:transition-none{transition-property:none}}@media (min-width:400px){.xs\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:640px){.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (min-width:768px){.md\:absolute{position:absolute}.md\:inset-0{inset:0}.md\:me-4{margin-inline-end:1rem}.md\:mt-0{margin-top:0}.md\:block{display:block}.md\:flex{display:flex}.md\:h-20{height:5rem}.md\:h-\[18px\]{height:18px}.md\:h-auto{height:auto}.md\:h-fit{height:fit-content}.md\:h-full{height:100%}.md\:max-h-\[85vh\]{max-height:85vh}.md\:max-h-none{max-height:none}.md\:min-h-\[650px\]{min-height:650px}.md\:w-1\/2{width:50%}.md\:w-20{width:5rem}.md\:w-\[18px\]{width:18px}.md\:w-auto{width:auto}.md\:w-fit{width:fit-content}.md\:w-full{width:100%}.md\:min-w-\[180px\]{min-width:180px}.md\:min-w-\[400px\]{min-width:400px}.md\:max-w-80{max-width:20rem}.md\:max-w-\[300px\]{max-width:300px}.md\:max-w-\[450px\]{max-width:450px}.md\:max-w-\[50\%\]{max-width:50%}.md\:max-w-screen-lg{max-width:1300px}@keyframes infinite-slider-ltr{0%{transform:translate(0)}to{transform:translate(calc(-50% - 28px))}}@keyframes infinite-slider-rtl{0%{transform:translate(0)}to{transform:translate(calc(50% + 28px))}}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:flex-row{flex-direction:row}.md\:flex-row-reverse{flex-direction:row-reverse}.md\:flex-col{flex-direction:column}.md\:items-start{align-items:flex-start}.md\:items-center{align-items:center}.md\:items-stretch{align-items:stretch}.md\:justify-normal{justify-content:normal}.md\:justify-center{justify-content:center}.md\:justify-items-center{justify-items:center}.md\:gap-1\.5{gap:.375rem}.md\:gap-12{gap:3rem}.md\:gap-2{gap:.5rem}.md\:gap-24{gap:6rem}.md\:gap-3{gap:.75rem}.md\:gap-6{gap:1.5rem}.md\:gap-8{gap:2rem}.md\:self-start{align-self:flex-start}.md\:border-b-1{border-bottom-width:1px}.md\:p-0{padding:0}.md\:p-12{padding:3rem}.md\:px-20{padding-left:5rem;padding-right:5rem}.md\:px-6{padding-left:1.5rem;padding-right:1.5rem}.md\:py-14{padding-top:3.5rem;padding-bottom:3.5rem}.md\:pb-20{padding-bottom:5rem}.md\:text-center{text-align:center}.md\:\!text-base{font-size:1rem!important;line-height:1.5rem!important}.group:hover .md\:group-hover\:opacity-100{opacity:1}}@media (min-width:960px){.min-\[960px\]\:sticky{position:sticky}.min-\[960px\]\:top-24{top:6rem}.min-\[960px\]\:flex-row{flex-direction:row}.min-\[960px\]\:items-start{align-items:flex-start}}@media (min-width:1300px){.lg\:h-full{height:100%}.lg\:w-full{width:100%}.lg\:max-w-\[48rem\]{max-width:48rem}.lg\:max-w-\[500px\]{max-width:500px}.lg\:max-w-\[700px\]{max-width:700px}.lg\:p-16{padding:4rem}.lg\:text-5xl{font-size:3rem;line-height:1}}:root{--junipOutlineColor:#637381}[class^=junip-],[class^=junip-] :after,[class^=junip-] :before,[class^=junip-]:after,[class^=junip-]:before{box-sizing:border-box}.junip-product-summary{animation:junipNodeInserted .01s}@keyframes junipNodeInserted{0%{transform:translateZ(1px)}to{transform:translateZ(0)}}:root{--text-heading1-lineHeight:44px;--text-heading1-fontFamily:"Canela";--text-heading1-fontSize:38px;--text-heading1-fontWeight:300;--text-heading2-lineHeight:44px;--text-heading2-fontFamily:"Canela";--text-heading2-fontSize:38px;--text-heading2-fontWeight:300;--text-heading3-lineHeight:31px;--text-heading3-fontFamily:"GeogrotesqueCondBoldWeb";--text-heading3-textTransform:uppercase;--text-heading3-fontSize:22px;--text-heading3-fontWeight:400;--text-heading3-letterSpacing:0.5px;--text-heading4-lineHeight:44px;--text-heading4-fontFamily:"Canela";--text-heading4-fontSize:38px;--text-heading4-fontWeight:300;--text-heading5-lineHeight:24px;--text-heading5-fontFamily:"Inter";--text-heading5-textTransform:none;--text-heading5-fontSize:18px;--text-heading5-fontWeight:600;--text-heading5-letterSpacing:0;--text-heading6-lineHeight:24px;--text-heading6-fontFamily:"Inter";--text-heading6-textTransform:none;--text-heading6-fontSize:16px;--text-heading6-fontWeight:600;--text-heading6-letterSpacing:0;--text-paragraph-lineHeight:24px;--text-paragraph-fontFamily:"RingsideWideWeb";--text-paragraph-fontSize:15px;--text-paragraph-fontWeight:100;--text-paragraph-letterSpacing:0.4px;--text-paragraph2-lineHeight:20px;--text-paragraph2-fontFamily:"Inter";--text-paragraph2-textTransform:none;--text-paragraph2-fontSize:14px;--text-paragraph2-fontWeight:400;--text-paragraph2-letterSpacing:0;--text-button-lineHeight:20px;--text-button-fontFamily:"BaseMonoWideWeb";--text-button-textTransform:uppercase;--text-button-fontSize:15px;--text-button-fontWeight:500;--text-button-letterSpacing:0.4px;--text-muted-lineHeight:20px;--text-muted-fontFamily:"BaseMonoWideWeb"}.fresnel-container{margin:0;padding:0}@media not all and (max-width:767.98px){.fresnel-lessThan-tablet{display:none!important}}@media not all and (min-width:768px){.fresnel-greaterThanOrEqual-tablet{display:none!important}}html{--lumo-base-color:#fff;--lumo-tint-5pct:hsla(0,0%,100%,0.3);--lumo-tint-10pct:hsla(0,0%,100%,0.37);--lumo-tint-20pct:hsla(0,0%,100%,0.44);--lumo-tint-30pct:hsla(0,0%,100%,0.5);--lumo-tint-40pct:hsla(0,0%,100%,0.57);--lumo-tint-50pct:hsla(0,0%,100%,0.64);--lumo-tint-60pct:hsla(0,0%,100%,0.7);--lumo-tint-70pct:hsla(0,0%,100%,0.77);--lumo-tint-80pct:hsla(0,0%,100%,0.84);--lumo-tint-90pct:hsla(0,0%,100%,0.9);--lumo-tint:#fff;--lumo-shade-5pct:hsla(214,61%,25%,0.05);--lumo-shade-10pct:hsla(214,57%,24%,0.1);--lumo-shade-20pct:hsla(214,53%,23%,0.16);--lumo-shade-30pct:hsla(214,50%,22%,0.26);--lumo-shade-40pct:hsla(214,47%,21%,0.38);--lumo-shade-50pct:hsla(214,45%,20%,0.52);--lumo-shade-60pct:hsla(214,43%,19%,0.6);--lumo-shade-70pct:hsla(214,42%,18%,0.69);--lumo-shade-80pct:hsla(214,41%,17%,0.83);--lumo-shade-90pct:hsla(214,40%,16%,0.94);--lumo-shade:hsl(214,35%,15%);--lumo-contrast-5pct:var(--lumo-shade-5pct);--lumo-contrast-10pct:var(--lumo-shade-10pct);--lumo-contrast-20pct:var(--lumo-shade-20pct);--lumo-contrast-30pct:var(--lumo-shade-30pct);--lumo-contrast-40pct:var(--lumo-shade-40pct);--lumo-contrast-50pct:var(--lumo-shade-50pct);--lumo-contrast-60pct:var(--lumo-shade-60pct);--lumo-contrast-70pct:var(--lumo-shade-70pct);--lumo-contrast-80pct:var(--lumo-shade-80pct);--lumo-contrast-90pct:var(--lumo-shade-90pct);--lumo-contrast:var(--lumo-shade);--lumo-header-text-color:var(--lumo-contrast);--lumo-body-text-color:var(--lumo-contrast-90pct);--lumo-secondary-text-color:var(--lumo-contrast-70pct);--lumo-tertiary-text-color:var(--lumo-contrast-50pct);--lumo-disabled-text-color:var(--lumo-contrast-30pct);--lumo-primary-color:hsl(214,100%,48%);--lumo-primary-color-50pct:hsla(214,100%,49%,0.76);--lumo-primary-color-10pct:hsla(214,100%,60%,0.13);--lumo-primary-text-color:hsl(214,100%,43%);--lumo-primary-contrast-color:#fff;--lumo-error-color:hsl(3,85%,48%);--lumo-error-color-50pct:hsla(3,85%,49%,0.5);--lumo-error-color-10pct:hsla(3,85%,49%,0.1);--lumo-error-text-color:hsl(3,89%,42%);--lumo-error-contrast-color:#fff;--lumo-success-color:hsl(145,72%,30%);--lumo-success-color-50pct:hsla(145,72%,31%,0.5);--lumo-success-color-10pct:hsla(145,72%,31%,0.1);--lumo-success-text-color:hsl(145,85%,25%);--lumo-success-contrast-color:#fff}html{--lumo-icons-align-center:"";--lumo-icons-align-left:"";--lumo-icons-align-right:"";--lumo-icons-angle-down:"";--lumo-icons-angle-left:"";--lumo-icons-angle-right:"";--lumo-icons-angle-up:"";--lumo-icons-arrow-down:"";--lumo-icons-arrow-left:"";--lumo-icons-arrow-right:"";--lumo-icons-arrow-up:"";--lumo-icons-bar-chart:"";--lumo-icons-bell:"";--lumo-icons-calendar:"";--lumo-icons-checkmark:"";--lumo-icons-chevron-down:"";--lumo-icons-chevron-left:"";--lumo-icons-chevron-right:"";--lumo-icons-chevron-up:"";--lumo-icons-clock:"";--lumo-icons-cog:"";--lumo-icons-cross:"";--lumo-icons-download:"";--lumo-icons-dropdown:"";--lumo-icons-edit:"";--lumo-icons-error:"";--lumo-icons-eye:"";--lumo-icons-eye-disabled:"";--lumo-icons-menu:"";--lumo-icons-minus:"";--lumo-icons-ordered-list:"";--lumo-icons-phone:"";--lumo-icons-photo:"";--lumo-icons-play:"";--lumo-icons-plus:"";--lumo-icons-redo:"";--lumo-icons-reload:"";--lumo-icons-search:"";--lumo-icons-undo:"";--lumo-icons-unordered-list:"";--lumo-icons-upload:"";--lumo-icons-user:""}html{--lumo-size-xs:1.625rem;--lumo-size-s:1.875rem;--lumo-size-m:2.25rem;--lumo-size-l:2.75rem;--lumo-size-xl:3.5rem;--lumo-icon-size-s:1.25em;--lumo-icon-size-m:1.5em;--lumo-icon-size-l:2.25em;--lumo-icon-size:var(--lumo-icon-size-m)}html{--lumo-space-xs:0.25rem;--lumo-space-s:0.5rem;--lumo-space-m:1rem;--lumo-space-l:1.5rem;--lumo-space-xl:2.5rem;--lumo-space-wide-xs:calc(var(--lumo-space-xs)/2) var(--lumo-space-xs);--lumo-space-wide-s:calc(var(--lumo-space-s)/2) var(--lumo-space-s);--lumo-space-wide-m:calc(var(--lumo-space-m)/2) var(--lumo-space-m);--lumo-space-wide-l:calc(var(--lumo-space-l)/2) var(--lumo-space-l);--lumo-space-wide-xl:calc(var(--lumo-space-xl)/2) var(--lumo-space-xl);--lumo-space-tall-xs:var(--lumo-space-xs) calc(var(--lumo-space-xs)/2);--lumo-space-tall-s:var(--lumo-space-s) calc(var(--lumo-space-s)/2);--lumo-space-tall-m:var(--lumo-space-m) calc(var(--lumo-space-m)/2);--lumo-space-tall-l:var(--lumo-space-l) calc(var(--lumo-space-l)/2);--lumo-space-tall-xl:var(--lumo-space-xl) calc(var(--lumo-space-xl)/2)}html{--lumo-border-radius-s:0.25em;--lumo-border-radius-m:var(--lumo-border-radius,0.25em);--lumo-border-radius-l:0.5em;--lumo-border-radius:0.25em;--lumo-box-shadow-xs:0 1px 4px -1px var(--lumo-shade-50pct);--lumo-box-shadow-s:0 2px 4px -1px var(--lumo-shade-20pct),0 3px 12px -1px var(--lumo-shade-30pct);--lumo-box-shadow-m:0 2px 6px -1px var(--lumo-shade-20pct),0 8px 24px -4px var(--lumo-shade-40pct);--lumo-box-shadow-l:0 3px 18px -2px var(--lumo-shade-20pct),0 12px 48px -6px var(--lumo-shade-40pct);--lumo-box-shadow-xl:0 4px 24px -3px var(--lumo-shade-20pct),0 18px 64px -8px var(--lumo-shade-40pct);--lumo-clickable-cursor:default}$html{--lumo-font-family:-apple-system,BlinkMacSystemFont,"Roboto","Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";--lumo-font-size-xxs:0.75rem;--lumo-font-size-xs:0.8125rem;--lumo-font-size-s:0.875rem;--lumo-font-size-m:1rem;--lumo-font-size-l:1.125rem;--lumo-font-size-xl:1.375rem;--lumo-font-size-xxl:1.75rem;--lumo-font-size-xxxl:2.5rem;--lumo-line-height-xs:1.25;--lumo-line-height-s:1.375;--lumo-line-height-m:1.625}:where(html[dir="ltr"]){--toast-icon-margin-start:-3px;--toast-icon-margin-end:4px;--toast-svg-margin-start:-1px;--toast-svg-margin-end:0px;--toast-button-margin-start:auto;--toast-button-margin-end:0;--toast-close-button-start:0;--toast-close-button-end:unset;--toast-close-button-transform:translate(-35%,-35%)}:where([data-sonner-toast]:focus-visible){box-shadow:0 4px 12px #0000001a,0 0 0 2px #0003}:where([data-sonner-toast]) :where([data-button]):focus-visible{box-shadow:0 0 0 2px #0006}:where([data-sonner-toast]) :where([data-close-button]):focus-visible{box-shadow:0 4px 12px #0000001a,0 0 0 2px #0003}:where([data-sonner-toast]):hover :where([data-close-button]):hover{background:var(--gray2);border-color:var(--gray5)}:where([data-sonner-toast][data-swiping="true"]):before{content:"";position:absolute;left:-50%;right:-50%;height:100%;z-index:-1}:where([data-sonner-toast][data-y-position="top"][data-swiping="true"]):before{bottom:50%;transform:scaleY(3) translateY(50%)}:where([data-sonner-toast][data-y-position="bottom"][data-swiping="true"]):before{top:50%;transform:scaleY(3) translateY(-50%)}:where([data-sonner-toast][data-swiping="false"][data-removed="true"]):before{content:"";position:absolute;inset:0;transform:scaleY(2)}:where([data-sonner-toast]):after{content:"";position:absolute;left:0;height:calc(var(--gap) + 1px);bottom:100%;width:100%}:where([data-sonner-toast][data-removed="true"][data-front="false"]):before{height:calc(var(--initial-height) + 20%)}@keyframes swipe-out-left{0%{transform:var(--y) translate(var(--swipe-amount-x));opacity:1}to{transform:var(--y) translate(calc(var(--swipe-amount-x) - 100%));opacity:0}}@keyframes swipe-out-right{0%{transform:var(--y) translate(var(--swipe-amount-x));opacity:1}to{transform:var(--y) translate(calc(var(--swipe-amount-x) + 100%));opacity:0}}@keyframes swipe-out-up{0%{transform:var(--y) translateY(var(--swipe-amount-y));opacity:1}to{transform:var(--y) translateY(calc(var(--swipe-amount-y) - 100%));opacity:0}}@keyframes swipe-out-down{0%{transform:var(--y) translateY(var(--swipe-amount-y));opacity:1}to{transform:var(--y) translateY(calc(var(--swipe-amount-y) + 100%));opacity:0}}[data-sonner-toaster][data-theme=dark] [data-sonner-toast] [data-close-button]:hover{background:var(--normal-bg-hover);border-color:var(--normal-border-hover)}@keyframes sonner-fade-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes sonner-fade-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}@keyframes sonner-spin{0%{opacity:1}to{opacity:.15}}:root{--text-heading1-lineHeight:44px;--text-heading1-fontFamily:"Canela";--text-heading1-fontSize:38px;--text-heading1-fontWeight:300;--text-heading2-lineHeight:44px;--text-heading2-fontFamily:"Canela";--text-heading2-fontSize:38px;--text-heading2-fontWeight:300;--text-heading3-lineHeight:31px;--text-heading3-fontFamily:"GeogrotesqueCondBoldWeb";--text-heading3-textTransform:uppercase;--text-heading3-fontSize:22px;--text-heading3-fontWeight:400;--text-heading3-letterSpacing:0.5px;--text-heading4-lineHeight:44px;--text-heading4-fontFamily:"Canela";--text-heading4-fontSize:38px;--text-heading4-fontWeight:300;--text-heading5-lineHeight:24px;--text-heading5-fontFamily:"Inter";--text-heading5-textTransform:none;--text-heading5-fontSize:18px;--text-heading5-fontWeight:600;--text-heading5-letterSpacing:0;--text-heading6-lineHeight:24px;--text-heading6-fontFamily:"Inter";--text-heading6-textTransform:none;--text-heading6-fontSize:16px;--text-heading6-fontWeight:600;--text-heading6-letterSpacing:0;--text-paragraph-lineHeight:24px;--text-paragraph-fontFamily:"RingsideWideWeb";--text-paragraph-fontSize:15px;--text-paragraph-fontWeight:100;--text-paragraph-letterSpacing:0.4px;--text-paragraph2-lineHeight:20px;--text-paragraph2-fontFamily:"Inter";--text-paragraph2-textTransform:none;--text-paragraph2-fontSize:14px;--text-paragraph2-fontWeight:400;--text-paragraph2-letterSpacing:0;--text-button-lineHeight:20px;--text-button-fontFamily:"BaseMonoWideWeb";--text-button-textTransform:uppercase;--text-button-fontSize:15px;--text-button-fontWeight:500;--text-button-letterSpacing:0.4px;--text-muted-lineHeight:20px;--text-muted-fontFamily:"BaseMonoWideWeb"}.fresnel-container{margin:0;padding:0}@media not all and (max-width:767.98px){.fresnel-lessThan-tablet{display:none!important}}@media not all and (min-width:768px){.fresnel-greaterThanOrEqual-tablet{display:none!important}}:root{--junipOutlineColor:#637381}[class^=junip-],[class^=junip-] :after,[class^=junip-] :before,[class^=junip-]:after,[class^=junip-]:before{box-sizing:border-box}.junip-product-summary{animation:junipNodeInserted .01s}@keyframes junipNodeInserted{0%{transform:translateZ(1px)}to{transform:translateZ(0)}}:root{--junipPrimaryColor:#000000;--junipButtonColor:#000000;--junipButtonOutlineColor:#00000080;--junipStarColor:#121212;--junipButtonTextColor:#fff;--junipBorderColor:rgba(0,0,0,0.08);--junipSurfaceColor:rgba(0,0,0,0.03)}@font-face{font-family:"Geogrotesque";src:;font-weight:800;font-style:normal}@font-face{font-family:"Ringside";src:;font-weight:400;font-style:normal}.sf-hidden{display:none!important}@-webkit-keyframes nprogress-spinner{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}@keyframes nprogress-spinner{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@-webkit-keyframes nprogress-spinner{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}@keyframes nprogress-spinner{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:root{--heroui-background:0 0% 97%;--heroui-surface-background:0 0% 100%;--heroui-surface-foreground:0 0% 0%;--heroui-foreground:0 0% 13.33%;--heroui-product-background:0 0% 100%;--heroui-product-foreground:0 0% 0%;--heroui-divider:0 0% 0% 0%;--heroui-primary-50:210 22% 98%;--heroui-primary-100:210 27% 96%;--heroui-primary-200:210 32% 93%;--heroui-primary-300:210 29% 87%;--heroui-primary-400:215 23% 74%;--heroui-primary-500:215 17% 58%;--heroui-primary-600:217 20% 41%;--heroui-primary-700:217 24% 31%;--heroui-primary-800:217 28% 18%;--heroui-primary-900:217 33% 12%;--heroui-primary:0 0% 0%;--heroui-primary-foreground:0 0% 100%;--heroui-radius-small:0rem;--heroui-radius-medium:0rem;--heroui-radius-large:0rem;--heroui-box-shadow-small:0 0 15px -8px rgba(0,0,0,0.1);--heroui-box-shadow-medium:0 0 15px -8px rgba(0,0,0,0.1);--heroui-box-shadow-large:0 0 15px -8px rgba(0,0,0,0.1);--heroui-border-width:1px;--heroui-border-style:solid;--heroui-border-color:0 0% 85.09803921568627%;--heroui-font-size-tiny:0.75rem;--heroui-font-size-small:0.875rem;--heroui-font-size-medium:1rem;--heroui-font-size-large:1.5rem;--heroui-button-shadow:none;--heroui-button-border-color:0 0% 100%;--heroui-button-border-width:0px;--heroui-button-primary-background:0 0% 0%;--heroui-button-primary-foreground:0 0% 100%;--heroui-hero-background:0 0% 97.2549019607843%;--heroui-hero-foreground:0 0% 0.7843137254901962%;--heroui-story-border-color:0 0% 0%;--heroui-story-border-width:0px;--heroui-story-shadow:none;--heroui-announcement-bar-background:0 0% 0%;--heroui-announcement-bar-foreground:0 0% 100%;--heroui-announcement-bar-border-color:0 0% 0%/0%;--heroui-navbar-background:0 0% 100%;--heroui-navbar-foreground:0 0% 0%;--heroui-navbar-border-color:0 0% 0%/0.07450980392156863;--heroui-our-story-background:0 0% 100%;--heroui-our-story-foreground:0 0% 0%;--heroui-faq-background:0 0% 97.2549019607843%;--heroui-faq-foreground:0 0% 13.33%;--heroui-faq-border-color:0 0% 0%/0%;--heroui-product-collection-background:0 0% 100%;--heroui-product-collection-foreground:0 0% 13.33%;--heroui-footer-background:0 0% 100%;--heroui-footer-foreground:0 0% 0%;--heroui-footer-border-color:0 0% 0%/0%;--heroui-star-color:0 0% 0%;--heroui-image-border-color:0 0% 0%/0%;--heroui-radius-button:0.2rem}:root{--jurni-default-radius-small:4px;--jurni-default-radius-medium:24px;--jurni-default-radius-large:48px;--jurni-default-radius-button-small:4px;--jurni-default-radius-button-medium:8px;--jurni-default-radius-button-large:32px}:root{--text-heading1-lineHeight:44px;--text-heading1-fontFamily:"Canela";--text-heading1-fontSize:38px;--text-heading1-fontWeight:300;--text-heading2-lineHeight:44px;--text-heading2-fontFamily:"Canela";--text-heading2-fontSize:38px;--text-heading2-fontWeight:300;--text-heading3-lineHeight:31px;--text-heading3-fontFamily:"GeogrotesqueCondBoldWeb";--text-heading3-textTransform:uppercase;--text-heading3-fontSize:22px;--text-heading3-fontWeight:400;--text-heading3-letterSpacing:0.5px;--text-heading4-lineHeight:44px;--text-heading4-fontFamily:"Canela";--text-heading4-fontSize:38px;--text-heading4-fontWeight:300;--text-heading5-lineHeight:24px;--text-heading5-fontFamily:"Inter";--text-heading5-textTransform:none;--text-heading5-fontSize:18px;--text-heading5-fontWeight:600;--text-heading5-letterSpacing:0;--text-heading6-lineHeight:24px;--text-heading6-fontFamily:"Inter";--text-heading6-textTransform:none;--text-heading6-fontSize:16px;--text-heading6-fontWeight:600;--text-heading6-letterSpacing:0;--text-paragraph-lineHeight:24px;--text-paragraph-fontFamily:"RingsideWideWeb";--text-paragraph-fontSize:15px;--text-paragraph-fontWeight:100;--text-paragraph-letterSpacing:0.4px;--text-paragraph2-lineHeight:20px;--text-paragraph2-fontFamily:"Inter";--text-paragraph2-textTransform:none;--text-paragraph2-fontSize:14px;--text-paragraph2-fontWeight:400;--text-paragraph2-letterSpacing:0;--text-button-lineHeight:20px;--text-button-fontFamily:"BaseMonoWideWeb";--text-button-textTransform:uppercase;--text-button-fontSize:15px;--text-button-fontWeight:500;--text-button-letterSpacing:0.4px;--text-muted-lineHeight:20px;--text-muted-fontFamily:"BaseMonoWideWeb"}#ps__widget{pointer-events:auto!important}/* Zend brand type. Registered under the exact installed family names. */
@font-face{font-family:'Silk Serif Text';src:url('//zendwellness.com/cdn/shop/t/63/assets/lp-mgl-silkseriftext-regular.woff2?v=121761141441539522031790888188') format('woff2');font-weight:400;font-style:normal;font-display:swap}/* Assistant, the two weights their own storefront serves (n4 and n7), pulled
   from zendwellness.com/cdn/fonts. 500 and 600 map to the same files, which is
   what their site does too. */
@font-face{font-family:'Assistant';src:url('//zendwellness.com/cdn/shop/t/63/assets/lp-mgl-assistant-regular.woff2?v=139933315576396517991790888173') format('woff2');font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:'Assistant';src:url('//zendwellness.com/cdn/shop/t/63/assets/lp-mgl-assistant-regular.woff2?v=139933315576396517991790888173') format('woff2');font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:'Assistant';src:url('//zendwellness.com/cdn/shop/t/63/assets/lp-mgl-assistant-bold.woff2?v=118094235551713650731790888173') format('woff2');font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:'Assistant';src:url('//zendwellness.com/cdn/shop/t/63/assets/lp-mgl-assistant-bold.woff2?v=118094235551713650731790888173') format('woff2');font-weight:700;font-style:normal;font-display:swap}:root{--zend-navy:#013D54;--zend-navy-50:#013D5480;--zend-ink-deep:rgb(5,5,6);--zend-gold:#F5CE77;--zend-gold-dark:#EABC60;--zend-ink:#333132;--zend-gray:#F7F8F8;
  --zend-navy:#013D54;

  /* Type tokens. The reference's own scale is kept; only the families and
     the two weights our fonts do not carry are changed. */
  --text-heading1-fontFamily:'Silk Serif Text';
  --text-heading1-fontWeight:400;
  --text-heading2-fontFamily:'Silk Serif Text';
  --text-heading2-fontWeight:400;
  --text-heading3-fontFamily:'Assistant';
  --text-heading3-fontWeight:600;
  --text-heading4-fontFamily:'Silk Serif Text';
  --text-heading4-fontWeight:400;
  --text-heading5-fontFamily:'Assistant';
  --text-heading6-fontFamily:'Assistant';
  --text-paragraph-fontFamily:'Assistant';
  --text-paragraph-fontWeight:400;
  --text-paragraph2-fontFamily:'Assistant';
  --text-button-fontFamily:'Assistant';
  --text-button-fontWeight:600;
  --text-muted-fontFamily:'Assistant';

  /* Colour tokens. Everything not listed here keeps the reference value. */
  --heroui-primary:196.6 97.6% 16.7%;
  /* Their buttons are navy, not teal. Checked against the live theme. */
  --heroui-button-primary-background:196.6 97.6% 16.7%;
  --heroui-radius-button:8px;
  --heroui-button-primary-foreground:0 0% 100%;
  --heroui-announcement-bar-background:196.6 97.6% 16.7%;
  --heroui-announcement-bar-foreground:41.4 86.2% 71.4%;
  --heroui-announcement-bar-border-color:196.6 97.6% 16.7%;
  --heroui-star-color:41.4 86.2% 71.4%;

  /* Junip is the reviews widget and ships its own black. */
  --junipPrimaryColor:var(--zend-navy);
  --junipButtonColor:var(--zend-navy);
  --junipButtonOutlineColor:var(--zend-navy-50);
  --junipStarColor:var(--zend-gold);
}/* The announcement bar carries its colour inline, so the token alone
   cannot reach it. */
#announcement-0,[id^="announcement-"]{
  background-color:var(--zend-navy) !important;
  border-color:var(--zend-navy) !important;
  color:var(--zend-gold) !important;
}#announcement-0 a,[id^="announcement-"] a{color:var(--zend-gold) !important;}/* Anything the reference painted pure black as an action surface. Their
   buttons carry an 8px corner on the live site, against the reference's 0.2rem. */
.bg-button{background-color:var(--zend-navy) !important;}.bg-button,[class*="rounded-button"]{border-radius:8px !important;}/* Headings read navy, body copy reads their var(--zend-ink) rather than the
   reference's near-black. */
/* Body copy only. Do NOT include span: every button label on this page is a
   span inside the button, so a blanket span rule paints the labels ink on navy
   and the calls to action go invisible. That happened once here already. */
body,p,li{color:var(--zend-ink);}.bg-button,.bg-button *,button.bg-button *{color:#fff !important;}h1,h2,h4,.text-heading1,.text-heading2,.text-heading4{
  color:var(--zend-navy) !important;
}/* Two containers paint themselves near black (the "Trusted By Moms Who Are
   Still Nursing" block and the announcement pill). Navy headings and var(--zend-ink)
   body copy are both unreadable on it.
   Match on the BACKGROUND, not on the text colour: "color:rgb(255,255,255)" is
   also a substring of "background-color:rgb(255,255,255)", so keying on the
   text colour silently repaints headings on white sections too. */
[style*="background:var(--zend-ink-deep)"] h1,
[style*="background:var(--zend-ink-deep)"] h2,
[style*="background:var(--zend-ink-deep)"] h4,
[style*="background:var(--zend-ink-deep)"] p,
[style*="background:var(--zend-ink-deep)"] li,
[style*="background-color:rgb(0,0,0)"] h1,
[style*="background-color:rgb(0,0,0)"] h2,
[style*="background-color:rgb(0,0,0)"] h4,
[style*="background-color:rgb(0,0,0)"] p,
[style*="background-color:rgb(0,0,0)"] li{
  color:#fff !important;
}/* The reference buy box picks one of eight colour swatches. MetaGlow has no
   colour options, so eight circles under it would be nonsense, and their
   spoken labels still name the reference product's colours. display:none
   removes them from the screen AND from the accessibility tree, so nothing
   reads them out. The plan and price are stated in text directly above
   instead. A real 3-plan picker is structural and belongs in phase 4. */
[role="radiogroup"][aria-orientation="horizontal"]{display:none !important;}/* PRESS BAR. The reference's logo ticker held five magazine and newspaper
   mastheads, which are the REFERENCE brand's press mentions, so phase 2 hid
   the whole bar rather than leave a false claim on screen. Phase 4 replaced
   the five images with Zend's own certification badges (apply-04-pictures.py),
   so the bar is visible again and the hide is gone. The badges are navy line
   art on the bar's beige, and the row is centred rather than justified so
   three on mobile do not strand at the edges. (Those five mastheads are named
   in this script's own docstring and in apply-04, never in anything the
   injected block writes into the page: a CSS comment ships to the browser and
   the scrub gate reads it, exactly as it should.) */
[id^="logo-ticker-"]{background-color:var(--zend-navy) !important;}[id^="logo-ticker-"] ul{justify-content:center !important;}/* The logo slots hold a wide wordmark, not a square mark. Their theme sets
   logo_width:130, so the header matches that and the footer sits a little
   larger, as their own footer does. The reference sized these for a square
   mark, which is why an untouched slot rendered the wordmark far too big. */
img[alt="Zend Wellness"]{object-fit:contain;object-position:left center;
  width:auto !important;height:auto !important;}header img[alt="Zend Wellness"],
nav img[alt="Zend Wellness"]{max-width:130px !important;max-height:56px !important;}footer img[alt="Zend Wellness"]{max-width:150px !important;max-height:64px !important;}img[alt="Zend Wellness"]{max-width:130px !important;max-height:56px !important;}/* Every value below is lifted from Zend's own stylesheet on
   zendwellness.com/pages/postpartum-sub, not eyeballed from a screenshot:
     --zw-navy   var(--zend-navy)     --zw-accent #1779A2     --zw-gold var(--zend-gold-dark)
     offer border #d7dde1    save chip #1f7a3d       sub text #5b6b73
     was price   #9aa5ab     feature text #40525a    surface #f4f5f6
   The first pass guessed a slate Best Value bar and slate plan names. Both
   were wrong: their tag bar is navy and their plan names are always navy. What
   makes an unchosen plan recede is opacity 0.7 on the whole card. */
#zend-buybox-head{display:flex;flex-direction:column;gap:14px;width:100%}#zend-buybox-head .zh-pill{align-self:flex-start;background:#1779A2;color:#fff;
  font-family:'Assistant',sans-serif;font-size:13px;font-weight:600;
  border-radius:999px;padding:7px 14px;line-height:1.2}#zend-buybox-head .zh-title{font-family:'Silk Serif Text',serif;font-size:34px;
  line-height:1.1;color:var(--zend-navy);margin:2px 0 0;text-transform:none;
  letter-spacing:0}#zend-buybox-head .zh-rate{display:flex;align-items:center;gap:8px;
  flex-wrap:wrap;font-size:14px}#zend-buybox-head .zh-stars{color:var(--zend-gold-dark);font-size:17px;letter-spacing:1px;
  line-height:1}#zend-buybox-head .zh-score{font-family:'Assistant',sans-serif;font-size:14px;
  font-weight:700;color:var(--zend-ink)}#zend-buybox-head .zh-count{font-family:'Assistant',sans-serif;font-size:14px;
  color:var(--zend-ink)}#zend-buybox-head .zh-promise{font-family:'Assistant',sans-serif;font-size:16px;
  line-height:1.5;color:var(--zend-ink);margin:0}#zend-buybox-head ul{list-style:none;margin:6px 0 0;padding:0;display:flex;
  flex-direction:column;gap:12px;width:100%}#zend-buybox-head ul li{position:relative;display:flex;gap:12px;
  align-items:flex-start;font-family:'Assistant',sans-serif;font-size:16px;
  line-height:1.4;color:var(--zend-ink)}#zend-buybox-head ul li:before{content:"";flex:0 0 22px;height:22px;
  margin-top:1px;border-radius:50%;background:var(--zend-navy)}#zend-buybox-head ul li span.zh-tick{position:absolute;left:7px;top:5px;
  width:6px;height:11px;border:solid #fff;border-width:0 2px 2px 0;
  transform:rotate(40deg)}/* Allan, 2026-09-01: bigger button, bigger type. Reached through :has() on the
   injected span, because the reference gives this button no class of its own. */
/* The reference pins this button's height with a utility class, so padding
   alone does nothing: min-height is what actually makes it bigger. */
button:has(.zb-cta){font-size:24px !important;font-weight:700 !important;
  letter-spacing:.02em !important;padding:22px 16px !important;
  min-height:72px !important;height:auto !important;border-radius:6px !important;
  line-height:1.1 !important;width:100% !important}.zb-cta{display:inline-block}#zend-trust{display:flex;flex-direction:column;gap:10px;margin-top:18px;
  width:100%;align-items:center;text-align:center}#zend-trust div{font-family:'Assistant',sans-serif;font-size:15px;
  color:#1c2b33;line-height:1.4}#zend-trust b{color:var(--zend-navy)}@keyframes colorFadeOut-daa2ec63{0%{color:#fff}to{color:#b3b4b7}}@keyframes inputFadeIn-0e1ec44e{0%{opacity:.35}to{opacity:1}}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;background-color:transparent;background-image:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}[hidden]{display:none}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246/.5);--tw-ring-offset-shadow:0 0#0000;--tw-ring-shadow:0 0#0000;--tw-shadow:0 0#0000;--tw-shadow-colored:0 0#0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.hidden{display:none}.p-3{padding:12px}.shadow-\[0_1px_2px_-0\.75px_rgba\(26\,35\,66\,0\.04\)\,0_0\.5px_1px_-0\.5px_rgba\(26\,35\,66\,0\.04\)\]{--tw-shadow:0 1px 2px -.75px rgba(26,35,66,.04),0 .5px 1px -.5px rgba(26,35,66,.04);--tw-shadow-colored:0 1px 2px -.75px var(--tw-shadow-color),0 .5px 1px -.5px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0#0000),var(--tw-ring-shadow,0 0#0000),var(--tw-shadow)}@media (min-width:1024px){}@media (min-width:1280px){}@media (min-width:1536px){}
/* Sticky buy bar. The reference spread the thumb and the button to opposite
   edges of a full-width row, which reads as two unrelated things on a 1280
   screen. Allan, 2026-09-01: bring them together in the middle.
   Then, same day: "this is impossible to see". Centring had squeezed the text
   column to 125px, so the product name truncated to "MetaGlow(R) Coll..." at
   15px, and the bar was white on a white page with no edge to it. The name now
   gets the room to finish, the type is bigger and navy, and the bar has a top
   edge and a shadow so it reads as a bar. */
.fixed.bottom-0 > div{width:auto !important;max-width:none !important;
  justify-content:center !important;gap:24px !important}
.fixed.bottom-0 > div > div{width:auto !important;flex:0 0 auto !important;
  justify-content:center !important}
.fixed.bottom-0 > div > div > div{width:auto !important;min-width:0 !important;
  flex:0 0 auto !important}
.fixed.bottom-0 a[class],.fixed.bottom-0 button[class]{
  min-width:220px !important;flex:0 0 auto !important}

/* Let the product name finish. Truncation came from min-w-0 plus a clipped
   column, not from a truncate class. */
.fixed.bottom-0 [class*="min-w-0"]:not(button):not(a){
  min-width:max-content !important}
.fixed.bottom-0 p,.fixed.bottom-0 span,.fixed.bottom-0 div{
  overflow:visible !important;text-overflow:clip !important}
.fixed.bottom-0 [class*="flex-col"] > *{white-space:nowrap !important}

/* Readable, not decorative. */
.fixed.bottom-0{border-top:1px solid rgba(1,61,84,0.22) !important;
  box-shadow:0 -6px 20px rgba(0,0,0,0.12) !important}
.fixed.bottom-0 [class*="flex-col"] > *:first-child{font-size:17px !important;
  font-weight:600 !important;line-height:1.25 !important;color:var(--zend-navy) !important}
.fixed.bottom-0 [class*="flex-col"] > *:nth-child(2){font-size:16px !important;
  font-weight:600 !important;color:var(--zend-navy) !important}
.fixed.bottom-0 img{height:56px !important;width:56px !important}
@media (max-width:767px){
  .fixed.bottom-0 > div{gap:12px !important}
  .fixed.bottom-0 a[class],.fixed.bottom-0 button[class]{
    min-width:150px !important}
  .fixed.bottom-0 [class*="flex-col"] > *:first-child{font-size:15px !important}
  .fixed.bottom-0 [class*="flex-col"] > *:nth-child(2){font-size:15px !important}
}

/* The trust bar. Allan, 2026-09-01: "the icons are too hard to read. Make it a
   moving marquee bar as well." The badges are 300x70 artwork and five of them
   were being squeezed into a 390px row, which rendered each one 41px wide, 14%
   of its natural width, so the words inside were gone. A marquee lets every
   badge sit at its real proportions and scroll instead of shrinking. */
[id="logo-ticker-3"]{overflow:hidden !important}
/* Allan, 2026-09-02: the bar "hangs and restarts". It did, by exactly one
   gap. The track was [5 badges][0-width spacer][5 badges] with `gap` between
   every item, so the seam carried TWO gaps (one either side of the spacer)
   while the others carried one, and `gap` puts no space after the last item.
   Measured live at 390px: the track was 2634px so -50% moved 1317px, but the
   repeat point sat at 1349px. Every loop jumped the missing 32px.
   The fix is to stop using `gap` and hang the spacing off each item as a right
   margin, which every item carries including the last. The track is then
   exactly two identical halves and -50% lands on the repeat to the pixel:
   10 items x (231 + 32) = 2630, half 1315, repeat 5 x 263 = 1315. */
[id="logo-ticker-3"] ul{flex-wrap:nowrap !important;width:max-content !important;
  justify-content:flex-start !important;gap:0 !important;
  animation:pm-marquee 34s linear infinite;will-change:transform}
[id="logo-ticker-3"] li{flex:0 0 auto;margin-right:56px}
[id="logo-ticker-3"] li img{height:58px !important;width:auto !important;
  max-width:none !important;object-fit:contain !important}
@keyframes pm-marquee{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
/* Anyone who has asked their system to stop animations gets a static row. */
@media (prefers-reduced-motion:reduce){
  [id="logo-ticker-3"] ul{animation:none;justify-content:center !important;
    flex-wrap:wrap !important;width:100% !important;gap:24px !important}
}
@media (max-width:767px){
  [id="logo-ticker-3"] ul{gap:0 !important;animation-duration:24s}
  [id="logo-ticker-3"] li{margin-right:32px}
  [id="logo-ticker-3"] li img{height:54px !important}
  [id="logo-ticker-3"]{padding:20px 0 !important}
}

/* The hero lead-in. Allan, 2026-09-01: smaller, one row, reading as a lead
   into the headline rather than part of it. Same serif as the headline so it
   still looks like the same sentence, just quieter. */
/* Allan, 2026-09-01: highlighted, like a marker behind the words, so it pops.
   inline-block rather than block so the gold hugs the text instead of running
   the width of the column, and it still centres because the heading does. */
.pm-lead{display:inline-block;font-size:22px;line-height:1.3;
  letter-spacing:0.01em;white-space:nowrap;margin-bottom:16px;
  background:var(--zend-gold);padding:1px 14px 3px;border-radius:2px;
  -webkit-box-decoration-break:clone;box-decoration-break:clone}
.pm-headline{display:block}
@media (max-width:767px){
  /* Allan, 2026-09-02: bigger on a phone. It cannot simply be set larger,
     because white-space:nowrap keeps this on one line and the line has to fit
     the narrowest phone. So it scales with the screen instead: 4.9vw fills the
     width on a 390px phone (about 19px) and still clears the edges on a 320px
     one (about 16px), with 15px and 21px as the floor and ceiling. */
  .pm-lead{font-size:clamp(15px, 4.9vw, 21px);margin-bottom:12px;
    padding:2px 10px 4px}
}

/* The main buy box call to action. Allan, 2026-09-01: the type was far too
   small for the button. The button element itself is already 24px, but the
   reference nests the label and the price in spans that reset to 15px and
   14px, so on a 596x72 bar the words read as a caption. */
#main-product-11 .zb-cta,
#main-product-11 span.uppercase.flex-1{font-size:26px !important;
  font-weight:700 !important;letter-spacing:0.01em !important;
  line-height:1.1 !important}
#main-product-11 button p[class*="text-small"]{font-size:24px !important;
  font-weight:700 !important;line-height:1.1 !important}
@media (max-width:767px){
  #main-product-11 .zb-cta,
  #main-product-11 span.uppercase.flex-1{font-size:20px !important}
  #main-product-11 button p[class*="text-small"]{font-size:19px !important}
}

/* Allan, 2026-09-01: the call to action loses the price on the right and gains
   a padlock before the label, centred, like the reference. The lock is drawn in
   CSS on purpose. An inline SVG data URI carries the string
   http://www.w3.org/2000/svg, and the browser tracking gate reads that as a
   second outside host, which is how this page once went from one host to two
   for a tick mark. Two borders, no request, same picture. */
#main-product-11 button .justify-between{justify-content:center !important}
#main-product-11 button .w-fit{display:none !important}
#main-product-11 .zb-cta{position:relative;padding-left:38px;
  flex:0 0 auto !important}
#main-product-11 .zb-cta::before{content:"";position:absolute;left:2px;top:50%;
  width:18px;height:14px;margin-top:-1px;box-sizing:border-box;
  border:2.5px solid currentColor;border-radius:3px}
#main-product-11 .zb-cta::after{content:"";position:absolute;left:6px;top:50%;
  width:10px;height:9px;margin-top:-11px;box-sizing:border-box;
  border:2.5px solid currentColor;border-bottom:0;border-radius:6px 6px 0 0}
@media (max-width:767px){
  #main-product-11 .zb-cta{padding-left:30px}
  #main-product-11 .zb-cta::before{width:15px;height:12px}
  #main-product-11 .zb-cta::after{width:9px;height:8px;margin-top:-9px}
}

/* Allan, 2026-09-03: the price goes back into the buy box button, beside the
   label rather than pinned to the far right. Only one of the two breakpoint
   copies is ever on screen, so this shows the price once. */
#main-product-11 button .w-fit{display:block !important}
#main-product-11 button .justify-between{gap:16px !important}

/* Allan, 2026-09-03: the hero button is the same button as the five in the
   reason cards, so it is matched to them rather than to the buy box: 48px tall,
   8px/16px padding, full width of its column. No padlock and no price, those
   belong to the buy box button only. The reason cards' own button measures
   442px wide on a 1440px screen, which is what the desktop minimum matches;
   the theme's md:w-fit would otherwise shrink this one to its text. */
#hero-6-2 button[data-pm-hero-cta]{min-height:48px !important;
  height:auto !important;padding:8px 16px !important;
  width:100% !important;min-width:442px !important;box-shadow:none !important}
@media (max-width:767px){
  /* Allan, 2026-09-03: same width as the button in the reason cards. The hero
     column is inset 20px a side and the card's button is inset 22px by the
     section plus 24px by the card, so the card's button is always 52px
     narrower than the hero column, at every phone width. Taking that 52px off
     here makes the two buttons the same width and the same left edge on a
     320px, 390px or 767px screen alike. */
  #hero-6-2 button[data-pm-hero-cta]{min-width:0 !important;
    max-width:calc(100% - 52px) !important}
}

/* The sticky bar is held off screen until the gate script says the reader has
   reached the testimonial section. Gated only once the script runs, so it still
   shows normally if JavaScript never arrives. */
.fixed.bottom-0.pm-sticky-gated{transform:translateY(115%) !important;
  transition:transform .28s ease;pointer-events:none}
.fixed.bottom-0.pm-sticky-gated.pm-sticky-on{transform:translateY(0) !important;
  pointer-events:auto}
/* Same, from the very first frame: the layout adds pm-sticky-js in <head>, so
   the bar never flashes up before the gate script runs. */
.pm-sticky-js [id$="__buy-box"] .fixed.bottom-0{transform:translateY(115%) !important;
  transition:transform .28s ease;pointer-events:none}
.pm-sticky-js [id$="__buy-box"] .fixed.bottom-0.pm-sticky-on{transform:translateY(0) !important;
  pointer-events:auto}
@media (prefers-reduced-motion:reduce){
  .fixed.bottom-0.pm-sticky-gated{transition:none}
  .pm-sticky-js [id$="__buy-box"] .fixed.bottom-0{transition:none}
}

/* Gallery. The thumbs and the video now respond to a click, so show it. */
.pm-thumb{cursor:pointer}
.pm-thumb[aria-current="true"]{outline:2px solid var(--zend-navy);outline-offset:-2px}
.pm-thumb[aria-current="false"]{opacity:0.62;transition:opacity .2s ease}
.pm-thumb:hover{opacity:1}
.pm-video-wrap{cursor:pointer}

/* The three reassurance chips under the closing call to action. Allan,
   2026-09-01: one row, so smaller type. At 14px they measured 666px of chip in
   a 563px column and wrapped onto two lines. Desktop only: at 390px three of
   these cannot share a line, so the phone copy keeps wrapping. */
@media (min-width:768px){
  [id="minimal-content-15"] .mt-8{flex-wrap:nowrap !important;
    gap:8px !important;justify-content:flex-start !important}
  [id="minimal-content-15"] .rounded-button{padding:6px 10px !important;
    flex:0 0 auto !important;white-space:nowrap !important}
  [id="minimal-content-15"] .rounded-button,
  [id="minimal-content-15"] .rounded-button *{font-size:12px !important;
    white-space:nowrap !important}
  [id="minimal-content-15"] .rounded-button svg{width:14px !important;
    height:14px !important}
}

/* Reason row headings on a phone. Allan, 2026-09-01: a bit smaller so
   "(Get the First Win)" sits on one line. 38px left barely two words per line
   in a serif at 390px. */
@media (max-width:767px){
  [id="minimal-content-4"] h4,[id="minimal-content-5"] h4,
  [id="minimal-content-6"] h4,[id="minimal-content-7"] h4,
  [id="minimal-content-8"] h4{font-size:31px !important;
    line-height:1.16 !important}
}

/* Mobile readability pass, 2026-09-01. Measured at 390px: the rating, the
   gallery price line and every footer link were rendering at 12px, and the
   footer links were 16px tall, well under a thumb-sized tap target. */
@media (max-width:767px){
  [id="hero-6-2"] .whitespace-nowrap span,
  [id="hero-6-2"] p.whitespace-nowrap{font-size:14px !important}
  [id="main-product-11"] p[class*="text-small"],
  [id="main-product-11"] p[class*="text-xs"]{font-size:14px !important}
  [id^="footer-"] a{font-size:14px !important;padding:7px 4px !important;
    display:inline-block}
  [id^="footer-"] p{font-size:12.5px !important;line-height:1.5 !important}
}

/* Footer. Allan, 2026-09-01: centre it. The reference left the link rows
   ragged from the left edge of the column. */
#footer-16,[id^="footer-"]{text-align:center}
#footer-16 ul,[id^="footer-"] ul,
#footer-16 nav,[id^="footer-"] nav{justify-content:center !important}
#footer-16 > div,[id^="footer-"] > div{align-items:center !important}
/* Allan, 2026-09-03: centre Privacy Policy and Terms of Service. The reference
   laid the links out in a four column grid, so the second row held only two
   links, filled columns one and two, and sat left of centre. A wrapping flex
   row centres every row, whether it is full or not. Desktop only: on a phone
   the grid already stacks one per row, centred. */
@media (min-width:768px){
  [id^="footer-"] div.grid{display:flex !important;flex-wrap:wrap !important;
    justify-content:center !important;align-items:center !important}
}

/* The combined announcement and nav row. Logo left, message beside it, one
   line on desktop and stacked on a phone. */
.pm-topbar{position:sticky;top:0;z-index:60;width:100%}
/* Allan, 2026-09-01: the row looked lopsided with the logo and the message
   bunched left and the whole right half empty. Logo pinned left, message to
   the right edge, so the bar reads as one balanced row. */
.pm-topbar-in{display:flex;align-items:center;justify-content:space-between;
  gap:22px;max-width:1256px;margin:0 auto;padding:12px 16px}
.pm-topbar-msg{text-align:right}
.pm-topbar-logo{flex:0 0 auto;display:block;line-height:0}
/* Allan, 2026-09-01: way smaller. The width comes from the section's own
   logo_width field, which the old hardcoded 130px silently overrode. */
.pm-topbar-logo img{height:auto;display:block;max-width:100%}
.pm-topbar-msg{margin:0;font-family:'Assistant',sans-serif;font-size:15px;
  font-weight:600;line-height:1.4;color:inherit}
.pm-topbar-msg a{color:inherit;text-decoration:underline;font-weight:700}
@media (max-width:767px){
  .pm-topbar-in{flex-direction:column;justify-content:center;gap:6px;
    text-align:center;padding:8px 14px}
  .pm-topbar-msg{text-align:center}
  .pm-topbar-msg{font-size:13px}
}

/* The update warning. Allan, 2026-09-01: edge to edge, and a real gap between
   it and the hero. The bar itself is now full bleed; the words stay in a
   centred 1256px measure so they do not stretch across a wide screen. */
/* Allan, 2026-09-03: no white gap between this bar and the hero. The 32px
   bottom margin showed as a white band above the hero photo on desktop. */
.pm-update-wrap{width:100%;padding:0;margin:0;background:transparent}
.pm-update{max-width:none;margin:0;padding:14px 20px;box-sizing:border-box}
/* Allan, 2026-09-01: black bar, and a dotted line framing the message rather
   than a solid block. The bar stays full bleed, so the dotted frame sits on the
   message instead of the bar, otherwise its left and right edges would be cut
   off by the screen. The border takes currentColor, so it follows the text
   colour field and never has to be set twice. */
.pm-update-msg{max-width:1256px;margin:0 auto;text-align:center;
  font-family:'Assistant',sans-serif;font-size:16px;font-weight:400;
  line-height:1.4;color:inherit;border:2px dotted currentColor;
  border-radius:2px;padding:10px 20px}
.pm-update-label{font-weight:700;letter-spacing:0.02em;margin-right:6px}
.pm-update-msg a{color:inherit;text-decoration:underline;font-weight:700;
  margin-left:4px}
@media (max-width:767px){
  .pm-update-wrap{margin-bottom:0}
  .pm-update{padding:11px 12px}
  .pm-update-msg{font-size:14px;line-height:1.35;padding:8px 12px}
}


/* ---------------------------------------------------------------------------
   Buy-box accordion content, 2026-09-08. The four panels were walls of text;
   they are now lead line, icon tiles, a dose table, numbered steps and
   ingredient cards. Colours are Zend's own: var(--zend-navy) deep teal, #108474 teal,
   var(--zend-gold-dark) honey gold, var(--zend-gray) light grey. Fonts inherit from the page.
   Every selector is scoped under .mgl-acc so nothing else on the page moves.
   --------------------------------------------------------------------------- */
.mgl-acc{white-space:normal;color:#3d4b52;font-size:14px;line-height:1.6;padding:2px 0 8px;overflow-wrap:break-word;max-width:100%}
.mgl-acc p,.mgl-acc ul,.mgl-acc li,.mgl-acc table,.mgl-acc blockquote,.mgl-acc div,.mgl-acc span,.mgl-acc b,.mgl-acc a{white-space:normal}
.mgl-acc .mgl-acc__lead{margin:0 0 14px;font-size:14px;line-height:1.65;color:#4a5a62}
.mgl-acc .mgl-acc__lead strong{color:var(--zend-navy);font-weight:700}

/* four ingredient tiles, two across */
.mgl-acc .mgl-acc__chips{list-style:none;margin:0 0 14px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mgl-acc .mgl-acc__chips li{display:flex;gap:11px;align-items:flex-start;background:var(--zend-gray);border:1px solid #E4EAEC;border-radius:10px;padding:13px 13px 12px}
.mgl-acc .mgl-acc__chips svg{width:18px;height:18px;flex:0 0 auto;color:#108474;margin-top:1px}
.mgl-acc .mgl-acc__chips b{display:block;color:var(--zend-navy);font-size:13.5px;font-weight:700;line-height:1.3}
.mgl-acc .mgl-acc__chips span{display:block;font-size:12px;color:#61727a;line-height:1.45;margin-top:3px}

/* dose table */
.mgl-acc .mgl-acc__spec{width:100%;max-width:100%;table-layout:fixed;border-collapse:collapse;font-size:13px;margin:0 0 15px}
.mgl-acc .mgl-acc__spec th{text-align:left;vertical-align:top;padding:10px 14px 10px 0;color:var(--zend-navy);font-weight:700;font-size:11px;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;width:112px;border-bottom:1px solid #E4EAEC}
.mgl-acc .mgl-acc__spec td{padding:10px 0;line-height:1.55;color:#4a5a62;border-bottom:1px solid #E4EAEC}
.mgl-acc .mgl-acc__spec tr:last-child th,.mgl-acc .mgl-acc__spec tr:last-child td{border-bottom:0}

/* one-line icon facts */
.mgl-acc .mgl-acc__icons{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.mgl-acc .mgl-acc__icons li{display:flex;align-items:center;gap:10px;font-size:13px;color:#3d4b52;line-height:1.35}
.mgl-acc .mgl-acc__icons svg{width:16px;height:16px;color:var(--zend-navy);flex:0 0 auto}

/* numbered steps */
.mgl-acc .mgl-acc__steps{list-style:none;margin:0 0 15px;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.mgl-acc .mgl-acc__steps li{background:var(--zend-gray);border:1px solid #E4EAEC;border-radius:10px;padding:13px 12px;height:100%;box-sizing:border-box}
.mgl-acc .mgl-acc__steps i{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:var(--zend-navy);color:#fff;font-size:12px;font-weight:700;font-style:normal;line-height:1;margin-bottom:9px}
.mgl-acc .mgl-acc__steps b{display:block;color:var(--zend-navy);font-size:13px;font-weight:700;line-height:1.3}
.mgl-acc .mgl-acc__steps span{display:block;font-size:12px;color:#61727a;line-height:1.45;margin-top:3px}

/* the eight-week note */
.mgl-acc .mgl-acc__note{display:flex;gap:10px;align-items:flex-start;margin:15px 0 0;padding:12px 14px;background:rgba(234,188,96,.16);border-left:3px solid var(--zend-gold-dark);border-radius:0 8px 8px 0;font-size:13px;line-height:1.5;color:#4a5a62}
.mgl-acc .mgl-acc__note svg{width:16px;height:16px;flex:0 0 auto;color:#B0821F;margin-top:1px}
.mgl-acc .mgl-acc__note strong{color:var(--zend-navy);font-weight:700}

/* customer quote */
.mgl-acc .mgl-acc__quote{margin:15px 0 0;padding-top:13px;border-top:1px solid #E4EAEC}
.mgl-acc .mgl-acc__quote p{margin:0 0 6px;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:#8b979d;font-weight:700}
.mgl-acc .mgl-acc__quote blockquote{margin:0;padding:0;border:0;font-size:13.5px;line-height:1.6;color:var(--zend-navy);font-style:italic}

/* ingredient cards */
.mgl-acc .mgl-acc__ing{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.mgl-acc .mgl-acc__ing li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;align-items:start;background:var(--zend-gray);border:1px solid #E4EAEC;border-radius:10px;padding:13px 14px}
.mgl-acc .mgl-acc__ing i{display:grid;place-items:center;width:34px;height:34px;border-radius:8px;background:#fff;border:1px solid #E4EAEC;color:#108474}
.mgl-acc .mgl-acc__ing i svg{width:18px;height:18px}
.mgl-acc .mgl-acc__ing b{display:block;color:var(--zend-navy);font-size:13.5px;font-weight:700;line-height:1.35}
.mgl-acc .mgl-acc__ing span.mgl-acc__dose{display:inline-block;margin-left:7px;padding:2px 7px 1px;border-radius:999px;background:var(--zend-navy);color:#fff;font-size:10.5px;font-weight:700;letter-spacing:.03em;line-height:1.5;vertical-align:1px}
.mgl-acc .mgl-acc__ing div>span{display:block;font-size:12.5px;color:#61727a;line-height:1.5;margin-top:4px}

.mgl-acc .mgl-acc__meta{margin:12px 0 0;font-size:11.5px;color:#8b979d;line-height:1.5}

/* supplement facts link */
.mgl-acc a.mgl-acc__link{display:inline-flex;align-items:center;gap:7px;margin-top:14px;font-size:12.5px;font-weight:700;color:#108474;text-decoration:underline;text-underline-offset:3px}
.mgl-acc a.mgl-acc__link svg{width:15px;height:15px;flex:0 0 auto}

@media (max-width:767px){
  .mgl-acc .mgl-acc__chips{grid-template-columns:1fr;gap:8px}
  .mgl-acc .mgl-acc__steps{grid-template-columns:1fr;gap:8px}
  .mgl-acc .mgl-acc__steps li{display:grid;grid-template-columns:25px minmax(0,1fr);column-gap:11px;align-items:start}
  .mgl-acc .mgl-acc__steps i{margin-bottom:0;grid-row:1 / span 2}
}

/* ---------------------------------------------------------------------------
   Comparison card under the accordion, 2026-09-08. Generic comparison only:
   the other column is "Prescription injections", never a drug name, and it
   carries a dash wherever we will not speak for a prescription medicine.
   --------------------------------------------------------------------------- */
.mgl-cmp{white-space:normal;margin:-16px 0 0;padding:20px 20px 16px;background:#fff;border:1px solid #E4EAEC;border-radius:12px;box-shadow:0 1px 3px rgba(1,61,84,.05)}
.mgl-cmp *{white-space:normal}
.mgl-cmp .mgl-cmp__eyebrow{margin:0 0 5px;font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#B0821F}
.mgl-cmp .mgl-cmp__title{margin:0 0 7px;font-size:22px;line-height:1.2;font-weight:600;color:var(--zend-navy);text-transform:none;letter-spacing:0}
.mgl-cmp .mgl-cmp__lead{margin:0 0 16px;font-size:13px;line-height:1.55;color:#61727a}
.mgl-cmp .mgl-cmp__grid{display:block;width:100%}
.mgl-cmp .mgl-cmp__row{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr) minmax(0,1fr);align-items:stretch}
.mgl-cmp .mgl-cmp__row>span{display:flex;align-items:center;justify-content:center;text-align:center;padding:11px 6px;font-size:12.5px;line-height:1.35;color:#4a5a62;border-bottom:1px solid #EEF2F3}
.mgl-cmp .mgl-cmp__row>span:first-child{justify-content:flex-start;text-align:left;padding-left:0;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--zend-navy)}
.mgl-cmp .mgl-cmp__row:last-child>span{border-bottom:0}
.mgl-cmp .mgl-cmp__row--head>span{padding-top:0;padding-bottom:9px;font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:#8b979d;border-bottom:1px solid #E4EAEC}
.mgl-cmp .mgl-cmp__row--head>span.mgl-cmp__us{color:var(--zend-navy);padding-top:8px;border-radius:8px 8px 0 0}
.mgl-cmp .mgl-cmp__row:last-child>span.mgl-cmp__us{border-radius:0 0 8px 8px}
.mgl-cmp .mgl-cmp__us{background:#F5F9F8;border-left:1px solid #E4EAEC;border-right:1px solid #E4EAEC;font-weight:600;color:var(--zend-navy)}
.mgl-cmp svg.mgl-cmp__ok{width:17px;height:17px;color:#108474;display:block;margin:0 auto}
.mgl-cmp svg.mgl-cmp__no{width:15px;height:15px;color:#c2ccd1;display:block;margin:0 auto}
.mgl-cmp .mgl-cmp__foot{margin:14px 0 0;padding-top:12px;border-top:1px solid #EEF2F3;font-size:11px;line-height:1.5;color:#8b979d}
@media (max-width:767px){
  .mgl-cmp{padding:16px 14px 13px}
  .mgl-cmp .mgl-cmp__title{font-size:19px}
  .mgl-cmp .mgl-cmp__row{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,1fr)}
  .mgl-cmp .mgl-cmp__row>span{font-size:11.5px;padding:10px 4px}
  .mgl-cmp .mgl-cmp__row>span:first-child{font-size:10px;letter-spacing:.05em}
}

/* palette variables and Evolve accordion styles, added 2026-09-08 */
body.tpl-evolve-creatine-listicle-plum{--zend-navy:#37203D;--zend-navy-50:#37203D80;--zend-ink-deep:rgb(27,14,26);--zend-gold:#EFC46A;--zend-gold-dark:#E0A63A;--zend-ink:#231425;--zend-gray:#FAF8F7;}
body.tpl-evolve-creatine-listicle-plum [style*="background-color:rgb(245,225,201)"]{background-color:rgb(248,228,238) !important}
body.tpl-evolve-creatine-listicle-plum [style*="background-color:rgb(237,200,166)"]{background-color:rgb(240,166,205) !important}
body.tpl-evolve-creatine-listicle-plum [style*="background-color:rgb(217,165,145)"]{background-color:rgb(222,120,175) !important}

.pm-cards,.pm-steps{display:grid;gap:10px;margin:12px 0 4px;white-space:normal}
.pm-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:640px){.pm-cards{grid-template-columns:1fr}}
.pm-card,.pm-step{border:1px solid rgba(1,61,84,.16);border-radius:10px;padding:12px 14px;background:#fff;white-space:normal}
.pm-step{display:flex;gap:10px;align-items:flex-start}
.pm-card svg,.pm-step svg{width:20px;height:20px;color:var(--zend-navy)}
.pm-card svg{display:block;margin-bottom:7px}
.pm-step svg{flex:0 0 20px;margin-top:2px}
.pm-card b,.pm-step b{display:block;font-weight:700;margin-bottom:2px}
.pm-card>span,.pm-step>span>span{display:block;opacity:.72}
.pm-fine{display:block;margin-top:10px;font-size:.88em;opacity:.62;white-space:normal}
div[data-slot=content]:has(.pm-cards),div[data-slot=content]:has(.pm-steps){white-space:normal !important}

   TYPE PASS, 2026-09-11.
   Two jobs, kept apart on purpose.

   PART A is a bug fix and applies to EVERY page that uses these sections,
   including the MetaGlow listicle: the dark testimonial band paints its own
   near black background inline as rgb(5,5,6), which the existing guard above
   does not match (it only looks for var(--zend-ink-deep) and rgb(0,0,0)), so
   navy headings and var(--zend-ink) body copy were sitting on black.

   PART B is the Evolve Creatine type scale and is scoped to the two Evolve
   templates only, so nothing else on this theme moves.
   ========================================================================== */

/* ---- PART A: text on the near black testimonial band ---- */
[style*="background:rgb(5,5,6)"] h1,
[style*="background:rgb(5,5,6)"] h2,
[style*="background:rgb(5,5,6)"] h3,
[style*="background:rgb(5,5,6)"] h4,
[style*="background:rgb(5,5,6)"] p,
[style*="background:rgb(5,5,6)"] li,
[style*="background:rgb(5,5,6)"] span,
[style*="background-color:rgb(5,5,6)"] h1,
[style*="background-color:rgb(5,5,6)"] h2,
[style*="background-color:rgb(5,5,6)"] h3,
[style*="background-color:rgb(5,5,6)"] h4,
[style*="background-color:rgb(5,5,6)"] p,
[style*="background-color:rgb(5,5,6)"] li,
[style*="background-color:rgb(5,5,6)"] span{
  color:#fff !important;
}

/* ---- PART B: Evolve Creatine listicle type scale ---- */

/* Be Vietnam is what the live store actually paints. The theme names
   Assistant in its settings but never loads the file, so no shopper has ever
   seen Assistant on zendwellness.com. Only Regular and Bold exist, so every
   weight below is 400 or 700: asking for 500 or 600 makes the browser fake a
   bold that does not exist, which is what the 44px numbers were doing. */
@font-face{font-family:'Be Vietnam';src:url('//zendwellness.com/cdn/shop/t/63/assets/lp-mgl-bevietnam-regular.woff2?v=179608765679522039271790888176') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Be Vietnam';src:url('//zendwellness.com/cdn/shop/t/63/assets/lp-mgl-bevietnam-medium.woff2?v=123566339301324981511790888175') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Be Vietnam';src:url('//zendwellness.com/cdn/shop/t/63/assets/lp-mgl-bevietnam-semibold.woff2?v=5474847352176580601790888176') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Be Vietnam';src:url('//zendwellness.com/cdn/shop/t/63/assets/lp-mgl-bevietnam-bold.woff2?v=74097564970235216861790888175') format('woff2');font-weight:700;font-style:normal;font-display:swap}

/* The scale. Six sizes, and every piece of text on the page picks one:
   44 numbers / 38 hero / 30 section headings / 20 buy box / 16 body / 13 fine.
   The sections read these variables from their inline styles, so setting them
   here reaches the markup without touching a single section file. */
body.tpl-evolve-creatine-listicle,
body.tpl-evolve-creatine-listicle-plum{
  --pm-sans:'Be Vietnam';
  --pm-serif:'Silk Serif Text';

  /* Hero headline. */
  --text-heading1-fontFamily:'Silk Serif Text';
  --text-heading1-fontSize:38px;
  --text-heading1-fontWeight:400;
  --text-heading1-lineHeight:44px;
  --text-heading1-letterSpacing:-0.95px;

  /* Every other serif heading: the five section headings, Meet Evolve
     Creatine, Loved by Women, What Customers Are Saying, the FAQ heading and
     Ready to Start Creatine. One step below the hero at BOTH widths, which is
     the hierarchy the desktop layout was losing. */
  --text-heading2-fontFamily:'Silk Serif Text';
  --text-heading2-fontSize:30px;
  --text-heading2-fontWeight:400;
  --text-heading2-lineHeight:35px;
  --text-heading2-letterSpacing:-0.75px;
  --text-heading4-fontFamily:'Silk Serif Text';
  --text-heading4-fontSize:30px;
  --text-heading4-fontWeight:400;
  --text-heading4-lineHeight:35px;
  --text-heading4-letterSpacing:-0.75px;

  /* Drop-down and FAQ headings. */
  --text-heading3-fontFamily:'Be Vietnam';
  --text-heading3-fontSize:16px;
  --text-heading3-fontWeight:700;
  --text-heading3-lineHeight:24px;
  --text-heading3-letterSpacing:0.6px;
  --text-heading5-fontFamily:'Be Vietnam';
  --text-heading5-fontSize:16px;
  --text-heading5-fontWeight:700;
  --text-heading5-lineHeight:24px;
  --text-heading5-letterSpacing:0.6px;
  --text-heading6-fontFamily:'Be Vietnam';
  --text-heading6-fontSize:16px;
  --text-heading6-fontWeight:700;
  --text-heading6-lineHeight:24px;
  --text-heading6-letterSpacing:0.6px;

  /* Body copy. One size for anything you read as a sentence. */
  --text-paragraph-fontFamily:'Be Vietnam';
  --text-paragraph-fontSize:16px;
  --text-paragraph-fontWeight:400;
  --text-paragraph-lineHeight:24px;
  --text-paragraph-letterSpacing:0.6px;
  --text-paragraph2-fontFamily:'Be Vietnam';
  --text-paragraph2-fontSize:16px;
  --text-paragraph2-fontWeight:400;
  --text-paragraph2-lineHeight:24px;
  --text-paragraph2-letterSpacing:0.6px;

  /* Buttons. */
  --text-button-fontFamily:'Be Vietnam';
  --text-button-fontSize:16px;
  --text-button-fontWeight:700;
  --text-button-lineHeight:20px;
  --text-button-letterSpacing:0.6px;

  /* Trust lines, ratings, legal. */
  --text-muted-fontFamily:'Be Vietnam';
  --text-muted-fontSize:13px;
  --text-muted-fontWeight:400;
  --text-muted-lineHeight:19px;
  --text-muted-letterSpacing:0.6px;
}

/* Anything still asking for Assistant by name. */
body.tpl-evolve-creatine-listicle [style*="Assistant"],
body.tpl-evolve-creatine-listicle-plum [style*="Assistant"]{
  font-family:'Be Vietnam',sans-serif !important;
}

/* The 44px numbers. The size is written inline in each reason section, so it
   needs !important to move, and the weight drops to 400 because Silk Serif
   Text ships regular only. The line was 44px on desktop against a 44px
   letter, i.e. no room at all for a descender. */
body.tpl-evolve-creatine-listicle [style*="font-size:44px"],
body.tpl-evolve-creatine-listicle-plum [style*="font-size:44px"]{
  font-size:44px !important;
  font-weight:400 !important;
  line-height:51px !important;
  letter-spacing:-0.88px !important;
}

/* Buy box: product name down to the heading size, CTA and price to 20px. */
body.tpl-evolve-creatine-listicle #main-product-11 h2,
body.tpl-evolve-creatine-listicle-plum #main-product-11 h2{
  font-size:30px !important;
  line-height:35px !important;
  font-weight:400 !important;
  letter-spacing:-0.75px !important;
}
body.tpl-evolve-creatine-listicle #main-product-11 span.uppercase.flex-1,
body.tpl-evolve-creatine-listicle-plum #main-product-11 span.uppercase.flex-1,
body.tpl-evolve-creatine-listicle .zb-cta,
body.tpl-evolve-creatine-listicle-plum .zb-cta{
  font-size:20px !important;
  font-weight:700 !important;
  line-height:24px !important;
  letter-spacing:0.6px !important;
}
body.tpl-evolve-creatine-listicle #main-product-11 button p[class*="text-small"],
body.tpl-evolve-creatine-listicle-plum #main-product-11 button p[class*="text-small"]{
  font-size:20px !important;
  font-weight:700 !important;
  line-height:24px !important;
}
body.tpl-evolve-creatine-listicle [id="main-product-11"] p[class*="text-xs"],
body.tpl-evolve-creatine-listicle-plum [id="main-product-11"] p[class*="text-xs"]{
  font-size:13px !important;
  line-height:19px !important;
}

/* The sticky bar and the hero rating line. The sticky price was 12px on
   desktop and 14px on a phone, i.e. smaller on the bigger screen. */
body.tpl-evolve-creatine-listicle .fixed.bottom-0 [class*="flex-col"] > *:first-child,
body.tpl-evolve-creatine-listicle-plum .fixed.bottom-0 [class*="flex-col"] > *:first-child{
  font-size:16px !important;line-height:24px !important;
}
body.tpl-evolve-creatine-listicle .fixed.bottom-0 [class*="flex-col"] > *:nth-child(2),
body.tpl-evolve-creatine-listicle-plum .fixed.bottom-0 [class*="flex-col"] > *:nth-child(2){
  font-size:16px !important;line-height:24px !important;
}
body.tpl-evolve-creatine-listicle [id="hero-6-2"] p.whitespace-nowrap,
body.tpl-evolve-creatine-listicle-plum [id="hero-6-2"] p.whitespace-nowrap{
  font-size:13px !important;line-height:19px !important;
}

/* Footer and legal. Were 12px on desktop, which is below the floor and
   smaller than the phone. */
body.tpl-evolve-creatine-listicle [id^="footer-"] p,
body.tpl-evolve-creatine-listicle-plum [id^="footer-"] p,
body.tpl-evolve-creatine-listicle [id^="footer-"] a,
body.tpl-evolve-creatine-listicle-plum [id^="footer-"] a{
  font-size:13px !important;line-height:19px !important;
}

/* The announcement bar carries the UPDATE message, so it reads at body size
   rather than shrinking on a phone. */
body.tpl-evolve-creatine-listicle .pm-update-msg,
body.tpl-evolve-creatine-listicle-plum .pm-update-msg,
body.tpl-evolve-creatine-listicle .pm-update-label,
body.tpl-evolve-creatine-listicle-plum .pm-update-label{
  font-size:16px !important;line-height:24px !important;letter-spacing:0.6px !important;
}
body.tpl-evolve-creatine-listicle .pm-topbar-msg,
body.tpl-evolve-creatine-listicle-plum .pm-topbar-msg{
  font-size:13px !important;line-height:19px !important;
}

/* The drop-down panels. These were the worst offenders: 14px body, 13px
   tables, 12px and 12.5px captions, and a .88em rule that resolved to the
   12.32px nobody chose. */
body.tpl-evolve-creatine-listicle .mgl-acc,
body.tpl-evolve-creatine-listicle-plum .mgl-acc,
body.tpl-evolve-creatine-listicle .mgl-acc .mgl-acc__lead,
body.tpl-evolve-creatine-listicle-plum .mgl-acc .mgl-acc__lead{
  font-size:16px !important;line-height:24px !important;
}
body.tpl-evolve-creatine-listicle .mgl-acc .mgl-acc__chips span,
body.tpl-evolve-creatine-listicle-plum .mgl-acc .mgl-acc__chips span,
body.tpl-evolve-creatine-listicle .mgl-acc .mgl-acc__spec,
body.tpl-evolve-creatine-listicle-plum .mgl-acc .mgl-acc__spec,
body.tpl-evolve-creatine-listicle .mgl-acc .mgl-acc__icons li,
body.tpl-evolve-creatine-listicle-plum .mgl-acc .mgl-acc__icons li,
body.tpl-evolve-creatine-listicle .mgl-acc .mgl-acc__steps b,
body.tpl-evolve-creatine-listicle-plum .mgl-acc .mgl-acc__steps b,
body.tpl-evolve-creatine-listicle .mgl-acc .mgl-acc__steps span,
body.tpl-evolve-creatine-listicle-plum .mgl-acc .mgl-acc__steps span,
body.tpl-evolve-creatine-listicle .mgl-acc .mgl-acc__note,
body.tpl-evolve-creatine-listicle-plum .mgl-acc .mgl-acc__note,
body.tpl-evolve-creatine-listicle .mgl-acc .mgl-acc__ing div>span,
body.tpl-evolve-creatine-listicle-plum .mgl-acc .mgl-acc__ing div>span,
body.tpl-evolve-creatine-listicle .mgl-acc a.mgl-acc__link,
body.tpl-evolve-creatine-listicle-plum .mgl-acc a.mgl-acc__link,
body.tpl-evolve-creatine-listicle .mgl-cmp .mgl-cmp__lead,
body.tpl-evolve-creatine-listicle-plum .mgl-cmp .mgl-cmp__lead,
body.tpl-evolve-creatine-listicle .mgl-cmp .mgl-cmp__row>span,
body.tpl-evolve-creatine-listicle-plum .mgl-cmp .mgl-cmp__row>span,
body.tpl-evolve-creatine-listicle .pm-fine,
body.tpl-evolve-creatine-listicle-plum .pm-fine{
  font-size:13px !important;line-height:19px !important;
}
body.tpl-evolve-creatine-listicle .mgl-cmp .mgl-cmp__title,
body.tpl-evolve-creatine-listicle-plum .mgl-cmp .mgl-cmp__title{
  font-size:20px !important;line-height:24px !important;font-weight:700 !important;
}

/* Trust pills and the star rating line. */
body.tpl-evolve-creatine-listicle .zh-pill,
body.tpl-evolve-creatine-listicle-plum .zh-pill,
body.tpl-evolve-creatine-listicle .zh-score,
body.tpl-evolve-creatine-listicle-plum .zh-score,
body.tpl-evolve-creatine-listicle .zh-count,
body.tpl-evolve-creatine-listicle-plum .zh-count{
  font-size:13px !important;line-height:19px !important;
}

/* Silk Serif Text ships one weight. Anything asking for a heavier one was
   getting a browser-faked bold. */
body.tpl-evolve-creatine-listicle [style*="Silk Serif"],
body.tpl-evolve-creatine-listicle-plum [style*="Silk Serif"],
body.tpl-evolve-creatine-listicle h1,body.tpl-evolve-creatine-listicle h2,
body.tpl-evolve-creatine-listicle h4,body.tpl-evolve-creatine-listicle-plum h1,
body.tpl-evolve-creatine-listicle-plum h2,body.tpl-evolve-creatine-listicle-plum h4{
  font-weight:400 !important;
}

/* Be Vietnam has no 500 and no 600. Snap the two weights that used them. */
body.tpl-evolve-creatine-listicle [style*="font-weight:500"],
body.tpl-evolve-creatine-listicle-plum [style*="font-weight:500"],
body.tpl-evolve-creatine-listicle .font-medium,
body.tpl-evolve-creatine-listicle-plum .font-medium,
body.tpl-evolve-creatine-listicle .font-semibold,
body.tpl-evolve-creatine-listicle-plum .font-semibold{
  font-weight:700 !important;
}

/* The ingredients link kept the teal green on the plum page. */
body.tpl-evolve-creatine-listicle-plum a.mgl-acc__link,
body.tpl-evolve-creatine-listicle-plum .mgl-acc a[style*="108474"],
body.tpl-evolve-creatine-listicle-plum [style*="color:#108474"]{
  color:var(--zend-navy) !important;
}

/* ---- PART B, second pass: the utility classes the first pass did not reach.
   The reference framework styles a lot of text through small utility classes
   (.text-small, .text-xs, .font-medium) and through its own named blocks
   (.pm-steps, .zh-pill, .pm-update-msg), none of which read the type tokens.
   Those are what was still landing on 14px, 12px and Assistant. ---- */

/* Be Vietnam everywhere except the serif headings. */
body.tpl-evolve-creatine-listicle,
body.tpl-evolve-creatine-listicle,
body.tpl-evolve-creatine-listicle *,
body.tpl-evolve-creatine-listicle-plum,
body.tpl-evolve-creatine-listicle-plum *{
  font-family:'Be Vietnam',sans-serif;
}
body.tpl-evolve-creatine-listicle h1,
body.tpl-evolve-creatine-listicle h2,
body.tpl-evolve-creatine-listicle h4,
body.tpl-evolve-creatine-listicle h1 *,
body.tpl-evolve-creatine-listicle h2 *,
body.tpl-evolve-creatine-listicle h4 *,
body.tpl-evolve-creatine-listicle .pm-lead,
body.tpl-evolve-creatine-listicle .pm-headline,
body.tpl-evolve-creatine-listicle [style*="Silk Serif"],
body.tpl-evolve-creatine-listicle [style*="font-size:44px"],
body.tpl-evolve-creatine-listicle-plum h1,
body.tpl-evolve-creatine-listicle-plum h2,
body.tpl-evolve-creatine-listicle-plum h4,
body.tpl-evolve-creatine-listicle-plum h1 *,
body.tpl-evolve-creatine-listicle-plum h2 *,
body.tpl-evolve-creatine-listicle-plum h4 *,
body.tpl-evolve-creatine-listicle-plum .pm-lead,
body.tpl-evolve-creatine-listicle-plum .pm-headline,
body.tpl-evolve-creatine-listicle-plum [style*="Silk Serif"],
body.tpl-evolve-creatine-listicle-plum [style*="font-size:44px"]{
  font-family:'Silk Serif Text',serif !important;
}

/* Body copy utilities. */
body.tpl-evolve-creatine-listicle [class*="text-small"],
body.tpl-evolve-creatine-listicle-plum [class*="text-small"],
body.tpl-evolve-creatine-listicle .pm-steps,
body.tpl-evolve-creatine-listicle-plum .pm-steps,
body.tpl-evolve-creatine-listicle .pm-steps span,
body.tpl-evolve-creatine-listicle-plum .pm-steps span,
body.tpl-evolve-creatine-listicle .pm-steps b,
body.tpl-evolve-creatine-listicle-plum .pm-steps b,
body.tpl-evolve-creatine-listicle .pm-cards,
body.tpl-evolve-creatine-listicle-plum .pm-cards,
body.tpl-evolve-creatine-listicle .pm-cards span,
body.tpl-evolve-creatine-listicle-plum .pm-cards span,
body.tpl-evolve-creatine-listicle .pm-cards b,
body.tpl-evolve-creatine-listicle-plum .pm-cards b{
  font-size:16px !important;
  line-height:24px !important;
  letter-spacing:0.6px !important;
}

/* Fine print utilities. */
body.tpl-evolve-creatine-listicle [class*="text-xs"],
body.tpl-evolve-creatine-listicle-plum [class*="text-xs"],
body.tpl-evolve-creatine-listicle [class*="text-tiny"],
body.tpl-evolve-creatine-listicle-plum [class*="text-tiny"],
body.tpl-evolve-creatine-listicle .pm-fine,
body.tpl-evolve-creatine-listicle-plum .pm-fine,
body.tpl-evolve-creatine-listicle .rounded-button .font-medium,
body.tpl-evolve-creatine-listicle-plum .rounded-button .font-medium{
  font-size:13px !important;
  line-height:19px !important;
  letter-spacing:0.6px !important;
}

/* Named blocks that carry their own sizes. */
body.tpl-evolve-creatine-listicle .pm-update-msg,
body.tpl-evolve-creatine-listicle-plum .pm-update-msg,
body.tpl-evolve-creatine-listicle .pm-update-label,
body.tpl-evolve-creatine-listicle-plum .pm-update-label,
body.tpl-evolve-creatine-listicle .pm-update a,
body.tpl-evolve-creatine-listicle-plum .pm-update a,
body.tpl-evolve-creatine-listicle #zend-buybox-head p,
body.tpl-evolve-creatine-listicle-plum #zend-buybox-head p,
body.tpl-evolve-creatine-listicle #zend-buybox-head li,
body.tpl-evolve-creatine-listicle-plum #zend-buybox-head li{
  font-family:'Be Vietnam',sans-serif !important;
}
body.tpl-evolve-creatine-listicle .zh-pill,
body.tpl-evolve-creatine-listicle-plum .zh-pill,
body.tpl-evolve-creatine-listicle .zh-score,
body.tpl-evolve-creatine-listicle-plum .zh-score,
body.tpl-evolve-creatine-listicle .zh-count,
body.tpl-evolve-creatine-listicle-plum .zh-count,
body.tpl-evolve-creatine-listicle .pm-topbar-msg,
body.tpl-evolve-creatine-listicle-plum .pm-topbar-msg{
  font-family:'Be Vietnam',sans-serif !important;
}

/* The hero eyebrow was 22px on desktop and 19.11px on a phone. */
body.tpl-evolve-creatine-listicle .pm-lead,
body.tpl-evolve-creatine-listicle-plum .pm-lead{
  font-size:20px !important;
  line-height:26px !important;
  letter-spacing:-0.4px !important;
  font-weight:400 !important;
}

/* Stars. A glyph, but it still has to sit on the scale. */
body.tpl-evolve-creatine-listicle .zh-stars,
body.tpl-evolve-creatine-listicle-plum .zh-stars{
  font-size:20px !important;
  line-height:20px !important;
}

/* Buttons: every label 16px, then the one buy box call to action at 20px.
   This rule sits after the 16px rule on purpose, so it wins the tie. */
body.tpl-evolve-creatine-listicle button span,
body.tpl-evolve-creatine-listicle-plum button span,
body.tpl-evolve-creatine-listicle a[class*="rounded-button"] span,
body.tpl-evolve-creatine-listicle-plum a[class*="rounded-button"] span{
  font-size:16px !important;
  font-weight:700 !important;
  line-height:20px !important;
  letter-spacing:0.6px !important;
}
body.tpl-evolve-creatine-listicle .zb-cta,
body.tpl-evolve-creatine-listicle-plum .zb-cta,
body.tpl-evolve-creatine-listicle .zb-cta *,
body.tpl-evolve-creatine-listicle-plum .zb-cta *,
body.tpl-evolve-creatine-listicle #zend-buybox-head ~ * button span,
body.tpl-evolve-creatine-listicle-plum #zend-buybox-head ~ * button span{
  font-size:20px !important;
  font-weight:700 !important;
  line-height:24px !important;
}

/* Be Vietnam ships Regular and Bold only, so 500 and 600 both round to 700. */
body.tpl-evolve-creatine-listicle .font-medium,
body.tpl-evolve-creatine-listicle-plum .font-medium,
body.tpl-evolve-creatine-listicle .font-semibold,
body.tpl-evolve-creatine-listicle-plum .font-semibold,
body.tpl-evolve-creatine-listicle [class*="!font-medium"],
body.tpl-evolve-creatine-listicle-plum [class*="!font-medium"],
body.tpl-evolve-creatine-listicle [style*="font-weight:500"],
body.tpl-evolve-creatine-listicle-plum [style*="font-weight:500"],
body.tpl-evolve-creatine-listicle [style*="font-weight:600"],
body.tpl-evolve-creatine-listicle-plum [style*="font-weight:600"]{
  font-weight:700 !important;
}

/* Last two at 600, which Be Vietnam does not have: the sticky bar product
   name and the guarantee pill. */
body.tpl-evolve-creatine-listicle .zh-pill,
body.tpl-evolve-creatine-listicle-plum .zh-pill,
body.tpl-evolve-creatine-listicle .fixed.bottom-0 p,
body.tpl-evolve-creatine-listicle-plum .fixed.bottom-0 p,
body.tpl-evolve-creatine-listicle .fixed.bottom-0 span,
body.tpl-evolve-creatine-listicle-plum .fixed.bottom-0 span{
  font-weight:700 !important;
}

/* The sticky bar product name and the ingredients link, the last two. */
body.tpl-evolve-creatine-listicle [class*="truncate"],
body.tpl-evolve-creatine-listicle-plum [class*="truncate"]{
  font-weight:700 !important;
}
body.tpl-evolve-creatine-listicle-plum a.mgl-buylink,
body.tpl-evolve-creatine-listicle-plum a.mgl-buylink span,
body.tpl-evolve-creatine-listicle-plum .mgl-buylink-wrap a,
body.tpl-evolve-creatine-listicle-plum .mgl-buylink-wrap span{
  color:var(--zend-navy) !important;
}

/* This theme carries real Be Vietnam Medium and SemiBold, so nothing is ever
   drawn as a browser-faked bold. The page still uses 400 and 700 only; the
   other two are declared so any rule missed here lands on a real file. */
/* This theme already carries real Medium and SemiBold files, declared above. */

/* ---- PART B, phone pass. Three things only showed up at 390px. ---- */

/* The five section headings are sized by the .text-xl utility inside a phone
   media query, which beat the token and left them at 31px. */
body.tpl-evolve-creatine-listicle [class*="text-xl"],
body.tpl-evolve-creatine-listicle-plum [class*="text-xl"],
body.tpl-evolve-creatine-listicle [class*="text-xl"] > span,
body.tpl-evolve-creatine-listicle-plum [class*="text-xl"] > span,
body.tpl-evolve-creatine-listicle [class*="text-3xl"],
body.tpl-evolve-creatine-listicle-plum [class*="text-3xl"],
body.tpl-evolve-creatine-listicle [class*="text-2xl"],
body.tpl-evolve-creatine-listicle-plum [class*="text-2xl"]{
  font-size:30px !important;
  line-height:35px !important;
  letter-spacing:-0.75px !important;
}

/* The hero rating line and anything nested inside it. */
body.tpl-evolve-creatine-listicle [id="hero-6-2"] p.whitespace-nowrap,
body.tpl-evolve-creatine-listicle-plum [id="hero-6-2"] p.whitespace-nowrap,
body.tpl-evolve-creatine-listicle [id="hero-6-2"] p.whitespace-nowrap *,
body.tpl-evolve-creatine-listicle-plum [id="hero-6-2"] p.whitespace-nowrap *{
  font-size:13px !important;
  line-height:19px !important;
}

/* Silk Serif Text has one weight. This has to be the last word on the file,
   because the 500-and-600 rounding rule above would otherwise push the 44px
   numbers to 700 and the browser would fake a bold that does not exist. */
body.tpl-evolve-creatine-listicle [style*="font-size:44px"],
body.tpl-evolve-creatine-listicle-plum [style*="font-size:44px"],
body.tpl-evolve-creatine-listicle h1,body.tpl-evolve-creatine-listicle h2,
body.tpl-evolve-creatine-listicle h4,body.tpl-evolve-creatine-listicle h1 span,
body.tpl-evolve-creatine-listicle h2 span,body.tpl-evolve-creatine-listicle h4 span,
body.tpl-evolve-creatine-listicle .pm-lead,body.tpl-evolve-creatine-listicle .pm-headline,
body.tpl-evolve-creatine-listicle-plum h1,body.tpl-evolve-creatine-listicle-plum h2,
body.tpl-evolve-creatine-listicle-plum h4,body.tpl-evolve-creatine-listicle-plum h1 span,
body.tpl-evolve-creatine-listicle-plum h2 span,body.tpl-evolve-creatine-listicle-plum h4 span,
body.tpl-evolve-creatine-listicle-plum .pm-lead,body.tpl-evolve-creatine-listicle-plum .pm-headline{
  font-weight:400 !important;
}

/* The drop-down and FAQ headings are h3 and carry a text-2xl class, so the
   heading rule above caught them and blew them up to 30px serif. They are
   labels, not headings: Be Vietnam, body size, bold, caps. */
body.tpl-evolve-creatine-listicle h3,
body.tpl-evolve-creatine-listicle-plum h3,
body.tpl-evolve-creatine-listicle h3 span,
body.tpl-evolve-creatine-listicle-plum h3 span,
body.tpl-evolve-creatine-listicle h3[class*="text-2xl"],
body.tpl-evolve-creatine-listicle-plum h3[class*="text-2xl"]{
  font-family:'Be Vietnam',sans-serif !important;
  font-size:16px !important;
  line-height:24px !important;
  font-weight:700 !important;
  letter-spacing:0.6px !important;
}