/* Estudio GOA: smaller type, contained photography and a shared studio presence. */
:root{--sans:Arial,Helvetica,sans-serif;--serif:var(--sans);--ink:#505050;--paper:#f7f7f4;--sand:#eeeeec;--accent:#e9eae6;--pad:clamp(1.25rem,4vw,4rem)}
body{font-size:15px;line-height:1.65}
h1,h2,h3{font-family:var(--sans);font-weight:400;font-style:normal;letter-spacing:-.025em}
h1 em,h2 em,h3 em{font-style:normal}
.topbar{min-height:80px;padding:.8rem var(--pad)}
.brand img{width:120px;height:38px}.brand .brand-name{font-size:12px;letter-spacing:.025em}
.topbar nav{font-size:13px;letter-spacing:.015em;text-transform:none;gap:1.6rem}
.hero{height:auto;min-height:0;max-width:1080px;width:calc(100% - 2 * var(--pad));margin:116px auto 52px;padding:0;color:var(--ink);display:grid;grid-template-columns:1fr 1fr;gap:28px 48px;align-items:center;overflow:visible}
.hero-slides{position:relative;inset:auto;grid-column:2;grid-row:1;height:430px;overflow:hidden}
.hero-slide{margin:0}.hero-shade{display:none}
.hero-copy{position:static;grid-column:1;grid-row:1}
.hero h1{font-size:clamp(36px,4vw,50px);line-height:1.12;letter-spacing:-.035em;margin:20px 0}
.hero h1 span{display:inline}.hero h1 span+span:before{content:' '}.hero h1 span:last-child{margin-left:0;font-style:normal}
.hero-specialty{font-size:16px;line-height:1.5;margin:0 0 16px;max-width:30ch}
.hero-intro{font-size:15px;line-height:1.65;margin:0;max-width:36rem}
.hero-footer{position:static;grid-column:1/-1;grid-row:2;gap:20px;font-size:12px;letter-spacing:.04em;padding-top:0}
.hero-pause{font-size:12px;border-color:var(--line);padding:.4rem .65rem}
.slide-count i{background:var(--line);width:3rem}
.eyebrow,.section-index{font-size:12px;letter-spacing:.08em}
.manifesto,.projects,.services,.publications,.ideas-section{padding:64px max(var(--pad),calc((100% - 1080px)/2))}
.manifesto{background:#eeeeec}.manifesto .section-index{margin-bottom:32px}
.manifesto-grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:56px;align-items:start}
.profile-portrait{max-width:380px;width:100%;margin:0}
.profile-portrait img{width:100%;height:auto;max-height:520px;object-fit:contain;object-position:top left}
.profile-portrait figcaption{font-size:12px;margin-top:12px;letter-spacing:.02em}
.manifesto .manifesto-copy{font-size:15px;padding-top:0;max-width:40rem}
.manifesto .manifesto-copy h2{font-size:32px;line-height:1.18;letter-spacing:-.025em;margin:0 0 20px}
.manifesto-copy .profile-statement{font:400 17px/1.5 var(--sans);max-width:36ch;margin:0 0 20px}
.manifesto-copy p{margin:0 0 16px}
.text-link{font-size:14px;margin-top:16px;gap:.5rem}
.section-index{margin-bottom:28px}
.section-heading{grid-template-columns:1fr 1.5fr;gap:32px;margin-bottom:36px;align-items:start}
.section-heading h2,.services>h2,.contact h2{font-size:32px;line-height:1.2;max-width:24ch}
.section-heading .section-index{margin:5px 0}
.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 32px;align-items:start}
.project-grid .project{margin:0;min-width:0;display:flex;flex-direction:column;align-self:stretch}
.project-grid .project-media{height:auto;aspect-ratio:4/3;max-height:none;width:100%;background:#eeeeea;overflow:hidden}
.project-grid .project-media img{width:100%;height:100%;object-fit:cover}
.project-caption{grid-template-columns:24px 1fr;gap:8px;padding-top:10px;margin-top:16px}
.project-caption h3{font-size:22px;line-height:1.3;letter-spacing:-.02em}
.project-caption span,.project-caption p{font-size:12px;letter-spacing:.04em}
.project-caption p{grid-column:2;margin-top:4px}
.project-note{margin:16px 0 0;font-size:15px;line-height:1.65;max-width:none}
.project-page-link{font-size:14px;align-self:flex-start;margin-top:auto;padding-top:20px}
.services>h2{margin-bottom:32px;max-width:28ch}.service{grid-template-columns:40px 1fr 1.2fr;gap:24px;padding:24px 0}.service h3{font-size:22px}.service p{font-size:15px;margin:0}
.publications .section-heading,.ideas-section .section-heading{grid-template-columns:1fr 1fr;margin-bottom:32px;align-items:start}
.publications .section-heading>p,.ideas-section .section-heading>p{font-size:15px;margin:0}
.collaboration-portrait{grid-template-columns:380px 1fr;gap:40px;margin-bottom:32px}
.collaboration-portrait img{height:360px;width:100%;max-height:360px;object-fit:contain;object-position:left}
.collaboration-portrait figcaption{font-size:12px}
.publication-grid h3{font-size:24px;line-height:1.3;margin:20px 0 16px;max-width:32ch}.publication-grid p{font-size:15px}.publication-type{font-size:12px}
.ideas-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 28px}.idea-card img{height:180px;aspect-ratio:4/3;object-fit:cover;margin-bottom:18px}
.idea-card h2,.idea-card h3{font:400 20px/1.35 var(--sans);letter-spacing:-.02em}.idea-card p{font-size:15px;line-height:1.65}.idea-card .section-index{font-size:11px;margin-bottom:10px}
.contact{padding-top:56px;background:var(--sand)}.contact-marquee{font-style:normal;padding:0 max(var(--pad),calc((100% - 1080px)/2))}.contact-marquee span:first-child:before{font-size:32px;font-family:var(--sans);font-style:normal;line-height:1.2}
.contact-inner{padding:40px max(var(--pad),calc((100% - 1080px)/2)) 52px}.contact h2{font-size:28px;max-width:32ch}.contact-mail{font-size:26px;font-family:var(--sans);margin-top:32px}.contact-meta{font-size:14px;margin-top:24px}
footer{font-size:12px;letter-spacing:.025em}
.detail-main{max-width:1160px;margin:auto;padding:128px 40px 56px}
.detail-main h1{font:400 clamp(32px,4vw,46px)/1.18 var(--sans);letter-spacing:-.03em;max-width:30ch}
.detail-main .detail-copy{font-size:15px;line-height:1.75;max-width:45rem;margin:28px 0 36px}
.detail-main figure img,.article-cover img{max-height:440px!important;object-fit:contain}
.detail-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;align-items:start}
.detail-gallery figure:nth-child(3n){grid-column:auto}
.detail-gallery figure img,.detail-gallery figure:nth-child(3n) img{aspect-ratio:4/3;width:100%;height:auto;max-height:400px!important;object-fit:contain;background:#eeeeea}
.detail-gallery figcaption{font-size:12px;margin:10px 0 16px}
.article-intro{font-size:17px;line-height:1.6;margin:24px 0 32px}
.article-cover{margin:28px 0 40px!important;max-width:760px}
.article-body{font-size:15px;line-height:1.8}.article-body h2,.project-related h2{font:400 26px/1.3 var(--sans)}
.article-toc{font-size:14px}.article-toc p{font-size:12px}
.article-inline-media img{max-height:360px!important;object-fit:contain}.article-inline-media figcaption{font-size:12px}
.project-related{margin-top:40px}.project-related p{font-size:15px}
@media(max-width:800px){
 .topbar{min-height:100px;gap:8px}.brand img{width:100px;height:30px}.topbar nav{font-size:13px;gap:4px 16px;line-height:1.5;flex-wrap:wrap}.topbar nav a{min-height:28px}
 .hero{margin-top:132px;grid-template-columns:1fr;gap:24px;margin-bottom:40px}.hero-copy{grid-column:1;grid-row:1}.hero-slides{grid-column:1;grid-row:2;height:300px}.hero-footer{grid-row:3;font-size:11px;gap:12px;flex-wrap:wrap}.hero h1{font-size:36px;max-width:16ch}.hero-intro{font-size:15px}.hero-specialty{font-size:15px}
 .manifesto,.projects,.services,.publications,.ideas-section{padding-top:44px;padding-bottom:44px}.manifesto-grid{gap:28px;grid-template-columns:1fr}.profile-portrait{max-width:340px;margin:auto}.profile-portrait img{max-height:440px;object-position:center}.manifesto .manifesto-copy h2{font-size:28px}
 .section-heading,.publications .section-heading,.ideas-section .section-heading{grid-template-columns:1fr;gap:16px;margin-bottom:28px}.section-heading h2,.services>h2{font-size:28px}
 .project-grid{gap:36px 24px}.project-caption h3{font-size:20px}.project-caption{grid-template-columns:20px 1fr}.project-note{font-size:15px}
 .service{grid-template-columns:24px 1fr;gap:12px}.service p{grid-column:2}.service h3{font-size:20px}
 .collaboration-portrait{grid-template-columns:1fr;gap:20px}.collaboration-portrait img{max-height:320px;height:320px}.publication-grid h3{font-size:22px}
 .ideas-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.idea-card img{height:160px}.idea-card h2,.idea-card h3{font-size:19px}
 .contact-mail{font-size:clamp(18px,5vw,26px)}.contact h2{font-size:26px}.contact-marquee span:first-child:before{font-size:28px}
 .detail-main{padding:140px var(--pad) 40px}.detail-main h1{font-size:32px}.detail-main figure img,.article-cover img{max-height:340px!important}
 .article-layout{grid-template-columns:1fr;gap:24px}.article-intro{font-size:16px}.article-body{font-size:15px}.article-body h2,.project-related h2{font-size:24px}
}
@media(max-width:700px){.project-grid,.ideas-grid,.detail-gallery{grid-template-columns:1fr}.project-grid .project-media{max-height:320px}.idea-card img{height:210px}.detail-gallery figure:nth-child(3n){grid-column:auto}.detail-gallery figure img{max-height:310px!important}.hero-slides{height:260px}.profile-portrait img{max-height:420px}}
@media(prefers-reduced-motion:reduce){.hero-slide{transform:none}.image-swap:hover img{transform:none}}

/* Section titles share the label style, with a more prominent heading size. */
.hero h1,
.manifesto .manifesto-copy h2,
.section-heading h2,
.services>h2,
.contact h2,
.article-body h2,
.project-related h2{
 font:400 22px/1.4 var(--sans);
 letter-spacing:.08em;
 text-transform:uppercase;
 max-width:none;
}
.services{background:#eeeeec}
.contact-marquee{font:400 clamp(38px,6vw,72px)/1.12 var(--sans);letter-spacing:-.025em}
.contact-marquee span:first-child:before{font-size:clamp(38px,6vw,72px);line-height:1.12}
@media(max-width:800px){
 .hero h1,
 .manifesto .manifesto-copy h2,
 .section-heading h2,
 .services>h2,
 .contact h2,
 .article-body h2,
 .project-related h2{font-size:20px}
 .contact-marquee{font-size:clamp(36px,9vw,44px)}
 .contact-marquee span:first-child:before{font-size:clamp(36px,9vw,44px)}
}

/* One framed cover: wide photography with a quiet inset introduction. */
.hero{max-width:1160px;display:grid;grid-template-columns:minmax(0,1fr);gap:0;background:#eeeeec;margin-top:112px;overflow:hidden}
.hero-slides{grid-column:1;grid-row:1;width:100%;height:520px}
.hero-slide,.hero-slide.is-active{transform:none}
.hero-copy{grid-column:1;grid-row:1;align-self:end;justify-self:start;width:min(380px,calc(100% - 48px));margin:24px;padding:24px;background:rgba(247,247,244,.96);z-index:2}
.hero-copy .eyebrow{margin:0 0 12px}
.hero h1{margin:0 0 14px}
.hero-specialty{margin:0 0 12px;font-size:15px;max-width:30ch}
.hero-intro{font-size:14px;line-height:1.65;max-width:38ch}
.hero-footer{grid-column:1;grid-row:2;padding:14px 24px;gap:18px;position:static;background:#eeeeec;color:var(--ink)}
.hero-pause{min-height:44px}
.menu-toggle{display:none}
@media(max-width:800px){
 .hero{margin-top:98px;margin-bottom:40px}
 .hero-slides{grid-column:1;grid-row:1;height:330px}
 .hero-copy{grid-column:1;grid-row:2;position:relative;inset:auto;align-self:auto;width:auto;justify-self:stretch;margin:-32px 12px 0;padding:22px 20px;background:var(--paper)}
 .hero h1{max-width:none}
 .hero-intro{max-width:none}
 .hero-footer{grid-row:3;padding:12px 20px;gap:8px 14px;flex-wrap:wrap;font-size:11px}
 .hero-footer .scroll-cue{margin-left:auto}
 /* Mobile only; reset every inherited nth-child display/alignment rule. */
 .topbar{min-height:76px;grid-template-columns:minmax(0,1fr) auto;gap:0 16px;padding:12px var(--pad);align-items:center}
 .topbar .brand{grid-column:1;grid-row:1;justify-self:start}
 .js-navigation .menu-toggle{display:inline-flex;grid-column:2;grid-row:1;align-items:center;justify-content:center;gap:12px;min-width:92px;min-height:48px;padding:8px 0 8px 12px;border:0;background:none;color:#777b69;font:400 14px/1.4 var(--sans);cursor:pointer}
 .menu-lines{display:grid;gap:6px;width:24px;color:#939683}
 .menu-lines i{display:block;height:1px;width:24px;background:currentColor;transition:transform .2s ease}
 .menu-open .menu-lines i:first-child{transform:translateY(3.5px) rotate(45deg)}
 .menu-open .menu-lines i:last-child{transform:translateY(-3.5px) rotate(-45deg)}
 .topbar nav{grid-column:1/-1;grid-row:2;display:flex;flex-direction:column;align-items:stretch;gap:0;flex-wrap:nowrap;margin-top:12px;padding:0 0 8px;width:100%;max-height:calc(100dvh - 100px);overflow:auto}
 .js-navigation .topbar:not(.menu-open) nav{display:none}
 .topbar nav a,.topbar nav a:nth-child(2){display:flex;align-items:center;justify-content:flex-start;align-self:stretch;margin:0;padding:14px 0;min-height:52px;border-top:1px solid #939683;font-size:15px;line-height:1.5;transform:none}
 .topbar nav a:last-child{border-bottom:1px solid #939683}
 .topbar nav a:after{display:none}
 .topbar.menu-open{transform:none}
}
@media(max-width:360px){
 .hero-slides{height:285px}
 .hero-copy{padding:20px 16px}
 .hero-footer{padding:10px 16px}
 .hero-footer .scroll-cue{width:100%;margin-left:0}
}
@media(prefers-reduced-motion:reduce){.menu-lines i{transition:none}}

/* A little more cover presence on desktop; mobile dimensions stay unchanged. */
@media(min-width:801px){
 .hero{max-width:none;width:calc(100% - 2 * var(--pad))}
 .hero-slides{height:580px}
 .hero-copy{width:400px;padding:28px}
}
/* Explicitly requested soft crossfade, including reduced-motion mode.
   Opacity only: no zoom, translation or other movement. */
.hero-slide,.hero-slide.is-active{
 transition:opacity 1.5s ease-in-out;animation:none;transform:none
}

/* Shared navigation labels on desktop and mobile. */
.topbar nav a,.menu-toggle{text-transform:uppercase}