:root{
  --vf-popup-deep:#132a2d;
  --vf-popup-ink:#0d1411;
  --vf-popup-cream:#f7f1e3;
  --vf-popup-gold:#c9953d;
}

button.gallery-trigger{
  cursor:pointer;
  font-family:inherit;
}

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

.vf-gallery-modal[hidden],
.vf-gallery-viewer[hidden],
.vf-gallery-grid-view[hidden]{
  display:none;
}

.vf-gallery-modal{
  position:fixed;
  inset:0;
  z-index:2000;
  color:var(--vf-popup-ink);
}

.vf-gallery-modal__backdrop{
  position:absolute;
  inset:0;
  width:100%;
  border:0;
  background:rgba(5,13,9,.9);
  cursor:pointer;
}

.vf-gallery-modal__panel{
  position:absolute;
  inset:18px;
  overflow:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  background:var(--vf-popup-cream);
  box-shadow:0 28px 90px rgba(0,0,0,.48);
}

.vf-gallery-modal__header{
  position:sticky;
  top:0;
  z-index:5;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:18px clamp(20px,4vw,58px);
  border-bottom:1px solid rgba(13,20,17,.12);
  background:rgba(247,241,227,.94);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}

.vf-gallery-modal__eyebrow{
  margin:0 0 4px;
  color:#8a6325;
  font:800 11px/1 "Nunito",sans-serif;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.vf-gallery-modal__header h2{
  margin:0;
  color:var(--vf-popup-deep);
  font:800 clamp(24px,3vw,40px)/1 "Nunito",sans-serif;
  letter-spacing:-.035em;
}

.vf-gallery-photographer{
  display:inline-flex;
  align-items:center;
  gap:5px;
  margin-top:8px;
  color:#8a6325;
  font:800 12px/1.2 "Nunito",sans-serif;
  text-decoration:underline;
  text-decoration-color:rgba(138,99,37,.35);
  text-underline-offset:3px;
}

.vf-gallery-photographer:hover{
  color:var(--vf-popup-deep);
  text-decoration-color:currentColor;
}

.vf-gallery-modal__close{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-height:46px;
  padding:0 16px;
  border:1px solid rgba(13,20,17,.24);
  border-radius:999px;
  background:transparent;
  color:inherit;
  font:800 12px/1 "Nunito",sans-serif;
  letter-spacing:.1em;
  text-transform:uppercase;
  cursor:pointer;
}

.vf-gallery-modal__close span{
  font-size:24px;
  font-weight:400;
}

.vf-gallery-grid-view{
  padding:24px clamp(18px,4vw,58px) 64px;
}

.vf-gallery-modal__hint{
  width:min(1120px,100%);
  margin:0 auto 22px;
  color:rgba(13,20,17,.66);
  font:600 15px/1.6 "Nunito",sans-serif;
}

.vf-gallery-tour-nav{
  display:grid;
  width:min(1120px,100%);
  margin:0 auto clamp(48px,6vw,78px);
  padding:2px 0 8px;
  grid-auto-columns:minmax(132px,1fr);
  grid-auto-flow:column;
  gap:12px;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scrollbar-width:none;
}

.vf-gallery-tour-nav::-webkit-scrollbar{
  display:none;
}

.vf-gallery-tour-nav button{
  display:grid;
  min-width:0;
  gap:9px;
  padding:0;
  border:0;
  background:transparent;
  color:var(--vf-popup-deep);
  font-family:"Nunito",sans-serif;
  text-align:left;
  cursor:pointer;
}

.vf-gallery-tour-nav img{
  display:block;
  width:100%;
  aspect-ratio:1.42/1;
  object-fit:cover;
  transition:filter .2s ease,transform .22s ease;
}

.vf-gallery-tour-nav button:hover img{
  filter:brightness(.94);
  transform:scale(1.015);
}

.vf-gallery-tour-nav span{
  overflow:hidden;
  font:700 12px/1.3 "Nunito",sans-serif;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.vf-gallery-grid{
  display:block;
  width:min(1120px,100%);
  margin:0 auto;
}

.vf-gallery-chapter{
  display:grid;
  grid-template-columns:minmax(180px,.32fr) minmax(0,1fr);
  gap:clamp(34px,5vw,74px);
  align-items:start;
}

.vf-gallery-chapter + .vf-gallery-chapter{
  margin-top:clamp(62px,8vw,106px);
}

.vf-gallery-chapter h3{
  position:sticky;
  top:104px;
  margin:0;
  color:var(--vf-popup-deep);
  font:800 clamp(28px,2.4vw,38px)/1.08 "Nunito",sans-serif;
  letter-spacing:-.035em;
}

.vf-gallery-chapter__grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}

.vf-gallery-tile{
  position:relative;
  overflow:hidden;
  padding:0;
  border:0;
  background:#ded3bf;
  cursor:zoom-in;
}

.vf-gallery-tile--wide{
  grid-column:1/-1;
}

.vf-gallery-tile img{
  display:block;
  width:100%;
  height:auto;
  transition:transform .35s ease,filter .35s ease;
}

.vf-gallery-tile:hover img{
  transform:scale(1.035);
  filter:brightness(.88);
}

.vf-gallery-tile:focus-visible{
  outline:3px solid var(--vf-popup-gold);
  outline-offset:-3px;
}

.vf-gallery-viewer{
  position:relative;
  min-height:calc(100vh - 122px);
  padding:22px 78px 70px;
  background:#07120c;
  color:var(--vf-popup-cream);
}

.vf-gallery-viewer figure{
  display:grid;
  grid-template-rows:minmax(0,1fr) auto;
  place-items:center;
  gap:18px;
  min-height:calc(100vh - 220px);
  margin:0;
}

.vf-gallery-viewer img{
  display:block;
  max-width:100%;
  max-height:calc(100vh - 260px);
  width:auto;
  height:auto;
  object-fit:contain;
  box-shadow:0 22px 62px rgba(0,0,0,.38);
}

.vf-gallery-story{
  display:flex;
  align-items:baseline;
  justify-content:center;
  gap:22px;
  width:min(760px,90vw);
  color:var(--vf-popup-cream);
  text-align:center;
}

.vf-gallery-story strong{
  font:800 clamp(18px,1.6vw,23px)/1.15 "Nunito",sans-serif;
}

.vf-gallery-story__counter{
  color:#efc36b;
  font:800 10px/1 "Nunito",sans-serif;
  letter-spacing:.18em;
}

.vf-gallery-viewer__arrow{
  position:absolute;
  top:50%;
  z-index:2;
  display:grid;
  place-items:center;
  width:50px;
  height:50px;
  border:1px solid rgba(246,239,224,.34);
  border-radius:50%;
  background:rgba(7,18,12,.7);
  color:var(--vf-popup-cream);
  font-size:28px;
  cursor:pointer;
  transform:translateY(-50%);
}

.vf-gallery-viewer__arrow--previous{left:18px}
.vf-gallery-viewer__arrow--next{right:18px}

.vf-gallery-viewer__grid{
  position:absolute;
  left:50%;
  bottom:18px;
  min-height:42px;
  padding:0 18px;
  border:1px solid rgba(246,239,224,.34);
  border-radius:999px;
  background:rgba(7,18,12,.7);
  color:var(--vf-popup-cream);
  font:800 11px/1 "Nunito",sans-serif;
  letter-spacing:.1em;
  text-transform:uppercase;
  cursor:pointer;
  transform:translateX(-50%);
}

@media (max-width:820px){
  .vf-gallery-modal__panel{inset:0}
  .vf-gallery-modal__header{padding:14px 16px}
  .vf-gallery-modal__close{min-width:46px;padding:0 11px}
  .vf-gallery-modal__close strong{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .vf-gallery-grid-view{padding-inline:12px}
  .vf-gallery-tour-nav{margin-bottom:42px;grid-auto-columns:128px;gap:10px}
  .vf-gallery-tour-nav span{font-size:11px}
  .vf-gallery-chapter{grid-template-columns:minmax(0,1fr);gap:0}
  .vf-gallery-chapter + .vf-gallery-chapter{margin-top:58px}
  .vf-gallery-chapter h3{position:static;margin-bottom:16px;font-size:30px}
  .vf-gallery-chapter__grid{grid-template-columns:1fr;gap:6px}
  .vf-gallery-tile--wide{grid-column:auto}
  .vf-gallery-viewer{min-height:calc(100vh - 83px);padding:18px 12px 76px}
  .vf-gallery-viewer figure{gap:13px;min-height:calc(100vh - 190px)}
  .vf-gallery-viewer img{max-height:calc(100vh - 250px)}
  .vf-gallery-story{gap:14px;width:min(92vw,620px);padding-inline:8px}
  .vf-gallery-story strong{font-size:20px}
  .vf-gallery-viewer__arrow{top:auto;bottom:15px;width:44px;height:44px;transform:none}
  .vf-gallery-viewer__arrow--previous{left:14px}
  .vf-gallery-viewer__arrow--next{right:14px}
}

@media (prefers-reduced-motion:reduce){
  .vf-gallery-tile img,
  .vf-gallery-tour-nav img{transition:none}
}
