/* =========================================================
   AlexFrankes.nl — Photo Archive
   Builds on ../af.css
   ========================================================= */

.gallery-page {
  min-height: 100vh;
  margin: 0;
  color: rgba(220,255,228,.92);
}

.gallery-page * {
  box-sizing: border-box;
}

.gallery-shell {
  position: relative;
  z-index: 1;
  width: min(var(--afContentMax, 1140px), calc(100% - 32px));
  margin: 0 auto;
  padding: 32px 0 50px;
}

.gallery-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
  padding: 8px 4px;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.gallery-header__brand,
.gallery-header__system {
  color: rgba(188,255,201,.72);
  text-decoration: none;
}

.gallery-header__brand:hover {
  color: #7cff86;
}

.gallery-panel,
.gallery-featured {
  position: relative;
  overflow: hidden;
  margin: 0 0 20px;
  border: 1px solid rgba(124,255,134,.44);
  border-radius: 18px;
  background:
    radial-gradient(900px 340px at 12% 0%, rgba(0,255,140,.10), transparent 62%),
    linear-gradient(180deg, rgba(5,24,13,.92), rgba(1,10,6,.94));
  box-shadow:
    0 18px 48px rgba(0,0,0,.48),
    0 0 0 1px rgba(0,0,0,.62) inset,
    0 0 0 1px rgba(124,255,134,.09) inset,
    0 0 30px rgba(0,255,140,.07);
}

.gallery-panel::before,
.gallery-featured::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .22;
  background:
    repeating-linear-gradient(
      180deg,
      transparent 0,
      transparent 10px,
      rgba(0,0,0,.28) 11px
    );
}

.gallery-panel__bevel,
.gallery-panel__depth {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.gallery-panel__bevel {
  border-radius: inherit;
  box-shadow:
    inset 0 1px rgba(255,255,255,.08),
    inset 0 -18px 40px rgba(0,0,0,.20);
}

.gallery-panel__depth {
  border-radius: inherit;
  border: 10px solid rgba(0,0,0,.08);
}

.gallery-panel__content {
  position: relative;
  z-index: 1;
  padding: 22px;
}

.gallery-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border: 1px solid rgba(124,255,134,.45);
  border-radius: 999px;
  color: rgba(219,255,228,.86);
  background: rgba(0,255,140,.07);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.gallery-chip__dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #7cff86;
  box-shadow: 0 0 12px rgba(124,255,134,.72);
}

.gallery-kicker {
  margin-bottom: 5px;
  color: rgba(174,255,192,.55);
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.gallery-intro__heading,
.gallery-title-row,
.gallery-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-top: 18px;
}

.gallery-intro h1,
.gallery-album h1,
.gallery-collections h2 {
  margin: 0;
  color: #7cff86;
  line-height: .95;
  text-shadow: 0 0 20px rgba(124,255,134,.13);
}

.gallery-intro h1 {
  font-size: clamp(34px, 6vw, 62px);
}

.gallery-album h1 {
  font-size: clamp(30px, 5vw, 50px);
}

.gallery-collections h2 {
  font-size: clamp(25px, 4vw, 38px);
}

.gallery-intro__heading p {
  margin: 10px 0 0;
  color: rgba(211,255,220,.72);
}

.gallery-intro__stats {
  display: flex;
  gap: 10px;
}

.gallery-intro__stats > div,
.gallery-counter {
  min-width: 110px;
  padding: 10px 12px;
  border: 1px solid rgba(124,255,134,.22);
  border-radius: 12px;
  background: rgba(0,0,0,.24);
}

.gallery-intro__stats strong,
.gallery-counter strong {
  display: block;
  color: #7cff86;
  font-size: 24px;
}

.gallery-intro__stats span,
.gallery-counter span {
  display: block;
  margin-top: 2px;
  color: rgba(207,255,217,.55);
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* Featured */
.gallery-featured {
  padding: 10px;
}

.gallery-featured__image {
  position: relative;
  z-index: 1;
  display: block;
  overflow: hidden;
  min-height: 320px;
  max-height: 660px;
  border: 1px solid rgba(124,255,134,.23);
  border-radius: 12px;
  background: #020805;
  text-decoration: none;
}

.gallery-featured__image img {
  display: block;
  width: 100%;
  max-height: 650px;
  object-fit: contain;
  margin: 0 auto;
  background: #020805;
}

.gallery-featured__shade {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(0,0,0,.02) 45%, rgba(0,0,0,.74) 100%);
}

.gallery-featured__label {
  position: absolute;
  top: 18px;
  left: 18px;
  padding: 6px 9px;
  border: 1px solid rgba(124,255,134,.45);
  border-radius: 999px;
  color: #dffff0;
  background: rgba(0,10,5,.75);
  backdrop-filter: blur(6px);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
}

.gallery-featured__caption {
  position: absolute;
  right: 20px;
  bottom: 18px;
  left: 20px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  color: #fff;
}

.gallery-featured__caption strong {
  font-size: clamp(18px, 3.2vw, 34px);
}

.gallery-featured__caption span {
  color: rgba(230,255,235,.72);
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* Collections */
.gallery-album-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}

.gallery-album-card {
  overflow: hidden;
  border: 1px solid rgba(124,255,134,.25);
  border-radius: 14px;
  background: rgba(0,0,0,.28);
  color: inherit;
  text-decoration: none;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.gallery-album-card:hover {
  transform: translateY(-3px);
  border-color: rgba(124,255,134,.58);
  box-shadow: 0 14px 30px rgba(0,0,0,.35), 0 0 20px rgba(0,255,140,.08);
}

.gallery-album-card__image {
  position: relative;
  display: block;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #030806;
}

.gallery-album-card__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gallery-album-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 62%, rgba(0,0,0,.48));
}

.gallery-album-card__body {
  display: grid;
  gap: 4px;
  padding: 14px 16px 16px;
}

.gallery-album-card__index {
  color: rgba(184,255,199,.46);
  font-size: 9px;
  letter-spacing: .13em;
}

.gallery-album-card__body strong {
  color: #7cff86;
  font-size: 20px;
}

.gallery-album-card__body > span:last-child {
  color: rgba(207,255,217,.58);
  font-size: 11px;
}

/* Album */
.gallery-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 22px;
  color: rgba(184,255,199,.44);
  font-size: 10px;
  letter-spacing: .09em;
}

.gallery-breadcrumb a {
  color: rgba(202,255,213,.72);
  text-decoration: none;
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 18px;
  margin-top: 24px;
}

.gallery-photo {
  display: block;
  width: 100%;
  padding: 0;
  overflow: hidden;
  appearance: none;
  border: 1px solid rgba(124,255,134,.25);
  border-radius: 14px;
  background: rgba(0,0,0,.30);
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.gallery-photo:hover {
  transform: translateY(-2px);
  border-color: rgba(124,255,134,.55);
  box-shadow: 0 14px 30px rgba(0,0,0,.35), 0 0 18px rgba(0,255,140,.07);
}

.gallery-photo__frame {
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #020604;
}

.gallery-photo__frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.gallery-photo__info {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 56px;
  padding: 12px 14px;
}

.gallery-photo__info strong {
  overflow: hidden;
  color: rgba(226,255,233,.91);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gallery-photo__info > span {
  flex: 0 0 auto;
  color: rgba(184,255,199,.46);
  font-size: 9px;
  letter-spacing: .08em;
}

/* Buttons/errors */
.gallery-button {
  display: inline-block;
  margin-top: 14px;
  padding: 10px 14px;
  border: 1px solid rgba(124,255,134,.48);
  border-radius: 12px;
  color: #e8ffed;
  background: rgba(0,255,140,.08);
  text-decoration: none;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
}

.gallery-empty {
  color: rgba(210,255,220,.66);
}

/* Footer */
.gallery-footer {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 8px 4px;
  color: rgba(184,255,199,.42);
  font-size: 9px;
  letter-spacing: .1em;
}

/* Lightbox */
.gallery-lightbox {
  position: fixed;
  z-index: 9999;
  inset: 0;
  display: none;
  place-items: center;
  padding: 36px 72px;
  background: rgba(0,4,2,.95);
  backdrop-filter: blur(12px);
}

.gallery-lightbox.is-open {
  display: grid;
}

.gallery-lightbox__figure {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 12px;
  width: min(94vw, 1500px);
  height: min(90vh, 1000px);
  margin: 0;
}

.gallery-lightbox__image {
  display: block;
  max-width: 100%;
  max-height: calc(90vh - 70px);
  margin: auto;
  object-fit: contain;
  box-shadow: 0 20px 70px rgba(0,0,0,.65);
}

.gallery-lightbox__caption {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  color: rgba(225,255,232,.82);
}

.gallery-lightbox__caption span {
  color: rgba(184,255,199,.50);
}

.gallery-lightbox__close,
.gallery-lightbox__nav {
  position: fixed;
  z-index: 2;
  border: 1px solid rgba(124,255,134,.35);
  color: #dffff0;
  background: rgba(0,20,10,.78);
  cursor: pointer;
}

.gallery-lightbox__close {
  top: 18px;
  right: 18px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  font-size: 27px;
}

.gallery-lightbox__nav {
  top: 50%;
  width: 48px;
  height: 72px;
  margin-top: -36px;
  border-radius: 12px;
  font-size: 38px;
}

.gallery-lightbox__nav--previous { left: 16px; }
.gallery-lightbox__nav--next { right: 16px; }

body.gallery-lightbox-open {
  overflow: hidden;
}

@media (max-width: 760px) {
  .gallery-shell {
    width: min(100% - 18px, var(--afContentMax, 1140px));
    padding-top: 14px;
  }

  .gallery-header,
  .gallery-intro__heading,
  .gallery-title-row,
  .gallery-featured__caption,
  .gallery-footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .gallery-header__system {
    display: none;
  }

  .gallery-panel__content {
    padding: 16px;
  }

  .gallery-intro__stats {
    width: 100%;
  }

  .gallery-intro__stats > div {
    flex: 1 1 0;
    min-width: 0;
  }

  .gallery-album-grid,
  .gallery-grid {
    grid-template-columns: 1fr;
  }

  .gallery-featured {
    padding: 6px;
  }

  .gallery-featured__image {
    min-height: 0;
  }

  .gallery-featured__image img {
    max-height: 75vh;
  }

  .gallery-lightbox {
    padding: 56px 12px 20px;
  }

  .gallery-lightbox__nav {
    top: auto;
    bottom: 18px;
    width: 54px;
    height: 44px;
    margin: 0;
  }

  .gallery-lightbox__nav--previous { left: 18px; }
  .gallery-lightbox__nav--next { right: 18px; }

  .gallery-lightbox__caption {
    padding-bottom: 58px;
  }
}


/* =========================================================
   V4 — Gallery identity banner + title/meta refinements
   ========================================================= */

.gallery-brand-banner {
  position: relative;
  overflow: hidden;
  margin: 0 0 20px;
  border: 1px solid rgba(124,255,134,.44);
  border-radius: 18px;
  background:
    radial-gradient(1000px 320px at 15% 0%, rgba(0,255,140,.11), transparent 64%),
    rgba(1,10,6,.90);
  box-shadow:
    0 18px 48px rgba(0,0,0,.48),
    0 0 0 1px rgba(0,0,0,.62) inset,
    0 0 0 1px rgba(124,255,134,.09) inset,
    0 0 30px rgba(0,255,140,.07);
}

.gallery-brand-banner img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 340px;
  object-fit: cover;
  object-position: center;
}

/* Photo titles should read as part of the green HUD, not white body text. */
.gallery-featured__caption strong,
.gallery-photo__info strong,
.gallery-lightbox__title {
  color: #7cff86;
  text-shadow: 0 0 16px rgba(124,255,134,.16);
}

.gallery-featured__meta,
.gallery-photo__datetime,
.gallery-lightbox__date {
  display: block;
  margin-top: 5px;
  color: rgba(194,255,207,.55);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.gallery-photo__text {
  min-width: 0;
  overflow: hidden;
}

.gallery-photo__text strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gallery-lightbox__caption > div {
  min-width: 0;
}

.gallery-lightbox__date:empty {
  display: none;
}

@media (max-width: 760px) {
  .gallery-brand-banner img {
    max-height: 220px;
  }
}


/* =========================================================
   V4.1 — Floating masthead, visually attached to gallery frame
   ========================================================= */

/* Kill the V4 boxed-banner treatment completely. */
.gallery-brand-banner {
  display: none !important;
}

.gallery-masthead {
  position: relative;
  z-index: 12;
  width: calc(100% - 34px);
  margin: 2px auto -74px;
  pointer-events: none;
}

.gallery-masthead img {
  display: block;
  width: 100%;
  height: auto;

  /*
   * The generated artwork contains a softly tinted outer canvas.
   * Blend it into the page rather than presenting it as a second panel.
   * The actual neon masthead/lens remains visually dominant.
   */
  mix-blend-mode: screen;
  filter: contrast(1.08) saturate(1.08);
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0,0,0,.35) 9%,
    #000 22%,
    #000 79%,
    rgba(0,0,0,.42) 91%,
    transparent 100%
  );
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0,0,0,.35) 9%,
    #000 22%,
    #000 79%,
    rgba(0,0,0,.42) 91%,
    transparent 100%
  );
}

/* The first actual gallery panel rises behind the masthead,
   matching the overlapping construction of the homepage. */
.gallery-masthead + .gallery-panel {
  position: relative;
  z-index: 4;
  padding-top: 78px;
}

/* If the collection page starts with a breadcrumb/content panel,
   preserve breathing room below the floating artwork. */
.gallery-masthead + * {
  position: relative;
}

@media (max-width: 760px) {
  .gallery-masthead {
    width: calc(100% - 12px);
    margin-bottom: -28px;
  }

  .gallery-masthead + .gallery-panel {
    padding-top: 34px;
  }
}


/* =========================================================
   V4.2 — Masthead flush to top, no utility header / whitespace
   ========================================================= */

/* Remove any legacy top utility/header labels if markup survives elsewhere. */
.gallery-topbar,
.gallery-utility,
.site-kicker {
  display: none !important;
}

/* Pull the complete gallery composition to the top. */
.gallery-shell,
.gallery-wrap,
main {
  padding-top: 0 !important;
}

.gallery-masthead {
  width: calc(100% - 34px);
  margin-top: 0 !important;
  margin-bottom: -74px !important;
  padding: 0 !important;
  line-height: 0;
}

/* Crop away transparent / visually empty top and bottom canvas around
   the masthead artwork without altering the source file. */
.gallery-masthead {
  overflow: hidden;
}

.gallery-masthead img {
  display: block;
  width: 100%;
  height: auto;
  margin: -8.5% 0 -7.5% !important;
  padding: 0 !important;
}

/* Avoid a second artificial gap before the first archive panel. */
.gallery-masthead + .gallery-panel {
  margin-top: 0 !important;
}

@media (max-width: 760px) {
  .gallery-masthead {
    width: calc(100% - 12px);
    margin-bottom: -28px !important;
  }

  .gallery-masthead img {
    margin-top: -7% !important;
    margin-bottom: -6% !important;
  }
}


/* =========================================================
   V5.0 — VISUAL ARCHIVE / unified interface
   Authoritative design layer. Intentionally overrides V4.x.
   ========================================================= */

:root{
  --ga-line: rgba(124,255,134,.52);
  --ga-line-hot: rgba(124,255,134,.88);
  --ga-glow: rgba(0,255,140,.14);
  --ga-panel: rgba(2,16,9,.91);
  --ga-text: #c9ffd6;
  --ga-accent: #7cff86;
}

.gallery-page{
  overflow-x:hidden;
}

.gallery-shell{
  width:min(var(--afContentMax,1140px),calc(100% - 28px));
  margin:0 auto;
  padding:0 0 52px !important;
}

/* ---------- HERO: artwork and panel are one connected instrument ---------- */
.gallery-hero{
  position:relative;
  z-index:20;
  height:clamp(210px,24vw,300px);
  margin:0 0 -1px;
  pointer-events:none;
}

.gallery-masthead{
  position:absolute !important;
  z-index:22;
  top:0;
  left:50%;
  width:calc(100% + 34px) !important;
  height:100%;
  margin:0 !important;
  overflow:hidden;
  transform:translateX(-50%);
  line-height:0;
  pointer-events:auto;
}

.gallery-masthead img{
  position:absolute;
  top:50%;
  left:50%;
  display:block;
  width:100% !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
  transform:translate(-50%,-50%) scale(1.07);
  filter:contrast(1.09) saturate(1.12) drop-shadow(0 12px 24px rgba(0,0,0,.34));
  mix-blend-mode:screen;
  -webkit-mask-image:radial-gradient(ellipse 74% 62% at 50% 50%,#000 52%,rgba(0,0,0,.96) 68%,transparent 100%);
  mask-image:radial-gradient(ellipse 74% 62% at 50% 50%,#000 52%,rgba(0,0,0,.96) 68%,transparent 100%);
  transition:filter .45s ease,transform .55s cubic-bezier(.2,.8,.2,1);
}

.gallery-masthead:hover img{
  filter:contrast(1.12) saturate(1.18) drop-shadow(0 14px 30px rgba(0,255,140,.10));
  transform:translate(-50%,-50%) scale(1.085);
}

/* The line coming out of the artwork physically joins the table/frame. */
.gallery-hero__connector{
  position:absolute;
  z-index:21;
  left:4px;
  right:4px;
  bottom:0;
  height:58px;
  border-left:1px solid var(--ga-line);
  border-right:1px solid var(--ga-line);
  border-radius:18px 18px 0 0;
  opacity:.9;
}

.gallery-hero__connector::before,
.gallery-hero__connector::after{
  content:"";
  position:absolute;
  top:0;
  width:calc(50% - 104px);
  height:1px;
  background:linear-gradient(90deg,var(--ga-line),var(--ga-line-hot));
  box-shadow:0 0 14px var(--ga-glow);
}

.gallery-hero__connector::before{left:0}
.gallery-hero__connector::after{
  right:0;
  transform:scaleX(-1);
}

.gallery-hero__connector span{
  position:absolute;
  left:50%;
  top:-2px;
  width:154px;
  height:5px;
  transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,var(--ga-accent),transparent);
  filter:blur(1px);
  opacity:.5;
  animation:gaPulse 3.6s ease-in-out infinite;
}

@keyframes gaPulse{
  0%,100%{opacity:.22;transform:translateX(-50%) scaleX(.72)}
  50%{opacity:.72;transform:translateX(-50%) scaleX(1)}
}

/* First panel plugs directly into connector. */
.gallery-hero + .gallery-panel{
  margin-top:0 !important;
  border-top-left-radius:0;
  border-top-right-radius:0;
  border-top-color:var(--ga-line);
  padding-top:0 !important;
}

.gallery-panel,
.gallery-featured{
  border-color:rgba(124,255,134,.38);
  background:
    radial-gradient(1000px 380px at 10% 0%,rgba(0,255,140,.10),transparent 62%),
    radial-gradient(760px 360px at 88% 20%,rgba(75,184,69,.07),transparent 64%),
    linear-gradient(180deg,rgba(4,23,13,.93),rgba(1,10,6,.95));
  box-shadow:
    0 20px 52px rgba(0,0,0,.50),
    inset 0 1px rgba(255,255,255,.06),
    inset 0 0 0 1px rgba(124,255,134,.07),
    0 0 28px rgba(0,255,140,.055);
  transition:border-color .28s ease,box-shadow .28s ease,transform .28s ease;
}

.gallery-panel:hover,
.gallery-featured:hover{
  border-color:rgba(124,255,134,.53);
  box-shadow:
    0 22px 56px rgba(0,0,0,.52),
    inset 0 1px rgba(255,255,255,.07),
    inset 0 0 0 1px rgba(124,255,134,.10),
    0 0 34px rgba(0,255,140,.075);
}

.gallery-intro .gallery-panel__content{
  padding-top:26px;
}

.gallery-intro__heading h1,
.gallery-title-row h1,
.gallery-section-heading h2{
  color:var(--ga-accent);
  text-shadow:0 0 22px rgba(124,255,134,.12);
}

/* HUD corners and subtle moving scan glint */
.gallery-panel::after,
.gallery-featured::after{
  content:"";
  position:absolute;
  inset:8px;
  pointer-events:none;
  opacity:.45;
  background:
    linear-gradient(var(--ga-accent),var(--ga-accent)) left top/16px 1px no-repeat,
    linear-gradient(var(--ga-accent),var(--ga-accent)) left top/1px 16px no-repeat,
    linear-gradient(var(--ga-accent),var(--ga-accent)) right bottom/16px 1px no-repeat,
    linear-gradient(var(--ga-accent),var(--ga-accent)) right bottom/1px 16px no-repeat;
}

/* ---------- FEATURED ---------- */
.gallery-featured{
  transform:translateZ(0);
}
.gallery-featured__image{
  overflow:hidden;
}
.gallery-featured__image img{
  transition:transform .8s cubic-bezier(.2,.75,.2,1),filter .5s ease;
}
.gallery-featured:hover .gallery-featured__image img{
  transform:scale(1.018);
  filter:saturate(1.06) contrast(1.025);
}
.gallery-featured__label{
  transition:border-color .25s ease,background .25s ease,box-shadow .25s ease;
}
.gallery-featured:hover .gallery-featured__label{
  border-color:rgba(124,255,134,.72);
  background:rgba(0,20,10,.84);
  box-shadow:0 0 18px rgba(0,255,140,.10);
}
.gallery-featured__caption strong,
.gallery-photo__info strong,
.gallery-lightbox__title{
  color:var(--ga-accent) !important;
}
.gallery-featured__titleblock{
  display:block;
}
.gallery-featured__meta,
.gallery-photo__datetime,
.gallery-lightbox__date{
  display:block;
  margin-top:5px;
  color:rgba(194,255,207,.52);
  font-size:10px;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
}

/* ---------- COLLECTION CARDS ---------- */
.gallery-album-card,
.gallery-photo{
  position:relative;
  isolation:isolate;
  transition:
    transform .32s cubic-bezier(.2,.8,.2,1),
    border-color .25s ease,
    box-shadow .32s ease;
}
.gallery-album-card::after,
.gallery-photo::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(112deg,transparent 25%,rgba(124,255,134,.10) 48%,transparent 68%);
  transform:translateX(-70%);
  transition:opacity .25s ease;
}
.gallery-album-card:hover,
.gallery-photo:hover{
  transform:translateY(-5px);
  border-color:rgba(124,255,134,.66);
  box-shadow:0 18px 38px rgba(0,0,0,.42),0 0 26px rgba(0,255,140,.09);
}
.gallery-album-card:hover::after,
.gallery-photo:hover::after{
  opacity:1;
  animation:gaSweep .9s ease forwards;
}
@keyframes gaSweep{
  from{transform:translateX(-75%)}
  to{transform:translateX(75%)}
}
.gallery-album-card__image img,
.gallery-photo__frame img{
  transition:transform .65s cubic-bezier(.2,.8,.2,1),filter .35s ease;
}
.gallery-album-card:hover .gallery-album-card__image img{
  transform:scale(1.045);
  filter:saturate(1.06);
}
.gallery-photo:hover .gallery-photo__frame img{
  transform:scale(1.025);
  filter:saturate(1.05);
}
.gallery-album-card__body strong{
  transition:text-shadow .25s ease;
}
.gallery-album-card:hover .gallery-album-card__body strong{
  text-shadow:0 0 15px rgba(124,255,134,.28);
}

.gallery-photo__text{
  min-width:0;
  overflow:hidden;
}
.gallery-photo__text strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:15px;
}
.gallery-photo__capture{
  flex:0 0 auto;
  color:rgba(184,255,199,.46);
  font-size:9px;
  letter-spacing:.08em;
}

/* ---------- BUTTONS / CHIPS ---------- */
.gallery-chip,
.gallery-button,
.gallery-counter{
  transition:border-color .25s ease,box-shadow .25s ease,background .25s ease;
}
.gallery-chip:hover,
.gallery-button:hover{
  border-color:rgba(124,255,134,.76);
  box-shadow:0 0 20px rgba(0,255,140,.10);
}
.gallery-chip__dot{
  box-shadow:0 0 10px rgba(124,255,134,.65);
  animation:gaDot 2.2s ease-in-out infinite;
}
@keyframes gaDot{50%{opacity:.45;box-shadow:0 0 3px rgba(124,255,134,.3)}}

/* ---------- LIGHTBOX ---------- */
.gallery-lightbox{
  opacity:0;
  display:grid !important;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .25s ease,visibility .25s ease;
}
.gallery-lightbox.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.gallery-lightbox__figure{
  transform:translateY(10px) scale(.985);
  opacity:0;
  transition:transform .32s cubic-bezier(.2,.8,.2,1),opacity .28s ease;
}
.gallery-lightbox.is-open .gallery-lightbox__figure{
  transform:none;
  opacity:1;
}
.gallery-lightbox__image{
  border:1px solid rgba(124,255,134,.20);
  border-radius:8px;
  box-shadow:0 24px 80px rgba(0,0,0,.72),0 0 34px rgba(0,255,140,.055);
}
.gallery-lightbox__close,
.gallery-lightbox__nav{
  transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease;
}
.gallery-lightbox__close:hover,
.gallery-lightbox__nav:hover{
  transform:scale(1.06);
  border-color:rgba(124,255,134,.72);
  background:rgba(0,35,17,.88);
  box-shadow:0 0 22px rgba(0,255,140,.12);
}
.gallery-lightbox__text{
  min-width:0;
}

/* ---------- entrance animation ---------- */
@media (prefers-reduced-motion:no-preference){
  .gallery-hero{animation:gaEnter .65s ease both}
  .gallery-panel,.gallery-featured{animation:gaEnter .6s ease both}
  .gallery-featured{animation-delay:.06s}
  .gallery-collections{animation-delay:.12s}
  @keyframes gaEnter{
    from{opacity:0;transform:translateY(10px)}
    to{opacity:1;transform:none}
  }
}

/* ---------- responsive ---------- */
@media (max-width:760px){
  .gallery-shell{
    width:min(calc(100% - 14px),var(--afContentMax,1140px));
  }
  .gallery-hero{
    height:clamp(145px,36vw,205px);
  }
  .gallery-masthead{
    width:calc(100% + 12px) !important;
  }
  .gallery-masthead img{
    transform:translate(-50%,-50%) scale(1.16);
  }
  .gallery-hero__connector{
    height:34px;
  }
  .gallery-hero__connector::before,
  .gallery-hero__connector::after{
    width:calc(50% - 54px);
  }
  .gallery-hero__connector span{
    width:82px;
  }
  .gallery-intro .gallery-panel__content{
    padding-top:20px;
  }
}

@media (prefers-reduced-motion:reduce){
  .gallery-masthead img,
  .gallery-featured__image img,
  .gallery-album-card,
  .gallery-photo,
  .gallery-lightbox,
  .gallery-lightbox__figure{
    transition:none !important;
    animation:none !important;
  }
}

/* =========================================================
   V5.1 — banner is artwork; archive header remains live HTML
   ========================================================= */
.gallery-hero{
  height:clamp(172px,18vw,226px) !important;
  margin:0 !important;
}
.gallery-masthead{
  width:100% !important;
  overflow:visible !important;
}
.gallery-masthead img{
  width:100% !important;
  height:100% !important;
  object-fit:contain;
  object-position:center bottom;
  transform:none !important;
  mix-blend-mode:normal !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
  filter:drop-shadow(0 10px 22px rgba(0,0,0,.38));
}
.gallery-masthead:hover img{transform:translateY(-1px) !important;}

/* A single clean hand-off from the artwork to the live HTML frame. */
.gallery-hero__connector{
  left:0 !important;
  right:0 !important;
  bottom:-1px !important;
  height:28px !important;
  border:0 !important;
  border-bottom:1px solid rgba(124,255,134,.48) !important;
  border-radius:0 !important;
}
.gallery-hero__connector::before{
  left:0 !important;
  top:auto !important;
  bottom:0 !important;
  width:100% !important;
  height:1px !important;
  background:linear-gradient(90deg,transparent 0,rgba(124,255,134,.38) 5%,rgba(124,255,134,.7) 82%,rgba(124,255,134,.95) 92%,transparent 100%) !important;
  box-shadow:0 0 12px rgba(0,255,140,.12) !important;
}
.gallery-hero__connector::after,
.gallery-hero__connector span{display:none !important;}
.gallery-hero + .gallery-panel{
  margin-top:0 !important;
  border-top-left-radius:18px !important;
  border-top-right-radius:18px !important;
  border-top-color:rgba(124,255,134,.48) !important;
}

/* Photo titles: secondary UI, never the subject. */
.gallery-featured__caption{
  right:14px !important;
  bottom:12px !important;
  left:14px !important;
  align-items:center !important;
  padding:8px 10px !important;
  border:1px solid rgba(124,255,134,.24);
  border-radius:9px;
  background:linear-gradient(90deg,rgba(0,12,6,.84),rgba(0,12,6,.55));
  backdrop-filter:blur(7px);
  box-shadow:inset 0 1px rgba(255,255,255,.035);
}
.gallery-featured__caption strong{
  display:block;
  font-size:clamp(13px,1.45vw,17px) !important;
  line-height:1.15;
  letter-spacing:.01em;
  text-transform:none !important;
  text-shadow:none !important;
}
.gallery-featured__meta{
  margin-top:3px !important;
  font-size:8px !important;
  letter-spacing:.08em !important;
}
.gallery-featured__caption > span:last-child{
  font-size:8px !important;
  opacity:.7;
}
.gallery-photo__info{
  min-height:48px !important;
  margin:0 8px 8px;
  padding:7px 9px !important;
  border:1px solid rgba(124,255,134,.18);
  border-radius:8px;
  background:rgba(0,14,7,.58);
}
.gallery-photo__info strong{
  font-size:11px !important;
  font-weight:650;
  letter-spacing:.01em;
}
.gallery-photo__datetime{font-size:8px !important;margin-top:2px !important;}
.gallery-photo__capture{font-size:8px !important;}

@media (max-width:700px){
  .gallery-hero{height:clamp(125px,28vw,175px) !important;}
  .gallery-featured__caption{right:8px !important;bottom:8px !important;left:8px !important;padding:7px 8px !important;}
}


/* =========================================================
   V6.0 EXACT REFERENCE LAYOUT
   Visual target: afbeelding(92).png
   Existing PHP/gallery engine intentionally preserved.
   ========================================================= */

:root{
  --v6-green:#72ff77;
  --v6-mint:#b6ff9f;
  --v6-line:rgba(91,255,104,.38);
  --v6-line-strong:rgba(120,255,115,.68);
  --v6-dim:rgba(149,220,159,.68);
  --v6-bg:#010604;
}

/* Reset old masthead experiments */
.gallery-hero,
.gallery-masthead,
.gallery-hero__connector,
.gallery-brand-banner{
  display:none !important;
}

.gallery-page{
  background:
    radial-gradient(1000px 500px at 50% 8%, rgba(0,75,33,.18), transparent 62%),
    #010604;
}

.gallery-shell{
  width:min(1280px,94vw) !important;
  margin:0 auto !important;
  padding:0 0 38px !important;
}

/* ===== Hero / wordmark ===== */
.v6-hero{
  position:relative;
  z-index:5;
  padding-top:26px;
  margin-bottom:10px;
}

.v6-brand{
  position:relative;
  min-height:210px;
}

.v6-line{
  position:absolute;
  left:-5vw;
  right:-5vw;
  height:1px;
  background:linear-gradient(90deg,transparent 0,var(--v6-line) 7%,var(--v6-line-strong) 50%,var(--v6-line) 93%,transparent 100%);
  box-shadow:0 0 12px rgba(88,255,108,.12);
}

.v6-line--top{ top:72px; }
.v6-line--mid{ top:166px; }

.v6-wordmark{
  position:absolute;
  left:3.2%;
  top:82px;
  z-index:2;
  color:var(--v6-mint);
  font-family:Arial,Helvetica,sans-serif;
  font-weight:700;
  font-size:clamp(44px,5.5vw,78px);
  line-height:1;
  letter-spacing:-3px;
  text-decoration:none;
  white-space:nowrap;
  text-shadow:
    0 0 10px rgba(118,255,115,.18),
    0 0 24px rgba(90,255,108,.10);
  pointer-events:auto;
}

/* absolutely static logo; no hover transforms or glow changes */
.v6-wordmark:hover{
  color:var(--v6-mint);
  text-shadow:
    0 0 10px rgba(118,255,115,.18),
    0 0 24px rgba(90,255,108,.10);
}

.v6-lens{
  position:absolute;
  z-index:4;
  right:1.5%;
  top:0;
  width:clamp(205px,18vw,290px);
  height:auto;
  pointer-events:none;
  filter:drop-shadow(0 0 13px rgba(92,255,101,.18));
}

/* ===== System line / stats, directly under wordmark ===== */
.v6-subhead{
  position:relative;
  margin-top:-20px;
  padding:18px 12% 22px 3.3%;
  min-height:118px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  border-bottom:1px solid var(--v6-line);
}

.v6-subhead::before{
  content:"";
  position:absolute;
  left:-4vw;
  right:-4vw;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--v6-line),transparent);
}

.v6-systemline{
  display:flex;
  align-items:center;
  gap:10px;
  color:#91ef94;
  font-size:18px;
  font-weight:700;
  letter-spacing:3px;
}

.v6-dot{
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--v6-green);
  box-shadow:0 0 11px rgba(114,255,119,.75);
}

.v6-tagline{
  margin-top:12px;
  padding-left:18px;
  color:#7fb88a;
  font-size:17px;
}

.v6-stats{
  display:flex;
  margin-right:6%;
}

.v6-stats>div{
  min-width:125px;
  padding:0 26px;
  border-left:1px solid rgba(107,255,121,.16);
}

.v6-stats strong{
  display:block;
  color:#7cf06f;
  font-size:34px;
  line-height:1;
}

.v6-stats span{
  display:block;
  margin-top:8px;
  color:#78ae80;
  font-size:12px;
  letter-spacing:1.2px;
}

/* Home intro is represented by the hero itself in V6 */
.gallery-intro{
  display:none !important;
}

/* ===== Featured panel: exact cyberpunk frame language ===== */
.gallery-featured{
  position:relative;
  margin:14px auto 18px !important;
  padding:12px !important;
  border:1px solid var(--v6-line) !important;
  border-radius:16px !important;
  background:
    linear-gradient(180deg,rgba(0,18,10,.95),rgba(0,7,4,.98)) !important;
  box-shadow:
    0 0 0 1px rgba(76,255,98,.03) inset,
    0 18px 55px rgba(0,0,0,.42) !important;
}

.gallery-featured::before{
  opacity:.18 !important;
}

.gallery-featured::after{
  content:"";
  position:absolute;
  inset:9px;
  pointer-events:none;
  background:
    linear-gradient(var(--v6-green),var(--v6-green)) left top/20px 1px no-repeat,
    linear-gradient(var(--v6-green),var(--v6-green)) left top/1px 20px no-repeat,
    linear-gradient(var(--v6-green),var(--v6-green)) right bottom/20px 1px no-repeat,
    linear-gradient(var(--v6-green),var(--v6-green)) right bottom/1px 20px no-repeat;
  opacity:.55;
}

.gallery-featured__image{
  border:0 !important;
  border-radius:0 !important;
  min-height:0 !important;
  max-height:none !important;
  background:#020604 !important;
}

.gallery-featured__image img{
  width:100% !important;
  max-height:690px !important;
  object-fit:cover !important;
  transform:none !important;
  filter:none !important;
}

.gallery-featured:hover .gallery-featured__image img{
  transform:none !important;
  filter:none !important;
}

.gallery-featured__label{
  top:18px !important;
  left:18px !important;
  padding:7px 12px !important;
  border-color:rgba(68,255,91,.56) !important;
  background:rgba(0,12,7,.82) !important;
  color:#d9f4de !important;
  font-size:11px !important;
  letter-spacing:1.3px !important;
}

/* Smaller photo title; no giant competing text */
.gallery-featured__caption{
  left:18px !important;
  right:18px !important;
  bottom:14px !important;
}

.gallery-featured__titleblock{
  display:inline-flex !important;
  width:auto !important;
  max-width:70% !important;
  padding:7px 10px !important;
  border:1px solid rgba(90,255,109,.24) !important;
  border-radius:7px !important;
  background:rgba(0,10,5,.78) !important;
  backdrop-filter:blur(4px);
}

.gallery-featured__caption strong{
  font-size:16px !important;
  font-weight:600 !important;
  color:#bff8c7 !important;
  text-transform:none !important;
  text-shadow:none !important;
}

.gallery-featured__meta{
  margin-top:3px !important;
  font-size:8px !important;
}

/* ===== Collections ===== */
.gallery-collections{
  margin-top:18px !important;
}

.gallery-panel,
.gallery-featured{
  border-color:var(--v6-line) !important;
}

.gallery-collections h2,
.gallery-album h1{
  color:var(--v6-green) !important;
}

.gallery-album-card{
  border-color:rgba(90,255,108,.22) !important;
}

.gallery-album-card:hover{
  transform:translateY(-3px) !important;
  border-color:rgba(95,255,112,.58) !important;
  box-shadow:0 14px 30px rgba(0,0,0,.35),0 0 18px rgba(0,255,140,.06) !important;
}

.gallery-album-card__body strong{
  color:var(--v6-green) !important;
}

/* ===== Album/photo grid captions kept restrained ===== */
.gallery-photo__info{
  min-height:48px !important;
  padding:8px 11px !important;
  background:linear-gradient(180deg,rgba(2,15,8,.96),rgba(0,7,4,.99)) !important;
}

.gallery-photo__text strong{
  font-size:13px !important;
  color:#bff5c7 !important;
  text-shadow:none !important;
}

.gallery-photo__datetime,
.gallery-photo__capture{
  font-size:8px !important;
}

/* footer matching reference */
.gallery-footer{
  margin-top:16px !important;
  padding:14px 18px !important;
  border-top:1px solid rgba(84,255,101,.25);
  color:#50aa60 !important;
  font-size:10px !important;
}

@media(max-width:820px){
  .gallery-shell{ width:96vw !important; }
  .v6-brand{ min-height:150px; }
  .v6-line--top{ top:48px; }
  .v6-line--mid{ top:118px; }
  .v6-wordmark{
    left:2%;
    top:58px;
    font-size:8vw;
    letter-spacing:-1px;
  }
  .v6-lens{
    width:145px;
    right:-2%;
    top:2px;
  }
  .v6-subhead{
    margin-top:-8px;
    padding:16px 4%;
    min-height:105px;
  }
  .v6-systemline{
    font-size:12px;
    letter-spacing:1.5px;
  }
  .v6-tagline{
    font-size:13px;
    padding-left:0;
  }
  .v6-stats{
    margin-right:0;
  }
  .v6-stats>div{
    min-width:auto;
    padding:0 10px;
  }
  .v6-stats strong{ font-size:24px; }
  .v6-stats span{ font-size:8px; }
}

@media(max-width:560px){
  .v6-subhead{
    align-items:flex-end;
    gap:12px;
  }
  .v6-tagline{ display:none; }
  .v6-stats>div{ padding:0 7px; }
  .v6-stats strong{ font-size:20px; }
  .gallery-featured{ padding:7px !important; }
}


/* =========================================================
   V6.0.1 — FIX: legacy V4 rule was hiding the new V6 header
   ========================================================= */
.gallery-shell > header.v6-hero:first-child {
  display: block !important;
}

.v6-hero {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}


/* =========================================================
   V6 FINAL HEADER — reference: afbeelding(95)
   Keeps existing gallery layout/functionality intact.
   ========================================================= */

/* Remove all previous experimental header implementations only. */
.gallery-hero,
.gallery-masthead,
.gallery-hero__connector,
.gallery-brand-banner,
.v6-hero,
.v6-brand,
.v6-subhead{
  display:none !important;
}

.gallery-shell{
  width:min(var(--afContentMax,1140px),calc(100% - 32px)) !important;
  margin:0 auto !important;
  padding-top:0 !important;
}

.archive-v6-header{
  display:block !important;
  position:relative;
  z-index:5;
  margin:0 0 14px;
  padding:0;
  background:transparent;
}

/* Artwork is static. No hover transforms, no parallax, no animation. */
.archive-v6-art{
  position:relative;
  width:100%;
  margin:0;
  line-height:0;
  overflow:visible;
  pointer-events:none;
}

.archive-v6-art img{
  display:block;
  width:100%;
  height:auto;
  margin:0;
  padding:0;
  transform:none !important;
  transition:none !important;
  filter:none !important;
  pointer-events:none;
}

/* The real page info stays HTML, directly under the artwork. */
.archive-v6-meta{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  margin-top:-2px;
  padding:17px 7% 19px 3.2%;
  min-height:108px;
  border-top:1px solid rgba(124,255,134,.30);
  border-bottom:1px solid rgba(124,255,134,.30);
  background:
    linear-gradient(180deg,rgba(1,12,7,.58),rgba(0,8,4,.36));
}

.archive-v6-meta::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-1px;
  height:1px;
  background:linear-gradient(
    90deg,
    rgba(124,255,134,.18),
    rgba(124,255,134,.54) 18%,
    rgba(124,255,134,.36) 72%,
    rgba(124,255,134,.18)
  );
  box-shadow:0 0 10px rgba(124,255,134,.06);
}

.archive-v6-system{
  display:flex;
  align-items:center;
  gap:10px;
  color:#8fe994;
  font-size:15px;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.archive-v6-dot{
  width:8px;
  height:8px;
  flex:0 0 auto;
  border-radius:50%;
  background:#7cff86;
  box-shadow:0 0 10px rgba(124,255,134,.62);
}

.archive-v6-tagline{
  margin-top:9px;
  padding-left:18px;
  color:rgba(200,255,211,.62);
  font-size:13px;
}

.archive-v6-stats{
  display:flex;
  align-items:stretch;
}

.archive-v6-stats > div{
  min-width:118px;
  padding:2px 24px;
  border-left:1px solid rgba(124,255,134,.16);
}

.archive-v6-stats strong{
  display:block;
  color:#7cff86;
  font-size:27px;
  line-height:1;
}

.archive-v6-stats span{
  display:block;
  margin-top:7px;
  color:rgba(190,255,202,.50);
  font-size:9px;
  letter-spacing:.10em;
  text-transform:uppercase;
}

/* Home intro duplicates this information, so hide only on archive home. */
.gallery-intro{
  display:none !important;
}

/* Keep the good existing content styling, but make sure the next panel
   sits neatly below the integrated header. */
.archive-v6-header + .gallery-featured,
.archive-v6-header + .gallery-panel{
  margin-top:0 !important;
}

/* Photo titles stay restrained. */
.gallery-featured__caption strong{
  font-size:16px !important;
  line-height:1.08 !important;
  text-transform:none !important;
}

.gallery-featured__titleblock{
  padding:6px 9px !important;
  border:1px solid rgba(124,255,134,.24) !important;
  border-radius:7px !important;
  background:rgba(0,10,5,.80) !important;
}

.gallery-photo__text strong{
  font-size:13px !important;
}

@media (max-width:760px){
  .gallery-shell{
    width:min(100% - 18px,var(--afContentMax,1140px)) !important;
  }

  .archive-v6-meta{
    gap:14px;
    padding:13px 3%;
    min-height:90px;
  }

  .archive-v6-system{
    font-size:10px;
    letter-spacing:.09em;
  }

  .archive-v6-tagline{
    display:none;
  }

  .archive-v6-stats > div{
    min-width:auto;
    padding:0 9px;
  }

  .archive-v6-stats strong{
    font-size:21px;
  }

  .archive-v6-stats span{
    font-size:7px;
  }
}

/* =========================================================
   Shared Photo Archive header — single source: header.inc.php
   ========================================================= */
.archive-v6-header { display:none !important; }

.archive-header{
  position:relative;
  z-index:5;
  width:100%;
  margin:0 0 14px;
  overflow:visible;
}

.archive-header__art{
  display:block;
  width:100%;
  line-height:0;
  text-decoration:none;
}

.archive-header__art img{
  display:block;
  width:100%;
  height:auto;
  margin:0;
  transform:none !important;
  transition:none !important;
  filter:none !important;
}

.archive-header__art:hover img,
.archive-header__art:focus img{
  transform:none !important;
  filter:none !important;
}

.archive-header__breadcrumbs{
  position:absolute;
  left:6.2%;
  bottom:5.5%;
  z-index:2;
  display:flex;
  align-items:center;
  gap:.58rem;
  max-width:72%;
  color:rgba(196,255,207,.52);
  font-size:clamp(9px,.82vw,13px);
  font-weight:500;
  letter-spacing:.025em;
  line-height:1;
  text-transform:uppercase;
  white-space:nowrap;
}

.archive-header__breadcrumbs a{
  color:rgba(196,255,207,.58);
  text-decoration:none;
}
.archive-header__breadcrumbs a:hover{ color:#7cff86; }
.archive-header__breadcrumbs > span:not(.current){ color:rgba(124,255,134,.42); }
.archive-header__breadcrumbs .current{ color:rgba(218,255,225,.78); }

.archive-header__stats{
  position:absolute;
  right:7.2%;
  bottom:3.4%;
  z-index:2;
  display:flex;
  align-items:stretch;
}
.archive-header__stats > div{
  min-width:94px;
  padding:0 18px;
  border-left:1px solid rgba(124,255,134,.16);
}
.archive-header__stats strong{
  display:block;
  color:#7cff86;
  font-size:22px;
  line-height:1;
}
.archive-header__stats span{
  display:block;
  margin-top:5px;
  color:rgba(190,255,202,.50);
  font-size:8px;
  letter-spacing:.10em;
  text-transform:uppercase;
}

.archive-header + .gallery-featured,
.archive-header + .gallery-panel{ margin-top:0 !important; }

@media (max-width:760px){
  .archive-header__breadcrumbs{
    left:6%;
    bottom:4.5%;
    max-width:66%;
    gap:.35rem;
    font-size:7px;
    overflow:hidden;
  }
  .archive-header__stats{ right:5%; bottom:2.7%; }
  .archive-header__stats > div{ min-width:auto; padding:0 7px; }
  .archive-header__stats strong{ font-size:15px; }
  .archive-header__stats span{ font-size:5.5px; }
}


/* =========================================================
   V6.2 — actual shared header_gallery.png + embedded breadcrumb
   ========================================================= */
.archive-header {
  margin-bottom: 18px;
}

.archive-header__art img {
  width: 100%;
  height: auto;
}

.archive-header__breadcrumbs {
  left: 6.2%;
  bottom: 6.2%;
}

.archive-header__stats {
  right: 25.2%;
  bottom: 20.7%;
}

@media (max-width: 760px) {
  .archive-header__breadcrumbs {
    left: 5.8%;
    bottom: 5.4%;
  }
}


/* V6.2.1 — shared header must never be hidden by legacy rules */
.gallery-shell > header.archive-header:first-child {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}