/* ZEODEC approved accent layer.
   Keeps the established corporate palette intact while introducing
   the shared product-family colors on selected brand details only. */

:root {
  --zeodec-teal: #39AB93;
  --zeodec-blue: #3987F6;
  --zeodec-green: #39B86A;
  --zeodec-amber: #E49A28;
  --zeodec-red: #E05252;
  --zeodec-purple: #7656D6;
}

/* Selected primary marketing actions only. */
.hero-actions .button.primary {
  background: var(--zeodec-teal);
  color: #0A0A0A;
}

.hero-actions .button.primary:hover {
  background: #2D8E7A;
}

/* Preserve the existing diagonal geometry; change color only. */
.header-bars-top .bar-1,
.header-bars-bottom .bar-1 {
  background: var(--zeodec-teal);
}

.header-bars-top .bar-2,
.header-bars-bottom .bar-2 {
  background: var(--zeodec-blue);
}

.header-bars-top .bar-3,
.header-bars-bottom .bar-3 {
  background: var(--zeodec-amber);
}

.header-bars-top .bar-4,
.header-bars-bottom .bar-4 {
  background: var(--zeodec-purple);
}