@charset "UTF-8";

/* =====================================================
  THE COMRADE
  GALLERY / COMPLETE MINIMAL
===================================================== */

:root{
  --scr-bg:#fff;
  --scr-text:#111111;
  --scr-line:rgba(17,17,17,.14);

  --scr-wrap:1088px;
  --scr-pad:24px;
  --scr-gap:2px;

  --scr-dur:.6s;
  --scr-ease:cubic-bezier(.22,.61,.36,1);
}

/* =====================================================
  BASE + FADE IN
===================================================== */

.page-template-page-gallery .scr-gallery{
  background:var(--scr-bg);
  color:var(--scr-text);
  min-height:100vh;
  padding-top:var(--cs-header-h);
  opacity:0;
  transform:translateY(2px);
  transition:
    opacity 1.05s cubic-bezier(.22,.61,.36,1),
    transform 1.05s cubic-bezier(.22,.61,.36,1);
}

html.is-gallery-ready .page-template-page-gallery .scr-gallery{
  opacity:1;
  transform:none;
}

.page-template-page-gallery .scr-gallery figure{
  margin:0;
}

.page-template-page-gallery .scr-gallery-flow img,
.page-template-page-gallery .scr-gallery-intro img{
  display:block;
  width:100%;
  height:auto;
}

/* =====================================================
  WRAP
===================================================== */

.page-template-page-gallery .scr-gallery-flow__inner,
.page-template-page-gallery .cs-site-header__inner,
.page-template-page-gallery .cs-about__footer-inner,
.page-template-page-gallery .cs-footer__copy{
  width:min(100%, var(--scr-wrap));
  margin-inline:auto;
  padding-left:var(--scr-pad);
  padding-right:var(--scr-pad);
  box-sizing:border-box;
}

/* =====================================================
  FLOW
===================================================== */

.page-template-page-gallery .scr-gallery-flow{
  padding-top:2px;
  padding-bottom:52px;
}

.page-template-page-gallery .scr-gallery-flow__inner > *:first-child{
  margin-top:0;
}

.page-template-page-gallery .scr-gallery-flow__inner > *:last-child{
  margin-bottom:0;
}

/* =====================================================
  GALLERY
===================================================== */

.page-template-page-gallery .wp-block-gallery,
.page-template-page-gallery .wp-block-gallery.has-nested-images{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:var(--scr-gap);
  margin:0 !important;
  align-items:start;
}

.page-template-page-gallery .wp-block-gallery .wp-block-image,
.page-template-page-gallery .wp-block-gallery.has-nested-images .wp-block-image,
.page-template-page-gallery .wp-block-gallery.has-nested-images figure.wp-block-image{
  display:block !important;
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;
  margin:0 !important;
  float:none !important;
  overflow:hidden;
  position:relative;
  aspect-ratio:3 / 4;
}

.page-template-page-gallery .wp-block-gallery .wp-block-image a,
.page-template-page-gallery .wp-block-gallery.has-nested-images .wp-block-image a{
  display:block;
  width:100%;
  height:100%;
  text-decoration:none;
  cursor:zoom-in;
}

.page-template-page-gallery .wp-block-gallery .wp-block-image img,
.page-template-page-gallery .wp-block-gallery.has-nested-images .wp-block-image img{
  display:block;
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  object-fit:cover;
  object-position:center 42%;
  background:transparent;
  filter:
    contrast(1.06)
    brightness(0.97)
    saturate(0.84)
    hue-rotate(-3deg);
  transition:
    opacity var(--scr-dur) var(--scr-ease);
}

/* Hover feedback only on devices with a real hover pointer.
   Prevent iOS touch from retaining a hover state on gallery photographs. */
@media (hover:hover) and (pointer:fine){
  .page-template-page-gallery .wp-block-gallery a:hover img{
    opacity:.96;
  }
}

/* Archive collection: touch must not paint a dark tap overlay. */
.page-template-page-archive-collection .scr-gallery-flow .wp-block-gallery .wp-block-image a{
  -webkit-tap-highlight-color:transparent;
}
@media (hover:none), (pointer:coarse){
  .page-template-page-archive-collection .scr-gallery-flow .wp-block-gallery .wp-block-image a:hover img,
  .page-template-page-archive-collection .scr-gallery-flow .wp-block-gallery .wp-block-image a:active img{
    opacity:1;
  }
}

/* =====================================================
  LIGHTBOX / FIX
===================================================== */

.scr-lightbox-overlay{
  position:fixed;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;

  background:rgba(250,250,250,.94);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);

  z-index:9999;

  opacity:0;
  visibility:hidden;
  pointer-events:none;

  transition:
    opacity .45s cubic-bezier(.22,.61,.36,1),
    visibility 0s linear .45s;
}

.scr-lightbox-overlay.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;

  transition:
    opacity .7s cubic-bezier(.22,.61,.36,1),
    visibility 0s;
}

.scr-lightbox-img{
  display:block;
  max-width:84vw;
  max-height:88vh;
  width:auto;
  height:auto;
  object-fit:contain;

  transform:scale(.97);
  opacity:0;

  filter:none !important;
  box-shadow:
    0 12px 40px rgba(0,0,0,.08),
    0 2px 8px rgba(0,0,0,.04);

  transition:
    transform .7s cubic-bezier(.22,.61,.36,1),
    opacity .5s ease;
}

.scr-lightbox-overlay.is-open .scr-lightbox-img{
  transform:scale(1);
  opacity:1;
}

/* =====================================================
  SP
===================================================== */

@media (max-width:768px){

  :root{
    --scr-pad:16px;
    --scr-gap:2px;
  }

  .page-template-page-gallery .scr-gallery-flow{
    padding-top:2px;
    padding-bottom:40px;
  }

  .page-template-page-gallery .wp-block-gallery,
  .page-template-page-gallery .wp-block-gallery.has-nested-images{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:var(--scr-gap);
  }

  .scr-lightbox-img{
    max-width:92vw;
    max-height:84vh;
  }

}

/* GALLERY shares its grid container; header controls retain common dimensions. */
.page-template-page-gallery .cs-site-header{
  background:#fff;
  opacity:1;
  transition:opacity .42s var(--cs-header-ease);
}
/* Align the visible lines to the container edge without shrinking the hit area. */
.page-template-page-gallery .cs-site-header .cs-menu-btn{
  align-items:flex-end;
}
.page-template-page-gallery .cs-site-header.is-gallery-scrolling{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .42s var(--cs-header-ease), visibility 0s linear .42s;
}
@media (prefers-reduced-motion:reduce){
  .page-template-page-gallery .cs-site-header,
  .page-template-page-gallery .cs-site-header.is-gallery-scrolling{
    transition:none;
  }
}

/* Both collection pages: understated photo entrance. JS opts images into this
   state individually, keeping them visible when scripts are unavailable. */
.page-template-page-gallery .scr-gallery-flow .wp-block-gallery img.gallery-soft-enter,
.page-template-page-archive-collection .scr-gallery-flow .wp-block-gallery img.gallery-soft-enter {
  opacity:0;
  transition:opacity 1100ms cubic-bezier(.22,.61,.36,1);
}
.page-template-page-gallery .scr-gallery-flow .wp-block-gallery img.gallery-soft-enter.gallery-soft-visible,
.page-template-page-archive-collection .scr-gallery-flow .wp-block-gallery img.gallery-soft-enter.gallery-soft-visible {
  opacity:1;
}
@media (prefers-reduced-motion:reduce) {
  .page-template-page-gallery .scr-gallery-flow .wp-block-gallery img.gallery-soft-enter,
  .page-template-page-archive-collection .scr-gallery-flow .wp-block-gallery img.gallery-soft-enter {
    opacity:1;
    transition:none;
  }
}

/* 2026-10-22: A restrained cooler grade for the two collection grids only.
   The source images and opened lightbox images remain untouched. */
.page-template-page-gallery .scr-gallery-flow .wp-block-gallery figure.wp-block-image::after,
.page-template-page-archive-collection .scr-gallery-flow .wp-block-gallery figure.wp-block-image::after {
  content:"";
  position:absolute;
  inset:0;
  background:rgba(67, 109, 158, .13);
  mix-blend-mode:color;
  opacity:.65;
  pointer-events:none;
  z-index:1;
}

/* SP touch safety: never leave a thumbnail darkened by an interrupted
   reveal or Safari's persistent touch-hover state. Untouched images still
   enter softly on scroll. */
@media (hover:none), (pointer:coarse){
  .page-template-page-gallery .scr-gallery-flow .wp-block-gallery img.gallery-touch-revealed,
  .page-template-page-archive-collection .scr-gallery-flow .wp-block-gallery img.gallery-touch-revealed,
  .page-template-page-gallery .scr-gallery-flow .wp-block-gallery a:hover img.gallery-touch-revealed,
  .page-template-page-archive-collection .scr-gallery-flow .wp-block-gallery a:hover img.gallery-touch-revealed {
    opacity:1 !important;
    transition:none !important;
  }
  .page-template-page-gallery .scr-gallery-flow .wp-block-gallery a,
  .page-template-page-archive-collection .scr-gallery-flow .wp-block-gallery a {
    -webkit-tap-highlight-color:transparent;
  }
}
