/* ═══════════════════════════════════════
   ABOUT — Hero, Story, Values, Team
═══════════════════════════════════════ */

/* About hero */
.about-hero{background:linear-gradient(135deg,#0d3018,#1a6b2f 50%,#0e1e0a);min-height:52vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:100px 40px 80px;position:relative;overflow:hidden}
.about-hero::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent,transparent 40px,rgba(240,180,41,0.03) 40px,rgba(240,180,41,0.03) 41px)}
.about-hero h1{font-family:'Playfair Display',serif;font-size:clamp(48px,6vw,88px);font-weight:900;color:var(--cream);line-height:1;position:relative}
.about-hero h1 em{color:var(--gold);font-style:italic}
.about-hero .sub{font-size:14px;color:rgba(245,234,214,0.6);letter-spacing:3px;margin-top:20px;font-family:'Cinzel',serif;text-transform:uppercase;position:relative}

/* Story section */
.about-story{display:grid;grid-template-columns:1fr 1fr;min-height:480px}
.about-story-text{background:var(--dark-wood);padding:80px 72px;display:flex;flex-direction:column;justify-content:center}
.about-story-text h2{font-family:'Playfair Display',serif;font-size:clamp(28px,3vw,44px);font-weight:900;color:var(--cream);margin-bottom:28px;line-height:1.2}
.about-story-text h2 em{color:var(--gold)}
.about-story-text p{font-size:14px;line-height:2;color:var(--muted);margin-bottom:20px;max-width:480px}
.about-story-img{background:linear-gradient(135deg,#0a1f0d,#1a6b2f);overflow:hidden}
.about-story-img img{width:100%;height:100%;object-fit:cover;object-position:left center;opacity:0.85}

/* Values section */
.about-values{background:var(--black);padding:96px 80px}
.about-values-header{text-align:center;margin-bottom:64px}
.about-values-header h2{font-family:'Playfair Display',serif;font-size:clamp(32px,4vw,56px);font-weight:900;color:var(--cream)}
.about-values-header h2 em{color:var(--gold)}
.values-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:2px}
.value-card{background:var(--dark-wood);padding:48px 40px;border-top:3px solid transparent;transition:border-color .3s}
.value-card:hover{border-top-color:var(--gold)}
.value-icon{font-size:36px;margin-bottom:20px}
.value-card h3{font-family:'Cinzel',serif;font-size:14px;letter-spacing:3px;color:var(--gold);text-transform:uppercase;margin-bottom:16px}
.value-card p{font-size:14px;line-height:1.9;color:var(--muted)}

/* Team section */
.about-team{padding:96px 80px;background:var(--dark-wood)}
.about-team-header{text-align:center;margin-bottom:64px}
.about-team-header h2{font-family:'Playfair Display',serif;font-size:clamp(32px,4vw,56px);font-weight:900;color:var(--cream)}
.about-team-header h2 em{color:var(--gold)}
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.team-card{background:var(--black);overflow:hidden}
.team-card-img{height:280px;background:linear-gradient(135deg,#0d3018,#1a6b2f);display:flex;align-items:center;justify-content:center}
.team-card-body{padding:28px 32px}
.team-card-body h3{font-family:'Playfair Display',serif;font-size:22px;font-weight:700;color:var(--cream);margin-bottom:4px}
.team-card-body .role{font-family:'Cinzel',serif;font-size:10px;letter-spacing:3px;color:var(--gold);text-transform:uppercase;margin-bottom:12px}
.team-card-body p{font-size:13px;line-height:1.8;color:var(--muted)}

/* ── Responsive ── */
@media(max-width:1024px){
  .about-story-text{padding:60px 48px}
  .about-values{padding:72px 48px}
  .values-grid{grid-template-columns:repeat(3,1fr)}
  .about-team{padding:72px 48px}
  .team-grid{grid-template-columns:repeat(3,1fr);gap:20px}
}

@media(max-width:768px){
  .about-hero{padding:80px 24px 60px;min-height:40vh}
  .about-hero h1{font-size:clamp(36px,10vw,56px)}
  .about-story{grid-template-columns:1fr}
  .about-story-text{padding:52px 24px}
  .about-story-img{min-height:280px}
  .about-story-img img{height:100%;object-position:center 20%}
  .about-values{padding:56px 24px}
  .values-grid{grid-template-columns:1fr;gap:2px}
  .about-team{padding:56px 24px}
  .team-grid{grid-template-columns:1fr;gap:20px}
}