:root{
  --brand-green:#009638;
  --brand-green-dark:#017a3f;
  --brand-green-light:#1bbf5c;
  --ink:#1f1f1f;
  --font-base: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

body {
  font-family: var(--font-base);
}

.contacto-section{
  position: relative;
  padding: 6rem 0 4rem;
  background: transparent;
  overflow: hidden;
}

.contacto-section::before{
  content:"";
  position:absolute; 
  inset:0;
  background: url("../img/ContactoHero.f8fead5afa24.webp") center/cover no-repeat;
  filter: brightness(0.65);
  z-index: 0;
}

.contacto-section::after{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.25);
  z-index: 1;
}

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

.contacto-section .card-like{
  position: relative;
  z-index: 2;
  background: #fff;
}

/* ===== CONTACTO ===== */
.contacto-section{
  background:#fff;
}

/* Título */
.contacto-section .title-brand{
  font-weight: 700;
}

/* Tarjetas (columna info y columna formulario) */
.contacto-section .card-like{
  background:#f7f9f8;
  border-radius:10px;
  box-shadow:0 10px 24px rgba(0,0,0,.08);
}

/* Íconos circulares verdes */
/* fila */
.contacto-line{ align-items:center; gap:12px; }

/* contenedor circular */
.icon-pill{
  flex: 0 0 44px;
  width:44px; height:44px;
  display:flex; align-items:center; justify-content:center;
  background: var(--brand-green);
  color:#fff;
  border-radius:50%;
  box-shadow:0 6px 14px rgba(1,149,63,.20);
}

/* tamaño del glifo Font Awesome */
.icon-pill i{
  font-size:20px; 
  line-height:1; 
}

.icon-pill i::before{ line-height:1; }

/* Inputs */
.contacto-section .form-control{
  border:1px solid #cfd8d3;
  font-size:.95rem;
  background:#fff;
}
.contacto-section .form-control:focus{
  border-color: var(--brand-green);
  box-shadow:0 0 0 .2rem rgba(1,149,63,.15);
}

/* Subtítulo del formulario */
.contacto-section .form-subtitle{
  color: var(--brand-green);
  font-weight:700;
}

/* Botón enviar en verde */
.btn-enviar{
  background: var(--brand-green) !important;
  border:none;
  color:#fff;
  font-weight:700;
  border-radius:8px;
  padding:.7rem 1rem;
  transition: background-color .2s ease, transform .05s ease;
}
.btn-enviar:hover{ background: var(--brand-green-dark) !important; color:#fff; }
.btn-enviar:active{ transform: translateY(1px); }

/* Mapa */
.contacto-section .map-embed{
  border-radius:8px;
  overflow:hidden;
}

/* Ajustes responsivos suaves */
@media (max-width: 991.98px){
  .contacto-section .card-like{ box-shadow:0 6px 18px rgba(0,0,0,.08); }
}