:root{
  --mavi-accent: #0E6B57;
  --mavi-cta: #0aa17b9e;      /* verde más fuerte */
  --mavi-cta-ink: #06231d;  /* texto oscuro legible */
}
.why-title,
.why-key{
  color: var(--mavi-accent) !important;
}

/* Outline en hero oscuro: más visible */
.btn-outline-light.btn-mavi-outline{
  border-color: rgba(10, 161, 123, 0.48);
  color: #fff;
  background: rgba(10, 161, 122, 0.18); /* verde suave */
}
.btn-outline-light.btn-mavi-outline:hover{
  background: rgba(10,161,122,0.30);
  border-color: rgba(10, 161, 123, 0.69);
  color:#fff;
  text-decoration:none;
}

.btn-mavi{
  background: var(--mavi-cta) !important;
  border-color: var(--mavi-cta) !important;
  color: var(--mavi-cta-ink) !important;
  font-weight: 400;
  box-shadow: 0 10px 26px rgba(10,161,122,0.22);
  color: #ffffff !important;
}

.btn-mavi:hover,
.btn-mavi:focus{
  filter: brightness(0.95);
  color: var(--mavi-cta-ink) !important;
  box-shadow: 0 12px 30px rgba(10,161,122,0.28);
  text-decoration: none;
  color: #ffffff !important;
}


/* HERO background carousel + fade + overlay */
.hero-bg{
  position: relative;
  overflow: hidden;
}
.hero-bg::before{
  content:"";
  position:absolute;
  inset:0;
  background-image: var(--hero-bg);
  background-size: cover;
  background-position: center;
  opacity: 1;
  transition: opacity 1400ms ease-in-out;
  transform: scale(1.02);
}
.hero-bg.is-fading::before{ opacity: 0; }

.hero-bg::after{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(15, 23, 42, var(--hero-overlay, 0.58));
  background: rgba(9, 43, 38, var(--hero-overlay, 0.60)); /* verdoso tipo Formando */
  background: rgba(7, 58, 44, var(--hero-overlay, 0.58));
}


.hero-bg > .container{
  position: relative;
  z-index: 1;
}

/* Hero text (solo si lo quieres blanco) */
.hero-copy,
.hero-copy h1,
.hero-copy p,
.hero-copy .lead{
  color: #fff !important;
}
.hero-copy .text-muted{
  color: rgba(255,255,255,0.86) !important;
}

/* Outline button visible on dark hero */
.hero-copy .btn-brand-outline{
  border-color: rgba(255,255,255,0.9);
  color: #fff;
}
.hero-copy .btn-brand-outline:hover{
  background: rgba(255,255,255,0.12);
  border-color: rgba(255,255,255,0.95);
  color: #fff;
  text-decoration: none;
}

/* Optional: premium glass card if you have one in hero */
.hero-bg .card.hero-card{
  background: rgba(255,255,255,0.88);
  border: 1px solid rgba(255,255,255,0.55);
  backdrop-filter: blur(6px);
  border-radius: 12px;
}

/* Hero text in white (only inside .hero-copy) */
.hero-copy,
.hero-copy h1,
.hero-copy p,
.hero-copy .lead{
  color: #fff !important;
}
.hero-copy .text-muted{
  color: rgba(255,255,255,0.86) !important;
}

/* Outline button visible on dark hero */
.hero-copy .btn-brand-outline{
  border-color: rgba(255,255,255,0.9);
  color: #fff;
}
.hero-copy .btn-brand-outline:hover{
  background: rgba(255,255,255,0.12);
  border-color: rgba(255,255,255,0.95);
  color: #fff;
  text-decoration: none;
}
.hero-right-grey{
  color: #454545;
}