/* ===================================================================================
 *
 * @project        calebzahnd
 * @author         Caleb Zahnd <caleb@zahndfamily.com>
 * @build          Fri, Jun 26, 2026 1:24 AM CST
 * @release        5a9aa2ff21e9fab89c458d88f4816b9546048119 [Detached: 5a9aa2ff21e9fab89c458d88f4816b9546048119]
 * @copyright      Copyright (c) 2026, Caleb Zahnd
 *
 *  Do not edit this file! This file is machine-generated and constantly overwritten.
 *  Any changes you make will be overwritten the next time the /src is compiled.
 *  Edit the /src files to make edits and updates.
 *
 * =================================================================================== */
/**
 * Block: Project Cards
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
/**
 * Necessary dependencies for the Block scss stylesheets. This file is imported into each of the builds for Block scss.
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
/*-----------*/
/* Variables
/*-----------*/
@import url("https://fonts.googleapis.com/css2?family=Afacad+Flux:wght@100..1000&family=Cardo:ital,wght@0,400;0,700;1,400&display=swap");
/*********/
/* Sass Functions
/*********/
/**
 * Function for calling values out of the global config map
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
/**
 * rem() function to convert px to rem
 * Usage: font-size(16px);
 * Function returns: 1.6rem;
*/
/**
 * Mixin for return the defined max-width for blog elements
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
/**
 * Grid Mixin: block()
 *
 * Defines the base container for a page block
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
/**
 * Mixin: block()
 *
 * Creates a full-browser-width container when you are inside a limited-width parent, eg, inside of @mixin container().
 * This is somewhat unnecessary, since all components start inside a 100vw block. However, it can be helpful if you
 * need to create a full width component that is inside a .container parent.
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
/**
 * Grid Mixin: container()
 *
 * Creates a container for a page block that is 100% of the $global-width defined in variables.scss
 *
 * @author  Caleb Zahnd
 * @package CalebZahnd.com
 */
/**
 * Grid Mixin: gutters()
 *
 * Creates left/right gutters on an element. Primarily used on span() elements, but can be utilized anywhere.
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
/**
 * Grid Mixin: pull()
 *
 * Pulls an item left using negative margins, based on 12-column grid
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
/**
 * Grid Mixin: push()
 *
 * Pushes an item right using positive margins, based on 12-column grid
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
/**
 * Grid Mixin: span()
 *
 * Creates a container of a defined % width, based on a 12 column grid
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
.span-1 {
  width: 8.3333333333%;
}

.span-2 {
  width: 16.6666666667%;
}

.span-3 {
  width: 25%;
}

.span-4 {
  width: 33.3333333333%;
}

.span-5 {
  width: 41.6666666667%;
}

.span-6 {
  width: 50%;
}

.span-7 {
  width: 58.3333333333%;
}

.span-8 {
  width: 66.6666666667%;
}

.span-9 {
  width: 75%;
}

.span-10 {
  width: 83.3333333333%;
}

.span-11 {
  width: 91.6666666667%;
}

.span-12 {
  width: 100%;
}

/**
 * Mixin for writing styles that only display in the block editor
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
/**
 * Mixin for display a brick pseuduo element. A brick is the little horizontal line under headlines.
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
/**
 * Mixin: Eyebrow
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
/**
 * Function and Mixin for getting colors from the $color array
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
/**
 * Mixin for preventing </> from actually breaking the line. Used in the Hero Mosaic block to prevent line breaks on mobile.
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
/**
 * Mixin for applying background shade to an element
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
/**
 * Mixin: Underscore
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
/**
 * Mixin: z-index($level, $important)
 *
 * Uses the Sass-Map defined in partials/variables.scss to load a named z-index level. If an integer is passed, that integer is used as the z-index level.
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
/**
 * Mixin for return the defined max-width for blog elements
 *
 * @author  Caleb Zahnd <caleb@zahndfamily.com>
 * @package CalebZahnd.com
 */
@font-face {
  font-family: "iconfont";
  src: url("../../assets/media/fonts/iconfont/iconfont.eot?kt96ni");
  src: url("../../assets/media/fonts/iconfont/iconfont.eot?kt96ni#iefix") format("eot"), url("../../assets/media/fonts/iconfont/iconfont.woff2?kt96ni") format("woff2"), url("../../assets/media/fonts/iconfont/iconfont.woff?kt96ni") format("woff"), url("../../assets/media/fonts/iconfont/iconfont.ttf?kt96ni") format("truetype"), url("../../assets/media/fonts/iconfont/iconfont.svg?kt96ni#iconfont") format("svg");
  font-weight: normal;
  font-style: normal;
}
.icon-account::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea01";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-arrow-down-long::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea02";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-arrow-down::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea03";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-arrow-left-long::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea04";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-arrow-left::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea05";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-arrow-right-long::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea06";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-arrow-right::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea07";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-arrow-up-long::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea08";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-arrow-up::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea09";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-bell::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea0a";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-browser::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea0b";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-calendar::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea0c";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-caret-down::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea0d";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-caret-left::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea0e";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-caret-right::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea0f";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-caret-up::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea10";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-chat::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea11";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-check::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea12";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-checkbox-empty::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea13";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-checkbox::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea14";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-chevron-down::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea15";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-chevron-left::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea16";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-chevron-right::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea17";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-chevron-up::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea18";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-circle::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea19";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-clock::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea1a";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-close-white::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea1b";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-close::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea1c";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-compose::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea1d";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-document::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea1e";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-download::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea1f";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-email-alt::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea20";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-email::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea21";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-facebook::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea22";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-home::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea23";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-info-alert::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea24";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-info::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea25";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-instagram::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea26";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-learn-alert::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea27";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-lightbulb::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea28";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-linkedin::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea29";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-loan::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea2a";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-location::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea2b";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-lock::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea2c";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-midcoast::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea2d";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-minus::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea2e";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-person::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea2f";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-phone::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea30";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-pinterest::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea31";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-play-circle::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea32";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-play::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea33";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-plus::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea34";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-quote::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea35";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-reset::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea36";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-scroll-down::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea37";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-search::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea38";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-snapchat::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea39";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-star-half::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea3a";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-star::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea3b";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-three-dots::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea3c";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-tiktok::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea3d";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-twitter::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea3e";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-video::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea3f";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-vimeo::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea40";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-website::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea41";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-yelp::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea42";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-youtube::before {
  font-family: "iconfont";
  speak: none;
  font-style: normal;
  font-weight: 100;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\ea43";
  font-size: 15px;
  color: inherit;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.bl-project-cards--grid .bl-project-cards__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 2.8rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
@media (max-width: 1199px) {
  .bl-project-cards--grid .bl-project-cards__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 991px) {
  .bl-project-cards--grid .bl-project-cards__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 767px) {
  .bl-project-cards--grid .bl-project-cards__grid {
    grid-template-columns: 1fr;
  }
}
.bl-project-cards--grid .bl-project-cards__grid__item {
  display: flex;
  flex-direction: column;
}
.bl-project-cards--grid .bl-project-cards__grid__item .project-card {
  flex: 1;
}
@media (max-width: 1599px) {
  .bl-project-cards--slider > .container {
    padding: 0;
  }
}
.bl-project-cards--slider .splide {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto;
}
.bl-project-cards--slider .splide__track {
  grid-area: 1/1;
}
.bl-project-cards--slider .splide__pagination {
  grid-area: 2/1;
  margin-top: 0;
  gap: 8px;
}
.bl-project-cards--slider .splide__pagination__page {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #40403F;
  opacity: 1;
  transition: background-color 0.2s ease;
}
.bl-project-cards--slider .splide__pagination__page.is-active {
  background-color: #c23725;
  transform: none;
}
.bl-project-cards--slider .splide__arrows {
  grid-area: 1/1;
  align-self: start;
  position: relative;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  pointer-events: none;
  aspect-ratio: 1/1;
}
@media (min-width: 544px) {
  .bl-project-cards--slider .splide__arrows {
    aspect-ratio: 2/1;
  }
}
@media (min-width: 768px) {
  .bl-project-cards--slider .splide__arrows {
    aspect-ratio: 3/1;
  }
}
@media (min-width: 1200px) {
  .bl-project-cards--slider .splide__arrows {
    aspect-ratio: 4/1;
  }
}
.bl-project-cards--slider .splide__arrow {
  position: static !important;
  transform: none !important;
  pointer-events: all;
  background-color: #232325;
  border: none;
  border-radius: 0;
  width: 4.8rem;
  height: 4.8rem;
  opacity: 1;
  transition: background-color 0.2s ease;
}
.bl-project-cards--slider .splide__arrow svg {
  fill: #FFFFFF;
  width: 1.4rem;
  height: 1.4rem;
}
.bl-project-cards--slider .splide__arrow:hover {
  background-color: #c23725;
  opacity: 1;
}
.bl-project-cards--slider .splide__arrow--prev {
  transform: scaleX(-1) !important;
}
/*# sourceMappingURL=bl-project-cards.css.map */