/* Shared type roles for the homepage and every project template. Artwork is excluded. */
:root{--body:'DM Sans',Arial,Helvetica,sans-serif;--display:'Anton',Impact,'Arial Narrow',sans-serif;--type-brand:18px;--type-copy:16px;--type-label:11px;--type-caption:12px}
body,button,input,select,textarea{font-family:var(--body)}
.site-header .brand-name,.case-nav .case-brand,.detail-header .detail-brand{font-family:var(--body);font-size:var(--type-brand);font-weight:700;line-height:1.2;letter-spacing:-.045em;text-transform:none;white-space:nowrap}
.site-header .brand{flex:none}.detail-header .detail-brand{flex:0 0 auto}
.desktop-nav a,.nav-contact,.nav-back,.detail-back{font-family:var(--body);font-size:14px;font-weight:600;line-height:1.4;letter-spacing:0;text-transform:none}
.project-info h3,.play-caption h3,.case-lead h1,.detail-title,.details-body h2,.case-gallery h2,.detail-gallery h2,.next-project h2,.detail-next h2{font-family:var(--display);font-weight:400}
.case-lead h1,.detail-title{font-size:clamp(80px,14vw,220px);line-height:.98;letter-spacing:-.035em;text-transform:uppercase}
.case-layout-characters .case-lead h1{font-size:clamp(70px,12.5vw,205px)}
.work .section-title-row p,.project-info p,.playground-intro p,.about-content>p,.expertise-title p,.expertise-item p,.details-body>p,.case-story p{font-size:var(--type-copy);line-height:1.7;font-weight:400;letter-spacing:0}
.lead-bottom p,.detail-lede p{font-size:clamp(20px,2.2vw,30px);line-height:1.45;letter-spacing:-.025em;font-weight:400}
.section-meta,.project-number,.hero-bottom,.play-caption>span:first-child,.playground-footnote,.contact-topline,.contact-main>p,.case-eyebrow,.nav-center,.details-label,.gallery-heading>span,.detail-meta,.detail-header-meta,.detail-lede-note,.detail-next-overline{font-family:var(--body);font-size:var(--type-label);font-weight:700;line-height:1.5;letter-spacing:.09em}
.gallery-piece figcaption,.case-cover figcaption,.art-card figcaption,.video-card figcaption,.planet-feature-caption{font-family:var(--body);font-size:var(--type-caption);line-height:1.6;letter-spacing:0;font-weight:500}
.gallery-piece figcaption>span:first-child,.case-cover figcaption>span:first-child,.art-card figcaption>span:first-child,.video-card figcaption>span:first-child{font-size:var(--type-label);font-weight:700;letter-spacing:.07em}
.gallery-piece figcaption>span:last-child,.case-layout-mobile .gallery-piece figcaption{font-size:var(--type-caption)}
.work-footnote,.case-note{font-size:var(--type-caption);line-height:1.7}
.case-story h3{font-family:var(--body);font-size:13px;line-height:1.5;font-weight:700;letter-spacing:.07em}
.project-open,.project-open:not(:has(.arrow-only)),.play-link,.next-project>a{font-family:var(--body);font-size:12px;font-weight:700;line-height:1.5;letter-spacing:.03em}
.footer,.case-footer,.detail-footer{font-family:var(--body);font-size:11px;line-height:1.5;letter-spacing:.04em}
.footer .footer-brand,.case-footer>a:first-child,.detail-footer>a:first-child{font-family:var(--body);font-size:var(--type-brand);font-weight:700;line-height:1.2;letter-spacing:-.045em}
/* Complete long screenshots remain readable when opened in their case study. */
.case-cover-stay>.artwork-link{max-width:1100px}.case-cover-stay>.artwork-link>img{max-height:none;width:100%;height:auto;object-fit:contain}
@media(max-width:800px){.case-lead h1,.detail-title{font-size:clamp(68px,15vw,140px)}.case-layout-characters .case-lead h1{font-size:clamp(62px,13vw,120px)}}
@media(max-width:600px){.case-lead h1,.detail-title{font-size:clamp(62px,16.5vw,100px)}.case-layout-characters .case-lead h1{font-size:15.5vw}.nav-back,.detail-back{font-size:12px}.theme-nav-actions{gap:12px}.case-nav .theme-toggle{min-width:36px;padding:8px}.case-nav .theme-toggle-label{display:none}.case-nav{padding-left:20px;padding-right:20px;gap:12px}.detail-header{padding-left:20px;padding-right:20px;gap:12px}.detail-header .theme-toggle-label{display:none}.detail-header .theme-toggle{min-width:36px;padding:8px}.detail-back span{margin-right:5px}.hero-bottom{font-size:10px}.contact-topline{font-size:10px}.case-eyebrow{font-size:10px}.case-footer,.detail-footer{font-size:11px}}
@media(max-width:400px){.site-header .brand-name{font-size:var(--type-brand)}.site-header .motion-toggle{width:32px;height:36px;justify-content:center;padding:8px}.site-header .motion-toggle>span:not(.motion-toggle-dot){display:none}.site-header{gap:10px}.case-nav,.detail-header{padding-left:16px;padding-right:16px;gap:10px}.theme-nav-actions{gap:10px}.detail-back{font-size:11px}}
/* Anton's inherited italic tracking previously crushed these two headings. */
.about-content h2,.expertise-title h2{line-height:1.12;letter-spacing:0;overflow-wrap:normal}
.about-content h2 em,.expertise-title h2 em{font-style:normal;letter-spacing:inherit;line-height:inherit}
.about-content,.expertise-title h2{min-width:0}
.about-content h2{font-size:clamp(46px,4.6vw,82px)}
.expertise-title h2{font-size:clamp(58px,7vw,118px);flex:1}
.expertise-title p{flex:0 1 320px}
@media(max-width:800px){.about-content h2{font-size:clamp(42px,8vw,64px)}.expertise-title h2{font-size:clamp(46px,8.5vw,80px)}}

/* Portrait uses the supplied monochrome image with no filters or retouching. */
.about-identity.about-portrait{min-height:0;height:auto;display:block;align-self:start;padding:0;overflow:hidden;background:transparent;border:0;aspect-ratio:1122/1402}
.about-portrait>img{display:block;width:100%;height:auto;filter:none;transform:none}
/* The updated Stay homepage uses a high-resolution export. */
.case-cover-stay>.artwork-link{max-width:1100px}
.case-cover-stay>.artwork-link>img{width:100%;height:auto;max-height:none}
/* Keep the project thumbnail sharp while the surrounding reveal fades in. */
.motion-on.js-enabled .portfolio-project{filter:none}

/* Align the desktop portrait with the complete adjacent About content. */
@media(min-width:801px){
 .about-grid{align-items:stretch}
 .about-identity.about-portrait{position:relative;align-self:stretch;aspect-ratio:auto;height:auto;min-height:0}
 .about-portrait>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 42%}
}
/* Homepage cover crops only; full compositions stay inside the case studies. */
.project .work-art.project-cover-crop{display:block;padding:0;overflow:hidden;isolation:isolate}
.project .work-art.project-cover-crop>img{display:block;width:100%;height:100%;max-height:none;object-fit:cover;object-position:50% 50%;margin:0}
.project[data-project="stay"] .project-cover-crop>img{object-position:50% 0%}
.project[data-project="treasury"] .project-cover-crop>img{object-position:50% 43%}
.project[data-project="heritage"] .project-cover-crop>img{object-position:50% 55%}
/* Isolate Stay's first hero panel so no partial next-section text enters the crop. */
.project[data-project="stay"] .project-cover-crop{position:relative;container-type:size}
.project[data-project="stay"] .project-cover-crop>img{position:absolute;top:0;left:50%;width:max(100%,155cqh);height:auto;max-width:none;transform:translateX(-50%)!important}

/* Use each supplied cover composition as one complete, edge-to-edge image. */
.project .work-art.curated-cover{display:block;padding:0;height:auto;aspect-ratio:7416/4857;overflow:hidden}
.project .work-art.curated-cover>img{display:block;width:100%;height:100%;max-height:none;object-fit:contain;object-position:center;margin:0}

.contact-email-options{display:flex;align-items:center;flex-wrap:wrap;gap:12px 18px;flex-basis:100%;font:500 12px/1.6 var(--body);color:var(--ui-copy);letter-spacing:0}
#contact-email-address{user-select:all;overflow-wrap:anywhere}
.contact-email-options a,.contact-email-options button{font:inherit;color:var(--ui-ink);text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.contact-email-options button{padding:0;border:0;background:none}
.contact-email-options a:focus-visible,.contact-email-options button:focus-visible{outline:2px solid var(--ui-focus);outline-offset:5px}
.contact-email-options .email-copy-status{flex-basis:100%;font:inherit;color:var(--ui-copy)}
.contact-email-options .email-copy-status:empty{display:none}
