/**
 * * Function to generate color shades.
 *
 * ? This function takes a base color and a step value as parameters and returns a color shade based on the step value.
 * ? If the step value is positive, the function darkens the color by multiplying the step value with 5.
 * ? If the step value is negative, the function lightens the color by multiplying the absolute value of the step with 10.
 *
 * @param {Color} $color - The base color.
 * @param {Number} $step - The step value.
 * @return {Color} - The generated color shade.
 */
/**
 * * Function to create a color map.
 *
 * ? This function takes a base color as a parameter and generates a color map with shades of the base color.
 * ? The color map is created by iterating over a range of values from 1 to 9 and calling the generate-shades function for each value.
 * ? The generated shades are then merged into the color map using the map-merge function.
 *
 * @param {Color} $color - The base color.
 * @return {Map} - The color map with shades of the base color.
 */
/**
 * * Converts pixels to rems.
 *
 * @param {number} $px - The value in pixels.
 * @return {number} The converted value in rems.
 */
/**
 * * Mixin for creating a flex container with customizable properties.
 *
 * @param {string} $direction - The flex direction. Defaults to 'row'.
 * @param {string} $justify - The flex justify content. Defaults to 'flex-start'.
 * @param {string} $align - The flex align items. Defaults to 'flex-start'.
 * @param {string} $wrap - The flex wrap. Defaults to 'nowrap'.
 * @param {number} $colGap - The column gap. Defaults to 0.
 * @param {number} $rowGap - The row gap. Defaults to 0.
 *
 * ? @example Usage:
 * ?  .container {
 * ?    @include d-flex(row, flex-start, flex-start, nowrap, 10px, 20px);
 * ?  }
 */
/**
 * * @mixin container-query
 * * @description A mixin for creating container queries.
 * 
 * @param {String} $containerName - The name of the container.
 * @param {String} $breakpoint - The breakpoint value.
 * @param {String} $condition - The condition for the container query. Default value is 'lt'.
 * 
 * @returns {CSS} The container query styles.
 */
/**
 * * @mixin container-query-between
 * * @description A mixin for creating container queries between two breakpoints.
 * 
 * @param {String} $containerName - The name of the container.
 * @param {String} $minBreakpoint - The minimum breakpoint value.
 * @param {String} $maxBreakpoint - The maximum breakpoint value.
 * 
 * @returns {Mixin} - The container query mixin.
 */
/**
 * * Mixin for applying line clamp to a text element.
 *
 * @param {number} $lines - The number of lines to clamp the text to. Default is 2.
 * @param {string} $fontSize - The font size of the text. Default is clamp(.8rem, 2vw, 1rem).
 * @param {number} $lineHeight - The line height of the text. Default is 1.5.
 * @param {string} $textAlign - The text alignment. Default is center.
 *
 * ? @example Usage:
 * ? .my-text {
 * ?   @include line-clamp(3, 1rem, 1.2, left);
 * ? }
 */
.footer.footer {
  color: var(--footer-color);
  padding-block: 0;
  container: footer/inline-size;
  font-size: var(--fs-normal);
}
@container footer ( width <= 78.125rem ) {
  .footer.footer .section__inner {
    padding-inline: var(--spacing-sm);
  }
}
.footer.footer p {
  margin-bottom: var(--spacing-xs);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.footer.footer a {
  color: var(--gray-color-800);
  -webkit-transition: color 150ms ease-in-out;
  transition: color 150ms ease-in-out;
}
.footer.footer a:hover {
  color: var(--primary-color-500);
}
.footer .gpw-logo {
  margin-bottom: var(--spacing-lg);
  width: min(15.625rem, 100%);
}
.footer__title {
  font-size: var(--fs-md);
  color: var(--heading-color);
  margin-bottom: var(--spacing-md);
}
.footer__menu-list {
  list-style: none;
}
.footer__menu-item {
  margin-bottom: var(--spacing-xs);
}
.footer__main {
  padding-block: var(--spacing-xl);
  background-color: var(--gray-color-50);
}
.footer__main .section__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: var(--spacing-lg) var(--spacing-2xl);
}
@container footer ( width > 53.125rem ) {
  .footer__main .section__inner {
    grid-template-columns: repeat(3, -webkit-max-content);
    grid-template-columns: repeat(3, max-content);
  }
}
.footer__company-info {
  max-width: 30rem;
}
.footer__bottom {
  background-color: var(--gray-color-100);
  padding-block: var(--spacing-sm);
}
/*# sourceMappingURL=gpw-footer.min.css.map */