/*
 * The photograph wall uses the upstream Multiverse stylesheet.
 * Javelin adds the cover hero and private-access/failure states here.
 */

[hidden] {
  display: none !important;
}

/* Let the viewport set the width, including narrow windows and split-screen. */
html, body { min-width:0; }

/* Preserves the source template's default appearance while honoring the
 * studio-wide optional image treatment when one has been configured. */
#main .thumb > .image > img {
  filter: var(--javelin-image-filter,var(--javelin-site-image-filter,var(--javelin-global-image-filter,saturate(1))));
}

.access-screen,
.fatal-state {
  align-items: center;
  background: #242629;
  color: #ffffff;
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 2em;
  position: fixed;
  text-align: left;
  z-index: 30000;
}

.access-card,
.fatal-state > div {
  max-width: 34em;
  width: 100%;
}

.access-card .form-error {
  color: #ef8f8f;
  min-height: 1.5em;
}

.fatal-state a {
  color: inherit;
}

/* Gallery cover: independent of the upstream wall and lightbox runtime. */
.gallery-hero {
  --hero-x: 50%; --hero-y: 50%;
  position: relative; isolation: isolate; display: grid; align-items: end;
  min-height: clamp(24rem, 66svh, 48rem); background: #1f2224; color: #f2f0ed;
  opacity: 1; transition: opacity 1.5s ease-in-out;
}
body.is-preload .gallery-hero { opacity: 0; }
.gallery-hero__media { position: absolute; inset: 0; overflow: hidden; z-index: -2; }
.gallery-hero__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--hero-x) var(--hero-y); }
.gallery-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(12,17,21,.62), rgba(12,17,21,.12)), linear-gradient(0deg, rgba(12,17,21,.75), transparent 85%); }
@font-face { font-family: 'EB Garamond'; font-style: normal; font-weight: 400; font-display: swap; src: url('/g/assets/fonts/eb-garamond-regular.ttf') format('truetype'); }
.gallery-hero__copy { width: 100%; max-width: 70rem; padding: clamp(2rem, 5vw, 5rem); overflow-wrap: anywhere; font-family: 'EB Garamond', Georgia, serif; }
.gallery-hero .gallery-hero__copy h1 { font-family: inherit; font-weight: 400; }
.gallery-hero__studio { margin: 0 0 1.6rem; font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: inherit; }
.gallery-hero h1 { margin: 0; max-width: 18ch; font-size: clamp(2.3rem, 5.3vw, 5.5rem); line-height: 1.05; letter-spacing: -.025em; text-transform: none; font-weight: 300; color: inherit; }
.gallery-hero__subtitle { margin: 1.3rem 0 0; max-width: 48ch; font-size: clamp(1rem, 1.5vw, 1.25rem); line-height: 1.6; }
.gallery-hero__intro { margin: 1.4rem 0 0; max-width: 62ch; line-height: 1.7; white-space: pre-wrap; }
.gallery-hero__link { display: inline-flex; gap: 2rem; align-items: center; margin-top: 2rem; padding: .8rem 0; border-bottom: 1px solid rgba(255,255,255,.55); color: inherit; font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; }
.gallery-hero__link:hover { color: white !important; border-bottom-color: white; }
.gallery-hero__link:focus-visible { outline: 2px solid white; outline-offset: 6px; }
.gallery-hero--cinematic { min-height: clamp(36rem, 99svh, 72rem); }
.gallery-hero--compact { min-height: clamp(16rem, 36svh, 28rem); }
.gallery-hero--compact .gallery-hero__copy {
  position: absolute;
  left: clamp(1rem, 2vw, 2rem);
  bottom: clamp(1rem, 2vw, 2rem);
  width: min(42rem, calc(100% - 3rem));
  padding: 0;
  text-align: left;
}
.gallery-hero--compact .gallery-hero__studio { margin-bottom: .8rem; font-size: .36rem; }
.gallery-hero--compact h1 { font-size: clamp(1rem, 2vw, 2rem); }
.gallery-hero--compact .gallery-hero__subtitle { margin-top: .65rem; font-size: clamp(.5rem, .75vw, .625rem); }
.gallery-hero--compact .gallery-hero__intro { margin-top: .7rem; font-size: .5em; }
.gallery-hero--compact .gallery-hero__link { gap: 1rem; margin-top: 1rem; padding: .4rem 0; font-size: .375rem; }
.gallery-hero--editorial { grid-template-columns: 1fr 1fr; align-items: stretch; }
.gallery-hero--editorial .gallery-hero__media { position: relative; grid-column: 2; grid-row: 1; min-height: 24rem; z-index: 0; }
.gallery-hero--editorial .gallery-hero__copy { grid-column: 1; grid-row: 1; align-self: center; }
.gallery-hero--editorial h1 { font-size: clamp(2rem, 4vw, 4.5rem); }
.gallery-hero--editorial::after, .gallery-hero--text::after { display: none; }
.gallery-hero--text { grid-template-columns: 1fr; }
.gallery-hero--text .gallery-hero__media { visibility: hidden; position: absolute; }
#main { scroll-margin-top: 1rem; }
@media (max-width: 736px) {
  .gallery-hero { min-height: 60svh; }
  .gallery-hero--cinematic { min-height: 90svh; }
  .gallery-hero__copy { padding: 2rem 1.5rem; }
  .gallery-hero--compact { min-height: 18rem; }
  .gallery-hero--editorial { grid-template-columns: 1fr; }
  .gallery-hero--editorial .gallery-hero__media { grid-column: 1; grid-row: 1; min-height: 38svh; }
  .gallery-hero--editorial .gallery-hero__copy { grid-column: 1; grid-row: 2; }
  .gallery-hero--text .gallery-hero__copy { grid-row: 1; }
  #main { scroll-margin-top: 5rem; }
}
/* Slower presentation starts immediately; image requests keep their existing timing. */
#main .thumb { transition-duration: 1.5s; }
@media (prefers-reduced-motion: reduce) {
  .gallery-hero, #main .thumb { transition: none; }
}

.gallery-hero--failed .gallery-hero__image { visibility: hidden; }

/* Optional client controls do not change Multiverse image or popup transitions. */
.gallery-controls { background:#171a1d; color:#edf0f1; padding:18px 4%; display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:12px; }
.gallery-controls > div { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.gallery-controls .collection-count { font-size:12px; letter-spacing:.08em; }
.gallery-controls button,.gallery-control-link,.photo-actions button { height:auto; line-height:1.4; padding:9px 13px; border:1px solid #ffffff45; border-radius:3px; color:#fff; font-size:11px; background:#15191dd9; box-shadow:none; }
.gallery-controls button:hover,.photo-actions button:hover { background:#343a40; }
.gallery-controls [data-controls-message] { width:100%; font-size:12px; margin:0; }
.gallery-controls [data-controls-message]:empty { display:none; }
.gallery-assist { position:relative; padding:22px 4%; background:#20252a; border-top:1px solid #ffffff24; color:#edf0f1; overflow-wrap:anywhere; }
.gallery-assist h2 { padding-right:52px; font-size:14px; margin:0 0 12px; color:inherit; }
.gallery-assist h3 { font-size:14px; margin:8px 0; color:inherit; }
.gallery-assist p { max-width:65ch; font-size:14px; margin:0 0 16px; }
.gallery-assist small { font-size:12px; }
.gallery-assist button { min-height:44px; height:auto; line-height:1.4; padding:10px 16px; color:inherit; }
.gallery-assist [data-guide-dismiss] { position:absolute; top:10px; right:12px; width:44px; padding:0; font-size:24px; }
.favorite-list-picker { display:flex; gap:10px; align-items:center; font-size:12px; }
.favorite-list-picker select { height:36px; font-size:12px; width:auto; }
#main .thumb > .photo-actions { position:absolute; right:12px; bottom:12px; z-index:3; display:flex; flex-wrap:wrap; justify-content:flex-end; max-width:calc(100% - 24px); gap:5px; opacity:0; transition:opacity .2s; }
#main .thumb:hover > .photo-actions,#main .thumb:focus-within > .photo-actions { opacity:1; }
.photo-actions [aria-pressed="true"] { color:#ffd9d9; border-color:#ffd9d9; }
.poptrox-popup .photo-actions { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; margin-top:12px; }
.gallery-dialog { width:min(520px, calc(100% - 32px)); max-height:85vh; overflow:auto; border:1px solid #50565c; border-radius:9px; padding:36px; background:#20252a; color:#f5f3ee; box-shadow:0 24px 80px #0009; }
.gallery-dialog::backdrop { background:#080b10bd; }
.gallery-dialog h2 { color:inherit; font-size:23px; padding-right:20px; }
.gallery-dialog h3 { color:inherit; }
.gallery-dialog p,.gallery-dialog label { font-size:14px; line-height:1.65; }
.gallery-dialog input,.gallery-dialog select,.gallery-dialog textarea { margin:8px 0 18px; }
.gallery-dialog button { color:inherit; }
.gallery-dialog .dialog-close { position:absolute; right:12px; top:10px; padding:0; width:32px; height:32px; line-height:1; font-size:24px; border:0; box-shadow:none; }
.gallery-dialog .control-message { margin:18px 0 0; overflow-wrap:anywhere; }
.gallery-dialog .control-message:empty { display:none; }
.gallery-dialog small { display:block; font-size:12px; margin-top:12px; color:#c5cbd0; }
.share-options { display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
.download-ready { display:block; padding:14px 18px; background:#f1eee7; color:#20252a; text-align:center; border-radius:4px; }
@media (hover:none) { #main .thumb > .photo-actions { opacity:1; } }
@media (max-width:736px) { .gallery-controls { padding:14px 18px; } .gallery-dialog { padding:28px 22px; } .gallery-controls button,.gallery-control-link { min-height:42px; display:inline-flex; align-items:center; } }
@media (prefers-reduced-motion:reduce) { #main .thumb > .photo-actions { transition:none; } }

.gallery-slideshow-stop { position:fixed; z-index:40000; right:22px; top:22px; background:#20252ae6; color:#fff; border:1px solid #ffffff70; height:auto; padding:12px 18px; line-height:1.4; }

.gallery-mobile-actions { display:none; }
@media (max-width:736px) {
  .poptrox-popup .pic img { max-height:calc(100vh - var(--gallery-lightbox-clearance, 160px)) !important; max-height:calc(100dvh - var(--gallery-lightbox-clearance, 160px)) !important; }
  body.modal-active .gallery-mobile-actions { position:fixed; left:12px; right:12px; bottom:max(14px,env(safe-area-inset-bottom)); z-index:30000; display:flex; flex-wrap:wrap; justify-content:center; gap:6px; }
  .gallery-mobile-actions button { background:#20252af2; color:#fff; border:1px solid #ffffff60; border-radius:4px; min-height:44px; height:auto; line-height:1.4; font-size:11px; padding:10px 12px; }
}

#main > .gallery-section-heading { flex: 0 0 100%; width: 100%; padding: 2.5rem 2rem 1rem; box-sizing: border-box; }
#main > .gallery-section-heading h2 { margin: 0 0 .5rem; }
#main > .gallery-section-heading p { margin: 0; max-width: 65ch; white-space: pre-line; }

.gallery-section-nav { display: flex; flex-wrap: wrap; gap: 8px 24px; padding: 18px 4%; background: #20252a; border-bottom: 1px solid #ffffff24; }
.gallery-section-nav a { color: #bfc4c8; padding: 10px 0; border: 0; border-bottom: 2px solid transparent; }
.gallery-section-nav a[aria-current="page"] { color: #fff; border-bottom-color: #54c4a7; }
.gallery-section-nav a:focus-visible { outline: 2px solid #54c4a7; outline-offset: 4px; }
.gallery-section-nav span { margin-left: 6px; opacity: .65; font-size: .8em; }

/* Keep section choices reachable in the persistent gallery navigation. */
#header { display: flex; align-items: center; gap: 20px; }
#header h1 { flex: 0 1 auto; min-width: 0; max-width: 30%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#header nav { position: static; flex: 1; min-width: 0; overflow-x: auto; }
#header nav > ul { display: flex; justify-content: flex-end; width: max-content; min-width: 100%; }
#header nav > ul > li { flex: 0 0 auto; }
#header nav > ul > li[data-section-navigation] a { padding: 0 1em; white-space: nowrap; }
#header nav a[aria-current="page"] { background: #ffffff12; box-shadow: inset 0 -3px #54c4a7; }
#header nav [data-section-navigation] span { opacity: .65; margin-left: 5px; }
@media (max-width: 736px) { #header h1 { display: none; } #header { padding: 0 10px; } }

#header { opacity: 1; visibility: visible; transition: opacity 220ms ease, visibility 0s linear; }
#header.section-nav-covered { opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 220ms ease, visibility 0s linear 220ms; }
@media (prefers-reduced-motion: reduce) {
  #header, #header.section-nav-covered { transition: none; }
}

/* Photo actions are editorial text only inside the opened lightbox. */
.poptrox-popup .photo-actions button,
.gallery-mobile-actions button { background:transparent; border:0; border-radius:0; box-shadow:none; color:#e8e4de; font-family:"Source Sans Pro", Helvetica, sans-serif; font-size:18px; font-weight:400; letter-spacing:0; text-transform:none; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:5px; height:auto; min-height:44px; line-height:1.4; padding:6px 0; }
.poptrox-popup .photo-actions button:hover,
.gallery-mobile-actions button:hover { background:transparent; color:#fff; }
.poptrox-popup .photo-actions button:focus-visible,
.gallery-mobile-actions button:focus-visible { outline:2px solid #54c4a7; outline-offset:4px; }
.poptrox-popup .photo-actions { animation: lightbox-actions-reveal 240ms ease both; }
.gallery-mobile-actions { gap:16px; }
body.modal-active .gallery-mobile-actions { animation: lightbox-actions-reveal 240ms ease both; }
@keyframes lightbox-actions-reveal { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
@media (prefers-reduced-motion:reduce) {
  .poptrox-popup .photo-actions, body.modal-active .gallery-mobile-actions { animation:none; }
}

/* Gallery refinement: preserve the Multiverse grid geometry and crop treatment. */
.gallery-hero h1, .gallery-hero__subtitle { text-wrap: balance; }
.gallery-hero__intro { max-width: 54ch; }
.gallery-delivery-summary { flex-basis:100%; margin:0; font-size:12px; line-height:1.7; color:#b5bcc1; }
.gallery-feedback { position:fixed; left:50%; bottom:calc(5rem + env(safe-area-inset-bottom)); transform:translateX(-50%); z-index:50000; max-width:calc(100% - 32px); border-radius:4px; padding:10px 16px; background:#20252af5; color:#f2f0ed; font-size:14px; box-shadow:0 4px 20px #0005; pointer-events:none; }
.gallery-feedback:empty { display:none; }
.selection-review { display:grid; gap:16px; margin:24px 0; max-height:45dvh; overflow:auto; }
.selection-review article { display:grid; grid-template-columns:80px minmax(0,1fr); gap:16px; align-items:start; }
.selection-review img { width:80px; height:80px; object-fit:contain; background:#15191d; }
.selection-review p { white-space:pre-wrap; margin:5px 0 0; }
.gallery-dialog progress { width:100%; height:6px; margin-top:16px; accent-color:#54c4a7; }
.gallery-dialog [data-download-retry] { margin-top:12px; }
.gallery-dialog .download-ready { margin-top:16px; }
.poptrox-popup .lightbox-photo-position { font-size:12px; color:#b5bcc1; letter-spacing:.12em; margin:8px 0; }
.poptrox-popup .caption { max-height:35dvh; overflow-y:auto; overflow-wrap:anywhere; }
.poptrox-popup .pic img { object-fit:contain; max-height:70dvh; }
.poptrox-popup [role="button"]:focus-visible { outline:2px solid #54c4a7; outline-offset:-4px; }
#main .thumb > .image:focus-visible { outline:2px solid #54c4a7; outline-offset:-4px; z-index:2; }
#main .thumb.photo-loading { background:#252a2e; }
.photo-load-status { position:absolute; inset:35% 16px auto; text-align:center; font-size:12px; color:#c5cbd0; pointer-events:none; }


@media (max-width:736px) {
  .gallery-dialog { padding:24px 20px; max-height:calc(100dvh - 32px); }
  .gallery-dialog button, .gallery-section-nav a, #header nav a { min-height:44px; }
  .gallery-section-nav { gap:4px 18px; }
  .gallery-mobile-actions { padding-bottom:env(safe-area-inset-bottom); }
  .poptrox-popup .photo-actions { display:none; }
  .gallery-dialog input, .gallery-dialog select, .gallery-dialog textarea { font-size:16px; }
}


/* Network loading and reveal begin per photograph, at the viewport boundary. */
#main .thumb > .image { opacity:0; transition:opacity 1.45s ease; background-image:none !important; }
#main .thumb > .image > img { display:block !important; width:100%; height:100%; object-fit:cover; }
#main .thumb.photo-revealed > .image { opacity:1; }
#main .thumb.photo-pending > h2, #main .thumb.photo-pending > .photo-actions { visibility:hidden; }
#main .thumb { transition-delay:0s !important; }
@media (prefers-reduced-motion:reduce) { #main .thumb > .image { transition:none; } }

body .gallery-hero { opacity:0; }
body .gallery-hero.is-in-view { opacity:1; }

.download-section-choices { border:0; padding:0; margin:0 0 24px; }
.download-section-choices legend { color:inherit; font-weight:600; margin-bottom:12px; }
.download-section-choices label { display:flex; align-items:center; gap:12px; min-height:48px; cursor:pointer; }
.gallery-dialog .download-section-choices input[type="checkbox"] { appearance:auto; -webkit-appearance:checkbox; opacity:1; position:static; float:none; margin:0; width:18px; height:18px; flex:0 0 18px; }
.download-section-choices small { margin:2px 0 0; }