:root{
    --color-primario:#2C3639;
    --color-secundario:#d5cebb;
    --color-terciario:#a27b5c;
    --color-hover:#3b5249;
    --color-blanco:#ffffff;
}

/* GENERALES */

body{
    margin:0;
    padding:0;
    font-family:Arial,sans-serif;
    background-color:#f3f1ec;
    color:var(--color-primario);
}

/* PORTADA */

.portadaCentro{
    position:relative;
    width:100%;
    height:350px;
    overflow:hidden;
}

.portadaCentro img{
    width:100%;
    height:100%;
    object-fit:cover;
    filter:brightness(65%);
}

.contenidoPortada{
    position:absolute;
    top:50%;
    left:8%;
    transform:translateY(-50%);
    color:white;
    max-width:600px;
}

.contenidoPortada h1{
    font-size:55px;
    margin-bottom:20px;
}

.contenidoPortada p{
    font-size:20px;
    line-height:1.6;
}

/* GALERÍA */

.galeriaCentro{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:25px;
    padding:50px 40px;
    background-color:var(--color-secundario);
}

.galeriaCentro img{
    width:260px;
    height:220px;
    object-fit:cover;
    border-radius:18px;
    box-shadow:0 0 12px rgba(0,0,0,0.12);
    transition:0.3s ease;
}

.galeriaCentro img:hover{
    transform:translateY(-8px);
    box-shadow:0 10px 25px rgba(0,0,0,0.18);
}

/* CONTENIDO */

.contenedorCentro{
    padding:60px 20px;
}

.cajaTexto{
    max-width:1000px;
    margin:auto;
    background-color:white;
    border-radius:20px;
    padding:45px;
    box-shadow:0 0 15px rgba(0,0,0,0.08);
}

.cajaTexto h2{
    font-size:38px;
    margin-top:0;
    margin-bottom:25px;
    color:var(--color-terciario);
}

.cajaTexto p{
    font-size:18px;
    line-height:1.9;
    margin-bottom:25px;
}

/* CAJA EXTRA */

.infoExtra{
    margin-top:40px;
    background-color:#f7f5f0;
    border-left:6px solid var(--color-terciario);
    padding:25px;
    border-radius:12px;
}

.infoExtra h3{
    margin-top:0;
    font-size:28px;
    color:var(--color-hover);
}

.infoExtra p{
    margin-bottom:0;
}

/* RESPONSIVE */

@media(max-width:900px){

    .contenidoPortada h1{
        font-size:42px;
    }

    .contenidoPortada p{
        font-size:18px;
    }

    .cajaTexto{
        padding:30px;
    }

}

@media(max-width:700px){

    .portadaCentro{
        height:280px;
    }

    .contenidoPortada{
        left:5%;
        max-width:90%;
    }

    .contenidoPortada h1{
        font-size:34px;
    }

    .contenidoPortada p{
        font-size:16px;
    }

    .galeriaCentro{
        padding:30px 20px;
    }

    .galeriaCentro img{
        width:100%;
        height:230px;
    }

    .cajaTexto h2{
        font-size:28px;
    }

    .cajaTexto p{
        font-size:16px;
    }

}