/* ===========================================================================
   FixHunters — Color tokens (2026 rebrand, navy edition)
   Editorial light-first palette anchored on the ORIGINAL FixHunters navy.
   The dark pole is a deep brand navy (not neutral black); hunter green
   (from the logo) is THE accent and the primary-action color. Vivid "aurora"
   hues exist exclusively as blurred background art, gradient borders and
   gradient text — never as control colors — and stay inside the brand
   family: navy, logo blue, green.
   =========================================================================== */
:root {
  /* --- Ink — the dark pole (text, dark sections, surfaces on dark) -------
         Deep navy, inherited from the original FixHunters site. */
  --fh-ink-900: #0C2334;    /* dark section background, deep navy */
  --fh-ink-800: #112D42;    /* card surface on dark */
  --fh-ink-700: #18374F;    /* raised surface on dark */
  --fh-ink-600: #1E425D;    /* hover state of ink surfaces */

  /* --- Neutrals — cool greys with a subtle blue cast ---------------------- */
  --fh-white:    #FFFFFF;
  --fh-grey-50:  #F5F8F9;   /* page tint / muted card surface */
  --fh-grey-100: #E8EEF1;   /* hairlines on light */
  --fh-grey-200: #D7E0E5;
  --fh-grey-300: #AEBFC9;
  --fh-grey-400: #7B8F9D;   /* captions, meta */
  --fh-grey-500: #5C7280;   /* secondary body text */
  --fh-grey-700: #2E4658;   /* body text on light */
  --fh-black:    #081521;

  /* --- Hunter green — the brand accent (kept from the logo) -------------- */
  --fh-green-700: #1E8E70;  /* pressed / dark green */
  --fh-green-600: #2BAE8C;  /* primary brand green (default logo) */
  --fh-green-500: #34C49B;  /* hover green */
  --fh-green-400: #20DCAB;  /* bright green — on dark only */
  --fh-green-300: #6FE6C8;  /* tint */

  /* --- Navy — brand primitives (logo lockups, gradients) ----------------- */
  --fh-navy-800: #0E2A47;   /* logo background variant */
  --fh-navy-600: #1A5189;   /* logo blue */

  /* --- Aurora — background-art hues (blurred meshes, gradient borders,
         gradient text). Brand family only: navy → logo blue → green.
         NEVER used for buttons, text blocks or icons. ---------------------- */
  --fh-aurora-blue:    #16456C;
  --fh-aurora-violet:  #2E7BC4;
  --fh-aurora-magenta: #2BAE8C;
  --fh-aurora-coral:   #20DCAB;
  --fh-aurora-emerald: #20DCAB;

  /* Semantic status */
  --fh-success: #2BAE8C;
  --fh-warning: #E9A23B;
  --fh-danger:  #E5574E;
  --fh-info:    #1A5189;

  /* ======================================================================
     Semantic aliases — reference these in components, not primitives above
     ====================================================================== */

  /* Surfaces */
  --surface-page:        var(--fh-white);
  --surface-page-tint:   var(--fh-grey-50);
  --surface-page-dark:   var(--fh-ink-900);
  --surface-card:        var(--fh-white);
  --surface-card-muted:  var(--fh-grey-50);
  --surface-card-dark:   var(--fh-ink-800);
  --surface-inverse:     var(--fh-ink-900);

  /* Text */
  --text-strong:    #142F47;                /* headings on light — navy */
  --text-body:      #35536A;                /* body on light — slate navy */
  --text-muted:     var(--fh-grey-400);     /* captions, meta */
  --text-on-dark:   #F2F6F8;                /* body on navy */
  --text-on-dark-muted: #9DB3C2;            /* muted on navy */
  --text-accent:    var(--fh-green-600);    /* green emphasis on light */
  --text-accent-dark: var(--fh-green-400);  /* green emphasis on navy */
  --text-link:      var(--fh-green-700);

  /* Primary action — green pill with white text (original FixHunters CTA) */
  --action-bg:        var(--fh-green-600);
  --action-fg:        var(--fh-white);
  --action-bg-hover:  var(--fh-green-700);
  --action-bg-dark:   var(--fh-green-600);
  --action-fg-dark:   var(--fh-white);
  --action-bg-dark-hover: var(--fh-green-500);

  /* Brand accent (emphasis, checks, links, icons) */
  --accent:         var(--fh-green-600);
  --accent-hover:   var(--fh-green-500);
  --accent-press:   var(--fh-green-700);
  --accent-on-dark: var(--fh-green-400);
  --on-accent:      var(--fh-white);

  /* Borders */
  --border-subtle:  var(--fh-grey-100);
  --border-default: var(--fh-grey-200);
  --border-strong:  var(--fh-grey-300);
  --border-on-dark: rgba(255, 255, 255, 0.14);
  --border-focus:   var(--fh-green-500);

  /* Gradients — aurora art, brand family only */
  --gradient-aurora: linear-gradient(110deg, #1A5189 0%, #2E7BC4 32%, #2BAE8C 64%, #20DCAB 100%); /* @kind color */
  --gradient-brand-text: linear-gradient(100deg, #1A5189 0%, #2BAE8C 60%, #20DCAB 100%); /* @kind color */
  --gradient-green: linear-gradient(135deg, #34C49B 0%, #2BAE8C 100%); /* @kind color */
  /* Layered blurred mesh for hero panels — apply as `background` */
  --gradient-hero:
    radial-gradient(58% 70% at 78% 22%, rgba(32, 220, 171, 0.50) 0%, rgba(32, 220, 171, 0) 60%),
    radial-gradient(55% 75% at 28% 80%, rgba(46, 123, 196, 0.65) 0%, rgba(46, 123, 196, 0) 62%),
    radial-gradient(70% 80% at 55% 55%, rgba(43, 174, 140, 0.40) 0%, rgba(43, 174, 140, 0) 65%),
    radial-gradient(48% 60% at 60% 18%, rgba(26, 81, 137, 0.85) 0%, rgba(26, 81, 137, 0) 60%),
    linear-gradient(135deg, #123553 0%, #0C2334 100%); /* @kind color */
}