/* About-page compositions; shared type, colors, controls and navigation live in styles.css. */
.about-masthead { padding-bottom:var(--space-3); }
.about-hero { display:grid;grid-template-columns:1fr 1fr; }
.about-hero-copy { padding:clamp(2rem,4.5vw,4.5rem) var(--space-4) clamp(2.5rem,4.5vw,4.5rem) max(var(--gutter),calc((100vw - var(--width))/2));align-self:center; }
.about-hero .eyebrow,.about-approach .eyebrow { color:#9dca7b; }
.about-hero h1 { font-size:clamp(2.6rem,4.2vw,4.5rem);line-height:1.08;max-width:10.5em;margin-top:var(--space-2); }
.about-hero-copy>p:last-child { max-width:28rem;font-size:1.125rem;line-height:1.55; }
.about-hero-image,.about-detail-image { margin:0;min-width:0;position:relative; }
.about-hero-image { align-self:center; }
/* Display only the supplied concept's image regions; preserve the original asset. */
.about-concept-crop { position:relative;overflow:hidden; }
.about-concept-crop img { position:absolute;max-width:none;height:auto; }
.about-concept-hero { aspect-ratio:450/327; }
.about-concept-hero img { width:177.333333%;left:-77.333333%;top:-30.58104%; }
.about-concept-team { aspect-ratio:448/315; }
.about-concept-team img { width:178.125%;left:-78.125%;top:-137.142857%; }
.about-hero-image figcaption { position:absolute;right:0;bottom:0;padding:.6rem 1rem;background:var(--forest);color:var(--on-dark);font-size:.8125rem; }
.about-story { display:grid;grid-template-columns:1fr 3fr;gap:var(--space-5);padding-block:clamp(2.5rem,5vw,4.5rem); }
.about-section-label { display:flex;align-items:center;gap:.8rem;align-self:start;padding-top:.5rem; }
.about-rule { width:2rem;height:2px;background:var(--green);flex:none; }
.about-story h2 { font-size:clamp(1.9rem,3vw,2.8rem); }
.about-story-columns { display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);margin-top:var(--space-3); }
.about-story-columns p+p { margin-top:0; }
.about-approach { padding-block:clamp(2.5rem,5vw,4.5rem); }
.about-approach-grid { display:grid;grid-template-columns:1fr 1.25fr;gap:clamp(2rem,6vw,6rem); }
.about-approach-heading h2 { font-size:clamp(1.9rem,3vw,2.8rem);margin:var(--space-2) 0 var(--space-3); }
.about-approach-heading>p:last-child { max-width:29rem; }
.about-principles { list-style:none;padding:0;margin:0;border-top:1px solid var(--border-dark); }
.about-principles li { display:grid;grid-template-columns:2.5rem 1fr;gap:var(--space-3);padding-block:var(--space-3);border-bottom:1px solid var(--border-dark); }
.about-step { font:400 1.25rem var(--display);color:#9dca7b; }
.about-principles h3 { font-size:1.4rem;margin-bottom:.6rem; }
.about-principles p { max-width:36rem; }
.about-experience { display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,5vw,5rem);padding-block:clamp(2.5rem,5vw,4.5rem);align-items:start; }
.about-detail-image figcaption { font-size:.8125rem;color:var(--muted);padding-top:.6rem; }
.about-detail-image { align-self:center; }
.about-experience h2 { margin:.65rem 0 var(--space-3);max-width:22ch;font-size:clamp(1.9rem,3vw,2.8rem); }
.about-experience-copy>p { max-width:38rem; }
.about-scope { list-style:none;padding:0;margin:var(--space-3) 0 .5rem;border-top:1px solid var(--border); }
.about-scope li { padding-block:1rem;border-bottom:1px solid var(--border);display:grid;gap:.3rem; }
.about-scope li>span:first-child { font:500 1.2rem/1.3 var(--display);text-transform:uppercase;color:var(--green); }
.about-scope li>span:last-child { font-size:var(--text-small);color:var(--muted); }
.about-region { padding-block:var(--space-5);background:var(--surface);border-top:1px solid var(--border); }
.about-region-grid { display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5);align-items:center; }
.about-region h2 { margin-top:.6rem; }
.about-region-grid>p { max-width:36rem; }
@media (max-width:900px) {
  .about-hero-copy { padding:2.5rem var(--gutter); }
  .about-hero h1 { font-size:clamp(2.3rem,5vw,3.6rem); }
  .about-hero-copy>p:last-child { font-size:1rem; }
  .about-story { grid-template-columns:1fr;gap:var(--space-3); }
  .about-approach-grid { grid-template-columns:1fr 1.2fr;gap:var(--space-4); }
  .about-principles li { grid-template-columns:1.75rem 1fr;gap:1rem; }
  .about-experience { grid-template-columns:.8fr 1.2fr;gap:var(--space-4); }
}
@media (max-width:650px) {
  .about-masthead { padding-bottom:var(--space-2); }
  .about-hero { grid-template-columns:1fr; }
  .about-hero-copy { padding:2rem var(--gutter) 2.5rem; }
  .about-hero h1 { font-size:clamp(2.5rem,8vw,3.8rem);max-width:15ch; }
  .about-story-columns { grid-template-columns:1fr;gap:var(--space-3); }
  .about-approach-grid { grid-template-columns:1fr;gap:var(--space-4); }
  .about-principles li { grid-template-columns:2rem 1fr; }
  .about-experience { grid-template-columns:1fr;gap:var(--space-4); }
  .about-region-grid { grid-template-columns:1fr;gap:var(--space-3); }
  .about-region { padding-block:2.5rem; }
}
