/* Scroll storyboard; replace keyframes with the commissioned film for production. */
:root{--studio:#f4f4f1;--film-progress:0;--chapter-local:0}.header{background:var(--studio);color:#171916;border-color:#d9dbd4}.header nav{color:#444b3d}.header nav a:hover{color:#71600d}.film{height:auto;position:relative;background:var(--studio);color:#171916}.film.motion-ready{height:520vh}.film:not(.motion-ready) .film-controls{display:none}.film-sticky{height:100svh;min-height:680px;position:sticky;top:0;overflow:clip;isolation:isolate}.film-art{position:absolute;inset:0;z-index:-2;background:var(--studio)}.film-frame{position:absolute;inset:0;background-position:center;background-size:cover;will-change:transform,opacity;opacity:0}.frame-idea{background-image:url('/__magoven_studio/studio-20260930-refined/assets/studio-idea.jpg');opacity:1}.frame-devices{background-image:url('/__magoven_studio/studio-20260930-refined/assets/studio-devices.jpg')}.frame-finale{background-image:url('/__magoven_studio/studio-20260930-refined/assets/studio-finale.jpg')}.film-wash{position:absolute;inset:0;background:linear-gradient(90deg,rgba(246,246,243,.92),rgba(246,246,243,.8) 28%,rgba(246,246,243,.08) 62%,transparent 100%)}.film-top{position:absolute;top:30px;left:56px;right:56px;display:flex;justify-content:space-between;gap:24px;align-items:center}.film-top .square{margin-right:8px}.film-top .eyebrow{color:#4f5647}.study-label{border:1px solid #c7ccc0;border-radius:20px;padding:5px 12px;color:#65705a;font-size:11px}.film-copy{position:absolute;left:56px;top:18%;width:46%;max-width:680px;transform:translateY(var(--copy-y,0));opacity:var(--copy-opacity,1);will-change:opacity,transform}.film-kicker{font-size:12px;letter-spacing:.15em;text-transform:uppercase;margin-bottom:22px;color:#57604d}.film h1{font-size:clamp(62px,6.3vw,98px);line-height:.98;letter-spacing:-.055em;font-weight:500}.film h1 em{color:#171916;position:relative;display:inline-block}.film h1 em:after{content:'';position:absolute;bottom:4%;height:7%;left:0;right:-3%;background:#f6c302;z-index:-1}.film-intro{max-width:400px;color:#59604f;font-size:17px;line-height:1.6;margin-top:25px}.film-actions{display:flex;align-items:center;gap:25px;flex-wrap:wrap;margin-top:28px}.film-skip{font-size:14px;text-decoration:underline;text-underline-offset:6px}.film-skip span{margin-left:15px}.scene-caption{position:absolute;left:56px;top:31%;width:36%;max-width:490px;opacity:var(--caption-opacity,0);transform:translateY(var(--caption-y,20px));pointer-events:none}.scene-number{font-size:12px;letter-spacing:.12em;color:#65705a;display:block;margin-bottom:22px}.scene-caption h2{font-size:clamp(40px,4.2vw,62px);line-height:1.08;letter-spacing:-.045em}.scene-caption p{max-width:360px;margin-top:22px;font-size:18px;color:#59604f}.scene-ui{position:absolute;left:53%;right:6%;top:29%;bottom:23%;pointer-events:none}.channel-ui,.search-ui,.growth-ui{position:absolute;inset:0;opacity:0;transform:translateX(50px);will-change:opacity,transform}.channel-ui{display:grid;grid-template-columns:1fr 1fr;align-content:center;gap:18px;max-width:540px}.channel-ui>span{background:#fbfcf9df;border:1px solid #d1d6c9;border-radius:10px;padding:18px 22px;box-shadow:0 16px 32px #39432d0c;font-size:16px;backdrop-filter:blur(12px)}.channel-ui .channel-core{grid-column:1/-1;text-align:center;background:#181b14;color:#fff;padding:26px;border-bottom:3px solid var(--yellow);font-size:24px;box-shadow:0 15px 40px #17191620}.channel-ui>span:last-child{grid-column:1/-1;text-align:center}.search-ui{background:#fafcf9ee;border:1px solid #d5dbcd;border-radius:13px;padding:24px;box-shadow:0 30px 70px #26301d18;backdrop-filter:blur(15px);inset:auto 0;top:0}.search-field{display:flex;justify-content:space-between;background:#fff;border:1px solid #d8decf;border-radius:28px;padding:14px 20px;font-size:15px;color:#596450;margin-bottom:22px}.search-field>span{font-size:24px;line-height:1}.search-result{padding:16px;border:1px solid #e2e6dc;background:#fff;margin-top:10px;border-radius:5px}.search-result span{font-size:10px;letter-spacing:.12em;color:#647453}.search-result strong{display:block;font-weight:500;font-size:20px;line-height:1.3;margin:6px 0}.search-result p{color:#626e58;font-size:13px}.featured-result{border-left:3px solid var(--yellow);position:relative;transform:translateY(calc((1 - var(--seo-rise,0)) * 66px));z-index:1;box-shadow:0 5px 12px #1722110a}.muted-result{opacity:.45}.muted-result i,.muted-result b,.muted-result small{display:block;height:5px;background:#c9d0c2;margin:7px 0;width:70%}.muted-result b{width:90%}.muted-result small{width:50%}.growth-ui{padding:32px;background:#fbfcfaeb;border:1px solid #d5dbcd;border-radius:14px;box-shadow:0 30px 70px #26301d18;backdrop-filter:blur(15px);inset:auto 0;top:8%}.growth-label{font-size:22px;letter-spacing:-.025em;margin-bottom:25px}.growth-metrics{display:flex;gap:10px;justify-content:space-between;border-bottom:1px solid #dce2d3;padding-bottom:18px;font-size:14px;color:#5c6951}.growth-ui svg{display:block;width:100%;height:auto;margin-top:20px;overflow:visible}.graph-grid{stroke:#e1e5da;stroke-width:1;fill:none}.growth-path{fill:none;stroke:#988009;stroke-width:3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--graph-draw,0))}.concept-label{display:block;text-align:right;font-size:10px;letter-spacing:.04em;color:#7a856f;margin-top:12px}.film-controls{position:absolute;bottom:25px;left:56px;right:56px}.scroll-instruction{display:flex;align-items:center;gap:12px;font-size:12px;color:#606b55;margin-bottom:18px}.scroll-instruction>span:first-child{font-size:20px}.scroll-percent{margin-left:auto;font-variant-numeric:tabular-nums}.chapter-buttons{display:grid;grid-template-columns:repeat(7,1fr);gap:12px}.chapter-buttons button{background:none;border:0;border-top:1px solid #c7cfc0;text-align:left;padding:13px 0 7px;display:flex;gap:10px;color:#7a8470;font-size:12px;cursor:pointer;white-space:nowrap}.chapter-buttons button span{font-size:14px}.chapter-buttons button[aria-pressed=true]{border-color:#242d1b;color:#171d12}.chapter-buttons button[aria-pressed=true] span{font-weight:600}.film-progress{height:3px;background:#e0e5d9;margin-top:6px}.film-progress>span{display:block;height:100%;width:calc(var(--film-progress) * 100%);background:#b28e00}#story-progress{display:block;width:100%;height:14px;margin:0;accent-color:#9a7c00;cursor:ew-resize;background:transparent;opacity:0;position:absolute;bottom:-5px}#story-progress:focus-visible{opacity:1;outline:2px solid #282f21;outline-offset:4px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.film a:focus-visible,.film button:focus-visible{outline-color:#171916}.film[data-chapter='3'] .film-art,.film[data-chapter='4'] .film-art,.film[data-chapter='5'] .film-art{filter:blur(5px)}
@media(min-width:1600px){.film-copy,.scene-caption{left:max(56px,calc((100vw - 1320px)/2))}.film-top,.film-controls{left:max(56px,calc((100vw - 1320px)/2));right:max(56px,calc((100vw - 1320px)/2))}}@media(max-width:1100px){.film-copy,.scene-caption{left:32px}.film-top,.film-controls{left:32px;right:32px}.film-copy{width:47%}.film h1{font-size:70px}.film-intro{font-size:16px}.film-actions{gap:18px}.film-skip{font-size:12px}.scene-ui{left:50%;right:4%}.chapter-buttons{gap:7px}.chapter-buttons button{gap:5px}.chapter-buttons button span{font-size:12px}}
@media(max-width:760px){.header .menu{color:#171916}.header nav{background:#f4f4f1}.film.motion-ready{height:450svh}.film-sticky{min-height:720px}.film-top{left:20px;right:20px;top:18px}.film-top .eyebrow{font-size:9px;letter-spacing:.08em}.study-label{font-size:9px;padding:3px 7px;white-space:nowrap}.film-top .square{display:none}.film-frame{background-size:auto 44%;background-position:95% 66%;background-repeat:no-repeat}.film-wash{background:linear-gradient(180deg,#f4f4f1 0%,#f4f4f1c9 22%,transparent 48%,#f4f4f170 74%,#f4f4f1 85%)}.film-copy{top:10%;left:20px;width:calc(100% - 40px)}.film-kicker{font-size:10px;margin-bottom:14px}.film h1{font-size:clamp(48px,10.5vw,72px);line-height:.98}.film h1 em{margin-left:0}.film-intro{max-width:360px;font-size:14px;margin-top:16px;line-height:1.5}.film-actions{margin-top:19px;gap:20px}.film-actions .button{min-height:46px;padding:11px 16px;font-size:14px;gap:28px}.film-actions .button span{font-size:20px}.film-skip{font-size:12px}.scene-caption{left:20px;top:13%;width:calc(100% - 40px);max-width:500px}.scene-number{margin-bottom:12px}.scene-caption h2{font-size:36px;max-width:360px}.scene-caption p{font-size:15px;max-width:340px;margin-top:14px}.scene-ui{top:43%;bottom:18%;left:9%;right:9%}.channel-ui{gap:8px}.channel-ui>span{padding:10px 14px;font-size:12px}.channel-ui .channel-core{padding:15px;font-size:18px}.search-ui{padding:14px}.search-field{padding:8px 12px;font-size:12px;margin-bottom:10px}.search-result{padding:9px;margin-top:6px}.search-result strong{font-size:16px}.search-result p{font-size:11px}.search-result span{font-size:9px}.muted-result i,.muted-result b,.muted-result small{height:3px;margin:4px 0}.featured-result{transform:translateY(calc((1 - var(--seo-rise,0)) * 38px))}.growth-ui{padding:20px;top:5%}.growth-label{font-size:18px;margin-bottom:16px}.growth-metrics{font-size:12px;padding-bottom:12px}.growth-ui svg{margin-top:12px}.film-controls{left:20px;right:20px;bottom:22px}.scroll-instruction{margin-bottom:8px;font-size:11px}.chapter-buttons{gap:7px}.chapter-buttons button{display:flex;flex-direction:column;gap:4px;font-size:10px;padding-top:9px}.chapter-buttons button span{font-size:10px}.chapter-buttons button:last-child span{font-size:9px}.film-progress{margin-top:7px}}
@media(prefers-reduced-motion:reduce){.film,.film.motion-ready{height:auto}.film-sticky{position:relative;min-height:780px}.film-frame{transform:none!important}.film-copy{opacity:1!important;transform:none!important}.scene-caption,.scene-ui,.film-controls{display:none}.film-art{filter:none!important}.frame-idea{opacity:0!important}.frame-finale{opacity:1!important}.film-actions{pointer-events:auto!important}.film-wash{background:linear-gradient(90deg,#f4f4f1ed,#f4f4f180 45%,transparent)}}
@media(max-width:760px){.film-intro,.scene-caption p{font-size:16px}.chapter-buttons{display:flex;gap:18px;overflow-x:auto;scrollbar-width:thin;padding-bottom:4px}.chapter-buttons button{flex:0 0 auto;min-width:48px;font-size:12px}.chapter-buttons button span,.chapter-buttons button:last-child span{font-size:12px}.film-top .eyebrow{font-size:10px}.study-label{font-size:10px}}