/** Shopify CDN: Minification failed

Line 268:30 Unexpected "{"
Line 268:39 Expected ":"

**/
.tpt-scrolling-badges .marquee {
	width: 100%;
	overflow: hidden;
	white-space: nowrap;
	padding: 1rem 0;
  }
  
@keyframes marquee {
	0%   { transform: translateX(0); }
	100% { transform: translateX(-100%); }
}
  
.tpt-scrolling-badges .marquee:hover .marquee__item {
	animation-play-state: var(--pause_on_hover);
}

.tpt-scrolling-badges .marquee__item a,
.tpt-scrolling-badges .marquee__item p{
	display: inline;
}
  
.tpt-scrolling-badges .marquee__item {
	display: inline-block;
	will-change: transform;
	animation: marquee var(--speed_marquee) linear infinite;
	display: inline-flex !important;
	flex-direction: row;
	align-items: center;
}

.tpt-scrolling-badges .marquee__content{
	display: inline-flex !important;
	flex-direction: row;
	align-items: center;
	margin: 0 var(--image-gap);
}

.tpt-scrolling-badges .marquee-image-wrapper{
	display: inline-flex !important;
	flex-direction: row;
	align-items: center;
	height: var(--image-height);
	width: auto;
}

.tpt-scrolling-badges .marquee-image-wrapper img{
	width: auto;
	max-height: 100%;
	object-fit: cover;
}

/* ================= Premium polish for Tpt - Scrolling Badges ================= */

/* Local design tokens for this component (safe defaults) */
.tpt-scrolling-badges {
  --sb-ink: #0f172a;             /* near-black text/ink */
  --sb-muted: rgba(15, 23, 42, .12);
  --sb-muted-strong: rgba(15, 23, 42, .18);
  --sb-surface: rgba(255, 255, 255, 0.6); /* glassy surface */
  --sb-ring: rgba(17, 24, 39, .35);       /* focus/hover ring */
  --sb-logo-opacity: .78;
  --sb-logo-hover: 1;
  --sb-lift: translateY(-1px);
}

/* Card-like wrapper around the scroller */
.tpt-scrolling-badges {
  position: relative;
  padding: clamp(8px, 1.2vw, 14px) 0;
  border-radius: 16px;
  background: linear-gradient(180deg, var(--sb-surface), rgba(255,255,255,0.3));
  box-shadow:
    0 1px 0 var(--sb-muted-strong) inset,
    0 12px 24px rgba(0,0,0,.06);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

/* Top & bottom hairlines for a premium frame */
.tpt-scrolling-badges::before,
.tpt-scrolling-badges::after {
  content: "";
  position: absolute;
  left: 10px; right: 10px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--sb-muted-strong), transparent);
  pointer-events: none;
}
.tpt-scrolling-badges::before { top: 0; opacity: .55; }
.tpt-scrolling-badges::after  { bottom: 0; opacity: .35; }

/* Edge fade so items don’t clip harshly */
.tpt-scrolling-badges .marquee {
  /* keep your width/overflow/white-space from earlier rules */
  position: relative;
  padding-block: 2px; /* slight breathing room for the mask */
  -webkit-mask-image: linear-gradient( to right,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,1) 6%,
      rgba(0,0,0,1) 94%,
      rgba(0,0,0,0) 100% );
  mask-image: linear-gradient( to right,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,1) 6%,
      rgba(0,0,0,1) 94%,
      rgba(0,0,0,0) 100% );
}

/* Keep spacing consistent with your Liquid variables */
.tpt-scrolling-badges .marquee__content {
  padding-inline: calc(var(--image-gap) / 2);
}

/* Logo treatment: monochrome, elegant by default */
.tpt-scrolling-badges .marquee-image-wrapper img {
  height: var(--image-height) !important;
  width: auto !important;
  object-fit: contain;
  display: block;

  filter: grayscale(100%) contrast(1.05) brightness(.9);
  opacity: var(--sb-logo-opacity);
  transition: filter .25s ease, opacity .25s ease, transform .25s ease, box-shadow .25s ease;
  will-change: transform;
  image-rendering: -webkit-optimize-contrast;
}

/* Hover/focus: bring the brand to life */
.tpt-scrolling-badges .marquee-image-wrapper img:hover,
.tpt-scrolling-badges .marquee-image-wrapper:focus-within img {
  filter: none;
  opacity: var(--sb-logo-hover);
  transform: var(--sb-lift);
}

/* Optional soft “glow” on hover for a luxe feel */
.tpt-scrolling-badges .marquee-image-wrapper:hover img {
  box-shadow:
    0 0 0 1px var(--sb-muted) inset,
    0 10px 24px rgba(0,0,0,.08);
  border-radius: 8px;
}

/* Keyboard accessibility: visible ring on wrapper link, if any */
.tpt-scrolling-badges .marquee__content a:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 3px var(--sb-ring);
  border-radius: 10px;
}

/* Respect the pause-on-hover variable you pass from Liquid */
.tpt-scrolling-badges .marquee:hover .marquee__item {
  animation-play-state: var(--pause_on_hover);
}

/* Slightly smoother animation on very long rows (keeps CPU chill) */
.tpt-scrolling-badges .marquee__item {
  will-change: transform;
  backface-visibility: hidden;
  transform: translateZ(0); /* GPU hint */
}

/* Mobile refinements */
@media (max-width: 768px) {
  .tpt-scrolling-badges {
    border-radius: 14px;
    box-shadow:
      0 1px 0 var(--sb-muted-strong) inset,
      0 8px 16px rgba(0,0,0,.06);
  }
  .tpt-scrolling-badges .marquee-image-wrapper img {
    /* rely on your existing --image-height but keep the feel crisp */
    filter: grayscale(100%) contrast(1.03) brightness(.92);
  }
}

/* Dark mode support (if your theme flips colors) */
@media (prefers-color-scheme: dark) {
  .tpt-scrolling-badges {
    --sb-ink: #e5e7eb;
    --sb-muted: rgba(255,255,255,.14);
    --sb-muted-strong: rgba(255,255,255,.22);
    --sb-surface: rgba(17, 24, 39, .55);
    --sb-ring: rgba(148, 163, 184, .45);
    background: linear-gradient(180deg, var(--sb-surface), rgba(17,24,39,0.4));
    box-shadow:
      0 1px 0 var(--sb-muted-strong) inset,
      0 12px 24px rgba(0,0,0,.35);
  }
  .tpt-scrolling-badges .marquee-image-wrapper img {
    filter: grayscale(100%) contrast(1.08) brightness(.92);
    opacity: .85;
  }
}

/* Reduced motion: keep everything static */
@media (prefers-reduced-motion: reduce) {
  .tpt-scrolling-badges * {
    animation-duration: 0.001s !important;
    animation-iteration-count: 1 !important;
    transition: none !important;
  }
}
/* ==== FULL‑WIDTH + BIGGER OVERRIDES ==== */

/* 1) Let the section breathe edge‑to‑edge */
.tpt-section_container {
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}

/* 2) Make the scroller span the full width and remove the card cap */
.tpt-scrolling-badges {
  border-radius: 0;
  background: transparent;          /* remove the glass panel */
  box-shadow: none;                 /* remove drop shadow */
  padding: clamp(10px, 1.5vw, 18px) 0;
}

/* remove the inner hairlines (they looked like a boxed card) */
.tpt-scrolling-badges::before,
.tpt-scrolling-badges::after { display: none; }

/* keep a subtle edge fade but allow near full-bleed */
.tpt-scrolling-badges .marquee {
  -webkit-mask-image: linear-gradient(to right,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,1) 2%,
      rgba(0,0,0,1) 98%,
      rgba(0,0,0,0) 100%);
  mask-image: linear-gradient(to right,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,1) 2%,
      rgba(0,0,0,1) 98%,
      rgba(0,0,0,0) 100%);
}

/* 3) Make logos bigger (without touching the theme setting) */
.tpt-scrolling-badges .marquee-image-wrapper img {
  height: calc(var(--image-height) * 1.25) !important; /* +25% bump */
}

/* A little more spacing so bigger logos don’t collide */
.tpt-scrolling-badges .marquee__content {
  padding-inline: max(16px, calc(var(--image-gap) / 1.6));
}

/* On large screens we can push size even more */
@media (min-width: 1200px) {
  .tpt-scrolling-badges .marquee-image-wrapper img {
    height: calc(var(--image-height) * 1.4) !important; /* +40% on desktop */
  }
}

/* If you want *zero* edge fade, uncomment this:
.tpt-scrolling-badges .marquee { -webkit-mask-image: none; mask-image: none; }
*/
/* ==== Force FULL viewport width for the scroller ==== */

/* Remove all horizontal padding on this section's wrappers */
.tpt-section_container.color-{{ section.settings.color_scheme }}.gradient,
.tpt-section_container,
.tpt-section_content {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Let the marquee itself stretch to screen edges */
.tpt-scrolling-badges .marquee {
  width: 100vw !important;        /* match viewport width */
  margin-left: calc(-50vw + 50%); /* pull it out of centered container */
}

/* Optional: slightly bigger logos now that we have room */
.tpt-scrolling-badges .marquee-image-wrapper img {
  height: calc(var(--image-height) * 1.3) !important;
}
/* ===== Premium full-width look for Tpt - Scrolling Badges ===== */

/* Give the strip a subtle depth */
.tpt-scrolling-badges {
  background: rgba(255, 255, 255, 0.4);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.06) inset,
              0 4px 18px rgba(0,0,0,0.08);
  padding-top: clamp(14px, 2vw, 18px);
  padding-bottom: clamp(14px, 2vw, 18px);
}

/* Space out items evenly without looking sparse */
.tpt-scrolling-badges .marquee__content {
  padding-inline: max(24px, calc(var(--image-gap) / 1.4));
}

/* Premium logo treatment: muted default, vivid on hover */
.tpt-scrolling-badges .marquee-image-wrapper img {
  height: calc(var(--image-height) * 1.2) !important;
  width: auto !important;
  object-fit: contain;
  display: block;
  filter: grayscale(100%) contrast(1.05) brightness(.9);
  opacity: 0.78;
  transition: filter 0.3s ease, opacity 0.3s ease, transform 0.3s ease;
  will-change: transform;
}
.tpt-scrolling-badges .marquee-image-wrapper img:hover {
  filter: none;
  opacity: 1;
  transform: translateY(-2px);
}

/* Add a faint highlight under hovered logos */
.tpt-scrolling-badges .marquee-image-wrapper img:hover {
  box-shadow: 0 6px 14px rgba(0,0,0,0.1);
  border-radius: 6px;
}

/* Heading styling for extra class */
.tpt-section_container h1,
.tpt-section_container h2,
.tpt-section_container .h0,
.tpt-section_container .h2,
.tpt-section_container .h4 {
  font-weight: 700;
  letter-spacing: 0.01em;
  color: #0f172a;
  text-align: center;
  margin-bottom: 12px;
  font-size: clamp(24px, 2.5vw, 36px);
}
.tpt-section_container h1::after,
.tpt-section_container h2::after,
.tpt-section_container .h0::after,
.tpt-section_container .h2::after,
.tpt-section_container .h4::after {
  content: "";
  display: block;
  width: 80px;
  height: 2px;
  margin: 12px auto 0;
  background: linear-gradient(90deg, transparent, #111827, transparent);
  opacity: 0.5;
  border-radius: 1px;
}

/* Keep animations smooth for marquee */
.tpt-scrolling-badges .marquee__item {
  will-change: transform;
  backface-visibility: hidden;
  transform: translateZ(0);
}

/* Mobile refinement */
@media (max-width: 768px) {
  .tpt-scrolling-badges .marquee-image-wrapper img {
    height: calc(var(--image-height) * 1.05) !important;
  }
}

/* ===== Premium + Spacious “Brands We Stock” (full-width) ===== */

/* 1) Section spacing & subtle depth */
.tpt-scrolling-badges {
  /* more vertical breathing room */
  padding-top: clamp(18px, 3vw, 28px) !important;
  padding-bottom: clamp(18px, 3vw, 28px) !important;

  /* soft glassy panel but keep full-bleed */
  background: rgba(255,255,255,0.45);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  box-shadow:
    0 -1px 0 rgba(15,23,42,.06) inset,
    0 1px 0 rgba(15,23,42,.06) inset,
    0 10px 24px rgba(0,0,0,.06);
}

/* keep the full-bleed we added earlier */
.tpt-scrolling-badges .marquee {
  width: 100vw !important;
  margin-left: calc(-50vw + 50%);
  /* light edge fade so the strip blends into the sides */
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 2%, black 98%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0%, black 2%, black 98%, transparent 100%);
}

/* 2) Bigger logos + nicer spacing */
.tpt-scrolling-badges .marquee-image-wrapper img {
  height: calc(var(--image-height) * 1.35) !important; /* up from earlier */
  filter: grayscale(100%) contrast(1.05) brightness(.9);
  opacity: .82;
  transition: filter .3s ease, opacity .3s ease, transform .3s ease, box-shadow .3s ease;
  will-change: transform;
}
.tpt-scrolling-badges .marquee__content {
  padding-inline: max(28px, calc(var(--image-gap) * 1.25));
}

/* hover “reveal” + soft lift */
.tpt-scrolling-badges .marquee-image-wrapper img:hover {
  filter: none;
  opacity: 1;
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(0,0,0,.1);
  border-radius: 6px;
}

/* 3) Premium heading with gold accent */
.tpt-section_container h1,
.tpt-section_container h2,
.tpt-section_container .h0,
.tpt-section_container .h2,
.tpt-section_container .h4 {
  color: #0f172a; /* navy */
  font-weight: 700;
  letter-spacing: .01em;
  text-align: center;
  font-size: clamp(26px, 2.8vw, 42px);  /* a touch larger */
  margin-bottom: 16px;
}
.tpt-section_container h1::after,
.tpt-section_container h2::after,
.tpt-section_container .h0::after,
.tpt-section_container .h2::after,
.tpt-section_container .h4::after {
  content: "";
  display: block;
  width: 84px;
  height: 3px;
  margin: 12px auto 0;
  background: linear-gradient(90deg, transparent, #cfa44d, transparent); /* gold */
  border-radius: 2px;
  opacity: .9;
}

/* 4) Slightly more size on desktops; rein it in on phones */
@media (min-width: 1200px) {
  .tpt-scrolling-badges .marquee-image-wrapper img {
    height: calc(var(--image-height) * 1.5) !important;
  }
}
@media (max-width: 640px) {
  .tpt-scrolling-badges .marquee-image-wrapper img {
    height: calc(var(--image-height) * 1.15) !important;
  }
  .tpt-scrolling-badges .marquee__content {
    padding-inline: max(16px, calc(var(--image-gap) * 1.0));
  }
}

/* 5) Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .tpt-scrolling-badges * { transition: none !important; }
}