@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Libre+Caslon+Display&display=swap');
:root{color-scheme:dark;--bg:#101110;--ink:#f1f1e9;--muted:#abab9f;--line:#353731;--accent:#d2e37d}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:36px}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;font-size:16px;line-height:1.65}a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid var(--accent);outline-offset:6px}header{padding:30px 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:24px}.brand{font-size:25px;font-weight:700;line-height:1;letter-spacing:-1.1px;display:inline-block}.brand span{display:block;font-size:10px;letter-spacing:4.9px;line-height:2.2}nav{display:flex;gap:34px;font-size:14px}nav a:hover,.text-link:hover{color:var(--accent)}.contact{font-size:14px;border-bottom:1px solid #8a8d7f;padding-bottom:5px}.contact span{padding-left:20px}.hero{padding:30px 5% 0}.hero-top{display:flex;justify-content:space-between;font-size:12px;letter-spacing:1.5px;color:var(--muted)}h1{font-size:clamp(64px,8.8vw,144px);letter-spacing:-.065em;line-height:1.05;font-weight:500;margin:48px 0 26px}em{font-family:'Libre Caslon Display',Georgia,serif;font-weight:400;letter-spacing:-.04em}h1 em{color:var(--accent)}.hero-bottom{display:flex;align-items:center;justify-content:space-between;margin-bottom:38px;gap:24px}.hero-bottom p{color:var(--muted);font-size:17px;margin:0}.round-link{display:flex;align-items:center;gap:24px;font-size:14px}.round-link b{display:grid;place-items:center;font-size:25px;width:50px;height:50px;border:1px solid #64675d;border-radius:50%;font-weight:400}.hero-image{position:relative;height:clamp(270px,42vw,620px);overflow:hidden;background:#252522}.hero-image img{width:100%;height:100%;object-fit:cover;object-position:center 40%}.image-shade{position:absolute;inset:0;background:linear-gradient(transparent 50%,#0009)}.image-caption{position:absolute;bottom:24px;left:28px;right:28px;display:flex;align-items:end;justify-content:space-between}.image-caption>span:first-child{font-size:12px;letter-spacing:1.5px}.image-caption>span:last-child{font-size:27px;font-weight:500}.image-caption i{display:block;font-size:13px;font-style:normal;font-weight:400;color:#ddd}.section{padding:100px 5%}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:44px}.eyebrow{display:block;color:var(--muted);font-size:12px;letter-spacing:1.5px;margin-bottom:25px}h2{font-size:clamp(38px,5vw,76px);font-weight:500;line-height:1.1;letter-spacing:-.045em;margin:0}h3{font-weight:500}.section-heading>p{max-width:370px;color:var(--muted);margin:0;font-size:16px}.work-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}.work-image{position:relative;aspect-ratio:16/11;background:#242622;overflow:hidden}.work-image img{width:100%;height:100%;object-fit:cover;transition:transform .6s}.work:hover img{transform:scale(1.035)}.work-action{position:absolute;bottom:20px;left:20px;background:#101110df;padding:9px 15px;font-size:13px;border:1px solid #ffffff30}.work-label{display:flex;justify-content:space-between;align-items:center;gap:15px}.work-label h3{font-size:23px;letter-spacing:-.5px;margin:16px 0}.work-label span{font-size:13px;color:var(--muted)}.film-row{display:flex;align-items:center;justify-content:space-between;gap:30px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:50px;padding:32px 0}.film-row .eyebrow{margin-bottom:12px}.film-row h3{font-size:30px;margin:0;letter-spacing:-1px}.film-row p{margin:7px 0 0;color:var(--muted);font-size:14px}.film-link{font-size:14px}.services{background:#1a1c18}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:45px;margin-top:65px}.service-grid article{border-top:1px solid #4b4e43;padding-top:22px}.number{font-size:13px;color:var(--accent)}.service-grid h3{font-size:23px;line-height:1.3;margin:35px 0 17px}.service-grid p{color:var(--muted);margin:0}.about{display:grid;grid-template-columns:1.15fr 1fr;gap:9%;padding-top:110px;padding-bottom:110px}.about h2{font-size:clamp(38px,4.1vw,63px)}.about h2 em{display:inline-block;margin-top:8px}.bio p{color:var(--muted);margin:0 0 22px}.bio p.lead{color:var(--ink);font-size:23px;line-height:1.5}.text-link{display:inline-block;border-bottom:1px solid #62665b;padding-bottom:5px;margin-top:8px;font-size:14px}.closing{background:var(--accent);color:#171b0f}.closing .eyebrow{color:#505b32}.closing h2{font-size:clamp(64px,8vw,125px);line-height:1.03}.closing-bottom{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-top:40px}.closing-bottom p{margin:0;color:#394225}.email{font-size:clamp(17px,2.3vw,32px);border-bottom:1px solid #5f6c38;padding-bottom:4px;overflow-wrap:anywhere}footer{display:flex;align-items:center;justify-content:space-between;padding:40px 5%;gap:20px}footer>span,footer>a:last-child{font-size:13px;color:var(--muted)}@media(min-width:1700px){body{max-width:1800px;margin:auto}}@media(max-width:750px){header{padding:22px 6%;flex-wrap:wrap}nav{gap:22px;font-size:14px;order:3;width:100%;padding-top:10px}.brand{font-size:22px}.contact{font-size:13px}.hero{padding:24px 6% 0}.hero-top{font-size:10px}.hero-top span:last-child{display:none}h1{font-size:clamp(54px,12vw,90px);margin-top:35px}.hero-bottom{align-items:start}.hero-bottom p{font-size:15px;max-width:250px}.hero-bottom p br{display:none}.round-link{gap:0}.round-link>span{display:none}.round-link b{width:42px;height:42px}.hero-image{height:300px}.image-caption{left:18px;right:18px;bottom:18px}.section{padding:66px 6%}.section-heading{display:block;margin-bottom:30px}.section-heading>p{margin-top:24px}.eyebrow{font-size:11px;margin-bottom:18px}.work-grid{grid-template-columns:1fr;gap:24px}.work-label h3{font-size:22px}.work-label span{font-size:12px}.film-row{display:block;margin-top:30px}.film-link{display:inline-block;margin-top:22px}.film-row h3{font-size:27px}.service-grid{grid-template-columns:1fr;gap:35px;margin-top:35px}.service-grid h3{margin-top:18px}.about{grid-template-columns:1fr;gap:30px}.bio p.lead{font-size:21px}.closing-bottom{display:block}.email{display:inline-block;margin-top:30px}footer{flex-wrap:wrap;padding:32px 6%}footer>span{order:3;width:100%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.work-image img{transition:none}}
/* Film-led direction */
:root{--bg:#0c1014;--ink:#f1f4f6;--muted:#a3aeb6;--line:#2c343b;--accent:#bed7e6}header{position:absolute;z-index:5;top:0;left:0;width:100%;border-bottom:1px solid #ffffff22;background:linear-gradient(#070e17a8,transparent)}.brand{width:150px;letter-spacing:0;line-height:1;flex:none}.brand strong{font-size:25px;letter-spacing:.2px;display:block;line-height:1.1;font-weight:700}.brand .brand-sub{display:flex;justify-content:space-between;width:100%;font-size:10px;letter-spacing:0;line-height:1.8;margin-top:2px}.brand-sub i{font-style:normal}.film-hero{position:relative;min-height:790px;height:100svh;max-height:1180px;overflow:hidden;background:#0c151d}.poster-surface{position:absolute;inset:0 0 0 29%;overflow:hidden}.poster-surface img{width:100%;height:100%;object-fit:cover;object-position:50% 63%;animation:poster-drift 22s ease-in-out infinite alternate}.hero-veil{position:absolute;inset:0;background:linear-gradient(90deg,#0c1014 4%,#0c1014df 24%,#0c10148a 44%,transparent 70%),linear-gradient(0deg,#0c1014 0%,transparent 24%)}.feature-copy{position:relative;z-index:1;padding:220px 5% 130px;max-width:1000px}.feature-copy .eyebrow{color:#bacbd7}.feature-copy h1{font-size:clamp(75px,8.7vw,142px);line-height:.97;margin:37px 0 30px;letter-spacing:-.055em}.feature-copy h1 em{color:#e2edf5}.feature-copy>p{font-size:17px;color:#b5c5d1}.watch-button{display:inline-flex;align-items:center;gap:18px;margin-top:24px;font-size:16px}.play-circle{display:grid;place-items:center;width:62px;height:62px;border:1px solid #c7d9e789;border-radius:50%;font-size:17px;padding-left:3px;transition:background .3s,color .3s,transform .3s}.watch-button:hover .play-circle{background:#d5e7f4;color:#14222c;transform:scale(1.06)}.hero-foot{position:absolute;bottom:32px;left:5%;right:5%;display:flex;align-items:center;justify-content:space-between;z-index:2;gap:20px}.hero-foot>span{font-size:11px;letter-spacing:1.6px;color:#94a2ad}.hero-foot>a{font-size:14px}.works{padding-top:85px}.works .section-heading{align-items:center}.works .section-heading h2{font-size:70px}.works .section-heading .eyebrow{margin:0}.work-grid{gap:40px 28px}.work-wide{grid-column:1/-1}.work-wide .work-image{aspect-ratio:2.35}.work-image{aspect-ratio:16/10}.work-image img{filter:saturate(.87);transition:transform .8s cubic-bezier(.2,.65,.3,1),filter .8s}.work:hover img{filter:saturate(1);transform:scale(1.035)}.work-action{background:#0c1014b8;backdrop-filter:blur(10px);border-radius:40px;padding:10px 17px}.work-label h3{font-size:25px}.services{background:#141b20}.service-grid article{border-color:#3e4b55}.closing{background:#c4d6e0;color:#13222c}.closing .eyebrow,.closing-bottom p{color:#3f5665}.email{border-color:#6f8796}.about h2{font-size:clamp(36px,4vw,64px)}.reveal{opacity:1;transform:none}.motion-enabled .reveal.pending{opacity:0;transform:translateY(26px)}.motion-enabled .reveal{transition:opacity .85s ease,transform .85s cubic-bezier(.2,.7,.3,1)}dialog{width:min(1100px,94vw);max-height:94svh;padding:22px;background:#10171e;color:var(--ink);border:1px solid #40515e}dialog::backdrop{background:#03070ced;backdrop-filter:blur(9px)}.video-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px}.video-heading h2{font:500 20px 'DM Sans',Arial,sans-serif;letter-spacing:-.3px}.video-heading button{border:1px solid #566674;background:transparent;color:white;font:inherit;padding:7px 16px;cursor:pointer}#video-frame{aspect-ratio:16/9;background:black}#video-frame iframe{width:100%;height:100%;border:0}#video-original{display:inline-block;font-size:14px;color:#b1c4d2;margin-top:17px}@keyframes poster-drift{from{transform:scale(1)}to{transform:scale(1.055)}}@media(max-width:750px){header{padding:20px 6%}.brand{width:138px}.brand strong{font-size:23px}header nav{padding-top:3px}.film-hero{height:90svh;min-height:730px;max-height:1000px}.poster-surface{inset:0}.poster-surface img{object-position:60% 67%;opacity:.8}.hero-veil{background:linear-gradient(90deg,#0c1014ab,transparent 95%),linear-gradient(0deg,#0c1014 0%,transparent 36%,#0c10145e 75%)}.feature-copy{padding:210px 6% 120px}.feature-copy .eyebrow{font-size:10px;letter-spacing:1px}.feature-copy h1{font-size:clamp(65px,13vw,95px);margin-top:25px}.feature-copy>p{max-width:235px;font-size:15px}.watch-button{margin-top:20px}.hero-foot{left:6%;right:6%;bottom:26px}.hero-foot>span{max-width:200px;font-size:9px}.works .section-heading h2{font-size:52px}.works .section-heading{display:flex}.works .section-heading .eyebrow{display:none}.work-wide{grid-column:auto}.work-wide .work-image{aspect-ratio:16/10}.work-label h3{font-size:21px}.closing h2{font-size:clamp(54px,12vw,84px)}dialog{padding:14px}.video-heading h2{font-size:17px}}@media(prefers-reduced-motion:reduce){.poster-surface img{animation:none}.motion-enabled .reveal.pending{opacity:1;transform:none}.motion-enabled .reveal,.play-circle,.work-image img{transition:none}}

.brand{width:max-content;display:inline-grid;grid-template-columns:max-content}.brand strong{letter-spacing:0}.brand .brand-sub{min-width:0;width:100%}

/* Optical logo alignment and seamless film atmosphere */
.brand{position:relative;display:inline-block;width:max-content;padding-bottom:10px}
.brand strong{line-height:1;letter-spacing:0}
.brand .brand-sub{position:absolute;left:3%;bottom:0;width:94%;margin:0;font-size:8px;line-height:1;letter-spacing:0}
.film-hero{background:var(--bg)}
.poster-surface{left:20%;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#0005 18%,#000 46%);mask-image:linear-gradient(90deg,transparent 0%,#0005 18%,#000 46%)}
.poster-surface img{animation:film-breathe 12s ease-in-out infinite alternate;transform-origin:65% 60%}
.hero-veil{pointer-events:none;background:linear-gradient(90deg,#0c1014 0%,#0c1014b8 28%,#0c101440 49%,transparent 72%),linear-gradient(0deg,#0c1014 0%,transparent 27%)}
.feature-copy>*{animation:film-entrance 1.25s cubic-bezier(.16,1,.3,1) both}
.feature-copy>h1{animation-delay:.12s}.feature-copy>p{animation-delay:.24s}.feature-copy>.watch-button{animation-delay:.36s}
.hero-foot>a{animation:scroll-invite 3s ease-in-out infinite}
.motion-enabled .reveal.pending{transform:translateY(44px)}
.motion-enabled .reveal{transition:opacity 1s ease,transform 1.1s cubic-bezier(.16,1,.3,1)}
.work-image:after{content:"";position:absolute;inset:0;border:1px solid #ffffff00;transition:border-color .5s;pointer-events:none}
.work:hover .work-image:after{border-color:#bed7e655}
@keyframes film-entrance{from{opacity:0;transform:translateY(30px);filter:blur(5px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
@keyframes film-breathe{from{transform:scale(1.015) translateX(-.5%)}to{transform:scale(1.095) translateX(.5%)}}
@keyframes scroll-invite{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
@media(max-width:750px){.poster-surface{left:0;-webkit-mask-image:linear-gradient(90deg,transparent,#0009 22%,#000 55%);mask-image:linear-gradient(90deg,transparent,#0009 22%,#000 55%)}.hero-veil{background:linear-gradient(90deg,#0c101477,transparent 95%),linear-gradient(0deg,#0c1014 0%,transparent 36%,#0c10145e 75%)}}
@media(prefers-reduced-motion:reduce){.feature-copy>*,.poster-surface img,.hero-foot>a{animation:none}.motion-enabled .reveal.pending{transform:none}.work-image:after{transition:none}}

/* Preserve the full widescreen Christmas ad inside the shared portfolio frame. */
.work-letterbox{background:#000}
.work-letterbox img{display:block;object-fit:contain;object-position:center}
.work:hover .work-letterbox img{transform:none}

.hero-snow{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:1}
@media(prefers-reduced-motion:reduce){.hero-snow{display:none}}

/* Equal portfolio frames let each player preserve its native image ratio. */
.work-embedded .work-image{background:#000}
.work-embedded iframe{display:block;width:100%;height:100%;border:0;position:absolute;inset:0}
.work-embedded .work-label{align-items:baseline}
.work-label h3 small{font-size:15px;font-weight:400;letter-spacing:0;color:var(--muted)}
