@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700&family=Caveat:wght@500;600&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#070b0e;--ink:#f0f0ee;--soft:#c5ccd1;--blue:#3d8bff}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font-family:Manrope,Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}a{color:inherit;text-decoration:none}.hero{position:relative;isolation:isolate;min-height:640px;height:100svh;overflow:hidden;background:#070b0e}.reel,.shade{position:absolute;inset:0;width:100%;height:100%}.reel{object-fit:cover;object-position:50% 50%;z-index:-3;animation:reveal 1s ease both}.shade{z-index:-2;background:linear-gradient(90deg,rgba(3,8,11,.78) 0%,rgba(3,8,11,.40) 35%,rgba(3,8,11,.05) 72%),linear-gradient(0deg,rgba(3,8,11,.62),transparent 32%,transparent 75%,rgba(3,8,11,.36))}.header{display:flex;align-items:center;justify-content:space-between;padding:36px 5.3vw;gap:25px}.wordmark{font-size:14px;font-weight:700;letter-spacing:.27em}.header nav{display:flex;gap:32px;font-size:12px;font-weight:600;letter-spacing:.2em}.header nav span{cursor:default}.intro{position:absolute;left:5.3vw;top:50%;transform:translateY(-43%);max-width:80%;animation:textIn .8s ease both}.eyebrow{color:#b8c3cc;font-size:12px;letter-spacing:.24em;margin:0 0 20px}h1{font-size:clamp(55px,6.8vw,112px);line-height:.99;letter-spacing:-.055em;font-weight:800;margin:0}h1 span{display:block}.hello{font-size:.42em;letter-spacing:-.025em;line-height:1.35;margin-bottom:14px}.description{color:#d1d6da;font-size:clamp(16px,1.4vw,21px);line-height:1.6;max-width:440px;margin:24px 0 0}.controls{position:absolute;bottom:38px;right:5.3vw;display:flex;gap:28px}.control{padding:10px 0;min-height:44px;display:flex;gap:12px;align-items:center;border:0;background:none;color:var(--ink);font-size:12px;letter-spacing:.15em;cursor:pointer}.control svg{width:21px;height:21px}.control:hover{color:#b3c8db}.control:focus-visible,.wordmark:focus-visible{outline:2px solid #c1d5e8;outline-offset:8px}#playIcon{font-size:20px;line-height:1;width:18px}.media-status{position:absolute;bottom:40px;left:5.3vw;font-size:14px;max-width:55%;color:var(--soft)}@keyframes reveal{from{opacity:0}to{opacity:1}}@keyframes textIn{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}@media(min-width:1800px){.intro{left:7vw}.header{padding-inline:7vw}}@media(max-width:700px){.hero{min-height:580px}.header{padding:26px 6vw;align-items:flex-start}.wordmark{font-size:12px;letter-spacing:.18em;max-width:120px;line-height:1.7}.header nav{gap:15px;font-size:10px;letter-spacing:.1em;padding-top:4px}.intro{left:6vw;top:51%;max-width:90%}h1{font-size:clamp(43px,10.8vw,74px)}.eyebrow{font-size:11px;margin-bottom:22px}.description{max-width:290px;font-size:16px;margin-top:23px}.shade{background:linear-gradient(90deg,rgba(3,8,11,.65),rgba(3,8,11,.15)),linear-gradient(0deg,rgba(3,8,11,.75),transparent 80%)}.controls{right:6vw;bottom:25px;gap:24px}.media-status{bottom:78px;left:6vw;max-width:88%}.reel{object-position:55% center}}@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}@media(max-height:600px) and (min-width:701px){.hero{min-height:480px}.intro{top:48%}h1{font-size:60px}.header{padding-top:23px}.description{margin-top:15px}.controls{bottom:20px}}
html{scroll-behavior:smooth;scroll-padding-top:24px}nav a{transition:opacity .2s}nav a:hover{opacity:.6}h2{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;font-weight:700;font-size:clamp(56px,6.2vw,100px);line-height:.95;letter-spacing:-.025em;margin:0}.small-label{font-size:12px;line-height:1.7;letter-spacing:.18em}.work-section{padding:70px 0 80px;background:#070b0d}.section-head{display:flex;align-items:center;justify-content:space-between;gap:25px;margin:0 4.7vw 35px}.carousel-controls{display:flex;gap:14px}.circle-button{width:46px;height:46px;border:1px solid #6c7276;border-radius:50%;background:none;color:var(--ink);font-size:23px;cursor:pointer;transition:background .2s,color .2s}.circle-button:hover{background:var(--ink);color:var(--bg)}.carousel{overflow-x:auto;scrollbar-width:none;cursor:grab;padding:0 1.8vw;touch-action:pan-x pan-y}.carousel::-webkit-scrollbar{display:none}.project-track{display:flex;gap:18px;position:relative}.project-card{flex:0 0 calc((100% - 54px)/4);min-width:0}.card-media{aspect-ratio:4/3;position:relative;overflow:hidden;background:#10181e}.card-media img,.card-media video{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .55s ease,opacity .3s}.card-media video{opacity:0}.previewing .card-media video{opacity:1}.project-card a:hover img{transform:scale(1.035)}.view-project{position:absolute;bottom:16px;left:16px;padding:9px 12px;font-size:10px;letter-spacing:.14em;background:rgba(5,9,12,.8);opacity:0;transform:translateY(8px);transition:.25s}.project-card a:hover .view-project,.project-card a:focus-visible .view-project{opacity:1;transform:none}.project-card h3{font-size:16px;margin:16px 0 6px;font-weight:700}.project-card p{color:#acb6bc;font-size:11px;letter-spacing:.16em;margin:0}.dragging{cursor:grabbing;user-select:none}.dragging a{pointer-events:none}.about-section{min-height:85svh;display:grid;grid-template-columns:1fr 1fr;background:#0a1014}.portrait-wrap{min-height:640px;overflow:hidden;position:relative}.portrait{height:100%;width:100%;position:absolute;object-fit:cover;object-position:center 34%;filter:grayscale(1) brightness(.7);transition:filter .8s}.portrait-wrap:hover .portrait{filter:grayscale(.5) brightness(.8)}.about-copy{padding:8vw 6vw 6vw;align-self:center}.about-intro{font-size:clamp(19px,1.65vw,26px);line-height:1.5;color:#e1e5e8;margin:28px 0 18px}.about-body{font-size:16px;line-height:1.8;color:#aeb9c0;max-width:520px}.clients{margin-top:45px}.clients .small-label{font-size:10px;color:#aeb9c0}.client-list{display:flex;align-items:center;flex-wrap:wrap;gap:15px 22px;margin-top:22px;font-size:17px;font-weight:800}.client-f1{font-style:italic}.client-imax{font-weight:800;letter-spacing:-.05em}.client-visa{font-style:italic}.credentials{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:55px}.credentials>div{border-left:1px solid #596168;padding-left:20px}.credentials strong{font-weight:400;font-size:clamp(22px,2.25vw,38px);display:block}.credentials span{font-size:9px;letter-spacing:.15em;line-height:1.6;display:block;margin-top:10px}.contact-section{min-height:90svh;position:relative;display:grid;grid-template-columns:44% 56%;align-items:center;padding:90px 5.3vw 120px;background:#05090c;gap:0}.contact-heading>.small-label{color:#b7c3cb;letter-spacing:.2em;margin-bottom:24px}.contact-heading h2{font-size:clamp(110px,16.5vw,290px);line-height:.82;letter-spacing:-.04em}.contact-copy{padding-top:75px;padding-left:3vw}.contact-copy>.small-label{color:#a7b5c0;line-height:2}.email{display:inline-block;font-size:clamp(18px,2.6vw,43px);letter-spacing:-.05em;margin-top:25px;padding-bottom:14px;border-bottom:1px solid #939ca3;max-width:100%;overflow-wrap:anywhere;transition:color .25s}.email:hover{color:#a7c4dc}.socials{display:flex;gap:30px;flex-wrap:wrap;margin-top:56px}.socials a{font-size:11px;letter-spacing:.17em;text-transform:uppercase}.socials a:hover{text-decoration:underline;text-underline-offset:6px}footer{position:absolute;bottom:30px;left:5.3vw;right:5.3vw;display:flex;justify-content:space-between;gap:20px;color:#82919b;font-size:10px;letter-spacing:.16em}.reveal{opacity:0;transform:translateY(22px);transition:opacity .8s,transform .8s}.reveal.is-visible{opacity:1;transform:none}:focus-visible{outline:2px solid #c1d5e8;outline-offset:5px}.project-page .header{border-bottom:1px solid #20282e}.project-page main{padding:70px 5.3vw 0}.project-heading{margin-bottom:45px}.project-heading h1{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;font-size:clamp(52px,8vw,132px);letter-spacing:-.02em}.project-heading .small-label{color:#98a8b4}.project-video,.embed-wrap{width:100%;aspect-ratio:16/9;background:#000;display:block}.project-video{object-fit:contain}.embed-wrap{position:relative}.embed-wrap iframe{width:100%;height:100%;position:absolute;inset:0;border:0}.project-details{display:grid;grid-template-columns:1.3fr 1fr;gap:8vw;padding:55px 0}.project-description{font-size:clamp(18px,1.8vw,28px);line-height:1.65;color:#c8d0d7;margin:0}.project-meta{display:flex;flex-wrap:wrap;gap:24px 36px;margin:0}.project-meta dt,.credits-detail dt{font-size:10px;letter-spacing:.17em;color:#8c9aa4}.project-meta dd,.credits-detail dd{font-size:16px;line-height:1.5;margin:8px 0 0}.credits-detail{border-top:1px solid #283138;border-bottom:1px solid #283138;padding:24px 0;margin-bottom:70px}.credits-detail summary{cursor:pointer;font-size:12px;letter-spacing:.16em}.credits-detail dl{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin:35px 0 10px}.breakdown{margin:70px 0}.breakdown h2{font-size:50px;margin-bottom:30px}.gallery{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:60px 0}.gallery img{width:100%;height:auto}.gallery img:first-child:last-child{grid-column:1/-1}.next-project{display:block;padding:70px 0 85px;border-top:1px solid #283138}.next-project .small-label{display:block;color:#97a7b2}.next-project strong{display:block;font-family:'Barlow Condensed',Impact,sans-serif;font-size:clamp(50px,8vw,110px);line-height:1.05;margin-top:20px;transition:color .3s}.next-project:hover strong{color:#9cb8d0}.project-footer{position:static;padding:35px 5.3vw;background:#030608}.playback-error{font-size:16px;color:#c3cbd0}
@media(min-width:1600px){.work-section{padding-top:95px;padding-bottom:105px}}@media(max-width:1000px){.about-copy{padding:60px 5vw}.portrait-wrap{min-height:680px}.credentials{gap:12px}.credentials>div{padding-left:12px}.credentials strong{font-size:25px}.project-card{flex-basis:calc((100% - 36px)/3)}.client-list{gap:14px;font-size:15px}}@media(max-width:700px){.work-section{padding:45px 0 50px}.section-head{margin:0 6vw 28px;align-items:flex-end}.section-head h2{font-size:47px;max-width:65%}.circle-button{width:38px;height:38px;font-size:20px}.carousel-controls{gap:8px}.carousel{padding-inline:6vw}.project-track{gap:14px}.project-card{flex-basis:82%}.project-card h3{font-size:16px}.about-section{grid-template-columns:1fr}.portrait-wrap{min-height:0;height:70svh;max-height:680px}.portrait{object-position:center 30%}.about-copy{padding:50px 6vw 60px}.about-copy h2{font-size:70px}.about-intro{font-size:22px}.clients{margin-top:35px}.credentials{margin-top:40px}.credentials strong{font-size:28px}.credentials span{font-size:9px}.contact-section{grid-template-columns:1fr;min-height:95svh;padding:65px 6vw 115px}.contact-heading h2{font-size:clamp(120px,33vw,220px)}.contact-copy{padding:40px 0 0}.contact-copy>.small-label{font-size:10px}.email{font-size:clamp(18px,5.8vw,29px);margin-top:16px}.socials{margin-top:32px}footer{font-size:8px;left:6vw;right:6vw;gap:12px}footer span:nth-child(2){display:none}.project-page main{padding:45px 6vw 0}.project-heading{margin-bottom:30px}.project-heading h1{font-size:58px}.project-details{grid-template-columns:1fr;gap:35px;padding:35px 0}.project-meta{gap:24px}.credits-detail{margin-bottom:40px}.credits-detail dl{grid-template-columns:1fr 1fr;gap:24px}.gallery{grid-template-columns:1fr;gap:14px;margin:40px 0}.breakdown{margin:40px 0}.next-project{padding:45px 0 60px}.project-footer{padding:28px 6vw}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none}*{transition:none!important}}
/* Larger project imagery and tactile carousel controls. */
.project-card{flex-basis:calc((100% - 36px)/3)}
.card-media{border-radius:18px;isolation:isolate}
.work-navigation{display:flex;align-items:center;gap:28px}
.drag-hint{font-size:12px;letter-spacing:.17em;color:#a8b5be;white-space:nowrap}
.carousel{overscroll-behavior-x:contain;scroll-behavior:auto}
.dragging,.dragging *{cursor:grabbing!important;user-select:none}
@media(max-width:1000px){.project-card{flex-basis:calc((100% - 18px)/2)}.work-navigation{gap:18px}.drag-hint{font-size:11px}}
@media(max-width:700px){.project-card{flex-basis:90%}.card-media{border-radius:14px}.section-head{align-items:flex-start}.work-navigation{flex-direction:column-reverse;align-items:flex-end;gap:13px}.drag-hint{font-size:9px;letter-spacing:.12em}.section-head h2{max-width:60%}}
/* Portfolio revision: clear hero, directional drag cue, and visible credits. */
.intro h1{font-size:clamp(64px,8.1vw,142px);max-width:100%;line-height:.92;letter-spacing:-.065em}
.intro .description{font-size:clamp(16px,1.65vw,24px);font-weight:600;letter-spacing:.1em;margin-top:26px;color:#e2e7e9}
.play-icon{width:22px;height:22px;fill:currentColor;stroke:none;flex:none}.play-mark{display:none}.is-paused .pause-mark{display:none}.is-paused .play-mark{display:block}
.work-navigation{display:block}.drag-hint{display:inline-flex;align-items:center;gap:17px;white-space:nowrap}.drag-hint svg{width:62px;height:16px;flex:none}
.studio-label{color:#748d9e;letter-spacing:.12em}
.card-preview-embed{position:absolute;inset:0;width:100%;height:100%;border:0;pointer-events:none}
.credentials{grid-template-columns:repeat(2,minmax(0,1fr));max-width:470px}
.credits-section{padding:55px 0 70px;border-top:1px solid #283138}.credits-section h2{font-size:clamp(50px,5vw,80px)}.credits-note{font-size:15px;color:#9facb4;margin:18px 0 35px;line-height:1.6}.credit-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:54px 6vw}.credit-group{border-top:1px solid #3a464d;padding-top:22px}.credit-group h3{font-size:20px;font-weight:600;letter-spacing:.02em;margin:0 0 25px}.credit-group dl{margin:0}.credit-group dl>div{display:grid;grid-template-columns:minmax(140px,42%) 1fr;gap:15px;padding:12px 0;border-bottom:1px solid #1e292f}.credit-group dt{font-size:10px;letter-spacing:.12em;color:#899aa5;line-height:1.6}.credit-group dd{margin:0;font-size:15px;line-height:1.5;color:#d3dbe0}.project-details{padding:65px 0}.project-description{max-width:860px}
@media(max-width:700px){.intro h1{font-size:clamp(48px,12vw,76px)}.intro .description{font-size:15px;letter-spacing:.08em}.drag-hint{gap:9px}.drag-hint svg{width:40px}.credentials{grid-template-columns:repeat(2,minmax(0,1fr))}.credit-groups{grid-template-columns:1fr;gap:35px}.credits-section{padding:45px 0 55px}.credit-group dl>div{grid-template-columns:minmax(100px,40%) 1fr}.credit-group dd{font-size:14px}}

/* Showreel title, cinematic UI fade, and positioning statement. */
.hero .intro{left:50%;top:50%;width:min(92vw,1500px);max-width:none;text-align:center;transform:translate(-50%,-45%)}
.hero .intro h1{font-size:clamp(64px,8.1vw,142px);white-space:nowrap}
.hero .intro .description{font-family:'Caveat','Segoe Print',cursive;font-size:clamp(34px,4vw,68px);font-weight:600;line-height:1;letter-spacing:.015em;color:var(--blue);margin:18px auto 0;transform:rotate(-1.5deg)}
.header,.intro,.controls,.shade{transition:opacity .85s cubic-bezier(.22,.61,.36,1),transform .85s cubic-bezier(.22,.61,.36,1),filter .85s cubic-bezier(.22,.61,.36,1)}
.hero.ui-hidden{cursor:none}
.hero.ui-hidden .header,.hero.ui-hidden .controls{opacity:0;filter:blur(6px);pointer-events:none}
.hero.ui-hidden .header{transform:translateY(-14px)}
.hero.ui-hidden .controls{transform:translateY(14px)}
.hero.ui-hidden .intro{opacity:0;filter:blur(10px);transform:translate(-50%,calc(-45% - 18px));pointer-events:none}
.hero.ui-hidden .shade{opacity:.12}
.vision-section{min-height:72svh;display:grid;grid-template-columns:minmax(190px,.55fr) 1.45fr minmax(270px,.72fr);align-items:end;gap:4vw;padding:clamp(90px,12vw,190px) 5.3vw;background:#eef1f3;color:#071016}
.vision-kicker{align-self:start;margin:5px 0 0;font-size:10px;font-weight:700;line-height:1.7;letter-spacing:.18em;color:#5f6b73}
.vision-section h2{font-size:clamp(70px,9vw,158px);line-height:.82;letter-spacing:-.035em}
.vision-copy{font-size:clamp(17px,1.45vw,23px);line-height:1.65;margin:0 0 8px;color:#34424b}
@media(max-width:900px){.vision-section{grid-template-columns:1fr;min-height:auto;gap:34px;padding:90px 6vw}.vision-kicker{align-self:auto}.vision-copy{max-width:580px}.hero .controls{gap:20px}}
@media(max-width:700px){.hero .intro{left:50%;width:92%;max-width:none}.hero .intro h1{font-size:clamp(43px,11.5vw,72px);white-space:normal}.hero .intro .description{font-size:clamp(30px,10vw,48px);margin-top:14px}.hero .controls{left:5vw;right:5vw;justify-content:center;gap:14px;flex-wrap:wrap}.hero .control{font-size:9px;gap:7px;letter-spacing:.1em}.hero .control svg{width:17px;height:17px}.vision-section{padding-block:75px}.vision-section h2{font-size:clamp(62px,19vw,104px)}}
@media(prefers-reduced-motion:reduce){.hero.ui-hidden .header,.hero.ui-hidden .intro,.hero.ui-hidden .controls{opacity:1;filter:none;transform:none;pointer-events:auto}.hero.ui-hidden{cursor:auto}.hero.ui-hidden .shade{opacity:1}}

/* Precision pass: explicit title spacing, true fade-to-zero, balanced statement. */
.hero .intro h1{display:flex;justify-content:center;align-items:baseline;gap:.18em;white-space:nowrap}
.hero .intro h1 span{display:inline-block}
.header,.intro,.controls,.shade{transition-property:opacity;transition-duration:1.5s;transition-timing-function:linear}
.hero.ui-hidden .header,.hero.ui-hidden .intro,.hero.ui-hidden .controls,.hero.ui-hidden .shade{opacity:0;filter:none;transform:none}
.hero.ui-hidden .intro{transform:translate(-50%,-45%)}
.vision-section{min-height:72svh;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:clamp(28px,4vw,58px);padding:clamp(90px,12vw,180px) 6vw;background:#05090c;color:#f0f0ee;text-align:center}
.vision-section h2{font-size:clamp(76px,10.5vw,176px);line-height:.78;letter-spacing:-.045em;max-width:1200px}
.vision-section h2 span,.vision-section h2 em{display:block}.vision-section h2 em{font-family:'Caveat','Segoe Print',cursive;font-size:1.02em;font-weight:600;letter-spacing:-.02em;margin-top:.08em}
.vision-copy{max-width:720px;font-size:clamp(18px,1.5vw,24px);line-height:1.65;margin:0;color:#aeb9c0}
.credits-note{display:none}
.credit-groups{gap:38px 4vw}
.credit-group{padding-top:18px}
.credit-group h3{margin-bottom:14px}
.credit-group dl>div{grid-template-columns:minmax(112px,34%) 1fr;gap:18px;padding:8px 0}
.credit-group dt{line-height:1.4}
.credit-group dd{line-height:1.4}
@media(max-width:700px){.hero .intro h1{gap:.16em;white-space:nowrap}.vision-section{padding:82px 6vw}.vision-section h2{font-size:clamp(62px,18vw,100px)}.credit-group dl>div{grid-template-columns:minmax(94px,36%) 1fr;gap:12px;padding:7px 0}}