/* ===== Footer Pro (override) ===== */
.footer.footer--pro {
  background: linear-gradient(180deg, #262c33 0%, #1e242b 55%, #171c22 100%);
  color: #cfd6dd;
  padding: 28px 0 12px;
}

.footer--pro .footer__top {
  padding-bottom: 14px;
}

.footer--pro .footer__logo {
  margin-top: 35px;
  width: 120px;
  height: auto;
  display: block;
}

.footer--pro .footer__tagline {
  margin: 10px 0 10px;
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.72);
  max-width: 260px;
}

/* Titulos + subrayado verde */
.footer--pro .footer__title {
  font-size: 18px;
  font-weight: 700;
  color: #e8edf3;
  margin-bottom: 10px;
  position: relative;
  display: inline-block;
}
.footer--pro .footer__title::after {
  content: "";
  display: block;
  margin-top: 6px;
  width: 64px;
  height: 2px;
  background: #1db190;
  border-radius: 10px;
  opacity: 0.95;
}

/* Listas */
.footer--pro .footer__list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.footer--pro .footer__list li {
  margin: 10px 0;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.72);
}
.footer--pro .footer__list a {
  color: rgba(255, 255, 255, 0.78);
  text-decoration: none;
}
.footer--pro .footer__list a:hover {
  color:#1db190;
}

/* Col dividers (solo desktop) */
@media (min-width: 992px) {
  .footer--pro .footer__col--divider {
    border-left: 1px solid rgba(255, 255, 255, 0.08);
  }
  .footer--pro .footer__col {
    padding-left: 28px;
    padding-right: 28px;
  }
  .footer--pro .footer__col:first-child {
    padding-left: 15px;
    border-left: none;
  }
}

/* Social buttons */
.footer--pro .footer__social {
  display: flex;
  gap: 12px;
}
.footer--pro .footer__social-btn {
  width: 44px;
  height: 44px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.08);
  transition:
    transform 0.15s ease,
    background 0.15s ease,
    border-color 0.15s ease;
}
.footer--pro .footer__social-btn svg {
  width: 20px;
  height: 20px;
  fill: rgba(255, 255, 255, 0.75);
}
.footer--pro .footer__social-btn:hover {
  transform: translateY(-1px);
  background: rgba(111, 174, 27, 0.15);
  border-color: rgba(111, 174, 27, 0.45);
}
.footer--pro .footer__social-btn:hover svg {
  fill: #1db190;
}

/* Icon list (Contacto + Confianza) */
.footer--pro .footer__list--icons li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.footer--pro .fi {
  width: 18px;
  height: 18px;
  margin-top: 2px;
  flex: 0 0 18px;
  display: inline-block;
  position: relative;
}
.footer--pro .fi::before {
  content: "";
  position: absolute;
  inset: 0;
  background: #1db190;
  opacity: 0.85;
  border-radius: 4px;
  -webkit-mask: var(--mask) center / contain no-repeat;
  mask: var(--mask) center / contain no-repeat;
}

/* SVG masks via data-uri (simple icons) */
.footer--pro .fi--pin {
  --mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5 7 13 7 13s7-8 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5z'/%3E%3C/svg%3E");
}
.footer--pro .fi--phone {
  --mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8c1.5 3 3.6 5.1 6.6 6.6l2.2-2.2c.3-.3.8-.4 1.2-.2 1 .3 2 .5 3.1.5.7 0 1.3.6 1.3 1.3V21c0 .7-.6 1.3-1.3 1.3C10.6 22.3 1.7 13.4 1.7 2.3 1.7 1.6 2.3 1 3 1h3.4c.7 0 1.3.6 1.3 1.3 0 1.1.2 2.1.5 3.1.1.4 0 .9-.2 1.2l-2.4 2.2z'/%3E%3C/svg%3E");
}
.footer--pro .fi--mail {
  --mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4-8 5L4 8V6l8 5 8-5v2z'/%3E%3C/svg%3E");
}
.footer--pro .fi--truck {
  --mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 6h13v10H3V6zm13 3h3l2 3v4h-5V9zm-9 9a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm10 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4z'/%3E%3C/svg%3E");
}
.footer--pro .fi--card {
  --mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5h18a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2zm0 4h20V7H3v2zm3 7h6v-2H6v2z'/%3E%3C/svg%3E");
}
.footer--pro .fi--swap {
  --mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 7h11l-2-2 1.4-1.4L22.8 9l-5.4 5.4L16 13l2-2H7V7zm10 10H6l2 2-1.4 1.4L1.2 15l5.4-5.4L8 11l-2 2h11v4z'/%3E%3C/svg%3E");
}
.footer--pro .fi--lock {
  --mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1a5 5 0 0 0-5 5v4H6a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-9a2 2 0 0 0-2-2h-1V6a5 5 0 0 0-5-5zm-3 9V6a3 3 0 0 1 6 0v4H9z'/%3E%3C/svg%3E");
}

/* Bottom bar */
.footer--pro .footer__bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  margin-top: 18px;
  padding-top: 18px;
  text-align: center;
}
.footer--pro .footer__bottom p {
  margin: 0;
  color: rgba(255, 255, 255, 0.65);
  font-size: 13px;
}
.footer--pro .footer__admin {
  color: #1db190;
  margin-left: 8px;
  text-decoration: none;
}
.footer--pro .footer__admin:hover {
  text-decoration: underline;
}
/* FIX: títulos y contenido alineados a la izquierda */
.footer.footer--pro .footer__top {
  text-align: left;
}

.footer.footer--pro .footer__widget,
.footer.footer--pro .footer__about {
  text-align: left !important;
}

.footer.footer--pro .footer__title {
  display: block; /* antes inline-block */
  width: 100%;
}

/* =========================
   Marca centrada (solo col 1)
   + responsive
========================= */

/* 1) Columna marca centrada */
.footer--pro .footer__col:first-child .footer__about {
  text-align: center !important;
}

.footer--pro .footer__col:first-child .footer__about__logo {
  display: flex;
  justify-content: center;
}

.footer--pro .footer__col:first-child .footer__logo {
  margin-top: 0; /* sacamos el empuje raro */
  margin-bottom: 14px;
}

.footer--pro .footer__col:first-child .footer__tagline {
  margin-left: auto;
  margin-right: auto;
  max-width: 280px; /* centrado prolijo */
}

/* redes centradas */
.footer--pro .footer__col:first-child .footer__social {
  justify-content: center;
}
/* ===== Footer Pro: mismo ancho + mismo radius que Header Pro ===== */
.footer.footer--pro{
  background: transparent;          /* el fondo pasa al contenedor */
  padding: 16px 0 12px;             /* parecido al header */
}

.footer.footer--pro .container{
  overflow: hidden;
  background: linear-gradient(180deg, #2f6464 0%, #1d3f3f 55%, #171c22 100%);
  border-radius: var(--radius, 12px);   /* mismo radius que header */
  box-shadow: var(--shadow, 0 2px 14px rgba(0,0,0,.06)); /* mismo shadow */
  padding-left: 20px;                   /* mismo padding lateral */
  padding-right: 20px;
  /* bajar contenido del footer */
  padding-top: 28px;   /* subí/bajá este valor */
  padding-bottom: 10px;
}
/* MOBILE: centrar el bloque, pero texto/íconos alineados a la izquierda */
@media (max-width: 991.98px) {
  /* separadores entre columnas en mobile */
  .footer--pro .footer__col--divider {
    border-left: none !important;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
  }

  /* centrar el CONTENEDOR del widget (no el texto) */
  .footer--pro .footer__widget,
  .footer--pro .footer__about {
    text-align: center !important; /* centra el bloque interno (inline-block) */
  }

  /* títulos pueden quedar centrados */
  .footer--pro .footer__title {
    text-align: center !important;
  }
  .footer--pro .footer__title::after {
    margin-left: auto;
    margin-right: auto;
  }

  /* el contenido real: un bloque centrado, pero con texto a la izquierda */
  .footer--pro .footer__list {
    display: inline-block; /* hace que el bloque se pueda centrar */
    text-align: left !important; /* texto alineado a la izquierda */
    margin: 0 auto; /* centra el bloque */
    min-width: 220px; /* opcional: más prolijo */
  }

  /* icon-list: ícono + texto alineados a la izquierda dentro del bloque */
  .footer--pro .footer__list--icons li {
    justify-content: flex-start !important;
  }

  /* marca (logo + redes) sigue centrado */
  .footer--pro .footer__social {
    justify-content: center;
  }
}

@media (max-width: 575.98px) {
  .footer--pro .footer__col:first-child .footer__logo {
    width: 96px;
  }
}
