/* generated by tools/tiles/sync.mjs from tools/tiles/runtime/hover-type.css (comments removed): do not edit */
.card {
  --ht-ink: #1A1814;
  --ht-cream: #F7F0E6;
  --ht-cue: #5A5345;
  --ht-sand: 230, 212, 182;
}
.cards-section__grid .card { -webkit-tap-highlight-color: transparent; }
.card[data-kind="text"] .card__text { position: relative; z-index: 2; inset: auto; }
.ht-layer {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  font-family: var(--font-display, 'Space Grotesk', system-ui, sans-serif);
  font-weight: 300;
  line-height: 1;
  color: var(--ht-ink);
  white-space: pre;
}
.ht-g {
  position: absolute;
  left: 0;
  top: 0;
  font-weight: 300;
}
.card.ht-live .card__headline { color: transparent; }
.card.ht-on .card__headline,
.card.ht-press .card__headline {
  text-shadow: 0.055em 0 0 var(--ht-cream), -0.055em 0 0 var(--ht-cream), 0 0.05em 0 var(--ht-cream),
               0.04em 0.04em 0 var(--ht-cream), -0.04em 0.04em 0 var(--ht-cream);
}
.ht-under {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
  height: 1px;
  background: var(--ht-ink);
  transform-origin: 0 50%;
  transform: scaleX(0);
  pointer-events: none;
}
.ht-cue {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 0.7em;
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--ht-cue);
  opacity: 0;
  pointer-events: none;
}
.ht-cue[hidden] { display: none; }
.ht-cue__arrow {
  width: 1.8em;
  height: 0.9em;
  flex: none;
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.25;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.ht-cue__shaft { stroke-dasharray: 18 18; }
.ht-cue__head { stroke-dasharray: 12 12; }
.ht-cue--soon .ht-cue__arrow { display: none; }
.cards-section__grid .card__body em {
  background-image: linear-gradient(rgba(var(--ht-sand), var(--ht-mark-a, 0)), rgba(var(--ht-sand), var(--ht-mark-a, 0)));
  background-repeat: no-repeat;
  background-position: 0 74%;
  background-size: var(--ht-mark, 0%) 0.5em;
}
.cards-section__grid .card:focus:not(:focus-visible) { outline: none; }
.cards-section__grid .card:focus-visible {
  outline: 2px solid var(--ht-ink);
  outline-offset: 3px;
}
@media (forced-colors: active) {
  .ht-layer { display: none; }
  .card.ht-live .card__headline { color: CanvasText; }
}
