:root {
  --pfx-white: #fff;
  --pfx-ink: #1d1d1f;
  --pfx-bg: #050506;
  --pfx-bg-alt: #0d0d10;
  --pfx-bg-light: #f5f5f7;
  --pfx-surface: #151519;
  --pfx-surface-raised: #1c1c21;
  --pfx-surface-feature: #111115;
  --pfx-surface-image: #1d1d22;
  --pfx-text-on-dark: #f5f5f7;
  --pfx-text-on-light: var(--pfx-ink);
  --pfx-muted-on-dark: #a1a1aa;
  --pfx-muted-on-light: #6e6e73;
  --pfx-text: var(--pfx-text-on-dark);
  --pfx-muted: var(--pfx-muted-on-dark);
  --pfx-text-secondary: #a7adb8;
  --pfx-text-lead: #b8b8c0;
  --pfx-text-summary: #a7a7af;
  --pfx-text-body: #d6d6dc;
  --pfx-text-detail: #c8c8cf;
  --pfx-link-on-dark: #ff4fc0;
  --pfx-link-on-light: #b0006d;
  --pfx-link: var(--pfx-link-on-dark);
  --pfx-accent: #d60085;
  --pfx-accent-hover: #c00077;
  --pfx-accent-bright: #ff4fc0;
  --pfx-error: #ff9aa5;
  --pfx-success: #75d8ab;
  --pfx-border: rgba(255, 255, 255, .1);
  --pfx-border-control: rgba(255, 255, 255, .12);
  --pfx-border-accent: rgba(214, 0, 133, .45);
  --pfx-focus: var(--pfx-white);
  --pfx-focus-shadow: var(--pfx-bg);

  --pfx-font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif;
  --pfx-type-caption: .75rem;
  --pfx-type-label: .82rem;
  --pfx-type-body: 1rem;
  --pfx-type-card-title: 1.55rem;
  --pfx-type-hero: clamp(3.5rem, 7vw, 6.25rem);
  --pfx-weight-medium: 600;
  --pfx-weight-semibold: 650;
  --pfx-weight-bold: 700;
  --pfx-leading-body: 1.65;
  --pfx-leading-copy: 1.55;
  --pfx-leading-heading: 1.08;
  --pfx-leading-hero: 1.02;
  --pfx-tracking-heading: -.03em;
  --pfx-tracking-hero: -.045em;
  --pfx-tracking-eyebrow: .015em;

  --pfx-space-1: .25rem;
  --pfx-space-2: .5rem;
  --pfx-space-3: .75rem;
  --pfx-space-4: 1rem;
  --pfx-space-5: 1.25rem;
  --pfx-space-6: 1.5rem;
  --pfx-space-8: 2rem;
  --pfx-space-12: 3rem;
  --pfx-space-section: 8rem;
  --pfx-space-feature-section: 8rem;
  --pfx-space-panel: 7rem;

  --pfx-radius-control: .75rem;
  --pfx-radius-sheet: 1.125rem;
  --pfx-radius-search: 1.25rem;
  --pfx-radius-list-card: 1.375rem;
  --pfx-radius-photo: 1.5rem;
  --pfx-radius-card: 1.75rem;
  --pfx-radius-package: 2rem;
  --pfx-radius-panel: 2.375rem;
  --pfx-radius-pill: 999px;
  --pfx-radius: var(--pfx-radius-card);

  --pfx-shadow-overlay: 0 30px 80px rgba(0, 0, 0, .36);
  --pfx-shadow-card-light: 0 4px 20px rgba(0, 0, 0, .035);
  --pfx-shadow-card-light-hover: 0 24px 60px rgba(0, 0, 0, .1);
  --pfx-shadow-card-hover: 0 12px 32px rgba(0, 0, 0, .16);
  --pfx-shadow-search: 0 4px 24px rgba(0, 0, 0, .12);
  --pfx-shadow-store: 0 2px 8px rgba(0, 0, 0, .12);
  --pfx-shadow: var(--pfx-shadow-overlay);

  --pfx-motion-fast: .15s;
  --pfx-motion-press: .08s;
  --pfx-motion-control: .2s;
  --pfx-motion-card: .3s;
  --pfx-motion-feature: .35s;
  --pfx-ease-standard: cubic-bezier(.2, .0, .2, 1);
  --pfx-ease-card: cubic-bezier(.2, .75, .25, 1);
}

@media (max-width: 991.98px) {
  :root {
    --pfx-space-section: 6rem;
    --pfx-type-hero: clamp(2.75rem, 8vw, 5.5rem);
  }
}

@media (max-width: 767.98px) {
  :root {
    --pfx-space-section: 5rem;
    --pfx-space-feature-section: 5rem;
    --pfx-space-panel: 5rem;
    --pfx-radius-panel: var(--pfx-radius-card);
    --pfx-type-hero: clamp(2.25rem, 9vw, 4rem);
    --pfx-tracking-hero: -.04em;
  }
}
