/* ══════════════════════════════
   ABOUT PAGE — about.css
══════════════════════════════ */

/* ── STORY ── */
.story { background: white; }
.story-grid { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:start; }
.story-text p { color:var(--text-muted); line-height:1.82; font-size:0.96rem; margin-bottom:16px; }
.story-img-main { width:100%; border-radius:10px; overflow:hidden; box-shadow:0 18px 56px rgba(13,43,30,0.13); margin-bottom:14px; }
.story-img-row  { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.story-img-small { width:100%; border-radius:8px; overflow:hidden; }

/* ── VALUES ── */
.values { background: var(--cream); }
.values-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:48px; }
.value-card {
  background:white; border:1px solid var(--border); border-radius:12px;
  padding:28px 24px;
  transition:transform .3s, box-shadow .3s;
}
.value-card:hover { transform:translateY(-4px); box-shadow:0 14px 40px rgba(13,43,30,0.1); }
.value-icon  { font-size:1.7rem; margin-bottom:14px; }
.value-card h3 { font-family:'Cormorant Garamond',serif; font-size:1.15rem; font-weight:700; color:var(--green-deep); margin-bottom:9px; }
.value-card p  { font-size:0.84rem; color:var(--text-muted); line-height:1.7; }

/* ── MISSION ── */
.mission { background:var(--green-deep); padding:88px var(--page-pad); position:relative; overflow:hidden; }
.mission::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 60% 70% at 80% 40%, rgba(42,122,75,0.15) 0%, transparent 70%); pointer-events:none; }
.mission-inner { max-width:1200px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; position:relative; z-index:1; }
.mission h2 { font-family:'Playfair Display',serif; font-size:clamp(1.7rem,3vw,2.5rem); font-weight:900; color:var(--cream); line-height:1.15; margin-bottom:18px; }
.mission h2 em { font-style:italic; color:var(--green-light); }
.mission p  { color:rgba(245,240,232,0.62); font-size:0.96rem; line-height:1.8; margin-bottom:14px; }
.mission-stats { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.m-stat { background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.08); border-radius:10px; padding:20px 18px; }
.m-stat-num   { font-family:'Cormorant Garamond',serif; font-size:2.2rem; font-weight:700; color:var(--gold-light); line-height:1; }
.m-stat-label { font-size:0.74rem; color:rgba(245,240,232,0.45); text-transform:uppercase; letter-spacing:0.08em; margin-top:5px; }

/* ── GALLERY ── */
.gallery { background:white; }
.gallery-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  grid-template-rows:220px 220px;
  gap:12px; margin-top:44px;
}
.g-item { border-radius:9px; overflow:hidden; position:relative; }
.g-item:first-child { grid-column:1/2; grid-row:1/3; }
.g-item img { width:100%; height:100%; object-fit:cover; transition:transform .4s; display:block; }
.g-item:hover img { transform:scale(1.04); }
.g-cap { position:absolute; bottom:0; left:0; right:0; background:linear-gradient(transparent,rgba(13,43,30,0.85)); color:white; padding:18px 14px 12px; font-size:0.78rem; transform:translateY(100%); transition:transform .3s; }
.g-item:hover .g-cap { transform:translateY(0); }

/* ── CTA ── */
.cta { background:linear-gradient(135deg,var(--green-mid),var(--green-bright)); padding:88px var(--page-pad); text-align:center; }
.cta h2 { font-family:'Playfair Display',serif; font-size:clamp(1.6rem,3.2vw,2.5rem); color:var(--cream); margin-bottom:12px; }
.cta p  { color:rgba(245,240,232,0.68); margin-bottom:32px; font-size:1rem; }

/* ════════════════════════════
   RESPONSIVE — ABOUT
════════════════════════════ */

@media (max-width: 1024px) {
  .story-grid { gap: 48px; }
  .mission-inner { gap: 48px; }
}

@media (max-width: 900px) {
  .story-grid { grid-template-columns:1fr; gap:40px; }
  .values-grid { grid-template-columns:1fr 1fr; }
  .mission-inner { grid-template-columns:1fr; gap:40px; }
  .mission-stats { grid-template-columns:repeat(4,1fr); }
  .gallery-grid { grid-template-columns:1fr 1fr; grid-template-rows:auto; }
  .g-item:first-child { grid-column:1/3; grid-row:auto; }
  .g-item:first-child img { height:260px; }
}

@media (max-width: 768px) {
  .story-img-row { grid-template-columns:1fr 1fr; }
  .mission-stats { grid-template-columns:1fr 1fr; }
  .gallery-grid { grid-template-columns:1fr 1fr; }
  .g-item:first-child { grid-column:1/3; }
  .cta { padding:60px var(--page-pad); }
}

@media (max-width: 600px) {
  .values-grid { grid-template-columns:1fr; }
  .story-img-row { grid-template-columns:1fr; }
  .gallery-grid { grid-template-columns:1fr; gap:10px; }
  .g-item:first-child { grid-column:auto; }
  .g-item img { height:220px !important; }
  .g-cap { transform:translateY(0); }
}

@media (max-width: 480px) {
  .mission-stats { grid-template-columns:1fr 1fr; }
  .m-stat-num { font-size:1.8rem; }
  .cta { padding: 48px var(--page-pad); }
}