/* Photography-led composition adapted for Null Africa's studio content. */
:root{--display:'Montserrat','DM Sans',Arial,sans-serif;--hero-shade:oklch(8% 0 0 / .66);--hero-muted:oklch(85% 0 0);--section-tint:oklch(96% .002 106)}
body{padding:10px;background:var(--paper)}
.site-shell{max-width:none;padding:0;background:none}
header{max-width:1400px;margin:auto;padding:30px 4%;min-height:100px;border:0;position:relative;z-index:2}
.wordmark{font-family:var(--display);letter-spacing:.13em;font-size:19px;gap:14px}.mark{display:none}.studio{font-size:10px;letter-spacing:.36em;margin-top:6px}
nav{gap:34px;font-size:12px;text-transform:uppercase;letter-spacing:.07em}.nav-cta{border-color:currentColor;padding:13px 20px}
.home-page header{color:var(--on-dark);position:absolute;top:10px;left:10px;right:10px;max-width:none}
.home-page nav a:hover{color:var(--hero-muted)}
main>section:not(.cinematic-hero):not(.manifesto):not(.closing){max-width:1200px;margin-left:auto;margin-right:auto;padding:90px 30px;border-bottom:0}
.cinematic-hero{position:relative;isolation:isolate;min-height:740px;min-height:95svh;padding:155px 24px 110px;display:flex;align-items:center;justify-content:center;text-align:center;background:var(--ink);color:var(--on-dark);overflow:hidden;border:0}
.cinematic-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 42%;z-index:-2;filter:grayscale(1) brightness(.66)}
.cinematic-hero::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,var(--hero-shade),oklch(8% 0 0 / .30) 50%,var(--hero-shade));z-index:-1}
.cinematic-content{width:100%;max-width:1100px}.cinematic-content>.eyebrow{color:var(--hero-muted);font-size:11px;letter-spacing:.22em;margin:0 auto 30px}
.cinematic-hero .hero-headline{font-family:var(--display);font-size:clamp(36px,4.7vw,70px);font-weight:600;text-transform:uppercase;margin:0 auto 25px;letter-spacing:.065em;line-height:1.3}
.cinematic-hero .headline-line{color:var(--on-dark);letter-spacing:.065em;line-height:1.3}
.hero-description{font-size:18px;line-height:1.75;color:var(--hero-muted);margin:0 auto 32px;max-width:650px}
.cinematic-hero .button{background:var(--paper);border-color:var(--paper);color:var(--ink);padding:18px 32px;font:500 11px var(--display);letter-spacing:.20em;text-transform:uppercase;gap:28px}
.cinematic-hero .button:hover{background:var(--blue);border-color:var(--blue);color:var(--paper)}
.cinematic-hero .aside-note{color:var(--hero-muted);font-family:var(--sans);font-size:12px;letter-spacing:.06em;margin:20px auto 0}
.scroll-cue{position:absolute;bottom:25px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:12px;font:10px var(--display);letter-spacing:.15em;white-space:nowrap;color:var(--hero-muted);padding:10px 20px}
.scroll-line{height:28px;width:1px;background:var(--paper);transform-origin:top;animation:line-draw 1.2s var(--ease-out) both}
.studio-intro{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:64px}.studio-intro figure{margin:0}.studio-intro img{display:block;width:100%;height:430px;object-fit:cover;background:var(--section-tint)}
h2{font-family:var(--display);font-size:clamp(28px,3vw,42px);font-weight:400;letter-spacing:.04em;line-height:1.35}
h3{font-family:var(--display);font-weight:500;letter-spacing:.01em}
.studio-intro h2{margin:18px 0 26px}.studio-intro p{font-size:16px;line-height:1.9}.text-link{font:500 11px/1.7 var(--display);text-transform:uppercase;letter-spacing:.18em;text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:7px;display:inline-block}.text-link:hover{border-color:var(--blue)}
.eyebrow{font-size:11px;letter-spacing:.16em}
.section-heading{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;margin-bottom:40px}.section-heading h2{margin:0}.section-heading>.text-link{position:static;margin:8px 0 0;align-self:center}
.section-heading h2::before{content:'— ';color:var(--muted)}.section-heading h2::after{content:' —';color:var(--muted)}
.work-grid{gap:36px}.project img{height:400px}.project-title{justify-content:center;gap:20px;margin-top:26px}.project-title h3{font-size:21px}.project-cover>.eyebrow{text-align:center;font:13px var(--sans);text-transform:none;letter-spacing:.02em}.project-story{margin-top:22px}.project-story summary{font-size:13px;letter-spacing:.02em}
.service-grid{border:0;gap:40px}.service{padding:35px 0;background:transparent;border-right:0;border-top:1px solid var(--line)}.service>h3{font-size:26px;line-height:1.4;margin-top:26px}.service>p{font-size:16px;line-height:1.8}.service::before{height:1px}
.recognition{background:var(--section-tint);gap:50px}.recognition-list li{font-size:17px}.recognition h2{font-size:32px}.recognition .aside-note{font-family:var(--sans)}
.manifesto{margin:40px 0;background:var(--ink);text-align:center;padding:100px 30px 110px}.manifesto h2{font-size:clamp(34px,4.5vw,60px);font-family:var(--display);font-weight:500;letter-spacing:.035em;line-height:1.35;margin:30px auto}.manifesto p{margin:0 auto 30px}.manifesto em{text-decoration:none;color:var(--on-dark)}.manifesto::after{left:45%;right:45%}
.process-strip{border-color:var(--line)}.process-strip a{border-right:0;text-align:center}.process-strip strong{font-family:var(--display);font-size:14px}.split{grid-template-columns:1fr 2fr;gap:64px}
.closing{margin:0;background:var(--section-tint);padding:85px max(30px,calc((100% - 1140px)/2));display:flex;flex-direction:column;align-items:center;text-align:center;gap:25px;border:0}.closing>div{display:flex;flex-direction:column;align-items:center;gap:32px}.closing h2{font-family:var(--display);font-size:clamp(30px,3.5vw,48px);letter-spacing:.04em;font-weight:400}.closing .button{margin:0}
.button{font-size:12px;letter-spacing:.12em;text-transform:uppercase;background:var(--ink);border-color:var(--ink);padding:17px 27px}.button:hover{background:var(--blue);border-color:var(--blue)}
footer{max-width:1200px;margin:auto;padding:55px 30px;gap:35px}.page-hero{text-align:center}.page-hero h1{font-family:var(--display);font-size:clamp(36px,5vw,68px);letter-spacing:.01em;line-height:1.2}.page-hero>p{margin-left:auto;margin-right:auto}.page-hero h1 span{color:var(--ink)}.detail-image{max-width:1140px;margin:auto;height:540px}.service-row{border-top:1px solid var(--line)}.service-row h2{font-size:30px}.philosophy h2{font-size:30px}
@media(min-width:1600px){.cinematic-hero{min-height:850px}}
@media(max-width:1000px){header{padding:25px 3%}nav{gap:18px}.wordmark{font-size:16px}.studio-intro{gap:35px}.studio-intro img{height:390px}.split{gap:35px}.project img{height:340px}}
@media(max-width:700px){body{padding:6px}.home-page header{top:6px;left:6px;right:6px;background:transparent;padding:22px}.menu-toggle{background:transparent;color:inherit;border-color:currentColor;font-size:12px}.home-page nav.open{background:var(--ink);padding:20px;margin-top:20px}.cinematic-hero{min-height:760px;min-height:94svh;padding:160px 22px 105px}.cinematic-content>.eyebrow{font-size:10px;line-height:1.8;letter-spacing:.13em;max-width:240px;margin:0 auto 25px}.cinematic-hero .hero-headline{font-size:clamp(28px,7.5vw,45px)}.cinematic-hero .headline-line{letter-spacing:.035em;line-height:1.35}.hero-description{font-size:16px;margin-top:24px}.cinematic-hero .aside-note{max-width:230px;line-height:1.8}.cinematic-hero .button{font-size:10px;padding:17px 22px;gap:20px}.scroll-cue{bottom:14px;font-size:9px}.scroll-line{height:20px}main>section:not(.cinematic-hero):not(.manifesto):not(.closing){padding:55px 20px}.studio-intro{grid-template-columns:1fr;gap:30px}.studio-intro img{height:300px}.studio-intro h2{font-size:29px}.work-grid{gap:40px}.project img{height:310px}.section-heading h2::before,.section-heading h2::after{content:none}.section-heading{gap:15px;margin-bottom:30px}.recognition,.split{grid-template-columns:1fr;gap:24px}.recognition h2{font-size:27px}.recognition-list li{font-size:16px}.service-grid{gap:12px}.service{padding:28px 0;border-bottom:0}.manifesto{padding:65px 24px 80px;margin:15px 0}.manifesto h2{font-size:30px}.manifesto p{font-size:16px}.closing{padding:60px 24px}.closing h2{font-size:30px}footer{padding:40px 20px}.service-row{grid-template-columns:1fr}.page-hero h1{font-size:37px}.detail-image{height:300px;width:calc(100% - 40px)}.form-layout{grid-template-columns:1fr}header .wordmark{font-size:15px;letter-spacing:.08em}}
.direct-contact{display:flex;flex-direction:column;gap:20px;margin:28px 0}.direct-contact a{overflow-wrap:anywhere;font-size:15px}.direct-contact a>span{display:block;font:10px/1.8 var(--display);letter-spacing:.15em;color:var(--muted);margin-bottom:3px}.footer-contact a{overflow-wrap:anywhere}.whatsapp-support{position:fixed;right:max(24px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));z-index:20;display:flex;align-items:center;gap:12px;padding:15px 19px;background:var(--ink);color:var(--paper);border:1px solid var(--muted);text-align:left;min-height:58px;transition:background-color .25s,border-color .25s}.whatsapp-support strong{display:block;font:500 12px/1.5 var(--display);letter-spacing:.02em}.whatsapp-support small{display:block;font:11px/1.6 var(--sans);color:var(--hero-muted)}.whatsapp-support:hover{background:var(--blue);border-color:var(--blue);color:var(--paper)}.support-arrow{font-size:20px;margin-left:7px}.whatsapp-support svg{flex-shrink:0}footer{padding-bottom:125px}
@media(max-width:700px){.whatsapp-support{right:16px;bottom:max(16px,env(safe-area-inset-bottom));gap:9px;padding:12px 14px;min-height:50px}.whatsapp-support small,.support-arrow{display:none}.whatsapp-support strong{font-size:11px}.footer-contact{text-align:left}footer{padding-bottom:105px}}
@media(prefers-reduced-motion:reduce){.scroll-line{animation:none}.cinematic-backdrop{transform:none}}