@font-face {
    font-family: "SF Pro Text";
    font-weight: 300;
    src: local("SF Pro Text"), url(./sf-pro-text_light.woff2) format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Text";
    font-weight: 400;
    src: local("SF Pro Text"), url(./sf-pro-text_regular.woff2) format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Text";
    font-weight: 500;
    src: local("SF Pro Text"), url(./sf-pro-text_medium.woff2) format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Text";
    font-weight: 600;
    src: local("SF Pro Text"), url(./sf-pro-text_semibold.woff2) format("woff2");
    font-display: swap;
}

/* SF Pro Display */
@font-face {
    font-family: "SF Pro Display";
    font-weight: 100;
    src: local("SF Pro Display"), url(./sf-pro-display_ultralight.woff2) format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Display";
    font-weight: 200;
    src: local("SF Pro Display"), url(./sf-pro-display_thin.woff2) format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Display";
    font-weight: 300;
    src: local("SF Pro Display"), url(./sf-pro-display_light.woff2) format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Display";
    font-weight: 400;
    src: local("SF Pro Display"), url(./sf-pro-display_regular.woff2) format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Display";
    font-weight: 500;
    src: local("SF Pro Display"), url(./sf-pro-display_medium.woff2) format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Display";
    font-weight: 600;
    src: local("SF Pro Display"), url(./sf-pro-display_semibold.woff2) format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Display";
    font-weight: 800;
    src: local("SF Pro Display"), url(./sf-pro-display_black.woff2) format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Display";
    font-weight: 900;
    src: local("SF Pro Display"), url(./sf-pro-display_black.woff2) format("woff2");
    font-display: swap;
}

/* SF Pro Icon */
@font-face {
    font-family: "SF Pro Icons";
    font-weight: 100;
    src: local("SF Pro Icons"), url(./sf-pro-icons_ultralight.woff2) format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Icons";
    font-weight: 200;
    src: local("SF Pro Icons"), url(./sf-pro-icons_thin.woff2) format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Icons";
    font-weight: 300;
    src: local("SF Pro Icons"), url(./sf-pro-icons_light.woff2) format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Icons";
    font-weight: 400;
    src: local("SF Pro Icons"), url(./sf-pro-icons_regular.woff2) format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Icons";
    font-weight: 600;
    src: local("SF Pro Icons"), url(./sf-pro-icons_semibold.woff2) format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Icons";
    font-weight: 700;
    src: local("SF Pro Icons"), url(./sf-pro-icons_bold.woff2) format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Icons";
    font-weight: 800;
    src: local("SF Pro Icons"), url(./sf-pro-icons_heavy.woff2) format("woff2");
    font-display: swap;
}

@font-face {
    font-family: "SF Pro Icons";
    font-weight: 900;
    src: local("SF Pro Icons"), url(./sf-pro-icons_black.woff2) format("woff2");
    font-display: swap;
}