@font-face {
    font-family: 'IBM Plex Sans';
    src: url('/wp-content/themes/timken/assets/fonts/IBMPlexSans-VariableFont_wdth,wght.ttf') format('truetype');
    font-weight: 300 400 500 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'IBM Plex Sans';
    src: url('/wp-content/themes/timken/assets/fonts/IBMPlexSans-Italic-VariableFont_wdth,wght.ttf') format('truetype');
    font-weight: 300 400 500 700;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'IBM Plex Mono';
    src: url('/wp-content/themes/timken/assets/fonts/IBMPlexMono-Light.ttf') format('truetype');
    font-weight: 300;
    font-display: swap;
}
@font-face {
    font-family: 'IBM Plex Mono';
    src: url('/wp-content/themes/timken/assets/fonts/IBMPlexMono-LightItalic.ttf') format('truetype');
    font-style: italic;
    font-weight: 300;
    font-display: swap;
}
@font-face {
    font-family: 'IBM Plex Mono';
    src: url('/wp-content/themes/timken/assets/fonts/IBMPlexMono-Regular.ttf') format('truetype');
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: 'IBM Plex Mono';
    src: url('/wp-content/themes/timken/assets/fonts/IBMPlexMono-Italic.ttf') format('truetype');
    font-style: italic;
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: 'IBM Plex Mono';
    src: url('/wp-content/themes/timken/assets/fonts/IBMPlexMono-Medium.ttf') format('truetype');
    font-weight: 500;
    font-display: swap;
}
@font-face {
    font-family: 'IBM Plex Mono';
    src: url('/wp-content/themes/timken/assets/fonts/IBMPlexMono-MediumItalic.ttf') format('truetype');
    font-style: italic;
    font-weight: 500;
    font-display: swap;
}
@font-face {
    font-family: 'IBM Plex Mono';
    src: url('/wp-content/themes/timken/assets/fonts/IBMPlexMono-Bold.ttf') format('truetype');
    font-weight: 700;
    font-display: swap;
}
@font-face {
    font-family: 'IBM Plex Mono';
    src: url('/wp-content/themes/timken/assets/fonts/IBMPlexMono-BoldItalic.ttf') format('truetype');
    font-style: italic;
    font-weight: 700;
    font-display: swap;
}

html {
  font-size: 100%;
}

:root {
    /* Font families */
    --font-text: 'IBM Plex Sans', 'Roboto', 'Helvetica Neue', 'Arial';
    --font-emphasis: 'IBM Plex Sans', 'Roboto', 'Helvetica Neue', 'Arial';
    --font-code: "IBM Plex Mono", "Roboto Mono", monospace;
    --font-quote: "Times New Roman", serif;
    --font-title: 'IBM Plex Sans', 'Roboto', 'Helvetica Neue', 'Arial';

    /* Font weights */
    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-bold: 700;

    /* Typography scale */
    --font-size-c1: 0.75rem;                /* C1 Captions and notes - 12px */
    --font-size-p2: 0.875rem;               /* P2 Compact UI and small body text - 14px */
    --font-size-p1: 1rem;                   /* P1 Standard body text - 16px */

    --font-size-h6: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);   /* H6 Subtitles and least-important headings - 18px */
    --font-size-h5: clamp(1.125rem, 1rem + 0.4vw, 1.25rem);    /* H5 Minor section labels - 20px */
    --font-size-h4: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);    /* H4 Sub-subsection headings - 24px */
    --font-size-h3: clamp(1.5rem, 1.25rem + 1vw, 1.75rem);     /* H3 Subsection headings - 28px */
    --font-size-h2: clamp(1.75rem, 1.4rem + 1.4vw, 2.1875rem); /* H2 Major section titles - 35px */
    --font-size-h1: clamp(2rem, 1.5rem + 2vw, 2.625rem);       /* H1 Page headings, xlarge design elements - 42px */

    /* Letter spacing */
    --letter-spacing-c1:0.0025em;
    --letter-spacing-p2:0em;
    --letter-spacing-p1:0em;

    --letter-spacing-h6:-0.0025em;
    --letter-spacing-h5:-0.005em;
    --letter-spacing-h4:-0.005em;
    --letter-spacing-h3:-0.005em;
    --letter-spacing-h2:-0.005em;
    --letter-spacing-h1:-0.005em;

    /* Line height */
    --line-height-c1: 1rem;                   /* C1 - 16px */
    --line-height-p2: 1.25rem;                /* P2 - 20px */
    --line-height-p1: 1.5rem;                 /* P1 - 24px */

    --line-height-h6: clamp(1.5rem, 1.4rem + 0.4vw, 1.625rem);   /* H6 - 26px */
    --line-height-h5: clamp(1.5rem, 1.4rem + 0.4vw, 1.75rem);    /* H5 - 28px */
    --line-height-h4: clamp(1.625rem, 1.5rem + 0.5vw, 1.875rem); /* H4 - 30px */
    --line-height-h3: clamp(2rem, 1.75rem + 0.8vw, 2.25rem);     /* H3 - 36px */
    --line-height-h2: clamp(2.25rem, 2rem + 1.2vw, 2.5rem);      /* H2 - 40px */
    --line-height-h1: clamp(2.5rem, 2rem + 2vw, 3rem);           /* H1 - 48px */

    --text-uppercase: uppercase;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-title);
}

small{
    font-size: var(--font-size-p2);
    line-height: var(--line-height-p2);
}

b,
strong {
    font-family: var(--font-text);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-p1);
}

p,
table,
ul li,
ol li {
    font-family: var(--font-text);
    font-weight: var(--font-weight-regular);
    font-size: var(--font-size-p1);
    line-height: var(--line-height-p1);
    letter-spacing: var(--letter-spacing-p1);
}

button,
input,
textarea,
select{
    font-family: var(--font-text);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-p1);
    letter-spacing: var(--letter-spacing-p1);
}
blockquote, 
q{
    font-family: var(--font-quote);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-p1);
    letter-spacing: var(--letter-spacing-p1);
}
code, 
pre{
     font-family: var(--font-code);
     font-weight: var(--font-weight-regular);
     line-height: var(--line-height-p1);
     letter-spacing: var(--letter-spacing-p1);
}

body{
    font-family: var(--font-text);
    font-weight: var(--font-weight-regular);
    font-size: var(--font-size-p1);
    line-height: var(--line-height-p1);
    letter-spacing: var(--letter-spacing-p1);
}

h1, .et-db #et-boc .et-l .et_pb_section h1{
    font-size: var(--font-size-h1);
    line-height: var(--line-height-h1);
    letter-spacing: var(--letter-spacing-h1);
    font-weight: var(--font-weight-regular);
}

h2,
.et-db #et-boc .et-l .et_pb_section h2,
.et-db #et-boc .et-l .et_pb_blurb_content .et_pb_blurb_container h2 {
    font-size: var(--font-size-h2);
    line-height: var(--line-height-h2);
    letter-spacing: var(--letter-spacing-h2);
    font-weight: var(--font-weight-regular);
}

h3, .et-db #et-boc .et-l .et_pb_section h3 {
    font-size: var(--font-size-h3);
    line-height: var(--line-height-h3);
    letter-spacing: var(--letter-spacing-h3);
    font-weight: var(--font-weight-regular);
}

h4,
.et-db #et-boc .et-l .et_pb_section h4,
.et-db #et-boc .et-l .et_pb_team_member .et_pb_team_member_description h4 {
    font-size: var(--font-size-h4);
    line-height: var(--line-height-h4);
    letter-spacing: var(--letter-spacing-h4);
    font-weight: var(--font-weight-regular);
}

h5, .et-db #et-boc .et-l .et_pb_section h5 {
    font-size: var(--font-size-h5);
    line-height: var(--line-height-h5);
    letter-spacing: var(--letter-spacing-h5);
    font-weight: var(--font-weight-regular);
}

h6, .et-db #et-boc .et-l .et_pb_section h6 {
    font-size: var(--font-size-h6);
    line-height: var(--line-height-h6);
    letter-spacing: var(--letter-spacing-h6);
    font-weight: var(--font-weight-regular);
}
