/* Eternal-inspired About page */
.about-eternal {
  background: #0d0d0d;
  color: #f5f2ec;
}

.about-eternal .wrap {
  width: min(1480px, calc(100% - 48px));
  margin: 0 auto;
}

.about-eternal__hero {
  min-height: calc(100vh - 80px);
  display: flex;
  align-items: stretch;
  border-bottom: 1px solid rgba(245,242,236,.12);
}

.about-eternal__hero-grid {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(420px, 1.05fr);
  min-height: calc(100vh - 80px);
}

.about-eternal__hero-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(3rem, 6vw, 7rem) clamp(2rem, 5vw, 5rem) clamp(3rem, 6vw, 6rem) 0;
}

.about-eternal__eyebrow,
.about-eternal__section-label,
.about-eternal__work-meta,
.about-eternal__kicker {
  margin: 0;
  color: #c9aa80;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.about-eternal__hero h1 {
  margin: 1rem 0 1.2rem;
  font-family: var(--font-display);
  font-size: clamp(5rem, 11vw, 10rem);
  line-height: .78;
  letter-spacing: -.075em;
  font-weight: 500;
}

.about-eternal__role {
  margin: 0;
  font-size: clamp(1.15rem, 2vw, 1.8rem);
  letter-spacing: -.025em;
}

.about-eternal__intro {
  margin: 1.5rem 0 0;
  max-width: 42rem;
  color: rgba(245,242,236,.72);
  font-size: clamp(1rem, 1.2vw, 1.2rem);
  line-height: 1.7;
}

.about-eternal__actions {
  display: flex;
  gap: .8rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}

.about-eternal__hero-media {
  min-height: 100%;
  overflow: hidden;
  background: #171717;
}

.about-eternal__hero-media img,
.about-eternal__story-media img,
.about-eternal__work-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.about-eternal__hero-media img {
  object-position: center 20%;
}

.about-eternal__media-placeholder {
  min-height: 520px;
  background: linear-gradient(135deg,#181818,#292929);
}

.about-eternal .section {
  padding: clamp(5rem, 8vw, 9rem) 0;
}

.about-eternal__statement {
  border-bottom: 1px solid rgba(245,242,236,.12);
}

.about-eternal__statement-copy {
  margin: 1.1rem 0 0;
  max-width: 17ch;
  font-family: var(--font-display);
  font-size: clamp(3rem, 7vw, 7rem);
  line-height: .95;
  letter-spacing: -.06em;
}

.about-eternal__story-grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(3rem, 7vw, 8rem);
  align-items: center;
}

.about-eternal__story-media {
  aspect-ratio: 4 / 5;
  overflow: hidden;
}

.about-eternal__story-media img {
  object-position: center top;
}

.about-eternal__story-copy h2,
.about-eternal__section-head h2,
.about-eternal__seo h2,
.about-eternal__cta h2 {
  margin: .8rem 0 1.5rem;
  font-family: var(--font-display);
  font-size: clamp(2.7rem, 5vw, 5.6rem);
  line-height: .95;
  letter-spacing: -.055em;
  font-weight: 500;
}

.about-eternal__story-copy p:not(.about-eternal__section-label) {
  color: rgba(245,242,236,.72);
  line-height: 1.8;
  font-size: 1.02rem;
}

.about-eternal__work {
  background: #f0e8d7;
  color: #171410;
}

.about-eternal__work .about-eternal__section-label,
.about-eternal__work .about-eternal__work-meta,
.about-eternal__work .text-link {
  color: #7d6245 !important;
}

.about-eternal__section-head {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr);
  gap: 2rem;
  align-items: end;
  margin-bottom: 2.5rem;
}

.about-eternal__section-head > p {
  max-width: 34rem;
  justify-self: end;
  margin: 0 0 .75rem;
  color: rgba(245,242,236,.64);
  line-height: 1.7;
}

.about-eternal__work .about-eternal__section-head > p {
  color: rgba(23,20,16,.62);
}

.about-eternal__work-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 1.2rem;
}

.about-eternal__work-card {
  min-width: 0;
}

.about-eternal__work-media {
  display: block;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: #d9cfbb;
}

.about-eternal__work-media img {
  transition: transform .45s ease;
}

.about-eternal__work-card:hover img {
  transform: scale(1.025);
}

.about-eternal__work-meta {
  margin-top: .9rem;
}

.about-eternal__work-card h3 {
  margin: .45rem 0 0;
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 2.2vw, 2.6rem);
  line-height: 1;
  letter-spacing: -.045em;
}

.about-eternal__work-card h3 a {
  color: #171410;
}

.about-eternal__brands {
  border-bottom: 1px solid rgba(245,242,236,.12);
}

.about-eternal__brand-groups {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 1px;
  background: rgba(245,242,236,.12);
  border: 1px solid rgba(245,242,236,.12);
}

.about-eternal__brand-group {
  background: #0d0d0d;
  padding: 1.6rem;
}

.about-eternal__brand-group h3 {
  margin: 0 0 1rem;
  font-family: var(--font-display);
  font-size: 1.45rem;
  font-weight: 500;
}

.about-eternal__brand-group ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.about-eternal__brand-group li {
  padding: .48rem 0;
  border-top: 1px solid rgba(245,242,236,.08);
  color: rgba(245,242,236,.68);
  font-size: .92rem;
}

.about-eternal__timeline {
  border-top: 1px solid rgba(245,242,236,.14);
}

.about-eternal__timeline-row {
  display: grid;
  grid-template-columns: 100px minmax(240px,.8fr) minmax(0,1.2fr);
  gap: 2rem;
  padding: 1.5rem 0;
  border-bottom: 1px solid rgba(245,242,236,.14);
  align-items: start;
}

.about-eternal__timeline-row > span {
  color: #c9aa80;
  font-family: var(--font-display);
  font-size: 1.3rem;
}

.about-eternal__timeline-row h3 {
  margin: 0;
  font-size: 1.2rem;
}

.about-eternal__timeline-row p {
  margin: 0;
  color: rgba(245,242,236,.64);
  line-height: 1.65;
}

.about-eternal__process {
  background: #161616;
}

.about-eternal__process-grid {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 1px;
  margin-top: 1.4rem;
  background: rgba(245,242,236,.12);
  border: 1px solid rgba(245,242,236,.12);
}

.about-eternal__process-grid > div {
  background: #161616;
  padding: 1.5rem;
}

.about-eternal__process-grid span {
  color: #c9aa80;
  font-family: var(--font-display);
  font-size: 2rem;
}

.about-eternal__process-grid h3 {
  margin: 2.5rem 0 .6rem;
  font-size: 1.2rem;
}

.about-eternal__process-grid p {
  margin: 0;
  color: rgba(245,242,236,.6);
  line-height: 1.6;
}

.about-eternal__seo {
  background: #efe7d7;
  color: #171410;
}

.about-eternal__seo-grid {
  display: grid;
  grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr);
  gap: clamp(3rem,7vw,8rem);
  align-items: start;
}

.about-eternal__seo h2 {
  margin: 0;
}

.about-eternal__seo p {
  color: rgba(23,20,16,.68);
  line-height: 1.8;
}

.about-eternal__cta {
  padding: clamp(6rem,10vw,11rem) 0;
  text-align: center;
  border-top: 1px solid rgba(245,242,236,.12);
}

.about-eternal__cta h2 {
  max-width: 12ch;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 980px) {
  .about-eternal__hero-grid,
  .about-eternal__story-grid,
  .about-eternal__seo-grid {
    grid-template-columns: 1fr;
  }

  .about-eternal__hero-grid {
    min-height: auto;
  }

  .about-eternal__hero-copy {
    padding-right: 0;
  }

  .about-eternal__hero-media {
    min-height: 70vh;
  }

  .about-eternal__section-head {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .about-eternal__section-head > p {
    justify-self: start;
  }

  .about-eternal__brand-groups,
  .about-eternal__process-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
}

@media (max-width: 640px) {
  .about-eternal .wrap {
    width: min(100% - 28px, 1480px);
  }

  .about-eternal__hero h1 {
    font-size: clamp(4.7rem, 24vw, 7rem);
  }

  .about-eternal__hero-media {
    min-height: 58vh;
  }

  .about-eternal__work-grid,
  .about-eternal__brand-groups,
  .about-eternal__process-grid {
    grid-template-columns: 1fr;
  }

  .about-eternal__timeline-row {
    grid-template-columns: 72px 1fr;
    gap: .8rem 1rem;
  }

  .about-eternal__timeline-row p {
    grid-column: 2;
  }

  .about-eternal__statement-copy {
    max-width: none;
    font-size: clamp(2.7rem, 14vw, 4.8rem);
  }
}