/* Local site fixes (archive / offline Squarespace mirror) */

/* Partner logos wrongly tagged as social icons were rendering at native ~1700px */
img.footerlink,
img.footerlink2,
.sqs-block-code img.footerlink,
.sqs-block-code img.footerlink2 {
  height: 45px !important;
  width: auto !important;
  max-width: 160px !important;
  max-height: 45px !important;
  object-fit: contain;
  display: inline-block;
  vertical-align: middle;
  margin: 12px 16px !important;
}
img.footerlink2 {
  height: 30px !important;
  max-height: 30px !important;
}

/* Social SVG icons: keep them icon-sized even if JS/sprite wiring is incomplete */
.socialaccountlinks-v2-block .sqs-svg-icon--wrapper {
  width: 32px !important;
  height: 32px !important;
  display: inline-block;
  vertical-align: middle;
  margin: 0 9px;
  overflow: hidden;
  position: relative;
}
.socialaccountlinks-v2-block .sqs-svg-icon--wrapper > div,
.socialaccountlinks-v2-block .sqs-svg-icon--wrapper svg,
.socialaccountlinks-v2-block .sqs-svg-icon--social {
  width: 100% !important;
  height: 100% !important;
  max-width: 32px !important;
  max-height: 32px !important;
  display: block;
}
.socialaccountlinks-v2-block .sqs-svg-icon--list > div:not(.sqs-svg-icon--wrapper) {
  display: none; /* orphaned empty twitter svg without link */
}

/* Blog / article pages: transparent header overlays content */
body.tweak-transparent-header main#page {
  padding-top: clamp(96px, 14vw, 140px);
}
body.tweak-transparent-header .romlicontainer,
body.tweak-transparent-header .romli-blog-wrap {
  margin-top: 0;
}

/* Keep nav items on one line with even spacing (Blog was nested under Merch) */
.header-nav-list {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0;
}
.header-nav-item {
  white-space: nowrap;
}
.header-nav-item a {
  padding-left: 0.85em;
  padding-right: 0.85em;
}
.header-menu-nav-item a {
  display: block;
}

/* Black banner sections that lost background images: soften empty strips */
.page-section.black:not(.has-background) > .section-background:empty,
.page-section.black-bold:not(.has-background) > .section-background:empty {
  background: linear-gradient(180deg, #1a1618 0%, #000 55%, #0d0d0d 100%);
}

/* Lazy images that never got src: show once mapped */
img.thumb-image[src],
img.image[src] {
  opacity: 1;
}

/*
  Squarespace site-bundle never marks items loaded offline, so blog posts stay at opacity:0.
  Same for scroll animations that wait for data-active.
*/
.blog-item,
.blog-item.entry,
.blog-masonry .blog-item,
.blog-basic-grid .blog-item,
.blog-alternating-side-by-side .blog-item,
.blog-side-by-side .blog-item,
.blog-single-column .blog-item {
  opacity: 1 !important;
  transform: none !important;
}
[data-animation]:not([data-animation="none"]),
[data-animation][data-animation="fade-up"],
[data-animation][data-animation="fade"],
[data-animation][data-animation="fade-left"],
[data-animation][data-animation="fade-right"],
[data-animation][data-animation="fade-down"] {
  opacity: 1 !important;
  transform: none !important;
}

/* Section background images — keep absolute fill (do NOT switch to relative) */
.section-background > img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* Ensure logo is clickable / visible */
.header-title-logo a {
  display: inline-block;
  min-height: 40px;
}
.header-title-logo img {
  max-height: 80px;
  width: auto;
  display: block;
}

/* Fallback layout when masonry JS is absent */
.blog-masonry-wrapper {
  display: flex !important;
  flex-wrap: wrap;
  gap: 3vw;
  align-items: flex-start;
  min-height: 200px;
}
.blog-masonry-wrapper > .blog-item {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: calc(33.333% - 2vw) !important;
  box-sizing: border-box;
  margin: 0 0 2vw !important;
}
@media (max-width: 900px) {
  .blog-masonry-wrapper > .blog-item {
    width: calc(50% - 1.5vw) !important;
  }
}
@media (max-width: 600px) {
  .blog-masonry-wrapper > .blog-item {
    width: 100% !important;
  }
}

/* Show page / image blocks: make sure content text stays readable */
.page-section .content {
  position: relative;
  z-index: 1;
}

/* Mobile nav: Blog as its own row */
.header-menu-nav-item a + a {
  display: none;
}