@import 'index.css';

.page-title-section { background-color: var(--rc-black); color: var(--rc-white); padding: 60px 0; text-align: center; }
.page-title-section h1 { font-size: 3.5rem; }
.gallery-grid-section { padding: 60px 20px; }
.gallery-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); gap: 20px; }
.gallery-item { border-radius: 8px; overflow: hidden; box-shadow: 0 5px 15px rgba(0,0,0,0.1); height: 300px; }
.gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease-in-out, filter 0.4s ease; }
.gallery-item:hover img { transform: scale(1.05); filter: brightness(1.1); }

@media (max-width: 768px) {
    .page-title-section h1 { font-size: 2.5rem; }
    .gallery-grid { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 15px; }
}