/* Team Health Check — landing design tokens.
   Values are extracted verbatim from reference/landing.html.
   HTML/CSS is the source of truth; this file must never diverge from it. */
:root{
  /* ---- Page / surface colors ---- */
  --thc-bg-page:#050B1A;
  --thc-surface-glass:rgba(255,255,255,.06);
  --thc-surface-glass-border:rgba(255,255,255,.14);
  --thc-surface-chip:rgba(255,255,255,.07);
  --thc-surface-chip-border:rgba(255,255,255,.16);
  --thc-photo-placeholder:rgba(255,255,255,.06);
  --thc-backdrop-filter:blur(26px) saturate(160%);

  /* ---- Text colors ---- */
  --thc-text-primary:#FFFFFF;
  --thc-text-secondary:#DCE6F5;
  --thc-text-muted:#B9C6DC;
  --thc-text-on-cyan:#04121F;

  /* ---- Accents ---- */
  --thc-accent-cyan:#7FE8FF;
  --thc-accent-cyan-hover:#B4F2FF;
  --thc-accent-cta:#D33A1F;            /* prototype prop "accent", default value */
  --thc-accent-cta-alt-1:#0E7BD9;      /* alternative values offered by the prototype prop */
  --thc-accent-cta-alt-2:#7A3CE8;
  --thc-accent-cta-alt-3:#00A88F;
  --thc-status-danger:#FF5A5A;
  --thc-status-danger-text:#FF9B9B;
  --thc-status-danger-bg:rgba(255,90,90,.16);
  --thc-status-danger-border:rgba(255,90,90,.5);
  --thc-status-info-text:#9EEEFF;
  --thc-status-info-bg:rgba(127,232,255,.14);
  --thc-status-info-border:rgba(127,232,255,.45);
  --thc-status-success:#5FE0C0;
  --thc-status-success-text:#8FF0D8;
  --thc-status-success-bg:rgba(95,224,192,.14);
  --thc-status-success-border:rgba(95,224,192,.45);

  /* ---- Chart colors ---- */
  --thc-chart-line:#7FE8FF;
  --thc-chart-grid:rgba(255,255,255,.08);
  --thc-chart-line-width:3px;
  --thc-chart-grid-width:1px;

  /* ---- Background neon waves ---- */
  --thc-wave-1:linear-gradient(100deg,rgba(0,180,255,0) 14%,rgba(60,200,255,.55) 44%,rgba(0,180,255,0) 70%);
  --thc-wave-2:linear-gradient(80deg,rgba(255,90,60,0) 16%,rgba(255,90,60,.5) 48%,rgba(150,90,255,.45) 68%,rgba(150,90,255,0) 86%);
  --thc-wave-3:linear-gradient(95deg,rgba(90,255,220,0) 22%,rgba(90,255,220,.32) 52%,rgba(90,255,220,0) 80%);

  /* ---- Typography ---- */
  --thc-font-family:'IBM Plex Sans',system-ui,sans-serif;
  --thc-font-weight-regular:400;
  --thc-font-weight-medium:500;
  --thc-font-weight-semibold:600;
  --thc-font-weight-bold:700;

  --thc-h1-size:clamp(22px,3vh + .6vw,40px);
  --thc-h1-size-mobile:32px;      /* <=700px */
  --thc-h1-line-height:1.02;
  --thc-h1-letter-spacing:-.045em;

  --thc-lead-size:clamp(12px,1.35vh + .2vw,15px);
  --thc-lead-line-height:1.45;

  --thc-brand-size:17px;
  --thc-brand-letter-spacing:-.02em;

  --thc-card-caption-size:15px;
  --thc-card-caption-letter-spacing:.08em;
  --thc-card-caption-transform:uppercase;

  --thc-card-body-size:clamp(15px,1.9vh,18px);
  --thc-card-body-line-height:1.4;

  --thc-metric-size:clamp(30px,3.4vh,44px);
  --thc-metric-letter-spacing:-.03em;
  --thc-metric-delta-size:15px;

  --thc-chart-value-size:17px;
  --thc-chart-value-letter-spacing:-.02em;
  --thc-chart-axis-size:14px;

  --thc-chip-size:13px;
  --thc-badge-size:11px;
  --thc-cta-primary-size:clamp(14px,1.7vh,17px);
  --thc-cta-secondary-size:15px;
  --thc-footnote-size:14px;

  /* ---- Spacing ---- */
  --thc-space-2:2px;
  --thc-space-5:5px;
  --thc-space-6:6px;
  --thc-space-8:8px;
  --thc-space-10:10px;
  --thc-space-12:12px;
  --thc-space-14:14px;
  --thc-space-16:16px;
  --thc-space-20:20px;
  --thc-space-26:26px;
  --thc-space-28:28px;
  --thc-shell-padding:16px 20px 28px;
  --thc-shell-gap:16px;
  --thc-shell-max-width:1180px;
  --thc-header-padding:10px 16px;
  --thc-header-gap:14px;
  --thc-hero-padding:clamp(12px,1.8vh,26px);
  --thc-hero-gap:clamp(14px,2vw,26px);
  --thc-hero-text-gap:clamp(7px,1.2vh,14px);
  --thc-hero-height:clamp(190px,calc(100dvh - 330px),340px);
  --thc-band-gap:16px;
  --thc-band-columns:1.6fr 1fr 1.4fr;
  --thc-card-padding:clamp(20px,2.6vh,30px);
  --thc-card-gap:clamp(9px,1.4vh,14px);
  --thc-chart-card-gap:12px;
  --thc-chip-padding:8px 14px;
  --thc-chip-gap:10px;
  --thc-badge-padding:5px 10px;
  --thc-cta-primary-padding:clamp(11px,1.8vh,16px) clamp(22px,2.6vw,32px);
  --thc-cta-secondary-padding:10px 20px;
  --thc-footer-padding:10px 16px;
  --thc-footer-min-height:50px;
  --thc-lead-max-width:480px;
  --thc-hero-text-flex-basis:300px;
  --thc-nav-max-width:52%;
  --thc-logo-height:28px;
  --thc-logo-padding:3px 6px;
  --thc-list-dot-size:8px;
  --thc-chip-dot-size:6px;

  /* ---- Radii ---- */
  --thc-radius-8:8px;
  --thc-radius-12:12px;
  --thc-radius-14:14px;
  --thc-radius-20:20px;
  --thc-radius-22:22px;
  --thc-radius-28:28px;
  --thc-radius-30:30px;
  --thc-radius-pill:999px;
  --thc-radius-circle:50%;

  /* ---- Borders ---- */
  --thc-border-width:1px;

  /* ---- Shadows / glows ---- */
  --thc-shadow-hero:0 18px 44px rgba(0,0,0,.45);
  --thc-glow-cta-primary:0 0 34px rgba(255,90,60,.5);
  --thc-glow-cta-secondary:0 0 26px rgba(127,232,255,.55);
  --thc-glow-chip-dot:0 0 10px rgba(127,232,255,.95);
  --thc-glow-list-dot:0 0 12px rgba(127,232,255,.9);
  --thc-glow-chart-line:drop-shadow(0 0 8px rgba(127,232,255,.65));
  --thc-glow-chart-dot:drop-shadow(0 0 8px rgba(127,232,255,.9));
  --thc-glow-alert-dot:drop-shadow(0 0 8px rgba(255,90,90,.85));

  /* ---- Motion ---- */
  --thc-dur-marquee:26s;
  --thc-dur-chart-cycle:10s;
  --thc-dur-wave-1:18s;
  --thc-dur-wave-2:24s;
  --thc-dur-wave-3:31s;
  --thc-ease-linear:linear;
  --thc-ease-inout:ease-in-out;
  --thc-counter-cycle-ms:10000;

  /* ---- Layers ---- */
  --thc-z-background:0;
  --thc-z-content:1;

  /* ---- Breakpoint ---- */
  --thc-breakpoint-mobile:700px;
}
