/*
 * about.css - Residentas Theme
 *
 * About page styles only. Edit this file for about page changes.
 */

/* ══════════════════════════════════════════
   PAGE BACKGROUND
   ══════════════════════════════════════════ */
body {
  background: #fff;
}

/* ══════════════════════════════════════════
   HERO SECTION
   ══════════════════════════════════════════ */
.residentas-about-hero {
  max-width: 960px;
  margin: 0 auto;
  padding: clamp(56px, 8vw, 96px) 24px clamp(32px, 4vw, 48px);
  text-align: center;
}
.residentas-about-eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: #b95732 !important;
  margin-bottom: 18px !important;
}
.residentas-about-eyebrow::before,
.residentas-about-eyebrow::after {
  content: "" !important;
  display: block !important;
  width: 24px !important;
  height: 1px !important;
  background: #b95732 !important;
  opacity: 0.7 !important;
}
.residentas-about-title {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: clamp(36px, 4.6vw, 64px) !important;
  font-weight: 400 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.015em !important;
  color: #1C1C1C !important;
  margin-bottom: 18px !important;
}
.residentas-about-sub {
  max-width: 640px !important;
  margin: 0 auto !important;
  font-size: 17px !important;
  line-height: 1.75 !important;
  color: #3A3A3A !important;
}

/* ══════════════════════════════════════════
   PHOTO MARQUEE (CSS-only scrolling)
   ══════════════════════════════════════════ */
.residentas-photo-marquee {
  overflow: hidden;
  padding: clamp(24px, 4vw, 40px) 0 clamp(40px, 5vw, 56px);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
}
.residentas-photo-track {
  display: flex;
  gap: 18px;
  width: max-content;
  animation: rs-marquee 48s linear infinite;
}
.residentas-photo-marquee:hover .residentas-photo-track {
  animation-play-state: paused;
}
.residentas-photo-frame {
  position: relative;
  flex: 0 0 auto;
  width: clamp(240px, 30vw, 360px);
  height: clamp(180px, 22vw, 260px);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(28,28,28,0.08);
  margin: 0;
}
.residentas-photo-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.residentas-photo-frame figcaption {
  position: absolute;
  left: 14px;
  bottom: 12px;
  padding: 6px 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #fff;
  background: rgba(28,28,28,0.55);
  backdrop-filter: blur(4px);
  border-radius: 999px;
}
@keyframes rs-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .residentas-photo-track { animation: none; }
}

/* ══════════════════════════════════════════
   SECTION TITLES & LEAD TEXT
   ══════════════════════════════════════════ */
.residentas-about-section {
  max-width: 960px;
  margin: 0 auto;
  padding: clamp(40px, 5vw, 56px) 24px;
}
.residentas-section-heading {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: clamp(28px, 3.2vw, 44px) !important;
  font-weight: 400 !important;
  line-height: 1.15 !important;
  text-align: center !important;
  color: #1C1C1C !important;
  margin-bottom: 18px !important;
}
.residentas-section-lead {
  max-width: 680px !important;
  margin: 0 auto 24px !important;
  font-size: 17px !important;
  line-height: 1.8 !important;
  text-align: center !important;
  color: #3A3A3A !important;
}

/* ══════════════════════════════════════════
   PILLAR CARDS - "What stays the same"
   Equal height + drop shadow
   ══════════════════════════════════════════ */
.residentas-pillars-row.wp-block-columns {
  align-items: stretch !important;
  gap: 18px !important;
}
.residentas-pillars-row .wp-block-column {
  display: flex !important;
  flex-direction: column !important;
}
.residentas-pillar.wp-block-group {
  flex: 1 !important;
  background: #fff !important;
  border: 1px solid #E5DDD5 !important;
  border-radius: 16px !important;
  padding: 28px !important;
  box-shadow: 0 6px 20px rgba(28,28,28,0.06) !important;
  display: flex !important;
  flex-direction: column !important;
}
.residentas-pillar-num {
  display: inline-block !important;
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #b95732 !important;
  letter-spacing: 0.12em !important;
  margin-bottom: 8px !important;
}
.residentas-pillar h3,
.residentas-pillar .wp-block-heading {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: 24px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  color: #1C1C1C !important;
  margin: 0 0 10px !important;
}
.residentas-pillar p {
  font-size: 15px !important;
  line-height: 1.8 !important;
  color: #3A3A3A !important;
  margin: 0 !important;
}

/* ══════════════════════════════════════════
   FOUR ADDRESSES GRID
   ══════════════════════════════════════════ */
.residentas-props-row.wp-block-columns {
  align-items: stretch !important;
  flex-wrap: wrap !important;
  gap: 18px !important;
}
.residentas-props-row .wp-block-column {
  flex-basis: calc(50% - 9px) !important;
  min-width: calc(50% - 9px) !important;
  display: flex !important;
  flex-direction: column !important;
}
.residentas-prop-card-about.wp-block-group {
  flex: 1 !important;
  background: #fff !important;
  border: 1px solid #E5DDD5 !important;
  border-radius: 16px !important;
  padding: 28px !important;
  box-shadow: 0 6px 20px rgba(28,28,28,0.04) !important;
}
.residentas-prop-kicker {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: #b95732 !important;
  margin-bottom: 10px !important;
}
.residentas-prop-card-about h3,
.residentas-prop-card-about .wp-block-heading {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: 28px !important;
  font-weight: 400 !important;
  line-height: 1.15 !important;
  color: #1C1C1C !important;
  margin: 0 0 8px !important;
}
.residentas-prop-meta {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #3A3A3A !important;
  margin-bottom: 12px !important;
}
.residentas-prop-card-about p {
  font-size: 15px !important;
  line-height: 1.8 !important;
  color: #3A3A3A !important;
  margin: 0 !important;
}

/* ══════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════ */
@media (max-width: 768px) {
  .residentas-pillars-row.wp-block-columns {
    flex-direction: column !important;
  }
  .residentas-pillars-row .wp-block-column {
    flex-basis: 100% !important;
  }
  .residentas-props-row .wp-block-column {
    flex-basis: 100% !important;
    min-width: 100% !important;
  }
}