/** Shopify CDN: Minification failed

Line 157:1 Expected "}" to go with "{"

**/
/* Coliseum Tees
   1. Width overrides - homepage AND collection pages (layout only)
   2. Retro layer - homepage only
   3. Blog post featured image - article pages only
   Product pages are untouched. */

/* ---------- 1. WIDER PRODUCT GRIDS ---------- */

/* Horizon's .page-width-* classes sit on an ancestor of <main>, not on the
   section, so they can't be targeted from here. Instead we redefine the
   custom properties on <main> and let them inherit down into .section, which
   builds its grid from --page-width and --page-margin. */
main[data-template="index"],
main[data-template^="collection"] {
  --page-content-width: min(2000px, 94vw);
  --page-width: calc(var(--page-content-width) + (var(--page-margin) * 2));
}

@media screen and (min-width: 990px) {
  main[data-template="index"],
  main[data-template^="collection"] {
    --page-margin: 24px;
    --page-width: calc(var(--page-content-width) + (var(--page-margin) * 2));
  }
}

/* Cards fill their column edge to edge on desktop */
@media screen and (min-width: 750px) {
  main[data-template="index"] .product-card__content,
  main[data-template^="collection"] .product-card__content {
    padding-inline: 0;
  }
}

/* ---------- 3. BLOG POST FEATURED IMAGE ---------- */

/* The article template uses the generic image block at width: fit-content,
   which left-aligns it in the flex column. Auto inline margins centre it.
   Both class names are covered in case the block type is swapped later. */
main[data-template^="article"] .image-block,
main[data-template^="article"] .blog-post-featured-image {
  margin-inline: auto;
}

main[data-template^="article"] .image-block img,
main[data-template^="article"] .blog-post-featured-image__image {
  margin-inline: auto;
  object-position: center center;
}

/* ---------- 2. RETRO LAYER (HOMEPAGE ONLY) ---------- */

main[data-template="index"] {
  background-color: #000080;
  background-image:
    repeating-linear-gradient(0deg, rgba(255,255,255,0.06) 0 2px, transparent 2px 8px),
    repeating-linear-gradient(90deg, rgba(255,255,255,0.06) 0 2px, transparent 2px 8px);
  color: #000;
}

main[data-template="index"] .shopify-section {
  margin: 12px auto;
}

/* Panel frame for theme sections only. Custom retro sections (.wwn, .hc, .uc,
   .ring) bring their own frame and width, so they are excluded. */
main[data-template="index"] .shopify-section:not(:has(.wwn, .hc, .uc, .ring)) {
  background: #c0c0c0;
  border: 3px outset #dfdfdf;
  padding: 8px;
}

main[data-template="index"] h1,
main[data-template="index"] h2,
main[data-template="index"] h3,
main[data-template="index"] h4 {
  font-family: "Impact", "Haettenschweiler", "Arial Black", sans-serif;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #ffff00;
  text-shadow: 2px 2px 0 #ff0000, 4px 4px 0 #000;
  line-height: 1.05;
}

main[data-template="index"] p,
main[data-template="index"] li,
main[data-template="index"] .price {
  font-family: "Times New Roman", Times, serif;
  font-size: 1.05rem;
  color: #000;
}

main[data-template="index"] a {
  color: #0000ee;
  text-decoration: underline;
}

main[data-template="index"] a:visited {
  color: #551a8b;
}

main[data-template="index"] a:hover {
  color: #ff0000;
  background: #ffff00;
}

main[data-template="index"] button,
main[data-template="index"] .button,
main[data-template="index"] a.button {
  font-family: "MS Sans Serif", "Tahoma", Verdana, sans-serif;
  font-size: 0.9rem;
  color: #000;
  background: #c0c0c0;
  border: 2px outset #dfdfdf;
  border-radius: 0;
  padding: 4px 12px;
  text-shadow: none;
}

main[data-template="index"] button:active,
main[data-template="index"] .button:active {
  border-style: inset;
}

main[data-template="index"] img {
  border: 2px solid #000;
  border-radius: 0;
}

main[data-template="index"] hr {
  border: 0;
  border-top: 2px groove #808080;
  margin: 16px 0;
}

@media (max-width: 749px) {
  main[data-template="index"] .shopify-section:not(:has(.wwn, .hc, .uc, .ring)) {
    margin: 8px 4px;
    border-width: 2px;
  }
  main[data-template="index"] h1,
  main[data-template="index"] h2 {
    text-shadow: 1px 1px 0 #ff0000, 2px 2px 0 #000;
  }
.footer-content,
.shopify-section-group-footer-group,
.shopify-section-group-footer-group > .section,
.shopify-section-group-footer-group .section-background {
  content-visibility: visible;
  contain: none;
  contain-intrinsic-size: auto none;
}