*{margin:0;padding:0;box-sizing:border-box}
body{
font-family:Arial,sans-serif;
background:#080b12;
color:#fff;
position:relative;
}

body::before{
content:"";
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background-image:url("../imagenes/foto3.jpg");
background-size:cover;
background-position:center;
filter:blur(5px);
transform:scale(1.05);
opacity:0.60;
z-index:0;
}

body::after{
content:"";
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(8,11,18,0.35);
z-index:0;
}

.page{
position:relative;
z-index:1;
}
.page{max-width:1200px;margin:0 auto;padding:50px 30px 70px}
.header{text-align:center;margin-bottom:50px}
.logo{font-size:48px;font-weight:700;margin-bottom:35px}.logo span{font-size:30px}
h1{font-size:56px;margin-bottom:15px}.header p{font-size:20px;opacity:.8}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:50px}
.photo{display:block;width:100%;height:260px;border-radius:14px;overflow:hidden;background:#151b27}
.photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}
.photo:hover img{transform:scale(1.04)}
.placeholder{display:flex;align-items:center;justify-content:center;color:#8b93a3;font-size:20px;border:1px solid #273044}
.btn{display:block;width:max-content;margin:0 auto;padding:14px 30px;border:2px solid #fff;border-radius:30px;color:#fff;text-decoration:none}
.btn:hover{background:#fff;color:#111}
@media(max-width:800px){.gallery{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.gallery{grid-template-columns:1fr}.page{padding:35px 18px}.photo{height:240px}h1{font-size:44px}}

.photo.small img {
    width: 60%;
    height: auto;
    object-fit: contain;
    display: block;
    margin: auto;
}

.photo img{
    width:100%;
    height:100%;
    object-fit:cover;
}