/* =========================================================
   ZYNERA HEALTHCARE — DESIGN TOKENS
   Palette derived directly from the brand logo:
   navy figure + orange arc, plus supporting neutrals.
   ========================================================= */
:root{
  /* --- Brand core (from logo) --- */
  --zy-navy:          #2b3f7e;   /* logo navy */
  --zy-navy-deep:      #1a2650;   /* hero / footer depth */
  --zy-navy-deeper:    #12193a;   /* darkest, for gradients */
  --zy-orange:         #f4841f;   /* logo orange */
  --zy-orange-dark:    #d96c0f;

  /* --- Supporting accent --- */
  --zy-teal:           #2f6b63;   /* muted clinical teal, used sparingly */
  --zy-teal-tint:      #eaf3f1;

  /* --- Neutrals --- */
  --zy-white:          #ffffff;
  --zy-off-white:      #f7f8fa;
  --zy-grey-100:       #eef0f4;
  --zy-grey-200:       #dde1e8;
  --zy-grey-400:       #9aa2b1;
  --zy-grey-600:       #5c6577;
  --zy-grey-800:       #2b3040;
  --zy-ink:            #1b1e2a;

  /* --- Semantic --- */
  --zy-border:         rgba(27,30,42,0.10);
  --zy-border-strong:  rgba(27,30,42,0.18);
  --zy-shadow-sm:      0 2px 10px rgba(18,25,58,0.06);
  --zy-shadow-md:      0 12px 30px rgba(18,25,58,0.10);
  --zy-overlay-navy:   linear-gradient(180deg, rgba(18,25,58,0.92) 0%, rgba(26,38,80,0.88) 100%);

  /* --- Typography --- */
  --font-display: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
  --font-body:    'Inter', 'Segoe UI', sans-serif;

  /* --- Radius / spacing --- */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --section-pad: clamp(64px, 9vw, 128px);

  /* --- Motion --- */
  --ease-premium: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 200ms;
  --dur-med: 500ms;
  --dur-slow: 900ms;
}

@media (prefers-reduced-motion: reduce){
  *{ animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}
