/* Website chrome and editorial sections. Software demos retain their real UI. */
:root {
  color-scheme: dark;
  --bg: #0b0d12;
  --surface: #12151d;
  --surface2: #181c26;
  --panel: #10131a;
  --text: #f2f1f7;
  --dim: #a7a6b5;
  --border: #ffffff14;
  --accent: #b3a0ff;
  --brand: #b3a0ff;
  --studio-paper: #0b0d12;
  --studio-ink: #f2f1f7;
  --studio-dim: #a7a6b5;
  --studio-line: #ffffff14;
  --studio-violet: #b3a0ff;
}
html, body { background: #0b0d12; color: #f2f1f7; }
::selection { background: #b3a0ff40; color: #fff; }
.site-header { background: #0b0d12e8; border-color: #ffffff0d; }
.site-header.is-scrolled { background: #0b0d12ee; border-color: #ffffff14; box-shadow: 0 8px 32px #0002; }
.brand { color: #f2f1f7; }
.brand > img { border: 1px solid #ffffff1c; border-radius: 7px; }
.desktop-nav a, .desktop-nav button, .text-button { color: #b8b6c2; }
.desktop-nav a:hover, .desktop-nav button:hover, .desktop-nav a.active, .text-button:hover { color: #d2c3ff; }
.header-actions .button-dark, .button-dark { color: #11101a; background: #c0b0ff; border-color: #c0b0ff; }
.button-dark:hover { background: #d3c7ff; border-color: #d3c7ff; box-shadow: 0 0 32px #a990ff1a; }
.button-outline { color: #e3dfee; background: #14131ccc; border-color: #ffffff29; }
.button-outline:hover { background: #211c30; border-color: #b3a0ff66; }
.inline-link { color: #bcaafa; border-color: #b3a0ff4d; }
.section-kicker { color: #a395bf; }
.serif-word { color: #c0acf9; }
.skip-content { background: #c0b0ff; color: #11101a; }
.page-progress { background: linear-gradient(90deg, #8174bd, #c0b0ff); }

/* The building is luminous particles in a large, uninterrupted dark field. */
.hero-particle-stage {
  background: radial-gradient(ellipse at 64% 38%, #28213c50, transparent 62%), #0b0d12;
}
.hero-particle-stage .hero-copy:before {
  background: radial-gradient(ellipse at 27% 65%, #0b0d12fa 4%, #0b0d12bd 48%, #0b0d1200 74%);
}
.hero-particle-stage .hero-copy .eyebrow { color: #b7a7d4; }
.hero-particle-stage .hero-copy .hero-new { color: #b5a2d4; background: #b3a0ff08; border-color: #b3a0ff30; }
.hero-particle-stage .hero-copy h1 { color: #f2f1f7; }
.hero-particle-stage .hero-copy .serif-word { color: #c0acf9; }
.hero-particle-stage .hero-description { color: #b4b0be; }
.hero-particle-stage .hero-copy .hero-meta { color: #888292; }
.hero-meta > span { color: #a08cbf; }
.hero-meta > i { background: #8872ac66; }
.hero-particle-stage .hero-actions .button-outline { background: #15131cdb; border-color: #ffffff26; color: #ddd6ec; }
.hero-particle-stage .hero-actions .button-outline:hover { background: #252032; border-color: #b3a0ff77; }
.hero-status { box-shadow: 0 0 12px #b3a0ff55, 0 0 0 4px #b3a0ff0c; }
.journey-strip { border-color: #ffffff14; color: #8b8497; }
.journey-strip > div { color: #c1bacd; }
.journey-caption, .journey-end { color: #777080; }

.story-section-heading > p, .section-heading-row > p { color: #a39dab; }
.story-section-heading h2, .section-heading-row h2, .team-section h2, .home-faq h2 { color: #eeebf5; }
.story-section-heading h2 em { color: #b5a2cf; }
.story-player { background: #10131a; border-color: #ffffff14; box-shadow: 0 25px 70px -35px #0007; }
.case-film-mark { color: #c3b6d3; }
.case-film-mark small { color: #8a7f97; border-left-color: #ffffff1c; }
.case-film-mark #story-play-state, .case-film-chapter { color: #8e849a; }
.case-film-copy h3 { color: #e5dfed; }
.case-film-copy p { color: #a49aaa; }
.case-film-callout, .case-film-copy .case-film-proof { border-color: #ffffff12; }
.case-film-callout > span { color: #82788e; }
.case-film-callout b { color: #c1b4ce; }
.case-film-action { border-color: #b3a0ff22; background: #b3a0ff0a; color: #baa7d9; }
.story-action-dot { background: #c2a9f8; }
.case-film-proof > span { color: #baa7cf; }
.case-film-proof figcaption, .case-film-proof i { color: #9f91ad; }
.case-film-timeline button { color: #81768e; }
.case-film-timeline button > i { background: #ffffff14; }
.case-film-timeline button[aria-pressed="true"] { color: #d9c8ef; }
.case-film-timeline button[aria-pressed="true"] > i { background: #b3a0ff; }
.case-film-bottom { color: #8b8097; }
.case-film-bottom > a { color: #c5b2dc; }
.case-film-bottom > a span { color: #93849f; }
.story-renderer { border-color: #ffffff20; box-shadow: 0 10px 40px #0004; }
.story-renderer-poster { background: #161922; color: #b4a8c3; }
.story-renderer-poster > small { color: #897f98; }
.story-demo-badge { color: #ada4b8; border-color: #ffffff14; background: #14131de8; }
.story-fallback { background: #12151d; }
.story-fallback > p { color: #a7a0af; }

.studio-bento article, .studio-bento article:last-child { border-color: #ffffff14; background: transparent; }
.studio-bento article h3 { color: #ece7f3; }
.studio-bento article p { color: #a59cab; }
.studio-bento .bento-label { color: #a290ba; }
.bento-note { color: #ded5eb; background: #17151ff2; border-color: #ffffff1e; box-shadow: 0 18px 40px #0004; }
.bento-note small { color: #92879e; }
.bento-image { background: #15141d; border-color: #ffffff1c; }
.bento-image span { color: #b5a7c3; }
.asset-stack img { border-color: #24202e; box-shadow: 0 20px 40px #0004; }
.bento-revisions > span, .bento-revisions figcaption { color: #a797bc; }
.bento-revisions figcaption i { background: #b5a0d2; }
.team-section { border-color: #ffffff14; }
.team-benefits article + article { border-color: #ffffff14; }
.team-benefits span { color: #cdc1dc; }
.team-benefits p { color: #9f92aa; }
.team-section > .inline-link { color: #bba1d6; border-color: #a28abf55; }
.home-faq > div > p, .home-faq details > p { color: #a69aaf; }
.home-faq details, .home-faq details:last-child { border-color: #ffffff14; }
.home-faq summary { color: #d5cadd; }
.home-faq summary > span { color: #b7a0cd; }
.closing-cta { background: radial-gradient(ellipse at 50% 110%, #30213f 0, #15111e 65%, #101016); }
.closing-cta:before { background: radial-gradient(ellipse at center, #6d4c930c, transparent 70%); }
.closing-cta h2 { color: #eee4f7; }
.closing-cta h2 .serif-word { color: #c2a4e0; }
.closing-cta p { color: #b59bc7; }
.closing-cta > div > small { color: #927d9f; }
.toast { color: #e1d4ee; background: #24202f; border: 1px solid #ffffff1a; box-shadow: 0 12px 40px #0008; }
@media (max-width: 650px) {
  .hero-particle-stage { background: radial-gradient(ellipse at 54% 28%, #2a203950, transparent 57%), #0b0d12; }
  .hero-particle-stage .hero-copy:before { background: linear-gradient(0deg, #0b0d12 9%, #0b0d12e8 55%, #0b0d1200 100%); }
}