.about-hero::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(24,29,35,.97),rgba(24,29,35,.6)),url('../images/projects/completed-bathroom-06.webp') center/cover no-repeat; }
.story-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:64px; align-items:center; }
.story-copy h2 { color:var(--charcoal); font-size:clamp(2rem,4vw,3.3rem); line-height:1.07; letter-spacing:-.035em; margin-bottom:18px; }
.story-copy p { color:var(--muted); margin-bottom:17px; }
.story-image { position:relative; min-height:510px; box-shadow:var(--shadow); overflow:hidden; }
.story-image img { width:100%; height:100%; object-fit:cover; }
.story-image::after { content:""; position:absolute; inset:0; border:10px solid rgba(247,120,35,.9); clip-path:polygon(0 0,100% 0,100% 12px,12px 12px,12px 100%,0 100%); }
.values-grid { grid-template-columns:repeat(3,1fr); }
.value-card { padding:32px; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.045); }
.value-card h3 { margin:14px 0 9px; }
.value-card p { color:rgba(255,255,255,.7); }
.leadership-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; max-width:900px; }
.leader-card { padding:34px; }
.leader-card small { color:var(--orange); font-weight:800; letter-spacing:.11em; text-transform:uppercase; }
.leader-card h3 { color:var(--charcoal); font-size:1.35rem; margin:8px 0 10px; }
.leader-card p, .leader-card a { color:var(--muted); display:block; }
.leader-card a:hover { color:var(--orange); }
@media(max-width:860px){.story-grid{grid-template-columns:1fr}.values-grid,.leadership-grid{grid-template-columns:1fr}}
