/* ============================================================
   Horizon — teal-to-daylight gradient, floating glass navigation,
   mono micro-labels and a large serif display with an italic turn.
   Modelled on the reference SaaS landing, in Solari's voice.
   ============================================================ */
:root {
  --theme-name: 'Horizon';

  --color-brand-blue-50:  #F2F7F9;
  --color-brand-blue-100: #E1EDF1;
  --color-brand-blue-200: #C2DAE2;
  --color-brand-blue-300: #8FB9C7;
  --color-brand-blue-400: #4E8DA3;
  --color-brand-blue-500: #1F5F76;
  --color-brand-blue-700: #0B3D4F;

  --color-brand-accent:          #0E7490;
  --color-brand-accent-soft:     #DCEEF3;
  --color-brand-accent-strong:   #0B5A70;
  --color-brand-accent-flourish: #7FD1E8;

  /* The band is the gradient itself; ink rides light over its dark top. */
  --color-header-bg:       linear-gradient(180deg, #0B3D4F 0%, #14596F 34%, #3E8AA3 62%, #9CC5D2 82%, #EDF4F6 100%);
  --color-header-ink:      #FFFFFF;
  --color-header-ink-soft: #C2DAE2;
  --color-header-accent:   #7FD1E8;

  --color-bg:          #FFFFFF;
  --color-bg-muted:    #F2F7F9;
  --color-bg-cream:    #EDF4F6;
  --color-surface:     #FFFFFF;
  --color-border:      #DCE7EB;
  --color-divider:     #EAF1F4;

  --color-text:        #0B3D4F;
  --color-text-muted:  #3D6575;
  --color-text-soft:   #7A97A3;

  --font-serif:  'Instrument Serif', 'Playfair Display', Georgia, serif;
  --font-sans:   'Hanken Grotesk', 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --font-mono:   'Martian Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 22px;
}

/* The site header becomes a floating pill over the gradient. */
.site-header {
  background: transparent;
  position: absolute; top: 0; left: 0; right: 0;
  padding: 18px 20px 0;
  box-shadow: none;
}
.site-header__inner {
  background: rgba(11, 61, 79, .42);
  backdrop-filter: saturate(150%) blur(14px);
  -webkit-backdrop-filter: saturate(150%) blur(14px);
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 999px;
  padding: 12px 14px 12px 24px;
  max-width: 1180px;
}
.site-nav a { font-size: 14.5px; }