@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700;800&family=Space+Grotesk:wght@500;600;700&display=swap');

:root { font-family: 'Noto Sans SC', sans-serif; color: #fff; background: #0b1020; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; position: relative; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
.site-header { width: min(1280px, calc(100% - 64px)); height: 88px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }
.brand { font-size: 20px; font-weight: 800; letter-spacing: -.04em; }.brand b { color: #a55cff; }.site-header nav { display: flex; gap: 36px; font-size: 14px; color: #c4c8d2; }.header-cta { border: 1px solid #9354ff; padding: 10px 20px; border-radius: 8px; font-size: 14px; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 58px; padding: 0 28px; border-radius: 9px; font-weight: 700; font-size: 17px; }.violet-button { background: #7d3df2; }.black-button { background: #101114; color: #fff; border-radius: 2px; }.white-button { background: #fff; color: #111217; }
.product-shot { display: block; width: 100%; height: auto; }.text-link { display: inline-block; font-size: 15px; margin: 22px 0 0 24px; }.light-link { color: #d9d5e7; }.eyebrow { letter-spacing: .12em; text-transform: uppercase; font-size: 13px; color: inherit; }
footer { padding: 28px 32px; text-align: center; font-size: 13px; color: #8991a5; background: #070b14; }
.motion-lines { position: fixed; inset: 0; z-index: -1; pointer-events: none; background-position: center; background-size: cover; animation: drift 22s ease-in-out infinite alternate; }.night-lines { background-image: url('assets/night-lines.png'); opacity: .48; }.editorial-lines { background-image: url('assets/editorial-lines.png'); opacity: .7; }.stage-lines { background-image: url('assets/stage-lines.png'); opacity: .5; }.editorial-page, .night-page, .stage-page { isolation: isolate; }.editorial-page > *:not(.motion-lines), .night-page > *:not(.motion-lines), .stage-page > *:not(.motion-lines) { position: relative; z-index: 1; } @keyframes drift { from { transform: scale(1.03) translate3d(-1.2%, -.7%, 0); } to { transform: scale(1.1) translate3d(1.2%, .7%, 0); } } @media (prefers-reduced-motion: reduce) { .motion-lines { animation: none; } }

.gallery-page { min-height: 100vh; background: #0e111a; }.gallery { width: min(1120px, calc(100% - 48px)); margin: 0 auto; padding: 13vh 0; }.gallery h1 { font-family: 'Space Grotesk', 'Noto Sans SC', sans-serif; font-size: clamp(48px, 7vw, 96px); line-height: 1.02; letter-spacing: -.07em; margin: 12px 0 20px; }.gallery-copy { max-width: 460px; line-height: 1.8; color: #aeb6c8; }.concept-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 64px; }.concept-card { min-height: 250px; padding: 28px; display: flex; flex-direction: column; justify-content: flex-end; border: 1px solid #31394a; transition: transform .2s, border-color .2s; }.concept-card:hover { transform: translateY(-5px); border-color: #a869ff; }.concept-card span { margin-bottom: auto; font-family: 'Space Grotesk', sans-serif; color: #8d95a8; }.concept-card strong { font-size: 26px; }.concept-card em { font-style: normal; font-size: 14px; margin-top: 8px; opacity: .7; }.night-card { background: #0b1429; }.editorial-card { color: #161719; background: #f4f1ea; border-color: #f4f1ea; }.stage-card { background: #111117; }

.night-page { background: #000c23; color: #f4f4fa; }.night-hero { width: min(1280px, calc(100% - 64px)); min-height: 640px; margin: 0 auto; display: grid; grid-template-columns: .85fr 1.25fr; align-items: center; gap: 46px; }.product-kicker { color: #d6c7ff; font-size: 20px; margin-bottom: 22px; }.night-copy h1 { font-size: clamp(48px, 5.4vw, 78px); line-height: 1.13; letter-spacing: -.07em; margin: 0; }.hero-lede { font-size: 19px; color: #d1d7e5; margin: 28px 0 38px; }.night-shot {border-radius: 14px; }.trust-row { width: min(1120px, calc(100% - 64px)); margin: 0 auto; padding: 36px 0; display: grid; grid-template-columns: repeat(3, 1fr); text-align: center; border-top: 1px solid #253148; border-bottom: 1px solid #253148; color: #d6dbe6; }.trust-row span + span { border-left: 1px solid #253148; }.dark-features { width: min(1120px, calc(100% - 64px)); margin: 0 auto; padding: 96px 0; display: grid; grid-template-columns: repeat(3, 1fr); }.dark-features article { padding: 0 38px; border-left: 1px solid #29334a; }.dark-features article:first-child { padding-left: 0; border: 0; }.dark-features p { color: #a56aff; font-family: 'Space Grotesk', sans-serif; }.dark-features h2 { font-size: 23px; }.dark-features span { color: #aeb7c7; line-height: 1.9; font-size: 15px; }.download-band { text-align: center; padding: 80px 20px; }.dark-download { background: #0d1830; }.download-band p { font-size: 22px; margin: 0 0 22px; }
.long-section { width: min(1120px, calc(100% - 64px)); margin: 0 auto; padding: 120px 0; }.section-intro h2 { font-size: clamp(34px, 4vw, 57px); line-height: 1.18; letter-spacing: -.06em; margin: 14px 0 0; }.dark-workflow { display: grid; grid-template-columns: .8fr 1.2fr; gap: 84px; border-top: 1px solid #29334a; }.workflow-list { margin: 0; padding: 0; list-style: none; }.workflow-list li { display: grid; grid-template-columns: 78px 1fr; padding: 28px 0; border-top: 1px solid #29334a; }.workflow-list li:last-child { border-bottom: 1px solid #29334a; }.workflow-list b, .scenario-grid span { color: #a56aff; font-family: 'Space Grotesk', sans-serif; }.workflow-list h3 { margin: 0; font-size: 20px; }.workflow-list p, .scenario-grid p { color: #aeb7c7; line-height: 1.8; margin: 10px 0 0; font-size: 15px; }.dark-scenarios { border-top: 1px solid #29334a; }.scenario-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 70px; }.scenario-grid article { padding: 0 34px; border-left: 1px solid #29334a; }.scenario-grid article:first-child { padding-left: 0; border-left: 0; }.scenario-grid h3 { font-size: 24px; margin: 16px 0 0; }.dark-faq { display: grid; grid-template-columns: .8fr 1.2fr; gap: 84px; border-top: 1px solid #29334a; }.dark-faq > p { color: #a56aff; }.dark-faq details, .editorial-faq details, .stage-faq details { padding: 23px 0; border-top: 1px solid currentColor; }.dark-faq summary, .editorial-faq summary, .stage-faq summary { cursor: pointer; font-size: 18px; font-weight: 600; }.dark-faq details p, .editorial-faq details p, .stage-faq details p { color: #aeb7c7; line-height: 1.8; margin: 14px 0 0; font-size: 15px; }

.editorial-page { color: #111216; background: #f6f5f1; }.editorial-header { border-bottom: 1px solid #deddd7; }.editorial-header nav { color: #54555b; }.editorial-brand { color: #111216; }.editorial-hero { width: min(1280px, calc(100% - 64px)); min-height: 620px; margin: 0 auto; display: grid; grid-template-columns: 1fr .8fr; align-items: center; gap: 48px; }.editorial-hero h1 { font-size: clamp(56px, 7vw, 96px); line-height: 1.03; letter-spacing: -.09em; margin: 0 0 24px; }.editorial-hero p { font-size: 20px; color: #66656a; }.editorial-hero small { display: block; color: #75767b; margin-top: 20px; }.key-readout { min-height: 360px; display: flex; flex-direction: column; justify-content: center; align-items: center; border-left: 1px solid #d9d7d1; }.key-readout span, .key-readout i { font-style: normal; color: #6c6d72; font-size: 14px; }.key-readout b { font-family: 'Space Grotesk', sans-serif; font-size: 128px; letter-spacing: -.12em; color: #2367ed; line-height: 1; margin: 18px 0; }.key-readout sup { font-size: .42em; }.editorial-proof { border-top: 1px solid #deddd7; border-bottom: 1px solid #deddd7; width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); }.editorial-proof article { width: min(100%, 430px); margin: 0 auto; padding: 44px 34px; border-left: 1px solid #deddd7; }.editorial-proof article:first-child { border-left: 0; }.editorial-proof b { font-family: 'Space Grotesk', sans-serif; font-size: 19px; }.editorial-proof h2 { margin: 12px 0 4px; font-size: 29px; letter-spacing: -.05em; }.editorial-proof p { margin: 0; color: #77767a; font-size: 14px; }.editorial-feature { width: min(1280px, calc(100% - 64px)); margin: 0 auto; padding: 110px 0; display: grid; grid-template-columns: .7fr 1.3fr; gap: 62px; align-items: center; }.editorial-feature h2 { font-size: 47px; letter-spacing: -.07em; line-height: 1.13; margin: 12px 0; }.editorial-feature > div > p:last-child { color: #616268; line-height: 1.8; }.editorial-shot {border-radius: 7px; }.editorial-guide { padding: 88px 20px; text-align: center; border-top: 1px solid #deddd7; }.editorial-guide p { font-size: 20px; }.editorial-footer { background: #edebe4; color: #636466; }
.editorial-explain { width: min(1280px, calc(100% - 64px)); margin: 0 auto; padding: 120px 0; border-top: 1px solid #deddd7; display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; }.editorial-explain h2, .editorial-scenes h2 { font-size: clamp(36px, 4vw, 57px); line-height: 1.12; letter-spacing: -.07em; margin: 14px 0 0; }.editorial-steps article { padding: 26px 0; border-top: 1px solid #deddd7; }.editorial-steps article:last-child { border-bottom: 1px solid #deddd7; }.editorial-steps b { color: #276cf0; font-family: 'Space Grotesk', sans-serif; }.editorial-steps h3 { display: inline-block; margin: 0 0 0 22px; font-size: 21px; }.editorial-steps p { margin: 12px 0 0; color: #68686d; }.editorial-quote { padding: 150px 30px; text-align: center; background: #141519; color: #f5f4f0; }.editorial-quote p { font-size: clamp(34px, 4vw, 58px); line-height: 1.25; letter-spacing: -.07em; margin: 0; }.editorial-quote span { display: block; margin-top: 26px; color: #aeafb3; font-size: 14px; }.editorial-scenes { width: min(1280px, calc(100% - 64px)); margin: 0 auto; padding: 120px 0; display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; }.editorial-scenes > div:last-child article { padding: 26px 0; border-top: 1px solid #deddd7; }.editorial-scenes > div:last-child article:last-child { border-bottom: 1px solid #deddd7; }.editorial-scenes h3 { margin: 0; font-size: 22px; }.editorial-scenes article p { color: #68686d; margin: 10px 0 0; line-height: 1.8; }.editorial-faq { width: min(1280px, calc(100% - 64px)); margin: 0 auto; padding: 100px 0; border-top: 1px solid #deddd7; display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; }.editorial-faq details p { color: #68686d; }

.stage-page { background: #00082d; color: #fff; }.stage-hero { width: min(1280px, calc(100% - 64px)); margin: 0 auto; padding: 84px 0 46px; text-align: center; }.stage-title { font-size: clamp(44px, 6vw, 80px); font-weight: 800; letter-spacing: -.06em; margin: 0; }.stage-hero h1 { font-size: 28px; font-weight: 500; color: #c6c4ce; margin: 18px 0 30px; }.stage-hero small { display: block; color: #b6b6c1; margin: 14px 0 40px; }.stage-shot {border-radius: 8px; }.stage-points { width: min(940px, calc(100% - 64px)); margin: 70px auto; display: grid; grid-template-columns: repeat(3, 1fr); text-align: center; }.stage-points article + article { border-left: 1px solid #3a3a43; }.stage-points strong { display: block; font-size: 22px; }.stage-points span { display: block; margin-top: 10px; color: #aaa9b1; font-size: 14px; }.stage-details { width: min(920px, calc(100% - 64px)); padding: 100px 0; margin: 0 auto; text-align: center; border-top: 1px solid #292a31; }.stage-details p { color: #e14db4; font-size: 14px; }.stage-details h2 { font-size: clamp(38px, 5vw, 65px); line-height: 1.1; letter-spacing: -.07em; margin: 16px 0; }.stage-download { background: #14141b; }
.stage-flow { width: min(920px, calc(100% - 64px)); margin: 0 auto; padding: 120px 0; text-align: center; border-top: 1px solid #292a31; }.stage-flow h2 { font-size: clamp(43px, 5vw, 68px); line-height: 1.08; letter-spacing: -.07em; margin: 14px 0 70px; }.stage-flow > p { color: #e14db4; }.stage-flow > div { display: grid; grid-template-columns: repeat(4, 1fr); text-align: left; }.stage-flow article { padding: 0 20px; border-left: 1px solid #3a3a43; }.stage-flow article:first-child { padding-left: 0; border-left: 0; }.stage-flow b { display: block; color: #f05bc4; font-family: 'Space Grotesk', sans-serif; }.stage-flow span { display: block; color: #b1b0b8; margin-top: 9px; font-size: 14px; }.stage-capabilities { width: min(1120px, calc(100% - 64px)); margin: 0 auto; padding: 120px 0; display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; border-top: 1px solid #292a31; }.capability-list article { position: relative; padding: 24px 0 24px 70px; border-top: 1px solid #292a31; }.capability-list article:last-child { border-bottom: 1px solid #292a31; }.capability-list b { position: absolute; left: 0; color: #e14db4; font-family: 'Space Grotesk', sans-serif; }.capability-list h3 { margin: 0; font-size: 21px; }.capability-list p { color: #b1b0b8; margin: 8px 0 0; line-height: 1.8; }.stage-faq { width: min(1120px, calc(100% - 64px)); margin: 0 auto; padding: 100px 0; display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; border-top: 1px solid #292a31; }.stage-faq > p { color: #e14db4; }.stage-faq details p { color: #b1b0b8; }

@media (max-width: 760px) { .site-header { width: calc(100% - 36px); height: 72px; }.site-header nav { display: none; }.header-cta { padding: 8px 13px; }.concept-grid, .night-hero, .editorial-hero, .editorial-feature { grid-template-columns: 1fr; }.gallery { padding: 10vh 0; }.concept-grid { margin-top: 40px; }.concept-card { min-height: 170px; }.night-hero, .editorial-hero { width: calc(100% - 36px); min-height: unset; padding: 70px 0; gap: 46px; }.night-copy h1 { font-size: 48px; }.trust-row { width: calc(100% - 36px); padding: 26px 0; font-size: 12px; }.dark-features, .editorial-proof, .stage-points { grid-template-columns: 1fr; }.dark-features { width: calc(100% - 36px); padding: 50px 0; }.dark-features article, .dark-features article:first-child { padding: 30px 0; border: 0; border-top: 1px solid #29334a; }.editorial-hero h1 { font-size: 56px; }.key-readout { min-height: 220px; border-left: 0; border-top: 1px solid #deddd7; }.key-readout b { font-size: 92px; }.editorial-proof article, .editorial-proof article:first-child { width: calc(100% - 36px); padding: 32px 0; border: 0; border-top: 1px solid #deddd7; }.editorial-proof article:first-child { border-top: 0; }.editorial-feature { width: calc(100% - 36px); padding: 72px 0; }.stage-hero { width: calc(100% - 36px); padding-top: 64px; }.stage-title { font-size: 48px; }.stage-points { width: calc(100% - 36px); gap: 24px; }.stage-points article + article { border-left: 0; border-top: 1px solid #3a3a43; padding-top: 24px; }.stage-details { width: calc(100% - 36px); padding: 72px 0; } }
@media (max-width: 760px) { .long-section, .editorial-explain, .editorial-scenes, .editorial-faq, .stage-flow, .stage-capabilities, .stage-faq { width: calc(100% - 36px); padding: 76px 0; grid-template-columns: 1fr; gap: 42px; }.scenario-grid, .stage-flow > div { grid-template-columns: 1fr; gap: 0; }.scenario-grid { margin-top: 40px; }.scenario-grid article, .scenario-grid article:first-child { padding: 26px 0; border-left: 0; border-top: 1px solid #29334a; }.dark-workflow, .dark-faq { gap: 42px; }.stage-flow article, .stage-flow article:first-child { padding: 20px 0; border-left: 0; border-top: 1px solid #3a3a43; }.stage-flow article:last-child { border-bottom: 1px solid #3a3a43; }.editorial-explain, .editorial-scenes, .editorial-faq { gap: 40px; }.editorial-quote { padding: 100px 22px; }.editorial-quote p { font-size: 34px; }.stage-capabilities, .stage-faq { gap: 44px; } }