/**
 * Fluid
 * A responsive function that interpolates between a minimum and maximum value based on the viewport width.
 * The function uses a linear equation to interpolate and clamps the output to stay within the specified range.
 * @function fluid
 * @access public
 * @param {Number} $min-px - The minimum value for the output in pixels.
 * @param {Number} $max-px - The maximum value for the output in pixels.
 * @param {Number} [$breakpoint-min-px: 320] - The minimum viewport width in pixels where the output starts to change.
 * @param {Number} [$breakpoint-max-px: 1660] - The maximum viewport width in pixels where the output stops changing.
 * @return {String} - The interpolated and clamped CSS value.
 * @example
 * // If the viewport width is 320px, the output will be 1.6rem (16px). If the viewport width is 1660px, the output will be 2.4rem (24px).
 * // For viewport widths between 320px and 1660px, the output will linearly interpolate between 1.6rem (16px) and 2.4rem (24px).
 * font-size: fluid(1.6, 2.4);
 * @throws {Error} If $min is not a number, or if $max is not a number, or if $breakpoint-min-px is not a number, or if $breakpoint-max-px is not a number.
*/
/**
 * Fluid
 * A responsive function that interpolates between a minimum and maximum value based on the viewport width.
 * The function uses a linear equation to interpolate and clamps the output to stay within the specified range.
 * @function fluid
 * @access public
 * @param {Number} $min-px - The minimum value for the output in pixels.
 * @param {Number} $max-px - The maximum value for the output in pixels.
 * @param {Number} [$breakpoint-min-px: 320] - The minimum viewport width in pixels where the output starts to change.
 * @param {Number} [$breakpoint-max-px: 1660] - The maximum viewport width in pixels where the output stops changing.
 * @return {String} - The interpolated and clamped CSS value.
 * @example
 * // If the viewport width is 320px, the output will be 1.6rem (16px). If the viewport width is 1660px, the output will be 2.4rem (24px).
 * // For viewport widths between 320px and 1660px, the output will linearly interpolate between 1.6rem (16px) and 2.4rem (24px).
 * font-size: fluid(1.6, 2.4);
 * @throws {Error} If $min is not a number, or if $max is not a number, or if $breakpoint-min-px is not a number, or if $breakpoint-max-px is not a number.
*/
/**
 * @mixin set-typography-vars
 * Sets typography-related CSS custom properties for a given primary prefix and, optionally, a fallback prefix.
 *
 * @param {String} $primary-prefix - The primary prefix used for the custom properties.
 * @param {String} [$fallback-prefix=null] - The optional fallback prefix used for the custom properties.
 * @param {String} [$font-family-default=null] - The default font-family value.
 * @param {String} [$font-size-default=null] - The default font-size value.
 * @param {String} [$line-height-default=null] - The default line-height value.
 * @param {String} [$font-weight-default=null] - The default font-weight value.
 * @param {String} [$text-transform-default=null] - The default text-transform value.
 * @param {String} [$color-default=null] - The default color value.
 * @param {Boolean} [$important=false] - Whether to append !important to the generated CSS declarations.
 */
/**
 * Fluid
 * A responsive function that interpolates between a minimum and maximum value based on the viewport width.
 * The function uses a linear equation to interpolate and clamps the output to stay within the specified range.
 * @function fluid
 * @access public
 * @param {Number} $min-px - The minimum value for the output in pixels.
 * @param {Number} $max-px - The maximum value for the output in pixels.
 * @param {Number} [$breakpoint-min-px: 320] - The minimum viewport width in pixels where the output starts to change.
 * @param {Number} [$breakpoint-max-px: 1660] - The maximum viewport width in pixels where the output stops changing.
 * @return {String} - The interpolated and clamped CSS value.
 * @example
 * // If the viewport width is 320px, the output will be 1.6rem (16px). If the viewport width is 1660px, the output will be 2.4rem (24px).
 * // For viewport widths between 320px and 1660px, the output will linearly interpolate between 1.6rem (16px) and 2.4rem (24px).
 * font-size: fluid(1.6, 2.4);
 * @throws {Error} If $min is not a number, or if $max is not a number, or if $breakpoint-min-px is not a number, or if $breakpoint-max-px is not a number.
*/
/**
 * @mixin set-margin-vars
 * Sets margin-related CSS custom properties for a given prefix and assigns them to the margin property.
 *
 * @param {String} $prefix - The prefix used for the custom properties.
 * @param {*} [$my=null] - The margin value for the top and bottom.
 * @param {*} [$mx=null] - The margin value for the left and right.
 * @param {*} [$mt=null] - The margin value for the top.
 * @param {*} [$mr=null] - The margin value for the right.
 * @param {*} [$mb=null] - The margin value for the bottom.
 * @param {*} [$ml=null] - The margin value for the left.
 * @param {*} [$my-default=0] - The default margin value for the top and bottom.
 * @param {*} [$mx-default=0] - The default margin value for the left and right.
 * @param {*} [$mt-default=0] - The default margin value for the top.
 * @param {*} [$mr-default=0] - The default margin value for the right.
 * @param {*} [$mb-default=0] - The default margin value for the bottom.
 * @param {*} [$ml-default=0] - The default margin value for the left.
 * @param {Boolean} [$important=false] - Whether to append !important to the generated CSS declaration.
 */
/**
* Sets custom padding variables for an element using CSS variables.
* @param {string} $prefix - The prefix to use for the CSS variable names.
* @param {number} [$py=null] - The padding value for top and bottom sides.
* @param {number} [$px=null] - The padding value for left and right sides.
* @param {number} [$pt=null] - The padding value for the top side.
* @param {number} [$pr=null] - The padding value for the right side.
* @param {number} [$pb=null] - The padding value for the bottom side.
* @param {number} [$pl=null] - The padding value for the left side.
* @param {number} [$py-default=0] - The default padding value for top and bottom sides.
* @param {number} [$px-default=0] - The default padding value for left and right sides.
* @param {number} [$pt-default=0] - The default padding value for the top side.
* @param {number} [$pr-default=0] - The default padding value for the right side.
* @param {number} [$pb-default=0] - The default padding value for the bottom side.
* @param {number} [$pl-default=0] - The default padding value for the left side.
* @param {boolean} [$important=false] - Whether to use "!important" modifier for the CSS "padding" property.
*/
/**
 * @mixin set-var
 * Sets a single CSS custom property for a given primary prefix and, optionally, a fallback prefix.
 *
 * @param {String} $property - The CSS property to set.
 * @param {String} $primary-prefix - The primary prefix used for the custom property.
 * @param {String} [$fallback-prefix=null] - The optional fallback prefix used for the custom property.
 * @param {String} [$var-name=null] - The custom property name, if different from the CSS property.
 * @param {*} [$default=null] - The default value for the custom property.
 * @param {Boolean} [$important=false] - Whether to append !important to the generated CSS declaration.
 */
@media only screen and (max-width: 459px) {
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-family: var(--heading-font-family , var(--base-font-family));
    font-size: var(--heading-font-size , var(--base-font-size));
    line-height: var(--heading-line-height , var(--base-line-height));
    font-weight: var(--heading-font-weight , var(--base-font-weight));
    text-transform: var(--heading-text-transform , inherit);
    color: var(--heading-color , var(--base-color));
  }
}

/*# sourceMappingURL=responsive.css.map */