/* =========================================================
   Moonshape Soluciones Digitales — Brand overrides
   Paleta: Verde #42E57D (primario) · Morado #4900FB (secundario)
           Azul marino #111357 (base) · Off-white #F3F5FE
   Cargado DESPUÉS de style.css y responsive.css.
   ========================================================= */
:root {
  --ms-green: #42E57D;
  --ms-green-dark: #22C763;
  --ms-green-light: #7DF0A6;
  --ms-purple: #4900FB;
  --ms-navy: #111357;
  --ms-offwhite: #F3F5FE;
}

/* Selección de texto */
::selection { background: var(--ms-green); color: var(--ms-navy); }
::-moz-selection { background: var(--ms-green); color: var(--ms-navy); }

/* Botones del template: hover en verde de marca con texto navy (mejor contraste) */
.btn-five:hover,
.btn-seventeen:hover {
  background: var(--ms-green) !important;
  border-color: var(--ms-green) !important;
  color: var(--ms-navy) !important;
}

/* CTA "Request A Quote" del hero */
.hero-banner-seven .quote-text:hover { color: var(--ms-green); }

/* Cuando el verde se usa como FONDO (no como texto), forzar texto navy legible */
.btn-eleven.style-two,
.btn-eleven.style-two:hover {
  color: var(--ms-navy) !important;
}

/* Iconos sociales y enlaces con hover de marca */
.social-icon a:hover { color: var(--ms-green); }

/* Botón hamburguesa del sidenav */
.sidenavbtn:hover {
  background: var(--ms-green) !important;
  color: var(--ms-navy) !important;
}

/* Logo del header: alto consistente y nítido */
.theme-main-menu .logo img,
.sidebar-nav .logo img { max-height: 42px; width: auto; }
.footer-two .footer-logo img { max-height: 40px; width: auto; }
.footer-one .footer-intro .logo img { max-width: 200px; height: auto; }

/* Marca de selección en formularios y foco */
.form-style-one input:focus,
.form-style-one textarea:focus { border-color: var(--ms-green); }

/* Scroll-to-top con color de marca */
.scroll-top { background: var(--ms-green); color: var(--ms-navy); }

/* ---- Portafolio: caption sobre la imagen del proyecto ---- */
.project-block-two .ms-cap {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 28px 30px;
  z-index: 2;
  background: linear-gradient(transparent, rgba(17, 19, 87, 0.92));
  opacity: 0;
  transform: translateY(12px);
  transition: all 0.4s ease;
  pointer-events: none;
}
.project-block-two:hover .ms-cap { opacity: 1; transform: none; }
.project-block-two .ms-cap .title {
  color: #fff; font-weight: 600; font-size: 24px; margin: 0 0 4px;
}
.project-block-two .ms-cap .cat {
  color: var(--ms-green); font-weight: 500; letter-spacing: .5px;
  text-transform: uppercase; font-size: 14px;
}
/* Filtro activo del portafolio en verde de marca */
.filter-nav-one .isotop-menu-wrapper li.is-checked { color: var(--ms-green); }

/* ---- Nosotros ---- */
.ms-about-img { border-radius: 24px; overflow: hidden; }
.ms-about-img img { width: 100%; display: block; }
.ms-founder { border: 2px solid rgba(255,255,255,.08); border-radius: 30px; }
.ms-founder-avatar {
  width: 150px; height: 150px; border-radius: 50%;
  margin: 0 auto 30px; display: block;
  box-shadow: 0 0 0 6px rgba(66,229,125,.15);
}
.ms-founder .role { color: var(--ms-green); font-weight: 500; letter-spacing: .5px; }
.nav-link.active { color: var(--ms-green) !important; }