/* Studio, composed as an introduction, a story, evidence and a career. */
body.studio{background:var(--paper);color:var(--ink);--bg:var(--paper);--fg:var(--ink);--sub:var(--muted);--line:var(--rule);transition:none}
.studio .site-bar{background:var(--paper);color:var(--ink);transition:none}
.studio .site-name{color:var(--ink)}
.studio .site-links a{color:var(--muted)}
.studio .site-links a:hover{color:var(--ink)}
.studio main>section,.studio main>:where(.portfolio-profile)>section{max-width:none;padding:90px var(--g)}
.studio .rv{opacity:1;transform:none}
.studio .label{color:var(--muted)}
.studio h1,.studio h2{color:var(--ink)}
.studio .portfolio-hero{background:#19191b;color:#f4f2ed;padding:calc(var(--bar) + 74px) var(--g) 0;overflow:hidden}
.hero-inner{max-width:1320px;margin:auto;display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(32px,6vw,96px);align-items:center}
.portfolio-hero .eyebrow{font:500 11px/1.5 var(--sans);letter-spacing:.13em;text-transform:uppercase;color:#b8b6b2;margin:0 0 28px;display:flex;align-items:center;gap:12px}
.portfolio-hero .eyebrow::before{content:'';width:6px;height:6px;border-radius:50%;background:#ef6c5d}
.studio .portfolio-hero h1{font:400 clamp(54px,6.3vw,96px)/.98 var(--disp);letter-spacing:-.035em;color:#f4f2ed;max-width:11ch}
.portfolio-hero h1 em{color:#f08070}
.hero-deck{font:400 clamp(16px,1.35vw,19px)/1.7 var(--sans);max-width:43ch;margin:28px 0 0;color:#c1bfbc}
.hero-actions{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin:32px 0 0}
.hero-actions .btn{background:#f4f2ed;color:#19191b;padding:17px 22px;font-size:14px}
.hero-actions .text-link{color:#f4f2ed;font-size:13px}
.hero-byline{font:400 12px/1.6 var(--sans);color:#a5a39f;margin:28px 0 0}
.hero-byline b{color:#f4f2ed;font-weight:500}
.hero-cover{position:relative;background:#f8f6f0;color:#29292c;box-shadow:10px 12px 0 #ffffff08;transform:rotate(2deg);padding:24px 26px 20px;border:1px solid #efebe2;text-decoration:none;display:block;transition:transform .25s}
.hero-cover:hover{transform:rotate(0deg) translateY(-4px)}
.cover-issue{display:flex;justify-content:space-between;gap:12px;font:500 9px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid #bfbdb6;padding-bottom:13px}
.cover-title{font:400 clamp(60px,6vw,94px)/1 var(--disp);letter-spacing:-.045em;text-align:center;margin:14px 0 2px}
.cover-subtitle{text-align:center;font:400 13px/1.5 var(--serif);margin:0 0 6px}
.cover-drawing{display:block;width:100%;height:auto;aspect-ratio:1.28;overflow:visible}
.cover-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid #bfbdb6;padding-top:13px;font:500 11px/1.4 var(--sans)}
.cover-bottom span:last-child{font-size:24px;color:var(--sig)}
.hero-colophon{max-width:1320px;margin:70px auto 0;border-top:1px solid #ffffff21;display:flex;justify-content:space-between;align-items:center;gap:30px;padding:25px 0;color:#b8b6b2;font:400 12px/1.5 var(--sans)}
.hero-colophon .companies{display:flex;flex-wrap:wrap;gap:12px 25px;font:400 17px/1.4 var(--disp);color:#e3e0da}
.studio .s-story{background:var(--paper);max-width:1480px}
.section-intro{display:grid;grid-template-columns:1.2fr 1fr;gap:24px 50px;align-items:end}
.section-intro .label{grid-column:1/-1;margin:0}
.section-intro h2{font-size:clamp(42px,5.2vw,72px);max-width:15ch;line-height:1}
.section-intro>p:not(.label){font:400 17px/1.65 var(--sans);color:var(--muted);margin:0;max-width:40ch;justify-self:end}
.story-context{display:flex;justify-content:space-between;gap:20px;padding:16px 0 0;margin-top:12px;font:400 12px/1.6 var(--sans);color:var(--muted)}
.story-context p{margin:0;max-width:62ch}.story-context a{white-space:nowrap;color:var(--ink)}
.studio .s-work{background:#eeede8;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.s-work>*{max-width:1320px;margin-left:auto;margin-right:auto}
.studio .work-head h2{font-size:clamp(42px,5.2vw,72px)}
.work-head p:not(.label){font:400 17px/1.65 var(--sans);max-width:43ch}
.cards{gap:0 44px;margin-top:50px}
.card{background:transparent;border:0;border-top:1px solid #c8c7c0;padding:30px 0;gap:18px;transition:color .2s;box-shadow:none!important}
.card:hover,.card:focus-visible{transform:none;border-color:var(--ink)}
.card:hover strong{color:var(--sig)}
.card strong{max-width:24ch;font-size:clamp(26px,2.5vw,36px)}
.card .m{border:0;padding:0;gap:8px;flex-direction:column}
.card .m b{font-size:25px}.card .m i{font-family:var(--sans);font-size:14px;max-width:42ch}
.card .more{margin-top:2px}.card .label{font-size:10px}
.studio .s-career{max-width:1480px}
.career-list{list-style:none;margin:48px 0 24px;padding:0}
.career-list li{display:grid;grid-template-columns:120px minmax(170px,.8fr) minmax(0,1.5fr);gap:30px;padding:25px 0;border-top:1px solid var(--rule);align-items:baseline}
.career-list .year{font:500 12px/1.5 var(--sans);color:var(--muted)}
.career-list h3{font:400 28px/1.2 var(--disp);margin:0;color:var(--ink)}
.career-list p{font:400 15px/1.7 var(--sans);color:var(--muted);margin:0}
.career-list p b{color:var(--ink);font-weight:500;display:block;margin-bottom:4px}
.career-list li:last-child{border-bottom:1px solid var(--rule)}
.studio .s-talk{background:#19191b;min-height:0;padding-top:90px;padding-bottom:85px;color:#f4f2ed}
.studio .s-talk h2{color:#f4f2ed;font-size:clamp(56px,8vw,110px)}
.studio .s-talk .label{color:#aca9a3}
.studio .s-talk>p:not(.label){color:#c1bfbc;font-family:var(--sans);font-size:18px;max-width:48ch}
.studio .s-talk .personal{margin-top:44px!important;font-size:13px!important}
.studio .s-talk .agenda:empty{display:none}
.studio .site-foot{background:#19191b;color:#a5a39f;border-top-color:#ffffff21}
.studio .site-foot a,.studio .site-foot button{color:#b8b6b2}
.studio .case-side h2{color:var(--ink)}
.case-bar{border-radius:8px 8px 0 0}.case-scene{border-radius:0}
@media(max-width:1050px){.hero-inner{gap:36px}.studio .portfolio-hero h1{font-size:clamp(48px,6vw,76px)}.hero-cover{padding:18px}.hero-colophon{margin-top:54px}.career-list li{grid-template-columns:95px 160px 1fr;gap:20px}}
@media(max-width:760px){.studio main>section,.studio main>:where(.portfolio-profile)>section{padding:62px var(--g)}.studio .portfolio-hero{padding-top:calc(var(--bar) + 42px);padding-bottom:0}.hero-inner{grid-template-columns:1fr;gap:42px}.studio .portfolio-hero h1{font-size:clamp(55px,10.5vw,78px);max-width:12ch}.hero-deck{font-size:17px;max-width:44ch}.hero-cover{max-width:410px;width:calc(100% - 12px);margin:0 auto;padding:22px}.cover-title{font-size:78px}.cover-drawing{aspect-ratio:1.5;max-height:250px}.hero-colophon{flex-direction:column;align-items:flex-start;gap:14px;margin-top:40px;padding:24px 0}.hero-colophon .companies{gap:10px 22px;font-size:16px}.section-intro{grid-template-columns:1fr;gap:18px}.section-intro .label{margin:0}.section-intro>p:not(.label){justify-self:start;font-size:16px}.story-context{flex-direction:column;gap:8px}.cards{margin-top:34px}.career-list li{grid-template-columns:75px 1fr;gap:8px 20px}.career-list p{grid-column:2}.career-list h3{font-size:26px}.studio .s-talk>p:not(.label){font-size:16px}.talk-go{gap:20px}.s-talk .tl{font-size:10px}.studio .s-talk{padding:64px var(--g)}}
@media(max-width:380px){.studio .portfolio-hero h1{font-size:52px}.hero-actions{gap:18px}.hero-actions .btn{padding:15px 18px}.hero-cover{padding:18px}.cover-title{font-size:68px}}
