/* Shared spacing and typography; section spacing is applied once, in document flow. */
:root{
 --space-xs:.5rem;--space-sm:1rem;--space-md:1.5rem;--space-lg:2rem;--space-xl:3rem;
 --section-gap:clamp(3rem,6vw,6rem);
 --text-body:1rem;--text-label:.875rem;
 --text-section:clamp(2.5rem,6vw,6rem);
 --text-subheading:clamp(2rem,4vw,4rem);
 --text-card:clamp(1.5rem,2.8vw,3rem);
 --text-dialog:clamp(1.5rem,2.5vw,2rem);
}
main>section.section{padding:0}
main>section+section{margin-block-start:var(--section-gap)}
main>.section>.scene-fit{padding-block:0}
.hero-field{padding-bottom:0}
.signal-top,.section-marker.signal-top{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:var(--space-md);padding:0}
.signal-top .eyebrow,.signal-top .signal-state,.signal-top .signal-coordinate{font:400 var(--text-label)/1.5 var(--mono);letter-spacing:.06em}
.signal-state{justify-self:center;gap:var(--space-xs)}
.signal-coordinate{justify-self:end}
.portfolio-scroll>.section-marker{padding-top:0}
.signal-layout{padding:var(--space-lg) 0 0;gap:var(--space-xl)}
.signal-intro h2,.portfolio-header h2{font:700 var(--text-section)/.98 var(--display);letter-spacing:-.02em;text-transform:uppercase;text-wrap:balance;margin:0}
.signal-intro h2{margin-bottom:var(--space-md)}
.signal-intro h2>span:first-child{max-width:none}
.signal-intro h2 em{display:inline}
.signal-question{font:700 var(--text-subheading)/1.05 var(--display);margin-bottom:var(--space-lg);text-wrap:balance}
.signal-intro>p,.signal-body p{font:400 var(--text-body)/1.65 var(--body);max-width:65ch}
.signal-readout{margin-top:var(--space-lg);gap:var(--space-md)}
.signal-rule{margin-top:var(--space-sm)}
.signal-entry summary{font:500 clamp(1rem,1.5vw,1.25rem)/1.4 var(--body);padding:var(--space-md);gap:var(--space-sm)}
.signal-body{padding:0 var(--space-xl) var(--space-md)}
.signal-foot{font:400 var(--text-body)/1.65 var(--body);margin:var(--space-md) 0 0}
.portfolio-scroll>.section-marker+.portfolio-header,.portfolio-header{padding:var(--space-lg) 0;gap:var(--space-lg)}
.portfolio-tabs{gap:var(--space-md);padding-bottom:0}
.portfolio-tabs button{font:500 var(--text-label)/1.5 var(--mono);padding:var(--space-sm) 0}
.portfolio-columns,.portfolio-column{gap:var(--space-md)}
.film-title,.commercial-card .film-title{font:700 var(--text-card)/1.05 var(--display);letter-spacing:.015em;color:var(--red);text-wrap:balance}
.film-code,.film-duration,.commercial-card .film-code,.commercial-card .film-duration{font-size:.625rem;line-height:1.4;bottom:var(--space-sm)}
.film-code{left:var(--space-sm)}.film-duration{right:var(--space-sm)}
.portfolio-player h2,.portfolio-gallery h2{font:700 var(--text-dialog)/1.1 var(--display);letter-spacing:.01em;margin:0;text-wrap:balance}
.portfolio-player-bar{padding:var(--space-sm) var(--space-md);gap:var(--space-md)}
.portfolio-player-close{min-height:44px;font-size:.75rem}
.scroll-nav{font-size:.75rem}
.scroll-nav nav{gap:var(--space-lg)}
.scroll-nav .identity{font-size:.75rem}
.site-footer{max-width:var(--layout-max);margin:var(--section-gap) auto 0;padding:var(--space-md) var(--layout-gutter);display:flex;justify-content:space-between;align-items:center;gap:var(--space-md);border-top:1px solid var(--line);font:.75rem/1.5 var(--mono)}
.site-footer a{padding:var(--space-xs) 0}
@media(max-width:960px){.portfolio-header{align-items:flex-start;gap:var(--space-md)}}
@media(max-width:640px){
 .hero-copy .outline-button{display:none}
 .hero .hero-photo--video{margin-top:12px}
 .hero-photo--video .hero-video,.hero-photo--video .hero-video-poster{transform:translateY(calc(-18.0328% * var(--hero-lift,0)))}
 :root{--text-label:.75rem;--text-card:clamp(1.5rem,6.5vw,2rem)}
 .signal-top,.section-marker.signal-top{grid-template-columns:minmax(0,1fr) auto;gap:var(--space-sm)}
 .signal-top .signal-state{justify-self:end}
 .signal-coordinate{display:none}
 .signal-layout{gap:var(--space-lg)}
 .signal-body{padding:0 var(--space-md) var(--space-md)}
 .portfolio-header{gap:var(--space-sm)}
 .portfolio-tabs{gap:var(--space-sm);width:100%}
 .portfolio-tabs button{font-size:var(--text-label)}
 .portfolio-columns,.commercial-columns{grid-template-columns:1fr}
 .film-card,.commercial-card{flex-grow:0}
 .film-code,.film-duration,.commercial-card .film-code,.commercial-card .film-duration{font-size:.625rem}
 .scroll-nav nav{gap:var(--space-sm)}
 .scroll-nav,.scroll-nav .identity{font-size:.625rem}
 .site-footer{flex-wrap:wrap;font-size:.625rem}
}