/* Homepage-only composition. Shared components live in global.css. */
.home-hero {
  padding:clamp(4rem,9vw,7rem) 0;
  background:var(--color-bg-alt);
  border-bottom:1px solid var(--color-border)
}

.home-hero__grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:3rem
}

.home-hero__title {
  max-width:900px;
  margin:0 0 1.5rem
}

.home-hero__subtitle {
  max-width:560px;
  margin:0 0 2.5rem;
  font-size:1.15rem;
  line-height:1.8
}

.home-hero .cta-actions {
  justify-content:flex-start
}

.home-hero__mark {
  width:clamp(180px,24vw,320px);
  height:auto;
  justify-self:center;
  filter:drop-shadow(0 16px 30px #00000026)
}

.pillars .card h3 {
  margin-bottom:.75rem
}

.journey__grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1.25rem;
  max-width:960px;
  margin-inline:auto
}

.journey__item {
  position:relative;
  border-radius:var(--border-radius-lg);
  overflow:hidden;
  aspect-ratio:1;
  background:var(--color-primary)
}

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

.journey__caption {
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:2.5rem 1.25rem .9rem;
  background:linear-gradient(transparent,#000000b3);
  color:var(--color-white);
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase
}

.journey__quote {
  display:grid;
  place-items:center;
  padding:2rem;
  text-align:center;
  color:var(--color-white)
}

.journey__quote p {
  font-family:var(--font-heading);
  font-size:clamp(1.9rem,3vw,2.6rem);
  line-height:1;
  letter-spacing:.02em;
  color:var(--color-accent)
}

.journey__quote cite {
  display:block;
  margin-top:1rem;
  font-style:normal;
  font-size:.8rem;
  letter-spacing:.08em;
  text-transform:uppercase
}

@media(max-width:900px) {
  .home-hero__grid {
    grid-template-columns:1fr;
    text-align:center
  }

  .home-hero__title,.home-hero__subtitle {
    margin-inline:auto
  }

  .home-hero .cta-actions {
    justify-content:center
  }

  .home-hero__mark {
    order:-1
  }

}

@media(max-width:600px) {
  .journey__grid {
    grid-template-columns:1fr
  }
}
