/* Page-specific additions to /style.css. Every rule is scoped to Path.
   LIGHT ONLY, like the rest of the site (founder, 2026-09-22: "make
   everything light themed"). The dark palette, the appearance media query
   that used to pick it, the appearance toggle in the header and the dark
   screenshot went with it; /style.css declares a light color scheme for
   every page, this one included. Path's green accent and its layout
   are untouched. The APP still has a light and a dark appearance - that is
   a thing you choose inside Sistine Path, and the plan card still says so;
   it was never the website's setting. */
.path-page {
  --path-accent: #258b45;
  --path-on-accent: #fff;
  --path-surface: #f8f9f8;
  --path-header: rgba(255, 255, 255, .88);
  --faint: #72767b;
}
.path-page [hidden] { display: none !important; }
.path-page :focus-visible { outline: 2px solid var(--path-accent); outline-offset: 5px; }
.path-page .path-skip { position: fixed; top: -100px; left: 20px; z-index: 20; padding: 10px 16px; background: var(--path-surface); }
.path-page .path-skip:focus { top: 12px; }
.path-page header { background: var(--path-header); border-bottom: 1px solid var(--hair); }
.path-page .logo .mark { width: 32px; height: 32px; border-radius: 0; }
.path-page nav { display: flex; align-items: center; }
.path-page .path-hero { min-height: min(900px, 100svh); padding-top: 120px; padding-bottom: 70px; }
.path-page .hero .path-wave { width: 140px; height: 140px; object-fit: contain; margin-bottom: 14px; }
.path-page .path-eyebrow { color: var(--path-accent); font-size: 12px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 16px; }
.path-page .path-eyebrow .chip { margin-left: 10px; vertical-align: 1px; color: var(--dim); }
/* Path's buttons are green wherever they are: the hero's download and the
   "Open Sistine Path" link in the activation block. Not scoped to .hero any
   more, because /style.css gave `.btn` a filled dark default when the
   homepage started carrying a download button of its own. */
.path-page .btn { background: var(--path-accent); color: var(--path-on-accent); }
.path-page .btn:hover { filter: brightness(.9); background: var(--path-accent); }
.path-page .path-preview { padding-top: 34px; padding-bottom: 40px; scroll-margin-top: 105px; }
.path-page .path-preview h2 { margin-bottom: 28px; }
.path-page .path-preview figure { max-width: 1200px; margin: 0 auto; }
.path-page .path-screen { width: 100%; height: auto; border: 1px solid var(--hair); border-radius: 14px; box-shadow: 0 20px 70px rgba(0, 0, 0, .09); }
.path-page figcaption { margin-top: 24px; }
.path-page .path-features .jobs { grid-template-columns: repeat(3, minmax(0, 270px)); gap: 48px; }
.path-page .jobs .path-number { color: var(--path-accent); display: block; font-size: 12px; font-weight: 600; margin-bottom: 16px; }
.path-page .path-pricing { padding-top: 45px; scroll-margin-top: 90px; }
.path-page .path-plan { max-width: 640px; margin: 0 auto; padding: 36px; text-align: left; border: 1px solid var(--hair); border-radius: 20px; background: var(--path-surface); }
.path-page .path-plan-heading { display: flex; gap: 18px; justify-content: space-between; align-items: center; flex-wrap: wrap; }
.path-page .path-plan-heading h3 { font-size: 22px; font-weight: 650; letter-spacing: -.02em; }
.path-page .path-plan-heading strong { font-size: 42px; font-weight: 600; letter-spacing: -.03em; }
.path-page .path-plan-heading span { font-size: 13px; color: var(--dim); }
.path-page .path-plan-description { font-size: 15px; color: var(--dim); margin: 18px 0 26px; }
.path-page .path-launch-note { font-size: 14px; color: var(--dim); margin: 24px 0 18px; }
.path-page .path-launch-note a, .path-page .path-consent a { text-decoration: underline; text-underline-offset: 3px; }
.path-page button { font-family: inherit; }
.path-page .path-subscribe { width: 100%; border: 0; border-radius: 12px; padding: 15px 22px; background: var(--path-accent); color: var(--path-on-accent); font-size: 15px; font-weight: 600; cursor: pointer; }
.path-page .path-subscribe:disabled { cursor: default; background: var(--hair); color: var(--dim); }
.path-page .path-secondary { border: 1px solid var(--hair); border-radius: 10px; background: transparent; color: var(--ink); padding: 10px 14px; font-size: 14px; cursor: pointer; }
.path-page .path-message { font-size: 14px; color: var(--dim); margin-top: 14px; }
.path-page .path-message:empty { display: none; }
.path-page .path-consent { padding: 24px 0 18px; }
.path-page .path-consent label { display: flex; gap: 12px; font-size: 13px; color: var(--dim); }
.path-page .path-consent label + label { margin-top: 18px; }
.path-page .path-consent input { width: 18px; height: 18px; flex: 0 0 18px; margin-top: 3px; accent-color: var(--path-accent); }
.path-page .path-consent .fine { margin-top: 16px; font-size: 12px; }
.path-page .path-activation { padding-top: 24px; font-size: 14px; }
.path-page .path-activation p { color: var(--dim); margin: 10px 0; }
.path-page .path-activation .btn { margin-top: 10px; }
.path-page .path-research { padding: 0 24px 95px; max-width: 690px; margin: 0 auto; text-align: center; }
.path-page .path-research h2 { font-size: 20px; font-weight: 600; margin-bottom: 16px; letter-spacing: -.015em; }
.path-page .path-research .fine { margin-top: 20px; font-size: 13px; line-height: 1.7; }
.path-page footer { border-top: 1px solid var(--hair); }
@media (max-width: 650px) {
  .path-page header { padding: 14px 18px; }
  .path-page nav a { margin-left: 14px; font-size: 12px; }
  .path-page nav a[href="#pricing"] { display: none; }
  .path-page .path-hero { min-height: auto; padding-top: 110px; padding-bottom: 60px; }
  .path-page .hero .path-wave { width: 105px; height: 105px; }
  .path-page .hero p { font-size: 17px; }
  .path-page .hero .fine { font-size: 12px; }
  .path-page .path-preview { padding-right: 14px; padding-left: 14px; }
  .path-page .path-features { padding: 70px 28px; }
  .path-page .path-features .jobs { grid-template-columns: 1fr; gap: 32px; }
  .path-page .path-plan { padding: 24px; }
  .path-page .tiers li { gap: 12px; }
  .path-page footer a { display: inline-block; margin-bottom: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  html:has(.path-page) { scroll-behavior: auto; }
}

/* App links use a short checkout/connection screen instead of the sales page. */
.path-page[data-flow="connection"] .path-hero,
.path-page[data-flow="connection"] .path-preview,
.path-page[data-flow="connection"] .path-features,
.path-page[data-flow="connection"] .path-research,
.path-page[data-flow="connection"] header nav a,
.path-page[data-flow="connection"] #pricing-title,
.path-page[data-flow="connection"] .path-plan-heading,
.path-page[data-flow="connection"] .path-plan-description,
.path-page[data-flow="connection"] .tiers { display: none; }
.path-page[data-flow="connection"] .path-pricing { min-height: 76svh; padding-top: 135px; }
.path-page .path-connection-intro { max-width: 560px; margin: 0 auto 28px; text-align: center; }
.path-page .path-connection-intro img { margin-bottom: 16px; }
.path-page .path-connection-intro h1 { font-size: 30px; font-weight: 600; letter-spacing: -.025em; margin-bottom: 14px; }
.path-page .path-connection-intro p { color: var(--dim); font-size: 15px; line-height: 1.6; }
.path-page[data-flow="connection"] .path-plan { max-width: 560px; }

.path-page[data-flow="connection"] #launch-note,
.path-page[data-flow="connection"] #subscribe:disabled { display: none; }