/* Shared curved scale for hero statements, quotes and screen carousels. */
.tdg-dial {
  --dial-ink: 255, 255, 255;
  --dial-focus: #00d8aa;
  position: relative;
  width: min(260px, 100%);
  height: 44px;
  mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent);
}
.tdg-dial[hidden] { display: none; }
@media (pointer: coarse), (max-width: 640px) {
  .tdg-dial { touch-action: pan-y pinch-zoom; }
}
.theme-light .tdg-dial { --dial-ink: var(--ink, 28, 28, 30); --dial-focus: rgba(var(--dial-ink), .8); }
.tdg-dial-track { position: absolute; inset: 0; pointer-events: none; }
.tdg-dial-mark {
  position: absolute;
  top: 50%;
  width: 1px;
  height: 8px;
  transform: translate(-50%, -50%);
  background: rgba(var(--dial-ink), .28);
}
.tdg-dial-mark[hidden] { display: none; }
.tdg-dial-mark.is-major { height: 20px; background: rgba(var(--dial-ink), .55); }
.tdg-dial-mark.is-current { height: 25px; background: rgb(var(--dial-ink)); }
.tdg-dial-step {
  position: absolute;
  inset: 0 auto 0 0;
  width: 50%;
  border: 0;
  padding: 0;
  background: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.tdg-dial-step[data-step="1"] { left: 50%; }
.tdg-dial-step:disabled { cursor: default; }
.tdg-dial-step:focus-visible { outline: 1px solid var(--dial-focus); outline-offset: -3px; border-radius: 4px; }
.tdg-dial:has(.tdg-dial-step:hover:not(:disabled)) .tdg-dial-mark.is-major:not(.is-current) { background: rgba(var(--dial-ink), .75); }
.tdg-dial-status { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
