/* ===== About Page Styles ===== */

/* Page Hero */
.page-hero {
  position: relative;
  min-height: 360px;
  display: flex;
  align-items: center;
  overflow: hidden;
}
.page-hero-bg {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(135deg, rgba(44,40,37,.7) 0%, rgba(44,40,37,.5) 100%),
    url('https://images.unsplash.com/photo-1565193566173-7a0ee3dbe261?w=1400&q=80') center/cover no-repeat;
}
.page-hero-content {
  position: relative;
  z-index: 1;
  color: #fff;
  padding: 4rem 0;
}
.page-hero-content .hero-tag {
  color: var(--color-clay);
  margin-bottom: 0.75rem;
}
.page-hero-content h1 { color: #fff; }

/* Page hero entrance */
.page-hero-content .hero-tag,
.page-hero-content h1 {
  opacity: 0;
  transform: translateY(22px);
  animation: heroIn 0.8s cubic-bezier(.22,1,.36,1) forwards;
}
.page-hero-content .hero-tag { animation-delay: 0.15s; }
.page-hero-content h1 { animation-delay: 0.3s; }

/* Story Grid (alternating image + text) */
.story-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}
.story-text h2 { margin-bottom: 1.25rem; }
.story-text p {
  color: var(--color-text-light);
  line-height: 1.8;
  margin-bottom: 1rem;
}
.story-text p:last-child { margin-bottom: 0; }
.story-image {
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.story-image img {
  width: 100%;
  height: 420px;
  object-fit: cover;
}

/* First Pot (reversed layout) */
.first-pot { background: var(--color-warm-white); }
.first-pot-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}
.first-pot-image {
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.first-pot-image img {
  width: 100%;
  height: 420px;
  object-fit: cover;
}
.first-pot-text h2 { margin-bottom: 1.25rem; }
.first-pot-text p {
  color: var(--color-text-light);
  line-height: 1.8;
  margin-bottom: 1rem;
}

/* Family Section */
.family {
  background: var(--color-cream);
}
.family-inner {
  max-width: 700px;
  margin: 0 auto;
  text-align: center;
}
.family-inner h2 { margin-bottom: 1.25rem; }
.family-inner p { color: var(--color-text-light); line-height: 1.8; }

/* Deer Valley */
.deer-valley { background: var(--color-warm-white); }

/* CTA Banner */
.cta-banner {
  background: var(--color-charcoal);
  color: rgba(255,255,255,.85);
  text-align: center;
}
.cta-inner { max-width: 600px; margin: 0 auto; }
.cta-inner h2 { color: #fff; margin-bottom: 0.75rem; }
.cta-inner > p { margin-bottom: 2rem; }
.cta-actions { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }

/* ===== Responsive ===== */
@media (max-width: 768px) {
  .story-grid,
  .first-pot-inner {
    grid-template-columns: 1fr;
  }
  .story-image img,
  .first-pot-image img {
    height: 280px;
  }
  .page-hero { min-height: 260px; }
}
