@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Italiana&family=Manrope:wght@400;500;600;700&display=swap');
:root{--paper:#f8f7f3;--ink:#171717;--muted:#77746f;--rule:#d3d0c9;--white:#fff}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'Manrope',Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
header{position:relative;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;background:var(--paper);border-bottom:1px solid var(--rule);min-height:124px;padding:22px 5.4%;z-index:10}
header:before{content:'PRODUCTION DESIGN · FILM & COMMERCIAL';grid-column:1;grid-row:1;font-size:9px;letter-spacing:.19em;color:#5a5754;line-height:1.6;max-width:150px}
.brand{grid-column:2;grid-row:1;text-align:center;font-family:'Italiana',Georgia,serif;font-size:clamp(29px,3.4vw,57px);font-weight:400;letter-spacing:.085em;line-height:.9;white-space:nowrap}
.brand span{display:block;margin-top:14px;font:500 9px 'Manrope',Arial,sans-serif;letter-spacing:.36em}
nav{grid-column:3;grid-row:1;justify-self:end;display:flex;gap:29px}
nav a{font-size:10px;letter-spacing:.17em;text-transform:uppercase;font-weight:600;position:relative}
nav a:after{content:'';display:block;position:absolute;bottom:-9px;width:0;height:1px;background:var(--ink);transition:width .2s}
nav a.active:after,nav a:hover:after{width:100%}
.wrap{max-width:1800px;margin:auto;padding:0 5.4%}
.eyebrow,.small,.project-num{font-size:10px;line-height:1.5;letter-spacing:.22em;text-transform:uppercase;color:#4b4945;font-weight:600}
.hero{padding-top:49px}
.hero>.eyebrow{text-align:center;letter-spacing:.34em}
.hero-top{display:flex;justify-content:center;flex-direction:column;align-items:center;padding:22px 0 55px;gap:16px}
.hero h1,.pagehead h1{font-family:'Italiana',Georgia,serif;font-weight:400;font-size:clamp(78px,11.5vw,190px);line-height:.83;letter-spacing:-.035em;text-align:center;margin:13px 0}
.hero-top p{font-size:12px;letter-spacing:.04em;line-height:2;color:#5b5b57;max-width:475px;margin:0;text-align:center}
.hero-feature{height:min(66vw,930px);min-height:530px;position:relative;overflow:hidden;background:#333}
.hero-feature img{width:100%;height:100%;object-fit:cover;object-position:center 38%;display:block;filter:contrast(1.05) saturate(.78) brightness(.9);transition:transform 1.4s cubic-bezier(.2,.8,.2,1)}
.hero-feature:hover img{transform:scale(1.025)}
.film-gradient{position:absolute;inset:0;background:linear-gradient(180deg,transparent 43%,rgba(0,0,0,.65) 100%)}
.film-info{position:absolute;bottom:6%;left:5%;right:5%;display:flex;align-items:end;justify-content:space-between;gap:30px;color:white}
.film-info .small{color:#eee;font-size:10px}
.film-info h2{font-family:'Italiana',Georgia,serif;font-size:clamp(50px,7.4vw,110px);font-weight:400;line-height:.91;letter-spacing:-.025em;margin:17px 0}
.pill{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:14px 3px;border:0;border-bottom:1px solid currentColor;border-radius:0;font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;white-space:nowrap;transition:opacity .2s}
.pill:hover{opacity:.6}
.intro{display:grid;grid-template-columns:1fr 1fr;gap:12%;padding-top:160px;padding-bottom:185px}
.intro h2,.section-head h2,.closing h2{font-family:'Italiana',Georgia,serif;font-weight:400;font-size:clamp(60px,7.6vw,125px);letter-spacing:-.035em;line-height:.94;margin:20px 0}
.intro>div:last-child{padding-top:40px}
.intro p,.bodycopy{color:#50504d;font-size:15px;line-height:2;max-width:600px}
.intro p:first-child{font-size:clamp(17px,2vw,25px);line-height:1.65;color:var(--ink)}
.intro .pill{margin-top:20px}
.section-head{padding:32px 0 35px;border-top:1px solid var(--ink)}
.projects{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px;padding-bottom:150px}
.project{border-top:1px solid var(--rule);padding:25px 0 40px}
.project h3{font:400 clamp(38px,4.2vw,70px) 'Italiana',Georgia,serif;margin:22px 0 8px}
.project p{color:#6c6964;font-size:12px;line-height:1.8}
.project-art{height:330px;display:grid;place-items:center;margin-top:22px;background:#e4e0d7;color:#202020;font:400 clamp(37px,4.2vw,72px) 'Italiana',Georgia,serif;text-align:center;padding:20px;line-height:1.06;border:1px solid #dedbd5}
.project:nth-child(2) .project-art{background:#d8d4ca}
.closing{padding:110px 0 155px;border-top:1px solid var(--ink);text-align:center}
.closing h2{margin:28px 0 40px}
footer{border-top:1px solid var(--rule);padding:35px 5.4%;display:flex;justify-content:space-between;gap:20px;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#4c4a46}
.pagehead{padding:116px 0 104px;border-bottom:1px solid var(--ink);text-align:center}
.pagehead h1{font-size:clamp(85px,11vw,170px);max-width:1400px;margin:30px auto}
.pagehead .bodycopy{max-width:520px;margin:20px auto 0}
.service-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px 70px;padding:100px 0 140px}
.service{border-top:1px solid var(--rule);padding:35px 0 72px}
.service h2{font:400 clamp(44px,5vw,76px) 'Italiana',Georgia,serif;line-height:1;margin:22px 0}
.service p{max-width:530px;color:#55534f;font-size:14px;line-height:2}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:13%;padding:120px 0 165px}
.contact-grid h2{font:400 clamp(46px,5vw,78px) 'Italiana',Georgia,serif;margin:20px 0 32px;line-height:1}
.contact-link{display:inline-block;font-size:clamp(15px,1.65vw,24px);border-bottom:1px solid var(--ink);padding-bottom:10px;word-break:break-word}
.contact-note{font-size:13px;line-height:2;color:#66635d;max-width:380px;margin-top:30px}
.tag{border-top:1px solid var(--rule);margin:50px 0 0;padding:25px 0;font-size:10px;letter-spacing:.17em;display:inline-block}
.fields{display:grid;gap:28px}
.fields label{font-size:10px;font-weight:600;letter-spacing:.17em;text-transform:uppercase}
.fields input,.fields textarea{display:block;width:100%;padding:17px 0;border:0;border-bottom:1px solid #9e9a94;background:transparent;color:var(--ink);font:14px 'Manrope',Arial,sans-serif;outline:none;border-radius:0}
.fields input:focus,.fields textarea:focus{border-color:#161616}
.fields textarea{min-height:120px;resize:vertical}
.send{background:var(--ink);color:var(--paper);border:1px solid var(--ink);padding:19px 22px;font:600 10px 'Manrope',sans-serif;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;transition:background .2s,color .2s}
.send:hover{background:transparent;color:var(--ink)}
.form-status{font-size:11px;line-height:1.7;color:#77736d}
@media(max-width:900px){header{grid-template-columns:1fr auto;min-height:105px;padding:20px 5%}header:before{display:none}.brand{grid-column:1;justify-self:start;text-align:left;font-size:clamp(28px,5vw,42px)}nav{grid-column:2;gap:17px}.brand span{font-size:8px}.hero h1{font-size:clamp(72px,12vw,130px)}.intro{padding-top:110px;padding-bottom:130px}.intro h2{font-size:clamp(60px,8vw,95px)}}
@media(max-width:650px){header{display:flex;flex-direction:column;align-items:center;gap:25px;padding:24px 5% 20px}.brand{text-align:center;font-size:40px}.brand span{font-size:8px;margin-top:8px}nav{justify-self:center;gap:33px}.wrap{padding:0 5%}.hero{padding-top:35px}.hero-top{padding:15px 0 36px}.hero h1{font-size:clamp(65px,14vw,95px)}.hero-top p{font-size:12px;line-height:1.8}.hero-feature{min-height:500px;height:75vh}.film-info{left:6%;right:6%;bottom:6%;display:block}.film-info h2{font-size:clamp(52px,11vw,73px)}.film-info .pill{margin-top:15px}.intro{grid-template-columns:1fr;gap:10px;padding-top:90px;padding-bottom:100px}.intro>div:last-child{padding-top:10px}.intro h2,.section-head h2,.closing h2{font-size:70px}.projects,.service-grid,.contact-grid{grid-template-columns:1fr}.projects{padding-bottom:100px}.project-art{height:250px}.closing{padding:85px 0 100px}.pagehead{padding:80px 0 65px}.pagehead h1{font-size:clamp(70px,14vw,110px)}.service-grid{gap:0;padding:65px 0 90px}.service{padding-bottom:50px}.contact-grid{gap:60px;padding:75px 0 100px}footer{flex-wrap:wrap;padding:26px 5%;line-height:1.7}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* RAO editorial set transformation */
.transformation{padding-top:70px;padding-bottom:155px;border-top:1px solid var(--ink)}
.transform-header{display:grid;grid-template-columns:minmax(0,1fr) 34%;column-gap:8%;align-items:end;padding-bottom:65px}
.transform-header .eyebrow{grid-column:1 / -1;margin-bottom:16px}
.transform-header h2{font:400 clamp(64px,8vw,132px)/.92 'Italiana',Georgia,serif;letter-spacing:-.035em;margin:0}
.transform-header h2 em{font-weight:400;font-style:italic}
.transform-header p{font-size:14px;line-height:2;color:#57534e;max-width:370px;margin:0 0 9px}
.transform-heading{border-top:1px solid var(--rule);display:flex;align-items:baseline;gap:26px;padding:30px 0 25px}
.transform-heading h3{font:400 clamp(46px,5vw,84px)/1 'Italiana',Georgia,serif;letter-spacing:.01em;margin:0}
.transform-index,.transform-kind{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#66625e}
.transform-kind{margin-left:auto;text-align:right}
.transform-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.transform-figure{min-width:0;margin:0}
.comparison{--split:50%;width:100%;aspect-ratio:4 / 3;position:relative;isolation:isolate;overflow:hidden;background:#bdb7ae;touch-action:pan-y}
.comparison img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;display:block;user-select:none;pointer-events:none}
.comparison .compare-before{clip-path:inset(0 calc(100% - var(--split)) 0 0);z-index:1}.comparison .compare-after{z-index:0}
.compare-label{position:absolute;z-index:3;top:20px;padding:9px 12px;background:rgba(248,247,243,.94);font-size:9px;font-weight:700;letter-spacing:.19em;color:#171717;pointer-events:none}
.compare-label-left{left:20px}.compare-label-right{right:20px}
.compare-divider{position:absolute;left:var(--split);top:0;height:100%;width:1px;background:#fff;z-index:4;pointer-events:none;box-shadow:0 0 2px rgba(0,0,0,.3)}
.compare-handle{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border:1px solid #171717;background:var(--paper);color:#171717;border-radius:50%;width:56px;height:56px;display:flex;align-items:center;justify-content:center;font-size:22px;white-space:nowrap;letter-spacing:-.12em;box-shadow:0 2px 18px #0002}
.comparison input[type=range]{position:absolute;inset:0;z-index:5;width:100%;height:100%;margin:0;cursor:ew-resize;appearance:none;-webkit-appearance:none;background:transparent;opacity:.001;touch-action:pan-y}
.comparison input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:55px;height:55px;background:transparent;border:0}
.comparison input[type=range]::-moz-range-thumb{width:55px;height:55px;background:transparent;border:0}
.comparison:focus-within{outline:2px solid #8e7964;outline-offset:3px}
.transform-figure figcaption{padding:17px 0;color:#68635e;font-size:10px;letter-spacing:.17em;text-transform:uppercase}
.transform-note{margin:19px 0 0;color:#67635e;font-size:12px;letter-spacing:.03em}
@media(max-width:800px){.transformation{padding-top:65px;padding-bottom:100px}.transform-header{display:block;padding-bottom:45px}.transform-header h2{font-size:clamp(56px,10vw,88px);margin:18px 0 26px}.transform-header p{max-width:500px}.transform-grid{grid-template-columns:1fr;gap:22px}.transform-heading{flex-wrap:wrap;gap:12px 18px}.transform-heading h3{font-size:65px}.transform-kind{flex-basis:100%;margin:0;text-align:left}.compare-label{top:12px;padding:7px 9px}.compare-label-left{left:12px}.compare-label-right{right:12px}}

/* Editorial project photography */
.project-art-photo{padding:0;overflow:hidden;background:#e4e0d7;border:0;height:auto;aspect-ratio: 1.82 / 1;display:block}
.project-art-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .65s ease}
.project-art-photo:hover img{transform:scale(1.02)}

/* Selected Work filmography */
.selected-work-heading{color:inherit;text-decoration:none;display:inline-block}
.heading-arrow{font:400 .45em 'Manrope',sans-serif;vertical-align:middle;opacity:.55;transition:opacity .2s,transform .2s;display:inline-block}
.selected-work-heading:hover .heading-arrow{opacity:1;transform:translate(5px,-4px)}
.all-work-link{display:table;margin:-100px auto 105px}
.work-intro{padding-top:100px;padding-bottom:65px}
.work-intro>.eyebrow{text-align:center}
.work-intro h1{font:400 clamp(100px,13vw,205px)/.77 'Italiana',Georgia,serif;letter-spacing:-.05em;text-align:center;margin:33px 0 75px}
.work-intro h1 em{font-style:italic;font-weight:400}
.work-intro-bottom{border-top:1px solid var(--ink);padding-top:26px;display:flex;justify-content:space-between;align-items:start;gap:25px}
.work-intro-bottom span,.work-card-top{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#625e5a}
.work-intro-bottom p{font-size:14px;line-height:1.9;color:#514f4a;max-width:400px;margin:0}
.work-collection{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px;row-gap:72px;padding-bottom:140px}
.work-card{min-width:0}
.work-card-top{border-top:1px solid var(--rule);padding:19px 0 18px;display:flex;justify-content:space-between;gap:20px}
.work-image{display:block;aspect-ratio:1.58 / 1;overflow:hidden;background:#dedad1}
.work-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s ease}
.work-image:hover img{transform:scale(1.025)}
.work-card-details{padding:23px 0 0}
.work-card-details h2{font:400 clamp(36px,4.4vw,72px)/1.05 'Italiana',Georgia,serif;margin:0 0 8px}
.work-card-details p{font-size:11px;line-height:1.8;color:#65605a;letter-spacing:.025em;margin:0}
.work-type-art{height:100%;display:grid;place-items:center;text-align:center;font:400 clamp(45px,5.4vw,95px)/.95 'Italiana',Georgia,serif;color:#3b3731;background:linear-gradient(135deg,#eeeae2,#d0cabf);padding:24px}
.work-tail{border-top:1px solid var(--ink);padding-top:70px;padding-bottom:130px;text-align:center}
.work-tail p{font:400 clamp(31px,4vw,53px)/1.2 'Italiana',Georgia,serif;margin:25px auto;max-width:650px}
@media(max-width:900px){header nav{flex-wrap:wrap;justify-content:flex-end;row-gap:12px}.work-intro h1{font-size:clamp(85px,13vw,135px)}}
@media(max-width:650px){header nav{justify-content:center;gap:13px 19px}.all-work-link{margin:-65px auto 80px}.work-intro{padding-top:65px}.work-intro h1{font-size:clamp(83px,17vw,118px);margin:25px 0 55px}.work-intro-bottom{display:block}.work-intro-bottom p{margin-top:20px}.work-collection{grid-template-columns:1fr;gap:55px;padding-bottom:95px}.work-card-details h2{font-size:53px}.work-tail{padding-bottom:95px}}

/* Additional filmography listing */
.filmography-section{border-top:1px solid var(--ink);padding-top:85px;padding-bottom:120px}
.filmography-lead{display:grid;grid-template-columns:1fr 1fr;gap:10%;align-items:end;margin-bottom:70px}
.filmography-lead h2{font:400 clamp(65px,8vw,128px)/.9 'Italiana',Georgia,serif;letter-spacing:-.035em;margin:22px 0 0}
.filmography-lead h2 em{font-style:italic;font-weight:400}
.filmography-lead p{font-size:14px;line-height:2;color:#5b5752;max-width:325px;margin:0 0 6px}
.filmography-list{list-style:none;padding:0;margin:0;border-top:1px solid var(--rule)}
.filmography-row{display:grid;grid-template-columns:68px minmax(0,1fr) 85px;align-items:baseline;gap:18px;border-bottom:1px solid var(--rule);padding:26px 0 29px}
.filmography-number,.filmography-category{font:600 10px 'Manrope',Arial,sans-serif;letter-spacing:.16em;color:#6e6962;text-transform:uppercase}
.filmography-name{font:400 clamp(30px,4.2vw,63px)/1.13 'Italiana',Georgia,serif;letter-spacing:-.015em}
.filmography-category{text-align:right}
@media(max-width:650px){.filmography-section{padding-top:65px;padding-bottom:85px}.filmography-lead{display:block;margin-bottom:50px}.filmography-lead h2{font-size:75px}.filmography-lead p{margin-top:24px}.filmography-row{grid-template-columns:30px minmax(0,1fr);gap:12px;padding:23px 0}.filmography-name{font-size:clamp(29px,8vw,43px)}.filmography-category{display:none}}
