@font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Bold"), local("SFProDisplay-Bold"), url(fonts/SFProDisplay-Bold.woff2) format("woff2");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Black"), local("SFProDisplay-Black"), url(fonts/SFProDisplay-Black.woff2) format("woff2");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Black Italic"), local("SFProDisplay-BlackItalic"), url(fonts/SFProDisplay-BlackItalic.woff2) format("woff2");
    font-weight: 900;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Bold Italic"), local("SFProDisplay-BoldItalic"), url(fonts/SFProDisplay-BoldItalic.woff2) format("woff2");
    font-weight: bold;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Regular"), local("SFProDisplay-Regular"), url(fonts/SFProDisplay-Regular.woff2) format("woff2");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Heavy"), local("SFProDisplay-Heavy"), url(fonts/SFProDisplay-Heavy.woff2) format("woff2");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Medium Italic"), local("SFProDisplay-MediumItalic"), url(fonts/SFProDisplay-MediumItalic.woff2) format("woff2");
    font-weight: 500;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Light Italic"), local("SFProDisplay-LightItalic"), url(fonts/SFProDisplay-LightItalic.woff2) format("woff2");
    font-weight: 300;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Regular Italic"), local("SFProDisplay-RegularItalic"), url(fonts/SFProDisplay-RegularItalic.woff2) format("woff2");
    font-weight: normal;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Heavy Italic"), local("SFProDisplay-HeavyItalic"), url(fonts/SFProDisplay-HeavyItalic.woff2) format("woff2");
    font-weight: 900;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Light"), local("SFProDisplay-Light"), url(fonts/SFProDisplay-Light.woff2) format("woff2");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Medium"), local("SFProDisplay-Medium"), url(fonts/SFProDisplay-Medium.woff2) format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Semibold Italic"), local("SFProDisplay-SemiboldItalic"), url(fonts/SFProDisplay-SemiboldItalic.woff2) format("woff2");
    font-weight: 600;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Ultralight Italic"), local("SFProDisplay-UltralightItalic"), url(fonts/SFProDisplay-UltralightItalic.woff2) format("woff2");
    font-weight: 100;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Thin Italic"), local("SFProDisplay-ThinItalic"), url(fonts/SFProDisplay-ThinItalic.woff2) format("woff2");
    font-weight: 100;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Thin"), local("SFProDisplay-Thin"), url(fonts/SFProDisplay-Thin.woff2) format("woff2");
    font-weight: 100;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Semibold"), local("SFProDisplay-Semibold"), url(fonts/SFProDisplay-Semibold.woff2) format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Display";
    src: local("SF Pro Display Ultralight"), local("SFProDisplay-Ultralight"), url(fonts/SFProDisplay-Ultralight.woff2) format("woff2");
    font-weight: 100;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Black Italic"), local("SFProText-BlackItalic"), url(fonts/SFProText-BlackItalic.woff2) format("woff2");
    font-weight: 900;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Black"), local("SFProText-Black"), url(fonts/SFProText-Black.woff2) format("woff2");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Bold"), local("SFProText-Bold"), url(fonts/SFProText-Bold.woff2) format("woff2");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Heavy"), local("SFProText-Heavy"), url(fonts/SFProText-Heavy.woff2) format("woff2");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Bold Italic"), local("SFProText-BoldItalic"), url(fonts/SFProText-BoldItalic.woff2) format("woff2");
    font-weight: bold;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Medium"), local("SFProText-Medium"), url(fonts/SFProText-Medium.woff2) format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Light Italic"), local("SFProText-LightItalic"), url(fonts/SFProText-LightItalic.woff2) format("woff2");
    font-weight: 300;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Light"), local("SFProText-Light"), url(fonts/SFProText-Light.woff2) format("woff2");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Heavy Italic"), local("SFProText-HeavyItalic"), url(fonts/SFProText-HeavyItalic.woff2) format("woff2");
    font-weight: 900;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Semibold"), local("SFProText-Semibold"), url(fonts/SFProText-Semibold.woff2) format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Medium Italic"), local("SFProText-MediumItalic"), url(fonts/SFProText-MediumItalic.woff2) format("woff2");
    font-weight: 500;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Regular"), local("SFProText-Regular"), url(fonts/SFProText-Regular.woff2) format("woff2");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Semibold Italic"), local("SFProText-SemiboldItalic"), url(fonts/SFProText-SemiboldItalic.woff2) format("woff2");
    font-weight: 600;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Regular Italic"), local("SFProText-RegularItalic"), url(fonts/SFProText-RegularItalic.woff2) format("woff2");
    font-weight: normal;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Ultralight Italic"), local("SFProText-UltralightItalic"), url(fonts/SFProText-UltralightItalic.woff2) format("woff2");
    font-weight: 100;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Ultralight"), local("SFProText-Ultralight"), url(fonts/SFProText-Ultralight.woff2) format("woff2");
    font-weight: 100;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Thin Italic"), local("SFProText-ThinItalic"), url(fonts/SFProText-ThinItalic.woff2) format("woff2");
    font-weight: 100;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: "SF Pro Text";
    src: local("SF Pro Text Thin"), local("SFProText-Thin"), url(fonts/SFProText-Thin.woff2) format("woff2");
    font-weight: 100;
    font-style: normal;
    font-display: swap;
  }