.hero{min-height:min(calc(100svh - var(--site-header-height)), 880px);grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:center;gap:40px;padding-block:24px 64px;display:grid}.hero-copy{justify-items:start;gap:26px;display:grid}.hero-title{font-size:clamp(40px,4.7vw,70px)}.hero-line{display:block}.hero-char{animation:.9s cubic-bezier(.2,1.25,.4,1) both hero-char-in;animation-delay:calc(var(--i) * 45ms + .12s);display:inline-block}.hero-char.is-marked{position:relative}.hero-char.is-marked:after{content:"";z-index:-1;background:var(--brand-soft);transform-origin:0;height:.34em;animation:hero-mark .3s var(--ease) forwards;animation-delay:calc(1.1s + var(--m) * 90ms);position:absolute;inset:auto -.03em .06em;transform:scaleX(0)}.hero-lead{max-width:30em;color:var(--ink-soft);font-size:17px;line-height:1.75}.hero-try{gap:10px;width:min(100%,500px);display:grid}.hero-try-label{color:var(--muted);font-size:13px;font-weight:600}.hero-try-row{gap:10px;display:flex}.hero-try-input{flex:1;min-width:0;height:52px;font-size:17px}.hero-try-go{height:52px}.hero-stage{place-items:center;height:min(76svh,700px);display:grid;position:relative}.hero-phone,.hero-side{aspect-ratio:9/16;background:#111;overflow:hidden}.hero-phone{z-index:2;height:calc(100% - 52px);animation:hero-rise 1s var(--ease) .25s both;border-radius:30px;align-self:start;position:relative;box-shadow:0 2px 4px #1a1e1414,0 40px 80px #1a1e1433}.hero-phone img,.hero-phone canvas,.hero-side video{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.hero-phone canvas{opacity:0;transition:opacity .4s var(--ease)}[data-live] .hero-phone canvas{opacity:1}.hero-live{color:var(--muted);align-items:center;gap:8px;font-size:13px;font-weight:600;display:inline-flex;position:absolute;bottom:0}.hero-live-dot{background:#4ade80;border-radius:50%;width:7px;height:7px;animation:1.6s ease-in-out infinite hero-blink}.hero-side{z-index:1;border-radius:22px;height:72%;position:absolute;top:calc(50% - 26px);box-shadow:0 24px 56px #1a1e1426}.hero-side-left{--tilt:-8deg;left:2%}.hero-side-right{--tilt:8deg;right:2%}.hero-side{transform:translateY(-50%) rotate(var(--tilt));animation:hero-fan 1.1s var(--ease) .55s both}@keyframes hero-char-in{0%{opacity:0;filter:blur(6px);transform:translateY(.45em)rotate(6deg)scale(.9)}}@keyframes hero-mark{to{transform:scaleX(1)}}@keyframes hero-rise{0%{opacity:0;transform:translateY(48px)scale(.96)}}@keyframes hero-fan{0%{opacity:0;transform:translateY(-50%)rotate(0)scale(.9)}}@keyframes hero-blink{50%{opacity:.35}}@media (width<=900px){.hero{grid-template-columns:minmax(0,1fr);gap:36px;min-height:0;padding-block:16px 48px}.hero-stage{height:560px}}@media (width<=560px){.hero-copy{gap:20px}.hero-title{font-size:clamp(30px,9.6vw,48px)}.hero-lead{font-size:15px}.hero-try-row{flex-direction:column}.hero-try-input{flex:none}.hero-stage{overflow-clip-margin:var(--page-gutter);height:480px;overflow:clip}.hero-side{height:64%}.hero-side-left{left:0}.hero-side-right{right:0}}@media (prefers-reduced-motion:reduce){.hero-char,.hero-phone,.hero-side,.hero-live-dot{animation:none}.hero-char.is-marked:after{animation:none;transform:none}}.ticker{border-block:1px solid var(--line);padding-block:20px;overflow:hidden;mask-image:linear-gradient(90deg,#0000,#000 10% 90%,#0000)}.ticker-track{width:max-content;margin:0;padding:0;list-style:none;animation:48s linear infinite ticker;display:flex}.ticker-track li{font-family:var(--display);letter-spacing:-.02em;white-space:nowrap;align-items:center;font-size:clamp(20px,2.4vw,28px);font-weight:900;display:flex}.ticker-track li:after{content:"";background:var(--brand-accent);border-radius:3px;width:10px;height:10px;margin-inline:36px;transform:rotate(45deg)}@keyframes ticker{to{transform:translate(-50%)}}@media (prefers-reduced-motion:reduce){.ticker-track{animation:none}}.steps{padding-top:var(--section-space)}.steps-stack{gap:28px;margin:0;padding:0;list-style:none;display:grid}.step-card{top:calc(var(--site-header-height) + 20px + var(--i) * 18px);min-height:min(540px, calc(100svh - var(--site-header-height) - 120px));border:1px solid var(--line);background:var(--paper-raised);border-radius:36px;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);align-items:center;gap:40px;padding:clamp(28px,4.5vw,60px);display:grid;position:sticky;overflow:clip;box-shadow:0 -16px 48px #1a1e1412}.step-edit{background:color-mix(in srgb, var(--brand-halo) 70%, white);border-color:#0000}.step-export{background:var(--night);color:#fff;border-color:#0000}.step-text{gap:16px;display:grid}.step-no{font:600 14px var(--mono);color:var(--muted)}.step-text h3{font-family:var(--display);letter-spacing:-.035em;font-size:clamp(32px,4vw,54px);font-weight:900;line-height:1.1}.step-text p{max-width:26em;color:var(--ink-soft);font-size:17px;line-height:1.75}.step-export .step-text p,.step-export .step-no{color:var(--night-muted)}.step-visual{place-items:center;min-height:340px;display:grid}@media (width<=860px){.step-card{min-height:0;top:calc(var(--site-header-height) + 12px + var(--i) * 12px);grid-template-columns:minmax(0,1fr);gap:28px}.step-visual{min-height:260px}}@media (width<=560px){.step-card{border-radius:28px}.step-text p{font-size:15px}}.pick-fan{width:100%;height:360px;position:relative}.pick-fan>*{aspect-ratio:9/16;border-radius:18px;width:auto;height:290px;transition:transform 1s cubic-bezier(.2,1.2,.3,1);position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%);box-shadow:0 18px 40px #1a1e1430}.pick-fan img{object-fit:cover}.pick-poster{background:#111}.is-in .pick-fan>:first-child{transform:translate(-50%,-50%)translate(-118%,18px)rotate(-12deg)}.is-in .pick-fan>:nth-child(2){transition-delay:80ms;transform:translate(-50%,-50%)translate(-40%,-6px)rotate(-4deg)}.is-in .pick-fan>:nth-child(3){transition-delay:.16s;transform:translate(-50%,-50%)translate(40%,-6px)rotate(4deg)}.is-in .pick-fan>:nth-child(4){transition-delay:.24s;transform:translate(-50%,-50%)translate(118%,18px)rotate(12deg)}.edit-demo{grid-template-columns:minmax(0,1fr) 150px;align-items:center;gap:24px;width:min(100%,460px);display:grid}.edit-field{background:#fff;border-radius:18px;gap:8px;padding:16px;display:grid;box-shadow:0 12px 28px #1a1e1414}.edit-label{color:var(--muted);font-size:13px;font-weight:600}.edit-input{border:1px solid var(--control-border);border-radius:12px;align-items:center;height:46px;padding:0 14px;font-size:18px;display:flex}.edit-typed{width:calc(var(--n) * 1ch + 3px);font-family:var(--mono);border-right:2px solid var(--ink);white-space:nowrap;display:inline-block;overflow:hidden}.edit-swatches{grid-column:1;gap:10px;padding-left:4px;display:flex}.edit-swatches span{background:var(--c);border-radius:50%;width:26px;height:26px}.edit-swatches span:first-child{box-shadow:0 0 0 3px #fff, 0 0 0 5px var(--c)}.edit-screen{aspect-ratio:9/16;color:#fff;background:#0f8f86;border-radius:18px;grid-area:1/2/3;align-content:center;place-items:center;gap:10px;display:grid;box-shadow:0 18px 40px #1a1e1430}.edit-screen-name{font-family:var(--display);letter-spacing:-.03em;font-size:26px;font-weight:900}.edit-screen-bar{background:#f4b740;border-radius:3px;width:56px;height:5px}.is-in .edit-typed{animation:edit-type 4.8s steps(var(--n), end) infinite, edit-caret .8s step-end infinite}.is-in .edit-screen-name,.is-in .edit-screen-bar{animation:4.8s cubic-bezier(.2,1.3,.4,1) infinite edit-pop}.export-demo{gap:22px;width:min(100%,420px);display:grid}.export-demo-bar{background:#ffffff1f;border-radius:999px;height:10px;overflow:hidden}.export-demo-bar span{border-radius:inherit;background:var(--brand-accent);transform-origin:0;width:100%;height:100%;display:block}.export-demo-file{background:#ffffff14;border-radius:18px;align-items:center;gap:14px;padding:16px 18px;display:flex}.export-demo-file svg{background:var(--brand-accent);fill:none;stroke:#fff;stroke-width:2.4px;stroke-linecap:round;stroke-linejoin:round;border-radius:50%;flex:none;width:36px;height:36px;padding:7px}.export-demo-file span{gap:4px;display:grid}.export-demo-file small{color:var(--night-muted);font-size:13px}.is-in .export-demo-bar span{animation:4.4s ease-in-out infinite export-fill}.is-in .export-demo-file{animation:export-done 4.4s var(--ease) infinite}@keyframes edit-type{0%,8%{width:0}40%,86%{width:calc(var(--n) * 1ch + 3px)}96%,to{width:0}}@keyframes edit-caret{50%{border-color:#0000}}@keyframes edit-pop{0%,40%{opacity:0;transform:scale(.7)}48%,88%{opacity:1;transform:none}96%,to{opacity:0}}@keyframes export-fill{0%{transform:scaleX(0)}58%,to{transform:scaleX(1)}}@keyframes export-done{0%,58%{opacity:0;transform:translateY(12px)}66%,92%{opacity:1;transform:none}to{opacity:0}}@media (width<=860px){.pick-fan{height:280px}.pick-fan>*{height:220px}}@media (width<=560px){.pick-fan>*{height:180px}.edit-demo{grid-template-columns:minmax(0,1fr) 104px;gap:14px}.edit-screen-name{font-size:18px}}@media (prefers-reduced-motion:reduce){.pick-fan>*{transition:none}.is-in .edit-typed,.is-in .edit-screen-name,.is-in .edit-screen-bar,.is-in .export-demo-bar span,.is-in .export-demo-file{animation:none}}.why{padding-top:var(--section-space)}.why .section-head{margin-bottom:28px}.why-statement{letter-spacing:-.02em;max-width:21em;font-size:clamp(30px,4.4vw,58px);line-height:1.3}.why-statement span{opacity:clamp(.14, calc((var(--p,0) * (var(--n) + 8) - var(--i)) / 8), 1)}.why-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:64px 0 0;padding:0;list-style:none;display:grid}.why-point{border:1px solid var(--line);background:var(--paper-raised);border-radius:24px;align-content:start;gap:14px;padding:26px 24px;display:grid}.why-point:nth-child(2){transition-delay:80ms}.why-point:nth-child(3){transition-delay:.16s}.why-point:nth-child(4){transition-delay:.24s}.why-point h3{font-family:var(--display);letter-spacing:-.03em;font-size:28px;font-weight:900}.why-point p{gap:4px;font-size:15px;line-height:1.6;display:grid}.why-point p span{font-size:12px;font-weight:600}.why-ai{color:var(--muted)}.why-us span{color:var(--brand-main)}@media (width<=900px){.why-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=560px){.why-grid{grid-template-columns:minmax(0,1fr);margin-top:40px}}.facts{margin-top:var(--section-space);background:var(--night);color:#fff}.facts-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 32px;margin-block:0;padding-block:clamp(64px,8vw,104px);padding-inline:0;list-style:none;display:grid}.facts-grid strong{font-size:clamp(48px,5.8vw,84px);line-height:1;display:block}.facts-grid strong span{color:var(--brand-soft);margin-left:.06em;font-size:.38em}.facts-grid p{color:var(--night-muted);margin-top:14px;font-size:15px}.facts-grid li:nth-child(2){transition-delay:80ms}.facts-grid li:nth-child(3){transition-delay:.16s}.facts-grid li:nth-child(4){transition-delay:.24s}@media (width<=860px){.facts-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.closing{padding-top:var(--section-space)}.closing-panel{border:1px solid var(--line);background:radial-gradient(circle at 85% 0%, var(--brand-soft), transparent 50%), radial-gradient(circle at 0% 100%, var(--brand-halo), transparent 60%), var(--paper-raised);text-align:center;border-radius:40px;justify-items:center;gap:22px;padding:clamp(56px,8vw,112px) clamp(20px,6vw,80px);display:grid}.closing-panel h2{font-size:clamp(40px,6.4vw,84px)}.closing-panel p{max-width:30em;color:var(--ink-soft);font-size:17px;line-height:1.75}.closing-actions{flex-wrap:wrap;justify-content:center;gap:12px;margin-top:8px;display:flex}
