/* Sinar Niaga — color tokens
   Sampled from Facebook post artwork + logo. */
:root {
  /* Base navy backgrounds */
  --navy-950: #060d1a;   /* darkest — footer bands, vignette */
  --navy-900: #0a1626;   /* primary canvas */
  --navy-800: #102036;   /* raised panels */
  --navy-700: #16304e;   /* card fills over photo */

  /* Brand accents */
  --brand-blue: #29abe2;   /* logo dot, links, cool highlight */
  --brand-cyan: #35d0e0;   /* icon strokes, divider glows */
  --teal-700: #0f4c4c;     /* deep teal panel fill */
  --teal-500: #17a398;     /* "after / positive" accent */
  --gold-500: #f5b923;     /* primary attention color */
  --gold-300: #ffd76a;     /* gold gradient highlight */
  --gold-gradient: linear-gradient(180deg, #ffd76a 0%, #f5b923 45%, #c98d1a 100%); /* @kind color */

  /* Semantic */
  --danger-600: #c22f3e;   /* "before / problem" red */
  --danger-500: #e04250;
  --success-500: #21b573;  /* checkmark green */
  --whatsapp: #25d366;

  /* Ink */
  --white: #ffffff;
  --ink-100: #eaf1f8;      /* body text on navy */
  --ink-300: #b9c7d6;      /* secondary text */
  --ink-500: #7e8ea0;      /* muted / captions */
  --logo-gray: #6d6e71;    /* wordmark gray (light bg only) */

  /* Semantic aliases */
  --surface-page: var(--navy-900);
  --surface-panel: var(--navy-800);
  --surface-card: rgba(16, 32, 54, 0.82);
  --border-card: rgba(53, 208, 224, 0.45);
  --border-gold: rgba(245, 185, 35, 0.65);
  --text-heading: var(--white);
  --text-body: var(--ink-100);
  --text-muted: var(--ink-300);
  --text-accent: var(--gold-500);
  --text-link: var(--brand-blue);
}