/* Home page art direction (owner 2026-10-18). Loaded last, home page only; existing site CSS is untouched.
   1. Gold is Oruva: every non-gold headline/text accent takes the page's gold token (--gold). The pink-to-lilac
      gradient stays only on the hero's "No 3ds Max." and the closing headline. Mock app windows, app/renderer icons,
      logos, renders and videos are not touched.
   2. Readable body copy: cream (--ink) at 80%, 17px on desktop, about 68 characters per line.
   3. Act openers: larger chapter label (number in cream, word in gold) with a gold hairline above the act. */

/* 1. Gold accents */
.journey-page .story .scene-copy h2 em,
.journey-page #convert .section-intro h2 em,
.journey-page #destinations .section-intro h2 em,
.journey-page #search .section-intro h2 em,
.journey-page #smart .section-intro h2 em,
.journey-page #organize .section-intro h2 em,
.journey-page #organize .image-model-flow > h3 em,
.journey-page #tools .section-intro h2 em,
.journey-page #your-library .section-intro h2 em {
  color: var(--gold); background: none; -webkit-background-clip: border-box; background-clip: border-box; -webkit-text-fill-color: currentColor;
}
.journey-page .stage-topline > span > i,
.journey-page .scene-copy--intro .hero-pill > i { background: var(--gold); }
.journey-page #tools .library-feature-name,
.journey-page #tools .library-feature-name svg,
.journey-page #local .library-local-icon,
.journey-page #local .library-local-signoff,
.journey-page #your-library .disk-promise-mark,
.journey-page #your-library .disk-promise-mark svg,
.journey-page #your-library .disk-promises svg { color: var(--gold); }
.journey-page #local .library-local-icon { border-color: color-mix(in srgb, var(--gold) 35%, transparent); }

/* 2. Body copy (fine print keeps its size; it already meets WCAG AA) */
.journey-page .page-section .section-intro p:not(.eyebrow),
.journey-page #pricing .pricing-heading p,
.journey-page #ai-build .alt-prop-line,
.journey-page #ai-build .astra-copy,
.journey-page .image-model-flow ol p,
.journey-page .library-story > p:not(.library-feature-name),
.journey-page .library-tool-copy p,
.journey-page .library-local-strip p,
.journey-page .questions-section details p {
  color: color-mix(in srgb, var(--ink) 80%, transparent); max-width: min(68ch, 100%);
}
.journey-page .page-section .section-intro p:not(.eyebrow) { max-width: min(68ch, var(--page-copy-width)); }
/* Owner 2026-10-18: a capped line that is centered keeps auto side margins, so its box stays centered too
   (section intros already have them from the site CSS). */
.journey-page #pricing .pricing-heading p,
.journey-page #ai-build .alt-prop-line { margin-inline: auto; }
/* Raised to 17px only where it was smaller (the AI lead line and FAQ answers are already 18px). */
.journey-page .page-section .section-intro p:not(.eyebrow),
.journey-page #pricing .pricing-heading p,
.journey-page #ai-build .astra-copy,
.journey-page .image-model-flow ol p,
.journey-page .library-story > p:not(.library-feature-name),
.journey-page .library-tool-copy p,
.journey-page .library-local-strip p { font-size: 17px; }
/* The hero and story copy sit on the fixed-size animated stage: color only, sizes unchanged. */
.journey-page .scene-copy .scene-description { color: color-mix(in srgb, var(--ink) 80%, transparent); }
@media (max-width: 700px) {
  .journey-page .page-section .section-intro p:not(.eyebrow),
  .journey-page #ai-build .astra-copy,
  .journey-page .image-model-flow ol p,
  .journey-page .library-story > p:not(.library-feature-name),
  .journey-page .library-tool-copy p,
  .journey-page .library-local-strip p { font-size: 16px; }
}

/* 3. Act openers */
.journey-page main > .page-section:has(> .section-shell > .section-intro > .chapter-label) {
  border-top-color: color-mix(in srgb, var(--gold) 45%, transparent);
  padding-top: calc(var(--page-section-space) + 32px);
}
.journey-page .page-section .section-intro > .eyebrow.chapter-label { gap: 16px; margin: 0 auto 44px; font-size: 22px; line-height: 1.3; letter-spacing: .12em; }
.journey-page .page-section .section-intro > .chapter-label > span:first-child { color: var(--ink); }
.journey-page .page-section .section-intro > .chapter-label > .chapter-slash { color: var(--faint); }
.journey-page .page-section .section-intro > .chapter-label > span:last-child { color: var(--gold); }
@media (max-width: 700px) {
  .journey-page main > .page-section:has(> .section-shell > .section-intro > .chapter-label) { padding-top: calc(var(--page-section-space) + 16px); }
  .journey-page .page-section .section-intro > .eyebrow.chapter-label { gap: 12px; margin-bottom: 32px; font-size: 18px; }
}

/* Owner 2026-10-18: "Even on a Mac." never breaks across lines (the break may only fall before it). */
.watch-swap [data-watch-variant="mac"] em { white-space: nowrap; }
/* Owner 2026-10-18: the Watch title is two lines in both variants, the gold sentence always on its own second line
   (like the page's other two-line headlines); the Mac tag stays on the gold line. Both variants then share one height. */
.journey-page #workflow .watch-swap > [data-watch-variant] > em::before { content: "\A"; white-space: pre; }

/* r20: 3ds Max joins the AI scene-building apps (version tag); SketchUp shows as coming. */
.astra-apps li small { margin-left:auto; padding-left:8px; font-size:12px; letter-spacing:.02em; color:#9d8f78; white-space:nowrap; }
.astra-apps li.is-soon { border-style:dashed; border-color:#4a3e2e; color:#a89a82; }
.astra-apps li.is-soon img { opacity:.55; }
.astra-apps li.is-soon small { color:#c9a468; }
