/* Radix Colors Gray: https://www.radix-ui.com/colors
   Local semantic aliases keep every public surface on the same scale. */
:root {
  --gray-1: #fcfcfc;
  --gray-2: #f9f9f9;
  --gray-3: #f0f0f0;
  --gray-4: #e8e8e8;
  --gray-5: #e0e0e0;
  --gray-6: #d9d9d9;
  --gray-7: #cecece;
  --gray-8: #bbbbbb;
  --gray-9: #8d8d8d;
  --gray-10: #838383;
  --gray-11: #646464;
  --gray-12: #202020;
  --paper: var(--gray-1);
  --paper-deep: var(--gray-3);
  --sheet: #fff;
  --ink: var(--gray-12);
  --quiet: var(--gray-11);
  --rule: var(--gray-6);
  --accent: var(--gray-12);
  --accent-deep: #111;
  --on-accent: var(--gray-1);
  --on-accent-quiet: var(--gray-7);
  --focus: var(--gray-11);
  --motion-fast: 140ms;
  --motion-base: 240ms;
  --motion-ease: cubic-bezier(.22, 1, .36, 1);
}

.foot {
  align-items: baseline;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  font-variant-numeric: lining-nums proportional-nums;
}

.foot a {
  font: inherit;
  vertical-align: baseline;
  text-decoration-thickness: 1px;
  text-underline-offset: .18em;
}

.foot-identity,
.foot-links,
.foot-contacts {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 16px;
  min-width: 0;
}

.foot-identity > span,
.foot-links > a,
.foot-contacts > a {
  display: block;
  white-space: nowrap;
}

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
  a, button, summary {
    transition: color var(--motion-fast), background-color var(--motion-fast),
      border-color var(--motion-fast), text-decoration-color var(--motion-fast),
      opacity var(--motion-fast), transform var(--motion-fast) var(--motion-ease);
  }
  input, textarea, select {
    transition: border-color var(--motion-fast), background-color var(--motion-fast),
      box-shadow var(--motion-fast);
  }
  .primary:not(:disabled):hover, .secondary:not(:disabled):hover, .cta:hover {
    transform: translateY(-1px);
  }
  .primary:not(:disabled):active, .secondary:not(:disabled):active, .cta:active {
    transform: translateY(0);
  }
  [data-page-enter] { animation: dt-page-enter 300ms var(--motion-ease) both; }
  [data-motion-pending] { opacity: 0; transform: translateY(14px); }
  @keyframes dt-page-enter {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
  }
}