/* KOLIVO cash-first visual refresh — deliberately lightweight and reversible. */
:root {
  --kolivo-navy: #172638;
  --kolivo-navy-2: #243a52;
  --kolivo-accent: #d89300;
  --kolivo-surface: #f6f8fb;
  --kolivo-line: #e4e9ef;
}

html,
body,
#root {
  background: #fff !important;
}

/* Remove warm/beige legacy surfaces in favour of cool neutral surfaces. */
.bg-\[\#F5F2EB\],
.bg-\[\#F8F9FA\] {
  background-color: var(--kolivo-surface) !important;
}

/* Make the revenue path visibly primary in the main navigation. */
header a[href="/store"] {
  border-radius: 9999px;
  background: var(--kolivo-navy);
  color: #fff !important;
  padding: 0.55rem 0.9rem;
  box-shadow: 0 6px 18px rgb(23 38 56 / 0.12);
}

header a[href="/store"]:hover {
  background: var(--kolivo-navy-2);
  color: #fff !important;
}

/* Stronger, cleaner cards on the services page without changing its structure. */
.min-h-\[360px\] {
  background: #fff !important;
  border-color: var(--kolivo-line) !important;
  box-shadow: 0 10px 30px rgb(23 38 56 / 0.06);
}

.min-h-\[360px\]:hover {
  border-color: rgb(216 147 0 / 0.45) !important;
  box-shadow: 0 16px 40px rgb(23 38 56 / 0.1);
  transform: translateY(-2px);
}

/* Accent purchase intent while preserving KOLIVO's sober visual language. */
.min-h-\[360px\] button {
  box-shadow: inset 0 -2px 0 rgb(216 147 0 / 0.7);
}

/* Small warm accent only where it helps scanning and conversion. */
a[href="/contact"]:focus-visible,
a[href="/store"]:focus-visible,
button:focus-visible {
  outline: 2px solid var(--kolivo-accent) !important;
  outline-offset: 3px;
}

::selection {
  background: rgb(216 147 0 / 0.2);
  color: var(--kolivo-navy);
}
