/* Xtreme Sweat premium B2B catalogue. Scoped to avoid changes elsewhere. */
#xs-premium-shop{--xs-ink:#131517;--xs-muted:#71757a;--xs-soft:#f4f4f3;--xs-border:#e6e6e4;color:var(--xs-ink);background:#fff;padding:0 0 80px;font-family:inherit}
#xs-premium-shop *,#xs-premium-shop *:before,#xs-premium-shop *:after{box-sizing:border-box}
#xs-premium-shop a{text-decoration:none;color:inherit}
#xs-premium-shop .xs-shop__container{width:min(100% - 64px,1480px);margin:auto}
#xs-premium-shop .xs-shop__hero{min-height:360px;background:linear-gradient(117deg,#151719 0%,#222629 63%,#151719 100%);color:#fff;border-radius:0;display:flex;align-items:center;justify-content:space-between;padding:48px clamp(30px,5vw,80px);overflow:hidden;position:relative}
#xs-premium-shop .xs-shop__hero-copy{z-index:1;max-width:670px}
#xs-premium-shop .xs-shop__breadcrumb{display:flex;gap:12px;align-items:center;font-size:12px;color:#b4b8ba;margin-bottom:48px;flex-wrap:wrap}
#xs-premium-shop .xs-shop__breadcrumb a:hover{color:#fff}
#xs-premium-shop .xs-shop__eyebrow{display:block;letter-spacing:.19em;font-size:11px;font-weight:700;color:#c4c7c9;margin-bottom:12px}
#xs-premium-shop .xs-shop__hero h1{font-size:clamp(40px,5.2vw,79px);font-weight:900;line-height:.99;letter-spacing:-.055em;color:#fff;margin:0 0 18px;text-transform:uppercase}
#xs-premium-shop .xs-shop__hero p{font-size:15px;line-height:1.65;color:#d3d5d6;max-width:480px;margin:0 0 22px}
#xs-premium-shop .xs-shop__hero-link{font-size:13px;font-weight:700;color:white;border-bottom:1px solid #fff;padding-bottom:6px;display:inline-flex;gap:20px}
#xs-premium-shop .xs-shop__hero-mark{font-size:clamp(140px,20vw,330px);font-weight:900;line-height:1;letter-spacing:-.14em;white-space:nowrap;color:rgba(255,255,255,.035);position:absolute;right:6%;bottom:-45px;pointer-events:none}
#xs-premium-shop .xs-shop__hero-mark span{font-size:25px;vertical-align:top;letter-spacing:0}
#xs-premium-shop .xs-shop__categories{display:flex;gap:9px;overflow-x:auto;scrollbar-width:none;padding:29px 1px 26px;border-bottom:1px solid var(--xs-border);white-space:nowrap}
#xs-premium-shop .xs-shop__categories::-webkit-scrollbar{display:none}
#xs-premium-shop .xs-shop__pill{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:11px 21px;border:1px solid #e1e2e2;border-radius:100px;font-size:13px;font-weight:600;line-height:1.2;transition:background .2s,color .2s,border-color .2s}
#xs-premium-shop .xs-shop__pill:hover,#xs-premium-shop .xs-shop__pill.is-active{background:var(--xs-ink);color:#fff;border-color:var(--xs-ink)}
#xs-premium-shop .xs-shop__products{scroll-margin-top:110px}
#xs-premium-shop .xs-shop__toolbar{display:flex;align-items:end;justify-content:space-between;gap:18px;padding:36px 0 24px}
#xs-premium-shop .xs-shop__toolbar-intro h2{font-size:27px;line-height:1.2;font-weight:800;margin:0 0 6px;color:var(--xs-ink);letter-spacing:-.035em}
#xs-premium-shop .xs-shop__toolbar-intro span{font-size:13px;color:var(--xs-muted)}
#xs-premium-shop .xs-shop__toolbar-actions{display:flex;align-items:center;gap:15px}
#xs-premium-shop button,#xs-premium-shop select{font:inherit}
#xs-premium-shop .xs-shop__filter-toggle{border:1px solid var(--xs-border);background:#fff;color:var(--xs-ink);border-radius:4px;padding:11px 17px;font-weight:650;font-size:13px;cursor:pointer;display:flex;align-items:center;gap:9px}
#xs-premium-shop .xs-shop__filter-toggle span{font-size:22px;line-height:14px}
#xs-premium-shop .xs-shop__filter-toggle:hover{border-color:#111}
#xs-premium-shop .xs-shop__sort-form{display:flex;align-items:center;gap:8px;font-size:13px;margin:0}
#xs-premium-shop .xs-shop__sort-form label{margin:0;color:var(--xs-muted)}
#xs-premium-shop .xs-shop__sort-form select{background:#fff;color:#111;border:0;border-bottom:1px solid var(--xs-border);border-radius:0;min-height:36px;padding:5px 20px 5px 3px;font-size:13px;cursor:pointer;box-shadow:none;width:auto}
#xs-premium-shop .xs-shop__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:39px 18px}
#xs-premium-shop .xs-shop__card{margin:0;min-width:0}
#xs-premium-shop .xs-shop__card-image{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:3/4;overflow:hidden;background:var(--xs-soft);border-radius:3px}
#xs-premium-shop .xs-shop__card-image img{display:block;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;transition:transform .45s ease}
#xs-premium-shop .xs-shop__card-image:hover img{transform:scale(1.055)}
#xs-premium-shop .xs-shop__card-arrow{position:absolute;right:14px;bottom:14px;border-radius:50%;width:34px;height:34px;background:#fff;display:grid;place-items:center;font-size:19px;opacity:0;transform:translateY(6px);transition:.2s ease}
#xs-premium-shop .xs-shop__card-image:hover .xs-shop__card-arrow,#xs-premium-shop .xs-shop__card-image:focus-visible .xs-shop__card-arrow{opacity:1;transform:none}
#xs-premium-shop .xs-shop__card-meta{padding:16px 1px 0}
#xs-premium-shop .xs-shop__card-meta h3{font-size:15px;font-weight:750;line-height:1.38;letter-spacing:-.012em;color:var(--xs-ink);margin:0 0 5px}
#xs-premium-shop .xs-shop__card-meta a:hover{text-decoration:underline}
#xs-premium-shop .xs-shop__card-meta p{font-size:13px;color:var(--xs-muted);margin:0;line-height:1.5}
#xs-premium-shop .xs-shop__pagination{padding:44px 0 55px}
#xs-premium-shop .xs-shop__pagination ul{display:flex;gap:8px;justify-content:center;align-items:center;list-style:none;margin:0;padding:0}
#xs-premium-shop .xs-shop__pagination li{margin:0;padding:0}
#xs-premium-shop .xs-shop__pagination a,#xs-premium-shop .xs-shop__pagination span{display:grid;place-items:center;min-width:40px;height:40px;border:1px solid var(--xs-border);padding:0 12px;border-radius:3px;font-size:13px}
#xs-premium-shop .xs-shop__pagination .current,#xs-premium-shop .xs-shop__pagination a:hover{background:#111;color:#fff;border-color:#111}
#xs-premium-shop .xs-shop__empty{text-align:center;padding:90px 20px}
#xs-premium-shop .xs-shop__cta{margin-top:65px;background:#17191b;color:white;padding:clamp(36px,6vw,82px);border-radius:3px}
#xs-premium-shop .xs-shop__cta>span{font-size:11px;letter-spacing:.18em;font-weight:700;color:#b9bcbe}
#xs-premium-shop .xs-shop__cta h2{font-size:clamp(39px,5vw,72px);line-height:1.02;letter-spacing:-.055em;font-weight:900;color:white;margin:20px 0}
#xs-premium-shop .xs-shop__cta p{font-size:15px;color:#ccc;max-width:470px;margin:0 0 27px}
#xs-premium-shop .xs-shop__cta a{display:inline-flex;gap:24px;padding:14px 22px;background:white;color:#111;font-size:13px;font-weight:750;border-radius:2px}
#xs-premium-shop .xs-shop__cta a:hover{background:#ddd}
#xs-premium-shop .xs-shop__filter-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:99997}
#xs-premium-shop .xs-shop__filter-backdrop[hidden]{display:none!important}
#xs-premium-shop .xs-shop__filter-panel{position:fixed;top:0;right:0;bottom:0;width:min(410px,90vw);max-width:100%;background:white;z-index:99998;transform:translateX(103%);transition:transform .25s ease;box-shadow:-10px 0 40px #0002;display:flex;flex-direction:column}
#xs-premium-shop .xs-shop__filter-panel.is-open{transform:translateX(0)}
#xs-premium-shop .xs-shop__filter-head{padding:25px 27px;border-bottom:1px solid var(--xs-border);display:flex;align-items:center;justify-content:space-between}
#xs-premium-shop .xs-shop__filter-head h2{font-size:21px;font-weight:800;margin:0}
#xs-premium-shop .xs-shop__filter-head button{border:0;background:transparent;font-size:30px;cursor:pointer;color:#111;line-height:1}
#xs-premium-shop .xs-shop__filter-body{overflow-y:auto;padding:12px 27px 40px}
#xs-premium-shop .xs-shop__filter-body a{display:flex;align-items:center;justify-content:space-between;padding:16px 0;border-bottom:1px solid var(--xs-border);font-size:14px;font-weight:600}
#xs-premium-shop .xs-shop__filter-body a:hover,#xs-premium-shop .xs-shop__filter-body a.is-active{font-weight:800}
#xs-premium-shop .xs-shop__filter-body span{color:var(--xs-muted);font-size:12px}
body.xs-filters-open{overflow:hidden}
@media(max-width:1199px){#xs-premium-shop .xs-shop__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){#xs-premium-shop .xs-shop__grid{grid-template-columns:repeat(2,minmax(0,1fr))}#xs-premium-shop .xs-shop__container{width:min(100% - 36px,1480px)}#xs-premium-shop .xs-shop__hero{min-height:310px}}
@media(max-width:600px){#xs-premium-shop{padding:0 0 45px}#xs-premium-shop .xs-shop__container{width:calc(100% - 28px)}#xs-premium-shop .xs-shop__hero{min-height:320px;padding:28px 24px}#xs-premium-shop .xs-shop__breadcrumb{margin-bottom:28px;font-size:11px}#xs-premium-shop .xs-shop__hero h1{font-size:42px}#xs-premium-shop .xs-shop__hero p{font-size:13px}#xs-premium-shop .xs-shop__categories{padding:19px 0 20px}#xs-premium-shop .xs-shop__pill{font-size:12px;padding:10px 15px}#xs-premium-shop .xs-shop__toolbar{padding:25px 0 18px;align-items:center;flex-wrap:wrap}#xs-premium-shop .xs-shop__toolbar-intro h2{font-size:22px}#xs-premium-shop .xs-shop__sort-form label{display:none}#xs-premium-shop .xs-shop__toolbar-actions{gap:7px}#xs-premium-shop .xs-shop__filter-toggle{padding:9px 11px}#xs-premium-shop .xs-shop__sort-form select{max-width:115px;font-size:12px}#xs-premium-shop .xs-shop__grid{gap:27px 12px}#xs-premium-shop .xs-shop__card-meta{padding-top:11px}#xs-premium-shop .xs-shop__card-meta h3{font-size:13px}#xs-premium-shop .xs-shop__card-meta p{font-size:12px}#xs-premium-shop .xs-shop__cta{padding:32px 25px;margin-top:42px}#xs-premium-shop .xs-shop__cta h2{font-size:40px}}
@media(prefers-reduced-motion:reduce){#xs-premium-shop *,#xs-premium-shop *:before,#xs-premium-shop *:after{transition:none!important;scroll-behavior:auto!important}}


/* ==============================================================
   XTREME SWEAT — FULL-BLEED HERO / CONTAINED CATALOGUE
   Uses real markup: #xs-premium-shop .xs-shop__hero
   ============================================================= */

/* The shop should not crop a viewport-wide hero. */
body.tax-product_cat,
body.post-type-archive-product {
    overflow-x: clip;
}

#xs-premium-shop {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding-top: 0 !important;
    margin-top: 0 !important;
    overflow: visible !important;
}

#xs-premium-shop .xs-shop__container {
    width: min(calc(100% - 64px), 1480px);
    max-width: 1480px;
    margin-inline: auto;
    overflow: visible !important;
    min-width: 0;
}

/* Push only the dark hero background to BOTH viewport edges.
   The hero copy stays aligned on the catalogue's container rails. */
#xs-premium-shop .xs-shop__hero {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw !important;
    max-width: none !important;
    margin: 0 !important;
    border-radius: 0 !important;
    min-height: 480px;
    padding-top: 165px;
    padding-bottom: 52px;
    padding-left: max(32px, calc((100vw - 1480px) / 2));
    padding-right: max(32px, calc((100vw - 1480px) / 2));
}

#xs-premium-shop .xs-shop__hero-copy {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 670px;
    min-width: 0;
}

#xs-premium-shop .xs-shop__hero-mark {
    z-index: 0;
    max-width: 70%;
    overflow: hidden;
}

/* Navigation, toolbar, grid, CTA are still inside .xs-shop__container. */
#xs-premium-shop .xs-shop__categories,
#xs-premium-shop .xs-shop__toolbar,
#xs-premium-shop .xs-shop__grid {
    width: 100%;
    min-width: 0;
}

#xs-premium-shop .xs-shop__card {
    min-width: 0;
    max-width: 100%;
}

/* Responsive contained gutters. */
@media (max-width: 1199px) {
    #xs-premium-shop .xs-shop__container {
        width: calc(100% - 48px);
    }
    #xs-premium-shop .xs-shop__hero {
        min-height: 435px;
        padding-top: 145px;
        padding-left: 24px;
        padding-right: 24px;
    }
}

@media (max-width: 900px) {
    #xs-premium-shop .xs-shop__container {
        width: calc(100% - 36px);
    }
    #xs-premium-shop .xs-shop__hero {
        min-height: 405px;
        padding-top: 125px;
        padding-left: 18px;
        padding-right: 18px;
    }
}

@media (max-width: 600px) {
    #xs-premium-shop .xs-shop__container {
        width: calc(100% - 28px);
    }
    #xs-premium-shop .xs-shop__hero {
        min-height: 375px;
        padding: 105px 14px 30px;
    }
    #xs-premium-shop .xs-shop__breadcrumb {
        margin-bottom: 24px;
    }
    #xs-premium-shop .xs-shop__hero-mark {
        right: 10%;
        bottom: -10px;
        max-width: 75%;
    }
}
