/* ─── PAGE HERO ─── */
.phero { position: relative; padding: 11rem 3rem 5rem; background: var(--green-deep); overflow: hidden; }
.phero-bg { position: absolute; inset: 0; opacity: 0.22; }
.phero-bg img { width: 100%; height: 100%; object-fit: cover; }
.phero-scrim { position: absolute; inset: 0; background: linear-gradient(120deg, var(--green-deep) 35%, rgba(22,48,44,0.5)); }
.phero-inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; }
.phero-label { font-size: 0.6rem; font-weight: 500; letter-spacing: 0.34em; text-transform: uppercase; color: var(--sand); display: flex; align-items: center; gap: 0.8rem; margin-bottom: 1.6rem; }
.phero-label::after { content: ''; width: 40px; height: 1px; background: var(--sand); opacity: 0.5; }
.phero h1 { font-family: 'Cormorant Garamond', serif; font-size: clamp(2.6rem, 6vw, 5rem); font-weight: 300; color: var(--cream); line-height: 1.05; }
.phero h1 em { font-style: italic; color: var(--sand); }
.phero p { margin-top: 1.6rem; max-width: 560px; font-size: 0.95rem; font-weight: 300; line-height: 1.8; color: rgba(242,236,225,0.7); }

/* ─── STORY ─── */
.story { background: var(--cream); padding: 6rem 3rem; }
.story-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1.3fr; gap: 5rem; align-items: start; }
.story-label { font-size: 0.6rem; font-weight: 500; letter-spacing: 0.34em; text-transform: uppercase; color: var(--green-mid); display: flex; align-items: center; gap: 0.8rem; margin-bottom: 1.4rem; }
.story-label::after { content: ''; width: 40px; height: 1px; background: var(--green-light); }
.story h2 { font-family: 'Cormorant Garamond', serif; font-size: clamp(1.9rem, 3.4vw, 2.8rem); font-weight: 300; line-height: 1.18; color: var(--green-deep); }
.story h2 em { font-style: italic; }
.story p { font-size: 0.95rem; font-weight: 300; line-height: 1.9; color: var(--charcoal); opacity: 0.82; margin-bottom: 1.3rem; }
.story p:first-child { margin-top: 0; }

/* ─── TEAM ─── */
.team { background: var(--green-deep); padding: 5rem 3rem 6rem; }
.team-inner { max-width: 1200px; margin: 0 auto; }
.team-label { font-size: 0.6rem; font-weight: 500; letter-spacing: 0.34em; text-transform: uppercase; color: var(--sand); display: flex; align-items: center; gap: 0.8rem; margin-bottom: 1.4rem; }
.team-label::after { content: ''; width: 40px; height: 1px; background: var(--sand); opacity: 0.5; }
.team h2 { font-family: 'Cormorant Garamond', serif; font-size: clamp(2rem, 3.8vw, 3.2rem); font-weight: 300; color: var(--cream); margin-bottom: 3rem; }
.team h2 em { font-style: italic; color: var(--sand); }
.team-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.member { position: relative; overflow: hidden; border: 1px solid rgba(191,157,92,0.35); background: rgba(242,236,225,0.13); padding: 2rem 1.8rem; transition: background 0.3s, border-color 0.3s, transform 0.3s; }
.member::after { content: ''; position: absolute; bottom: 0; left: 0; height: 2px; width: 0; background: var(--sand); transition: width 0.4s ease; }
.member:hover { background: rgba(242,236,225,0.2); border-color: rgba(191,157,92,0.7); transform: translateY(-3px); }
.member:hover::after { width: 100%; }
.member-name { font-family: 'Cormorant Garamond', serif; font-size: 1.5rem; font-weight: 400; color: var(--cream); line-height: 1.15; }
.member-role { font-size: 0.62rem; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; color: var(--sand); margin-top: 0.5rem; }
.member-creds { font-size: 0.6rem; font-weight: 300; letter-spacing: 0.08em; color: rgba(242,236,225,0.55); margin-top: 0.3rem; }
.member-bio { font-size: 0.72rem; font-weight: 300; line-height: 1.65; color: rgba(242,236,225,0.7); margin-top: 0.9rem; }

/* ─── RESPONSIVE ─── */
@media (max-width: 1024px) {
  .story-inner { grid-template-columns: 1fr; gap: 2.5rem; }
  .team-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .phero { padding: 9rem 1.5rem 4rem; }
  .story, .team { padding: 4rem 1.5rem; }
  .team-grid { grid-template-columns: 1fr; }
}