/* Tool Park: the approved typing animation, isolated from other page sections. */
.hero-brand.tp-since-card {
  --tp-since-bg: #101013;
  --tp-since-text: #f5f5f6;
  --tp-since-red: var(--red, #f01938);
  container-type: inline-size;
  position: relative;
  display: grid;
  align-items: center;
  min-width: 0;
  min-height: 360px;
  padding: 0;
  overflow: hidden;
  border-radius: 14px;
  background: var(--tp-since-bg);
  color: var(--tp-since-text);
  animation: none;
}
.tp-since-card .tp-since-type {
  grid-area: 1 / 1;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  margin: 0;
  padding: 54px 34px;
  font-family: 'Golos Text', sans-serif;
  font-size: clamp(28px, 3.8vw, 64px);
  font-size: clamp(28px, 11.6cqw, 88px);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -.035em;
  text-align: left;
  text-transform: none;
}
.tp-since-card .tp-since-type.is-active { opacity: 1; visibility: visible; }
.tp-since-card .tp-since-assortment { font-size: clamp(26px, 10.5cqw, 80px); }
.tp-since-card .tp-since-location {
  --tp-location-inset: 68px;
  min-width: 0;
  font-size: clamp(1rem, 2vw, 4.25rem);
  font-size: clamp(1rem, calc((100cqw - var(--tp-location-inset)) / 14), 4.25rem);
}
.tp-since-card .tp-since-static-facts { display: none; }
.tp-since-card .tp-since-line { display: block; white-space: nowrap; }
.tp-since-card .tp-since-line + .tp-since-line { margin-top: .08em; }
.tp-since-card .tp-since-year { color: var(--tp-since-red); }
.tp-since-card .tp-since-glyph {
  position: relative;
  display: inline-block;
  white-space: pre;
  transition: opacity 145ms ease-out, transform 145ms cubic-bezier(.16,1,.3,1), filter 145ms ease-out;
}
.tp-since-card.tp-since-typing .tp-since-glyph {
  opacity: 0;
  filter: blur(5px);
  transform: translateY(.06em);
}
.tp-since-card.tp-since-typing .tp-since-glyph.is-visible {
  opacity: 1;
  filter: blur(0);
  transform: translateY(0);
}
.tp-since-card .tp-since-glyph.is-cursor::after {
  content: '';
  position: absolute;
  top: .13em;
  left: calc(100% + .065em);
  width: .042em;
  height: .84em;
  background: var(--tp-since-red);
  animation: tp-since-caret 850ms steps(1,end) infinite;
}
.tp-since-card.is-resting .tp-since-glyph.is-cursor::after { animation-duration: 1100ms; }
.tp-since-card.is-dimming .tp-since-type.is-active { opacity: 0; transition: opacity 320ms ease-out; }
.tp-since-card.is-paused .tp-since-glyph.is-cursor::after { animation-play-state: paused; }
.tp-since-card ::selection { background: var(--tp-since-red); color: var(--tp-since-text); }
@keyframes tp-since-caret { 0%,55% { opacity: 1; } 56%,100% { opacity: 0; } }
@media (max-width: 760px) {
  .hero-brand.tp-since-card { display: grid; min-height: 300px; }
  .tp-since-card .tp-since-type { padding: 44px 24px; }
  .tp-since-card .tp-since-location { --tp-location-inset: 48px; }
}
@media (max-width: 380px) {
  .hero-brand.tp-since-card { min-height: 270px; }
  .tp-since-card .tp-since-type { padding-inline: 18px; }
  .tp-since-card .tp-since-location { --tp-location-inset: 36px; }
}
@media (prefers-reduced-motion: reduce) {
  .tp-since-card .tp-since-glyph { transition: none; }
  .tp-since-card.tp-since-typing .tp-since-glyph { opacity: 1; filter: none; transform: none; }
  .tp-since-card.is-dimming .tp-since-type.is-active { opacity: 1; }
  .tp-since-card .tp-since-glyph.is-cursor::after { display: none; }
  .tp-since-card .tp-since-type.is-active { padding-bottom: 92px; }
  .hero .tp-since-card .tp-since-static-facts { display: block; position: absolute; inset: auto 24px 20px; margin: 0; font-size: 13px; line-height: 1.5; color: #d7d7da; }
}
