/* Approved identity artwork; typography supports, rather than recreates, the logo. */
@font-face{font-family:Barlow Condensed;src:url('./assets/barlow-condensed-light.ttf') format('truetype');font-weight:300;font-display:swap}
:root{--display:'Barlow Condensed',Manrope,Arial,sans-serif}
.brand{display:inline-flex;align-items:center;letter-spacing:0;flex-shrink:0}
.brand img{width:156px;height:auto;object-fit:contain}
.footer-bottom .brand img{width:140px}
body[data-page=home] .hero-title{font-size:inherit;line-height:0;letter-spacing:0;margin:0;width:min(100%,1280px)}
.hero-title img{width:100%;height:auto;object-fit:contain}
.hero-film{opacity:0;transition:opacity .35s ease}
.hero-film.is-playing{opacity:1}
.world-scene--fashion{object-fit:contain;object-position:72% center;background:var(--canvas)}
.world-context,.world-selectors{right:max(var(--margin),env(safe-area-inset-right));left:max(var(--margin),env(safe-area-inset-left))}
.world-select{min-height:48px}
.world-selectors{align-items:start}
.world-selector{position:relative;min-width:0}
.world-description{position:absolute;bottom:100%;left:0;right:0;margin:0 0 28px;max-width:36ch}
.hero-tools{flex-wrap:wrap}
.hero-bottom{padding-bottom:env(safe-area-inset-bottom)}
.mosaic-right img{object-position:50% 62%}
.mosaic-main img{object-position:53% center}
.world-scene:not(.world-scene--fashion){object-position:54% center}
@media(max-width:767px){
 .world-scene--fashion{object-fit:cover;object-position:50% 55%}
 .world-scene:not(.world-scene--fashion){object-position:56% center}
 .world-stage{min-height:660px}
 .world-selector{position:static}
 .world-description{bottom:86px;margin:0;max-width:35ch}
 body[data-page=home] .feature-image img{object-position:56% center}
}
@media(orientation:landscape) and (max-height:550px){
 body[data-page=home] .hero{min-height:360px;height:100svh}
 body[data-page=home] .hero-bottom{bottom:24px}
 body[data-page=home] .hero-title{width:65%}
 body[data-page=home] .hero-description{font-size:16px;margin-top:14px}
 body[data-page=home] .hero-caption-row{display:flex;align-items:center}
 body[data-page=home] .hero-tools{margin-top:0}
}
body:not([data-page=home]) h1,body:not([data-page=home]) h2,body:not([data-page=home]) h3{font-family:var(--display);font-weight:300;text-transform:uppercase;letter-spacing:-.015em}
body:not([data-page=home]) .page-top h1{font-size:clamp(84px,12vw,180px);line-height:.94;max-width:13ch;text-wrap:balance}
body:not([data-page=home]) h2{font-size:clamp(52px,7vw,110px);line-height:1}
body:not([data-page=home]) h3{font-size:clamp(36px,4vw,60px);line-height:1.05}
body:not([data-page=home]) .inquiry-footer .footer-lead{font-size:clamp(80px,12vw,180px);line-height:.95}
.page-top{padding-block:clamp(150px,16vw,230px) clamp(56px,8vw,120px)}
.page-top .lede{max-width:40ch;font-size:clamp(19px,2vw,26px);text-wrap:pretty}
.eyebrow{display:block;font-family:Manrope,Arial,sans-serif;font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;line-height:1.6;color:var(--muted);margin-bottom:24px}
.feature-caption .eyebrow{margin:0 0 16px}
.feature-caption .study-description{max-width:40ch;font-size:15px;line-height:1.8;margin-top:0}
.feature-caption h3{max-width:17ch}
.founders-intro{padding-block:0 64px}
.founder-list{display:grid;grid-template-columns:1fr 1fr;gap:64px;margin-bottom:100px}
.founder{padding-block:28px 40px;border-top:1px solid var(--rule)}
.founder>span{display:block;color:var(--muted);font-size:12px;margin-bottom:24px}
body[data-page=studio] .founder h3{font-family:Manrope,Arial,sans-serif;font-size:clamp(24px,3vw,42px);font-weight:400;letter-spacing:-.04em;text-transform:none}
.principles{margin-bottom:0;gap:5vw;margin-top:100px}
.principles h3{max-width:15ch}
.principles .eyebrow{margin-bottom:28px}
.holding-image{aspect-ratio:16/7;overflow:hidden;margin-bottom:var(--gap)}
.email-link{display:inline-flex;align-items:center;gap:16px;font-size:clamp(16px,1.6vw,22px);color:var(--ink);padding-bottom:12px;border-bottom:1px solid var(--rule);max-width:100%;overflow-wrap:anywhere;letter-spacing:-.025em}
.email-link .arrow{flex-shrink:0}
.contact-copy{max-width:none}
.contact-copy>p{max-width:36ch;margin-top:28px;font-size:15px}
.contact-process{margin-top:64px;border-top:1px solid var(--rule);padding-top:28px;max-width:36ch}
.contact-process .eyebrow{margin-bottom:16px}
.contact-process p{font-size:13px}
.field{gap:16px}
.field input,.field textarea{background:transparent;border:0;border-bottom:1px solid var(--rule);padding:12px 0;color:var(--ink)}
.field input::placeholder,.field textarea::placeholder{color:var(--muted);opacity:1}
.field input:hover,.field textarea:hover{border-color:var(--muted)}
.field input:focus,.field textarea:focus{border-bottom-color:var(--ink)}
.brief-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap;padding-top:16px}
.brief-actions .primary{display:inline-flex;gap:20px;align-items:center;justify-content:space-between}
.brief-actions .text-link{white-space:normal;font-size:12px;gap:16px}
.form-note{max-width:56ch;line-height:1.8}
.primary{transition:background .2s ease,transform .2s ease}
.primary:active{transform:translateY(1px)}
.footer-meta a{display:inline-block;padding-top:14px;text-decoration:underline;text-underline-offset:5px;overflow-wrap:anywhere}
.inquiry-footer .footer-lead{max-width:none}
.review-note p{max-width:85ch}
.review-actions{display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.studio-full-image{aspect-ratio:16/8}
@media all{
 .page-top>h1{animation:page-title-in .9s var(--ease) both}
 .page-top>.eyebrow,.page-top>.lede{animation:page-copy-in .8s var(--ease) both}
 .page-top>.lede{animation-delay:.12s}
 @keyframes page-title-in{from{opacity:0;transform:translateY(32px)}to{opacity:1;transform:none}}
 @keyframes page-copy-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
}
@media(max-width:767px){
 .world-selectors{grid-template-columns:.8fr 1.3fr .9fr;gap:12px}.world-select{font-size:clamp(21px,6.4vw,29px)}
 .brand img{width:120px}.header nav{gap:18px}.menu-toggle{padding-left:0}
 body:not([data-page=home]) .page-top h1{font-size:clamp(60px,19vw,112px);line-height:.97}
 body:not([data-page=home]) h2{font-size:clamp(50px,14vw,72px)}
 .page-top{padding-top:140px;padding-bottom:64px}
 .page-top .lede{font-size:19px;margin-top:28px}
 .eyebrow{font-size:10px;margin-bottom:24px}
 .feature-caption .study-description{margin-top:28px;font-size:14px}
 .founders-intro{padding-bottom:48px}.founder-list{grid-template-columns:1fr;gap:8px;margin-bottom:64px}
 .founder{padding-block:24px 32px}.founder>span{margin-bottom:18px}
 .principles{margin-top:64px;gap:44px}.principles .eyebrow{margin-bottom:20px}
 .holding-image{aspect-ratio:4/5}
 .studio-full-image{aspect-ratio:4/5}.studio-full-image img{object-position:37% center}
 .contact-layout{gap:56px}.contact-process{margin-top:36px}.contact-copy>p{font-size:14px}
 .email-link{font-size:clamp(14px,4.3vw,20px);gap:12px}
 .brief-actions{align-items:flex-start;gap:20px}.brief-actions .primary{font-size:13px;padding-inline:18px}
 .footer-bottom{gap:28px}.footer-meta{font-size:12px}
 body[data-page=home] .hero-title{margin:0;width:100%;font-size:inherit}
 body[data-page=home] .hero{height:min(100svh,215vw);min-height:600px}
 body[data-page=home] .intro{min-height:min(85svh,180vw)}
 .worlds-heading{min-height:min(45svh,110vw)}
 .world-stage{height:min(calc(100svh - 80px),215vw)}
 .chapter-intro{height:min(62svh,160vw)}
 body[data-page=home] .feature-image{height:min(80svh,200vw)}
}

/* Landscape fashion artwork selected for the Three worlds showcase. */
.world-scene.world-scene--fashion-wide{object-fit:cover;object-position:50% 60%}

/* Original video, fixed portrait crop. No animated pan or touch scroll transform. */
@media(max-width:767px) and (orientation:portrait){
 body[data-page=home] .hero-film,body[data-page=home] .hero-image{object-fit:cover;object-position:35% 50%}
}
@media(max-width:1023px),(pointer:coarse){
 body[data-page=home] .hero-media{transform:none!important}
}