@import url("https://fonts.googleapis.com/css?family=Lato:300,400,700,900");

button,
hr,
input {
  overflow: visible;
}

progress,
sub,
sup {
  vertical-align: baseline;
}

[type=checkbox],
[type=radio],
legend {
  padding: 0;
  box-sizing: border-box;
}

html,
legend {
  box-sizing: border-box;
}

details,
img,
main,
picture {
  display: block;
}

.boton-amarillo,
.boton-amarillo-block {
  background-color: #e08709;
  text-decoration: none;
}

.boton-amarillo,
a {
  text-decoration: none;
}

.dark-mode .anuncio .icono,
.dark-mode .resumen-propiedad .icono,
.dark-mode-boton {
  filter: invert(100%);
}

.header.inicio,
.imagen-contacto {
  background-position: 50%;
  background-size: cover;
}

html {
  -webkit-text-size-adjust: 100%;
  line-height: 1.15;
}

hr {
  box-sizing: content-box;
  height: 0;
}

code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

a {
  background-color: transparent;
}

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
}

b,
strong {
  font-weight: bolder;
}

small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

img {
  border-style: none;
}

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}

body,
h1,
h2,
h3 {
  font-family: Lato, sans-serif;
}

button,
select {
  text-transform: none;
}

[type=button],
[type=reset],
[type=submit],
button {
  -webkit-appearance: button;
}

[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner,
button::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring,
button:-moz-focusring {
  outline: ButtonText dotted 1px;
}

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

legend {
  color: inherit;
  display: table;
  max-width: 100%;
  white-space: normal;
}

textarea {
  overflow: auto;
}

/* Botones / clases comunes */
.boton-amarillo,
.boton-amarillo-block,
.boton-rojo-block,
.boton-verde,
.boton-verde-block {
  border: none;
  padding: 1rem 3rem;
  text-align: center;
  color: #fff;
  font-weight: 700;
  margin-top: 2.5rem;
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

[type=search] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

.precio,
.testimonial {
  font-size: 2.4rem;
}

summary {
  display: list-item;
}

[hidden],
template {
  display: none;
}

html {
  font-size: 62.5%;
}

*,
:after,
:before {
  box-sizing: inherit;
}

body {
  margin: 0;
  font-size: 1.6rem;
  line-height: 1.8;
}

p {
  color: #000;
  font-size: 2rem;
}

.contenedor {
  margin: 0 auto;
  max-width: 100rem;
  width: 95%;
}

img,
picture {
  width: 100%;
}

h1,
h2,
h3 {
  font-weight: 300;
  margin: 2.5rem 0;
  text-align: center;
}

h1 {
  font-size: 3.8rem;
}

h2 {
  font-size: 3.4rem;
}

h3 {
  font-size: 3rem;
}

h4 {
  font-size: 2.6rem;
}

.seccion {
  margin-bottom: 2.5rem;
  margin-top: 2.5rem;
}

.entrada-blog:last-of-type,
.footer {
  margin-bottom: 0;
}

.contenido-centrado {
  max-width: 60rem;
}

.alinear-derecha {
  display: flex;
  justify-content: end;
}

.w-100 {
  width: 100%;
}

.boton-amarillo {
  display: inline-block;
}

.boton-amarillo-block:hover,
.boton-amarillo:hover {
  background-color: #c77808;
  cursor: pointer;
}

.boton-amarillo-block {
  display: block;
}

.boton-verde {
  background-color: #71b100;
  display: inline-block;
  text-decoration: none;
}

.boton-rojo-block,
.boton-verde-block,
.navegacion a {
  display: block;
  text-decoration: none;
}

.boton-verde-block:hover,
.boton-verde:hover {
  background-color: #619800;
  cursor: pointer;
}

.boton-rojo-block {
  background-color: #bd0707;
  width: 100%;
}

.boton-rojo-block:hover {
  background-color: #a40606;
  cursor: pointer;
}

.boton-verde-block {
  background-color: #71b100;
}

.dark-mode .anuncio .precio,
.dark-mode .resumen-propiedad .precio,
.precio {
  color: #71b100;
}

.dark-mode {
  background-color: #1a1a1a;
}

.dark-mode .texto-nosotros blockquote,
.dark-mode p,
.dark-mode table.propiedades,
.dark-mode table.propiedades td,
.dark-mode table.propiedades th,
table.propiedades th {
  color: #fff;
}

.dark-mode .formulario label,
.dark-mode .formulario legend,
.dark-mode .formulario p,
.dark-mode a,
.dark-mode h1,
.dark-mode h2,
.dark-mode h3,
.dark-mode h4 {
  color: #e1e1e1;
}

.dark-mode .anuncio,
.dark-mode .resumen-propiedad {
  background-color: #333;
  border: 1px solid #333;
  padding: 1rem;
}

.dark-mode .contenido-centrado picture {
  padding-bottom: 1rem;
}

.dark-mode .formulario input:not([type=submit]),
.dark-mode .formulario select,
.dark-mode .formulario textarea {
  background-color: #333;
  border: 1px solid #333;
  color: #fff;
}

.no-webp .inicio {
  background-image: url(../img/header.jpg);
}

.webp .inicio {
  background-image: url(../img/header.webp);
}

.header {
  background-color: #333;
  padding: 1rem 0 3rem;
}

.contenido-header {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.contenido-header h1 {
  color: #fff;
  font-weight: 700;
  line-height: 2;
  max-width: 60rem;
  text-align: left;
}

.alerta,
.icono,
.navegacion a {
  text-align: center;
}

.footer {
  background-color: #333;
  padding: 2.5rem 0;
}

.anuncio,
.dark-mode-boton,
.entrada-blog {
  margin-bottom: 2rem;
}

.footer .contenido-footer {
  padding-top: 2.5rem;
}

.navegacion {
  height: 0;
  opacity: 0;
  transition: visibility 0.3s ease-in-out, opacity 0.5s linear, height 0.5s linear;
  visibility: hidden;
}

.navegacion.mostrar {
  height: auto;
  opacity: 1;
  visibility: visible;
}

.footer .copyright {
  color: #fff;
  text-align: center;
}

.derecha {
  align-items: center;
  display: flex;
  flex-direction: column;
}

.dark-mode-boton {
  margin-top: 3rem;
  width: 3rem;
}

.dark-mode-boton:hover {
  cursor: pointer;
}

.barra {
  align-items: center;
  display: flex;
  flex-direction: column;
  padding-top: 3rem;
}

.navegacion a {
  color: #fff;
  font-size: 2.2rem;
}

.movil-menu img {
  width: 5rem;
  cursor: pointer;
}

.icono img {
  height: 10rem;
}

.icono h3 {
  text-transform: uppercase;
}

.anuncio {
  background-color: #eee;
  border: 1px solid #e1e1e1;
  max-width: 340px;
}

.contenido-anuncio {
  padding: 2rem;
}

.contenido-anuncio h3,
.contenido-anuncio p {
  margin: 0;
}

.iconos-caracteristicas {
  display: flex;
  list-style: none;
  max-width: 40rem;
  padding: 0;
}

.iconos-caracteristicas .icono {
width: 4rem;
}

.iconos-caracteristicas li {
  display: flex;
  flex: 1;
}

.iconos-caracteristicas li img {
  flex: 0 0 2px;
  margin-right: 1rem;
}

.iconos-caracteristicas li p {
  font-weight: 900;
}

.no-webp .imagen-contacto {
  background-image: url(../img/encuentra.jpg);
}

.webp .imagen-contacto {
  background-image: url(../img/encuentra.webp);
}

.imagen-contacto {
  align-items: center;
  display: flex;
  flex-direction: column;
  padding: 10rem 0;
}

.imagen-contacto h2 {
  color: #fff;
  font-size: 3rem;
  font-weight: 900;
}

.alerta,
.formulario label {
  font-weight: 700;
  text-transform: uppercase;
}

.imagen-contacto p {
  color: #fff;
  font-size: 1.8rem;
}

.informacion-meta span {
  color: #e08709;
}

.texto-entrada a {
  color: #000;
  display: block;
  margin-top: 2rem;
}

.texto-entrada h4 {
  line-height: 1.4;
  margin: 0;
}

.texto-entrada h4:after {
  background-color: #71b100;
  content: "";
  display: block;
  height: 0.5rem;
  margin-top: 1rem;
  width: 15rem;
}

.testimonial {
  background-color: #71b100;
  border-radius: 2rem;
  color: #fff;
  padding: 2rem;
}

.testimonial blockquote {
  padding-left: 5rem;
  position: relative;
}

.testimonial blockquote:before {
  background-image: url(../img/comilla.svg);
  background-repeat: no-repeat;
  content: "";
  display: block;
  height: 8rem;
  left: -2rem;
  position: absolute;
  width: 6rem;
}

.testimonial p {
  color: #fff;
  text-align: right;
}

.formulario p {
  color: #333;
  font-size: 1.4rem;
  margin: 2rem 0 0;
}

.formulario legend {
  color: #333;
  font-size: 2rem;
}

.formulario label {
  display: block;
}

.formulario input:not([type=submit]),
.formulario select,
.formulario textarea {
  background-color: #fff;
  border: 1px solid #e1e1e1;
  border-radius: 1rem;
  display: block;
  margin-bottom: 2rem;
  padding: 1rem;
  width: 100%;
}

.formulario textarea {
  height: 20rem;
}

.formulario .forma-contacto {
  align-items: center;
  display: flex;
  justify-content: space-between;
  max-width: 30rem;
}

.formulario input[type=radio] {
  margin: 0;
  width: auto;
}

@media (min-width: 768px) {
  .header.inicio,
  .header.inicio .contenido-header {
    height: 70rem;
  }

  .derecha {
    align-items: flex-end;
  }

  .dark-mode-boton,
  .texto-entrada a {
    margin-top: 0;
  }

  .barra {
    align-items: flex-end;
    flex-direction: row;
    justify-content: space-between;
  }

  .navegacion {
    align-items: center;
    display: flex;
    opacity: 1;
    visibility: visible;
  }

  .navegacion a {
    font-size: 1.8rem;
    margin-right: 2rem;
  }

  .navegacion a:last-of-type {
    margin-right: 0;
  }

  .movil-menu {
    display: none;
  }

  .contenedor-anuncios,
  .iconos-nosotros {
    display: grid;
    gap: 2rem;
    grid-template-columns: repeat(3, 1fr);
  }

  .seccion-inferior {
    -moz-column-gap: 2rem;
    column-gap: 2rem;
    display: grid;
    grid-template-columns: 2fr 1fr;
  }

  .entrada-blog {
    -moz-column-gap: 2rem;
    column-gap: 2rem;
    display: grid;
    grid-template-columns: 1fr 2fr;
  }

  .contenido-nosotros {
    align-items: center;
    display: grid;
    gap: 2rem;
    grid-template-columns: repeat(2, 1fr);
  }
}

.texto-nosotros blockquote {
  font-size: 2.2rem;
  font-weight: 900;
  margin: 3rem 0 0;
  padding-left: 1rem 0 3rem 0;
}

.alerta {
  color: #fff;
  margin: 1rem auto;
  padding: 0.5rem;
  width: 60%;
}

@media (max-width: 768px){
  .alerta {
    width: 90%;
  }
}

.alerta.error {
  background-color: #bd0707;
}

.alerta.exito,
table.propiedades thead {
  background-color: #71b100;
}

table.propiedades {
  border-spacing: 0;
  margin-top: 4rem;
  width: 100%;
}

table.propiedades .imagen-tabla {
  width: 10rem;
}

.imagen-small {
  width: 20rem;
}

.dark-mode table.propiedades,
.dark-mode table.propiedades th,
.dark-mode table.propiedades td {
  color: #fff !important;
}

.dark-mode .resumen-propiedad {
  color: #fff;
}


@media (max-width: 768px) {
  table.propiedades,
  table.propiedades thead,
  table.propiedades tbody,
  table.propiedades th,
  table.propiedades td,
  table.propiedades tr {
    display: block;
    width: 100%;
  }


  table.propiedades thead {
    display: none;
  }

    table.propiedades tr {
    margin-bottom: 2rem;
    border: 1px solid #e1e1e1;
    border-radius: 1rem;
    background-color: #333;
    padding: 1rem;
  }

    /* Cada celda ocupa una línea */
  table.propiedades td {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.8rem 0;
    text-align: left;
    border: none;
    border-bottom: 1px solid #eee;
    color: #fff;
  }

   table.propiedades td:last-child {
    border-bottom: none;
  }

    /* Muestra el nombre de la columna antes del valor */
  table.propiedades td::before {
    content: attr(data-label);
    font-weight: bold;
    color: #fff;
    flex: 1;
  }

    /* Ajustes visuales para botones */
/* Contenedor del td: centrado horizontalmente */
table.propiedades td[data-label="Acciones"],
table.propiedades td:last-child {
  text-align: center; /* centra los botones */
}

.boton-rojo-block,
.boton-amarillo-block {
  display: inline-flex;          /* convierte el botón en flex contenedor */
  justify-content: center;       /* centra horizontalmente */
  align-items: center;           /* centra verticalmente */
  width: 12rem;                  /* mismo ancho */
  height: 4rem;                  /* misma altura */
  padding: 0 3rem;               /* espacio interno horizontal */
  margin: 0 0.5rem;              /* separa los botones */
  text-align: center;            /* por si acaso */
  white-space: nowrap;           /* evita saltos de línea */
  box-sizing: border-box;
}



    /* Imagen adaptativa */
  table.propiedades .imagen-tabla {
    width: 50%;
    height: auto;
    border-radius: 0.5rem;
  }
}

















   


/*# sourceMappingURL=app.css.map */