body{

margin:0;

padding:40px;

background:#0f0f12;

color:#f2f2f2;

font-family:'Montserrat',sans-serif;

}

.hero{

position:relative;

height:750px;

overflow:hidden;

border-radius:30px;

margin-bottom:40px;

}

.hero-bg{

position:absolute;

width:100%;

height:100%;

display:grid;

grid-template-columns:repeat(4,1fr);

}

.hero-bg img{

width:100%;

height:100%;

object-fit:cover;

filter:
brightness(28%)
grayscale(35%);

}

.hero-content{

position:absolute;

top:0;

left:0;

width:100%;

height:100%;

z-index:2;

display:flex;

flex-direction:column;

justify-content:center;

align-items:center;

background:
linear-gradient(
rgba(5,5,10,0.45),
rgba(5,5,10,0.75)
);

}

.logo{

width:220px;

margin-bottom:20px;

}

h1{

font-size:72px;

letter-spacing:10px;

color:#c9a7f0;

text-align:center;

margin:0;

}

.tagline{

color:#d7d7d7;

margin-top:15px;

}

nav{

margin-top:25px;

}

nav a{

color:white;

padding:14px;

text-decoration:none;

}

section{

background:#1b1b22;

padding:25px;

margin-top:25px;

border-radius:18px;

}

h2{

color:#c9a7f0;

}

/* GALLERY */

.gallery{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:30px;

margin-top:40px;

}

.square{

aspect-ratio:1/1;

overflow:hidden;

border-radius:20px;

}

.portrait{

aspect-ratio:5/7;

overflow:hidden;

border-radius:20px;

}

.square img,
.portrait img{

width:100%;

height:100%;

object-fit:cover;

display:block;

}