@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500&family=Instrument+Serif:ital@0;1&display=swap');
:root{--ink:#171716;--paper:#f4f3ef;--muted:#77756e;--line:#c9c6bd;--accent:#2547f5;--header:88px;--gutter:5.8vw}*{box-sizing:border-box}html{scroll-behavior:smooth;}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif;font-weight:300}a{color:inherit;text-decoration:none}img{display:block}.site-header{height:var(--header);display:flex;align-items:center;justify-content:space-between;padding:0 var(--gutter);border-bottom:1px solid var(--line);position:sticky;top:0;background:color-mix(in srgb,var(--paper) 94%,transparent);backdrop-filter:blur(12px);z-index:10}.brand{display:flex;align-items:center;gap:10px;font-weight:500;letter-spacing:.18em;font-size:.74rem}.brand-mark{display:block;width:26px;height:42px;position:relative;overflow:hidden}.brand-mark img{position:absolute;width:70px;height:70px;max-width:none;left:-22px;top:-14px}.brand span:last-child{display:flex;flex-direction:column;line-height:1}.brand small{font-size:.48rem;color:var(--muted);letter-spacing:.28em;margin-top:5px}.site-header nav{display:flex;align-items:center;gap:28px;font-size:.71rem;text-transform:uppercase;letter-spacing:.11em}.nav-cta{border:1px solid var(--ink);border-radius:100px;padding:11px 17px}.menu-button{display:none;background:none;border:0;font:inherit;text-transform:uppercase;letter-spacing:.1em}.section-rail{position:fixed;z-index:8;right:1.6vw;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:11px;font-size:.6rem;text-transform:uppercase;letter-spacing:.12em}.section-rail a{display:flex;align-items:center;justify-content:flex-end;gap:8px;color:var(--muted)}.section-rail a span{width:5px;height:5px;background:currentColor;border-radius:50%;font-size:0}.section-rail a[aria-current="true"]{color:var(--ink)}body[data-rail-theme="dark"] .section-rail a{color:#aaa}body[data-rail-theme="dark"] .section-rail a[aria-current="true"]{color:#fff}.section-rail a[aria-current="true"] span{width:18px;border-radius:0}.section-anchor,.project{scroll-margin-top:var(--header);scroll-snap-align:start;scroll-snap-stop:normal}.hero{min-height:calc(100svh - var(--header));display:grid;grid-template-columns:minmax(320px,.78fr) minmax(0,1.22fr);gap:clamp(2rem,5vw,8rem);padding:clamp(2.4rem,4.5vw,5rem) calc(var(--gutter) + 3vw) clamp(2rem,4vw,4rem) var(--gutter)}.hero-copy{display:flex;flex-direction:column;align-items:flex-start}.eyebrow{text-transform:uppercase;letter-spacing:.15em;font-size:.66rem;font-weight:500;margin:0}.hero h1,.section-heading h2,.services-intro h2,.studio h2{font-family:'Instrument Serif',serif;font-weight:400;line-height:.91;letter-spacing:-.035em}.hero h1{font-size:clamp(4.1rem,7.1vw,8.3rem);margin:auto 0 2rem}.intro{font-size:1rem;line-height:1.55;max-width:400px;margin:0 0 2rem}.text-link{font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;padding-bottom:8px;border-bottom:1px solid}.text-link span{margin-left:22px}.media-frame{margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.media-frame>img{width:auto;max-width:100%;height:auto;max-height:calc(100svh - var(--header) - clamp(5.5rem,9vw,10rem));object-fit:contain}.media-frame figcaption{position:static;width:100%;display:flex;justify-content:space-between;color:var(--muted);padding:11px 0 0;font-size:.65rem;text-transform:uppercase;letter-spacing:.12em;background:none}.services-section,.studio{padding:clamp(5rem,10vw,11rem) calc(var(--gutter) + 3vw) clamp(5rem,8vw,9rem) var(--gutter)}.services-intro{display:grid;grid-template-columns:1.6fr .7fr;gap:7vw;align-items:end;padding:clamp(3rem,6vw,7rem) 0;border-bottom:1px solid var(--line)}.services-intro h2{font-size:clamp(3.6rem,6.5vw,7.4rem);margin:0}.services-intro p{line-height:1.6;margin:0;max-width:380px}.services{list-style:none;padding:0;margin:0}.services li{display:grid;grid-template-columns:70px minmax(180px,.9fr) 1fr;gap:2rem;border-bottom:1px solid var(--line);padding:clamp(1.4rem,2.6vw,2.4rem) 0;align-items:baseline}.services span{font-size:.67rem;color:var(--muted)}.services strong{font-family:'Instrument Serif';font-size:clamp(1.8rem,3.1vw,3.4rem);font-weight:400}.services p{margin:0;line-height:1.55;max-width:390px}.work{padding:clamp(5rem,10vw,11rem) calc(var(--gutter) + 3vw) clamp(5rem,8vw,9rem) var(--gutter);background:var(--ink);color:var(--paper)}.section-heading{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:clamp(3rem,7vw,8rem)}.section-heading h2{font-size:clamp(3.6rem,6.5vw,7.5rem);margin:0;width:62%}.project+.project{margin-top:clamp(4.5rem,8vw,9rem)}.project-frame{height:calc(100svh - var(--header) - clamp(5rem,10vw,11rem));min-height:360px;display:flex;align-items:center;justify-content:center;margin:0}.project-frame img{width:auto;max-width:100%;height:auto;max-height:100%;object-fit:contain}.project-meta{display:grid;grid-template-columns:1fr 1fr auto;align-items:baseline;border-top:1px solid #55554f;padding-top:14px;margin-top:14px}.project-meta h3{font-family:'Instrument Serif';font-size:1.65rem;font-weight:400;margin:0}.project-meta p,.project-meta span{font-size:.67rem;text-transform:uppercase;letter-spacing:.1em;color:#afafa7}.studio-copy{display:grid;grid-template-columns:1.55fr .7fr;gap:8vw;border-bottom:1px solid var(--line);padding:clamp(3rem,6vw,7rem) 0}.studio h2{font-size:clamp(3.4rem,6vw,7rem);margin:0}.studio-copy>div{line-height:1.7;padding-top:1rem}.contact{padding:clamp(5rem,10vw,11rem) calc(var(--gutter) + 3vw) clamp(3rem,5vw,6rem) var(--gutter);background:var(--accent);color:#fff}.contact>a{font-family:'Instrument Serif';font-size:clamp(3.8rem,9vw,10rem);line-height:.9;letter-spacing:-.04em;border-bottom:2px solid;display:flex;justify-content:space-between;padding-bottom:2vw;margin-top:clamp(3rem,6vw,7rem)}.contact>a span{font-size:.45em}.contact-details{display:flex;justify-content:space-between;margin-top:5vw;line-height:1.6;font-size:.88rem}footer{padding:28px var(--gutter);display:flex;justify-content:space-between;font-size:.67rem;text-transform:uppercase;letter-spacing:.11em}footer div{display:flex;gap:20px}.reveal{opacity:0;transform:translateY(25px);transition:.8s ease}.reveal.visible{opacity:1;transform:none}@media(max-width:850px){:root{--header:76px;--gutter:6vw}.site-header nav{display:none;position:absolute;top:var(--header);left:0;right:0;background:var(--paper);padding:26px var(--gutter);flex-direction:column;align-items:flex-start;border-bottom:1px solid var(--line)}.site-header nav.open{display:flex}.menu-button{display:block}.section-rail{right:var(--gutter);top:auto;bottom:14px;transform:none;display:flex;flex-direction:row;padding:7px 9px;background:color-mix(in srgb,var(--paper) 90%,transparent);border:1px solid var(--line);backdrop-filter:blur(10px)}.section-rail a{gap:0}.section-rail a:not([aria-current="true"]){display:none}.section-rail a span{width:18px;height:2px;border-radius:0}.hero{display:flex;flex-direction:column;min-height:auto;gap:2rem;padding:3rem var(--gutter)}.hero-copy{min-height:470px}.hero h1{font-size:clamp(3.8rem,16vw,6.3rem)}.media-frame>img{height:min(62svh,680px)}.services-section,.studio{padding:5rem var(--gutter)}.services-intro,.studio-copy{display:block}.services-intro p,.studio-copy>div{margin-top:28px}.services li{grid-template-columns:36px 1fr;gap:.7rem 1.3rem}.services li p{grid-column:2}.work{padding:5rem var(--gutter)}.section-heading{display:block}.section-heading h2{width:auto;margin-top:28px}.project-frame{height:min(68svh,620px);min-height:280px}.project-meta{grid-template-columns:1fr auto;gap:7px}.project-meta p{grid-row:2}.project-meta span{grid-column:2;grid-row:1}.contact{padding:5rem var(--gutter) 3rem}.contact-details{display:block}.contact-details p+p{margin-top:24px}footer{gap:20px;flex-direction:column}footer div{flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;scroll-snap-type:none}.reveal{opacity:1;transform:none;transition:none}}
.text-link{display:inline-flex;align-items:center;gap:12px}.text-link span{margin-left:0}.section-rail a{position:relative;width:18px;height:18px;font-size:0}.section-rail a span{width:14px;height:1px;border-radius:0}.section-rail a[aria-current="true"] span{width:22px}.section-rail a::after{content:attr(aria-label);position:absolute;right:30px;top:50%;transform:translateY(-50%);font-size:.6rem;white-space:nowrap;letter-spacing:.12em;opacity:0;pointer-events:none;transition:opacity .18s ease}.section-rail a:hover::after,.section-rail a:focus-visible::after{opacity:1}.project-wide .project-frame{width:100%}.project-right .project-frame{width:76%;margin-left:auto}.project-left .project-frame{width:68%;margin-right:auto}.showreel{width:76%;min-height:clamp(360px,58svh,720px);margin:clamp(4.5rem,8vw,9rem) auto;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(1.5rem,3vw,3rem);border-top:1px solid #55554f;border-bottom:1px solid #55554f;color:var(--paper);background:linear-gradient(135deg,#171716,#292927)}.showreel>div{display:grid;grid-template-columns:auto 1fr;column-gap:clamp(2rem,6vw,8rem);align-items:end}.showreel span{font-size:.7rem;color:#aaa}.showreel h3{font-family:'Instrument Serif';font-size:clamp(3.7rem,7vw,8rem);font-weight:400;line-height:.85;letter-spacing:-.04em;margin:0}.showreel p:last-child{grid-column:2;margin:1.2rem 0 0;color:#aaa;font-size:.8rem;letter-spacing:.07em;text-transform:uppercase}.project-meta p{text-transform:none;letter-spacing:0;font-size:.78rem;line-height:1.4;max-width:380px}@media(max-width:850px){.section-rail a{display:flex!important}.section-rail a:not([aria-current="true"]){display:none!important}.section-rail a::after{display:none}.project-right .project-frame,.project-left .project-frame,.showreel{width:100%}.showreel{min-height:420px}.showreel>div{display:block}.showreel p:last-child{margin-top:1.4rem}}
/* Full-screen desktop scenes and exact header alignment */
.section-anchor,.project{scroll-margin-top:0}.hero,.services-section,.studio,.contact{height:calc(100svh - var(--header));min-height:calc(100svh - var(--header));overflow:hidden}.services-section,.studio,.contact{padding-block:clamp(2rem,4vh,4rem)}.services-section{display:flex;flex-direction:column}.services-intro{padding:clamp(1.5rem,3vh,3rem) 0}.services{flex:1;display:grid;grid-template-rows:repeat(3,minmax(0,1fr))}.services li{padding:1rem 0}.studio{display:flex;flex-direction:column}.studio-copy{flex:1;align-items:center;padding:clamp(2rem,4vh,4rem) 0}.contact{display:flex;flex-direction:column}.contact>a{margin-top:auto}.contact-details{margin-top:auto}.work{padding:0 calc(var(--gutter) + 3vw) 0 var(--gutter)}.work-intro,.project,.showreel{height:calc(100svh - var(--header));min-height:calc(100svh - var(--header));margin:0}.work-intro{padding:clamp(2rem,5vh,5rem) 0;align-items:center}.project{display:flex;flex-direction:column;padding:clamp(1.5rem,3vh,3rem) 0}.project+.project{margin-top:0}.project-frame{flex:1;height:auto;min-height:0}.project-meta{flex:none}.showreel{margin:0;width:76%;min-height:calc(100svh - var(--header))}.showreel+ .project{margin-top:0}@media(max-width:850px){.hero,.services-section,.studio,.contact,.work-intro,.project,.showreel{height:auto;min-height:0;overflow:visible}.work{padding:0 var(--gutter)}.work-intro{padding:5rem 0}.project{padding:0}.project+.project{margin-top:5rem}.showreel{margin:5rem 0}.services{display:block}.services li{padding:1.4rem 0}}
/* Subtle editorial motion */
.site-header,.section-rail a span,.text-link,.project-meta{transition:color .28s ease,border-color .28s ease,transform .4s cubic-bezier(.22,1,.36,1)}.section-rail a span{transition:width .28s ease,background-color .28s ease}.text-link:hover{transform:translateX(4px)}
@media(prefers-reduced-motion:no-preference){.hero-copy>*{opacity:0;animation:intro-rise .75s cubic-bezier(.22,1,.36,1) forwards}.hero-copy .eyebrow{animation-delay:.08s}.hero-copy h1{animation-delay:.18s}.hero-copy .intro{animation-delay:.29s}.hero-copy .text-link{animation-delay:.4s}.hero-image.visible img{animation:media-drift 16s ease-in-out infinite}.project.visible .project-frame img{animation:media-drift 20s ease-in-out infinite}.project-right.visible .project-frame img{animation-delay:-7s}.project-left.visible .project-frame img{animation-delay:-13s}.showreel{position:relative;overflow:hidden}.showreel>*{position:relative;z-index:1}.showreel::before{content:"";position:absolute;inset:-35%;background:radial-gradient(circle at 35% 40%,rgba(255,255,255,.11),transparent 26%),radial-gradient(circle at 65% 58%,rgba(37,71,245,.28),transparent 30%);animation:showreel-glow 18s ease-in-out infinite alternate}.showreel.visible{animation:showreel-enter .9s cubic-bezier(.22,1,.36,1) both}}@keyframes intro-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}@keyframes media-drift{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-.35%,0)}}@keyframes showreel-glow{from{transform:translate3d(-3%,-2%,0) scale(1)}to{transform:translate3d(4%,3%,0) scale(1.08)}}@keyframes showreel-enter{from{opacity:.35;transform:translateY(18px)}to{opacity:1;transform:none}}
/* Clear services call-to-action */
.text-link{gap:15px;padding:11px 14px 11px 16px;border:1px solid currentColor;border-radius:999px;line-height:1;transition:background-color .24s ease,color .24s ease,transform .24s ease}.text-link:hover{transform:none;background:var(--ink);color:var(--paper)}.text-link:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.text-link .button-arrow{display:inline-block;margin:0;font-size:1rem;line-height:1;transition:transform .24s ease}.text-link:hover .button-arrow{transform:translateX(3px)}
/* Header follows the active scene */
.site-header{background:var(--paper);transition:background-color .35s ease,color .35s ease,border-color .35s ease}.site-header .brand-mark img{transition:filter .35s ease}.site-header .nav-cta{transition:background-color .25s ease,color .25s ease,border-color .35s ease}body[data-header-theme="dark"] .site-header{background:var(--ink);color:var(--paper);border-color:#3e3e3a}body[data-header-theme="dark"] .site-header .brand-mark img{filter:invert(1)}body[data-header-theme="dark"] .site-header .brand small{color:#aaa}body[data-header-theme="dark"] .site-header .nav-cta{border-color:var(--paper)}body[data-header-theme="dark"] .site-header .nav-cta:hover{background:var(--paper);color:var(--ink)}body[data-header-theme="contact"] .site-header{background:var(--accent);color:#fff;border-color:rgba(255,255,255,.42)}body[data-header-theme="contact"] .site-header .brand-mark img{filter:invert(1)}body[data-header-theme="contact"] .site-header .brand small{color:rgba(255,255,255,.72)}body[data-header-theme="contact"] .site-header .nav-cta{border-color:#fff}body[data-header-theme="contact"] .site-header .nav-cta:hover{background:#fff;color:var(--accent)}
.language-switch{padding-left:16px;border-left:1px solid var(--line);font-weight:500}.site-header .language-switch:hover{opacity:.6}body[data-header-theme="dark"] .language-switch{border-color:#3e3e3a}body[data-header-theme="contact"] .language-switch{border-color:rgba(255,255,255,.42)}@media(max-width:850px){.language-switch{padding-left:0;border-left:0}}


/* Showreel follows the same title hierarchy as other section openers. */
.showreel{justify-content:center}
.showreel-heading{width:100%;margin:0;align-items:center}
.showreel-heading h2{font-size:clamp(3.6rem,6.5vw,7.5rem)}
.showreel-note{width:38%;margin:clamp(1.25rem,3vh,2.5rem) 0 0 auto;color:#aaa;font-size:.8rem;line-height:1.5;letter-spacing:.07em;text-transform:uppercase}
@media(max-width:850px){.showreel{justify-content:space-between}.showreel-heading{display:block}.showreel-heading h2{margin-top:28px}.showreel-note{width:100%;margin:2rem 0 0}}


/* Keep the showreel scene solid black until its film replaces the placeholder. */
.showreel{background:#171716}
@media(prefers-reduced-motion:no-preference){.showreel::before{display:none}}
