.terremoto-page #title h1 { font-size: 2em; margin-bottom: 0; }
#terremoto-gallery { padding: 80px 0; }
#terremoto-gallery h2 { font-size: 1.5em; }
.terremoto-intro { margin: 24px 0; line-height: 1.7; }
.terremoto-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.terremoto-photo { display: block; background: #FFF; overflow: hidden; border-bottom: 3px solid #F1B96F; }
.terremoto-photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .2s ease; }
.terremoto-photo span { display: block; padding: 14px 16px; color: #49374D; }
.terremoto-photo:hover img { transform: scale(1.03); }
.terremoto-photo:focus-visible, #photo-viewer button:focus-visible { outline: 3px solid #F1B96F; outline-offset: 3px; }
#photo-viewer { position: fixed; margin: auto; padding: 50px 55px 20px; width: min(1100px, 94vw); max-height: 94vh; background: #49374D; color: #FFF; }
#photo-viewer::backdrop { background: rgba(25, 25, 25, .9); }
#photo-viewer figure { margin: 0; }
#viewer-image { width: 100%; height: 72vh; object-fit: contain; }
#viewer-caption { text-align: center; padding-top: 16px; }
#photo-viewer button { position: absolute; background: transparent; color: #F1B96F; font-size: 40px; cursor: pointer; padding: 4px 12px; }
.viewer-close { top: 0; right: 8px; }
.viewer-prev { top: 45%; left: 0; }
.viewer-next { top: 45%; right: 0; }
@media (max-width: 1000px) {
 .terremoto-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
 .terremoto-page #header > .flx, .terremoto-page #footer > .flx { flex-wrap: wrap; gap: 28px; }
}
@media (max-width: 600px) {
 #terremoto-gallery { padding: 40px 0; }
 #terremoto-gallery > div { width: 90%; }
 .terremoto-grid { grid-template-columns: 1fr; gap: 20px; }
 .terremoto-page #topbar > .flx, .terremoto-page #header > .flx > .flx-ds-inlflx, .terremoto-page #request > .flx, .terremoto-page #copy > .flx { flex-direction: column; gap: 20px; align-items: flex-start; }
 .terremoto-page #header .vertical-line { display: none; }
 .terremoto-page .logo { width: 100%; max-width: 270px; }
 .terremoto-page #contact { padding: 40px 0; }
 .terremoto-page #cnt-form { width: 100%; }
 .terremoto-page #request .btn { width: 100%; }
 .terremoto-page #title h1 { font-size: 1.6em; }
 #photo-viewer { padding: 50px 35px 16px; }
 #viewer-image { height: 65vh; }
}
@media (prefers-reduced-motion: reduce) { .terremoto-photo img { transition: none; } }