/* ==========================================================================
   SkyTrade Operator  -  Design Tokens
   Deliberately identical to skytrade-theme/assets/css/variables.css: this
   is the operator-facing marketing site for the SAME company, and the
   brand (navy + gold, Cormorant Garamond + DM Sans) should be one system
   across both, not a fork. If the source tokens in skytrade-theme change,
   update here to match.
   ========================================================================== */
:root {
  /* ---- Colors ---- */
  --st-navy:       #0A1628;
  --st-navy-light: #0F2040;
  --st-navy-mid:   #1A3054;
  --st-gold:       #C9A84C;
  --st-gold-light: #E8C96A;
  --st-white:      #FFFFFF;
  --st-white-90:   rgba(255, 255, 255, 0.90);
  --st-white-60:   rgba(255, 255, 255, 0.60);
  --st-white-20:   rgba(255, 255, 255, 0.20);
  --st-red:        #E53E3E;
  --st-amber:      #D69E2E;
  --st-green:      #38A169;
  --st-arc-gold:   #C9A84C;
  --st-arc-dim:    rgba(201, 168, 76, 0.15);
  --st-color-primary:    var(--st-gold);
  --st-color-secondary:  var(--st-gold-light);
  --st-color-surface:    var(--st-navy-light);
  --st-color-error:      var(--st-red);
  --st-color-background: var(--st-navy);
  /* ---- Operator-specific accents ----
     The consumer site is warm/hospitality (charter, tours, medevac).
     The operator site is an operations tool: dispatch, compliance,
     fleet status. Same palette, but these two signal colors give the
     operator site its own functional vocabulary - "live/on-time" and
     "attention needed" - used sparingly, only where status is real. */
  --st-signal-live:    var(--st-green);
  --st-signal-warn:    var(--st-amber);
  --st-signal-blocked: var(--st-red);
  /* ---- Typography ---- */
  --st-font-display: "Cormorant Garamond", Georgia, serif;
  --st-font-body:    "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --st-font-mono:    "JetBrains Mono", "SF Mono", "Roboto Mono", Consolas, monospace;
  --st-text-display-large-size:    56px;
  --st-text-display-large-weight:  700;
  --st-text-display-large-color:   var(--st-white);
  --st-text-headline-large-size:   32px;
  --st-text-headline-large-weight: 700;
  --st-text-headline-large-color:  var(--st-white);
  --st-text-headline-medium-size:   24px;
  --st-text-headline-medium-weight: 600;
  --st-text-headline-medium-color:  var(--st-white);
  --st-text-body-large-size:   17px;
  --st-text-body-large-weight: 400;
  --st-text-body-large-color:  var(--st-white-90);
  --st-text-body-medium-size:   14px;
  --st-text-body-medium-weight: 400;
  --st-text-body-medium-color:  var(--st-white-60);
  --st-text-label-large-size:   14px;
  --st-text-label-large-weight: 700;
  --st-text-label-large-color:  var(--st-white);
  /* ---- Buttons ---- */
  --st-button-bg:          var(--st-gold);
  --st-button-fg:          var(--st-navy);
  --st-button-font-size:   14px;
  --st-button-font-weight: 700;
  --st-button-min-height:  52px;
  --st-button-radius:      8px;
  /* ---- Form inputs ---- */
  --st-input-bg:                 var(--st-navy-light);
  --st-input-radius:             8px;
  --st-input-border:             var(--st-navy-mid);
  --st-input-border-focus:       var(--st-gold);
  --st-input-border-focus-width: 1.5px;
  --st-input-label-color:        var(--st-white-60);
  --st-input-hint-color:         var(--st-white-20);
  --st-divider-color: var(--st-navy-mid);
  /* ---- Spacing scale ---- */
  --st-space-xs:  8px;
  --st-space-sm:  12px;
  --st-space-md:  16px;
  --st-space-lg:  24px;
  --st-space-xl:  32px;
  --st-space-2xl: 48px;
  --st-space-3xl: 64px;
  --st-space-4xl: 96px;
  /* ---- Layout ---- */
  --st-radius-card:   12px;
  --st-radius-button: var(--st-button-radius);
  --st-radius-input:  var(--st-input-radius);
  --st-max-width:     1200px;
}