/* =========================================================
   THE MARK A. BRADFORD COLLECTION — EDITION ONE
   BUILD 004 — ABOUT, JOURNEYS & STUDIO
   ========================================================= */

/* ---------- Shared Editorial Hero ---------- */
.editorial-hero {
  padding: clamp(90px, 10vw, 150px) 0;
  background: var(--color-paper);
}

.editorial-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
  gap: clamp(60px, 8vw, 120px);
  align-items: center;
}

.editorial-hero__copy {
  max-width: 660px;
}

.editorial-hero__copy h1 {
  margin: .55rem 0 1.1rem;
  font-size: clamp(4rem, 6.5vw, 7rem);
  line-height: .88;
}

.editorial-hero__copy p:not(.eyebrow) {
  color: var(--color-muted);
}

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

/* ---------- About ---------- */
.about-principles {
  background: var(--color-dark);
  color: var(--color-white);
}

.about-principles__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  background: rgba(255,255,255,.14);
}

.about-principle {
  min-height: 310px;
  padding: clamp(28px, 3.2vw, 44px);
  background: var(--color-dark);
}

.about-principle span {
  color: #efaa77;
  font-size: .61rem;
  font-weight: 600;
  letter-spacing: .15em;
}

.about-principle h3 {
  margin: 2rem 0 .9rem;
  font-size: 2.35rem;
}

.about-principle p {
  color: rgba(255,255,255,.64);
}

.about-story {
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  min-height: 740px;
  background: #e9dfd1;
}

.about-story__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.about-story__copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(54px, 7vw, 100px);
}

.about-story__copy h2 {
  margin: .55rem 0 1rem;
}

.about-story__copy p:not(.eyebrow) {
  max-width: 650px;
  color: #5f584f;
}

.about-quote {
  background: var(--color-bg);
  text-align: center;
}

.about-quote blockquote {
  max-width: 1050px;
  margin-inline: auto;
  font-family: var(--font-display);
  font-size: clamp(2.8rem, 5vw, 5.7rem);
  font-weight: 300;
  line-height: .98;
  letter-spacing: -.04em;
}

.about-quote p {
  margin-top: 25px;
  color: var(--color-accent);
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
}

/* ---------- Journeys ---------- */
.journeys-hero {
  position: relative;
  min-height: 78vh;
  display: grid;
  align-items: end;
  overflow: hidden;
  isolation: isolate;
  color: var(--color-white);
  background: var(--color-dark);
}

.journeys-hero__image,
.journeys-hero__shade {
  position: absolute;
  inset: 0;
}

.journeys-hero__image {
  z-index: -2;
}

.journeys-hero__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.journeys-hero__shade {
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(8,7,6,.08), rgba(8,7,6,.74) 62%, rgba(8,7,6,.94)),
    linear-gradient(0deg, rgba(8,7,6,.62), transparent 52%);
}

.journeys-hero__copy {
  width: min(100%, 760px);
  margin-left: auto;
  padding: 150px 0 76px;
}

.journeys-hero__copy h1 {
  margin: .55rem 0 1rem;
}

.journeys-hero__copy p:not(.eyebrow) {
  max-width: 620px;
  color: rgba(255,255,255,.78);
}

.journey-intro h2 {
  margin-top: .55rem;
}

.journey-sequence {
  display: grid;
  gap: clamp(80px, 11vw, 150px);
}

.journey-entry {
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  gap: clamp(52px, 8vw, 110px);
  align-items: center;
}

.journey-entry--reverse {
  grid-template-columns: .92fr 1.08fr;
}

.journey-entry--reverse .journey-entry__image {
  order: 2;
}

.journey-entry--reverse .journey-entry__copy {
  order: 1;
}

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

.journey-entry__copy {
  max-width: 620px;
}

.journey-entry__copy h2 {
  margin: .55rem 0 1rem;
}

.journey-entry__copy p:not(.eyebrow) {
  color: var(--color-muted);
}

.journey-paintings {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 1.4rem;
}

.journey-paintings a {
  padding: 7px 10px;
  border: 1px solid var(--color-line);
  font-size: .58rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* ---------- Studio ---------- */
.studio-hero {
  padding: clamp(90px, 10vw, 150px) 0;
  background: var(--color-dark);
  color: var(--color-white);
}

.studio-hero__grid {
  display: grid;
  grid-template-columns: minmax(0,.88fr) minmax(0,1.12fr);
  gap: clamp(60px,8vw,120px);
  align-items: center;
}

.studio-hero__copy {
  max-width: 650px;
}

.studio-hero__copy h1 {
  margin: .55rem 0 1.1rem;
}

.studio-hero__copy p:not(.eyebrow) {
  color: rgba(255,255,255,.67);
}

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

.studio-process h2 {
  margin-top: .55rem;
}

.studio-steps {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 1px;
  margin-top: 58px;
  background: var(--color-line);
}

.studio-step {
  min-height: 310px;
  padding: clamp(28px,3vw,44px);
  background: var(--color-paper);
}

.studio-step span {
  color: var(--color-accent);
  font-size: .61rem;
  font-weight: 600;
  letter-spacing: .15em;
}

.studio-step h3 {
  margin: 2rem 0 .9rem;
  font-size: 2.3rem;
}

.studio-step p {
  color: var(--color-muted);
}

.studio-band {
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  min-height: 720px;
  background: #e9dfd1;
}

.studio-band__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.studio-band__copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(54px,7vw,100px);
}

.studio-band__copy h2 {
  margin: .55rem 0 1rem;
}

.studio-band__copy p:not(.eyebrow) {
  max-width: 620px;
  color: #5f584f;
}

.studio-gallery {
  background: var(--color-paper);
}

.studio-gallery__head {
  max-width: 820px;
  margin-bottom: 46px;
}

.studio-gallery__head h2 {
  margin-top: .55rem;
}

.studio-gallery__grid {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 24px;
}

.studio-gallery__grid img {
  width: 100%;
  height: 100%;
  min-height: 500px;
  object-fit: cover;
}

/* ---------- Responsive ---------- */
@media (max-width: 1050px) {
  .editorial-hero__grid,
  .about-story,
  .journey-entry,
  .journey-entry--reverse,
  .studio-hero__grid,
  .studio-band {
    grid-template-columns: 1fr;
  }

  .journey-entry--reverse .journey-entry__image,
  .journey-entry--reverse .journey-entry__copy {
    order: initial;
  }

  .about-story__image,
  .studio-band__image {
    min-height: 560px;
  }

  .about-principles__grid,
  .studio-steps {
    grid-template-columns: 1fr;
  }

  .studio-gallery__grid {
    grid-template-columns: 1fr;
  }

  .studio-gallery__grid img {
    min-height: 420px;
  }
}

@media (max-width: 700px) {
  .editorial-hero,
  .studio-hero {
    padding-top: 62px;
  }

  .journeys-hero {
    min-height: 720px;
  }

  .journeys-hero__shade {
    background: linear-gradient(0deg, rgba(8,7,6,.96), rgba(8,7,6,.12) 72%);
  }

  .journeys-hero__copy {
    margin-left: 0;
    padding-top: 190px;
  }

  .about-story__image,
  .studio-band__image {
    min-height: 430px;
  }

  .about-story__copy,
  .studio-band__copy {
    padding: 44px 24px 52px;
  }

  .journey-sequence {
    gap: 78px;
  }

  .journey-entry {
    gap: 28px;
  }

  .studio-gallery__grid img {
    min-height: 330px;
  }
}