/* Static replacements for layout the Squarespace runtime used to compute.
   The visual skin (lightbox glyphs, colors, nav widgets) stays in site.css;
   this file only supplies the geometry the platform JS used to write. */

/* Gallery masonry: replaces the JS autocolumns design. Column count follows
   the same floor(width/250) behavior; 10px gutters as measured on the live
   site (3x312px in the 956px content column at 1440). Order is column-major
   where the original filled the shortest column; accepted trade-off. */
.collection-type-gallery .sqs-system-gallery .slides {
  columns: 250px;
  column-gap: 10px;
}
.collection-type-gallery .sqs-system-gallery .slide {
  break-inside: avoid;
  margin: 0 0 10px;
}
.collection-type-gallery .sqs-system-gallery .slide img {
  width: 100%;
  height: auto;
  display: block;
}

/* Banner content-fill: replaces ImageLoader's cover-crop math. The figure
   is already position:absolute inset 0 in site.css; object-position per
   image carries the recovered focal point (inline on the img). */
.content-fill img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Lightbox container. Skin (overlay color, arrow/close glyphs, .mouseover
   visibility, body scroll lock) comes from site.css rules for
   .yui3-lightbox2 and .sqs-lightbox-*. */
.yui3-lightbox2 {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10000000;
  animation: sqs-lightbox-fade-in 0.25s ease-out;
}
@keyframes sqs-lightbox-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
.yui3-lightbox2-content {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.yui3-lightbox2 .sqs-lightbox-overlay {
  opacity: 0.95;
}
.yui3-lightbox2 .sqs-lightbox-slideshow {
  opacity: 1;
  position: relative;
  height: 100%;
}
.yui3-lightbox2 .sqs-lightbox-padder img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: 1;
  transition: opacity 0.2s ease-out;
}
.yui3-lightbox2 .sqs-lightbox-padder img.sqs-lightbox-fading {
  opacity: 0;
}
