@font-face{font-family:Bricolage;src:url('./assets/bricolage-grotesque.woff2') format('woff2');font-weight:200 800;font-display:swap}
:root{color-scheme:dark;--page:#121212;--surface:#1c1c1c;--raised:#262626;--line:#343434;--text:#fafafa;--muted:#a3a3a3;--dim:#858585;--white:#f5f5f5;--radius:20px;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;color:var(--text);background:var(--page)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button,a{ -webkit-tap-highlight-color:transparent}button{color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:disabled{cursor:not-allowed;opacity:.4}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid #dedede;outline-offset:5px}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}img{display:block;max-width:100%}[hidden]{display:none!important}h1,h2,h3,p{margin:0}h1,h2,h3{text-wrap:balance}p{text-wrap:pretty}h1,h2,h3{font-family:Bricolage,ui-sans-serif,system-ui,'PingFang SC',sans-serif}::selection{background:#ddd;color:#111}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:absolute;left:24px;top:-60px;background:white;color:black;padding:12px;z-index:30}.skip-link:focus{top:8px}
.site-header{height:78px;display:flex;align-items:center;gap:48px;padding:0 40px;border-bottom:1px solid #242424;background:#121212}.brand{display:block;flex-shrink:0}.brand img{width:125px;height:auto}.site-header nav{display:flex;align-items:center;gap:28px;color:#a3a3a3;font-size:13px}.site-header nav .current{color:#fafafa}.header-actions{margin-left:auto;display:flex;align-items:center;gap:20px}.language-button{background:none;border:0;padding:8px;color:#c1c1c1;font-size:12px}.pill{display:inline-flex;align-items:center;justify-content:center;gap:12px;border:1px solid transparent;min-height:46px;padding:0 21px;border-radius:999px;font-size:13px;font-weight:600;white-space:nowrap;transition:background-color .15s ease-out}.primary{color:#151515;background:#f3f3f3}.primary:hover{background:#dcdcdc}.secondary{background:transparent;color:#e2e2e2;border-color:#494949}.secondary:hover{background:#303030}.compact{min-height:37px;font-size:12px;padding:0 17px}
main{max-width:1312px;margin:0 auto;padding:0 40px}.intro{padding:52px 0 35px;text-align:center}.eyebrow{display:flex;align-items:center;justify-content:center;gap:11px;color:#8b8b8b;font-size:10px}.eyebrow>span:last-child{font-size:10px}.tool-tag{border:1px solid #414141;border-radius:999px;padding:5px 11px;color:#cecece;font-size:11px}h1{font-size:44px;line-height:1.23;font-weight:500;margin-top:20px}.intro-copy{color:#aaa;font-size:14px;line-height:1.7;margin-top:15px}.trust-row{display:flex;align-items:center;justify-content:center;gap:24px;color:#b3b3b3;font-size:11px;margin-top:23px}.trust-row>span{display:flex;gap:6px;align-items:center}.trust-row svg{width:14px;height:14px;color:#cfcfcf}
.studio{display:grid;grid-template-columns:minmax(0,1fr) 332px;gap:22px;align-items:start}.viewer-column{min-width:0}.viewer-toolbar{height:47px;display:flex;align-items:center;justify-content:space-between}.viewer-title{display:flex;align-items:center;gap:8px;font-size:12px}.viewer-title svg{width:16px;height:16px;color:#b6b6b6}.mini-tag{font-size:9px;color:#a8a8a8;border:1px solid #3e3e3e;border-radius:5px;padding:3px 6px;white-space:nowrap}.viewer-title .mini-tag{margin-left:3px}.icon-button{background:none;border:0;border-radius:8px;padding:7px;color:#aaa;display:inline-flex;justify-content:center;align-items:center;min-width:32px;min-height:32px}.icon-button:hover{color:#fff;background:#292929}.video-stage{position:relative;background:#080808;aspect-ratio:16/9;border:1px solid #333;overflow:hidden;border-radius:16px}.video-stage video{display:block;width:100%;height:100%;object-fit:contain}.video-label{position:absolute;top:15px;left:15px;border:1px solid #ffffff30;border-radius:6px;background:#101010c9;color:#f1f1f1;font-size:10px;padding:6px 9px;pointer-events:none}.viewer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:14px;gap:10px}.segmented{display:flex;border:1px solid #3a3a3a;background:#1b1b1b;padding:3px;border-radius:999px;gap:3px}.segmented button{font-size:11px;background:none;color:#a1a1a1;border:0;border-radius:999px;padding:8px 15px}.segmented .selected{background:#3a3a3a;color:#fafafa}.video-meta{color:#929292;font-size:10px;font-variant-numeric:tabular-nums}.video-meta span{padding:0 6px}.display-note{display:flex;gap:7px;align-items:flex-start;font-size:10px;line-height:1.6;color:#979797;margin-top:15px}.display-note svg{width:14px;height:14px;margin-top:1px}.examples-heading{display:flex;justify-content:space-between;align-items:center;margin:28px 0 12px;gap:12px}.examples-heading h2{font-size:13px;font-weight:500}.examples-heading>span{color:#929292;font-size:10px}.examples{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.example-card{position:relative;overflow:hidden;background:#1d1d1d;border:1px solid #383838;padding:0;border-radius:12px;text-align:left;min-width:0}.example-card img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}.example-card>span:not(.example-arrow){display:flex;flex-direction:column;gap:5px;padding:11px}.example-card strong{font-size:11px;font-weight:500}.example-card small{color:#989898;font-size:9px;line-height:1.4;padding-right:12px}.example-arrow{position:absolute;bottom:30px;right:11px;color:#bcbcbc;font-size:15px}.example-card:hover{border-color:#777}.example-card:disabled{opacity:.6}
.control-panel{border:1px solid #373737;border-radius:var(--radius);background:#1c1c1c;padding:21px}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:19px}.panel-heading h2{font-size:14px;font-weight:500}.panel-heading .mini-tag{font-size:8px}.upload-zone{border:1px dashed #515151;border-radius:13px;text-align:center;background:#222}.upload-zone.dragging{border-color:#fafafa;background:#333}.upload-action{display:flex;align-items:center;flex-direction:column;gap:8px;width:100%;padding:20px 10px 8px;background:none;border:0;border-radius:12px}.upload-symbol{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#313131;margin-bottom:3px}.upload-symbol svg{width:19px;height:19px}.upload-action strong{font-size:12px;font-weight:500}.upload-action>span:last-child{font-size:10px;color:#999}.upload-zone>p{font-size:9px;color:#9f9f9f;padding:5px 8px 16px;line-height:1.6}.no-footage{font-size:10px;text-align:center;color:#949494;margin:12px 0 23px}.no-footage a{color:#dedede}.no-footage a:hover{text-decoration:underline}.preset-group{margin:0;padding:0;border:0}.preset-group legend{font-size:11px;color:#b5b5b5;margin-bottom:10px}.preset-buttons{display:flex;gap:8px}.preset-buttons button{display:flex;align-items:center;justify-content:center;gap:6px;flex:1;min-height:37px;font-size:11px;border:1px solid #414141;border-radius:9px;background:#262626;color:#a9a9a9}.preset-buttons button>span:first-child{font-size:16px}.preset-buttons button.selected{background:#ececec;border-color:#ececec;color:#171717}.sliders{margin-top:21px;display:grid;gap:19px}.slider-field{display:grid;grid-template-columns:1fr auto;gap:9px}.slider-field label{font-size:11px;color:#c6c6c6}.slider-field output{font-size:10px;color:#c1c1c1;font-variant-numeric:tabular-nums}.slider-field input{grid-column:1/-1;appearance:none;width:100%;margin:0;background:#414141;height:3px;border-radius:999px;accent-color:white}.slider-field input::-webkit-slider-thumb{appearance:none;width:11px;height:11px;border-radius:50%;background:#e7e7e7;cursor:pointer}.slider-field input::-moz-range-thumb{width:11px;height:11px;border:0;border-radius:50%;background:#e7e7e7}.slider-field small{grid-column:1/-1;font-size:9px;color:#929292;line-height:1.5}.resolution-row{margin-top:24px;display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#c6c6c6}.resolution-row select{border:1px solid #484848;background:#292929;color:#e3e3e3;border-radius:6px;padding:5px 8px;font-size:10px}.processing-note{font-size:9px;color:#969696;line-height:1.6;margin-top:16px}.export-actions{display:flex;gap:8px;margin-top:17px}.export-actions .pill{font-size:11px;padding:0 14px;min-height:42px}.export-actions #export-hdr{flex:1}.export-actions svg{width:15px;height:15px}.panel-footnote{text-align:center;color:#949494;font-size:9px;margin-top:11px;line-height:1.6}.file-row{display:flex;gap:9px;align-items:center;padding:14px 10px;border:1px solid #454545;border-radius:10px;background:#252525;min-height:72px}.file-row>div{min-width:0;flex:1;display:grid;gap:6px}.file-row strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:500}.file-row small{font-size:9px;color:#a9a9a9;font-variant-numeric:tabular-nums}.file-icon{font-size:20px;color:#cfcfcf}.validation-message{font-size:10px;color:#b6b6b6;line-height:1.6;margin-top:10px}.error{padding:10px 12px;background:#352426;border:1px solid #71474b;color:#ffc7cb;font-size:11px;border-radius:9px;line-height:1.7;margin-top:15px}.job-status{margin-top:16px}.job-status>div{display:flex;justify-content:space-between;gap:8px;font-size:10px;color:#d5d5d5}.job-status progress{width:100%;height:4px;accent-color:#eee;margin:10px 0 4px;border:0;background:#444}.job-status progress::-webkit-progress-bar{background:#444;border-radius:4px}.job-status progress::-webkit-progress-value{background:#eee;border-radius:4px}.job-status>button{display:block;margin:5px 0 0 auto;background:none;border:0;text-decoration:underline;color:#b6b6b6;font-size:10px;padding:4px}.job-status #job-percent{font-variant-numeric:tabular-nums}
.result-panel{margin-top:26px;border:1px solid #4a4a4a;border-radius:var(--radius);background:#202020;padding:24px}.result-copy{display:flex;gap:12px;align-items:center}.result-check{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#353535;color:#eee}.result-copy h2{font-size:18px;font-weight:500}.result-copy p{color:#aaa;font-size:11px;margin-top:7px;line-height:1.6}.result-actions{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:22px}.text-button{background:none;border:0;color:#bcbcbc;text-decoration:underline;text-underline-offset:4px;font-size:11px;padding:7px 0}.publish-tip{color:#aaa;font-size:11px;line-height:1.8;margin-top:19px}.result-cta{display:flex;justify-content:space-between;gap:15px;border-top:1px solid #3b3b3b;padding-top:18px;margin-top:20px;font-size:12px;color:#e0e0e0}
.how-section{margin-top:88px;padding-top:44px;border-top:1px solid #2c2c2c}.section-intro{text-align:center}.section-kicker{font-size:9px;color:#8c8c8c}.section-intro h2{font-size:28px;font-weight:500;margin-top:14px;line-height:1.4}.section-intro p{color:#a0a0a0;font-size:12px;margin-top:12px}.steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:40px;padding:0;margin:37px 0 0}.steps li{border-top:1px solid #3b3b3b;padding-top:20px}.steps li>span{color:#898989;font-size:11px;font-variant-numeric:tabular-nums}.steps h3{font-size:16px;font-weight:500;margin-top:13px}.steps p{font-size:12px;line-height:1.9;color:#999;margin-top:11px;max-width:300px}.faq-section{display:grid;grid-template-columns:1fr 1.65fr;gap:60px;margin-top:90px;padding-top:36px;border-top:1px solid #2e2e2e}.faq-section>h2{font-size:23px;line-height:1.5;font-weight:500}.faq-list details{border-bottom:1px solid #303030}.faq-list details:first-child{margin-top:-12px}.faq-list summary{padding:18px 24px 18px 0;cursor:pointer;position:relative;font-size:12px;list-style:none;line-height:1.7}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:'+';position:absolute;right:0;font-size:18px;color:#aaa;top:14px}.faq-list details[open] summary:after{content:'−'}.faq-list details p{font-size:11px;color:#aaa;line-height:1.9;padding:0 16px 18px 0}.creation-cta{margin-top:82px;padding:44px 24px;text-align:center;background:#1e1e1e;border:1px solid #343434;border-radius:20px}.creation-cta>img{margin:auto;width:110px;height:auto}.creation-cta h2{font-size:30px;font-weight:500;margin-top:20px}.creation-cta p{color:#a3a3a3;font-size:12px;line-height:1.9;margin-top:12px}.creation-cta .pill{margin-top:24px;font-size:12px}footer{display:flex;align-items:center;justify-content:space-between;gap:20px;max-width:1312px;padding:32px 40px;margin:auto;color:#929292;font-size:10px}.noscript-message{position:fixed;inset:0;background:#121212;padding:60px;z-index:30}
@media(min-width:1500px){.intro{padding-top:62px}}@media(max-width:1000px){main{padding:0 24px}.site-header{padding:0 24px;gap:30px}.studio{grid-template-columns:minmax(0,1fr) 300px;gap:18px}.control-panel{padding:18px}.examples{gap:7px}.example-card small{display:none}.example-arrow{bottom:9px}.example-card>span:not(.example-arrow){padding:10px}.viewer-title .mini-tag{display:none}.export-actions .pill{padding:0 11px;font-size:10px}.intro{padding-top:40px}.intro h1{font-size:38px}.how-section{margin-top:64px}.faq-section{gap:28px}}
@media(max-width:760px){.site-header{height:65px;padding:0 20px;gap:16px}.brand img{width:104px}.site-header nav{display:none}.header-actions{gap:10px}.header-actions .compact{font-size:10px;padding:0 13px;min-height:34px}main{padding:0 20px}.intro{padding:35px 0 28px}.intro h1{font-size:31px;margin-top:18px}.intro-copy{font-size:12px;max-width:340px;margin:13px auto 0}.eyebrow{gap:9px}.trust-row{gap:15px;font-size:9px;margin-top:18px}.trust-row svg{width:12px;height:12px}.studio{grid-template-columns:1fr;gap:25px}.viewer-toolbar{height:36px}.video-stage{border-radius:12px}.video-label{top:10px;left:10px;font-size:9px}.viewer-bottom{padding-top:11px}.segmented button{padding:7px 12px;font-size:10px}.video-meta{font-size:9px}.display-note{font-size:9px;margin-top:12px}.examples-heading{margin-top:23px}.examples-heading h2{font-size:12px}.examples-heading>span{font-size:9px}.example-card strong{font-size:10px}.control-panel{padding:22px}.panel-heading h2{font-size:15px}.upload-action{padding-top:17px}.upload-zone>p{font-size:10px}.preset-group legend,.slider-field label,.resolution-row{font-size:12px}.preset-buttons button{font-size:12px}.sliders{gap:23px}.slider-field input{height:4px}.slider-field input::-webkit-slider-thumb{width:15px;height:15px}.slider-field output{font-size:11px}.slider-field small,.processing-note,.panel-footnote{font-size:10px}.export-actions .pill{font-size:12px;min-height:46px;padding:0 17px}.no-footage{font-size:11px}.how-section{margin-top:50px;padding-top:33px}.section-intro h2{font-size:25px}.section-intro p{font-size:11px}.steps{grid-template-columns:1fr;gap:23px;margin-top:30px}.steps li{display:grid;grid-template-columns:28px 1fr;column-gap:12px;padding-top:18px}.steps li>span{grid-row:1/3;padding-top:4px}.steps h3{margin:0;font-size:15px}.steps p{font-size:11px;max-width:none;margin-top:8px;grid-column:2}.faq-section{display:block;margin-top:48px;padding-top:27px}.faq-section>h2{font-size:21px;margin-bottom:25px}.faq-list summary{font-size:12px}.creation-cta{margin-top:47px;padding:35px 20px}.creation-cta h2{font-size:26px}.creation-cta p{font-size:11px}.result-panel{padding:20px}.result-copy h2{font-size:15px}.result-actions{gap:15px}.result-actions .pill{width:100%}.result-cta{font-size:11px;line-height:1.8}.publish-tip{font-size:10px}footer{padding:25px 20px;font-size:9px}footer>span:nth-child(2){display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
.brand{display:inline-flex;align-items:center;gap:7px}.brand img:first-child{width:32px;height:32px}.brand img:last-child{width:90px;height:22px}.footer-brand{justify-content:center}
@media(max-width:760px){.brand{gap:6px}.brand img:first-child{width:27px;height:27px}.brand img:last-child{width:76px;height:auto}}
@media(max-width:760px){.example-card .example-arrow{display:none}.example-card strong{line-height:1.5}}

/* Keep the existing PixTV segmented style; allow the third mode on narrow screens. */
.viewer-bottom{flex-wrap:wrap}.segmented button{white-space:nowrap}

/* Generation workflow uses the existing PixTV grayscale surfaces and controls. */
.control-help{font-size:10px;color:#aaa;line-height:1.65;margin:8px 0 0}
.preset-group .preset-buttons{margin-top:12px}
.preset-buttons button{height:auto;min-height:62px;min-width:0;flex-direction:column;gap:5px;padding:10px 5px;justify-content:center}
.preset-buttons button>.preset-name{font-size:11px}
.preset-name>span[aria-hidden]{font-size:16px}
.preset-name{display:flex;align-items:center;justify-content:center;gap:5px}
.preset-buttons small{font-size:9px;line-height:1.4;font-weight:400;opacity:.8}
.preset-description{min-height:34px}
.fine-tune{margin:18px 0;padding:9px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.fine-tune summary{font-size:12px;line-height:1.7;padding:7px 0;cursor:pointer}
.fine-tune summary .mini-tag{margin-left:8px}
.fine-tune .sliders{margin:18px 0 12px;gap:20px}
.fine-tune .slider-field small{line-height:1.6;color:#aaa}
.control-step{font-family:inherit;font-size:12px;font-weight:500;line-height:1.6;margin:18px 0 12px}
.export-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}
.export-actions .pill{white-space:normal;text-align:center;line-height:1.4;min-height:48px;padding:9px 14px;min-width:0}
.export-actions #download-hdr{min-height:36px;padding:7px 12px;font-size:10px}
.export-actions #download-hdr svg{width:14px;height:14px}
.generated-cta{display:block;text-align:center;font-size:10px;line-height:1.7;color:#ccc;margin-top:14px}
.viewer-state,.result-warning{margin-top:12px;padding:9px 12px;border:1px solid #3b3b3b;border-radius:9px;background:#191919;color:#bbb;font-size:11px;line-height:1.65}
.viewer-state.pending,.result-warning{border-color:#777;background:#252525;color:#f2f2f2}
#result-settings{font-size:11px;line-height:1.7;margin-top:6px;color:#aaa}
@media(max-width:760px){.preset-buttons button>.preset-name{font-size:12px}.preset-buttons small{font-size:10px}.control-help{font-size:11px}.current-configuration,.current-configuration .text-button{font-size:11px}.fine-tune summary,.control-step{font-size:12px}}

/* Real, static before/after: native range is keyboard and touch operable. */
.comparison-section{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:48px;align-items:center;margin:0 0 56px;padding:10px 0 38px;border-bottom:1px solid var(--line)}
.comparison-demo{min-width:0}.comparison-scenes{display:flex;gap:7px;margin-bottom:12px;flex-wrap:wrap}
.comparison-scenes button{background:transparent;border:1px solid var(--line);border-radius:999px;padding:8px 12px;font-size:11px;color:#aaa;min-height:34px}
.comparison-scenes button[aria-pressed=true]{background:#e8e8e8;border-color:#e8e8e8;color:#171717}
.comparison-frame{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#1c1c1c;border:1px solid var(--line)}
.comparison-frame img{display:block;width:100%;height:100%;object-fit:contain}.comparison-frame .comparison-after{position:absolute;inset:0;clip-path:inset(0 0 0 var(--split))}
.comparison-line{position:absolute;top:0;bottom:0;left:var(--split);width:2px;background:#eee;transform:translateX(-1px);pointer-events:none}
.comparison-line>span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;background:#eee;color:#161616;border:1px solid #ddd;border-radius:50%;width:32px;height:32px;font-size:18px}
.comparison-label{position:absolute;top:12px;background:#151515d9;color:#fafafa;border:1px solid #ffffff30;border-radius:6px;font-size:10px;padding:6px 8px;pointer-events:none}.comparison-label.before{left:12px}.comparison-label.after{right:12px}
.comparison-slider{display:flex;gap:20px;align-items:center;margin-top:10px}.comparison-slider label{font-size:10px;color:#bbb;flex-shrink:0}.comparison-slider input{width:100%;min-width:0;height:32px;margin:0;accent-color:#e5e5e5;cursor:ew-resize}
#comparison-note{font-size:10px;line-height:1.7;color:#999;margin-top:3px}.comparison-copy h2{font-size:26px;font-weight:500;line-height:1.4;margin:12px 0}.comparison-lead{font-size:12px;line-height:1.9;color:#aaa}
.comparison-benefits{list-style:none;margin:22px 0;padding:0;display:grid;gap:17px}.comparison-benefits li{display:flex;gap:14px}.comparison-benefits li>span{font-size:10px;color:#999;font-variant-numeric:tabular-nums;padding-top:3px}.comparison-benefits h3{font-size:13px;font-weight:500;line-height:1.5}.comparison-benefits p{font-size:11px;color:#aaa;line-height:1.8;margin-top:4px}.comparison-copy .pill{font-size:11px}
@media(max-width:1000px){.comparison-section{gap:28px}.comparison-copy h2{font-size:23px}.comparison-benefits{gap:12px;margin:16px 0}.comparison-lead{font-size:11px}}
@media(max-width:760px){.comparison-section{grid-template-columns:1fr;gap:22px;margin-bottom:26px;padding-bottom:28px}.comparison-scenes{gap:6px}.comparison-scenes button{font-size:10px;min-height:36px}.comparison-copy h2{font-size:24px}.comparison-lead{font-size:12px}.comparison-benefits{gap:16px}.comparison-benefits h3{font-size:13px}.comparison-benefits p{font-size:11px}.comparison-slider{gap:12px}.comparison-slider label{font-size:10px}.comparison-label{font-size:9px}.comparison-copy .pill{min-height:42px}}
/* Keep the new comparison within the first view without changing type or colors. */
.intro{padding-top:32px;padding-bottom:24px}.intro h1{margin-top:14px}.intro .trust-row{margin-top:16px}
@media(max-width:760px){.intro{padding-top:28px;padding-bottom:22px}}
.comparison-frame{touch-action:pan-y;cursor:ew-resize}.comparison-frame:focus-within{outline:2px solid #dedede;outline-offset:4px}

/* Soft ambient color inspired by PixTV, with spacing instead of section rules. */
body{background:radial-gradient(ellipse 65% 420px at 24% 0%,rgba(77,69,129,.24),transparent 75%),radial-gradient(ellipse 55% 360px at 75% 0%,rgba(126,78,60,.16),transparent 75%),#121212}.site-header{background:transparent;border-bottom:0}.comparison-section{display:block;max-width:960px;margin:0 auto 150px;padding:0;border:0}.comparison-demo{width:100%}.studio{margin-bottom:150px}.how-section,.faq-section{border-top:0;padding-top:0;margin-top:150px}.steps li{border-top:0}.creation-cta{margin-top:150px}.hdr-requirement{color:#bbb;font-size:11px;line-height:1.6;margin-top:12px}.intro{padding-bottom:42px}@media(max-width:760px){.comparison-section{margin-bottom:92px}.studio{margin-bottom:92px}.how-section,.faq-section{margin-top:92px}.creation-cta{margin-top:92px}.intro{padding-bottom:30px}}

/* Group the three steps into one quiet, self-contained PixTV panel. */
.how-section{padding:50px;background:#1b1b1e;border:1px solid #303034;border-radius:24px}
.how-section .steps{gap:12px;margin-top:34px}
.how-section .steps li{display:flex;flex-direction:column;align-items:flex-start;min-width:0;min-height:172px;padding:24px;border:1px solid #353538;border-radius:16px;background:#242426}
.how-section .steps li>span{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:#343438;color:#d0d0d0;font-size:11px}
.how-section .steps h3{margin-top:18px;font-size:15px}
.how-section .steps p{margin-top:8px;font-size:12px;line-height:1.7}
@media(max-width:760px){.how-section{padding:28px 20px;border-radius:20px}.how-section .steps{gap:10px;margin-top:26px}.how-section .steps li{display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:14px;min-height:0;padding:18px}.how-section .steps li>span{grid-row:1/3;padding:0}.how-section .steps h3{grid-column:2;margin:0;font-size:14px}.how-section .steps p{grid-column:2;margin-top:5px;font-size:11px}}