/* =========================================================
   THE MARK A. BRADFORD COLLECTION — EDITION 1.1
   BUILD 1.1E — JOURNAL
   ========================================================= */

.journal11-hero {
  padding: clamp(112px,12vw,175px) 0 clamp(82px,9vw,125px);
  background: var(--color-dark);
  color: #fff;
}

.journal11-hero__grid {
  display: grid;
  grid-template-columns: .86fr 1.14fr;
  gap: clamp(58px,8vw,120px);
  align-items: end;
}

.journal11-hero h1 {
  margin: .55rem 0 1rem;
}

.journal11-hero__copy {
  max-width: 690px;
  color: rgba(255,255,255,.68);
}

.journal11-feature {
  background: var(--color-bg);
}

.journal11-feature__grid {
  display: grid;
  grid-template-columns: 1.12fr .88fr;
  gap: clamp(52px,8vw,110px);
  align-items: center;
}

.journal11-feature__image img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
}

.journal11-feature__copy {
  max-width: 620px;
}

.journal11-feature__copy h2 {
  margin: .55rem 0 1rem;
}

.journal11-feature__copy p:not(.eyebrow) {
  color: var(--color-muted);
}

.journal11-essays {
  background: var(--color-paper);
}

.journal11-essays__head {
  max-width: 840px;
  margin-bottom: 48px;
}

.journal11-essays__head h2 {
  margin-top: .55rem;
}

.journal11-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 42px 24px;
}

.journal11-card {
  min-width: 0;
}

.journal11-card__image {
  overflow: hidden;
  background: #ddd6cb;
}

.journal11-card__image img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  transition: transform 650ms ease;
}

.journal11-card:hover .journal11-card__image img {
  transform: scale(1.02);
}

.journal11-card__body {
  padding-top: 17px;
}

.journal11-card__body h3 {
  margin: .42rem 0 .65rem;
  font-size: clamp(2rem,2.8vw,2.7rem);
}

.journal11-card__body p {
  color: var(--color-muted);
}

.journal11-card__meta {
  display: inline-flex;
  margin-top: 1rem;
  color: var(--color-accent);
  font-size: .59rem;
  font-weight: 600;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.journal11-quote {
  background: var(--color-dark);
  color: #fff;
  text-align: center;
}

.journal11-quote blockquote {
  max-width: 1080px;
  margin-inline: auto;
  font-family: var(--font-display);
  font-size: clamp(3rem,5.5vw,5.9rem);
  font-weight: 300;
  letter-spacing: -.045em;
  line-height: .96;
  text-wrap: balance;
}

.journal11-quote p {
  max-width: 760px;
  margin: 2rem auto 0;
  color: rgba(255,255,255,.62);
}

.journal11-note {
  background: #e9dfd1;
}

.journal11-note__grid {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: clamp(58px,8vw,120px);
  align-items: start;
}

.journal11-note h2 {
  margin-top: .55rem;
}

.journal11-note__copy {
  max-width: 650px;
  color: #5f584f;
}

@media (max-width: 1050px) {
  .journal11-hero__grid,
  .journal11-feature__grid,
  .journal11-note__grid {
    grid-template-columns: 1fr;
  }

  .journal11-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
}

@media (max-width: 760px) {
  .journal11-hero {
    padding-top: 84px;
  }

  .journal11-grid {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .journal11-card__image img {
    transition: none;
  }

  .journal11-card:hover .journal11-card__image img {
    transform: none;
  }
}