/** Shopify CDN: Minification failed

Line 42:0 All "@import" rules must come first

**/
/* =============================================================
   SuppAthletik — Ghost Lifestyle-inspired dark storefront theme
   Palette:
     #0a0a0a  background (near-black)
     #ffffff  foreground
     #111111  surface / card
     #2a2a2a  border / divider
     #19aaff  accent (electric blue, from brand S logo)
     #cccccc  muted text
   ============================================================= */

/* ── RESET / BASE ─────────────────────────────────────────── */
:root {
  --supp-bg:       #0a0a0a;
  --supp-surface:  #111111;
  --supp-border:   #2a2a2a;
  --supp-fg:       #ffffff;
  --supp-muted:    #aaaaaa;
  --supp-accent:   #19aaff;
  --supp-accent-dark: #0e7ccf;

  /* force dark mode on the entire page */
  --color-background: var(--supp-bg);
  --color-foreground: var(--supp-fg);
}

/* Ensure body is truly dark */
body,
.shopify-section,
.page-width,
.full-width-section {
  background-color: var(--supp-bg) !important;
  color: var(--supp-fg) !important;
}

/* ── TYPOGRAPHY — Ghost uses heavy condensed uppercase ─────── */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;500;700;900&display=swap');

h1, h2, h3, h4, h5, h6,
.section-heading,
.product-list__title,
.collection-list__title {
  font-family: 'Barlow Condensed', var(--font-heading--family, sans-serif) !important;
  font-weight: 900 !important;
  letter-spacing: 0.04em !important;
  color: var(--supp-fg) !important;
}

/* Ghost hero headings are LARGE */
h1, .h1 { font-size: clamp(3.5rem, 8vw, 8rem); line-height: 0.95; }
h2, .h2 { font-size: clamp(2.5rem, 5vw, 5rem); line-height: 0.95; }
h3, .h3 { font-size: clamp(1.5rem, 2.5vw, 2.5rem); line-height: 1; }

/* ── NAVIGATION ────────────────────────────────────────────── */
.header,
.header__inner,
.sticky-header,
header-group,
.shopify-section-group-header-group {
  background-color: #050505 !important;
  border-bottom: 1px solid var(--supp-border) !important;
}

.header a,
.header__heading-link,
.header__icon,
.header__nav-item a,
.header__menu-item,
nav a {
  color: var(--supp-fg) !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}

.header a:hover,
.header__nav-item a:hover {
  color: var(--supp-accent) !important;
}

.header__heading-link img,
.header__heading-logo {
  filter: brightness(0) invert(1);
}

/* Cart / account icons */
.header__icon svg,
.header__icon path {
  stroke: var(--supp-fg) !important;
  fill: var(--supp-fg) !important;
}

/* ── ANNOUNCEMENTS BAR ─────────────────────────────────────── */
.announcement-bar,
.header__announcement {
  background: var(--supp-accent) !important;
  color: #000 !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-size: 0.9rem !important;
}

.announcement-bar a,
.announcement-bar * {
  color: #000 !important;
}

/* ── HERO / SLIDESHOW ──────────────────────────────────────── */
.slideshow,
.hero,
.layered-slideshow {
  position: relative;
}

/* strong darkened overlay so text pops */
.slideshow__slide::after,
.hero__media::after,
.slide-content__overlay {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to right,
    rgba(0,0,0,0.85) 0%,
    rgba(0,0,0,0.4) 60%,
    rgba(0,0,0,0.1) 100%
  ) !important;
  pointer-events: none;
  z-index: 1;
}

.slideshow__slide .slide-content,
.hero__content {
  position: relative;
  z-index: 2;
}

/* Slideshow heading — Ghost impact style */
.slideshow__slide h1,
.slideshow__slide h2,
.slideshow__slide .rte h2,
.hero__text h1,
.hero__text h2 {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important;
  font-size: clamp(3rem, 9vw, 9rem) !important;
  line-height: 0.9 !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase !important;
  color: #fff !important;
  text-shadow: 0 4px 32px rgba(0,0,0,0.8);
}

/* "SHOP NOW" in hero */
.slideshow__slide .button,
.hero__cta .button {
  background: transparent !important;
  border: 2px solid #fff !important;
  color: #fff !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  padding: 0.6em 2em !important;
  transition: background 0.2s, color 0.2s !important;
}
.slideshow__slide .button:hover,
.hero__cta .button:hover {
  background: #fff !important;
  color: #000 !important;
}

/* ── CATEGORY TILES (4-up grid Ghost style) ────────────────── */
.collection-list__list,
.collection-list {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 4px !important;
  background: #000;
}

@media (max-width: 768px) {
  .collection-list__list,
  .collection-list {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

.collection-list__item,
.collection-list .card {
  position: relative;
  overflow: hidden;
  aspect-ratio: 3/4;
  background: #1a1a1a;
}

/* Dark image overlay */
.collection-list__item .card-media::after,
.collection-list .card__media::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.1) 60%);
  z-index: 1;
  transition: opacity 0.3s;
}

.collection-list__item:hover .card-media::after,
.collection-list .card:hover .card__media::after {
  opacity: 0.5;
}

.collection-list__item img,
.collection-list .card__media img {
  transition: transform 0.5s ease !important;
}
.collection-list__item:hover img,
.collection-list .card:hover img {
  transform: scale(1.06) !important;
}

/* Tile labels — absolute bottom-left, big uppercase */
.collection-list__item .card-information,
.collection-list .card__content {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  padding: 20px 24px !important;
  z-index: 2 !important;
  background: none !important;
}

.collection-list__item .card-information a,
.collection-list .card__content .card__heading a,
.collection-list .card__title {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important;
  font-size: clamp(1.4rem, 2.5vw, 2rem) !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: #fff !important;
  text-shadow: 0 2px 8px rgba(0,0,0,0.8) !important;
  text-decoration: none !important;
}

/* "SHOP NOW" below category title */
.collection-list__item .card__cta,
.collection-list .card__cta {
  display: block;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--supp-accent) !important;
  margin-top: 4px;
}

/* ── PRODUCT GRID ──────────────────────────────────────────── */
.product-list,
.product-grid {
  background: var(--supp-bg) !important;
}

.card-wrapper,
.product-card {
  background: var(--supp-surface) !important;
  border: 1px solid var(--supp-border) !important;
  border-radius: 0 !important;
  overflow: hidden;
  transition: border-color 0.2s, transform 0.2s;
}

.card-wrapper:hover,
.product-card:hover {
  border-color: var(--supp-accent) !important;
  transform: translateY(-2px);
}

.card__content,
.card-information,
.product-card__info {
  background: var(--supp-surface) !important;
  padding: 12px !important;
}

.card__heading a,
.card-information__title,
.product-card__name {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  color: var(--supp-fg) !important;
}

.price,
.price__regular,
.price__sale {
  color: var(--supp-fg) !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  font-size: 1.1rem !important;
}

.price--on-sale .price__sale {
  color: var(--supp-accent) !important;
}

/* vendor / brand pill */
.product-card__vendor,
.card-vendor {
  text-transform: uppercase !important;
  font-size: 0.7rem !important;
  color: var(--supp-muted) !important;
  letter-spacing: 0.08em !important;
}

/* Section headings in product-list sections */
.product-list .section-heading,
.product-list__title,
[class*="product_list"] h3,
[class*="product-list"] h3 {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--supp-fg) !important;
  border-bottom: 3px solid var(--supp-accent);
  padding-bottom: 0.2em;
  margin-bottom: 1.5rem;
}

/* "Ver todo" / link button next to section titles */
.product-list .button--link,
.product-list a.link {
  font-family: 'Barlow Condensed', sans-serif !important;
  color: var(--supp-accent) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
}

/* ── CTA BUTTONS ───────────────────────────────────────────── */
.button--primary,
button[type="submit"],
.add-to-cart,
.cart__checkout-button {
  background: var(--supp-accent) !important;
  border-color: var(--supp-accent) !important;
  color: #000 !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  padding: 0.8em 2.5em !important;
  transition: background 0.2s, filter 0.2s !important;
}

.button--primary:hover,
button[type="submit"]:hover,
.add-to-cart:hover,
.cart__checkout-button:hover {
  background: var(--supp-accent-dark) !important;
  filter: brightness(1.1) !important;
}

.button--secondary,
.button--tertiary {
  background: transparent !important;
  border: 1px solid #fff !important;
  color: #fff !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
}

.button--secondary:hover {
  background: #fff !important;
  color: #000 !important;
}

/* ── CART DRAWER ───────────────────────────────────────────── */
.cart-drawer,
.cart-notification,
.cart-drawer__inner {
  background: #111 !important;
  color: #fff !important;
  border-left: 1px solid var(--supp-border) !important;
}

.cart-item__title,
.cart-item__vendor {
  color: #fff !important;
  font-family: 'Barlow Condensed', sans-serif !important;
}

/* ── SECTION DIVIDERS ──────────────────────────────────────── */
.section-full-width,
.shopify-section + .shopify-section {
  border-top: 1px solid var(--supp-border);
}

/* ── MARQUEE / TICKER STRIP ────────────────────────────────── */
.marquee,
.announcement-bar--marquee {
  background: var(--supp-accent) !important;
  color: #000 !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-size: 0.95rem !important;
}

/* ── FOOTER ────────────────────────────────────────────────── */
.footer,
.footer-section,
footer {
  background: #050505 !important;
  border-top: 1px solid var(--supp-border) !important;
  color: var(--supp-muted) !important;
}

.footer a,
.footer__heading,
.footer__column-heading {
  color: #fff !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}

.footer a:hover {
  color: var(--supp-accent) !important;
}

/* ── BADGES ─────────────────────────────────────────────────── */
.badge--sale,
.badge-sale {
  background: var(--supp-accent) !important;
  color: #000 !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
}

.badge--sold-out,
.badge-sold-out {
  background: #333 !important;
  color: #fff !important;
  border-radius: 0 !important;
}

/* ── FORM ELEMENTS ──────────────────────────────────────────── */
input,
select,
textarea {
  background: #111 !important;
  border-color: #333 !important;
  color: #fff !important;
  border-radius: 0 !important;
}

input::placeholder,
textarea::placeholder {
  color: var(--supp-muted) !important;
}

/* ── QUANTITY SELECTOR ─────────────────────────────────────── */
.quantity {
  border: 1px solid var(--supp-border) !important;
  background: var(--supp-surface) !important;
  border-radius: 0 !important;
}

.quantity button {
  background: transparent !important;
  color: #fff !important;
}

/* ── HORIZONTAL RULE / BORDER ──────────────────────────────── */
hr {
  border-color: var(--supp-border) !important;
}

/* ── SCROLLBAR ─────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #111; }
::-webkit-scrollbar-thumb { background: #333; border-radius: 0; }
::-webkit-scrollbar-thumb:hover { background: var(--supp-accent); }