@font-face { font-family: Visual; src: url('./Visual_33-100.woff') format('woff'); font-display: swap; }
@font-face { font-family: ModernGothic; src: url('./ModernGothic-Regular.woff') format('woff'); font-weight: 400; font-display: swap; }
@font-face { font-family: ModernGothic; src: url('./ModernGothic-RegularItalic.woff') format('woff'); font-style: italic; font-display: swap; }
@font-face { font-family: ModernGothic; src: url('./ModernGothic-Bold.woff') format('woff'); font-weight: 700; font-display: swap; }
:root { color-scheme: light; --ink: #000; --paper: #fff; }
* { box-sizing: border-box; }
html { min-height: 100%; background: var(--paper); }
body { margin: 0; color: var(--ink); background: var(--paper); font: 1.2rem/1.45 ModernGothic, sans-serif; }
a { color: inherit; text-decoration: none; }
a:hover { color: inherit; }
img { display: block; max-width: 100%; }
.site-header { position: absolute; z-index: 5; inset: 0 0 auto; width: 100%; height: auto; padding: 32px 0 0 16px; color: #000; font: 1em Visual, sans-serif; }
.homepage .site-header, .project-body .site-header { color: #fff; }
.legacy-nav { display: flex; align-items: center; justify-content: flex-start; height: 48px; gap: .75rem; }
.legacy-nav .wordmark { display: flex; align-items: center; height: 48px; font: 2.3rem/1 Visual, sans-serif; }
.nav-links { display: flex; gap: .9rem; font: 13px/1.4 ModernGothic, sans-serif; }
.menu-icon { display: none; }
.homepage { min-height: 100vh; overflow: hidden; background: #000; color: #fff; }
.changing-background { position: fixed; inset: 0; z-index: 0; background: center/cover no-repeat url('/files/2020-06/10000000000007530000041073c22520088a414a.jpg'); opacity: 1; transition: opacity .8s ease-in-out; }
.changing-background::after { position: absolute; inset: 0; content: ''; background: rgba(0,0,0,.04); }
.home-main { position: relative; z-index: 1; min-height: 100vh; display: flex; flex-direction: column; justify-content: center; padding: 18vh 2rem 2rem; }
.home-teaser { max-width: 75rem; }
.home-teaser h1 { margin: 0; color: #fff; font: 200 clamp(2.5rem, 7vw, 7rem)/1.08 ModernGothic, sans-serif; }
.wrap { width: min(100% - 1.8rem, 100rem); margin-inline: auto; }
.page-intro { padding: 7rem .9rem 1rem; }
.page-intro h1 { margin: 0; font-size: clamp(2.5rem, 6vw, 5rem); font-weight: 400; }
.page-intro .eyebrow { display: none; }
.project-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; }
.project-card { position: relative; min-height: 50vh; overflow: hidden; background: #000; }
.project-image { position: absolute; inset: 0; }
.project-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.project-card:hover .project-image img { transform: scale(1.03); }
.project-image img[src*="placeholder.png"] { display: none; }
.project-card > a { position: absolute; inset: 0; z-index: 1; display: flex; align-items: flex-end; padding: 1.5rem; color: #fff; }
.project-card h3 { margin: 0; font-size: clamp(1.5rem, 3vw, 3rem); font-weight: 400; text-shadow: 0 1px 10px #000; }
.project-meta { display: none; }
.projects-listing { min-height: 100vh; color: #fff; background: #000; font-size: 1rem; }
.projects-listing .site-header { position: relative; color: #fff; }
.projects-listing .legacy-nav { justify-content: flex-start; gap: .75rem; }
.projects-listing .legacy-nav .wordmark { font-size: clamp(2rem, 4vw, 4rem); }
.projects-listing .nav-links { gap: clamp(.8rem, 2vw, 2rem); font-size: clamp(.85rem, 1.25vw, 1.2rem); }
.projects-listing .projects-main { padding: 1.5rem .85rem 3rem; }
.projects-listing .projects-main h1 { margin: 0 0 1rem; font: 400 clamp(2.6rem, 4vw, 3.5rem)/1.2 ModernGothic, sans-serif; }
.project-title-list { margin: 0; padding: 0; list-style: none; }
.project-title-list li { margin: 0 0 .7rem; font: 400 clamp(1.2rem, 2vw, 2rem)/1.3 ModernGothic, sans-serif; }
.project-title-list a:hover, .project-title-list a:focus-visible { text-decoration: underline; text-underline-offset: .12em; }
.projects-listing .projects-main > ul:not(.project-title-list) { display: flex; flex-wrap: wrap; gap: 1rem; margin: 2rem 0 0; padding: 0; color: #fff; list-style: none; font-size: .9rem; }
.projects-listing .projects-main > ul:not(.project-title-list) li { margin: 0; }
.page-body { padding: 1rem .9rem 4rem; max-width: 70rem; }
.page-body p { font-size: 1.2rem; }
.page-image { width: 100%; max-height: 70vh; object-fit: cover; }
.page-with-background { background: #fff; }
.page-with-background::before { content: ''; position: fixed; inset: 0; z-index: -1; background: center/cover no-repeat var(--page-background); opacity: .16; }
.page-specific { position: relative; min-height: 100vh; overflow-x: hidden; color: #fff; background: #071019; }
.page-specific::before, .page-specific::after { position: fixed; inset: 0; content: ''; pointer-events: none; }
.page-specific::before { z-index: 0; background: center / cover no-repeat var(--page-background); }
.page-specific::after { z-index: 0; background: linear-gradient(90deg, rgba(0, 0, 0, .72) 0%, rgba(0, 0, 0, .56) 25%, rgba(0, 0, 0, .12) 63%, rgba(0, 0, 0, .12) 100%); }
.page-specific .site-header { color: #fff; }
.page-specific .legacy-nav { gap: 1rem; }
.page-specific .legacy-nav .wordmark { font-size: 3.2rem; }
.page-specific .nav-links { gap: 1.2rem; font-size: 1.1rem; }
.page-specific-main { position: relative; z-index: 1; width: min(31rem, calc(100% - 1.5rem)); padding: 6rem .65rem 2rem; }
.page-specific-main h1 { margin: 0 0 1.8rem; font: 400 clamp(3rem, 4vw, 3.5rem)/1.1 ModernGothic, sans-serif; }
.page-specific-main .page-body { padding: 0; font: 400 1.05rem/1.35 ModernGothic, sans-serif; }
.page-specific-main .page-body p { margin: 0 0 1.1rem; font-size: inherit; }
.about-copy .page-body p:last-child { line-height: 1.25; }
.about-copy .page-body strong, .contact-copy .page-body strong { font-weight: 700; }
.contact-copy { padding-top: 6rem; }
.contact-copy h1 { margin-bottom: 2rem; }
.contact-copy .page-body { font-size: .95rem; line-height: 1.3; }
.contact-copy .page-body p { margin-bottom: 1.1rem; }
.page-specific a { color: #fff; }
.page-specific a:focus-visible { text-decoration: underline; text-underline-offset: .12em; }
.contact-copy .page-body a[href^="https://"] { text-decoration: underline; text-underline-offset: .12em; }
.contact-page::after { background: linear-gradient(90deg, rgba(0, 0, 0, .48) 0%, rgba(0, 0, 0, .28) 25%, transparent 62%); }
.page-specific .site-header a { text-decoration: none; }
.project-body .wrap { width: 100%; }
.record-layout { display: block; padding: 0 0 4rem; }
.record-hero { position: relative; display: flex; align-items: flex-end; min-height: 60vh; background: #000 center/cover no-repeat; }
.record-hero h1 { width: 100%; margin: 0; padding: 0 .85rem .45rem; color: #fff; font: 400 clamp(1.8rem, 3vw, 3rem)/1.1 ModernGothic, sans-serif; text-shadow: 0 1px 10px #000; }
.record-title { padding: 5rem .85rem 1rem; font-weight: 400; }
.project-facts { padding: .65rem .75rem .8rem; font-size: .82rem; line-height: 1.3; }
.project-facts p { margin: 0; }
.project-facts strong { font-weight: 700; }
.project-content { padding: 0 .75rem; }
.project-video { width: min(100%, 50rem); margin: .1rem 0 1.5rem; }
.project-video iframe { display: block; width: 100%; aspect-ratio: 16 / 9; height: auto; }
.record-copy { max-width: 70rem; font-size: 1.1rem; }
.record-aside { padding: .9rem; }
.record-aside img { width: 100%; margin-bottom: 1rem; }
.record-aside dl { display: grid; grid-template-columns: max-content 1fr; gap: .4rem 1rem; }
.record-aside dt { font-size: .85rem; }
.record-aside dd { margin: 0; }
.site-footer { padding: 1rem; font-size: .85rem; }
@media (max-width: 700px) {
    .site-header { padding: 16px; }
    .legacy-nav { position: relative; gap: .65rem; }
    .legacy-nav .wordmark, .projects-listing .legacy-nav .wordmark, .page-specific .legacy-nav .wordmark { font-size: 48px; }
    .menu-icon { display: block; order: 0; border: 0; padding: .2rem; color: inherit; background: transparent; font: 1.5rem/1 sans-serif; cursor: pointer; }
    .menu-icon:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
    .nav-links, .projects-listing .nav-links, .page-specific .nav-links { position: absolute; top: 48px; left: 0; z-index: 10; display: none; flex-direction: column; align-items: flex-start; gap: .8rem; min-width: 10rem; padding: 1rem; color: #fff; background: #000; font-size: 13px; }
    .nav-links.is-open { display: flex; }
    .projects-listing .legacy-nav, .page-specific .legacy-nav { gap: .65rem; }
    .project-grid { grid-template-columns: 1fr; }
    .project-card { min-height: 42vh; }
    .home-main { padding-inline: 1rem; }
    .projects-listing .projects-main { padding-inline: .85rem; }
    .page-specific-main { width: min(31rem, 100%); padding: 5rem .75rem 2rem; }
    .page-specific::after { background: rgba(0, 0, 0, .52); }
    .about-page::before { background-position: 62% center; }
    .contact-page::before { background-position: center; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: .01ms !important; } }
.site-header .legacy-nav .wordmark { font-size: 48px; }
.site-header .nav-links { align-self: flex-start; gap: .9rem; padding-top: 2px; font-size: 13px; }