.fomster-intro-block {
  padding-top: 12px;
}

.fomster-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 22px;
}

.fomster-section-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 28px;
  margin-bottom: 28px;
}

.fomster-section-head h2 {
  font-size: clamp(1.9rem, 3.4vw, 2.8rem);
  max-width: 16ch;
}

#personas,
#empresas,
#orientacion {
  scroll-margin-top: 100px;
}

.fomster-intro {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 48px;
  align-items: center;
  padding-bottom: 20px;
}

.fomster-intro .fomster-frame {
  aspect-ratio: 4 / 3;
}

.fomster-lines {
  display: grid;
  gap: 0;
}

.fomster-line {
  display: grid;
  grid-template-columns: 88px 1fr auto;
  gap: 18px;
  align-items: center;
  padding: 28px 0;
  border-top: 1px solid var(--fomster-line);
}

.fomster-line:last-child {
  border-bottom: 1px solid var(--fomster-line);
}

.fomster-line-index {
  font-family: var(--fomster-font-display);
  font-size: 1.8rem;
  letter-spacing: -0.04em;
  color: var(--fomster-burgundy);
}

.fomster-line h2 {
  font-size: clamp(1.5rem, 2.4vw, 2rem);
  margin-bottom: 6px;
}

.fomster-line p {
  color: var(--fomster-olive);
  max-width: 40rem;
}

.fomster-line i {
  font-size: 1.3rem;
  color: var(--fomster-brass);
}

.fomster-audience {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.fomster-audience-card {
  padding: 28px;
  border-radius: 12px;
  background: var(--fomster-paper);
  border: 1px solid var(--fomster-line);
  box-shadow: var(--fomster-shadow);
}

.fomster-audience-card:first-child {
  background: var(--fomster-olive);
  color: var(--fomster-paper);
  border-color: transparent;
}

.fomster-audience-card h2 {
  font-size: 1.7rem;
  margin: 14px 0 10px;
}

.fomster-audience-card p {
  color: var(--fomster-olive);
}

.fomster-audience-card:first-child p {
  color: rgba(251, 247, 241, 0.88);
}

.fomster-audience-card i {
  font-size: 1.3rem;
  color: var(--fomster-burgundy);
}

.fomster-audience-card:first-child i {
  color: var(--fomster-brass-bright);
}

.fomster-boundary {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 28px;
  align-items: start;
}

.fomster-boundary h2 {
  font-size: clamp(1.8rem, 3vw, 2.6rem);
}

.fomster-boundary p + p {
  margin-top: 12px;
}

.fomster-boundary a {
  color: var(--fomster-brass-bright);
}

@media (max-width: 860px) {
  .fomster-intro,
  .fomster-audience,
  .fomster-boundary,
  .fomster-line {
    grid-template-columns: 1fr;
  }

  .fomster-line i {
    display: none;
  }
}