/*
 * AVL Typography Override
 * Loaded after Pixio style.css so these rules win in the cascade.
 * Goal: enforce Outfit on every rendered glyph and give descenders
 *       (g, j, p, q, y) enough vertical room via line-height + overflow.
 *
 * Icon safety: rules are scoped to text-bearing elements only.
 * Font Awesome / Feather / Flaticon icon selectors are NOT touched.
 */

/* 1. Base text */
html,
body {
  font-family: var(--font-outfit, "Outfit"), system-ui, -apple-system, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* 2. All heading levels */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-outfit, "Outfit"), system-ui, sans-serif !important;
  line-height: 1.25 !important;
  overflow: visible !important;
}

/* Pixio theme commonly uses .title and .dz-title on heading spans */
.title,
.dz-title,
.sub-title {
  font-family: var(--font-outfit, "Outfit"), system-ui, sans-serif !important;
  line-height: 1.3 !important;
  overflow: visible !important;
}

/* 3. Buttons and nav text */
button,
a,
p,
span,
label,
li,
td,
th,
input,
select,
textarea {
  font-family: inherit;
}

/* 4. Re-map Pixio's font-Lufga utility to Outfit */
/*
 * The Pixio theme defines a "Lufga" typeface used via .font-Lufga.
 * We remap it to Outfit so components that still carry the class
 * (Header, Banner2, AmazingSection, SpecialOffer, HeaderClient)
 * render Outfit without needing a JSX change.
 */
.font-Lufga {
  font-family: var(--font-outfit, "Outfit"), system-ui, sans-serif !important;
}

/* 5. CSS custom property used by some theme rules */
:root {
  --font-Lufga: var(--font-outfit, "Outfit"), system-ui, sans-serif;
}