/* ============================================================
   Variant: Green palette (replaces navy on top of styles.css)
   Load AFTER styles.css. Only overrides design tokens.
   ============================================================ */
:root {
  /* primary swap: navy → deep forest emerald */
  --navy:    #0E3A2A;
  --navy-2:  #155B43;
  --navy-3:  #1E7A5A;
  --ink:     #061F16;
}

/* The benefits section already uses a green radial. Re-tune it so
   the two greens don't blur into each other on the new bg. */
.benefits::before {
  background-image:
    radial-gradient(circle at 90% 10%, rgba(232,163,61,.28), transparent 35%),
    radial-gradient(circle at 0% 90%, rgba(255,255,255,.06),  transparent 40%);
}

/* Final CTA: same idea — keep the warm amber, drop the green glow */
.final-cta::before {
  background:
    radial-gradient(circle at 80% 20%, rgba(232,163,61,.34), transparent 40%),
    radial-gradient(circle at 10% 90%, rgba(255,255,255,.06),  transparent 45%);
}

/* WhatsApp-green dot in the eyebrow still works on white bg, but make
   sure it does not visually merge with the new primary in any context. */