/* Hallmark · shape: app screen · genre: modern-minimal · theme: Console monochrome by request · redesign: full
 * paper: oklch(14% 0 0) · accent: oklch(97% 0 0) · display: Segoe UI · body: Segoe UI
 * nav: existing destinations with account · signature: project timeline · states: loading empty error full
 * axes: dark/grotesk-sans/neutral · posture: restrained · contrast: pending sweep · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H4 E3 S4 R5 V3 · weakest: E, tokenized legacy styles and normalized control states */
@import url("./tokens.css");
/* Invideo-inspired editorial cinema / original Video Maker Every Thing content */
:root{--bg:var(--tone-12);--panel:var(--tone-22);--panel2:var(--tone-36);--ink:var(--tone-248);--muted:var(--tone-176);--accent:var(--tone-248);--line:var(--tone-48);--black:var(--tone-12);--white:var(--tone-248);--serif:Georgia,'Times New Roman',serif;--pink:var(--tone-248);--pink-dark:var(--tone-88);--silver:var(--tone-208);--deep:var(--tone-22);--shade:var(--tone-8-a75)}
body{background:var(--bg);color:var(--ink)}.container{width:min(1220px,calc(100% - 80px))}.site-header{height:100px}.brand-lockup{font-size:19px}.brand-lockup img{width:43px;height:43px}.main-nav{border:0;background:none;padding:0;gap:var(--space-md);color:var(--color-ink)}.main-nav a{border-radius:0;padding:var(--space-sm) var(--space-xs);font-size:14px;color:var(--muted)}.main-nav a[aria-current=page]{background:none;color:var(--ink)}.main-nav a:hover{color:var(--ink)}.account-button{background:none;border-color:var(--line);border-radius:8px;color:var(--color-ink)}.header-actions{gap:var(--space-20)}.editor-link{font-size:14px}.primary{background:var(--ink);color:var(--var(--tone-8))}.primary:hover{background:var(--silver);color:var(--var(--tone-8))}.button{min-height:50px;padding:var(--space-md) var(--space-lg);border-radius:8px;font-size:14px;font-weight:400}.secondary{border-color:var(--line)}.inline-link{color:var(--ink)}.ref-hero{padding-top:var(--space-2xl);text-align:center}.ref-hero h1{font-family:var(--font-body);font-weight:400;font-size:clamp(48px,5.7vw,84px);letter-spacing:-.045em;line-height:1.03;max-width:100%;margin:auto}.ref-hero>p{font-size:18px;line-height:1.65;color:var(--silver);max-width:720px;margin:var(--space-28) auto 0}.hero-buttons{display:flex;justify-content:center;gap:var(--space-md);margin:var(--space-32) 0 var(--space-60)}.hero-buttons span{font-size:18px}.hero-film{position:relative;background:var(--deep);border:1px solid var(--line);padding:var(--space-sm);border-radius:20px;isolation:isolate;text-align:left;color:var(--color-ink)}.hero-film>img{width:100%;height:auto;aspect-ratio:1.9;object-fit:cover;display:block;border-radius:11px}.film-play{position:absolute;inset:calc(50% - 46px) auto auto calc(50% - 32px);width:64px;height:64px;display:grid;place-items:center;background:var(--ink);color:var(--var(--tone-8));border:0;border-radius:50%}.film-play svg{width:35px;fill:currentColor}.film-play:hover{background:var(--silver);color:var(--color-ink)}.hero-film figcaption{display:flex;align-items:center;justify-content:space-between;gap:var(--space-20);padding:var(--space-20) var(--space-sm) var(--space-xs);font-size:12px;color:var(--muted)}.ref-section{padding-block:var(--space-120) 0}.ref-section>h2,.ref-faq>h2,.ref-final h2{font-family:var(--font-body);font-weight:400;text-align:center;font-size:clamp(36px,4.4vw,62px);line-height:1.1;letter-spacing:0;max-width:100%}.ref-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:var(--space-92);align-items:center;margin-top:var(--space-84)}.ref-feature.reverse .ref-feature-copy{order:2}.ref-feature.reverse .ref-visual{order:1}.ref-feature h3{font-family:var(--font-body);font-size:42px;font-weight:400;line-height:1.13;letter-spacing:0}.ref-feature-copy p{font-size:17px;line-height:1.65;color:var(--muted);margin:var(--space-lg) 0 var(--space-28);max-width:420px}.ref-visual{min-height:360px;background:var(--panel);border:1px solid var(--line);border-radius:20px;position:relative;overflow:clip;color:var(--color-ink)}.captions-demo{display:flex;align-items:center;justify-content:center;background:var(--deep);color:var(--color-ink)}.caption-words{font-size:30px;line-height:1.3;font-weight:500;text-align:center}.caption-words strong{background:var(--pink);color:var(--var(--tone-8));padding:0 var(--space-xs);border-radius:4px}.demo-time{position:absolute;top:24px;left:24px;font-size:11px;color:var(--muted)}.visual-note{position:absolute;bottom:20px;left:24px;font-size:11px;color:var(--muted)}.timeline{position:absolute;bottom:55px;left:24px;right:24px;height:32px;display:flex;gap:var(--space-2xs)}.timeline span{flex:1;background:var(--pink-dark);border-radius:3px;color:var(--color-ink)}.timeline span:nth-child(2){background:var(--pink);color:var(--color-ink)}.timeline span:nth-child(3){background:var(--panel2);color:var(--color-ink)}.timeline i{position:absolute;height:46px;width:2px;left:40%;top:-7px;background:var(--ink);color:var(--color-ink)}.video-well{display:flex;align-items:center;padding:var(--space-20)}.video-well video{width:100%;height:auto;border-radius:10px;display:block}.cover-well{display:flex;justify-content:center;align-items:center}.poster-card{position:relative;width:185px;height:280px;border-radius:14px;overflow:clip;transform:rotate(-8deg);border:6px solid var(--deep)}.poster-card img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;filter:brightness(.6)}.poster-card span{position:absolute;bottom:20px;left:16px;font-family:var(--font-body);font-size:27px;line-height:1.05;color:var(--var(--tone-248))}.format-tag{position:absolute;right:20px;bottom:24px;font-size:11px;color:var(--muted)}.usecase-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-lg);margin-top:var(--space-60)}.usecase-grid>a{background:var(--panel);border:1px solid var(--line);padding:var(--space-sm) var(--space-sm) var(--space-28);border-radius:18px;display:block;color:var(--color-ink)}.usecase-image{height:340px;overflow:clip;border-radius:11px;position:relative}.usecase-image img{height:100%;width:300%;max-width:none;object-fit:cover;display:block}.travel-image img{transform:translateX(0)}.creator-image img{transform:translateX(-33.333%)}.car-image img{transform:translateX(-66.666%)}.usecase-grid h3{font-family:var(--font-body);font-weight:400;font-size:29px;line-height:1.1;letter-spacing:0;margin:var(--space-lg) var(--space-sm) var(--space-sm)}.usecase-grid p{font-size:14px;color:var(--muted);margin:0 var(--space-sm);max-width:290px}.usecase-grid a>span{display:block;margin:var(--space-lg) var(--space-sm) 0;font-size:13px}.ref-steps{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-92);padding-block:var(--space-132) var(--space-80)}.ref-steps h2{font-family:var(--font-body);font-weight:400;font-size:52px;line-height:1.1;letter-spacing:0;margin-bottom:var(--space-32)}.ref-steps ol{list-style:none;margin:0;padding:0}.ref-steps li{display:flex;align-items:start;gap:var(--space-28);border-top:1px solid var(--line);padding:var(--space-lg) 0}.ref-steps li>span{font-size:14px;color:var(--muted);padding-top:var(--space-2xs)}.ref-steps h3{font-size:22px;font-weight:400;letter-spacing:0}.ref-steps p{font-size:15px;color:var(--muted);margin-top:var(--space-sm);max-width:400px}.ref-faq{padding-block:var(--space-52) var(--space-112)}.ref-faq>div{max-width:850px;margin:var(--space-52) auto 0}.ref-faq details{border-top:1px solid var(--line);padding:var(--space-lg) 0}.ref-faq details:last-child{border-bottom:1px solid var(--line)}.ref-faq summary{display:flex;justify-content:space-between;align-items:center;gap:var(--space-20);list-style:none;cursor:pointer;font-size:20px;min-height:40px}.ref-faq summary::after{content:'+';font-size:24px;color:var(--muted)}.ref-faq details[open] summary::after{content:'−'}.ref-faq details p{font-size:16px;color:var(--muted);line-height:1.7;max-width:750px;margin-top:var(--space-20)}.ref-final{padding-block:var(--space-xl) var(--space-112);text-align:center}.ref-final p{margin:var(--space-lg) 0 var(--space-32);color:var(--muted);font-size:17px}.site-footer{padding-top:var(--space-44)}.site-footer .footer-mast{font-family:var(--font-body);font-size:clamp(64px,8.3vw,125px)}.page-intro h1,.product-hero h1,.order-layout h1,.studio .section-head h1{font-family:var(--font-body);font-weight:400;letter-spacing:-.045em}.page-intro h1{font-size:72px}.product-hero h1,.order-layout h1{font-size:66px}.purpose h2,.roadmap h2,.faq h2{font-family:var(--font-body);font-weight:400}.example-card h2{font-family:var(--font-body);font-size:30px}.examples-grid{gap:var(--space-44) var(--space-28)}.example-card video{border:1px solid var(--line)}.filter-bar button[aria-pressed=true]{background:var(--ink);color:var(--var(--tone-8))}.studio .demo-art{background:var(--pink);color:var(--color-ink)}.studio .segments button[aria-pressed=true]{background:var(--ink);color:var(--color-ink)}.demo-dialog{max-width:1000px;padding:var(--space-48) var(--space-20) var(--space-20)}.demo-dialog video{width:100%;max-height:70vh;display:block;border-radius:8px}.demo-dialog p{font-size:12px;color:var(--muted);margin:var(--space-md) 0 0}.demo-close{position:absolute;right:12px;top:8px;background:none;color:var(--ink);font-size:28px;border:0;width:36px;height:36px}:focus-visible{outline-color:var(--pink)}
@media(max-width:1000px){.container{width:calc(100% - 48px)}.ref-feature{gap:var(--space-44)}.ref-feature h3{font-size:36px}.ref-feature-copy p{font-size:16px}.ref-visual{min-height:320px}.usecase-image{height:280px}.usecase-grid h3{font-size:25px}.ref-steps{gap:var(--space-52)}.ref-steps h2{font-size:43px}.site-header{gap:var(--space-md)}.main-nav{gap:var(--space-xs)}.brand-lockup{font-size:16px}.editor-link{font-size:13px}}
@media(max-width:760px){.container{width:calc(100% - 36px)}.site-header{padding-block:var(--space-20) var(--space-sm);min-height:88px;height:auto;gap:var(--space-sm)}.main-nav{order:3;gap:var(--space-sm);border-top:1px solid var(--line);padding-top:var(--space-sm);margin-top:var(--space-sm)}.main-nav a{font-size:13px;padding:var(--space-xs) var(--space-sm)}.brand-lockup{font-size:15px}.brand-lockup img{width:36px;height:36px}.editor-link{font-size:11px}.header-actions{gap:var(--space-sm)}.ref-hero{padding-top:var(--space-52)}.ref-hero h1{font-size:48px;line-height:1.05}.ref-hero>p{font-size:16px;line-height:1.65;margin-top:var(--space-lg)}.desktop-break{display:none}.hero-buttons{margin:var(--space-28) 0 var(--space-xl);gap:var(--space-sm)}.hero-buttons .button{font-size:12px;padding:var(--space-sm) var(--space-md);min-height:48px}.hero-film{padding:var(--space-xs);border-radius:14px}.hero-film>img{aspect-ratio:1.1;object-fit:cover;border-radius:8px}.hero-film figcaption{font-size:10px;align-items:start;padding:var(--space-md) var(--space-xs) var(--space-xs);gap:var(--space-20)}.hero-film figcaption span{max-width:48%}.film-play{width:52px;height:52px;inset:calc(50% - 38px) auto auto calc(50% - 26px)}.film-play svg{width:30px}.ref-section{padding-top:var(--space-72)}.ref-section>h2,.ref-faq>h2,.ref-final h2{font-size:37px;line-height:1.12}.ref-feature{grid-template-columns:minmax(0,1fr);gap:var(--space-32);margin-top:var(--space-48)}.ref-feature.reverse .ref-feature-copy{order:0}.ref-feature.reverse .ref-visual{order:0}.ref-feature h3{font-size:36px}.ref-feature-copy p{margin:var(--space-20) 0 var(--space-lg)}.ref-visual{min-height:300px;border-radius:14px}.caption-words{font-size:26px}.poster-card{height:245px;width:164px}.usecase-grid{grid-template-columns:minmax(0,1fr);margin-top:var(--space-36);gap:var(--space-lg)}.usecase-image{height:330px}.usecase-grid h3{font-size:29px}.usecase-grid p{max-width:100%}.ref-steps{grid-template-columns:minmax(0,1fr);padding-block:var(--space-76) var(--space-32);gap:var(--space-xl)}.ref-steps h2{font-size:38px;margin-bottom:var(--space-lg)}.ref-steps li{gap:var(--space-20)}.ref-faq{padding-block:var(--space-44) var(--space-2xl)}.ref-faq>div{margin-top:var(--space-36)}.ref-faq summary{font-size:17px}.ref-faq details p{font-size:15px}.ref-final{padding-block:var(--space-20) var(--space-72)}.ref-final p{font-size:15px}.site-footer .footer-mast{font-size:clamp(48px,12vw,84px)}.page-intro h1,.product-hero h1,.order-layout h1{font-size:47px}.studio .section-head h1{font-size:42px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}