html, body {
margin: 0;
padding: 0;
width: 100%;
background-color: #2f3d2f; /* force dark background at document level */
}


* {
box-sizing: border-box;
}


body {
font-family: 'Inter', sans-serif;
color: #f5f5f2;
line-height: 1.6;
}


/* Header */
.hero {
text-align: center;
padding: 3rem 1.5rem 1.5rem;
}


.hero h1 {
font-family: 'Playfair Display', serif;
font-size: 2.6rem;
font-weight: 500;
margin: 0;
letter-spacing: 0.04em;
color: #f5f5f2;
}


.subtitle {
margin-top: 0.3rem;
font-size: 0.85rem;
letter-spacing: 0.3em;
color: #e6e6e0;
}


/* Intro copy */
.intro {
max-width: 720px;
margin: 1.25rem auto 3rem; /* more space before images */
padding: 0 1.5rem;
text-align: center;
}


.intro p {
font-size: 1.05rem;
}


/* Image gallery */
.gallery {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
gap: 1.2rem;
margin: 0 auto 2rem; /* less space before footer */
}


.gallery img {
width: 100%;
height: auto;
display: block;
}


/* Footer */
footer {
text-align: center;
padding: 2rem 1.5rem 2.5rem; /* slightly tighter to images */
font-size: 0.95rem;
}


footer a {
color: #f5f5f2;
font-weight: 500;
text-decoration: none;
border-bottom: 1px solid rgba(245,245,242,0.6);
}


footer a:hover {
border-bottom-color: #ffffff;
}


/* Desktop refinements */
}