:root {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #f5f5f4;
  background: #09090b;
  font-synthesis: none;
  --bg: #09090b;
  --surface: #111113;
  --surface-2: #17171a;
  --line: #29292e;
  --muted: #8b8b95;
  --muted-2: #606069;
  --accent: #c9ff38;
  --accent-soft: #b2e82d;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; }
body { margin: 0; overflow-x: hidden; background: var(--bg); color: #f5f5f4; }
body::before { position: fixed; z-index: -1; inset: 0; background-image: linear-gradient(rgb(255 255 255 / .018) 1px, transparent 1px), linear-gradient(90deg, rgb(255 255 255 / .018) 1px, transparent 1px); background-size: 52px 52px; content: ""; mask-image: linear-gradient(to bottom, black, transparent 72%); }
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
.section-shell { width: min(1220px, calc(100% - 48px)); margin-inline: auto; }
.section-block { padding-block: 104px; }
.eyebrow { margin: 0; color: var(--accent); font-size: 11px; font-weight: 900; letter-spacing: .2em; text-transform: uppercase; }
h1, h2, h3, p { text-wrap: pretty; }
h1 { max-width: 670px; margin: 18px 0 22px; font-size: clamp(50px, 5.4vw, 78px); line-height: .96; letter-spacing: -.058em; }
h2 { margin: 13px 0 18px; font-size: clamp(34px, 4vw, 52px); line-height: 1; letter-spacing: -.045em; }
.lead { max-width: 680px; margin: 0; color: #b0b0b8; font-size: 17px; line-height: 1.72; }
.lead-small { color: #aaaab3; font-size: 16px; line-height: 1.7; }
.button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; border: 1px solid #3a3a40; border-radius: 10px; padding: 0 18px; font-size: 12px; font-weight: 850; letter-spacing: -.01em; transition: transform .18s ease, border-color .18s ease, background .18s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { border-color: var(--accent); background: var(--accent); color: #09090b; box-shadow: 0 0 0 1px rgb(201 255 56 / .1), 0 12px 32px rgb(201 255 56 / .12); }
.button-primary:hover { background: #d6ff67; }
.button-secondary { background: #17171a; color: #f5f5f4; }
.button-secondary:hover { border-color: #66666e; }
.button-large { min-height: 52px; padding-inline: 24px; font-size: 13px; }
.is-disabled { pointer-events: none; opacity: .48; box-shadow: none; }

.site-header { position: sticky; top: 0; z-index: 20; display: flex; min-height: 72px; align-items: center; gap: 30px; border-bottom: 1px solid rgb(255 255 255 / .08); padding: 10px max(24px, calc((100vw - 1220px) / 2)); background: rgb(9 9 11 / .9); backdrop-filter: blur(18px); }
.brand { display: flex; align-items: center; margin-right: auto; }
.brand img { width: 200px; height: auto; object-fit: contain; }
.site-header nav { display: flex; align-items: center; gap: 25px; color: #9b9ba4; font-size: 12px; font-weight: 700; }
.site-header nav a:hover { color: var(--accent); }
.header-download { min-height: 40px; }

.hero { position: relative; display: grid; min-height: 720px; grid-template-columns: .87fr 1.13fr; align-items: center; gap: 60px; padding-block: 86px 92px; }
.hero::after { position: absolute; z-index: -1; top: 13%; right: -11%; width: 560px; height: 560px; border-radius: 50%; background: rgb(201 255 56 / .07); content: ""; filter: blur(100px); }
.actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 30px; }
.trust-row { display: flex; flex-wrap: wrap; gap: 17px; margin-top: 25px; color: #92929b; font-size: 11px; font-weight: 700; }
.trust-row span { display: inline-flex; align-items: center; gap: 7px; }
.trust-row i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 10px rgb(201 255 56 / .6); }
.mobile-download-note { display: none; color: var(--muted); font-size: 11px; }

.product-window { overflow: hidden; border: 1px solid #3a3a41; border-radius: 18px; background: #0c0c0e; box-shadow: 0 34px 90px rgb(0 0 0 / .55); }
.hero-product { transform: perspective(1400px) rotateY(-4deg) rotateX(1deg); transform-origin: center right; }
.window-bar { display: flex; height: 40px; align-items: center; gap: 6px; border-bottom: 1px solid #29292e; padding: 0 13px; color: #696972; font-size: 9px; }
.window-bar > span { width: 7px; height: 7px; border-radius: 50%; background: #36363b; }
.window-bar b { margin-left: 7px; color: #81818a; font-weight: 700; }
.window-bar em { margin-left: auto; color: var(--accent); font-style: normal; }
.window-body { display: grid; min-height: 430px; grid-template-columns: 126px 1fr; }
.preview-sidebar { display: flex; flex-direction: column; gap: 7px; border-right: 1px solid #29292e; padding: 18px 11px; color: #65656d; font-size: 9px; }
.preview-sidebar img { width: 43px; height: 32px; margin: 1px 5px 18px; object-fit: contain; }
.preview-sidebar i { border-radius: 7px; padding: 9px; font-style: normal; font-weight: 700; }
.preview-sidebar .active { background: #202024; color: var(--accent); }
.dashboard-preview { padding: 28px; }
.preview-heading { display: flex; align-items: flex-start; justify-content: space-between; }
.preview-heading small, .dashboard-preview small { color: #686871; font-size: 8px; font-weight: 900; letter-spacing: .16em; }
.preview-heading h2 { margin: 6px 0 0; font-size: 25px; }
.preview-heading > span { border: 1px solid rgb(201 255 56 / .3); border-radius: 999px; padding: 5px 8px; color: var(--accent); font-size: 7px; font-weight: 900; }
.source-field { display: flex; min-height: 52px; align-items: center; gap: 12px; margin-top: 22px; border: 1px solid #303036; border-radius: 10px; padding: 0 12px; background: #111114; font-size: 9px; }
.source-field b { border-radius: 6px; padding: 6px 8px; background: #26262b; color: #f5f5f4; }
.source-field span { overflow: hidden; flex: 1; color: #696972; text-overflow: ellipsis; white-space: nowrap; }
.source-field em { color: #9c9ca5; font-style: normal; }
.preview-settings { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 10px; }
.preview-settings > span { min-width: 0; border: 1px solid #28282e; border-radius: 9px; padding: 11px; background: #101012; }
.preview-settings b { display: block; overflow: hidden; margin-top: 6px; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.analysis-row { display: flex; align-items: center; gap: 11px; margin-top: 12px; border: 1px solid rgb(201 255 56 / .2); border-radius: 10px; padding: 11px; background: rgb(201 255 56 / .035); }
.analysis-orb { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 8px; background: var(--accent); }
.analysis-orb i { width: 8px; height: 8px; border: 2px solid #09090b; border-radius: 50%; }
.analysis-row strong { display: block; margin-top: 3px; font-size: 10px; }
.analysis-row > b { margin-left: auto; color: var(--accent); font-size: 8px; }
.mini-results { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 12px; }
.mini-results > span { min-width: 0; border-radius: 9px; padding: 6px; background: #17171a; }
.mini-scene { display: block; height: 53px; border-radius: 6px; background: linear-gradient(135deg, #263245, #0c1118 66%); }
.mini-scene-b { background: linear-gradient(135deg, #3c202b, #111014 66%); }
.mini-scene-c { background: linear-gradient(135deg, #293f33, #0f1210 66%); }
.mini-results b { display: block; overflow: hidden; margin-top: 7px; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.mini-results small { display: block; margin-top: 3px; letter-spacing: 0; }

/* SECTIONS */
.section-heading { max-width: 780px; }
.section-heading > p:not(.eyebrow), .split-heading > p { color: #8f8f98; font-size: 14px; line-height: 1.75; }
.centered-heading { margin-inline: auto; text-align: center; }
.centered-heading > p:last-child { max-width: 660px; margin-inline: auto; }
.split-heading { display: grid; max-width: none; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); align-items: end; gap: 70px; }

.transformation { padding-top: 118px; }
.transformation-flow { display: grid; grid-template-columns: 225px 98px minmax(0, 1fr); align-items: center; gap: 20px; margin-top: 52px; }
.source-card { padding: 10px; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); }
.source-thumbnail { position: relative; display: grid; height: 170px; place-items: center; overflow: hidden; border-radius: 10px; background: linear-gradient(145deg, #29374a, #11151c 68%); }
.source-thumbnail::before, .clip-preview::before { position: absolute; inset: 0; background: linear-gradient(150deg, transparent 35%, rgb(0 0 0 / .42)), repeating-linear-gradient(90deg, transparent 0 38px, rgb(255 255 255 / .025) 39px 40px); content: ""; }
.source-thumbnail > span { position: absolute; top: 10px; left: 10px; border-radius: 5px; padding: 5px 7px; background: #ef4444; color: white; font-size: 7px; font-weight: 900; }
.source-thumbnail > em { position: absolute; right: 9px; bottom: 9px; border-radius: 4px; padding: 4px 6px; background: rgb(0 0 0 / .72); font-size: 8px; font-style: normal; }
.source-player { position: relative; width: 46px; height: 58px; border-radius: 18px 18px 7px 7px; background: #65758c; box-shadow: 0 40px 0 12px #1d2633; }
.source-card > small, .results-label small { display: block; margin: 14px 3px 0; color: var(--accent); font-size: 8px; font-weight: 900; letter-spacing: .18em; }
.source-card h3 { margin: 6px 3px 4px; font-size: 15px; }
.source-card p { margin: 0 3px 4px; color: #71717a; font-size: 10px; }
.processor { display: flex; flex-direction: column; align-items: center; color: #7b7b84; text-align: center; }
.processor::before, .processor::after { width: 100%; height: 1px; background: linear-gradient(90deg, transparent, #3d3d43, transparent); content: ""; }
.processor > i { position: relative; width: 42px; height: 42px; margin: 13px 0 10px; border: 1px solid rgb(201 255 56 / .28); border-radius: 50%; background: rgb(201 255 56 / .06); }
.processor > i::before { position: absolute; inset: 12px; border: 3px solid var(--accent); border-top-color: transparent; border-radius: 50%; content: ""; animation: spin 3s linear infinite; }
.processor strong { color: #d4d4d8; font-size: 9px; }
.processor span { margin: 3px 0 13px; font-size: 7px; }
.clip-results { min-width: 0; border: 1px solid #303036; border-radius: 18px; padding: 18px; background: #0e0e10; }
.results-label { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.results-label h3 { margin: 5px 3px 0; font-size: 20px; }
.results-label > span { color: #74747d; font: 800 8px ui-monospace, monospace; }
.clip-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; margin-top: 16px; }
.clip-grid article { min-width: 0; }
.clip-preview { position: relative; aspect-ratio: 9 / 16; overflow: hidden; border: 1px solid #34343a; border-radius: 11px; background: linear-gradient(160deg, #283a52 0 34%, #15202d 35% 58%, #090c10 59%); }
.clip-b { background: linear-gradient(160deg, #462334 0 32%, #251722 33% 62%, #0f0b0e 63%); }
.clip-c { background: linear-gradient(160deg, #314937 0 34%, #1d2c22 35% 60%, #0b100d 61%); }
.clip-preview::after { position: absolute; top: 25%; left: 50%; width: 52px; height: 70px; border-radius: 24px 24px 8px 8px; background: rgb(214 223 233 / .5); box-shadow: 0 57px 0 23px rgb(22 28 34 / .82); content: ""; transform: translateX(-50%); }
.reticle { position: absolute; z-index: 2; top: 48%; left: 50%; width: 30px; height: 30px; border: 1px solid rgb(255 255 255 / .55); border-radius: 50%; transform: translate(-50%, -50%); }
.reticle::before, .reticle::after { position: absolute; top: 50%; left: 50%; background: rgb(255 255 255 / .65); content: ""; transform: translate(-50%, -50%); }
.reticle::before { width: 42px; height: 1px; }
.reticle::after { width: 1px; height: 42px; }
.reaction-face { position: absolute; z-index: 2; top: 30%; left: 50%; width: 57px; height: 57px; border: 3px solid rgb(255 255 255 / .42); border-radius: 50%; transform: translateX(-50%); }
.hard-subtitle { position: absolute; z-index: 3; right: 8px; bottom: 34px; left: 8px; color: white; font-size: 10px; font-weight: 950; line-height: 1.15; text-align: center; text-shadow: 0 2px 2px #000, 1px 1px 0 #000, -1px -1px 0 #000; }
.clip-preview > em { position: absolute; z-index: 3; right: 7px; bottom: 7px; border-radius: 4px; padding: 3px 5px; background: rgb(0 0 0 / .7); font-size: 7px; font-style: normal; }
.clip-grid h4 { margin: 9px 2px 2px; font-size: 11px; }
.clip-grid p { margin: 0 2px; color: #686871; font-size: 8px; }

.workflow { border-block: 1px solid var(--line); background: #101012; }
.workflow-row { position: relative; display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; margin: 46px 0 0; padding: 0; list-style: none; }
.workflow-row::before { position: absolute; top: 20px; right: 8%; left: 8%; height: 1px; background: #35353b; content: ""; }
.workflow-row li { position: relative; padding-right: 25px; }
.workflow-row span { position: relative; z-index: 1; display: grid; width: 40px; height: 40px; place-items: center; border: 1px solid #414148; border-radius: 9px; background: #151518; color: var(--accent); font: 900 10px ui-monospace, monospace; }
.workflow-row h3 { margin: 20px 0 7px; font-size: 16px; }
.workflow-row p { max-width: 160px; margin: 0; color: #797982; font-size: 11px; line-height: 1.6; }

.core-feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 58px; border-block: 1px solid var(--line); }
.core-feature-grid article { position: relative; min-height: 330px; padding: 36px 34px 36px 0; }
.core-feature-grid article + article { border-left: 1px solid var(--line); padding-left: 34px; }
.core-feature-grid article > span { color: #56565f; font: 900 9px ui-monospace, monospace; }
.feature-icon { position: relative; width: 50px; height: 62px; margin-top: 38px; border: 1px solid #46464d; border-radius: 13px; }
.feature-icon::before, .feature-icon::after { position: absolute; width: 9px; height: 9px; border-color: var(--accent); content: ""; }
.feature-icon::before { top: 7px; left: 7px; border-top: 2px solid var(--accent); border-left: 2px solid var(--accent); }
.feature-icon::after { right: 7px; bottom: 7px; border-right: 2px solid var(--accent); border-bottom: 2px solid var(--accent); }
.moment-icon i { position: absolute; top: 27px; left: 13px; width: 24px; height: 7px; background: repeating-linear-gradient(90deg, var(--accent) 0 3px, transparent 3px 6px); }
.frame-icon i { position: absolute; inset: 15px 12px; border: 1px solid #74747d; border-radius: 50% 50% 42% 42%; }
.watch-icon i { position: absolute; top: 22px; left: 18px; border-top: 9px solid transparent; border-bottom: 9px solid transparent; border-left: 14px solid var(--accent); }
.core-feature-grid h3 { margin: 28px 0 10px; font-size: 22px; letter-spacing: -.025em; }
.core-feature-grid p { max-width: 300px; margin: 0; color: #85858e; font-size: 13px; line-height: 1.72; }
.performance-strip { display: flex; align-items: center; justify-content: space-between; gap: 40px; margin-top: 34px; }
.performance-strip small { display: block; color: #6e6e77; font-size: 8px; font-weight: 900; letter-spacing: .17em; }
.performance-strip strong { display: block; margin-top: 6px; font-size: 15px; }
.performance-strip ul { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px 18px; margin: 0; padding: 0; color: #888891; font-size: 10px; list-style: none; }
.performance-strip li::before { margin-right: 7px; color: var(--accent); content: "+"; }

.multistream-section { border-block: 1px solid var(--line); background: #101012; }
.multistream-intro { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr); align-items: end; gap: 70px; }
.multistream-intro > p { color: #96969f; font-size: 15px; line-height: 1.75; }
.multistream-layout { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(340px, .82fr); gap: 18px; margin-top: 52px; }
.stream-timeline, .manager-preview { border: 1px solid #303036; border-radius: 17px; padding: 22px; background: #0c0c0e; }
.stream-inputs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.stream-inputs > span { display: grid; grid-template-columns: 29px 1fr; column-gap: 9px; align-items: center; border: 1px solid #29292e; border-radius: 9px; padding: 9px; background: #131316; }
.stream-inputs i, .manager-streams i { display: grid; width: 29px; height: 29px; grid-row: span 2; place-items: center; border-radius: 7px; background: #26262b; color: var(--accent); font-size: 9px; font-style: normal; font-weight: 900; }
.stream-inputs b { font-size: 9px; }
.stream-inputs small { color: #696972; font-size: 7px; }
.timeline-labels { display: grid; grid-template-columns: 36% 27% 37%; margin-top: 30px; color: #686871; font-size: 7px; font-weight: 800; text-align: center; }
.timeline-tracks { position: relative; display: grid; gap: 8px; margin-top: 9px; }
.timeline-tracks > span { position: relative; height: 28px; overflow: hidden; border-radius: 6px; background: #17171a; }
.timeline-tracks b { position: absolute; top: 0; bottom: 0; border-radius: 6px; }
.track-gameplay { right: 35%; left: 0; background: #36475f; }
.track-reaction-one { right: 0; left: 60%; background: #4e293b; }
.track-reaction-two { right: 0; left: 66%; background: #304b39; }
.timeline-tracks > i { position: absolute; z-index: 2; top: -8px; bottom: -8px; left: 62%; width: 1px; background: var(--accent); box-shadow: 0 0 12px rgb(201 255 56 / .6); }
.timeline-tracks > i::before { position: absolute; top: -3px; left: -4px; width: 9px; height: 9px; border-radius: 50%; background: var(--accent); content: ""; }
.final-clip-strip { display: grid; grid-template-columns: 90px 1.2fr .9fr 1.2fr; gap: 2px; align-items: center; margin-top: 24px; color: #a1a1aa; font-size: 7px; text-align: center; }
.final-clip-strip strong { color: #71717a; text-align: left; }
.final-clip-strip span { padding: 10px 5px; background: #222932; }
.final-clip-strip span:nth-of-type(2) { background: var(--accent); color: #09090b; font-weight: 900; }
.final-clip-strip span:nth-of-type(3) { background: #432536; }
.manager-top { display: flex; align-items: flex-start; justify-content: space-between; }
.manager-top small { color: #73737c; font-size: 7px; font-weight: 900; letter-spacing: .16em; }
.manager-top h3 { margin: 7px 0 0; font-size: 21px; }
.manager-top > span { border: 1px solid rgb(201 255 56 / .28); border-radius: 6px; padding: 6px 8px; color: var(--accent); font-size: 8px; font-weight: 900; }
.manager-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-top: 21px; }
.manager-metrics > span { border: 1px solid #29292e; border-radius: 8px; padding: 10px; }
.manager-metrics small { display: block; color: #62626b; font-size: 6px; }
.manager-metrics b { display: block; margin-top: 6px; color: var(--accent); font-size: 17px; }
.manager-streams { display: grid; gap: 7px; margin-top: 10px; }
.manager-streams > span { display: grid; grid-template-columns: 29px 1fr auto; column-gap: 9px; align-items: center; border: 1px solid #29292e; border-radius: 8px; padding: 8px; background: #111114; }
.manager-streams b { font-size: 9px; }
.manager-streams small { color: #65656e; font-size: 7px; }
.manager-streams em { grid-column: 3; grid-row: 1 / span 2; color: var(--accent); font-size: 7px; font-style: normal; font-weight: 900; }

.quality-section { display: grid; grid-template-columns: .82fr 1.18fr; align-items: center; gap: 78px; }
.quality-copy h2 { max-width: 520px; }
.check-list { display: grid; gap: 12px; margin: 30px 0 0; padding: 0; color: #8c8c95; font-size: 12px; list-style: none; }
.check-list li::before { display: inline-grid; width: 18px; height: 18px; place-items: center; margin-right: 10px; border-radius: 50%; background: rgb(201 255 56 / .1); color: var(--accent); content: "+"; font-weight: 900; }
.quality-panels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.quality-panels article { border: 1px solid #34343a; border-radius: 14px; padding: 17px; background: #111113; }
.quality-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.quality-title small { display: block; color: #62626b; font-size: 7px; font-weight: 900; letter-spacing: .14em; }
.quality-title b { display: block; margin-top: 4px; font-size: 11px; }
.quality-title em { border-radius: 999px; padding: 5px 7px; background: rgb(201 255 56 / .09); color: var(--accent); font-size: 7px; font-style: normal; }
.quality-select { display: flex; align-items: center; justify-content: space-between; margin-top: 15px; border: 1px solid rgb(201 255 56 / .34); border-radius: 8px; padding: 11px; background: rgb(201 255 56 / .04); }
.quality-select strong { font-size: 10px; }
.quality-select i { color: var(--accent); font-size: 7px; font-style: normal; }
.quality-panels ul { display: grid; gap: 2px; margin: 8px 0 0; padding: 0; list-style: none; }
.quality-panels li { display: flex; justify-content: space-between; border-radius: 6px; padding: 8px 9px; color: #aaaab2; font-size: 9px; }
.quality-panels li span { color: #62626b; font-size: 7px; }
.quality-panels li.selected { background: #222226; color: #f5f5f4; }
.quality-panels li.disabled { color: #484850; text-decoration: line-through; }
.limited-quality { transform: translateY(20px); opacity: .8; }

.privacy-section { border-block: 1px solid var(--line); background: #101012; }
.privacy-layout { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: 90px; }
.privacy-copy > p:not(.eyebrow) { max-width: 570px; color: #96969f; font-size: 15px; line-height: 1.78; }
.privacy-points { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 28px; }
.privacy-points span { border: 1px solid #333339; border-radius: 999px; padding: 8px 11px; color: #a4a4ad; font-size: 9px; font-weight: 800; }
.local-map { border: 1px solid #34343a; border-radius: 17px; padding: 18px; background: #0b0b0d; }
.pc-frame { display: grid; grid-template-columns: 1fr 28px 1fr 28px 1fr; align-items: center; border: 1px solid #29292e; border-radius: 12px; padding: 43px 15px 18px; background: #121215; }
.pc-title { position: absolute; margin-top: -76px; color: #6d6d76; font-size: 7px; font-weight: 900; letter-spacing: .15em; }
.pc-title i { display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: var(--accent); }
.local-stage { border: 1px solid #313137; border-radius: 9px; padding: 14px 10px; background: #0d0d0f; text-align: center; }
.local-stage span { display: block; color: #5f5f68; font: 900 7px ui-monospace, monospace; }
.local-stage b { display: block; margin-top: 6px; font-size: 9px; }
.local-stage.accent { border-color: rgb(201 255 56 / .32); background: rgb(201 255 56 / .05); }
.local-stage.accent b { color: var(--accent); }
.local-arrow { height: 1px; background: #44444b; }
.local-map > p { margin: 12px 3px 0; color: #6c6c75; font-size: 8px; text-align: center; }
.local-map > p i { display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: var(--accent); }

.pricing { background: #0c0c0e; }
.pricing-heading { align-items: end; }
.free-tier-band { margin-top: 44px; border: 1px solid rgb(201 255 56 / .3); border-radius: 17px; padding: 26px 30px; background: linear-gradient(180deg, rgb(201 255 56 / .05), #121214 60%); }
.free-tier-band small { color: var(--accent); font-size: 8px; font-weight: 900; letter-spacing: .18em; }
.free-tier-band h3 { margin: 14px 0 8px; font-size: 24px; letter-spacing: -.035em; }
.free-tier-band p { max-width: 640px; margin: 0; color: #898992; font-size: 12px; line-height: 1.7; }
.free-tier-line { margin: 18px 0 0; color: #c9c9d1; font-size: 12px; line-height: 1.7; }
.free-tier-line b { color: var(--accent); }
.pricing-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; margin-top: 20px; }
.pricing-grid article { position: relative; display: flex; min-height: 505px; flex-direction: column; align-items: flex-start; border: 1px solid #34343a; border-radius: 17px; padding: 30px; background: #121214; }
.pricing-grid article.featured-plan { border-color: rgb(201 255 56 / .38); background: linear-gradient(180deg, rgb(201 255 56 / .045), #121214 28%); }
.pricing-grid article > small { color: var(--accent); font-size: 8px; font-weight: 900; letter-spacing: .18em; }
.pricing-grid h3 { margin: 22px 0 8px; font-size: 28px; letter-spacing: -.035em; }
.pricing-grid article > p:not(.credit-context) { max-width: 450px; margin: 0; color: #898992; font-size: 12px; line-height: 1.7; }
.pricing-grid article > strong { margin: 28px 0 0; font-size: 23px; letter-spacing: -.03em; }
.pricing-grid strong em { color: #777780; font-size: 11px; font-style: normal; font-weight: 700; letter-spacing: 0; }
.credit-context { margin: 7px 0 0; color: #6b6b74; font-size: 9px; }
.pricing-grid ul { display: grid; gap: 10px; margin: 26px 0 30px; padding: 0; color: #aaaab3; font-size: 11px; list-style: none; }
.pricing-grid li::before { margin-right: 9px; color: var(--accent); content: "+"; font-weight: 900; }
.pricing-grid .button { width: 100%; margin-top: auto; }
.price-mismatch { color: #fbbf24 !important; }
.service-status { margin: 16px 1px 0; color: #71717a; font-size: 10px; }
.service-status + .service-status { margin-top: 7px; }
.service-status a, .legal-page a, footer a:hover { color: var(--accent); }

.faq { border-block: 1px solid var(--line); background: #111113; }
.faq-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin-top: 42px; border: 1px solid #2c2c31; border-radius: 15px; overflow: hidden; background: #2c2c31; }
.faq details { min-width: 0; padding: 22px; background: #0d0d0f; }
.faq details[open] { background: #141417; }
.faq summary { cursor: pointer; font-size: 13px; font-weight: 800; list-style-position: outside; }
.faq summary::marker { color: var(--accent); }
.faq details p { margin: 15px 0 0; color: #94949d; font-size: 12px; line-height: 1.75; }

.final-cta { display: flex; align-items: center; justify-content: space-between; gap: 70px; margin-block: 92px; border: 1px solid rgb(201 255 56 / .3); border-radius: 20px; padding: 54px; background: linear-gradient(110deg, rgb(201 255 56 / .085), #111113 45%); }
.final-cta h2 { max-width: 730px; margin-bottom: 10px; }
.final-cta p:not(.eyebrow) { margin: 0; color: #92929b; font-size: 14px; }
.final-actions { display: flex; min-width: 280px; flex-direction: column; gap: 11px; text-align: center; }
.final-actions small { color: #73737c; font-size: 9px; }
.installation-details { color: #73737c; font-size: 9px; text-align: left; }
.installation-details summary { cursor: pointer; text-align: center; }
.installation-details p { margin: 8px 0 0; font-size: 9px; line-height: 1.6; }
footer { border-top: 1px solid var(--line); padding-block: 28px; color: #71717a; font-size: 10px; }
footer > div { display: flex; justify-content: space-between; gap: 20px; }

@keyframes spin { to { transform: rotate(360deg); } }

/* LEGAL */
.legal-page { padding-bottom: 100px; }
.legal-hero { padding-block: 90px 54px; }
.legal-hero h1 { max-width: 900px; }
.legal-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 32px; }
.legal-summary span { border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; color: #a1a1aa; font-size: 12px; }
.legal-summary b { display: block; margin-bottom: 5px; color: #f4f4f5; }
.legal-grid { display: grid; grid-template-columns: 230px minmax(0, 1fr); align-items: start; gap: 24px; }
.legal-toc { position: sticky; top: 92px; display: flex; flex-direction: column; gap: 11px; border: 1px solid var(--line); border-radius: 15px; padding: 20px; background: var(--surface); font-size: 12px; }
.legal-toc strong { margin-bottom: 4px; color: #f4f4f5; }
.legal-toc a { color: #a1a1aa; }
.legal-content { display: grid; gap: 16px; }
.legal-card { scroll-margin-top: 92px; border: 1px solid var(--line); border-radius: 17px; padding: 28px; background: var(--surface); }
.legal-card h2 { margin: 9px 0 18px; font-size: clamp(24px, 3vw, 34px); }
.legal-card h3 { margin: 25px 0 9px; font-size: 16px; }
.legal-card p, .legal-card li { color: #a1a1aa; font-size: 13px; line-height: 1.8; }
.legal-card ul { padding-left: 20px; }
.legal-card code { color: var(--accent); }

/* RESPONSIVE */
@media (max-width: 1080px) {
  .site-header nav { gap: 16px; }
  .hero { min-height: auto; grid-template-columns: 1fr; gap: 48px; padding-top: 74px; }
  .hero-copy { max-width: 800px; }
  .hero-product { width: min(820px, 100%); transform: none; }
  .transformation-flow { grid-template-columns: 200px 76px minmax(0, 1fr); }
  .quality-section { gap: 44px; }
  .privacy-layout { gap: 50px; }
}

@media (max-width: 900px) {
  .section-block { padding-block: 84px; }
  .site-header nav { display: none; }
  .split-heading, .multistream-intro, .quality-section, .privacy-layout, .legal-grid { grid-template-columns: 1fr; gap: 26px; }
  .transformation-flow { grid-template-columns: 1fr; }
  .source-card { display: grid; grid-template-columns: 190px 1fr; column-gap: 18px; align-items: center; }
  .source-thumbnail { height: 150px; grid-row: 1 / span 4; }
  .processor { display: grid; grid-template-columns: 1fr auto auto auto 1fr; gap: 10px; }
  .processor::before, .processor::after { width: auto; }
  .processor > i { margin: 8px 0; }
  .processor span { margin: 0; }
  .workflow-row { grid-template-columns: repeat(5, minmax(125px, 1fr)); overflow-x: auto; padding-bottom: 10px; }
  .workflow-row::before { right: 70px; left: 20px; }
  .core-feature-grid article { padding-right: 24px; }
  .core-feature-grid article + article { padding-left: 24px; }
  .performance-strip { align-items: flex-start; flex-direction: column; }
  .performance-strip ul { justify-content: flex-start; }
  .multistream-layout { grid-template-columns: 1fr; }
  .manager-preview { width: min(620px, 100%); }
  .quality-panels { width: min(680px, 100%); }
  .limited-quality { transform: none; }
  .local-map { width: min(680px, 100%); }
  .legal-toc { position: static; }
}

@media (max-width: 680px) {
  .section-shell { width: min(100% - 32px, 1220px); }
  .section-block { padding-block: 70px; }
  .site-header { min-height: 64px; gap: 10px; padding-inline: 16px; }
  .brand img { width: 154px; }
  .header-download { min-height: 38px; padding-inline: 12px; font-size: 10px; }
  h1 { font-size: clamp(42px, 12vw, 58px); }
  h2 { font-size: clamp(31px, 9vw, 43px); }
  .hero { gap: 35px; padding-block: 58px 68px; }
  .hero .lead { font-size: 15px; }
  .hero .actions { display: grid; grid-template-columns: 1fr; }
  .hero .button { width: 100%; }
  .trust-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 11px; }
  .mobile-download-note { display: block; margin-top: 13px; }
  .window-body { grid-template-columns: 1fr; min-height: 0; }
  .preview-sidebar { display: none; }
  .dashboard-preview { padding: 18px; }
  .preview-heading h2 { font-size: 21px; }
  .source-field { gap: 8px; }
  .source-field b { display: none; }
  .preview-settings { grid-template-columns: 1fr 1fr; }
  .preview-settings > span:last-child { display: none; }
  .analysis-row > b { display: none; }
  .mini-results { gap: 6px; }
  .transformation { padding-top: 78px; }
  .source-card { display: block; }
  .source-thumbnail { height: 190px; }
  .processor { grid-template-columns: 1fr auto auto 1fr; }
  .processor > span { display: none; }
  .clip-results { padding: 12px; }
  .results-label > span { display: none; }
  .clip-grid { gap: 7px; }
  .clip-preview::after { width: 39px; height: 54px; box-shadow: 0 43px 0 17px rgb(22 28 34 / .82); }
  .hard-subtitle { right: 4px; bottom: 28px; left: 4px; font-size: 7px; }
  .clip-grid h4 { font-size: 9px; }
  .clip-grid p { display: none; }
  .workflow-row { grid-template-columns: 1fr; overflow: visible; gap: 24px; }
  .workflow-row::before { top: 20px; right: auto; bottom: 30px; left: 19px; width: 1px; height: auto; }
  .workflow-row li { display: grid; grid-template-columns: 40px 1fr; column-gap: 15px; padding: 0; }
  .workflow-row span { grid-row: 1 / span 2; }
  .workflow-row h3 { margin: 3px 0 4px; }
  .workflow-row p { max-width: none; }
  .core-feature-grid { grid-template-columns: 1fr; }
  .core-feature-grid article { min-height: 0; padding: 30px 0; }
  .core-feature-grid article + article { border-top: 1px solid var(--line); border-left: 0; padding-left: 0; }
  .feature-icon { margin-top: 24px; }
  .performance-strip { margin-top: 25px; }
  .stream-timeline, .manager-preview { padding: 15px; }
  .stream-inputs { grid-template-columns: 1fr; }
  .timeline-labels { display: none; }
  .timeline-tracks { margin-top: 23px; }
  .final-clip-strip { grid-template-columns: 1fr 1fr 1fr; }
  .final-clip-strip strong { grid-column: 1 / -1; margin-bottom: 6px; }
  .manager-metrics { gap: 5px; }
  .manager-metrics > span { padding: 8px; }
  .quality-panels { grid-template-columns: 1fr; }
  .quality-panels .limited-quality { display: none; }
  .pc-frame { grid-template-columns: 1fr; gap: 8px; padding-top: 48px; }
  .local-arrow { width: 1px; height: 15px; margin-inline: auto; }
  .pricing-grid, .faq-grid, .legal-summary { grid-template-columns: 1fr; }
  .pricing-grid article { min-height: 0; padding: 24px; }
  .pricing-grid .button { margin-top: 8px; }
  .final-cta { align-items: flex-start; flex-direction: column; gap: 30px; margin-block: 55px; padding: 32px 24px; }
  .final-actions { width: 100%; min-width: 0; }
  footer > div { align-items: flex-start; flex-direction: column; }
  .legal-hero { padding-block: 60px 38px; }
  .legal-card { padding: 22px; }
}

@media (max-width: 410px) {
  .brand img { width: 142px; }
  .header-download { max-width: 132px; padding-inline: 9px; font-size: 9px; }
  .window-bar b { max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .preview-settings b { font-size: 8px; }
  .mini-results b { font-size: 7px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}