.hello{grid-template-columns:minmax(0,.85fr) minmax(0,1.25fr);gap:20px;padding-bottom:40px}.hello h1{font-size:clamp(34px,4vw,58px)}.hello-text{font-size:14px;line-height:2}.pipeline-visual{margin:0;min-width:0;transform:translateY(var(--screen-y,0px))}.pipeline-visual img{display:block;width:100%;height:auto}.pipeline-visual figcaption{font-size:12px;text-align:center;color:var(--muted);padding:8px 14px;line-height:1.7}.pipeline-explained{border-top:1px solid var(--line);padding-block:45px 40px}.pipeline-lead{display:grid;grid-template-columns:1fr 1fr;gap:12px 40px;align-items:end}.pipeline-lead .eyebrow{grid-column:1/-1;margin:0;color:#75618f}.pipeline-lead h2{font-size:30px;letter-spacing:-.03em;line-height:1.5}.pipeline-lead>p:last-child{font-size:14px;color:var(--muted);line-height:1.9}.pipeline-steps{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:0;margin:35px 0 18px;gap:30px}.pipeline-steps li{border-top:2px solid #c5b9dc;padding-top:17px}.pipeline-steps span{font-size:11px;letter-spacing:.08em;color:#75618f}.pipeline-steps h3{font-size:18px;margin:12px 0 8px}.pipeline-steps p{font-size:13px;color:var(--muted);line-height:1.9}.pipeline-scope{font-size:11px;color:var(--muted)}.proof{padding-top:45px}.hero-service-price{font-size:15px}
@media(max-width:900px){.hello h1{font-size:34px}.hello-text{font-size:12px}.pipeline-lead h2{font-size:26px}.pipeline-steps{gap:20px}.pipeline-steps h3{font-size:16px}}
@media(max-width:760px){.hello{gap:18px}.hello h1{font-size:34px}.pipeline-visual{transform:none}.pipeline-visual figcaption{font-size:11px;text-align:left;padding-inline:0}.pipeline-explained{padding-block:28px}.pipeline-lead{display:block}.pipeline-lead .eyebrow{margin-bottom:12px}.pipeline-lead h2{font-size:25px}.pipeline-lead>p:last-child{font-size:13px;margin-top:15px}.pipeline-steps{grid-template-columns:1fr;gap:20px;margin-top:25px}.pipeline-steps li{padding-top:12px}.pipeline-steps h3{margin-block:8px 4px}.pipeline-scope{line-height:1.9}}
@media(prefers-reduced-motion:reduce){.pipeline-visual{transform:none}}
.pipeline-steps{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}.pipeline-steps h3{font-size:16px}@media(max-width:1000px){.pipeline-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){.pipeline-steps{grid-template-columns:1fr}}
/* v10: editorial type and a working edit desk */
:root{--paper:#faf9f6;--green:#a64432;--ink:#262724;--muted:#70716b;--line:#deded6}
body,button,input,select,textarea,h1,h2,h3,h4,p,a,span,strong,em,summary{font-family:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Noto Sans JP",Meiryo,sans-serif!important}
h1,h2,h3{font-style:normal;letter-spacing:-.035em!important}em{font-style:normal!important}.hello h1{font-weight:700;font-size:clamp(32px,3.6vw,53px);line-height:1.45}.hello h1 em{font-size:1;color:var(--ink)}.hello{grid-template-columns:1fr 1.15fr;padding-block:60px}.editing-preview{min-width:0}.editing-preview img{display:block;width:100%;height:auto}.editing-preview p{display:flex;justify-content:space-between;gap:15px;font-size:11px;margin-top:12px;color:var(--muted)}.editing-preview p span{color:var(--ink)}
.pipeline-story{position:relative;border-block:1px solid var(--line);background:#f0f0eb;height:245svh}.pipeline-stage{position:sticky;top:0;padding-block:30px 22px;min-height:0}.stage-heading{display:flex;align-items:baseline;gap:24px;flex-wrap:wrap;margin-bottom:24px}.stage-heading .eyebrow{width:100%;margin:0;font-size:11px}.stage-heading h2{font-size:clamp(24px,2.5vw,36px);line-height:1.4;margin:0}.stage-heading>p:last-child{font-size:11px;color:var(--muted);margin:0 0 0 auto}.edit-desk{position:relative;background:#faf9f6;border:1px solid #c8cac1;overflow:hidden;--progress:0;--scan:0}.desk-top{display:flex;justify-content:space-between;padding:12px 20px;border-bottom:1px solid var(--line);font-size:11px;color:var(--muted)}.desk-main{display:grid;grid-template-columns:1fr .65fr 1.15fr;align-items:center;gap:5%;padding:25px 6%;height:clamp(190px,23vw,300px)}.desk-main img{width:100%;display:block}.source-stack,.edit-rules,.result-frame{transition:opacity .35s,transform .5s}.source-stack{transform:translateX(calc(var(--progress)*12px))}.source-stack>span{display:block;font-size:11px;margin-top:9px}.edit-rules{border-left:1px solid var(--line);padding-left:20px;opacity:.2;transform:translateY(14px)}.desk-label{font-size:11px;color:var(--muted)}.edit-rules p{font-size:13px;margin:10px 0;border-bottom:1px solid var(--line);padding-bottom:7px}.result-frame{opacity:.12;transform:translateY(18px);position:relative}.result-label{font-size:11px;display:block;margin-top:9px;opacity:0}.edit-desk[data-step="1"] .edit-rules,.edit-desk[data-step="2"] .edit-rules,.edit-desk[data-step="3"] .edit-rules{opacity:1;transform:none}.edit-desk[data-step="2"] .result-frame{opacity:.6;transform:none}.edit-desk[data-step="3"] .result-frame{opacity:1;transform:none}.edit-desk[data-step="3"] .result-label{opacity:1}.edit-tracks{position:relative;margin:0 6% 22px;padding:12px 0;border-top:1px solid var(--line);overflow:hidden}.track{display:flex;gap:6px;margin-bottom:6px;height:22px;transform:translateX(calc((1 - var(--scan))*22%));opacity:calc(.15 + var(--scan)*.85)}.track i{flex:1;background:#98a195;border:1px solid #899481}.track i:nth-child(2n){flex:1.8}.caption-track{height:12px;width:90%}.caption-track i{background:#c0ac86;border-color:#b09d79}.audio-track{height:14px;background:repeating-linear-gradient(90deg,#939b8f 0 2px,transparent 2px 5px);opacity:calc(.15 + var(--scan)*.85)}.playhead{position:absolute;left:calc(var(--scan)*100%);top:0;bottom:0;width:2px;background:var(--green)}.desk-progress{height:3px;width:calc(var(--progress)*100%);background:var(--green)}.pipeline-steps{margin:22px 0 12px;gap:22px}.pipeline-steps li{border-top:2px solid #d0d2c8;padding-top:12px;opacity:.4;transition:opacity .3s,border-color .3s}.pipeline-steps li.is-current{opacity:1;border-color:var(--green)}.pipeline-steps li.is-done{opacity:.7}.pipeline-steps span{color:var(--muted)}.pipeline-steps h3{font-size:16px;margin:8px 0}.pipeline-steps p{font-size:12px;margin:0}.pipeline-scope{margin:0;line-height:1.7}.work-1 h3:before{background:#899481}
@media(max-width:760px){.hello{padding-block:30px;gap:30px}.hello h1{font-size:34px}.editing-preview p{font-size:10px}.pipeline-stage{width:calc(100% - 40px);padding-block:24px}.pipeline-story{height:250svh}.stage-heading{gap:8px;margin-bottom:18px}.stage-heading h2{font-size:23px}.stage-heading>p:last-child{margin:0}.desk-main{height:185px;padding:16px;gap:10px;grid-template-columns:1fr 1fr}.source-stack>span{font-size:9px}.edit-rules{position:absolute;left:16px;top:61px;width:42%;background:var(--paper);padding:8px;border:0;opacity:0}.edit-rules p{font-size:11px;margin:5px 0}.edit-desk[data-step="1"] .source-stack,.edit-desk[data-step="2"] .source-stack,.edit-desk[data-step="3"] .source-stack{opacity:.08}.desk-top{padding:10px;font-size:9px}.result-label{font-size:10px}.pipeline-steps{grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.pipeline-steps h3{font-size:13px;margin:5px 0}.pipeline-steps p{font-size:10px}.pipeline-steps span{font-size:9px}.pipeline-scope{font-size:9px}.edit-tracks{margin-bottom:15px}.pipeline-steps li{padding-top:8px}}
@media(prefers-reduced-motion:reduce),(max-height:650px){.pipeline-story{height:auto}.pipeline-stage{position:relative}.edit-desk .edit-rules,.edit-desk .result-frame,.edit-desk .result-label{opacity:1;transform:none}.pipeline-steps li{opacity:1}.source-stack,.track{transform:none}.track,.audio-track{opacity:1}.stage-heading>p:last-child{display:none}.source-stack,.edit-rules,.result-frame,.pipeline-steps li{transition:none}}
.hello h1 em{font-size:1em}.pipeline-stage{padding-block:20px}.stage-heading{gap:12px;margin-bottom:18px}.desk-main{box-sizing:border-box;height:clamp(180px,30svh,260px)}.desk-main img{max-height:190px;object-fit:contain}.desk-main>*{min-width:0}.pipeline-steps{margin-top:18px}.pipeline-steps li{opacity:.65}.pipeline-steps li.is-current{opacity:1}
@media(max-width:760px){.desk-main{height:185px}.desk-main img{max-height:140px}.pipeline-stage{padding-block:20px}}
/* v11: the footage itself travels into the edit */
.pipeline-story{height:340svh}.motion-canvas{height:340px;position:relative;margin:0 4%;overflow:hidden}.source-caption{position:absolute;left:0;top:14px;font-size:11px;color:var(--muted)}.recipe{position:absolute;left:34%;top:30px;font-size:12px}.recipe>span{color:var(--muted);font-size:10px}.recipe p{margin-top:8px}.finished-video{position:absolute;right:0;top:16px;width:28%;transform-origin:100% 0;opacity:0}.finished-video img{display:block;width:100%;max-height:150px;object-fit:contain}.finished-video>span{font-size:10px;display:block;margin-top:5px}.moving-clip{position:absolute;left:0;top:0;overflow:hidden;will-change:transform,width,height;background:#262724;transform-origin:0 0;box-shadow:0 1px 3px #0002}.moving-clip img{width:100%;height:100%;object-fit:cover;display:block}.moving-clip>span{position:absolute;bottom:4px;left:6px;color:white;font-size:9px;text-shadow:0 1px 3px #000}.timeline-bed{position:absolute;left:0;right:0;top:192px;border-top:1px solid #c5c8bd;display:grid;grid-template-rows:60px 30px 30px;padding-top:6px}.timeline-bed span{border-bottom:1px solid #daddd2;font-size:8px;letter-spacing:.1em;color:#85897b;padding:5px 0}.moving-caption{position:absolute;top:0;left:0;height:20px;background:#c9b78f;border:1px solid #b09c71;font-size:9px;padding-left:5px;overflow:hidden;will-change:transform}.moving-audio{position:absolute;left:42px;right:0;top:291px;height:18px;background:repeating-linear-gradient(90deg,#74836f 0 2px,transparent 2px 5px);transform-origin:0 50%}.motion-playhead{position:absolute;top:192px;height:125px;width:2px;background:#a64432;will-change:transform}.motion-playhead:before{content:'';position:absolute;width:8px;height:8px;background:#a64432;left:-3px;top:-3px}.cut-mark{position:absolute;top:201px;height:48px;width:2px;background:#faf9f6;box-shadow:0 0 0 1px #a64432;opacity:0}.pipeline-steps{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:760px){.motion-canvas{height:300px;margin:0 12px}.recipe{left:46%;top:20px;font-size:10px}.recipe p{max-width:120px;line-height:1.6}.finished-video{width:46%;top:20px}.timeline-bed{top:154px;grid-template-rows:60px 30px 30px}.moving-audio{top:253px}.motion-playhead{top:154px}.cut-mark{top:163px}.pipeline-steps{grid-template-columns:1fr 1fr}.pipeline-story{height:340svh}}
@media(prefers-reduced-motion:reduce),(max-height:650px){.pipeline-story{height:auto}}
/* v12: three camera tracks and a consistent works grid */
.motion-canvas{height:330px}.timeline-bed{top:154px;grid-template-rows:35px 35px 35px 27px 25px}.moving-clip.is-placed{background-image:var(--footage);background-size:auto 100%;background-repeat:repeat-x}.moving-clip.is-placed img{opacity:0}.moving-clip.is-selected{outline:2px solid var(--green);outline-offset:-2px}.moving-audio{top:302px;height:15px}.motion-playhead{top:154px;height:164px}.cut-mark{height:30px;width:8px;background:var(--green);box-shadow:none}.finished-video{width:25%;top:10px}.finished-video img{height:125px;width:100%;object-fit:contain}.recipe{top:25px}
#portfolio{max-width:1120px;margin-inline:auto}#portfolio .section-heading{margin-bottom:24px}#portfolio .section-heading h2{font-size:clamp(28px,3vw,42px)}#portfolio .work,#portfolio .work:first-of-type{grid-template-columns:minmax(180px,.8fr) minmax(0,1.6fr);gap:32px;padding-block:30px;align-items:center}#portfolio .work-copy{padding:0;position:static}#portfolio .work h3{font-size:clamp(23px,2.4vw,32px);margin:0 0 12px}#portfolio .work h3:before{display:none}#portfolio .work-title{font-size:13px;line-height:1.8;margin:0}#portfolio .work-media{grid-column:2;transform:none;width:100%;max-width:680px}#portfolio .work-media .video{width:100%;aspect-ratio:16/9;height:auto;overflow:hidden}#portfolio iframe{width:100%;height:100%;display:block}#portfolio .work-footer{margin-top:10px;font-size:10px}#portfolio .work-description{font-size:12px}
@media(max-width:760px){.motion-canvas{height:310px}.timeline-bed{top:136px}.moving-audio{top:284px}.motion-playhead{top:136px}.finished-video{width:47%;top:8px}.finished-video img{height:100px}#portfolio .work,#portfolio .work:first-of-type{grid-template-columns:1fr;gap:16px;padding-block:25px}#portfolio .work-media{grid-column:1;max-width:none}#portfolio .work h3{font-size:25px;margin-bottom:6px}#portfolio .work-title{font-size:12px}}
#portfolio{max-width:1040px}#portfolio .work,#portfolio .work:first-of-type{grid-template-columns:minmax(180px,1fr) minmax(0,560px)}#portfolio .work-media{max-width:560px}
@media(max-width:760px){#portfolio .work,#portfolio .work:first-of-type{grid-template-columns:1fr}#portfolio .work-media{max-width:none}}
/* v13: align the brand by its visual centre */
.nav .brand{display:inline-flex;align-items:center;gap:12px}.nav .brand>img{display:block;flex:none;object-fit:contain}.nav .wordmark{display:inline-flex;align-items:baseline;line-height:1;gap:4px}.nav .wordmark>span{line-height:1}
@media(max-width:640px){.nav .brand{gap:9px}.nav .wordmark{gap:3px}}
/* v14: the finished picture is the focal point */
.motion-canvas{height:425px}.finished-video{right:2%;top:10px;width:48%;height:240px}.finished-video>img{width:100%;height:218px;object-fit:contain;background:#20231e}.finished-video .screen-status{font-size:11px;margin-top:6px}.screen-subtitle{position:absolute;bottom:35px;left:4%;right:4%;background:#255836;color:#fff;padding:7px 10px;font-size:clamp(11px,1.4vw,19px)!important;font-weight:700;text-align:center}.finished-player{position:absolute;top:0;left:0;width:100%;height:218px;background:#20231e}.finished-player[hidden]{display:none}.recipe{top:55px;left:2%;max-width:42%}.recipe .edit-status{font-size:clamp(17px,2vw,27px);font-weight:600;line-height:1.5}.source-caption{display:none}.timeline-bed{top:255px}.motion-playhead{top:255px}.moving-audio{top:403px}.pipeline-stage{padding-block:14px}.pipeline-steps{margin-top:12px}.pipeline-steps p{display:none}.pipeline-steps li{padding-top:7px}.stage-heading{gap:6px;margin-bottom:10px}.proof{display:block;max-width:1280px;padding-block:65px}.proof-heading{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-bottom:30px}.proof-heading h2{font-size:40px;margin:0}.proof-heading p{font-size:13px}.proof .proof-stat strong{font-size:64px;margin:10px 0}.proof .proof-stat>span{font-size:12px}.proof .proof-stat small{font-size:10px}.guest-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px 18px}.guest-grid a{min-width:0}.guest-grid img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;height:auto}.guest-grid span{display:block;font-weight:600;font-size:14px;margin:10px 0 5px}.guest-grid small{display:block;font-size:11px;line-height:1.6;color:var(--muted)}
@media(max-width:760px){.motion-canvas{height:375px}.finished-video{width:68%;right:0;top:35px;height:170px}.finished-video>img,.finished-player{height:150px}.screen-subtitle{bottom:28px;left:2%;right:2%;padding:4px;font-size:10px!important}.finished-video .screen-status{font-size:9px}.recipe{top:0;left:0;max-width:100%;display:flex;gap:10px;align-items:center}.recipe>span{font-size:8px}.recipe .edit-status{font-size:12px;margin:0}.timeline-bed{top:205px}.motion-playhead{top:205px}.moving-audio{top:353px}.guest-grid{grid-template-columns:1fr 1fr;gap:20px 12px}.guest-grid span{font-size:12px}.guest-grid small{font-size:10px}.proof-heading{gap:12px}.proof-heading h2{font-size:29px}.proof .proof-stat strong{font-size:45px}.proof-heading p{font-size:11px}.proof{padding-block:40px}}
/* v15: show the real caption design, within the video frame */
.finished-video{width:min(48%,420px);height:auto;aspect-ratio:16/9;right:3%;top:10px}.finished-video>img,.finished-video>.finished-player{position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:contain;margin:0}.finished-video>.edited-frame{opacity:0;z-index:1}.finished-video>.finished-player{z-index:2}.finished-video>.screen-status{position:absolute;top:100%;left:0;right:0;margin-top:7px;line-height:1.4}
@media(max-width:760px){.finished-video{width:68%;top:40px;right:0;height:auto}.finished-video>img,.finished-video>.finished-player{height:100%;max-height:none}.finished-video>.screen-status{font-size:9px}}
.finished-video>.screen-status{display:none}
/* v18: reserve a separate heading row above the animated footage */
.motion-canvas .recipe{top:8px;left:0;right:0;max-width:none;display:flex;align-items:center;gap:16px;height:30px;z-index:8;pointer-events:none}.motion-canvas .recipe>span{font-size:10px;flex:none}.motion-canvas .recipe .edit-status{font-size:17px;line-height:1.4;margin:0}.motion-canvas .finished-video{top:45px;width:min(46%,350px)}
@media(max-width:760px){.motion-canvas .recipe{height:24px;gap:8px;top:4px}.motion-canvas .recipe>span{font-size:8px}.motion-canvas .recipe .edit-status{font-size:12px}.motion-canvas .finished-video{top:45px;width:68%}}