/* ==========================================================================
   SF PRO DISPLAY - EMBEDDED WEB FONTS
   Weights: 100 (Thin) to 900 (Black), Normal & Italic
   ========================================================================== */

/* Thin - 100 Normal */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Thin.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Thin.woff') format('woff');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Thin.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Thin.woff') format('woff');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

/* Thin - 100 Italic */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-ThinItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-ThinItalic.woff') format('woff');
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-ThinItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-ThinItalic.woff') format('woff');
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}

/* Ultralight - 200 Normal */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Ultralight.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Ultralight.woff') format('woff');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Ultralight.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Ultralight.woff') format('woff');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

/* Ultralight - 200 Italic */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-UltralightItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-UltralightItalic.woff') format('woff');
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-UltralightItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-UltralightItalic.woff') format('woff');
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}

/* Light - 300 Normal */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Light.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Light.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

/* Light - 300 Italic */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-LightItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-LightItalic.woff') format('woff');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-LightItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-LightItalic.woff') format('woff');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

/* Regular - 400 Normal */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Regular.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Regular.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Regular - 400 Italic */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-RegularItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-RegularItalic.woff') format('woff');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-RegularItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-RegularItalic.woff') format('woff');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

/* Medium - 500 Normal */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Medium.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Medium.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* Medium - 500 Italic */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-MediumItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-MediumItalic.woff') format('woff');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-MediumItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-MediumItalic.woff') format('woff');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

/* Semibold - 600 Normal */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Semibold.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Semibold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Semibold.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Semibold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* Semibold - 600 Italic */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-SemiboldItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-SemiboldItalic.woff') format('woff');
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-SemiboldItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-SemiboldItalic.woff') format('woff');
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}

/* Bold - 700 Normal */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Bold.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Bold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Bold.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Bold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Bold - 700 Italic */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-BoldItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-BoldItalic.woff') format('woff');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-BoldItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-BoldItalic.woff') format('woff');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

/* Heavy - 800 Normal */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Heavy.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Heavy.woff') format('woff');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Heavy.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Heavy.woff') format('woff');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

/* Heavy - 800 Italic */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-HeavyItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-HeavyItalic.woff') format('woff');
  font-weight: 800;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-HeavyItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-HeavyItalic.woff') format('woff');
  font-weight: 800;
  font-style: italic;
  font-display: swap;
}

/* Black - 900 Normal */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Black.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Black.woff') format('woff');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-Black.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-Black.woff') format('woff');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/* Black - 900 Italic */
@font-face {
  font-family: 'SF Pro Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-BlackItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-BlackItalic.woff') format('woff');
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'SF-Pro-Display';
  src: url('../fonts/SF-Pro-Display/SF-Pro-Display-BlackItalic.woff2') format('woff2'),
       url('../fonts/SF-Pro-Display/SF-Pro-Display-BlackItalic.woff') format('woff');
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}

/* ==========================================================================
   GLOBAL TYPOGRAPHY RULES FOR THE ENTIRE WEBSITE
   ========================================================================== */
:root {
  --font-family-base: 'SF Pro Display', 'SF-Pro-Display', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

html,
body,
button,
input,
optgroup,
select,
textarea,
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
p, span, a, li, ul, ol, label, dt, dd,
table, th, td, caption,
.title, .product-title, .entry, .desc, .price, .item, .menu,
.navbar, .nav, .btn, .breadcrumb, .footer {
  font-family: var(--font-family-base) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Explicitly preserve FontAwesome & Glyphicon icons so they never break */
.fa, .fas, .far, .fal, .fad, .fab,
[class*="fa-"], [class^="fa-"],
.glyphicon, [class*="glyphicon-"] {
  font-family: "Font Awesome 5 Free", "Font Awesome 5 Brands", "FontAwesome", "Glyphicons Halflings" !important;
}

i.fab, span.fab {
  font-family: "Font Awesome 5 Brands" !important;
}

/* Navigation Menu - Bold SF Pro Display */
.menu-bar .menu > li > a,
#header .menu > li > a {
  font-weight: 700 !important;
  letter-spacing: 0.2px;
}

.menu .sub li a,
.menu .sub2 ul li a span {
  font-weight: 600 !important;
}

/* Header Links & Social Icons - Single Row & Vertically Centered */
#header .top-header .header-right {
  display: flex !important;
  align-items: center !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 20px;
}

#header .top-header .help-link {
  display: inline-flex !important;
  align-items: center !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

#header .top-header .help-link li {
  display: inline-flex !important;
  align-items: center !important;
  white-space: nowrap !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  line-height: 1 !important;
}

#header .top-header .help-link li:first-child {
  border-right: 1px solid rgba(255, 255, 255, 0.7) !important;
  padding-right: 10px !important;
  margin-right: 10px !important;
}

#header .top-header .help-link li a {
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  white-space: nowrap !important;
  text-decoration: none !important;
}

#header .top-header .social {
  display: inline-flex !important;
  align-items: center !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  line-height: 1 !important;
  gap: 12px;
}

#header .top-header .social li {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  line-height: 1 !important;
}

#header .top-header .social li a {
  color: #ffffff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  line-height: 1 !important;
  text-decoration: none !important;
}