/* ================================================================
   ABOUT
   ================================================================ */
#about {
  background: var(--cream);
  padding: 48px 0;
  position: relative;
  overflow: hidden;
}
#about > * { position: relative; z-index: 1; }

.about-heading { text-align: center; margin-bottom: 28px; }
.about-heading .section-title { text-align: center; }
.about-heading .section-rule { margin: 0 auto 16px; }

.about-text { max-width: 720px; margin: 0 auto; text-align: center; }
.about-text p { font-weight: 300; font-size: 15px; line-height: 1.6; color: var(--body); margin-bottom: 12px; }

.about-photos {
  max-width: 530px;
  margin: 28px auto 0;
  padding: 0 32px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  align-items: start;
}
.about-photo-wrap { border-radius: 4px; overflow: hidden; }
.about-photo-wrap:first-child { transform: rotate(-1.5deg); transition: transform 400ms var(--ease-out); }
.about-photo-wrap:last-child { transform: rotate(1deg); margin-top: 40px; transition: transform 400ms var(--ease-out); }
.about-photo-wrap img {
  width: 100%;
  height: auto;
  display: block;
  filter: saturate(0) brightness(0.95);
  transition: filter 800ms ease, transform 400ms ease;
}
.about-photo-wrap.revealed img { filter: saturate(1) brightness(1); }
.about-photo-wrap:hover { transform: rotate(0deg); }
.about-photo-wrap:hover img { transform: scale(1.02); filter: saturate(1.05) brightness(1.04); }

/* Responsive */
@media (max-width: 640px) {
  .about-photos { grid-template-columns: 1fr; padding: 0 20px; }
  .about-photo-wrap:first-child,
  .about-photo-wrap:last-child { transform: none; margin-top: 0; }
}
