/* FTN Platform Website — homepage "What do you want to do?" outcome pathways section.
   Sits on the same approved dark ecosystem-home surface as the hero/intro/directory (see
   ecosystem-homepage-refinement.css) — not a new light/dark boundary. */

.homepage-pathways {
  background: #030304;
  color: #fff;
  padding: clamp(56px, 7vw, 96px) 0;
  border-top: 1px solid rgba(255, 255, 255, .11);
  border-bottom: 1px solid rgba(255, 255, 255, .11);
}

.homepage-pathways__intro {
  max-width: 760px;
  margin-bottom: clamp(36px, 5vw, 56px);
}

.homepage-pathways__intro > span {
  display: block;
  margin-bottom: 16px;
  color: #ff2532;
  font: 700 11px/1 Inter, sans-serif;
  letter-spacing: .2em;
}

.homepage-pathways__intro h2 {
  margin: 0;
  color: #fff;
  font: 600 clamp(1.8rem, 2.6vw, 2.6rem)/1.15 Montserrat, Inter, sans-serif;
}

.pathway-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .12);
}

.pathway-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 168px;
  padding: 24px 20px;
  background: #09090b;
  color: #fff;
  text-decoration: none;
  border: none;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
}

.pathway-card__verb {
  color: #ff2532;
  font: 800 11px/1 Inter, sans-serif;
  letter-spacing: .14em;
}

.pathway-card h3 {
  margin: 0;
  color: #fff;
  font: 700 17px/1.3 Montserrat, Inter, sans-serif;
}

.pathway-card__product {
  margin: auto 0 0;
  color: #979aa3;
  font-size: 12px;
  letter-spacing: .02em;
}

.pathway-card:focus-visible {
  outline: 2px solid #ff2532;
  outline-offset: -2px;
}

@media (max-width: 1100px) {
  .pathway-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 480px) {
  .pathway-grid {
    grid-template-columns: 1fr;
  }
}