/* ============================================
   ABOUT PAGE
   ============================================ */

.about-hero{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items:center;
  padding: 8px 0 40px;
}
.about-hero p{ font-size:16px; color:var(--muted); line-height:1.75; margin-top:18px; }
.about-hero p + p{ margin-top:14px; }

.about-visual{
  height: 360px;
  border-radius: var(--radius-md);
  border: 1px solid var(--line);
  background: radial-gradient(ellipse at center 55%, #1c1c20, #08080a 80%);
  position:relative;
  overflow:hidden;
  display:flex; align-items:center; justify-content:center;
}
.about-visual img{ width:80%; max-width:420px; filter: drop-shadow(0 18px 18px rgba(0,0,0,0.5)); }

.stat-row{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  padding: 56px 0;
  border-top: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
}
.stat{ text-align:center; }
.stat .num{ font-family: var(--display); font-size: clamp(30px, 4vw, 44px); color: var(--gold); }
.stat .label{ font-size:13px; color:var(--muted); margin-top:8px; }

.values-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.value-card h3{ font-size:18px; margin-bottom:10px; }
.value-card p{ font-size:14px; color:var(--muted); line-height:1.65; }

@media (max-width: 860px){
  .about-hero{ grid-template-columns: 1fr; }
  .about-visual{ height:280px; order:-1; }
  .stat-row{ grid-template-columns: repeat(2, 1fr); }
  .values-grid{ grid-template-columns: 1fr; }
}