/* The compass and top navigation scroll out of view before the fieldwork and exploration galleries. */
/* Anchor navigation retains smooth scroll with reduced motion enabled. */
html { scroll-behavior: smooth; }
body { display: block; color: #eae6db; font-family: Geist, Arial, sans-serif; }
main { width: 100%; min-width: 0; }
.nav-button { text-decoration: none; }
.top-navigation { padding-bottom: 35px; background: linear-gradient(#000 15%, transparent); }
.compass-hero { position: relative; min-height: 100vh; min-height: 100svh; display: grid; place-items: center; }
.scroll-explore { position: absolute; bottom: 28px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 20px; padding: 12px 4px; color: #b5b1a6; text-decoration: none; white-space: nowrap; font: 400 10px/1.4 "Geist Mono", monospace; letter-spacing: .12em; }
.scroll-explore span { color: #eae6db; font-size: 20px; transition: transform 200ms; }
.scroll-explore:hover span { transform: translateY(4px); }
a:focus-visible, .gallery-open:focus-visible, .gallery-viewer button:focus-visible { outline: 1px solid #ad995d; outline-offset: 6px; }
.fieldwork { box-sizing: border-box; width: 100%; max-width: 1440px; margin-inline: auto; padding: 130px clamp(24px, 7vw, 120px) 80px; scroll-margin-top: 40px; }
.fieldwork-header { padding-bottom: 90px; }
.section-index, .project-number, .gallery-note, .fieldwork-footer { font: 400 10px/1.6 "Geist Mono", monospace; letter-spacing: .06em; }
.section-index { display: flex; align-items: center; gap: 14px; color: #ad995d; margin: 0 0 28px; }
.section-index::before { content: ""; width: 6px; height: 6px; background: currentColor; }
.fieldwork h1 { font-size: clamp(54px, 11.5vw, 176px); font-weight: 300; line-height: .95; letter-spacing: -.065em; margin: 0 0 32px; }
.fieldwork-subheading { max-width: 720px; margin: 0; font-size: clamp(20px, 2.5vw, 34px); font-weight: 300; line-height: 1.4; letter-spacing: -.025em; color: #b5b1a6; }
.fieldwork-project { border-top: 1px solid #302e25; padding: 30px 0 90px; }
.project-heading { display: grid; grid-template-columns: 60px 1fr; gap: 14px; align-items: baseline; margin-bottom: 30px; }
.project-number { color: #ad995d; }
.project-heading h2 { margin: 0; font-size: clamp(25px, 3.2vw, 44px); font-weight: 300; letter-spacing: -.035em; line-height: 1.15; }
.fieldwork-gallery { min-width: 0; }
.fieldwork-gallery figure { min-width: 0; margin: 0; }
.gallery-screen { display: grid; place-items: center; width: 100%; aspect-ratio: 3 / 2; background: #080808; }
.gallery-open { display: block; position: relative; width: 100%; height: 100%; padding: 0; border: 0; background: none; color: #fff; cursor: zoom-in; overflow: hidden; }
.gallery-screen img, .gallery-screen video { display: block; width: 100%; height: 100%; max-height: 75svh; object-fit: contain; }
.gallery-open::after { content: "↗"; position: absolute; right: 16px; bottom: 14px; display: grid; place-items: center; width: 32px; height: 32px; background: #000a; font-size: 18px; }
.gallery-feature figcaption { display: flex; justify-content: space-between; align-items: start; gap: 16px; margin-top: 13px; color: #b5b1a6; font: 400 11px/1.6 "Geist Mono", monospace; }
.gallery-caption { min-width: 0; }
.gallery-position { flex: none; color: #776a43; white-space: nowrap; }
.gallery-belt { overflow-x: auto; scrollbar-width: thin; scrollbar-color: #453e2a #080808; margin-top: 20px; }
.gallery-track { display: flex; width: max-content; animation: gallery-conveyor var(--belt-duration, 30s) linear infinite; }
.gallery-group { display: flex; gap: 12px; padding-right: 12px; }
.gallery-thumb { position: relative; flex: 0 0 164px; width: 164px; height: 106px; padding: 3px; border: 1px solid transparent; background: #10100d; color: #eae6db; cursor: pointer; }
.gallery-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.gallery-thumb[aria-pressed="true"] { border-color: #ad995d; }
.gallery-thumb span { position: absolute; bottom: 7px; right: 7px; background: #000c; padding: 3px 6px; font: 400 10px/1.4 "Geist Mono", monospace; }
.gallery-thumb:focus-visible, .gallery-motion:focus-visible { outline: 1px solid #ad995d; outline-offset: -1px; }
.gallery-tools { display: flex; justify-content: flex-end; margin-top: 10px; }
.gallery-motion { padding: 7px 0 7px 14px; border: 0; background: none; color: #b5b1a6; font: 400 10px/1.4 "Geist Mono", monospace; cursor: pointer; }
.fieldwork-gallery:is(:hover, :focus-within, .is-paused, .is-offscreen) .gallery-track { animation-play-state: paused; }
.fieldwork-gallery.is-static .gallery-track, .fieldwork-gallery[data-repeat="false"] .gallery-track { animation: none; }
.fieldwork-gallery.is-static .gallery-group + .gallery-group, .fieldwork-gallery.is-static .gallery-tools { display: none; }
.fieldwork-gallery[data-repeat="false"] .gallery-group { padding-right: 0; }
@keyframes gallery-conveyor { to { transform: translateX(calc(-1 * var(--belt-distance, 50%))); } }
.gallery-note { color: #77766d; margin: 18px 0 0; }
.fieldwork-footer { border-top: 1px solid #302e25; padding-top: 25px; display: flex; justify-content: space-between; gap: 20px; color: #77766d; }
.fieldwork-footer a { color: #eae6db; text-decoration: none; }
.gallery-viewer { width: min(1200px, calc(100vw - 48px)); max-height: calc(100svh - 48px); padding: 20px; box-sizing: border-box; border: 1px solid #453e2a; background: #080808; color: #eae6db; }
.gallery-viewer::backdrop { background: #000e; }
.gallery-viewer figure { margin: 0; }
.gallery-viewer img, .gallery-viewer video { display: block; width: 100%; height: min(68svh, 800px); object-fit: contain; }
.viewer-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 15px; font: 400 11px/1.6 "Geist Mono", monospace; }
.viewer-bar button { border: 1px solid #453e2a; background: none; color: inherit; padding: 9px 14px; cursor: pointer; font: inherit; }
.viewer-controls { display: flex; gap: 8px; }
.gallery-viewer figcaption { margin-top: 16px; color: #b5b1a6; font-size: 13px; }
body:has(.gallery-viewer[open]) { overflow: hidden; }
@media (min-width: 1500px) { .fieldwork { box-sizing: border-box; } }
@media (max-width: 600px) {
  .scroll-explore { bottom: 22px; font-size: 9px; }
  .fieldwork { padding-top: 110px; }
  .fieldwork-header { padding-bottom: 60px; }
  .project-heading { grid-template-columns: 26px 1fr; gap: 10px; }
  .fieldwork-project { padding-bottom: 60px; }
  .gallery-viewer { width: calc(100vw - 24px); padding: 12px; }
  .viewer-bar { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  .scroll-explore span { transition: none; }
  .gallery-track { animation: none; }
  .gallery-group + .gallery-group, .gallery-tools { display: none; }
}

.exploration { border-top: 1px solid #302e25; }
.exploration h1 { font-size: clamp(40px, 9vw, 140px); }
.delivery-route { display: block; margin-top: 10px; line-height: 1.7; }

.gallery-caption strong { display: block; font: 300 clamp(20px, 2vw, 28px)/1.3 Geist, Arial, sans-serif; color: #eae6db; letter-spacing: -.025em; }
.photo-location { display: flex; align-items: center; gap: 8px; margin-top: 10px; color: #ad995d; }
.photo-location svg { flex: none; }
