/** Shopify CDN: Minification failed

Line 66:0 All "@import" rules must come first
Line 67:0 All "@import" rules must come first

**/
/* ==========================================================================
   BT Merch Co. — "Rugged Industrial" homepage design tokens + section styles
   Written from scratch for a clean theme reinstall. Source of truth:
   approved mockup 2. Designs/New folder/bt-merch-co-homepage-fixed.html
   and BT-Merch-Co-Design-System.md.
   ========================================================================== */

:root {
  /* Colors */
  --rug-action-blue: #0066cc;
  --rug-action-blue-focus: #0071e3;
  --rug-action-blue-dark: #2997ff;
  --rug-ink: #1d1d1f;
  --rug-ink-muted: #5d5e60;
  --rug-ink-faint: #77767b;
  --rug-true-black: #030304;
  --rug-on-dark: #ffffff;
  --rug-on-dark-muted: rgba(255, 255, 255, 0.72);
  --rug-hairline: #c7c6ca;
  --rug-divider-soft: #f1edec;
  --rug-canvas: #ffffff;
  --rug-parchment: #fdf8f8;
  --rug-surface-low: #f7f3f2;
  --rug-surface-dim: #ddd9d9;
  --rug-dark-1: #1d1d1f;
  --rug-dark-2: #211c1b;
  --rug-dark-3: #18181a;
  --rug-chip-translucent: rgba(255, 255, 255, 0.18);
  --rug-status-red: #d92d20;
  --rug-trustpilot-green: #00b67a;

  /* Typography */
  --rug-font-display: "Oswald", sans-serif;
  --rug-font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* Spacing */
  --rug-space-sm: 8px;
  --rug-space-md: 16px;
  --rug-space-lg: 32px;
  --rug-gutter: 24px;
  --rug-margin-mobile: 20px;
  --rug-margin-desktop: 64px;
  --rug-section-padding: 80px;

  /* Radius */
  --rug-radius-sm: 4px;
  --rug-radius-lg: 8px;
  --rug-radius-xl: 12px;
  --rug-radius-pill: 9999px;

  /* Layout */
  --rug-max-width: 1440px;
  --rug-max-width-wide: 1600px;

  /* Shadow */
  --rug-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06), 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* Google Fonts (Oswald + Inter) + Material Symbols */
@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@600;700&family=Inter:wght@400;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=block");

.material-symbols-outlined {
  font-family: "Material Symbols Outlined";
  font-weight: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "liga";
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
}
.material-symbols-outlined.rug-icon--fill {
  font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24;
}

/* ---------- Layout helpers ---------- */
.rug-section {
  width: 100%;
  padding-top: 32px;
  padding-bottom: 32px;
}
@media screen and (min-width: 736px) {
  .rug-section {
    padding-top: var(--rug-section-padding);
    padding-bottom: var(--rug-section-padding);
  }
}
.rug-container {
  width: 100%;
  max-width: var(--rug-max-width);
  margin: 0 auto;
  padding-left: var(--rug-margin-mobile);
  padding-right: var(--rug-margin-mobile);
}
.rug-container--wide {
  max-width: var(--rug-max-width-wide);
}
@media screen and (min-width: 736px) {
  .rug-container,
  .rug-container--wide {
    padding-left: var(--rug-margin-desktop);
    padding-right: var(--rug-margin-desktop);
  }
}

.rug-bg-white { background-color: var(--rug-canvas); color: var(--rug-ink); }
.rug-bg-parchment { background-color: var(--rug-parchment); color: var(--rug-ink); }
.rug-bg-dark-1 { background-color: var(--rug-dark-1); color: var(--rug-on-dark); }
.rug-bg-dark-2 { background-color: var(--rug-dark-2); color: var(--rug-on-dark); }
.rug-bg-dark-3 { background-color: var(--rug-dark-3); color: var(--rug-on-dark); }
.rug-border-t { border-top: 1px solid var(--rug-hairline); }
.rug-border-b { border-bottom: 1px solid var(--rug-hairline); }

/* ---------- Type ---------- */
.rug-eyebrow {
  display: block;
  font-family: var(--rug-font-body);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--rug-action-blue);
  margin-bottom: var(--rug-space-md);
}
.rug-heading-lg {
  font-family: var(--rug-font-display);
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  font-size: 32px;
  line-height: 1.15;
  margin: 0;
}
@media screen and (min-width: 1024px) {
  .rug-heading-lg { font-size: 48px; }
}
.rug-lead {
  font-family: var(--rug-font-body);
  font-size: 18px;
  line-height: 1.5;
}
@media screen and (min-width: 640px) {
  .rug-lead { font-size: 21px; }
}
.rug-body { font-family: var(--rug-font-body); font-size: 16px; line-height: 1.5; color: var(--rug-ink-muted); }
.rug-body-strong { font-family: var(--rug-font-body); font-size: 17px; font-weight: 600; line-height: 1.5; }
.rug-fine-print { font-family: var(--rug-font-body); font-size: 12px; line-height: 1.4; color: var(--rug-ink-muted); }
.rug-label-caps {
  font-family: var(--rug-font-body);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/* ---------- Buttons ---------- */
.rug-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--rug-space-sm);
  padding: 14px 28px;
  border-radius: var(--rug-radius-pill);
  font-family: var(--rug-font-body);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid transparent;
  transition: opacity 0.2s ease, background-color 0.2s ease;
  cursor: pointer;
}
.rug-btn:hover { opacity: 0.9; }
.rug-btn--primary { background-color: var(--rug-action-blue); color: #fff; }
.rug-btn--secondary { background-color: var(--rug-parchment); color: var(--rug-ink); border-color: var(--rug-hairline); }
.rug-btn--utility { background-color: var(--rug-ink); color: #fff; }
.rug-btn--outline-on-dark { background-color: transparent; color: var(--rug-on-dark); border-color: rgba(255,255,255,.4); }

/* ---------- Grids ---------- */
.rug-grid { display: grid; gap: var(--rug-gutter); }
.rug-grid-trust { grid-template-columns: repeat(2, 1fr); gap: 32px var(--rug-gutter); }
@media screen and (min-width: 1024px) { .rug-grid-trust { grid-template-columns: repeat(4, 1fr); } }
.rug-grid-vehicles { grid-template-columns: repeat(2, 1fr); }
@media screen and (min-width: 834px) { .rug-grid-vehicles { grid-template-columns: repeat(4, 1fr); } }
.rug-grid-essentials { grid-template-columns: repeat(2, 1fr); }
@media screen and (min-width: 640px) { .rug-grid-essentials { grid-template-columns: repeat(4, 1fr); } }
.rug-grid-categories { grid-template-columns: repeat(2, 1fr); }
@media screen and (min-width: 834px) { .rug-grid-categories { grid-template-columns: repeat(3, 1fr); } }
.rug-grid-products { grid-template-columns: repeat(2, 1fr); }
@media screen and (min-width: 1024px) { .rug-grid-products { grid-template-columns: repeat(4, 1fr); } }
.rug-grid-story { grid-template-columns: 1fr; align-items: center; gap: var(--rug-space-lg); }
@media screen and (min-width: 1024px) { .rug-grid-story { grid-template-columns: 1fr 1fr; gap: 64px; } }
.rug-grid-story-steps { grid-template-columns: repeat(2, 1fr); }
.rug-grid-reviews { grid-template-columns: 1fr; }
@media screen and (min-width: 736px) { .rug-grid-reviews { grid-template-columns: repeat(3, 1fr); } }
.rug-grid-articles { grid-template-columns: 1fr; }
@media screen and (min-width: 736px) { .rug-grid-articles { grid-template-columns: repeat(3, 1fr); } }

/* ---------- Section header row (heading + optional link) ---------- */
.rug-section-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: var(--rug-space-md);
  margin-bottom: var(--rug-space-lg);
  flex-wrap: wrap;
}
@media screen and (min-width: 736px) { .rug-section-head { margin-bottom: 48px; } }
.rug-link {
  font-family: var(--rug-font-body);
  font-weight: 600;
  color: var(--rug-action-blue);
  text-decoration: none;
  white-space: nowrap;
}
.rug-link:hover { text-decoration: underline; }

/* ---------- Icon circle ---------- */
.rug-icon-circle {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background-color: var(--rug-canvas);
  border: 1px solid var(--rug-hairline);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: var(--rug-shadow-sm);
}

/* ---------- Badges & chips ---------- */
.rug-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  border-radius: var(--rug-radius-pill);
  background-color: var(--rug-canvas);
  border: 1px solid var(--rug-hairline);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--rug-ink);
}
.rug-chip {
  display: inline-flex;
  padding: 8px 16px;
  border-radius: var(--rug-radius-pill);
  border: 1px solid var(--rug-hairline);
  font-size: 12px;
  color: inherit;
  transition: color 0.2s ease, border-color 0.2s ease;
}

/* ---------- Placeholder art (no real product photo yet) ---------- */
.rug-ph-tile {
  background: linear-gradient(135deg, var(--rug-surface-low), var(--rug-surface-dim));
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
.rug-ph-ghost-icon {
  position: absolute;
  right: -0.25em;
  bottom: -0.25em;
  font-size: 6em;
  color: rgba(255, 255, 255, 0.5);
  pointer-events: none;
  user-select: none;
}
.rug-ph-badge-icon {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background-color: var(--rug-canvas);
  box-shadow: var(--rug-shadow-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
}

/* ---------- Hero ---------- */
.rug-hero {
  position: relative;
  width: 100%;
  min-height: 480px;
  display: flex;
  align-items: center;
  background-color: var(--rug-dark-1);
}
@media screen and (min-width: 1024px) { .rug-hero { min-height: 700px; } }
.rug-hero-media { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.rug-hero-media img { width: 100%; height: 100%; object-fit: cover; }
.rug-hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, var(--rug-true-black) 0%, rgba(3,3,4,.6) 45%, transparent 100%);
}
.rug-hero-content { position: relative; z-index: 1; width: 100%; }
.rug-hero-content .rug-heading-lg { text-transform: none; color: var(--rug-on-dark); margin-bottom: var(--rug-space-md); }
.rug-hero-content .rug-lead { color: var(--rug-on-dark-muted); margin-bottom: 40px; max-width: 540px; }
.rug-hero-buttons { display: flex; flex-direction: column; gap: var(--rug-space-md); }
@media screen and (min-width: 640px) { .rug-hero-buttons { flex-direction: row; } }

/* ---------- Trust row ---------- */
.rug-trust-item { display: flex; flex-direction: column; align-items: center; text-align: center; }
.rug-trust-item .rug-icon-circle { margin-bottom: var(--rug-space-md); }
.rug-trust-item h3 { margin: 0 0 var(--rug-space-sm); }

/* ---------- Vehicle showcase ---------- */
.rug-vehicle-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 0 0 var(--rug-space-lg);
  background-color: var(--rug-canvas);
  border: 1px solid var(--rug-hairline);
  border-radius: var(--rug-radius-xl);
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
.rug-vehicle-tile:hover { box-shadow: var(--rug-shadow-sm); border-color: var(--rug-action-blue); transform: translateY(-2px); }
.rug-vehicle-photo {
  width: 100%;
  aspect-ratio: 4 / 3;
  background: linear-gradient(135deg, var(--rug-surface-low), var(--rug-surface-dim));
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--rug-space-md);
  overflow: hidden;
}
.rug-vehicle-tile .rug-icon-circle { width: 56px; height: 56px; margin-bottom: var(--rug-space-md); }
.rug-vehicle-tile .rug-icon-circle .material-symbols-outlined { font-size: 26px; }
.rug-vehicle-brand { display: block; font-family: var(--rug-font-body); font-weight: 700; font-size: 12px; letter-spacing: 0.05em; text-transform: uppercase; margin-bottom: 2px; }
.rug-vehicle-model { font-family: var(--rug-font-body); font-size: 12px; color: var(--rug-ink-muted); }
.rug-disclaimer { font-size: 11px; line-height: 1.4; color: var(--rug-ink-muted); text-align: center; max-width: 640px; margin: var(--rug-space-lg) auto 0; }

.rug-essentials-card {
  margin-top: 64px;
  background-color: var(--rug-canvas);
  border: 1px solid var(--rug-hairline);
  border-radius: var(--rug-radius-xl);
  padding: var(--rug-space-lg);
}
@media screen and (min-width: 736px) { .rug-essentials-card { padding: 40px; } }
.rug-essentials-head { display: flex; flex-direction: column; gap: var(--rug-space-sm); margin-bottom: var(--rug-space-lg); }
@media screen and (min-width: 736px) { .rug-essentials-head { flex-direction: row; align-items: flex-end; justify-content: space-between; } }
.rug-essentials-head .rug-heading-lg { font-size: 28px; text-transform: none; }
.rug-essential-item { display: flex; flex-direction: column; align-items: center; text-align: center; }
.rug-essential-item .rug-ph-badge-icon { width: 80px; height: 80px; margin-bottom: var(--rug-space-sm); background: linear-gradient(135deg, var(--rug-canvas), var(--rug-surface-low)); }

/* ---------- Category grid ---------- */
.rug-category-tile { display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.rug-category-art {
  background: linear-gradient(135deg, var(--rug-surface-low), var(--rug-surface-dim));
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 5;
  border-radius: var(--rug-radius-lg);
  margin-bottom: var(--rug-space-md);
  display: flex;
  align-items: flex-end;
  padding: var(--rug-space-md);
  overflow: hidden;
  transition: filter 0.2s ease;
}
@media screen and (min-width: 736px) { .rug-category-art { aspect-ratio: 1 / 1; padding: 24px; } }
.rug-category-art .rug-ph-ghost-icon { font-size: 9em; right: -0.2em; bottom: -0.3em; color: rgba(29,29,31,.05); }
.rug-category-art .rug-category-small-icon { position: absolute; top: var(--rug-space-md); left: var(--rug-space-md); font-size: 32px; color: var(--rug-ink-muted); }
@media screen and (min-width: 736px) { .rug-category-art .rug-category-small-icon { font-size: 40px; } }
.rug-category-title { position: relative; font-family: var(--rug-font-display); font-weight: 700; font-size: 24px; color: var(--rug-ink); margin: 0; }
@media screen and (min-width: 736px) { .rug-category-title { font-size: 28px; } }
.rug-category-art.has-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(to top, rgba(3,3,4,.8) 0%, rgba(3,3,4,.25) 50%, rgba(3,3,4,0) 100%);
  pointer-events: none;
}
.rug-category-art.has-photo .rug-category-title { color: #ffffff; z-index: 2; }
.rug-category-art.has-photo .rug-category-small-icon { z-index: 2; color: rgba(255,255,255,.85); }
.rug-category-tags { display: flex; flex-wrap: wrap; gap: var(--rug-space-sm); }
.rug-category-tags .rug-chip { color: var(--rug-on-dark); border-color: rgba(255,255,255,.3); }
.rug-category-tile:hover .rug-category-tags .rug-chip { color: var(--rug-action-blue-dark); border-color: var(--rug-action-blue-dark); }

/* ---------- Product grid ---------- */
.rug-product-card {
  display: flex;
  flex-direction: column;
  background-color: var(--rug-canvas);
  border: 1px solid var(--rug-hairline);
  border-radius: var(--rug-radius-xl);
  overflow: hidden;
}
.rug-product-media { aspect-ratio: 1 / 1; position: relative; }
.rug-product-media img { width: 100%; height: 100%; object-fit: cover; }
.rug-product-media .rug-badge { position: absolute; top: var(--rug-space-md); left: var(--rug-space-md); z-index: 2; }
.rug-product-body { padding: var(--rug-space-md); display: flex; flex-direction: column; flex-grow: 1; }
@media screen and (min-width: 736px) { .rug-product-body { padding: 24px; } }
.rug-product-title { font-family: var(--rug-font-body); font-weight: 600; font-size: 16px; color: var(--rug-ink); margin: 0 0 var(--rug-space-sm); }
.rug-product-footer { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: var(--rug-space-md); gap: var(--rug-space-sm); }
.rug-price-compare { display: block; font-size: 12px; text-decoration: line-through; color: var(--rug-ink-faint); }
.rug-price-now { font-family: var(--rug-font-display); font-size: 20px; font-weight: 700; color: var(--rug-ink); }
.rug-product-form { margin: 0; }
.rug-add-btn {
  padding: 10px 20px;
  background-color: var(--rug-action-blue);
  color: #fff;
  border: none;
  border-radius: var(--rug-radius-pill);
  font-family: var(--rug-font-body);
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
  transition: opacity 0.2s ease;
}
.rug-add-btn:hover { opacity: 0.9; }
.rug-add-btn[disabled] { background-color: var(--rug-surface-dim); color: var(--rug-ink-faint); cursor: not-allowed; }
.rug-view-options-link { font-family: var(--rug-font-body); font-weight: 700; font-size: 14px; color: var(--rug-action-blue); text-decoration: none; }
.rug-view-options-link:hover { text-decoration: underline; }
.rug-product-empty {
  aspect-ratio: 1/1;
  border: 1px dashed var(--rug-hairline);
  border-radius: var(--rug-radius-xl);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: var(--rug-ink-faint);
  gap: var(--rug-space-sm);
  grid-column: span 2;
}
@media screen and (min-width: 1024px) { .rug-product-empty { grid-column: span 4; } }

/* ---------- Our Story ---------- */
.rug-story-card {
  background-color: var(--rug-canvas);
  border: 1px solid var(--rug-hairline);
  border-radius: var(--rug-radius-xl);
  padding: var(--rug-space-md);
}
@media screen and (min-width: 736px) { .rug-story-card { padding: 24px; } }
.rug-story-number { display: block; font-family: var(--rug-font-display); font-size: 32px; font-weight: 700; color: var(--rug-action-blue); margin-bottom: var(--rug-space-sm); }
.rug-story-card h4 { font-family: var(--rug-font-body); font-weight: 600; font-size: 17px; color: var(--rug-ink); margin: 0 0 4px; }

/* ---------- Reviews ---------- */
.rug-reviews-head { text-align: center; margin-bottom: var(--rug-space-lg); }
.rug-stars-pill {
  display: inline-flex;
  align-items: center;
  gap: var(--rug-space-sm);
  padding: 10px 20px;
  border-radius: var(--rug-radius-pill);
  background-color: var(--rug-canvas);
  border: 1px solid var(--rug-hairline);
  margin-bottom: var(--rug-space-lg);
}
.rug-stars { display: flex; gap: 2px; }
.rug-stars .material-symbols-outlined { font-size: 16px; color: var(--rug-hairline); }
.rug-stars .material-symbols-outlined.rug-icon--fill { color: var(--rug-ink); font-size: 14px; }
.rug-review-card {
  position: relative;
  background-color: var(--rug-canvas);
  border: 1px solid var(--rug-hairline);
  border-radius: var(--rug-radius-xl);
  padding: 24px;
  box-shadow: none;
  transition: box-shadow 0.2s ease;
}
.rug-review-card:hover { box-shadow: var(--rug-shadow-sm); }
.rug-review-card .rug-badge { position: absolute; top: var(--rug-space-md); right: var(--rug-space-md); font-size: 10px; color: var(--rug-ink-muted); }
.rug-review-avatar-row { display: flex; align-items: center; gap: var(--rug-space-md); margin-bottom: var(--rug-space-md); }
.rug-review-avatar { width: 40px; height: 40px; border-radius: 50%; background-color: var(--rug-surface-low); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.rug-review-quote { font-family: var(--rug-font-body); color: var(--rug-ink-muted); line-height: 1.6; margin: 0; }

/* ---------- Field notes (blog teaser) ---------- */
.rug-article-card { display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.rug-article-media {
  aspect-ratio: 4/3;
  border-radius: var(--rug-radius-xl);
  border: 1px solid var(--rug-hairline);
  margin-bottom: var(--rug-space-md);
  overflow: hidden;
}
.rug-article-media img { width: 100%; height: 100%; object-fit: cover; }
.rug-article-tag { display: block; font-size: 12px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--rug-action-blue); margin-bottom: var(--rug-space-sm); }
.rug-article-title { font-family: var(--rug-font-body); font-weight: 600; font-size: 17px; color: var(--rug-ink); margin: 0 0 var(--rug-space-sm); }
.rug-article-card:hover .rug-article-title { color: var(--rug-action-blue); }

/* ---------- Closing CTA ---------- */
.rug-closing-cta { text-align: center; }
.rug-closing-cta .rug-heading-lg { color: var(--rug-on-dark); margin-bottom: var(--rug-space-lg); text-transform: none; }

/* ---------- Instagram marquee ---------- */
.rug-marquee-wrap { width: 100%; overflow: hidden; }
.rug-marquee-track {
  display: flex;
  gap: var(--rug-space-md);
  width: max-content;
  animation: rug-marquee-scroll var(--rug-marquee-speed, 32s) linear infinite;
}
.rug-marquee-wrap:hover .rug-marquee-track { animation-play-state: paused; }
@keyframes rug-marquee-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.rug-marquee-tile {
  width: 160px;
  height: 160px;
  flex-shrink: 0;
  border-radius: var(--rug-radius-xl);
  border: 1px solid var(--rug-hairline);
  overflow: hidden;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (min-width: 736px) { .rug-marquee-tile { width: 192px; height: 192px; } }
.rug-marquee-tile img { width: 100%; height: 100%; object-fit: cover; }