/* Reviewed archive photography, project cards, and lightweight native media. */
html:not(.js) .js-only{display:none!important}
.menu-content{grid-template-rows:minmax(0,1fr) auto auto;gap:8px}
.menu-tools{grid-row:2;display:flex;align-items:center;justify-content:center;gap:12px 28px;flex-wrap:wrap;padding-top:8px}
.nav-socials{grid-row:3;padding-top:6px}
.motion-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:4px;background:transparent;color:var(--muted);font-size:15px;line-height:1.4;font-weight:700}
.motion-button .icon{width:18px;height:18px}
.motion-button:disabled{opacity:.6;cursor:default}
.intro-actions{position:absolute;z-index:2;bottom:calc(22px + env(safe-area-inset-bottom,0px));inset-inline:0;display:flex;flex-direction:column;align-items:center;gap:7px}
.intro-actions .intro-cue{position:static;transform:none}
.intro-motion{min-height:40px;font-size:14px;border-color:transparent}
.scene-ring{width:clamp(65px,13vw,180px);aspect-ratio:1;border:1px solid currentColor;border-radius:50%;opacity:.35}
.scene-ring:after{position:absolute;inset:13px;border:1px solid currentColor;border-radius:50%;content:""}
.media-grid{--masonry-gap:28px}
.media-card{overflow:hidden;border:1px solid var(--line);border-radius:8px;background:var(--panel)}
.media-photo-link{position:relative;display:block;overflow:hidden;background:var(--panel)}
.media-photo-link img{display:block;width:100%;height:auto;transition:transform .65s var(--ease)}
.media-enlarge{position:absolute;right:14px;bottom:14px;display:grid;place-items:center;width:40px;height:40px;border:1px solid #fff8;border-radius:50%;background:#090e18c9;color:#fff;opacity:.88}
.media-enlarge .icon{width:18px;height:18px}
.media-card figcaption{padding:22px 24px 24px}
.media-card figcaption .eyebrow{display:block;font-size:13px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px}
.media-card figcaption p{font-size:19px;line-height:1.5;color:var(--cream)}
.media-filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px}
.media-filter{min-height:48px;padding:10px 18px;border:1px solid var(--line);border-radius:4px;background:transparent;color:var(--muted);font-weight:750;font-size:17px;transition:color .2s ease,border-color .2s ease,background .2s ease}
.media-filter[aria-pressed=true]{background:var(--purple);border-color:var(--purple);color:#fffff3}
.media-count{font-size:15px;margin-bottom:28px;color:var(--muted)}
.media-film{margin:0;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--panel)}
.media-film-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 28px}
.media-film-heading>span{font-size:16px;color:var(--muted)}
.media-film video{display:block;width:100%;height:auto;max-height:74vh;background:#090e18;object-fit:contain}
.media-film>figcaption{padding:22px 28px;font-size:18px;line-height:1.6;color:var(--muted)}
.project-card{overflow:hidden;border:1px solid var(--line);border-radius:8px;background:var(--panel)}
.project-mark{height:200px;position:relative;display:flex;align-items:center;padding:28px;color:var(--purple);overflow:hidden;background:linear-gradient(130deg,#601ce915,#0eb7ff0a)}
.project-mark>span{font-size:104px;font-weight:900;letter-spacing:-.08em;line-height:1;opacity:.7}
.project-mark>.sound-art{position:absolute;inset:auto -55% -22% 12%;opacity:.3;color:var(--blue)}
.project-card--1 .project-mark{height:260px;color:var(--blue);background:linear-gradient(150deg,#0eb7ff16,#601ce913)}
.project-card--2 .project-mark{height:170px;color:var(--pink);background:linear-gradient(150deg,#ff007f0d,#601ce913)}
.project-copy{padding:28px}
.project-copy>.eyebrow{font-size:14px;margin-bottom:18px}
.project-copy>h2{font-size:clamp(34px,3.2vw,46px);margin-bottom:24px}
.project-copy>p:not(.eyebrow){font-size:19px;margin-bottom:28px}
.project-copy>.button{width:100%;font-size:17px}
.project-outro{margin-top:60px;border-top:1px solid var(--line);padding-top:40px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.project-outro>p{max-width:560px}
.media-dialog{width:min(1160px,calc(100% - 40px));max-height:calc(100dvh - 32px);padding:0;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--cream)}
.media-dialog::backdrop{background:#03050bdb;backdrop-filter:blur(8px)}
.media-dialog[open]{animation:request-in .32s var(--ease) both}
.media-dialog[open]::backdrop{animation:request-backdrop-in .3s ease both}
.media-dialog-inner{position:relative;padding:60px 28px 26px}
.media-dialog-close{position:absolute;right:12px;top:8px;display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;color:var(--cream);background:var(--panel)}
.media-dialog figure{margin:0}
.media-dialog img{width:100%;height:min(70vh,900px);object-fit:contain}
.media-dialog figcaption{max-width:800px;margin:20px auto 0;font-size:19px;line-height:1.5;text-align:center;color:var(--cream)}
@media(hover:hover){.media-photo-link:hover img{transform:scale(1.025)}.media-filter:hover:not([aria-pressed=true]),.motion-button:hover:not(:disabled){color:var(--blue);border-color:var(--blue)}}
@media(max-width:800px){.menu-tools{gap:0 16px}.menu-tools .theme-preference{gap:0 12px;font-size:13px}.menu-tools [data-theme-system]{font-size:13px}.project-outro{align-items:stretch;flex-direction:column}.project-outro>.button{width:100%}}
@media(max-width:600px){.menu-tools .theme-preference>[data-theme-status]{display:none}.media-film-heading{align-items:flex-start;flex-direction:column;gap:6px;padding:20px}.media-film>figcaption{padding:20px;font-size:17px}.media-card figcaption{padding:20px}.media-filter{flex:1 1 calc(50% - 10px);font-size:16px}.media-dialog{width:calc(100% - 20px)}.media-dialog-inner{padding:56px 14px 22px}.media-dialog img{height:65vh}.media-dialog figcaption{font-size:17px}.project-copy{padding:26px}.project-mark{height:180px}.project-card--1 .project-mark{height:220px}.project-card--2 .project-mark{height:160px}}
@media(max-height:600px){.menu-tools{padding-top:0}.menu-content{padding-top:10px;padding-bottom:10px;gap:2px}.media-dialog img{height:55vh}}
@media(prefers-reduced-motion:reduce){.media-photo-link img,.media-filter{transition:none}.media-dialog[open],.media-dialog[open]::backdrop{animation:none}}
