/* OpsFlo visual bridge. Tokens sampled from the live 2026-09-28 homepage stylesheet. */
:root {
  --of-ink: #162b29;
  --of-muted: #5e6d67;
  --of-paper: #f5f6f0;
  --of-line: #d8ddd3;
  --of-green: #c6ee8e;
  --of-forest: #122c29;
  --of-white: #fff;
  --of-radius: 4px;
  --of-font: Geist, Arial, sans-serif;
}
html { scroll-behavior: smooth; }
body { color: var(--of-ink); background: var(--of-paper); font-family: var(--of-font); }
body, button, input, select, textarea { font-family: var(--of-font); }
header.fixed, header.sticky {
  background: #112824 !important; color: #fff !important;
  border-bottom: 1px solid #ffffff24 !important; box-shadow: none !important;
}
header.fixed a, header.sticky a { color: #e3eadd; }
header.fixed a:hover, header.sticky a:hover { color: var(--of-green); }
main { background-color: var(--of-paper); }
main h1, main h2, main h3, main h4 { color: var(--of-ink); letter-spacing: -.035em; }
main h1 { font-weight: 560; }
main p { color: inherit; line-height: 1.65; }
main a:not([class*="bg-"]) { color: #31543a; }
main a:not([class*="bg-"]):hover { color: #57774b; }
main section:not([class*="bg-"]) { border-color: var(--of-line); }
main [class*="bg-white"], main [class*="bg-gray-50"], main [class*="bg-gray-100"] {
  background-color: #f8f9f4 !important;
}
main [class*="border-gray"], main [class*="border-[var(--color-gray"] { border-color: var(--of-line) !important; }
main article, main [class*="rounded-3xl"], main [class*="rounded-[24px]"] {
  border-radius: var(--of-radius) !important; box-shadow: 0 10px 28px #172b2410;
}
main button[class*="bg-"] , main a[class*="bg-"] { border-radius: var(--of-radius) !important; }
main button[class*="bg-[var(--color-green"], main a[class*="bg-[var(--color-green"] {
  background: var(--of-green) !important; color: #172d20 !important;
}
main button[class*="bg-[var(--color-navy"], main a[class*="bg-[var(--color-navy"] {
  background: var(--of-forest) !important; color: #f5f7ef !important;
}
main input, main select, main textarea {
  border-color: #cdd7c6 !important; border-radius: 3px !important;
  background-color: #fff; color: var(--of-ink);
}
main input:focus, main select:focus, main textarea:focus { outline: 3px solid #6d9b45; outline-offset: 2px; }
footer { background: #112824 !important; color: #e3eadd !important; border-color: #c6ee8e !important; }
footer p, footer a, footer span { color: inherit; }
footer a:hover { color: var(--of-green) !important; }
@media (max-width: 700px) {
  header.fixed nav, header.sticky nav { background: #16352c !important; }
  main { overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; } }