:root {
  --color-black: #0a0a0a;
  --color-white: #ffffff;
  --color-gray-link: #cfcfcf;
  --color-gray-muted: #888888;
  --color-divider: #ffffff;

  --font-primary: "General Sans", system-ui, sans-serif;
  --font-body: "General Sans", system-ui, sans-serif;

  /* Exact from reference inspection */
  --text-xs: 12px;
  --text-nav: 14px;
  --text-announcement: 12px;
  --text-footer-link: 12px;
  --text-footer-heading: 20px;
  --text-footer-logo: 48px;
  --text-header-logo: 28px;
  --text-newsletter-input: 14px;
  --text-cart-count: 16px;

  --lh-nav: 16.8px;
  --lh-announcement: 14.4px;
  --lh-footer-heading: 24px;
  --lh-footer-logo: 57.6px;
  --lh-header-logo: 33.6px;
  --lh-newsletter-input: 16.8px;

  --container-max: 1440px;
  --container-padding: 24px;
  --content-width: calc(100% - (2 * var(--container-padding)));
  --header-height: 64px;
  --announcement-height: 40px;
  --nav-link-gap: 10px;
  --footer-link-gap: 10px;
  --footer-brand-width: 30%;
  --footer-column-width: auto;
  --footer-social-gap: 32px;
  --mega-menu-panel-width: 70%;
  --menu-image-max-width: 500px;
  --menu-image-height: 600px;
  --text-menu-link: 20px;
  --lh-menu-link: 20px;
  --menu-link-gap: 16px;
  --newsletter-gap: 40px;
  --newsletter-height: 558px;
  --footer-section-gap: 40px;
  --footer-nav-gap: 72px;

  --transition-fast: 0.2s ease;
  --transition-link: 0.3s ease;
}