/* ============================================================
   COLORS — Slybulwark Technologies
   Primary anchored to the LOGO green (sampled: ~#77B043).
   The green ramp holds hue as it darkens (no olive drift);
   dark surfaces are neutral-cool charcoals so the green is the
   single color that carries the brand.
   ============================================================ */
:root {
  /* --- Brand green (primary) — disciplined, hue-stable ramp --- */
  --sly-green-50:  #f4f9ec;
  --sly-green-100: #e6f2d4;
  --sly-green-200: #cfe6ae;
  --sly-green-300: #b0d67f;
  --sly-green-400: #93c657;      /* light accent */
  --sly-green:     #77b043;      /* BASE — matches the logo mark */
  --sly-green-600: #659a37;      /* hover — a true darker green */
  --sly-green-700: #517d2c;      /* pressed / green text on light */
  --sly-green-800: #3f6122;      /* deep */
  --sly-green-900: #2c4318;      /* deepest */
  --sly-green-tint: #eef6e0;     /* pale wash for surfaces */

  /* --- Neutrals / ink (retuned: neutral-cool, purple cast removed) --- */
  --sly-black: #000000;
  --sly-ink-900: #121316;        /* footer */
  --sly-ink-800: #1a1c20;        /* deep section / strong text */
  --sly-ink-700: #202329;        /* navbar */
  --sly-ink-600: #262a30;        /* dark sections */
  --sly-ink-500: #2f333a;        /* raised dark surface */

  /* --- Greys (cool, true neutral — was warm-olive) --- */
  --sly-grey-700: #3a3d42;
  --sly-grey-500: #6b6f76;
  --sly-grey-400: #8b9098;
  --sly-grey-300: #b7bcc2;       /* input / default border */
  --sly-grey-200: #d7dade;
  --sly-grey-100: #eceef0;
  --sly-off-white: #fafbfb;
  --sly-white: #ffffff;

  /* --- Utility / status (functional colors, unchanged) --- */
  --sly-whatsapp: #25d366;
  --sly-phone: #cf0511;
  --sly-danger: #da4342;
  --sly-info: #4ad1e5;

  /* ============ SEMANTIC ALIASES ============ */
  --color-accent: var(--sly-green);
  --color-accent-hover: var(--sly-green-600);
  --color-accent-pressed: var(--sly-green-700);
  --color-on-accent: var(--sly-white);

  --surface-page: var(--sly-white);
  --surface-muted: var(--sly-off-white);
  --surface-card: var(--sly-white);
  --surface-dark: var(--sly-ink-600);
  --surface-darker: var(--sly-ink-900);
  --surface-navbar: var(--sly-ink-700);

  --text-strong: var(--sly-ink-800);
  --text-body: #3d4046;
  --text-muted: var(--sly-grey-500);
  --text-on-dark: var(--sly-white);
  --text-on-dark-muted: rgba(255, 255, 255, 0.72);
  --text-accent: var(--sly-green-700);

  --border-subtle: var(--sly-grey-100);
  --border-default: var(--sly-grey-200);
  --border-input: var(--sly-grey-300);

  --focus-ring: var(--sly-green);
}