/* akis zao — cinematic archive / image, sound, time */
:root {
  --paper: #d0c8b8; --paper-light: #e4ddcf; --ink: #171a18;
  --muted: #6e7068; --rule: rgba(23,26,24,.24); --dark: #090b0b;
  --dark-text: #dedbd0; --cyan: #b8e5e7;
  --serif: "Cormorant Garamond", Georgia, serif; --sans: "Manrope", Arial, sans-serif;
  --ease-cinema: cubic-bezier(.22,.61,.36,1);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 26px; }
body { margin: 0; background: #0b0c0b; color: var(--ink); font: 13px/1.7 var(--sans); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; transition: opacity 900ms var(--ease-cinema), color 700ms var(--ease-cinema); }
a:hover { opacity: .72; }
button { font: inherit; }
.site-header { min-height: 70px; padding: 0 5vw; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; background: var(--dark); color: var(--dark-text); }
.wordmark { font-size: 21px; letter-spacing: -.075em; font-weight: 500; }
.wordmark-dot { color: var(--cyan); }
.site-header nav { display: flex; gap: 32px; font-size: 10px; letter-spacing: .08em; }
.location { justify-self: end; font-size: 8px; letter-spacing: .16em; color: #9c9f96; }
.intro { height: min(790px, calc(100svh - 70px)); min-height: 570px; position: relative; overflow: hidden; background: #080909; color: #f0ede3; }
.hero-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 48%; filter: saturate(.82) brightness(.72); animation: image-arrive 1.5s ease-out both; }
.no-hero-image { background: radial-gradient(ellipse at 70% 45%, #25302e 0%, #111715 38%, #080909 76%); }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg,rgba(0,0,0,.52),transparent 72%),linear-gradient(0deg,rgba(0,0,0,.62),transparent 48%,rgba(0,0,0,.12)); pointer-events: none; }
.hero-content { position: absolute; left: 8.5vw; bottom: 11%; z-index: 1; }
.hero-kicker { font-size: 8px; letter-spacing: .2em; color: rgba(240,237,227,.75); margin: 0 0 12px 4px; }
h1 { font: 400 clamp(72px,12vw,172px)/.78 var(--serif); letter-spacing: -.065em; margin: 0 0 40px; }
.enter-link { display: inline-flex; gap: 35px; align-items: center; border-bottom: 1px solid rgba(240,237,227,.55); padding: 0 0 9px 3px; font-size: 10px; letter-spacing: .08em; }
.enter-link:hover { gap: 48px; }
.hero-index,.hero-side-note { position: absolute; z-index: 1; font-size: 8px; letter-spacing: .15em; color: rgba(240,237,227,.78); }
.hero-index { right: 5vw; bottom: 28px; }
.hero-side-note { right: 5vw; top: 50%; writing-mode: vertical-rl; transform: translateY(-50%); }
.section { padding: 92px 10.5vw 112px; border-top: 1px solid var(--rule); background: var(--paper); }
.section-heading { display: grid; grid-template-columns: 70px 1fr 1fr; align-items: baseline; gap: 16px; margin-bottom: 48px; }
.section-number { font-size: 9px; letter-spacing: .12em; }
.section-heading h2 { font: 400 clamp(42px,5vw,68px)/.95 var(--serif); margin: 0; letter-spacing: -.04em; }
.section-heading p { justify-self: end; font-size: 10px; color: var(--muted); margin: 0; }
.sounds-section { background: var(--dark); color: var(--dark-text); border-color: rgba(232,227,215,.2); }
.sounds-section .section-heading p { color: #9c9f96; }
.sound-item { display: grid; grid-template-columns: 126px 1fr auto; align-items: center; gap: 30px; padding: 28px 0; border-top: 1px solid rgba(232,227,215,.25); border-bottom: 1px solid rgba(232,227,215,.25); }
.sound-art { width: 126px; aspect-ratio: 1; background: #202b2a; color: var(--cyan); display: grid; place-items: center; position: relative; overflow: hidden; }
.sound-art span { font: italic 400 39px var(--serif); z-index: 1; }
.sound-art i { position: absolute; inset: 14px -18px; border: 1px solid rgba(184,229,231,.5); border-radius: 50%; transform: rotate(-28deg); }
.sound-art b { position: absolute; width: 160%; height: 1px; background: rgba(184,229,231,.4); transform: rotate(38deg); }
.sound-info .eyebrow { color: #9c9f96; margin: 0 0 2px; }
.eyebrow { font-size: 8px; letter-spacing: .17em; }
.sound-info h3 { font: 400 48px/.95 var(--serif); margin: 0 0 8px; }
.sound-info p:last-child { margin: 0; color: #9c9f96; font-size: 10px; }
.text-link { display: inline-flex; gap: 20px; align-items: center; border-bottom: 1px solid currentColor; padding-bottom: 8px; font-size: 10px; }
.bandcamp-embed { margin: 28px 0 0 156px; max-width: 680px; border-top: 1px solid rgba(232,227,215,.22); padding-top: 20px; opacity: .94; }
.embed-fallback { color: #9c9f96; font-size: 10px; margin: 0 0 12px; }
.images-section { border-color: rgba(23,26,24,.24); }
.image-grid { display: grid; grid-template-columns: .9fr 1.1fr; align-items: start; column-gap: clamp(24px,4.8vw,78px); row-gap: clamp(42px,6vw,92px); }
.image-card { margin: 0; min-width: 0; }
.image-card-large { width: 78%; }
.image-card-wide { width: 84%; margin: 95px 0 0 auto; }
.image-card-third { width: 72%; grid-column: 1 / -1; margin: 0 auto 0 11%; }
.image-card-fourth { width: 78%; grid-column: 2; margin: -20px 0 0 auto; }
.image-card-fifth { width: 70%; grid-column: 1; margin: 10px 0 0 12%; }
.image-card-sixth { width: 78%; grid-column: 2; margin: 4px 0 0 auto; }
.image-open { display: block; width: 100%; padding: 0; border: 0; position: relative; background: transparent; cursor: zoom-in; overflow: hidden; text-align: left; }
.image-open img { display: block; width: 100%; height: auto; filter: saturate(.82) contrast(.96); transition: filter 1200ms var(--ease-cinema),transform 1600ms var(--ease-cinema); }
.image-open:hover img { transform: scale(1.012); filter: saturate(.95) contrast(1.01); }
.image-index { position: absolute; left: 12px; bottom: 10px; color: #fff3db; font-size: 8px; letter-spacing: .14em; text-shadow: 0 1px 6px #000; }
.image-card figcaption { display: flex; justify-content: space-between; gap: 12px; padding-top: 11px; font-size: 9px; letter-spacing: .025em; opacity: .78; }
.image-card figcaption span + span { color: var(--muted); }
.section-note { color: var(--muted); font-size: 9px; margin: 42px 0 0; letter-spacing: .035em; }
.about-section { display: grid; grid-template-columns: 1fr 1.5fr; gap: 8%; }
.about-section .section-heading { display: block; margin: 0; }
.about-section .section-number { display: block; margin-bottom: 18px; }
.about-copy { max-width: 620px; }
.about-statement { font: 400 clamp(44px,6vw,78px)/.94 var(--serif); letter-spacing: -.04em; margin: 0 0 30px; }
.about-statement em { font-weight: 400; color: #586d6b; }
.about-copy p:last-child { max-width: 430px; font-size: 11px; color: var(--muted); }
.site-footer { display: grid; grid-template-columns: 1fr 2fr 1fr auto; gap: 20px; align-items: center; padding: 25px 5vw; background: var(--dark); color: var(--dark-text); font-size: 8px; letter-spacing: .1em; }
.site-footer > span:nth-child(2) { color: #9c9f96; }
.copyright { justify-self: end; }
.lightbox { width: min(94vw,1400px); max-width: none; max-height: 92vh; padding: 42px 0 0; border: 0; background: transparent; overflow: visible; }
.lightbox::backdrop { background: rgba(5,7,7,.96); }
.lightbox img { display: block; max-width: 100%; max-height: 82vh; margin: 0 auto; object-fit: contain; }
.lightbox-close { position: absolute; top: 0; right: 0; border: 0; color: #eee7d9; background: transparent; cursor: pointer; font-size: 10px; }
.reveal { opacity: 0; transform: translateY(14px); transition: opacity .8s ease,transform .8s ease; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
@keyframes image-arrive { from { transform: scale(1.025); opacity: .65; } to { transform: scale(1); opacity: 1; } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; } .reveal { opacity: 1; transform: none; } }
@media (max-width:760px) {
  .site-header { min-height: 64px; padding: 0 20px; grid-template-columns: 1fr auto; gap: 10px; }
  .site-header nav { grid-column: 1 / -1; grid-row: 2; padding-bottom: 13px; gap: 25px; }
  .location { grid-column: 2; grid-row: 1; font-size: 7px; }
  .intro { height: calc(84svh - 64px); min-height: 490px; max-height: 700px; }
  .hero-photo { object-position: 58% 50%; }
  .hero-shade { background: linear-gradient(90deg,rgba(0,0,0,.42),transparent 90%),linear-gradient(0deg,rgba(0,0,0,.68),transparent 56%,rgba(0,0,0,.08)); }
  .hero-content { left: 7vw; bottom: 13%; }
  h1 { font-size: clamp(76px,19vw,126px); margin-bottom: 32px; }
  .hero-side-note { right: 16px; font-size: 7px; }
  .hero-index { right: 20px; bottom: 18px; font-size: 7px; }
  .section { padding: 62px 20px 74px; }
  .section-heading { grid-template-columns: 42px 1fr; gap: 10px; margin-bottom: 32px; }
  .section-heading p { grid-column: 2; justify-self: start; margin-top: 6px; }
  .sound-item { grid-template-columns: 78px 1fr; gap: 16px; }
  .sound-art { width: 78px; }
  .sound-art span { font-size: 29px; }
  .sound-link { grid-column: 2; justify-self: start; margin-top: 2px; }
  .bandcamp-embed { margin: 24px 0 0; }
  .image-grid { grid-template-columns: 1fr; row-gap: 30px; column-gap: 0; }
  .image-card-large { width: 92%; }
  .image-card-wide { width: 84%; margin: 0 0 0 auto; }
  .image-card-third { width: 88%; margin: 0 0 0 3%; }
  .image-card-fourth { width: 82%; grid-column: 1; margin: 0 0 0 auto; }
  .image-card-fifth { width: 86%; grid-column: 1; margin: 0; }
  .image-card-sixth { width: 88%; grid-column: 1; margin: 0 0 0 auto; }
  .about-section { display: block; }
  .about-section .section-heading { margin-bottom: 32px; }
  .site-footer { grid-template-columns: 1fr 1fr; padding: 24px 20px; }
  .site-footer > span:nth-child(2) { grid-column: 1 / -1; grid-row: 2; }
  .copyright { justify-self: end; }
}

/* Accessibility and responsive refinements */
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 5px; }
.image-open:focus-visible { outline-offset: 3px; }
.site-header nav a, .enter-link, .text-link { min-height: 32px; display: inline-flex; align-items: center; }
.lightbox { overflow: auto; max-height: 100dvh; }
.lightbox-close { min-width: 64px; min-height: 40px; }
@media (max-width: 760px) {
  .site-header { padding-top: 10px; }
  .site-header nav { flex-wrap: wrap; gap: 14px 24px; }
  .site-header nav a { min-height: 40px; }
  .intro { min-height: min(490px, 75svh); }
  .hero-content { right: 22px; }
  h1 { font-size: clamp(68px, 18vw, 116px); }
  .sound-info h3 { font-size: clamp(30px, 8vw, 48px); }
  .section-heading h2 { overflow-wrap: anywhere; }
  .lightbox { width: 100vw; padding: 60px 12px 16px; }
  .lightbox-close { top: 8px; right: 12px; }
  .lightbox img { max-height: calc(100dvh - 90px); }
}

/* Seventh image completes the visual sequence without cropping original artwork. */
.image-card-seventh { grid-column: 1 / -1; width: 78%; margin: 20px auto 0; }
@media (max-width:760px) { .image-card-seventh { grid-column: 1; width: 92%; margin: 0 auto; } }

/* Gallery: preserve the source photographs and their native aspect ratios. */
.image-card[hidden] { display:none !important; }
.image-open:focus-visible,.lightbox-close:focus-visible,a:focus-visible { outline:2px solid var(--cyan);outline-offset:5px; }
@media (max-width:760px) { .image-card-seventh { grid-column:1; width:90%;margin:0 auto; } }


/* V7 — authoritative, restrained gallery direction */
:root { --archive-bg:#171d20; --archive-text:#dcd9d0; --archive-muted:#a7a9a6; --cyan:#c2b5c5; }
html,body { background:var(--archive-bg);color:var(--archive-text); }
.site-header,.site-footer,.section,.sounds-section,.images-section,.about-section {background:var(--archive-bg);background-image:none;color:var(--archive-text);}
.site-header {background:#090b0b;}
.intro {background:var(--archive-bg);}
.intro::after {content:"";position:absolute;bottom:0;left:0;right:0;height:46%;pointer-events:none;background:linear-gradient(to bottom,rgba(23,29,32,0),rgba(23,29,32,.24) 25%,rgba(23,29,32,.74) 72%,#171d20 100%);z-index:0;}
.hero-content,.hero-index,.hero-side-note {z-index:1;}
.section {border-color:rgba(220,217,208,.12);}
.section-heading h2 {font-size:clamp(38px,4.3vw,59px);font-weight:400;letter-spacing:-.035em;}
.section-heading p,.section-note,.about-copy p:last-child,.sound-info .eyebrow,.sound-info p:last-child,.sounds-section .section-heading p,.site-footer > span:nth-child(2) {color:var(--archive-muted);}
.section-number,.eyebrow,.section-heading p,.hero-kicker {letter-spacing:.15em;}
.sound-item {grid-template-columns:clamp(104px,13vw,170px) minmax(0,1fr) auto;gap:clamp(18px,3vw,42px);border-color:rgba(220,217,208,.2);}
.sound-art {width:100%;background:transparent;}
.sound-art img {display:block;width:100%;height:100%;object-fit:contain;}
.sound-info h3 {font-size:clamp(34px,4vw,52px);}
.images-section {padding:100px clamp(22px,7vw,120px) 135px;}
.image-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(34px,6vw,105px);row-gap:clamp(65px,9vw,145px);align-items:start;max-width:1120px;margin:0 auto;}
.image-grid .image-card {grid-column:auto;width:100%;max-width:none;margin:0;align-self:start;}
.image-grid .image-card:nth-child(6n+1) {width:94%;justify-self:start;}
.image-grid .image-card:nth-child(6n+2) {width:82%;justify-self:end;margin-top:64px;}
.image-grid .image-card:nth-child(6n+3) {width:88%;justify-self:end;margin-top:16px;}
.image-grid .image-card:nth-child(6n+4) {width:97%;justify-self:start;margin-top:92px;}
.image-grid .image-card:nth-child(6n+5) {width:78%;justify-self:start;margin-left:9%;margin-top:4px;}
.image-grid .image-card:nth-child(6n) {width:92%;justify-self:end;margin-top:52px;}
.image-open img {display:block;width:100%;height:auto;max-height:660px;object-fit:contain;filter:none;transition:transform 1.6s ease;}
.image-open:hover img {transform:scale(1.006);filter:none;}
.image-index,.image-card figcaption {display:none;}
.reveal {opacity:0;transform:translateY(9px);transition:opacity 1.65s cubic-bezier(.22,.61,.36,1),transform 1.65s cubic-bezier(.22,.61,.36,1);}
.reveal.is-visible {opacity:1;transform:none;}
.site-footer {border-top:1px solid rgba(220,217,208,.12);}
:focus-visible {outline:2px solid var(--cyan);outline-offset:4px;}
@media(max-width:760px) {
 .images-section {padding:68px 20px 88px;}
 .image-grid {grid-template-columns:minmax(0,1fr);gap:55px;max-width:520px;}
 .image-grid .image-card,.image-grid .image-card:nth-child(n) {grid-column:1;width:93%;max-width:100%;margin:0;}
 .image-grid .image-card:nth-child(odd) {justify-self:start;width:94%;}
 .image-grid .image-card:nth-child(even) {justify-self:end;width:87%;}
 .image-open img {max-height:none;}
 .sound-item {grid-template-columns:95px minmax(0,1fr);gap:18px;}
 .sound-link {grid-column:2;justify-self:start;}
 .section-heading h2 {font-size:clamp(40px,10vw,56px);}
}
@media(prefers-reduced-motion:reduce) {.reveal {opacity:1;transform:none;transition:none;}}

/* V9: subtle silver-gray emphasis, matching the archive palette. */
.about-statement em { color:#929a98; }


/* V10 — restrained end-of-page audio player */
.archive-audio-section { background:#171d20; color:#d9d8d2; padding-top:clamp(40px,7vw,100px); padding-bottom:clamp(60px,9vw,120px); }
.archive-audio-inner { max-width:720px; margin:0 auto; width:100%; }
.archive-audio-label { font-family:Manrope,sans-serif; font-size:10px; letter-spacing:.24em; color:#929a98; margin:0 0 24px; }
.archive-audio-header { display:flex; align-items:baseline; justify-content:space-between; gap:16px; border-bottom:1px solid rgba(217,216,210,.18); padding-bottom:15px; margin-bottom:23px; }
.archive-audio-header h2 { font-family:'Cormorant Garamond',serif; font-weight:400; font-size:clamp(30px,4vw,47px); line-height:1.1; margin:0; color:#e2dfd9; }
.archive-audio-header span { font-family:Manrope,sans-serif; font-size:11px; letter-spacing:.1em; color:#929a98; }
.archive-audio-inner audio { display:block; width:100%; max-width:100%; height:44px; color-scheme:dark; accent-color:#929a98; }
@media(max-width:760px) { .archive-audio-inner { padding:0 22px; } }