@charset "utf-8";
/* CSS Document */

.region-title {
  font-size: 26px;
 font-weight: bold;
  margin-bottom: 10px;
 color:#6f5745;
}


/* Texto superior tipo etiqueta */
.select-titulo {
  color: #5a4a3c;
  font-weight: 600;
  font-size: 14px;
}

/* Caja contenedora */
.filtro-box {
  background-color: #efece9; /* beige claro */
	border: 1px solid #d9d2cc; /* todo en una sola línea */
  border-radius: 25px;
  color: #6f5745;
}
   
/* Estilo minimalista del select */
.select-minimal {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 6px;
  padding: 6px 28px 6px 10px;
  font-size: 14px;
  background-image: url("data:image/svg+xml;utf8,<svg fill='%2385b02e' height='10' width='10' xmlns='http://www.w3.org/2000/svg'><polygon points='0,0 10,0 5,6'/></svg>");
  background-repeat: no-repeat;
  background-position: right 8px center;
  background-size: 10px;
  cursor: pointer;
}

.select-minimal:focus {
  outline: none;
  border-color: #85b02e;
  box-shadow: none;
}

      /* ====== Imagen con texto superpuesto ====== */
    .destino-img {
      position: relative;
      border-radius: 20px;
      overflow: hidden;
    }

    .destino-img img {
      width: 100%;
      height: 220px;
      object-fit: cover;
      border-radius: 20px;
      transition: transform 0.3s ease;
    }

    .destino-img:hover img {
      transform: scale(1.05);
    }

    .nombre-region {
      position: absolute;
      bottom: 10px;
      left: 10px;
      background-color: rgba(255, 255, 255, 0.85);
      color: #4a3f35;
      padding: 4px 10px;
      border-radius: 20px;
      font-weight: 600;
      font-size: 0.9rem;
      display: flex;
      align-items: center;
      gap: 5px;
    }

    .nombre-region i {
      color: #7db340;
    }

    /* ====== Contenido inferior ====== */
    .info-destino {
      padding-top: 0.7rem;
		color: #5a4a3c;
    }

    .info-destino h5 {
      font-weight: 700;
      font-size: 1.1rem;
      margin-bottom: 0.2rem;
    }

    .info-destino p {
      margin: 0;
      font-size: 0.95rem;
      color: #5a4a3c;
    }

    .como-llegar {
      margin-top: 0.6rem;
      font-weight: 600;
      font-size: 12px;
		 color: #6f5745;
    }

    .iconos-transporte i {
      font-size: 1.1rem;
      margin-right: 8px;
      color: #4a3f35;
		background-color:#6f5745;
		border-radius: 35px 25px;
		padding:5px;
    }

    .iconos-transporte i:hover {
      color: #7db340;
    }

    @media (max-width: 992px) {
      .col-md-3 {
        flex: 0 0 50%;
        max-width: 50%;
      }
    }

    @media (max-width: 576px) {
      .col-md-3 {
        flex: 0 0 100%;
        max-width: 100%;
      }
    }


/* Título con línea animada */
.link-Tit {
  font-size: 24px;
  position: relative;
  display: inline-block; /* ocupa solo el ancho del texto */
  color: #6f5745;
  font-weight: bold;
  text-decoration: none;
  padding-bottom: 8px;
}

/* Línea debajo del texto */
.link-Tit::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 40px; /* línea inicial pequeña */
  height: 6px;
  background-color: #8cc83f;
  transition: width 0.3s ease;
}

/* Animación al hacer hover */
.link-Tit:hover::after {
  width: 100%; /* ahora cubre solo el ancho del texto */
}