/* Custom additions: things the original site did with JavaScript at runtime. */

html { scroll-behavior: smooth; }
body { margin: 0; }
img { max-width: 100%; }

/* Page fade-in (the original animates .Main-content / .Index-page-content on load) */
body:not(.has-loaded) .Site { opacity: 0; }
body.has-loaded .Site { opacity: 1; transition: opacity .4s ease-out; }

/* ---------- Index pages with background images (parallax + reveal) ---------- */
.Index-page--has-image { position: relative; overflow: hidden; background-color: #000 !important; color: #fff; }
.Index-page--has-image .Index-page-content { position: relative; z-index: 2; }
.Index-page-image { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: 0; z-index: 0; overflow: hidden; }
.Index-page-image img { position: absolute; top: 50%; left: 50%; width: 100%; height: 120%; object-fit: cover; transform: translate(-50%, -50%); will-change: transform; opacity: 0; transition: opacity .8s ease-out; }
.Index-page-image img.loaded { opacity: 1; }
.Index-page-image::after { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.45); pointer-events: none; }
.Index-page--has-image .Index-page-content h1, .Index-page--has-image .Index-page-content h2, .Index-page--has-image .Index-page-content h3, .Index-page--has-image .Index-page-content p { color: #fff; }
/* the first Index page fills the screen (tweak-index-page-fullscreen-first-page-only) */
.Index > .Index-page--has-image:first-child { min-height: 100vh; }
.Index > .Index-page--has-image:first-child .Index-page-content { padding-top: 200px !important; }
.Index > .Index-page--has-image:first-child .Index-page-content:has(.sqs-html-content p:only-child:empty) { min-height: 100vh; }

/* Homepage video background */
.sqs-video-background { position: absolute; inset: 0; overflow: hidden; background: #000 center / cover no-repeat; }
.sqs-video-background iframe { position: absolute; top: 50%; left: 50%; width: 100vw; height: 56.25vw; min-height: 100vh; min-width: 177.78vh; transform: translate(-50%, -50%); border: 0; pointer-events: none; opacity: 0; transition: opacity 1s ease; }
.sqs-video-background.is-playing iframe { opacity: 1; }
.Index-page--has-image .Index-page-image:has(.sqs-video-background)::after { background: rgba(0,0,0,.3); }

/* Scroll indicator */
.Index-page-scroll-indicator { position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%); z-index: 3; color: #fff; text-align: center; font-size: 10px; letter-spacing: .3em; text-transform: uppercase; opacity: .85; }
.Index-page-scroll-indicator.hidden { display: block; }
.Index-page-scroll-indicator-text { display: none; }
.Index-page-scroll-indicator-arrow { width: 22px; height: 11px; stroke: #fff; fill: none; stroke-width: 1.5; }
.Index-page-scroll-indicator-line { display: none; }

/* ---------- Index gallery (three news panels): packed layout, 3 images ---------- */
.Index-gallery-wrapper::after { content: ""; display: table; clear: both; }
.Index-gallery-control, .Index-gallery-indicators { display: none; }
.Index-gallery-item-image img { width: 100%; height: 100%; object-fit: cover; }
.Index-gallery-item-content-link { position: absolute; inset: 0; z-index: 3; }
.Index-gallery-item-content-body p:last-child strong { font-weight: 600; }

/* ---------- Gallery grid block (+ lightbox) ---------- */
.sqs-gallery-block-grid .sqs-gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.sqs-gallery-block-grid .slide { float: none !important; width: auto !important; }
.sqs-gallery-block-grid .slide .margin-wrapper a.image-slide-anchor { position: relative; overflow: hidden; cursor: pointer !important; }
.sqs-gallery-block-grid .slide .margin-wrapper a.image-slide-anchor img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block !important; transition: opacity .6s ease-out, transform .6s ease-out; }
.sqs-gallery-block-grid .image-slide-anchor:hover img { opacity: .85 !important; }
.v6-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
@media (max-width: 767px) { .sqs-gallery-block-grid .sqs-gallery { grid-template-columns: repeat(2, 1fr); gap: 12px; } }

/* Slideshow gallery block (Arts Group logos on the Team page) shown as a row of logos */
.sqs-gallery-block-slideshow .sqs-gallery { display: flex; flex-wrap: wrap; justify-content: center; gap: 30px; }
.sqs-gallery-block-slideshow .slide { flex: 0 1 160px; }
.sqs-gallery-block-slideshow .slide img { width: 100%; height: auto; display: block; }
.sqs-gallery-block-slideshow .sqs-gallery-controls, .sqs-gallery-block-slideshow .sqs-gallery-meta-container { display: none; }

.Lightbox { position: fixed; inset: 0; z-index: 10000; background: rgba(0,0,0,.92); display: none; align-items: center; justify-content: center; }
.Lightbox.is-open { display: flex; }
.Lightbox img { max-width: 92vw; max-height: 88vh; object-fit: contain; box-shadow: 0 20px 60px rgba(0,0,0,.6); }
.Lightbox button { position: absolute; background: none; border: 0; color: #fff; cursor: pointer; opacity: .8; padding: 20px; }
.Lightbox button:hover { opacity: 1; }
.Lightbox-close { top: 10px; right: 10px; }
.Lightbox-prev { left: 0; top: 50%; transform: translateY(-50%); }
.Lightbox-next { right: 0; top: 50%; transform: translateY(-50%); }
.Lightbox svg { width: 24px; height: 40px; stroke: #fff; fill: none; stroke-width: 1.5; }
.Lightbox-close svg { width: 26px; height: 26px; }
.Lightbox-caption { position: absolute; bottom: 20px; left: 0; right: 0; text-align: center; color: #ccc; font-size: 13px; }

/* ---------- Image blocks: reveal animations (original: collide / slide-up) ---------- */
.image-block-wrapper img, .sqs-image-shape-container-element img { display: block; width: 100%; height: auto; }
.Intro-image img { opacity: 0; transition: opacity 1s ease-out; }
.Intro-image img.loaded { opacity: 1; }

/* Image block v2 layouts (collage / card): the original sized these with JavaScript */
.image-block-v2 .intrinsic { position: relative; height: auto !important; padding: 0 !important; }
.image-block-v2 .image-inset, .image-block-v2 .sqs-image-shape-container-element { position: relative !important; height: auto !important; padding: 0 !important; overflow: visible !important; }
.image-block-v2 .image-inset img { display: block; width: 100% !important; height: auto !important; position: static !important; }
.design-layout-collage { position: relative; }
.design-layout-collage .intrinsic { width: 86%; margin-left: 0; }
.design-layout-collage .image-card-wrapper { position: absolute; top: 50%; left: 60%; width: 60%; transform: translateY(-50%); z-index: 2; }
.design-layout-collage.animation-loaded .sqs-dynamic-text-container { opacity: 1 !important; transform: none !important; }
.design-layout-collage.animation-loaded .image-inset { opacity: 1 !important; transform: none !important; }
.design-layout-collage .image-card { padding: 25px; }
.design-layout-collage .image-title-wrapper, .design-layout-collage .image-subtitle-wrapper { font-size: 16px !important; }
.design-layout-collage .sqs-dynamic-text { font-size: inherit !important; line-height: 1.4 !important; }
.design-layout-collage .image-title p { font-family: "Jost", "Helvetica Neue", Helvetica, Arial, sans-serif !important; font-weight: 300 !important; font-size: clamp(18px, 2vw, 27px) !important; line-height: 1.35 !important; color: #777 !important; margin: 0; }
.design-layout-collage .image-subtitle p { font-family: "Libre Bodoni", Georgia, serif !important; font-style: italic; font-size: 12px !important; color: #999 !important; margin: 0; }
.design-layout-collage.image-position-right .intrinsic { margin-left: 14%; }
.design-layout-collage.image-position-right .image-card-wrapper { left: 14%; }
.design-layout-card { display: flex; align-items: stretch; background: #fff; }
.design-layout-card .intrinsic { width: 50%; flex: 0 0 50%; }
.design-layout-card .image-inset, .design-layout-card .sqs-image-shape-container-element { height: 100% !important; }
.design-layout-card .image-inset img { height: 100% !important; object-fit: cover; }
.design-layout-card .image-card-wrapper { width: 50%; display: flex; align-items: center; justify-content: center; text-align: center; }
.design-layout-card.image-position-right { flex-direction: row-reverse; }
@media (max-width: 640px) {
  .design-layout-collage .intrinsic { width: 100%; margin: 0; }
  .design-layout-collage .image-card-wrapper { position: static; width: 100%; transform: none; }
  .design-layout-card { flex-direction: column !important; }
  .design-layout-card .intrinsic, .design-layout-card .image-card-wrapper { width: 100%; flex-basis: auto; }
}

/* ---------- Video blocks ---------- */
.video-block .embed-block-wrapper { position: relative; padding-bottom: 56.25% !important; height: 0; background: #000; }
.video-block .embed-block-wrapper iframe, .video-block .embed-block-wrapper video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-block .sqs-native-video { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #888; font-size: 14px; }

/* ---------- Intro banner ---------- */
.Intro { position: relative; overflow: hidden; }
.Intro--has-image { min-height: 162px; }
.Intro--has-image .Intro-content.empty { padding: 0; min-height: 162px; }
.Intro-image { position: absolute; top: 0; left: 0; bottom: 0; width: 100%; margin: 0; }
.Intro-image img { width: 100%; height: 120%; object-fit: cover; position: absolute; top: -10%; left: 0; will-change: transform; }
.Intro-image::after { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.25); }
.Intro-content.empty { min-height: 1px; }

/* ---------- Header ---------- */
.Header--bottom { display: block; }
.Header-inner--bottom { display: flex; align-items: center; justify-content: flex-end; }
.Header-inner--bottom > div { display: flex; align-items: center; }
.Header-inner--bottom > div:nth-child(1) { order: 2; }
.Header-inner--bottom > div:nth-child(2) { order: 1; margin-right: auto; }
.Header-inner--bottom > div:nth-child(3) { order: 3; }
.Header-nav--primary, .Header-nav--secondary { display: inline-block; }
.Header-nav--secondary { margin-left: 24px; }
.Header-nav-item { margin: 0 16px; padding: 6px 0; color: #fff; text-decoration: none; }
.Header-nav-item--active { border-bottom: 1px solid currentColor; }
.Header--overlay .Header-nav-item { color: #fffafa; }
.Header-branding-logo { width: 110px; max-width: 223px; height: auto; }
body:not(.homepage):not(.collection-type-index) .Header--overlay:not(.has-banner) { }
@media (max-width: 1100px) { .Header-nav-item { margin: 0 9px; } }
@media (max-width: 900px) { .Header--bottom { display: none; } }

/* Mobile bars/overlay */
.Mobile { display: none; }
@media (max-width: 900px) {
  .Mobile { display: block; }
  .Mobile-bar { display: flex; align-items: center; justify-content: space-between; background: #fff; padding: 10px 14px; }
  .Mobile-bar--bottom { position: sticky; top: 0; z-index: 900; border-bottom: 1px solid rgba(0,0,0,.08); }
  .Mobile-bar--top .Mobile-bar-branding-logo { width: 70px; height: auto; display: block; }
  .Mobile-bar-menu { background: none; border: 0; padding: 6px; cursor: pointer; color: #222; }
  .Mobile-overlay { position: fixed; inset: 0; z-index: 1000; background: #fff; display: none; overflow: auto; }
  body.is-mobile-overlay-active .Mobile-overlay { display: block; }
  body.is-mobile-overlay-active { overflow: hidden; }
  .Mobile-overlay-menu { padding: 80px 30px 40px; }
  .Mobile-overlay-nav { display: flex; flex-direction: column; }
  .Mobile-overlay-nav-item { font-family: "Jost", sans-serif; font-size: 22px; font-weight: 500; text-transform: uppercase; letter-spacing: .08em; color: #222; text-decoration: none; padding: 10px 0; }
  .Mobile-overlay-nav--secondary { margin-top: 20px; border-top: 1px solid rgba(0,0,0,.1); padding-top: 20px; }
  .Mobile-overlay-close { position: absolute; top: 18px; right: 18px; background: none; border: 0; cursor: pointer; color: #222; }
  .tweak-site-border-show .Site { border-width: 0; }
}

/* ---------- Footer ---------- */
.Footer-blocks--middle.empty, .Footer-business-hours { display: none; }
.Footer-business-info-item--email { text-decoration: none; }

/* ---------- Misc ---------- */
.sqs-block-html p:empty, .sqs-html-content p:empty { min-height: 1.5em; }
.sqs-block-button-element { text-decoration: none; }
figure { margin: 0; }
.Index-gallery-item-content-heading { margin-top: 0; }
.sqs-block-spacer .sqs-block-content { height: 0; }
.sqs-block-spacer .sqs-block-content.sqs-intrinsic { height: 0; position: relative; }