/* Shared editorial scale: Services establishes spacing, type and quiet motion. */
:root{
 --editorial-space:clamp(24px,2.2vw,40px);
 --editorial-section:clamp(48px,5.5vw,88px);
 --editorial-heading:clamp(2.5rem,5.2vw,5.5rem);
 --editorial-body:clamp(1rem,1.15vw,1.125rem);
 --editorial-meta:.75rem;
}
.services.services-editorial,.cases.cases-editorial,.about,.contact{padding-top:32px;padding-bottom:var(--editorial-section)}
.contact{padding-bottom:0}
.section-kicker{padding-bottom:24px;font-size:var(--editorial-meta);line-height:1.4}
.cases-editorial .cases-heading,.contact-heading{margin-block:var(--editorial-section) var(--editorial-space);align-items:start}
.cases-heading h2,.about-copy h2,.contact-heading h2{
 font:400 var(--editorial-heading)/1.02 var(--sans);letter-spacing:-.055em;
}
.cases-heading>p,.about-description p,.service-card .service-story p,.case-story p{
 font:400 var(--editorial-body)/1.5 var(--sans);letter-spacing:-.02em;
}
.cases-heading>p{max-width:30ch;padding:0}
.case-story,.service-card .service-story{padding:24px;gap:24px}
.case-story p,.service-card .service-story p{max-width:36ch}
.case-story>a,.service-card .service-story a,.text-link{font:400 1rem/1.4 var(--sans);letter-spacing:-.02em;min-height:44px}
.cases-editorial .case-video-preview h3{font-size:clamp(1.875rem,2.8vw,3rem);line-height:1.02;letter-spacing:-.055em}
.about-layout{padding-top:var(--editorial-section);gap:var(--editorial-section);align-items:start}
.about-description{margin-top:32px;max-width:44ch}
.about-bottom{margin-top:var(--editorial-section);padding-top:24px}
.contact-bar{padding-bottom:var(--editorial-section);gap:24px}
.contact-email{font-size:clamp(1rem,1.7vw,1.5rem);letter-spacing:-.025em}
.cases-editorial .cases-footnote{margin-top:32px;padding-top:24px}
.cases-editorial .cases-footnote>a{font-size:1rem;line-height:1.4}
/* Feedback is local: imagery holds its composition, controls retain tactility. */
.cases .case-video-preview>img{transition:opacity .22s ease;transform:none!important}
.service-story a:hover,.text-link:hover{gap:16px}
.service-story a,.text-link{column-gap:16px}
.case-story>a>span,.service-story a>span,.text-link>span{transition:translate .2s ease,transform .2s ease}
@media(max-width:800px){
 .about-layout{grid-template-columns:1fr;gap:40px}
 .brand-poster{justify-self:start;max-width:440px}
 .cases-heading{flex-wrap:wrap;gap:24px}
 .cases-heading>p{margin:0;max-width:40ch}
}
@media(max-width:600px){
 .services.services-editorial,.cases.cases-editorial,.about,.contact{padding-top:24px}
 .case-story,.service-card .service-story{padding:20px;gap:20px}
 .contact-bar{gap:20px}
}

/* Sound Cases: a quiet listening desk set into the studio's dark backdrop. */
.portfolio-page{background:var(--ink);color:var(--paper);font:400 1rem/1.5 var(--sans)}
.portfolio-header{margin:24px var(--gutter) 0;padding:0 0 24px;background:none;border:0;border-bottom:1px solid #e9e6df33;border-radius:0;color:var(--paper)}
.portfolio-brand img{filter:brightness(0) invert(1)}
.portfolio-brand small{color:#c2b7ad;font-family:var(--mono);font-size:var(--editorial-meta)}
.portfolio-location{color:#c2b7ad;font-size:var(--editorial-meta)}
.home-key{background:transparent;border:1px solid #e9e6df55;border-radius:0;box-shadow:none;min-height:44px;font-size:.875rem}
.home-key:hover{color:var(--ink);border-color:var(--pink)}
.portfolio-main{padding-top:32px}
.portfolio-kicker{padding-bottom:24px;font-size:var(--editorial-meta)}
.deck-label{color:var(--ink);background:var(--paper);padding:16px 24px;border-color:#b8b3a8;border-radius:3px 3px 0 0;font-size:var(--editorial-meta)}
.portfolio-page .portfolio-layout{color:var(--ink);background:var(--paper);border:1px solid #b8b3a8;border-top:0;border-bottom-width:1px;border-radius:0 0 3px 3px;box-shadow:none;grid-template-columns:minmax(0,1fr) 288px}
.portfolio-page .case-viewer{padding:24px;border-right:1px solid var(--line)}
.portfolio-page .screen-shell{border-radius:2px;padding:8px;box-shadow:none}
.screen-toolbar{padding:8px 8px 12px;font-size:var(--editorial-meta)}
.deck-transport{padding-top:16px}
.transport-row{margin-top:12px;gap:16px}
.portfolio-page .case-title-panel{display:grid;grid-template-columns:40px minmax(0,1fr) minmax(0,1.05fr);gap:20px;align-items:start;background:transparent;border-top:1px solid var(--line);margin:24px 0 0;padding:28px 0 8px;min-height:0}
.portfolio-page .case-number{display:block;padding-top:5px;font:400 .875rem/1 var(--mono);letter-spacing:0;color:#6b6157}
.portfolio-page .case-number::after{content:'';display:block;width:24px;height:4px;background:var(--pink);margin-top:16px}
.case-eyebrow{font:400 var(--editorial-meta)/1.4 var(--mono);letter-spacing:.025em;color:#6b6157;margin-bottom:12px}
.portfolio-page .case-title-panel h1{font:400 clamp(1.625rem,2.25vw,2.625rem)/1.07 var(--sans);letter-spacing:-.055em;text-wrap:initial;overflow-wrap:break-word}
.portfolio-page .case-description{font:400 1rem/1.5 var(--sans);letter-spacing:-.02em;max-width:44ch;margin:0;padding-top:2px}
.portfolio-page .case-index{background:#dedad2;padding:24px 16px 0}
.index-heading{padding:0 0 20px;align-items:start}
.index-heading h2{font:400 1.125rem/1.15 var(--sans);letter-spacing:-.035em;max-width:12ch}
.index-heading>span{font-size:var(--editorial-meta);padding-top:2px}
.portfolio-page .case-index-link{grid-template-columns:22px 48px minmax(0,1fr);padding:12px 8px;gap:8px;border-left:3px solid transparent}
.case-index-link[aria-current=true]{border-left-color:var(--pink);background:var(--ink);color:var(--paper)}
.case-index-link[aria-current=true] small{color:#cfc3b8}
.case-index-link:not([aria-current=true]):hover{background:#d0cabf}
.case-index-link[aria-current=true]:hover{background:#45392f}
.index-home{padding:20px 0;margin-top:16px;font-size:.875rem}
.portfolio-footer{padding-block:24px;border-color:#e9e6df33;margin-top:32px;align-items:center;font-size:var(--editorial-meta)}
.portfolio-footer a:hover{color:var(--pink)}
.video-cover:hover .play-disc{transform:scale(1.035)}
@media(min-width:1600px){.portfolio-page .portfolio-layout{grid-template-columns:minmax(0,1fr) 320px}}
@media(max-width:1200px){
 .portfolio-page .case-title-panel{grid-template-columns:32px minmax(0,1fr);gap:16px}
 .portfolio-page .case-description{grid-column:2;max-width:54ch}
}
@media(max-width:1000px){
 .portfolio-page .portfolio-layout{grid-template-columns:1fr}
 .portfolio-page .case-viewer{border-right:0}
 .portfolio-page .case-index{padding:24px;border-top:1px solid var(--line)}
 .portfolio-page .case-index-link{grid-template-columns:26px 68px minmax(0,1fr)}
 .index-heading h2{max-width:none}
}
@media(max-width:600px){
 .portfolio-header{margin-top:16px;padding-bottom:20px;gap:12px}
 .portfolio-brand>span{font-size:12px}.portfolio-brand small{display:none}
 .home-key{gap:8px;padding:8px 10px}
 .portfolio-main{padding-top:24px}
 .portfolio-page .case-viewer{padding:12px}
 .deck-label{padding:16px 12px}
 .portfolio-page .case-title-panel{margin:20px 0 0;padding:20px 4px 8px;grid-template-columns:24px minmax(0,1fr);gap:12px}
 .portfolio-page .case-title-panel h1{font-size:1.75rem}
 .portfolio-page .case-description{padding:0;margin-top:4px}
 .portfolio-page .deck-transport{padding:12px 0 0}
 .portfolio-page .case-index{padding:20px 12px}
 .portfolio-footer{margin-top:24px;gap:16px}
}
@media(prefers-reduced-motion:reduce){.case-story>a>span,.service-story a>span,.text-link>span{transition:none}}
/* Keep the transport accessible in the browser's native fullscreen layer. */
.portfolio-page .case-viewer:fullscreen{border:0;background:var(--ink);color:var(--paper)}
.portfolio-page .case-viewer:fullscreen .case-title-panel{display:none}

.skip-link:not(:focus){clip-path:inset(50%);width:1px;height:1px;overflow:hidden;white-space:nowrap;padding:0}

/* Official client marks share one ink and optical scale; no decorative motion. */
.client-roster{margin-top:var(--editorial-section);border-top:1px solid var(--line);padding-top:32px}
.client-roster-heading{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:24px}
.client-roster-heading h3{font:400 clamp(1.5rem,2.5vw,2.25rem)/1.1 var(--sans);letter-spacing:-.045em}
.client-roster-heading p{font:400 .75rem/1.4 var(--mono);letter-spacing:.025em}
.client-grid{display:flex;flex-wrap:wrap;justify-content:center;list-style:none;margin:0;padding:0}
.client-grid li{flex:0 0 16.666667%;min-width:0;min-height:136px;display:flex;align-items:center;justify-content:center;padding:28px 20px}
.client-logo{display:block;width:var(--logo-width);height:var(--logo-height);max-width:100%;background:var(--ink);-webkit-mask:var(--logo) center/contain no-repeat;mask:var(--logo) center/contain no-repeat}
@media(max-width:1000px){.client-grid li{flex-basis:25%;min-height:124px}}
@media(max-width:600px){
 .client-roster{padding-top:24px}
 .client-roster-heading{flex-direction:column;gap:12px;margin-bottom:16px}
 .client-grid li{flex-basis:50%;padding:20px 16px;min-height:108px}
 .client-logo{height:calc(var(--logo-height)*.85)}
}
@media(max-width:380px){.client-grid li{flex-basis:50%}}
