/* Kill Squarespace absolute/float layout so nothing overlaps */
#canvas, #pageWrapper, #page, #content, #header, #footer,
.sqs-layout, .sqs-row, .sqs-col, .sqs-block, .sqs-block-content,
.sqs-gallery-container, .sqs-gallery, .slide, .content-fill,
.sqs-gallery-thumbnails, .sqs-gallery-controls, .sqs-gallery-meta-container,
.margin-wrapper, .sqs-wrapper, .image-block-wrapper, .sqs-image,
.sqs-block-image, .banner-thumbnail-wrapper {
  position: static !important;
  float: none !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  z-index: auto !important;
}

.sqs-row, .sqs-col, .sqs-col-12, .sqs-col-9, .sqs-col-5, .sqs-col-3, .sqs-col-2 {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

#canvas, #page {
  max-width: 1100px;
  margin: 0 auto !important;
  padding: 0 16px 40px !important;
  background: #fff !important;
}

#header {
  text-align: center;
  padding: 20px 8px 12px !important;
  height: auto !important;
}
.logo a { color: #111 !important; text-decoration: none; }
.custom-info, #mobileNav { display: none !important; }
.main-nav ul {
  display: flex !important;
  flex-wrap: wrap;
  gap: 10px 22px;
  list-style: none;
  padding: 0 !important;
  justify-content: center;
}
.main-nav a { text-decoration: none; color: #222; }
#mobileMenuLink { display: none !important; }

/* hide leftover Squarespace chrome */
.page-borders-thick #canvas::before,
.page-borders-thick #canvas::after,
.sqs-slice-group,
#page-thumb,
.sqs-announcement-bar-dropzone {
  display: none !important;
}

img.thumb-image,
.sqs-block-image img,
.sqs-video-overlay img {
  max-width: 100% !important;
  height: auto !important;
  display: block;
  position: static !important;
}

/* Slideshow: one big photo, thumbs underneath */
.sqs-gallery-container,
.sqs-gallery-block-slideshow {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  margin: 0 0 32px !important;
}
.sqs-gallery-block-slideshow .sqs-gallery {
  order: 1;
  width: 100% !important;
}
.sqs-gallery-block-slideshow .slide {
  display: none !important;
  width: 100% !important;
}
.sqs-gallery-block-slideshow .slide.yg-on,
.sqs-gallery-block-slideshow:not(:has(.yg-on)) .sqs-gallery > .slide:first-child {
  display: block !important;
}
.sqs-gallery-block-slideshow .slide img {
  width: 100% !important;
  max-height: 70vh !important;
  object-fit: contain !important;
  margin: 0 auto;
}

.sqs-gallery-controls {
  order: 2;
  display: flex !important;
  justify-content: space-between;
  width: 100%;
  margin: 8px 0;
}
.sqs-gallery-controls .previous,
.sqs-gallery-controls .next {
  cursor: pointer;
  width: 44px;
  height: 44px;
  line-height: 40px;
  text-align: center;
  font-size: 32px;
  user-select: none;
}
.sqs-gallery-controls .previous::before { content: "‹"; }
.sqs-gallery-controls .next::before { content: "›"; }

.sqs-gallery-thumbnails {
  order: 3;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  justify-content: center;
  gap: 8px;
  margin: 12px 0 24px !important;
  width: 100% !important;
}
.sqs-gallery-thumbnails img {
  width: 72px !important;
  height: 72px !important;
  object-fit: cover !important;
  cursor: pointer;
  opacity: 0.7;
}
.sqs-gallery-thumbnails img.yg-on { opacity: 1; outline: 2px solid #222; }

.sqs-gallery-meta-container { order: 4; }

/* Grid galleries */
.sqs-gallery-block-grid .sqs-gallery,
.sqs-gallery-design-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 16px;
}
.sqs-gallery-block-grid .slide,
.sqs-gallery-design-grid-slide {
  display: block !important;
  width: auto !important;
}
.sqs-gallery-block-grid img {
  width: 100%;
  height: 220px;
  object-fit: cover;
}

.sqs-block-html, .sqs-block-button, .sqs-block-image {
  margin: 16px 0 !important;
  padding: 0 !important;
}
.sqs-block-html h1 { font-size: 2rem; color: #e36d00; margin: 0 0 8px; }
.sqs-block-html p { max-width: 40rem; }

#footer {
  margin-top: 40px !important;
  padding: 16px 0 32px !important;
}