/* ClearGlass · Unified Station Button System (station-buttons.css)
   ────────────────────────────────────────────────────────────────────────────
   Gives every homepage call-to-action ONE canonical look, derived from the
   ClearGlass Station dock (station-chat.js): crimson glassmorphism, a soft
   lift-on-hover, an accessible white focus-visible ring, and a gentle press.

   Strictly additive and presentational. It changes no markup, no class names,
   no hrefs, no onclick handlers, and no JS selectors — it only restyles the
   existing CTA vocabulary so the scattered buttons read as one system, visually
   consolidated around the ClearGlass Station look. Loaded LAST so it settles
   the cascade over the earlier button layers (buttons.css, future-buttons.css,
   clearglass-crimson.css, clearglass-legacy-visual.css, clearglass-motion.css).

   No external fonts, no libraries, no build step — safe for GitHub Pages.

   Scope note: this unifies the site's CTA vocabulary — the .btn family
   (.btn-dark / .btn-primary / .btn-crystal / .btn-glass and .btn.primary /
   .btn.secondary), the .nav-cta, and the motion CTAs (.cgm-btn /
   .cgm-btn--secondary). Purely functional controls (nav/menu toggles, the
   telemetry/motion switches, form submit + GitHub auth, Sentinel component
   buttons, and the catalog cards) keep their own semantics on purpose so no
   behaviour or state indicator is lost. The .cgm-btn magnetic transform and
   its data-state (loading/success/error) colours are intentionally preserved. */

:root{
  --cgsb-red:#ee6365;
  --cgsb-ink:#f7f1f1;
  --cgsb-radius:14px;
  --cgsb-ease:cubic-bezier(.16,1,.3,1);
  --cgsb-border:rgba(238,99,101,.42);
  --cgsb-border-hi:rgba(238,99,101,.82);
  --cgsb-glow:0 10px 26px -16px rgba(0,0,0,.9),0 0 20px -8px rgba(238,99,101,.5),inset 0 1px 0 rgba(255,255,255,.1);
  --cgsb-glow-hi:0 16px 40px -18px rgba(0,0,0,.94),0 0 30px -8px rgba(238,99,101,.72),inset 0 1px 0 rgba(255,255,255,.13);
  --cgsb-fill:radial-gradient(140% 130% at 86% 0,rgba(238,99,101,.34),transparent 62%),linear-gradient(168deg,#b23138,#7c1e33);
  --cgsb-fill-hi:radial-gradient(140% 130% at 86% 0,rgba(238,99,101,.44),transparent 62%),linear-gradient(168deg,#c4363a,#8f1d3f);
  --cgsb-ghost:radial-gradient(120% 90% at 82% 0,rgba(238,99,101,.16),transparent 60%),linear-gradient(168deg,rgba(44,24,26,.9),rgba(18,12,13,.94));
  --cgsb-ghost-hi:radial-gradient(120% 90% at 82% 0,rgba(238,99,101,.24),transparent 60%),linear-gradient(168deg,rgba(58,30,33,.94),rgba(26,16,18,.96));
}

/* ── shared canonical shell (applies across the whole CTA vocabulary) ────── */
html :is(.btn,.btn-dark,.btn-primary,.btn-crystal,.btn-glass,.nav-cta,.cgm-btn){
  position:relative;
  border-radius:var(--cgsb-radius)!important;
  border:1px solid var(--cgsb-border)!important;
  color:var(--cgsb-ink)!important;
  font-family:'Urbanist',Inter,system-ui,-apple-system,'Segoe UI',sans-serif;
  font-weight:700;
  letter-spacing:-.01em;
  -webkit-backdrop-filter:blur(16px) saturate(1.4);
  backdrop-filter:blur(16px) saturate(1.4);
  box-shadow:var(--cgsb-glow)!important;
  transition:transform .22s var(--cgsb-ease),border-color .22s ease,box-shadow .22s ease,background .22s ease,color .22s ease;
  isolation:isolate;
}

/* ── primary tier — filled crimson glass, echoes the Station dock ────────── */
html :is(.btn,.btn-dark,.btn-primary,.btn-crystal,.btn.primary,.cta.primary,.nav-cta){
  background:var(--cgsb-fill)!important;
  border-color:var(--cgsb-border-hi)!important;
  color:#fff!important;
}

/* ── secondary / ghost tier — translucent Station-row glass ──────────────── */
html :is(.btn-glass,.btn.secondary,.cta.secondary,.cgm-btn--secondary){
  background:var(--cgsb-ghost)!important;
  border-color:var(--cgsb-border)!important;
  color:var(--cgsb-ink)!important;
}

/* ── hover / focus: crimson glow + brighter border (shared) ──────────────── */
html :is(.btn,.btn-dark,.btn-primary,.btn-crystal,.btn-glass,.nav-cta,.cgm-btn):hover,
html :is(.btn,.btn-dark,.btn-primary,.btn-crystal,.btn-glass,.nav-cta,.cgm-btn):focus-visible{
  border-color:var(--cgsb-border-hi)!important;
  box-shadow:var(--cgsb-glow-hi)!important;
}
/* the lift is only for the non-magnetic buttons (a .cgm-btn owns its transform) */
html :is(.btn,.btn-dark,.btn-primary,.btn-crystal,.btn-glass,.nav-cta):hover{transform:translateY(-1px)}
html :is(.btn,.btn-dark,.btn-primary,.btn-crystal,.btn.primary,.cta.primary,.nav-cta):hover{
  background:var(--cgsb-fill-hi)!important;color:#fff!important;
}
html :is(.btn-glass,.btn.secondary,.cta.secondary,.cgm-btn--secondary):hover{
  background:var(--cgsb-ghost-hi)!important;
}

/* ── press ───────────────────────────────────────────────────────────────── */
html :is(.btn,.btn-dark,.btn-primary,.btn-crystal,.btn-glass,.nav-cta):active{transform:translateY(0) scale(.985)}

/* ── accessible focus-visible ring (echoes the Station's white outline) ──── */
html :is(.btn,.btn-dark,.btn-primary,.btn-crystal,.btn-glass,.nav-cta,.cgm-btn):focus-visible{
  outline:2px solid #fff!important;outline-offset:3px!important;
}

/* ── keep the family crimson-only: retint the earlier cyan hover halo ────── */
html .btn::before{
  background:linear-gradient(105deg,transparent 10%,rgba(238,99,101,.4),rgba(238,99,101,.26),transparent 90%)!important;
}

/* ── responsive grouping of the CTA rows around the Station look ─────────── */
:is(.hero-actions,.founder-actions,.cta-actions,.cgm-actions){
  display:flex;flex-wrap:wrap;align-items:center;gap:14px;
}
@media(max-width:560px){
  :is(.hero-actions,.founder-actions,.cta-actions) :is(.btn,.btn-dark,.btn-primary,.btn-crystal,.btn-glass,.cgm-btn){
    flex:1 1 100%;justify-content:center;text-align:center;
  }
}

/* ── reduced-motion: drop transitions and the lift ───────────────────────── */
@media(prefers-reduced-motion:reduce){
  html :is(.btn,.btn-dark,.btn-primary,.btn-crystal,.btn-glass,.nav-cta,.cgm-btn){transition:none!important}
  html :is(.btn,.btn-dark,.btn-primary,.btn-crystal,.btn-glass,.nav-cta):hover,
  html :is(.btn,.btn-dark,.btn-primary,.btn-crystal,.btn-glass,.nav-cta):active{transform:none!important}
}

/* ── graceful fallback where backdrop-filter is unsupported ──────────────── */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  html :is(.btn-glass,.btn.secondary,.cta.secondary,.cgm-btn--secondary){
    background:linear-gradient(168deg,rgba(30,18,20,.98),rgba(18,12,13,.99))!important;
  }
}

/* ── forced-colors / high-contrast: defer to system colours ──────────────── */
@media(forced-colors:active){
  html :is(.btn,.btn-dark,.btn-primary,.btn-crystal,.btn-glass,.nav-cta,.cgm-btn){
    border:1px solid CanvasText!important;background:Canvas!important;color:CanvasText!important;box-shadow:none!important;
  }
}