/* Shared design tokens for the reusable page modules — the pricing cards
   (css/pricing-cards.css) and the download block (css/downloads.css).

   The palette is ported from the post-login plans page
   (gocore views/plans-feature.html) so both sides of sign-in read as one
   product. Kept in one file rather than copied per module: the modules are
   meant to sit on the same page and must not drift apart.

   Scoped to .duet-ui, never :root. These pages already load duet-styles.css,
   and generic names like --text or --bg on :root would leak into every other
   block on the page. Each module's root element carries the class.

   Light only. The plans page ships a dark theme, but these marketing pages have
   no theme switch and are light throughout, so honouring prefers-color-scheme
   would darken one band on an otherwise light page. */

.duet-ui {
  /* One accent: Duet blue (#5C98DE). --duet-blue-ink is the darkened form used
     as type, where the brand blue itself fails AA at body sizes. */
  --duet-bg: #fbf9f5;
  /* The glow is anchored just outside the edge it belongs to, so it enters at
     full strength and fades inward. A run of modules is bookended: the first
     takes the top glow, the last the bottom one, and the middle stays flat ivory
     — which is what lets stacked modules read as a single surface. */
  --duet-bg-glow: radial-gradient(1150px 640px at 50% -12%, rgba(92, 152, 222, .20), transparent 70%);
  --duet-bg-glow-bottom: radial-gradient(1150px 640px at 50% 112%, rgba(92, 152, 222, .20), transparent 70%);
  --duet-blue-ink: #2f6fbf;
  --duet-surface: #fff;
  --duet-stroke: rgba(20, 24, 35, .11);
  --duet-stroke-strong: rgba(20, 24, 35, .18);
  --duet-text: #161b26;
  --duet-muted: #5c6678;
  --duet-faint: #8a93a3;
  --duet-blue-grad: linear-gradient(135deg, #9cc8f7 0%, #5c98de 42%, #2f6fbf 100%);
  --duet-blue-line: linear-gradient(135deg, #7fb3ec, #2f6fbf 55%, #5c98de);
  /* Primary button. Near-vertical so the ramp reads as a lit surface rather than
     a diagonal wash, with an inset top highlight doing the actual work of making
     the pill look dimensional. */
  --duet-cta-grad: linear-gradient(163deg, #82baf2 0%, #5c98de 48%, #3a6ec2 100%);
  --duet-blue-on: #fff;
  /* CTA halo. Duet blue is hue 212 and a true cyan is 188, so this sits at 200 —
     luminous enough to read as neon, close enough to stay in the brand family.
     One knob: every glow in the modules references it. */
  --duet-neon-rgb: 76, 186, 240;
  --duet-shadow: 0 18px 50px -22px rgba(24, 20, 10, .32);
  --duet-shadow-pop: 0 30px 70px -26px rgba(47, 111, 191, .45);
  --duet-seg-track: #f4efe5;
  --duet-heading: Montserrat, "Nunito Sans", sans-serif;
  --duet-radius: 22px;
}

/* Modules stacked on one page share a single continuous surface. The pricing
   block glows from its top edge and the download block from its bottom, so a
   page carrying both is lit at the two outer edges and flat ivory where they
   meet — no seam to hide. Any rule that still has to override a module's own
   background lives in that module's stylesheet, because it must out-specify that
   module's id selector; a bare `.duet-ui ~ .duet-ui` here would lose to
   `#downloads` (0-2-0 against 1-0-0) and silently do nothing.

   Those selectors use the general sibling combinator, not the adjacent one: each
   partial emits its stylesheet <link> tags — and the pricing one a <script> —
   between the sections, so the modules are never immediate siblings. */