/* Anti-Slop · macrostructure: Studio Manifesto · tone: direct editorial · anchor hue: burnt orange */

.about-hero{
  min-height:clamp(500px,72svh,760px);
  padding:clamp(112px,15svh,168px) 0 clamp(44px,7svh,88px);
}
.about-hero__grid{
  display:grid;
  grid-template-columns:minmax(132px,2fr) minmax(0,7fr) minmax(190px,3fr);
  align-items:end;
  gap:clamp(20px,4vw,72px);
}
.about-hero__kicker{
  align-self:start;
  padding-top:10px;
}
.about-title{
  font-size:clamp(58px,8.4vw,136px);
  line-height:.96;
  letter-spacing:-.055em;
  overflow-wrap:anywhere;
}
.about-hero__intro{
  max-width:30ch;
  padding-bottom:5px;
  color:var(--ink-dim);
  font-size:clamp(18px,1.5vw,24px);
  line-height:1.35;
}

.about-intro{
  padding:clamp(88px,12vw,176px) 0 clamp(104px,14vw,208px);
}
.about-intro__grid{
  display:grid;
  grid-template-columns:minmax(132px,2fr) minmax(0,10fr);
  gap:clamp(20px,4vw,72px);
}
.about-section-label{padding-top:10px}
.about-intro__copy{max-width:1050px}
.about-intro h2{
  max-width:19ch;
  font-family:var(--font-display);
  font-size:clamp(38px,5.2vw,80px);
  font-weight:500;
  font-style:normal;
  line-height:1.02;
  letter-spacing:-.045em;
}
.about-intro__copy>p{
  max-width:42ch;
  margin-top:clamp(28px,4vw,52px);
  color:var(--ink-dim);
  font-size:clamp(17px,1.4vw,22px);
  line-height:1.5;
}

.about-capabilities{
  padding:clamp(80px,10vw,144px) 0 clamp(96px,13vw,192px);
  background:var(--bg-deep);
}
.about-section-head{
  display:grid;
  grid-template-columns:minmax(132px,2fr) minmax(0,10fr);
  align-items:start;
  gap:clamp(20px,4vw,72px);
  padding-bottom:clamp(42px,6vw,80px);
  border-bottom:1px solid var(--line);
}
.about-section-head h2{
  max-width:14ch;
  font-family:var(--font-display);
  font-size:clamp(38px,5.2vw,80px);
  font-weight:500;
  font-style:normal;
  line-height:1;
  letter-spacing:-.045em;
}
.capability-list{border-bottom:1px solid var(--line)}
.capability{
  display:grid;
  grid-template-columns:minmax(132px,2fr) minmax(210px,4fr) minmax(0,6fr);
  align-items:baseline;
  gap:clamp(20px,4vw,72px);
  padding:clamp(22px,3vw,42px) 0;
  border-bottom:1px solid var(--line);
}
.capability:last-child{border-bottom:0}
.capability-number{
  color:var(--accent-text);
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.16em;
}
.capability h3{
  font-family:var(--font-display);
  font-size:clamp(25px,2.5vw,40px);
  font-weight:500;
  font-style:normal;
  line-height:1.05;
  letter-spacing:-.025em;
  overflow-wrap:anywhere;
}
.capability p{
  max-width:34ch;
  color:var(--ink-dim);
  font-size:15px;
  line-height:1.5;
}

.about-reel{
  padding:clamp(96px,14vw,208px) 0;
}
.about-reel__grid{
  display:grid;
  grid-template-columns:minmax(0,7fr) minmax(240px,5fr);
  align-items:end;
  gap:clamp(28px,7vw,120px);
}
.about-reel__figure{min-width:0}
.about-reel__figure img{
  display:block;
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  filter:saturate(.82);
}
.about-reel__figure figcaption{margin-top:14px}
.about-reel__copy{padding-bottom:3px}
.about-reel__copy h2{
  max-width:11ch;
  font-family:var(--font-display);
  font-size:clamp(38px,4.5vw,68px);
  font-weight:500;
  font-style:normal;
  line-height:.98;
  letter-spacing:-.045em;
}
.about-reel__copy p{
  max-width:30ch;
  margin-top:28px;
  color:var(--ink-dim);
  line-height:1.5;
}
.about-text-link,
.about-contact__link{
  display:inline-flex;
  align-items:center;
  gap:18px;
  min-height:44px;
  margin-top:28px;
  border-bottom:1px solid var(--accent);
  color:var(--ink);
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  transition:color .3s var(--ease),border-color .3s var(--ease);
}
.about-text-link span,
.about-contact__link span{
  color:var(--accent-text);
  font-size:17px;
  line-height:1;
  transition:transform .45s var(--ease);
}
.about-text-link:hover,
.about-contact__link:hover{color:var(--accent-text)}
.about-text-link:hover span,
.about-contact__link:hover span{transform:translateX(8px)}
.about-text-link:focus-visible,
.about-contact__link:focus-visible{outline-offset:6px}

.about-contact{
  padding:clamp(80px,11vw,160px) 0 clamp(96px,13vw,192px);
  background:var(--bg-deep);
  border-top:1px solid var(--line);
}
.about-contact__inner{max-width:1120px}
.about-contact h2{
  max-width:12ch;
  margin-top:clamp(30px,4vw,56px);
  font-family:var(--font-display);
  font-size:clamp(48px,7vw,108px);
  font-weight:500;
  font-style:normal;
  line-height:.94;
  letter-spacing:-.05em;
}
.about-contact__link{
  margin-top:clamp(36px,5vw,64px);
  font-size:clamp(14px,1.4vw,18px);
  letter-spacing:.1em;
}

@media(max-width:900px){
  .about-hero__grid{grid-template-columns:minmax(100px,2fr) minmax(0,8fr)}
  .about-hero__intro{grid-column:2;max-width:38ch}
  .about-reel__grid{grid-template-columns:minmax(0,1fr) minmax(210px,4fr)}
}

@media(max-width:768px){
  .about-hero{
    min-height:64svh;
    padding-top:clamp(104px,15svh,132px);
    padding-bottom:48px;
  }
  .about-hero__grid,
  .about-intro__grid,
  .about-section-head,
  .about-reel__grid{grid-template-columns:minmax(0,1fr);gap:28px}
  .about-hero__kicker{padding-top:0}
  .about-title{font-size:clamp(58px,15vw,104px)}
  .about-hero__intro{grid-column:auto;max-width:34ch;padding-bottom:0}
  .about-intro{padding-top:80px}
  .about-section-label{padding-top:0}
  .about-intro h2,.about-section-head h2{max-width:18ch}
  .about-section-head{padding-bottom:38px}
  .capability{grid-template-columns:42px minmax(0,1fr);gap:12px 20px;padding:26px 0}
  .capability-number{grid-row:span 2;align-self:start;padding-top:5px}
  .capability p{grid-column:2}
  .about-reel__copy{padding-bottom:0}
  .about-reel__copy h2{max-width:14ch}
}

@media(max-width:480px){
  .about-hero{min-height:62svh;padding-bottom:36px}
  .about-hero__grid{gap:22px}
  .about-title{font-size:clamp(54px,17vw,82px)}
  .about-intro{padding-block:76px 96px}
  .about-capabilities{padding-block:72px 96px}
  .about-reel{padding-block:88px 104px}
  .about-contact{padding-block:72px 104px}
  .about-contact h2{font-size:clamp(48px,14vw,72px)}
  .about-contact__link{font-size:12px;letter-spacing:.07em}
}