/* ============================================================
   theme-head-3.min.css — combined head stylesheet part 3, 05 Sep 2026
   Order preserved: media, hero, price, custom, cls-fixes v3.
   Loads directly after theme-head-2.min.css. Edits go HERE.
   ============================================================ */

/* ---- 4/8 media.aio.min.css ---- */
.\#media-caption, .\#media-overlay {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
}
.\#media {
    margin: 0;
    height: var(--media-height, auto);
    width: var(--media-width, 100%);
    position: relative;
    overflow: hidden;
    z-index: 1;
}
@media (max-width: 991px) {
    .\#media {
        height: var(--media-height-mobile, var(--media-height, auto));
    }
    .\#media.\@mobile-full {
        max-height: -webkit-fill-available;
    }
}
.\#media.\@aspect-ratio\:1x1:before,
.\#media.\@aspect-ratio\:4x3:before,
.\#media.\@aspect-ratio\:3x4:before,
.\#media.\@aspect-ratio\:3x2:before,
.\#media.\@aspect-ratio\:2x3:before,
.\#media.\@aspect-ratio\:4x5:before,
.\#media.\@aspect-ratio\:8x10:before,
.\#media.\@aspect-ratio\:9x16:before,
.\#media.\@aspect-ratio\:16x9:before,
.\#media.\@aspect-ratio\:21x9:before {
    display: block;
    content: "";
    width: 100%;
}
.\#media.\@aspect-ratio\:1x1:before { padding-top: 100%; }
.\#media.\@aspect-ratio\:4x3:before { padding-top: 75%; }
.\#media.\@aspect-ratio\:3x4:before { padding-top: 133.3333333333%; }
.\#media.\@aspect-ratio\:3x2:before { padding-top: 66.6666666667%; }
.\#media.\@aspect-ratio\:2x3:before { padding-top: 150%; }
.\#media.\@aspect-ratio\:4x5:before { padding-top: 125%; }
.\#media.\@aspect-ratio\:8x10:before { padding-top: 125%; }
.\#media.\@aspect-ratio\:9x16:before { padding-top: 177.7777777778%; }
.\#media.\@aspect-ratio\:16x9:before { padding-top: 56.25%; }
.\#media.\@aspect-ratio\:21x9:before { padding-top: 42.8571428571%; }
@media (max-width: 991px) {
    .\#media.\@aspect-ratio\:mobile\:1x1:before,
    .\#media.\@aspect-ratio\:mobile\:4x3:before,
    .\#media.\@aspect-ratio\:mobile\:3x4:before,
    .\#media.\@aspect-ratio\:mobile\:3x2:before,
    .\#media.\@aspect-ratio\:mobile\:2x3:before,
    .\#media.\@aspect-ratio\:mobile\:4x5:before,
    .\#media.\@aspect-ratio\:mobile\:8x10:before,
    .\#media.\@aspect-ratio\:mobile\:9x16:before,
    .\#media.\@aspect-ratio\:mobile\:16x9:before,
    .\#media.\@aspect-ratio\:mobile\:21x9:before {
        display: block;
        content: "";
        width: 100%;
    }
    .\#media.\@aspect-ratio\:mobile\:1x1:before { padding-top: 100%; }
    .\#media.\@aspect-ratio\:mobile\:4x3:before { padding-top: 75%; }
    .\#media.\@aspect-ratio\:mobile\:3x4:before { padding-top: 133.3333333333%; }
    .\#media.\@aspect-ratio\:mobile\:3x2:before { padding-top: 66.6666666667%; }
    .\#media.\@aspect-ratio\:mobile\:2x3:before { padding-top: 150%; }
    .\#media.\@aspect-ratio\:mobile\:4x5:before { padding-top: 125%; }
    .\#media.\@aspect-ratio\:mobile\:8x10:before { padding-top: 125%; }
    .\#media.\@aspect-ratio\:mobile\:9x16:before { padding-top: 177.7777777778%; }
    .\#media.\@aspect-ratio\:mobile\:16x9:before { padding-top: 56.25%; }
    .\#media.\@aspect-ratio\:mobile\:21x9:before { padding-top: 42.8571428571%; }
    .\#media.\@aspect-ratio\:mobile\:none:before { display: none; }
}
.\#media.\@rounded { border-radius: 50%; }
.\#media.\@rounded .\#media-image { border-radius: 50%; }
.\#media-wrapper.\@rounded { border-radius: 50%; }
.\#media-image {
    height: auto;
    display: block;
    object-position: var(--object-position);
}
.\#media-image:not(.\@origin-res) { width: var(--media-image-with, 100%); }
.\#media-image.\@origin-res { max-width: 100%; }
.\#media-image-wrapper {
    position: relative;
    height: 100%;
    width: 100%;
}
.\#media-image-wrapper.\@abs-image {
    top: 0;
    left: 0;
    position: absolute;
}
@media (min-width: 992px) {
    .\#media-image-wrapper.\@abs-image\:desktop {
        top: 0;
        left: 0;
        position: absolute;
    }
}
@media (max-width: 991px) {
    .\#media-image-wrapper.\@abs-image\:mobile {
        top: 0;
        left: 0;
        position: absolute;
    }
}
.\#media-image.\@cover {
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
@media (min-width: 992px) {
    .\#media-image.\@cover\:desktop {
        top: 0;
        left: 0;
        position: absolute;
        z-index: 1;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}
@media (max-width: 991px) {
    .\#media-image.\@cover\:mobile {
        top: 0;
        left: 0;
        position: absolute;
        z-index: 1;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}
.\#media-image.\@position\:center {
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-fit: contain;
    object-position: center center;
}
.\#media-image.\@position\:bottom {
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-fit: contain;
    object-position: bottom center;
}
.\#media-image.\@position\:\:desktopcenter {
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-fit: contain;
    object-position: center center;
}
.\#media-image.\@position\:\:desktopbottom {
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-fit: contain;
    object-position: bottom center;
}
.\#media-image.\@position\:\:mobilecenter {
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-fit: contain;
    object-position: center center;
}
.\#media-image.\@position\:\:mobilebottom {
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-fit: contain;
    object-position: bottom center;
}
.\#media-map {
    z-index: 5 !important;
    height: 100%;
    position: absolute;
    width: 100%;
}
.\#media-map > .\#google-map { position: absolute !important; }
.\#media-video-bg {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 3;
    background: #1a1a1a;
    display: flex;
    align-items: center;
    justify-content: center;
}
.\#media-video-bg .\#spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.\#media-video-bg[loading] { z-index: 20; }
.\#media-video-bg[loading] .\#media-video-bg-player { opacity: 0; }
.\#media-video-bg-player {
    flex-grow: 1;
    flex-shrink: 0;
    position: relative;
    transition: 0.3s;
}
@supports (aspect-ratio: 16/9) {
    .\#media-video-bg-player {
        min-height: 100%;
        min-width: 100%;
        aspect-ratio: 16/9;
    }
}
@supports not (aspect-ratio: 16/9) {
    .\#media-video-bg-player {
        padding-top: 56.25%;
        height: 0;
    }
    @media (max-width: 991px) {
        .\#media-video-bg-player {
            width: 300%;
            min-height: 100%;
        }
    }
}
.\#media-video-bg-player .plyr,
.\#media-video-bg-player iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.\#media-video-bg .plyr__controls,
.\#media-video-bg .plyr__control { display: none !important; }
.\#media-overlay {
    z-index: 4;
    opacity: var(--media-overlay, 0);
}
.\#media-overlay.\@color-scheme\:default { background-color: rgba(var(--color-background), 1); }
.\#media-overlay.\@color-scheme\:invert { background-color: rgba(var(--color-text), 1); }
.\#media-overlay.\@color-scheme\:alt { background-color: rgba(var(--color-alt-background), 1); }
.\#media-overlay.\@color-scheme\:accent { background-color: rgba(var(--color-accent), 1); }
.\#media-caption { z-index: 5; }
.\#media-caption-container {
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
}
.\#media-caption-container.\@x\:center { justify-content: center; }
.\#media-caption-container.\@x\:right { justify-content: flex-end; }
.\#media-caption-container.\@y\:center { align-items: center; }
.\#media-caption-container.\@y\:bottom { align-items: flex-end; }
.\$hover\:media-zoom .\#media-image-wrapper {
    transition: transform 3s;
    transform: rotate(0.01deg) translateZ(0);
}
@media (hover: hover) {
    .\$hover\:media-zoom:hover .\#media-image-wrapper {
        transform: scale(1.1) rotate(0.01deg) translateZ(0);
    }
}
.\#media-placeholder {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.\#media-placeholder.\@color-scheme\:default {
    background: rgba(var(--color-background), 1);
    color: rgba(var(--color-text), 0.5);
}
.\#media-placeholder.\@color-scheme\:invert {
    background: rgba(var(--color-text), 0.7);
    color: rgba(var(--color-background), 0.5);
}
.\#media-placeholder > svg { fill: currentColor; }

/* ---- 5/8 hero.aio.min.css ---- */
.\#hero{font-size:calc(var(--font-size-base) * 1);width:min(35em,100%);margin-left:auto;margin-right:auto;color:rgba(var(--color-text),1)}.\#hero .\#button-group .\#button{position:relative;z-index:22}.\#hero-link{position:absolute;display:block;left:0;top:0;width:100%;height:100%;z-index:2}.\#hero.\@padded{padding:2rem}.\#hero.\@color-scheme\:invert{color:rgba(var(--color-background),1)}.\#hero.\@color-scheme\:invert.\@background{background-color:rgba(var(--color-text),1)}.\#hero.\@color-scheme\:accent{color:rgba(var(--color-accent-c),1)}.\#hero.\@color-scheme\:accent.\@background{background-color:rgba(var(--color-accent),1)}.\#hero.\@color-scheme\:default{color:rgba(var(--color-text),1)}.\#hero.\@color-scheme\:default.\@background{background:rgba(var(--color-background),1)}.\#hero.\@color-scheme\:alt{color:rgba(var(--color-text),1)}.\#hero.\@color-scheme\:alt.\@background{background:rgba(var(--color-alt-background),1)}.\#hero.\@color-scheme\:inherit{color:inherit}.\#hero.\@color-scheme\:inherit.\@background{background-color:inherit}.\#hero.\@align\:left{text-align:left}.\#hero.\@align\:left .\#hero-newsletter{margin-left:0;margin-right:auto}.\#hero.\@align\:center{text-align:center}.\#hero.\@align\:center .\#hero-newsletter{margin-left:auto;margin-right:auto}.\#hero.\@align\:center .\#hero-newsletter-msg{justify-content:center}.\#hero.\@align\:center .\#hero-social .\#social-profiles{justify-content:center}.\#hero.\@align\:right{text-align:right}.\#hero.\@align\:right .\#hero-newsletter{margin-left:auto;margin-right:0}.\#hero.\@align\:right .\#hero-newsletter-msg{justify-content:flex-end}.\#hero.\@align\:right .\#hero-social .\#social-profiles{justify-content:flex-end}.\#hero.\@spaced\:md>.\#hero-block+.\#hero-block{margin-top:.5em}.\#hero.\@spaced\:md :last-child.\#hero-block.\@spaced-block{margin-top:.875em}.\#hero.\@spaced\:lg>.\#hero-block+.\#hero-block{margin-top:1em}.\#hero.\@spaced\:lg :last-child.\#hero-block.\@spaced-block{margin-top:1.75em}.\#hero.\@spaced\:xl>.\#hero-block+.\#hero-block{margin-top:1.5em}.\#hero.\@spaced\:xl :last-child.\#hero-block.\@spaced-block{margin-top:2.625em}.\#hero.\@spaced\:sm>.\#hero-block+.\#hero-block{margin-top:.165em}.\#hero.\@spaced\:sm :last-child.\#hero-block.\@spaced-block{margin-top:.28875em}.\#hero.\@size\:xxs{font-size:calc(var(--font-size-base) * .3)}.\#hero.\@size\:xs{font-size:calc(var(--font-size-base) * .5)}.\#hero.\@size\:sm{font-size:calc(var(--font-size-base) * .8)}.\#hero.\@size\:lg{font-size:calc(var(--font-size-base) * 1.2)}.\#hero.\@size\:xl{font-size:calc(var(--font-size-base) * 1.6)}.\#hero.\@size\:xxl{font-size:calc(var(--font-size-base) * 2.2)}.\#hero-icon .\#icon{cursor:pointer;opacity:.64;width:5em;height:5em}.\#hero-icon .\#icon:hover{opacity:1}.\#hero-heading{margin-bottom:0;font-size:2.7em}@media (max-width:991px){.\#hero-heading{font-size:1.8em}}.\#hero-text{opacity:.8;font-size:clamp(.85rem, 1.5em, 2rem);line-height:1.4}@media (max-width:991px){.\#hero-text{font-size:clamp(.85rem, 1.15em, 1.5rem)}}.\#hero-text>p{margin-bottom:.5em}.\#hero-text>p:last-child{margin-bottom:0}.\#hero-social .\#social-profiles{display:flex;gap:1rem;align-items:center}.\#hero-social .\#social-profiles-item{opacity:.64;transition:.3s}.\#hero-social .\#social-profiles-item:hover{opacity:1}.\#hero-social .\#social-profiles-item .\#icon{width:1.5em;height:1.5em}.\#hero-newsletter{display:flex;margin:0 auto;width:min(100%,35rem);border:2px solid;padding:calc(var(--spacer) * .5);border-radius:calc(var(--spacer) * 2)}.\#hero-newsletter-msg{gap:.5rem;display:flex;align-items:center;margin-bottom:.5rem;font-weight:var(--font-body-weight-bold);outline:0!important}.\#hero-newsletter-msg .\#icon{stroke-width:3}.\#hero-newsletter-msg.\@type\:success{color:rgba(var(--color-success),1)}.\#hero-newsletter-msg.\@type\:error{color:rgba(var(--color-error),1)}.\#hero-newsletter-input{display:block;flex-shrink:0;flex-grow:1;background:0 0;border-radius:3rem;margin-right:calc(var(--spacer) * .5);border:none;outline:0!important;color:inherit;font-size:calc(var(--font-size-base) * 1.25);padding-left:calc(var(--spacer) * 1);padding-right:calc(var(--spacer) * 1);padding-top:calc(var(--spacer) * .7);padding-bottom:calc(var(--spacer) * .7)}.\#hero-newsletter-input::placeholder{color:inherit;opacity:.64}.\#hero-newsletter-input:-webkit-autofill{text-align:center}

/* ---- 6/8 price.aio.min.css ---- */
.\#price{display:flex;gap:.5em;margin-bottom:0}.\#price-item-heading{font-weight:400;opacity:.64;font-size:13px;margin-bottom:2px}.\#price-item-value{margin-bottom:0;line-height:1}.\#price-item.\@compare .\#price-value{opacity:.64;text-decoration:line-through}.\#price-item.\@on-sale .\#price-value{color:rgba(var(--color-sale-price),1)}.\#price-value-range{margin:0 .35em;opacity:.4}.\#price-value-from{opacity:.4;margin-right:.5em}

/* ---- 7/8 custom.aio.min.css ---- */
.\#container,.\#grid.\@container,.swiper{padding-left:15px;padding-right:15px;max-width:1170px;margin:0 auto}.\#article-card-exerpt{height:50px}.blog-slider{padding:0 15px 40px 15px!important}.blog-slider .swiper-slide{overflow:hidden}.swiper-pagination-bullet-active{background:#5c5c5c!important;width:10px!important;height:10px!important;vertical-align:middle}.swiper-pagination-bullet{vertical-align:middle}button.\#button.\@color\:default.\@block.\@size\:lg.pn-button-qglihxllje.sbb:after,button.\#button.\@color\:default.\@block.\@size\:lg.pn-button-qglihxllje.sbb:before{content:inherit}button.\#button.\@color\:default.\@block.\@size\:lg.pn-button-qglihxllje.sbb{background:#000;opacity:.8}button.\#button.\@color\:default.\@block.\@size\:lg.pn-button-qglihxllje.sbb:hover{opacity:1}select.spb-productdescfont{width:100%;height:36px;border:1px solid #ddd}div#infiniteoptions-container{margin-bottom:20px}.spb-label-tooltip label{font-weight:700;margin-bottom:7px;display:block}
@media (min-width:990px){main-nav ul ul{display:grid!important;grid-template-columns:1fr 1fr;min-width:480px}main-nav ul ul li{align-self:start!important}main-nav ul ul li a{justify-content:flex-start!important;text-align:left!important}main-nav li div[data-dropby]{width:auto!important;min-width:480px!important}}

/* ---- 8/8 cls-fixes v3 ---- */
/* LCP fix: exempt the main product section from the section-reveal
   animation (animation-section-reveal.css hides every section body at
   opacity:0 until a late JS observer reveals it — kept the downloaded
   product image invisible for seconds). v3 adds the same exemption for
   the collection product grid (collection-page LCP). */
.shopify-section.product-section .\#section,
.shopify-section:has(.\#collection-grid) .\#section {
  filter: none !important;
  transition: none !important;
}
.shopify-section.product-section .\#section-body,
.shopify-section:has(.\#collection-grid) .\#section-body {
  opacity: 1 !important;
  overflow: visible !important;
  transition: none !important;
}
.shopify-section.product-section .\#section-header,
.shopify-section:has(.\#collection-grid) .\#section-header {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}
.shopify-section.product-section .reveal-animate,
.shopify-section.product-section .reveal-animate-zoom,
.shopify-section:has(.\#collection-grid) .reveal-animate,
.shopify-section:has(.\#collection-grid) .reveal-animate-zoom {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

/* CLS fix: stop layout shifts while the product gallery's Swiper
   initialises. Until .swiper-initialized appears: show only the first
   slide, pin the wrapper to block layout, clip the container. */
.product-section .swiper:not(.swiper-initialized) {
  overflow: hidden;
}
.product-section .swiper:not(.swiper-initialized) .swiper-wrapper {
  display: block;
}
.product-section .swiper:not(.swiper-initialized) .swiper-slide:not(:first-child) {
  display: none;
}
/* ---- CLS hotfix 05 Sep 2026 (from PSI layout-shift culprits) ---- */
/* Payflex widget injects after load inside product-meta and pushes
   everything below it down (shift 0.367). Reserve its box height. */
.payflex-widget-wrapper { min-height: 88px; }
@media (max-width: 991px) {
  .payflex-widget-wrapper { min-height: 104px; }
}
/* Header logo: hold its box while the image loads (shift 0.107).
   Logo file is 1600x288 -> height = width x 0.18 */
.\#main-header-logo-image .\#media,
.\#main-header-logo-image .\#media-image-wrapper { min-height: calc(var(--logo-width) * 0.18); }