/* ============================================================
   Design tokens — calibrated against the reference stylesheet
   (captured netello theme CSS). Font = Open Sans.
   ============================================================ */
:root {
  /* Brand */
  --brand:        #00b0f0;   /* primary cyan — buttons, links, accents */
  --brand-600:    #06aeeb;
  --brand-700:    #008bbd;   /* hover / darker cyan */
  --navy:         #235295;   /* deep corporate blue */
  --green:        #00cc5c;   /* action green (floating tabs, hovers) */
  --green-700:    #03ae50;

  /* Ink / text */
  --ink:          #23252f;   /* headings, primary text */
  --ink-2:        #393c42;   /* hero heading / body on light */
  --ink-3:        #2c2c2c;
  --muted:        #6b7078;

  /* Surfaces */
  --white:        #ffffff;
  --bg:           #ffffff;
  --bg-soft:      #fafafb;
  --bg-1:         #f6f6f6;
  --bg-2:         #efefef;
  --bg-3:         #f4f6f7;
  --border:       #e5e8ea;
  --border-2:     #efefef;

  /* Gradients (measured) */
  --grad-top:  linear-gradient(215.48deg, #06aeeb 15.51%, #235295 104.72%);
  --grad-hero: linear-gradient(69.63deg, rgba(255,255,255,.89) 47.06%, rgba(255,255,255,.15) 73.16%, rgba(255,255,255,0) 73.16%);

  /* Typography (measured clamps) */
  --font: "Open Sans", -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --h1: clamp(1.313rem, 1.3333vw + 1rem, 2.375rem);      /* 21 → 38px */
  --h2: clamp(1.4rem, 1.3333vw + 1rem, 1.86666rem);      /* 22.4 → 29.9px */
  --h3: 1.25rem;                                          /* 20px */
  --lead: 1.0625rem;
  --body: 16px;
  --small: 14px;
  --hw: 500;                 /* heading weight (measured: 500) */

  /* Layout (measured) */
  --container: 1460px;
  --gutter: 24px;
  --radius: 5px;
  --radius-lg: 5px;
  --shadow: 0 0 10px #ccc;
  --shadow-lg: 0 0 20px #ccc;
  --header-shadow: 2px 11px 20px -10px rgba(50,50,50,.10);
  --section-y: 3rem;         /* 48px */
  --header-h: 145px;         /* fixed header total (topbar 60 + row 85) */
  --header-h-m: 120px;       /* mobile */
}