/* ──────────────────────────────────────────────────────────────────────
   Public page-hero backgrounds — flattened to clean Linear surfaces.

   Was: animated glowing orbs + dot/line grid + 160deg gradients. Dropped per
   the universal UI rules (no gradients / glows). Heroes are now flat solid
   bands — the dark hero keeps its light text, the light hero keeps its dark
   text, so every public page keeps its copy + layout + contrast untouched;
   only the decorative background treatment changed.

   The existing markup (<div class="ph-orb ph-orb-1">, <div class="ph-grid">)
   stays in templates and simply renders nothing now.
   ────────────────────────────────────────────────────────────────────── */

:root {
  --public-bg-dark: hsl(222 47% 11%);
  --public-bg-light: hsl(210 40% 98%);
}

body.public-shell-body {
  overflow-x: clip;
  overflow-y: visible;
}

.ph-bg,
.ph-bg-light {
  position: relative;
  overflow: hidden;
}

.ph-bg { background: var(--public-bg-dark); }
.ph-bg-light { background: var(--public-bg-light); }
.dark .ph-bg-light { background: var(--public-bg-dark); }

/* Brand text on the dark hero.

   `.ph-bg` is a near-black band (--public-bg-dark) that appears even in the
   LIGHT theme, so brand text inside it is the one place where the light theme
   needs a LIGHTER brand rather than a darker one: --brand-primary measures
   3.86:1 there and --brand-text, being darker still, would make it worse.
   Anything at or above 72% lightness clears AA; the existing brand-300 stop
   gives 8.97:1 and is already in the palette. */
.ph-bg .mkt-eyebrow,
.ph-bg .mkt-eyebrow * {
  color: #A5B4FC;
}

/* …and the pill under that text has to stay dark for the reasoning above to
   hold. .mkt-eyebrow paints itself with
   `color-mix(in srgb, var(--theme-card-bg) 78%, transparent)`, which in the
   light theme is 78% WHITE. On this near-black band that composites to about
   rgb(202,204,208) — so the light periwinkle text chosen for a dark backdrop
   was sitting on a light grey chip at 1.24:1, invisible in practice.
   Re-pointing the mix at --public-bg-dark keeps the pill (border, radius,
   inset highlight) and puts it back on the tone it was designed against. */
.ph-bg .mkt-eyebrow {
  background: color-mix(in srgb, var(--public-bg-dark) 78%, transparent);
  box-shadow: inset 0 1px 0 color-mix(in srgb, white 10%, transparent);
}

/* decorative orbs + grid — removed */
.ph-orb,
.ph-bg .ph-grid,
.ph-bg-light .ph-grid {
  display: none;
}