/* Typography and palette matched to the owner's BuildX preview reference.
   Keep these tokens shared by every public page and the editor's page preview. */
@font-face{font-family:Archivo;src:url('/assets/archivo-variable-latin.woff2') format('woff2');font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:Michroma;src:url('/assets/michroma-latin.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
:root{
  color-scheme:dark;
  --color-void:#0b0b0a;--color-bone:#efebe2;--color-yellow:#ffd000;--color-coral:#ff8a6a;
  --surface:#15140f;--muted:#a09d96;--line:#efebe233;
  --paper:var(--color-void);--ink:var(--color-bone);--night:var(--color-void);
  --blue:var(--color-yellow);--accent:var(--color-yellow);
  --display:Archivo,Arial,sans-serif;--label:Michroma,Arial,sans-serif;
}
body,body[data-page=projects]{background:var(--color-void);color:var(--color-bone);--paper:var(--color-void);font-family:Manrope,Arial,sans-serif}
::selection{background:var(--color-yellow);color:var(--color-void)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline-color:var(--color-yellow)}
h1,h2,h3,.hero-content h1,.inner-hero .hero-content h1,.works-mast h1,.work-label h3,.works-mosaic .work-label h3{
  font-family:var(--display);font-weight:600;font-variation-settings:"wdth" 118,"wght" 600;
  letter-spacing:-.02em;text-transform:uppercase;
}
.hero-content h1{font-size:clamp(54px,7.2vw,138px);line-height:.98}
.inner-hero .hero-content h1{font-size:clamp(48px,6.2vw,112px);line-height:1.02;max-width:100%}
.hero-content h1>span{overflow:visible}
.hero-content>p{font-size:19px;line-height:1.65;color:#efebe2bf;max-width:460px}
.hero-cinema,.hero-curtain i,.page-wipe,.section,.dark,.works-mast,.works-collection,.works-endnote,.site-footer,.site-menu,.legal-page{background:var(--color-void);color:var(--color-bone)}
.hero-layer:after{background:linear-gradient(90deg,#0b0b0a80,transparent 75%),linear-gradient(0deg,#0b0b0a,transparent 50%)}
.inner-hero .hero-layer:after{background:linear-gradient(90deg,#0b0b0ad9,#0b0b0a26 95%),linear-gradient(0deg,#0b0b0a,transparent 50%)}
.hero-cinema[data-concept=courtyard-light] .hero-layer:after{background:linear-gradient(90deg,#0b0b0ab0,#0b0b0a05 75%),linear-gradient(0deg,#0b0b0a,transparent 60%)}
.kicker,.mini-label,.hero-foot,.chapter-caption,.chapter-step>span,.work-type,.work-media-count,.work-number,.works-edition,.works-type-label>span,.works-directory-bottom>span,.logo-note,.gallery-index,.art-note{
  font-family:var(--label);font-size:10px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;line-height:1.7;
}
.kicker{font-size:11px;letter-spacing:.22em;line-height:1.6;color:var(--muted)}
.kicker:before{background:var(--color-yellow);flex-shrink:0}
.section-heading>div,.logo-heading>div{min-width:0;max-width:100%}
.hero-content .kicker{color:#efebe28c}
.hero-foot{color:#efebe2bf;font-size:10px;letter-spacing:.12em}
.masthead,.masthead.scrolled{color:var(--color-bone);background:#0b0b0ac9;border-color:#efebe233;box-shadow:0 8px 32px #0002}
.masthead:hover,.masthead:focus-within,.masthead.scrolled:hover{background:#15140ff2;border-color:#ffd0008c;box-shadow:0 5px 45px #ffd00015}
.masthead nav{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;gap:28px}
.masthead nav a[aria-current]{color:var(--color-yellow)}
.nav-cta{border-color:#efebe266;border-radius:40px}
.brand.original-brand{background:var(--color-bone)}
.site-menu nav a{font-family:var(--display);font-variation-settings:"wdth" 118,"wght" 600;font-weight:600;letter-spacing:-.02em;text-transform:uppercase}
.button,.button.light,.blue-panel .button.light{background:var(--color-bone);color:var(--color-void);font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;border-radius:40px;border-color:var(--color-bone)}
.button.outline{background:transparent;color:var(--color-bone);border-color:#efebe266}
.button>span:not(:last-child){font:inherit;letter-spacing:inherit}
.button:hover,.button.light:hover,.blue-panel .button.light:hover,.nav-cta:hover{background:var(--color-yellow);border-color:var(--color-yellow);color:var(--color-void)}
.link-line{font-size:12px;letter-spacing:.12em;text-transform:uppercase;border-color:#efebe266}
.link-line:hover{color:var(--color-yellow)}
.reading-progress,.scroll-line:after{background:var(--color-yellow)}
.scrub-text{font-family:var(--display);font-weight:600;font-variation-settings:"wdth" 118,"wght" 600;letter-spacing:-.02em;text-transform:uppercase;font-size:clamp(36px,4.8vw,88px);line-height:1.12}
.scrub-text span{color:#4b4943}.scrub-text span.lit{color:var(--color-bone)}
.marquee,.blue-panel,.next-chapter,.reel-section,.clients-section,.wider-team,.concept-feature{background:var(--surface);color:var(--color-bone)}
.marquee{border-block:1px solid var(--line)}
.marquee-track,.next-chapter a,.footer-invite>a,.metric>strong,.scene-word{font-family:var(--display);font-weight:600;font-variation-settings:"wdth" 118,"wght" 600;letter-spacing:-.02em;text-transform:uppercase}
.marquee-track i,.quote-mark,.works-period{color:var(--color-yellow)}
.intro-story>.kicker,.section-heading .kicker,.dark .section-heading .kicker,.blue-panel>.kicker,.next-chapter .kicker,.concept-feature-copy .kicker{color:var(--muted)}
.section-heading>p,.intro-bottom>p,.work-label p,.reel-controls,.metric p,.metrics-note,.content-note,.scope-note,.founder-copy>.mini-label,.founder-role,.sample-note,.client-name span,.client-quote>.kicker,.footer-meta>div>p,.footer-bottom,.project-title>p:last-child,.back-link,.project-summary dt,.film-player figcaption,.path-row p,.path-row>span,.principles-grid p,.principles-grid article>span,.investor-intro,.opportunity-grid p,.opportunity-grid article>span,.brief-grid span,.brief-grid p,.expertise-row p,.expertise-row small,.expertise-row>span,.team-intro>p:last-child,.founder-detail .founder-copy>p,.team-slot>p,.contact-details>p,.contact-directory small,.enquiry-form>label,.form-row>label,.form-note,.legal-page>p:not(.kicker),.concept-feature-copy>p:not(.kicker),.site-menu>p{color:var(--muted)}
.path-row>span,.principles-grid article>span,.opportunity-grid article>span,.brief-grid>div>span,.expertise-row>span{color:var(--color-coral)}
.section-heading .link-line,.founder-copy h3,.client-name strong,.footer-invite>a,.project-summary dd,.contact-directory a,.works-endnote a,.works-endnote>span{color:var(--color-bone)}
.metrics-grid,.metric,.founder-detail,.path-row,.principles-grid article,.opportunity-grid article,.brief-grid>div,.expertise-row,.project-summary dl>div,.footer-invite,.footer-bottom,.contact-directory>div{border-color:var(--line)}
.footer-invite>a:hover,.footer-meta>div>a:hover{color:var(--color-yellow)}
.footer-invite>.kicker,.partnership-copy>.kicker,.partnership-copy>p:not(.kicker),.founder-detail .founder-copy>p:not(.mini-label):not(.founder-role),.contact-details>p:not(.kicker),.viewer figcaption{color:var(--muted)}
.founder-overlay{background:linear-gradient(transparent,#0b0b0ab3);color:var(--color-bone)}
.client-controls button{border-color:var(--line)}.client-controls button:hover{background:var(--color-bone);color:var(--color-void)}
.work-frame,.gallery-tile,.works-mosaic .work-frame,.client-image,.founder-portrait{background:#25241f}
.slot-portrait{background:linear-gradient(140deg,#292720,#171611);color:var(--muted)}
.slot-portrait:after{border-color:var(--line)}
.team-placeholder-image{filter:brightness(.6)}
.client-dots button,.process-dots button{background:#efebe240}.client-dots button.active,.process-dots button.active{background:var(--color-yellow)}
.logo-section{background:var(--color-void);color:var(--color-bone)}
.logo-heading .kicker,.logo-note,.client-logo span{color:var(--muted)}
.logo-heading>.logo-pause{color:var(--color-bone);border-color:var(--line)}
.logo-window,.client-logo{border-color:var(--line)}
.next-chapter{border-top:1px solid var(--line)}
.next-chapter a{font-size:clamp(48px,7vw,128px);line-height:1.05}
.next-chapter a>b{color:var(--color-yellow)}
.next-chapter-bottom{color:var(--muted)}
.journey-toggle span{border-color:var(--line);color:var(--color-yellow)}
.journey-meter{background:var(--line)}.journey-meter i{background:var(--color-yellow)}
/* Every scroll chapter uses the reference's warm black, including its captions. */
.chapter-scene,.chapter-scene[data-motion]{background:var(--surface);color:var(--color-bone)}
.chapter-scene .chapter-copy>.kicker,.chapter-scene .chapter-step p,.chapter-scene .chapter-instruction,.chapter-scene .chapter-caption{color:var(--muted)}
.chapter-scene .chapter-step>span{color:var(--color-coral)}
.chapter-scene .scene-word{color:#efebe20d}
.chapter-step h2{font-size:clamp(36px,4.2vw,76px);line-height:1.06}
.chapter-controls button{color:var(--muted);border-color:#efebe240}
.chapter-scene .chapter-controls button[aria-pressed=true]{background:var(--color-yellow);color:var(--color-void);border-color:var(--color-yellow)}
.chapter-progress{background:var(--line)}.chapter-progress i{background:var(--color-yellow)}
.chapter-scene[data-motion] .scene-picture{border-color:var(--color-bone)}
.chapter-caption{background:#0b0b0acc;padding:5px 8px}
/* The Vivid-inspired portfolio composition stays intact. */
.works-mast h1{font-size:clamp(100px,18vw,320px);line-height:.95}
.works-hand{left:auto;right:7vw;top:150px;font-family:var(--label);font-size:13px;font-weight:400;letter-spacing:.2em;line-height:1.7;text-transform:uppercase;transform:none;color:var(--color-coral)}
.works-edition{color:var(--muted);font-size:9px}
.works-statement{font-size:clamp(19px,1.55vw,27px);font-weight:400;line-height:1.65;letter-spacing:0;color:#efebe299}
.works-filters button{color:var(--muted);font-weight:600;letter-spacing:.14em;font-size:11px}
.works-filters button[aria-pressed=true],.works-filters button:hover{color:var(--color-bone)}
.works-filters button[aria-pressed=true]:before{background:var(--color-yellow)}
.works-type-label,.works-directory-bottom>span,.works-endnote{color:var(--muted)}
.works-type-label select{background:var(--color-void);color:var(--color-bone);border-color:var(--line)}
.works-directory-bottom .works-down{border-color:var(--line);color:var(--color-bone)}
.works-mosaic .work-label h3,.works-mosaic .work-type,.works-mosaic .work-place,.works-mosaic .mosaic-card:after{background:var(--color-void);color:var(--color-bone)}
.works-mosaic .work-label h3{font-size:clamp(14px,1.3vw,23px);line-height:1.15;padding-block:14px}
.works-mosaic .work-type{font-size:9px;letter-spacing:.13em;line-height:1.7;color:#efebe299}
.works-mosaic .work-place{color:var(--muted)}
.work-media-count{font-size:9px;letter-spacing:.1em}
.work-view,.work-open,.work-number{color:var(--color-bone)}
.work-open:hover,.work-link:hover .work-open{background:var(--color-bone);color:var(--color-void)}
.work-view b{background:#0b0b0a44;border-color:#efebe280}
.project-title h1{font-size:clamp(48px,7vw,125px)}
.project-opening{background:var(--color-void);color:var(--color-bone)}
.project-cover:after{background:linear-gradient(0deg,#0b0b0af0,#0b0b0a40 60%,#0b0b0a55)}
.gallery-index,.gallery-enlarge{background:#0b0b0a88;color:var(--color-bone)}
.film-player video,.viewer::backdrop{background:var(--color-void)}
.viewer{background:#0b0b0af7;color:var(--color-bone)}
.enquiry-form input,.enquiry-form textarea,.enquiry-form select{color:var(--color-bone);border-color:var(--line);background:transparent}
.enquiry-form input:not([type=radio]){border-color:var(--line)}
.enquiry-form input::placeholder,.enquiry-form textarea::placeholder{color:#efebe266}
.interest-options span{border-color:var(--line);color:var(--muted)}
.interest-options input:checked+span{background:var(--color-bone);color:var(--color-void);border-color:var(--color-bone)}
.interest-options label:hover span{border-color:var(--color-yellow);color:var(--color-yellow)}
.interest-options label:hover input:checked+span{color:var(--color-void)}
@media(max-width:1100px){.masthead nav{gap:18px;font-size:11px;letter-spacing:.1em}.works-hand{top:133px;right:6vw;font-size:11px}}
@media(max-width:850px){
 .hero-content h1{font-size:10vw}.inner-hero .hero-content h1{font-size:8.8vw}
 .hero-content>p{font-size:17px}.hero-foot{font-size:9px;letter-spacing:.06em}
 .scrub-text{font-size:7.8vw}.works-mast h1{font-size:20vw}
 .chapter-step h2{font-size:clamp(30px,7vw,48px)}
 .chapter-scene .chapter-caption{background:#0b0b0acc;font-size:9px;letter-spacing:.08em}
 .chapter-scene .chapter-copy>.kicker{font-size:9px;letter-spacing:.14em}
 .chapter-step p{font-size:14px}.next-chapter a{font-size:10vw}
 .logo-heading h2{font-size:28px}.logo-heading .kicker{font-size:9px;letter-spacing:.12em}
 .kicker{font-size:10px;letter-spacing:.17em}.site-menu nav a{font-size:6.7vw}
}
@media(max-width:620px){
 .works-mast{padding-top:150px;padding-bottom:30px}.works-mast h1{font-size:18.5vw}
 .works-hand{top:117px;right:6vw;left:auto;font-size:9px;letter-spacing:.12em}
 .works-statement{font-size:18px;line-height:1.65}.works-filters{gap:6px 20px}
 .works-mosaic .work-label h3{font-size:15px;max-width:100%}
 .works-mosaic .work-type{font-size:8px}.work-media-count{font-size:8px}
 .works-type-label{font-size:11px}.works-type-label>span{font-size:8px}
 .hero-content h1{font-size:10.5vw}.inner-hero .hero-content h1{font-size:9vw;line-height:1.06}
 .hero-content>p{font-size:16px;line-height:1.7}.hero-foot{font-size:8px}
 .concept-feature-copy h2{font-size:9.5vw}.blue-panel>h2{font-size:8.3vw}
 .statement-layout h2{font-size:8vw}.project-title h1{font-size:10vw}
 .team-slot h3{font-size:17px}.team-slot>p{font-size:11px}
 .footer-invite>a{font-size:10vw}.next-chapter a{font-size:9vw}
 .opportunity-grid h3{font-size:30px}.brief-grid h3,.expertise-row h3,.path-row h3{font-size:26px}
 .contact-details h2{font-size:10vw}.founder-detail h3{font-size:30px}
 .section-heading h2,.logo-heading h2{font-size:8vw;line-height:1.08}
 .logo-heading{flex-direction:column;gap:18px}
}
@media(prefers-reduced-motion:reduce){.scrub-text span{color:var(--color-bone)}}