/* Ovasyte brand — #002395 (blue) · #F58220 (orange) */
:root {
  --ov-blue: #002395;
  --ov-orange: #f58220;
  --ov-blue-hover: #001a70;
  --ov-blue-active: #001560;
  --ov-orange-hover: #e07718;
  --ov-body: #2a3358;
  --ov-muted: rgba(0, 35, 149, 0.62);
  --ov-soft-bg: #f0f3fb;

  --bs-primary: #002395;
  --bs-primary-rgb: 0, 35, 149;
  --bs-warning: #f58220;
  --bs-warning-rgb: 245, 130, 32;

  --bs-body-color: var(--ov-body);
  --bs-body-bg: #ffffff;
  --bs-heading-color: #002395;
  --bs-secondary-color: var(--ov-muted);
  --bs-tertiary-color: rgba(0, 35, 149, 0.48);
  --bs-emphasis-color: #002395;

  --bs-link-color: #002395;
  --bs-link-hover-color: #f58220;
  --bs-focus-ring-color: rgba(0, 35, 149, 0.35);

  --bs-border-color: rgba(0, 35, 149, 0.12);
  --bs-light: #f5f7fd;
  --bs-light-rgb: 245, 247, 253;
}

/* ---------- Buttons ---------- */
.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--ov-blue);
  --bs-btn-border-color: var(--ov-blue);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--ov-blue-hover);
  --bs-btn-hover-border-color: var(--ov-blue-hover);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--ov-blue-active);
  --bs-btn-active-border-color: var(--ov-blue-active);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--ov-blue);
  --bs-btn-disabled-border-color: var(--ov-blue);
}

.btn-warning {
  --bs-btn-color: var(--ov-blue);
  --bs-btn-bg: var(--ov-orange);
  --bs-btn-border-color: var(--ov-orange);
  --bs-btn-hover-color: var(--ov-blue-active);
  --bs-btn-hover-bg: var(--ov-orange-hover);
  --bs-btn-hover-border-color: var(--ov-orange-hover);
  --bs-btn-active-color: var(--ov-blue-active);
  --bs-btn-active-bg: var(--ov-orange-hover);
  --bs-btn-active-border-color: var(--ov-orange-hover);
}

.btn-light {
  --bs-btn-color: var(--ov-blue);
  --bs-btn-bg: #fff;
  --bs-btn-border-color: #fff;
  --bs-btn-hover-color: var(--ov-blue);
  --bs-btn-hover-bg: rgba(245, 130, 32, 0.2);
  --bs-btn-hover-border-color: #fff;
}

.btn-outline-primary {
  --bs-btn-color: var(--ov-blue);
  --bs-btn-border-color: var(--ov-blue);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--ov-blue);
  --bs-btn-hover-border-color: var(--ov-blue);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--ov-blue-hover);
  --bs-btn-active-border-color: var(--ov-blue-hover);
}

/* Elixir theme ships hard-coded button colours — enforce brand blue & orange */
.btn.btn-primary,
a.btn.btn-primary,
button.btn.btn-primary {
  background-color: #002395 !important;
  border-color: #002395 !important;
  color: #fff !important;
}

.btn.btn-primary:hover,
.btn.btn-primary:focus,
a.btn.btn-primary:hover {
  background-color: #001a70 !important;
  border-color: #001a70 !important;
  color: #fff !important;
}

.btn.btn-primary:active,
.btn.btn-primary.active {
  background-color: #001560 !important;
  border-color: #001560 !important;
}

.btn.btn-warning,
a.btn.btn-warning,
button.btn.btn-warning {
  background-color: #f58220 !important;
  border-color: #f58220 !important;
  color: #002395 !important;
}

.btn.btn-warning:hover,
.btn.btn-warning:focus,
a.btn.btn-warning:hover {
  background-color: #e07718 !important;
  border-color: #e07718 !important;
  color: #001560 !important;
}

.btn.btn-outline-primary,
a.btn.btn-outline-primary {
  background-color: transparent !important;
  color: #002395 !important;
  border-color: #002395 !important;
  border-width: 2px;
}

.btn.btn-outline-primary:hover,
a.btn.btn-outline-primary:hover {
  background-color: #002395 !important;
  border-color: #002395 !important;
  color: #fff !important;
}

.btn.btn-light,
a.btn.btn-light {
  background-color: #fff !important;
  border-color: #fff !important;
  color: #002395 !important;
}

.btn.btn-light:hover {
  background-color: #f0f3fb !important;
  border-color: #fff !important;
  color: #002395 !important;
}

/* ---------- Core text ---------- */
body {
  color: var(--ov-body);
}

main.main h1:not(.text-white),
main.main h2:not(.text-white),
main.main h3:not(.text-white),
main.main h4:not(.text-white),
main.main h5:not(.text-white),
main.main h6:not(.text-white) {
  color: var(--ov-blue);
}

.text-muted {
  color: var(--ov-muted) !important;
}

/* Elixir muted utility */
.text-500 {
  color: var(--ov-muted) !important;
}

/* ---------- Primary / warning utilities ---------- */
.text-primary {
  color: var(--ov-blue) !important;
}

.text-warning {
  color: var(--ov-orange) !important;
}

.bg-primary {
  background-color: var(--ov-blue) !important;
}

.bg-warning {
  background-color: var(--ov-orange) !important;
}

/* Light gray → soft brand tint */
.bg-100,
.bg-light {
  background-color: var(--ov-soft-bg) !important;
}

.border-primary {
  border-color: var(--ov-blue) !important;
}

/* ---------- Links in page content ---------- */
main.main a:not(.btn):not(.dropdown-item):not(.venobox):not(.text-white) {
  color: var(--ov-blue);
  text-underline-offset: 0.15em;
}

main.main a:not(.btn):not(.dropdown-item):not(.venobox):not(.text-white):hover,
main.main a:not(.btn):not(.dropdown-item):not(.venobox):not(.text-white):focus {
  color: var(--ov-orange);
}

/* ---------- Navbar ---------- */
.navbar-elixir {
  background-color: #fff !important;
  opacity: 1 !important;
  backdrop-filter: none !important;
  box-shadow: 0 1px 0 rgba(0, 35, 149, 0.08);
}

.navbar-elixir .navbar {
  background-color: #fff !important;
}

.navbar-elixir .navbar-collapse {
  background-color: #fff;
}

.navbar-brand img {
  max-height: 42px;
  width: auto;
}

.ovasyte-brand-text {
  font-family: "Montserrat", system-ui, sans-serif;
  font-weight: 700;
  /* letter-spacing: 0.02em; */
  color: var(--ov-blue);
}

.navbar-elixir .navbar-nav .nav-link {
  color: rgba(0, 35, 149, 0.88);
}

.navbar-elixir .navbar-nav .nav-link:hover,
.navbar-elixir .navbar-nav .nav-link:focus {
  color: var(--ov-orange);
}

.navbar-elixir .navbar-nav .nav-link.dropdown-toggle.show {
  color: var(--ov-orange);
}

/* ---------- Decorative (Elixir) ---------- */
.bg-o-brand {
  background-color: var(--ov-blue) !important;
}

.bg-holder {
  background-size: cover;
  background-position: center;
}

.ring-icon {
  border-color: var(--ov-orange) !important;
  color: var(--ov-blue);
}

/* Welcome icons - balanced text alignment */
.ring-icon + h3 + p {
  text-align: left;
  hyphens: auto;
}

hr.short {
  border-color: var(--ov-orange);
  opacity: 1;
}

.elixir-caret {
  border-color: transparent transparent transparent var(--ov-orange) !important;
}

.footer .btn-warning span.text-primary,
.ov-footer-band .btn-warning span.text-primary {
  color: var(--ov-blue) !important;
}

/* ---------- Forms ---------- */
.php-email-form .form-control,
.php-email-form .form-select {
  border-color: rgba(0, 35, 149, 0.2);
  border-radius: 0.25rem;
}

.php-email-form .form-control:focus,
.php-email-form .form-select:focus {
  border-color: var(--ov-orange);
  box-shadow: 0 0 0 0.2rem rgba(245, 130, 32, 0.2);
}

.modal-content .form-label.text-primary {
  color: var(--ov-blue) !important;
}

/* ---------- Gallery / carousel ---------- */
.owl-carousel .owl-item img {
  border-radius: 0.5rem;
}

/* Hero: blendy mesh image + soft blue→orange veil for brand tie-in */
.hero-section {
  position: relative;
  isolation: isolate;
}

.hero-section .hero-carousel {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.hero-section .hero-carousel .hero-item {
  position: relative;
  height: 100vh;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.hero-section .hero-carousel .hero-item::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    118deg,
    rgba(0, 35, 149, 0.78) 0%,
    rgba(0, 35, 149, 0.42) 60%,
    rgba(245, 130, 32, 0.28) 70%,
    rgba(0, 21, 96, 0.64) 100%
  );
  pointer-events: none;
}

.hero-section .hero-carousel .owl-nav {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  z-index: 3;
  display: flex;
  justify-content: space-between;
  pointer-events: none;
}

.hero-section .hero-carousel .owl-nav button {
  pointer-events: auto;
  background: rgba(255, 255, 255, 0.2) !important;
  color: #fff !important;
  border: none;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  margin: 0 10px;
  transition: all 0.3s ease;
}

.hero-section .hero-carousel .owl-nav button:hover {
  background: rgba(245, 130, 32, 0.8) !important;
}

.hero-section .hero-carousel .owl-nav button span {
  font-size: 24px !important;
}

.hero-section .hero-carousel .owl-dots {
  position: absolute;
  bottom: 30px;
  left: 0;
  right: 0;
  z-index: 3;
}

.hero-section .hero-carousel .owl-dots .owl-dot span {
  background: rgba(255, 255, 255, 0.5) !important;
  width: 12px;
  height: 12px;
  margin: 0 6px;
}

.hero-section .hero-carousel .owl-dots .owl-dot.active span,
.hero-section .hero-carousel .owl-dots .owl-dot:hover span {
  background: rgba(245, 130, 32, 0.9) !important;
}

.hero-section .container {
  position: relative;
  z-index: 2;
}

.hero-section .btn-primary {
  box-shadow: 0 4px 18px rgba(0, 35, 149, 0.45);
}

.hero-section .btn-warning {
  box-shadow: 0 4px 18px rgba(245, 130, 32, 0.45);
}


.section-gallery {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

/* ---------- Feature cards ---------- */
.ov-feature-card h3,
.ecosystem h3 {
  /* letter-spacing: -0.02em; */
  word-spacing: 0.05em;
}

/* Fix spacing for h3.h6 utility headings in feature cards */
.ov-feature-card h3.h6,
.ov-feature-card h3.text-primary {
  /* letter-spacing: 1em; */
  word-spacing: normal;
}

.ov-feature-card {
  border: 1px solid rgba(0, 35, 149, 0.1);
  border-radius: 0.5rem;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
  height: 100%;
  background: #fff;
}

.ov-feature-card:hover {
  box-shadow: 0 0.75rem 2rem rgba(0, 35, 149, 0.14);
  transform: translateY(-2px);
}

section[id] {
  scroll-margin-top: 6rem;
}

/* ---------- Footer band ---------- */
.ov-footer-band {
  background: linear-gradient(180deg, #001560 0%, #002395 100%);
}

/* ---------- Preloader ---------- */
.preloader .line-scale > div {
  background-color: var(--ov-orange);
}

/* ---------- Nav dropdown ---------- */
.navbar-elixir .dropdown-menu {
  border-radius: 0.35rem;
  border: 1px solid rgba(0, 35, 149, 0.12);
  box-shadow: 0 0.5rem 1.25rem rgba(0, 35, 149, 0.12);
  min-width: 14rem;
}

.navbar-elixir .dropdown-item {
  font-size: 0.95rem;
  padding: 0.45rem 1rem;
  color: rgba(0, 35, 149, 0.9);
}

.navbar-elixir .dropdown-item:hover,
.navbar-elixir .dropdown-item:focus {
  background-color: rgba(245, 130, 32, 0.12);
  color: var(--ov-blue);
}

@media (min-width: 992px) {
  .navbar-elixir .dropdown-menu {
    margin-top: 0.35rem;
  }
}

/* ---------- Stats / emphasis on blue sections ---------- */
.bg-primary .text-white {
  color: #fff !important;
}

/* Subtle borders on neutral cards / steps */
main.main .border:not(.border-0):not(.border-primary):not(.border-warning) {
  border-color: rgba(0, 35, 149, 0.14) !important;
}