body {
margin: 0;
font-family: 'Inter', Arial, sans-serif;
background: #f8f6f1;
color: #111;
}

.gallery-page {
padding: 35px 20px;
}

.gallery-container {
width: 96vw;
max-width: 1500px;
margin: 0 auto;
padding: 45px;
background: #fff2df;
border-radius: 25px;
box-shadow: 0 25px 45px rgba(0, 0, 0, 0.08);
box-sizing: border-box;
}

/* Intro */

.gallery-intro {
text-align: center;
margin-bottom: 40px;
}

.gallery-intro h1 {
margin: 0 0 10px;
font-family: 'Playfair Display', serif;
font-size: 46px;
font-weight: 700;
color: #222;
}

.gallery-intro p {
margin: 0;
font-size: 18px;
font-weight: 600;
color: #555;
}

/* Section */

.gallery-section {
margin-bottom: 42px;
background: #fffaf2;
border-radius: 22px;
padding: 32px 28px;
box-shadow: 0 14px 30px rgba(0, 0, 0, 0.07);
}

.gallery-section:last-child {
margin-bottom: 0;
}

/* Grid */

.gallery-grid {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 24px;
}

/* Cards */

.gallery-card {
background: #fff2df;
border-radius: 20px;
padding: 16px;
text-align: center;
box-shadow: 0 12px 25px rgba(0, 0, 0, 0.08);
transition: 0.25s ease;
}

.gallery-card:hover {
transform: translateY(-4px);
}

.gallery-card img {
width: 100%;
height: 220px;
object-fit: cover;
object-position: center;
border-radius: 16px;
display: block;
cursor: pointer;
transition: 0.25s ease;
}

.gallery-card img:hover {
transform: scale(1.04);
}

.gallery-card p {
margin: 12px 0 0;
font-size: 16px;
font-weight: 900;
color: #222;
}

/* Album specific */

.album-card {
cursor: pointer;
}

.album-card p {
margin-top: 14px;
font-size: 18px;
font-weight: 900;
color: #222;
}

/* Album header */

.album-header {
grid-column: 1 / -1;
text-align: center;
margin-bottom: 10px;
}

.album-header h2 {
margin: 14px 0 0;
font-family: 'Playfair Display', serif;
font-size: 34px;
color: #222;
}

.album-header button {
border: none;
background: #fff2df;
color: #222;
font-weight: 800;
padding: 12px 20px;
border-radius: 14px;
cursor: pointer;
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.08);
transition: 0.25s ease;
}

.album-header button:hover {
background: #f2dfc3;
transform: translateY(-2px);
}

/* Lightbox */

.lightbox {
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.78);
display: none;
align-items: center;
justify-content: center;
z-index: 9999;
padding: 25px;
box-sizing: border-box;
}

.lightbox.active {
display: flex;
}

.lightbox img {
max-width: 90vw;
max-height: 85vh;
object-fit: contain;
background: white;
border-radius: 20px;
padding: 10px;
box-shadow: 0 25px 60px rgba(0, 0, 0, 0.35);
}

.lightbox-close {
position: fixed;
top: 22px;
right: 32px;
color: white;
font-size: 42px;
font-weight: 800;
cursor: pointer;
z-index: 10000;
}

/* Responsive */

@media (max-width: 1200px) {
.gallery-grid {
grid-template-columns: repeat(4, 1fr);
}
}

@media (max-width: 900px) {
.gallery-grid {
grid-template-columns: repeat(3, 1fr);
}

.gallery-page {
padding: 25px 15px;
}

.gallery-container {
width: auto;
padding: 35px 22px;
}

.gallery-intro h1 {
font-size: 36px;
}

.gallery-intro p {
font-size: 16px;
}

.gallery-section {
padding: 26px 18px;
}

.gallery-card img {
height: 190px;
}

.album-header h2 {
font-size: 28px;
}

.lightbox-close {
top: 14px;
right: 22px;
font-size: 36px;
}
}

@media (max-width: 600px) {
.gallery-grid {
grid-template-columns: repeat(2, 1fr);
}
}
