/* A quiet premise, then a decisive focus on the founder. */
.portfolio-manifesto {
  container-type: inline-size;
  padding: 0 0 clamp(32px, 4vw, 56px);
}
.manifesto-title {
  text-align: center;
  font-family: var(--body);
  text-transform: none;
  color: #101828;
}
.manifesto-kicker {
  display: block;
  margin-bottom: .55em;
  color: var(--muted);
  font-size: clamp(1.375rem, 3.5vw, 3.25rem);
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -.035em;
}
.manifesto-main {
  display: flex;
  justify-content: center;
  align-items: baseline;
  font-size: clamp(2rem, 8.1vw, 8rem);
  font-weight: 650;
  line-height: 1.2;
  letter-spacing: -.055em;
}
.manifesto-founder { display: inline-block; }
.manifesto-obsessive {
  position: relative;
  display: inline-block;
  isolation: isolate;
  color: inherit;
  font-weight: 550;
  font-style: italic;
  padding: 0 .085em 0 .015em;
}
@supports (font-size: 1cqi) {
  .manifesto-main { font-size: min(8rem, 9cqi); }
}
@media (max-width: 600px) {
  .manifesto-main {
    flex-direction: column;
    align-items: center;
    font-size: 15vw;
    line-height: 1.16;
  }
  .manifesto-kicker { margin-bottom: .85em; }
  .manifesto-obsessive { margin-top: .07em; }
  @supports (font-size: 1cqi) {
    .manifesto-main { font-size: 17cqi; }
  }
}
@media (prefers-reduced-motion: no-preference) {
  .manifesto-title.is-arriving .manifesto-kicker {
    animation: manifesto-premise 1.2s cubic-bezier(.16, 1, .3, 1) both;
  }
  .manifesto-title.is-arriving .manifesto-founder {
    animation: manifesto-focus 1.4s cubic-bezier(.16, 1, .3, 1) .12s both;
  }
  .manifesto-title.is-arriving .manifesto-obsessive {
    animation: manifesto-lock 1.4s cubic-bezier(.16, 1, .3, 1) .3s both;
  }
  @keyframes manifesto-premise {
    from { opacity: 0; transform: translateY(-.4em); letter-spacing: .08em; filter: blur(5px); }
    to { opacity: 1; transform: none; letter-spacing: -.035em; filter: blur(0); }
  }
  @keyframes manifesto-focus {
    from { opacity: 0; transform: translate3d(-.22em, .4em, 0); filter: blur(12px); }
    to { opacity: 1; transform: none; filter: blur(0); }
  }
  @keyframes manifesto-lock {
    from { opacity: 0; transform: translate3d(.22em, .4em, 0) skewX(-8deg); filter: blur(12px); }
    to { opacity: 1; transform: none; filter: blur(0); }
  }
}
@media (forced-colors: active) {
  .manifesto-obsessive { text-decoration: underline; }
}
