.fondo {
  background: url('@/Images/Cotizar/fondo.png') no-repeat;
  background-size: cover;
}

.contenedor-flex {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-around;
}

.card-container {
  max-width: 850px;
  width: 100%;
  height: auto;
  background-color: #ffffff;
  margin: 50px 0 36px;
}

.titulo {
  width: 321px;
  text-align: start;
  color: #00537d;
  font-size: 60px;
  line-height: 60px;
  white-space: pre-line;
}

.titulo span {
  color: #00537d;
  /*font-size: 50px;*/
  font-family: AvenirBold, sans-serif;
  font-weight: bold;
  line-height: 60px;
  text-align: center;
}

.texto-part1 {
  color: #00537d;
  font-family: AvenirBold, sans-serif;
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-align: start;
  white-space: pre-line;
}

.texto-part1 .verde {
  color: #03a591;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.texto-part1 span {
  color: #00537d;
  font-size: 16px;
  font-style: normal;
  font-weight: bolder;
  line-height: normal;
  white-space: pre-line;
}

.letras-azules {
  color: #0097d5;
  text-align: start;
  font-size: 40px;
  font-style: normal;
  font-weight: 800;
  line-height: 30px;
}

.letras-azules p {
  color: #01558c;
  font-size: 20px;
  font-weight: 600;
}

.texto-descargar {
  color: #01558c;
  font-size: 18px;
  font-weight: bold;
}

.texto-descargar span {
  color: #03a591;
  font-weight: 900;
}

.boton-descargar {
  height: 30px;
  margin-right: 20px;
  background-color: #00a490;
  padding: 3px 12px;
  border-radius: 10px;
  color: white;
  text-decoration: none;
}

.form-container {
  max-width: 300px;
  width: 100%;
  gap: 20px;
}

/*para los input*/
.input {
  border-radius: 8px;
  border: 2px solid #b4b2b2;
  max-width: 300px;
  width: 100%;
  height: 40px;
  grid-area: input;
}

.select-icono {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 30px; /* Espacio para el icono */
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down"><polyline points="6 9 12 15 18 9"></polyline></svg>');
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 16px 16px;
}

.inp2 {
  /*margin: 15px 0 15px 0;*/
  /*max-width: 186px;*/
  width: 100%;
}

.doble {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.div-btn {
  display: flex;
  justify-content: center;
  align-items: center;
}

.btn-cotizar {
  width: 100%;
  background-color: #f07f1e;
  color: #fff;
  cursor: pointer;
  font-weight: 500;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50px;
}

select {
  border-radius: 8px;
  border: 2px solid #acacac;
  opacity: 0;
  font-size: 15px;
  padding: 0 0 0 15px;
}

/*Efecto input label*/
.label {
  display: grid;
  grid-template-areas: 'input';
}

.label_name {
  grid-area: input;
  z-index: 100;
  width: max-content;
  padding: 0 12px;
  align-self: center;
  height: 100%;
  display: flex;
  align-items: center;
  transition: transform 0.2s;
}

.input:where(:focus, :not(:placeholder-shown)) + .label_name {
  transform: translateX(-10%) translateY(-73%) scale(0.8);
}

@media (max-width: 700px) {
  .contenedor-flex {
    flex-direction: column;
  }
  .form-container {
    max-width: 321px;
  }
}