@charset "utf-8";
/* ==========================================================================
   Table of Contents
   ========================================================================== */
/*
-- Abstracts
-- Vendors
-- Base
-- Components
-- Pages
-- Utilities
*/
/* Color Pallete */
/* Fonts */
/* Custom @media queries */
/* @custom-media --viewport-medium (width <= 50rem); */
/* @media screen and (500px <= width <= 1200px) */
/* Generic Padding with Media Quries */
:root{
  --padding: 48px;
}
@media (max-width: 427px) {
:root{
    --padding: 24px;
}
  }
/* :root {
 // Color Pallete
 --blue: #107698;
 --darkBlue: #0A465B;

 --orange: #FDB530;
 --darkOrange: #E09306;

 --grey: #888888;
 --darkGrey: #2A2A2A;
 --border: #E6E6E6;

 --greyBG: #FAFAFA;
 --orangeBg: #FCF9F2;

 --text: rgba(0, 0, 0, .78);
 --textDark: rgba(255, 255, 255, .78);
 --black: #000000;
 --white: #FFFFFF;

 // Fonts
 --fontLight: BrandonText-Light;
 --fontRegular: BrandonText-Regular;
 --fontBold: BrandonText-Bold;
} */
.overflowHidden {
  overflow: hidden;
}
.transition {
  transition: .2s;
}
.transition1 {
  transition: .1s;
}
/* Shadows */
.templateAllShadow {
  box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.090);
}
/*.allShadow {
-moz-box-shadow: 0 0 3px black;
-webkit-box-shadow: 0 0 3px black;
box-shadow: 0 0 5px grey;
}*/
.allShadow {
  box-shadow: 0 0 10px 0px rgba(0, 0, 0, .2);
}
.rightBottomShadow {
  box-shadow: 3px 3px 5px 6px #ccc;
}
.innerShadow1 {
  box-shadow: inset 0 -7px 9px -7px rgba(0, 0, 0, 0.4);
}
.innerShadow2 {
  box-shadow: inset 0px 0px 13px 1px #B1B1B1;
  -webkit-box-shadow: inset 0px 0px 13px 1px #B1B1B1;
  -moz-box-shadow: inset 0px 0px 13px 1px #B1B1B1;
  -o-box-shadow: inset 0px 0px 13px 1px #B1B1B1;
}
.headerInsetShadow {
  box-shadow: inset 0 -8px 8px -8px #696868;
}
.bottomShadow {
  box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, .5);
}
.bottomFixedNavShadow {
  box-shadow: 0px 3px 5px 0px rgba(50, 50, 50, 0.2);
}
.upperShadow {
  box-shadow: 0px -5px 5px 0px rgba(50, 50, 50, 0.5);
}
.textShadow {
  font: 100px Lato Bold;
  text-transform: uppercase;
  color: #313543;
  text-align: center;
  margin-top: 10%;
  margin-bottom: 0px;
  text-shadow: rgba(0, 0, 0, 0.8) 0px -2px 0px, rgba(255, 255, 255, 0.3) 0px 2px 2px;
}
.textShadow1 {
  text-shadow: 1px 1px 15px rgba(0, 0, 0, .6);
}
/* --------------------- PRE LOADER STYLES ---------------------- */
.loaderSubmitContainer {
  position: relative;
  margin: 0 auto 30px;
  height: 50px;
  width: 200px;
}
.loader {
  margin: 0em auto;
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: .3em solid rgba(232, 87, 88, 0.3);
  border-right: .3em solid rgba(232, 87, 88, 0.3);
  border-bottom: .3em solid rgba(232, 87, 88, 0.3);
  border-left: .3em solid #E85758;
  animation: load8 1.1s infinite linear;
  position: absolute;
  left: 87px;
  top: 12px;
}
.loader,
.loader:after {
  border-radius: 50%;
  width: 22px;
  height: 22px;
}
@keyframes load8 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* CSS Document */
/**
 * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
 * http://cssreset.com
 */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
img,
div {
  display: block;
}
body {
  line-height: 1;
  font-family: 'Lato', 'Open Sans', sans-serif;
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
a {
  color: inherit;
  text-decoration: none;
}
a:hover {
  text-decoration: none;
  cursor: pointer;
}
/*---------------------------	Layout Styles	---------------------------*/
html,
body {
  background-color: white;
}
body {
  position: relative;
  width: 100%;
  margin: 0 auto;
  font-family: BrandonText-Regular, 'Lato', 'Open Sans', sans-serif;
  height: 100%;
}
p {
  line-height: 1.4;
  color: #7f969e;
}
@media (max-width: 427px) {
  }
@media (max-width: 427px) {
  }
.v3 h1, .v3 h2, .v3 h3, .v3 h4, .v3 h5, .v3 h6 {
  font-family: BrandonText-Bold;
  color: #0A465B;
  }
.v3 h1 {
    font-size: 44px;
    line-height: calc(44px * 1.4);
  }
@media (max-width: 1023px) {
.v3 h1 {
      font-size: 40px;
      line-height: calc(40px * 1.4);
  }
    }
@media (max-width: 659px) {
.v3 h1 {
      font-size: 32px;
      line-height: calc(32px * 1.4);
  }
    }
@media (max-width: 427px) {
.v3 h1 {
      font-size: 28px;
      line-height: calc(28px * 1.4);
  }
    }
.v3 h2 {
    font-size: 36px;
    line-height: calc(36px * 1.4);
  }
@media (max-width: 1023px) {
.v3 h2 {
      font-size: 32px;
      line-height: calc(32px * 1.4);
  }
    }
@media (max-width: 659px) {
.v3 h2 {
      font-size: 28px;
      line-height: calc(28px * 1.4);
  }
    }
@media (max-width: 427px) {
.v3 h2 {
      font-size: 24px;
      line-height: calc(24px * 1.4);
  }
    }
.v3 h3 {
    font-size: 28px;
    line-height: calc(28px * 1.4);
  }
@media (max-width: 659px) {
.v3 h3 {
      font-size: 24px;
      line-height: calc(24px * 1.4);
  }
    }
@media (max-width: 427px) {
.v3 h3 {
      font-size: 20px;
      line-height: calc(20px * 1.4);
  }
    }
.v3 h4 {
    font-size: 20px;
    line-height: calc(20px * 1.4);
  }
@media (max-width: 1023px) {
.v3 h4 {
      font-size: 18px;
      line-height: calc(18px * 1.4);
  }
    }
@media (max-width: 427px) {
.v3 h4 {
      font-size: 16px;
      line-height: calc(16px * 1.4);
  }
    }
.v3 h5 {
    font-size: 16px;
    line-height: calc(16px * 1.4);
  }
@media (max-width: 427px) {
.v3 h5 {
      font-size: 14px;
      line-height: calc(14px * 1.4);
  }
    }
.v3 h6 {
    font-size: 14px;
    line-height: calc(14px * 1.4);
  }
@media (max-width: 427px) {
.v3 h6 {
      font-size: 12px;
      line-height: calc(12px * 1.4);
  }
    }
.v3 p {
  font-family: BrandonText-Regular;
  color: rgba(0, 0, 0, .78);
  text-align: left;
  display: inline-block;
  }
@media (max-width: 427px) {
.v3 p {
      text-align: center;
  }
    }
/* ==========================================================================
   Filled Button
   ========================================================================== */
/* Animation Border Keyframe */
@keyframes borderAnimation {
   from { background-position: 0 100%; }
   to { background-position: -4px 100%; }
   }
body {
  position: relative;
  background-color: #FAFAFA;
}
/* ==========================================================================
   Page Loader (cinematic branded loading moment)
   ========================================================================== */
#pageLoader {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 9999;
    background: #2A2A2A;
    display: flex;
    align-items: center;
    justify-content: center;
  }
#pageLoader .loaderInner {
      display: flex;
      flex-flow: column;
      align-items: center;
      gap: 24px;
    }
#pageLoader .loaderLogo {
      width: 64px;
      -o-object-fit: contain;
         object-fit: contain;
      animation: logoAppear .7s cubic-bezier(.22,.61,.36,1) forwards,
                 logoBreathe 2.2s cubic-bezier(.22,.61,.36,1) .7s infinite;
    }
#pageLoader .loaderLine {
      width: 0;
      height: 2px;
      background: #FDB530;
      border-radius: 1px;
      animation: lineReveal .6s cubic-bezier(.22,.61,.36,1) .25s forwards;
    }
@keyframes logoAppear {
    from { opacity: 0; filter: blur(6px); transform: scale(.9); }
    to   { opacity: 1; filter: blur(0);  transform: scale(1); }
  }
@keyframes logoBreathe {
    0%, 100% { transform: scale(1); }
    40%, 60%  { transform: scale(1.04); }
  }
@keyframes lineReveal {
    from { width: 0; }
    to   { width: 56px; }
  }
/* ==========================================================================
   Header
   ========================================================================== */
header#pageHeader {
    position: relative;
    z-index: 1;
    background-color: #2A2A2A;
  }
header#pageHeader > div {
      display: flex;
      flex-flow: row wrap;
      justify-content: space-between;
      align-items: center;
      max-width: 1200px;
      margin: 0 auto;
      padding: 16px 0;
    }
header#pageHeader #logo {
      height: 46px;
    }
header#pageHeader .menuIcons {
      display: none;
      transition: all .2s;
      opacity: .78;
      cursor: pointer;
      height: 32px;
    }
header#pageHeader .menuIcons:hover {
        opacity:1
      }
header#pageHeader #mainNav {
      display: flex;
      align-items: center;
      gap: 32px;
    }
header#pageHeader #mainNav a {
        font-family: BrandonText-Bold;
        font-size: 13px;
        line-height: 18px;
        text-transform: uppercase;
        color: #E6E6E6;
        padding: 6px 0px 2px;
        border-radius: 44px;
        transition: all .2s;
      }
header#pageHeader #mainNav a:hover {
          color: #FFFFFF !important;
        }
header#pageHeader #mainNav a.active {
          color: #E6E6E6 !important;
        }
header#pageHeader #mainNav a.active {
          padding: 6px 16px 2px;
          background-color: rgba(252, 249, 242, 0.1);
          border: 1px solid #E09306;
        }
header#pageHeader #mainNav a#blog {
          color: #FDB530;
        }
@media (max-width: 1239px) {
header#pageHeader {
      padding: 0 calc(48px/2);
      padding: 0 calc(var(--padding)/2);
  }
      header#pageHeader > div {
        padding: 16px 0px;
      }
      header#pageHeader #mainNav {
        gap: 24px;
      }
    }
@media (max-width: 1023px) {
      header#pageHeader #menuOpen {
        display: block;
      }
      header#pageHeader #mainNav {
        opacity: 0;
        position: fixed;
        pointer-events: none;
      }
      header#pageHeader #mainNav.open {
        opacity: 1;
        pointer-events: auto;
        top: 78px;
        left: 0;
        width: 100VW;
        height: calc(100VH - 78px);
        background-color: rgba(0,0,0,.78);
        z-index: 1;
        flex-flow: column;
        justify-content: center;
        backdrop-filter: blur(16px);
        gap: 36px;
      }
        header#pageHeader #mainNav.open a {
          font-size: 15px;
        }
          header#pageHeader #mainNav.open a.active {
            padding: 8px 24px 4px;
          }
    }
@media (max-width: 427px) {
header#pageHeader {
      padding-left: 48px;
      padding-left: var(--padding);
      padding-right: 48px;
      padding-right: var(--padding);
  }
      header#pageHeader #logo {
        height: 36px;
      }
      header#pageHeader #mainNav.open {
        top: 68px;
        left: 0;
        width: 100VW;
        height: calc(100VH - 68px);
      }
    }
/* ==========================================================================
   Welcome Section
   ========================================================================== */
#welcomeSection {
    position: relative;
  }
#homeBanner {
    width: 100%;
    height: 464px;
    background-image: url(../site_images/v3/home_banner.jpg);
    background-size: auto 100%;
    background-position: 50% 0;
    position: relative;
    top: -18px;
    display: flex;
    padding-top: 110px;
    justify-content: center;
    gap: 154px;
    box-sizing: border-box;
  }
#homeBanner h1 {
      color: #FFFFFF;
      width: 458px;
      opacity: 0;
      transform: translateX(-40px);
      transition: opacity .55s cubic-bezier(.22,.61,.36,1),
                  transform .55s cubic-bezier(.22,.61,.36,1);
    }
#homeBanner > div {
      opacity: 0;
      transform: translateX(40px);
      transition: opacity .55s cubic-bezier(.22,.61,.36,1) .1s,
                  transform .55s cubic-bezier(.22,.61,.36,1) .1s;
      margin-top: 16px;
      width: 588px;
    }
#homeBanner > div p {
  font-size: 18px;
  line-height: calc(18px * 1.4);
      }
@media (max-width: 427px) {
  #homeBanner > div p {
  font-size: 14px;
  line-height: calc(14px * 1.4);
      }
  }
#homeBanner > div p {
        color: rgba(255, 255, 255, .78);
        margin-bottom: 12px;
        text-align: inherit;
      }
#homeBanner > div a {
        font-size: 14px;
        line-height: calc(14px * 1.4);
        display: inline-block;
        font-family: BrandonText-Bold;
        letter-spacing: 1.25px;
        color: #FFFFFF;
        padding: 6px 0 4px;
        text-transform: uppercase;
        /* border-bottom: 2px dotted $orange; */
        transition: all .3s;
        background-image: repeating-linear-gradient(270deg, #fdb530, #fdb530 2px, transparent 2px, transparent 4px, #fdb530 4px);
        background-size: 100% 2px;
        background-position: 0 100%;
        background-repeat: no-repeat;
        cursor: pointer;
        -webkit-user-select: none;
           -moz-user-select: none;
                user-select: none;
      }
#homeBanner > div a:hover {
       /* transform: translateX(6px); */
       padding-left: 8px;
       /* background-size: calc(100% + 4px) 2px;
       animation: borderAnimation 0.1s infinite linear; */
       background-image: repeating-linear-gradient(270deg, #fdb530, #fdb530 2px, transparent 2px, transparent 2px, #fdb530 2px);
     }
#homeBanner > div a.inActive {
       color: #888888;
       background-image: repeating-linear-gradient(270deg, #888888, #888888 2px, transparent 2px, transparent 4px, #888888 4px);
     }
#homeBanner > div a.inActive:hover {
         padding-left: 0px;
       }
@media (max-width: 427px) {
#homeBanner > div a {
       font-size: calc(14px - 2px);
       line-height: calc(calc(14px - 2px) * 1.4);
      }
     }
@media (max-width: 1239px) {
#homeBanner {
      gap: 48px;
      gap: var(--padding);
      padding-left: 48px;
      padding-left: var(--padding);
      padding-right: 48px;
      padding-right: var(--padding);
  }
      #homeBanner > div {
        width: auto;
        flex: 1 1 0%;
      }
    }
@media (max-width: 1023px) {
#homeBanner {
      gap: 16px;
      flex-flow: column;
      padding-top: 16px;
  }
      #homeBanner h1 {
        width: auto;
        text-align: center;
      }
      #homeBanner > div {
        display: flex;
        flex-flow: column;
        align-items: center;
        text-align: center;
        margin-top: 0px;
        flex: initial;
      }
    }
@media (max-width: 427px) {
      #homeBanner > div p {
        font-size: 16px;
        line-height: calc(16px * 1.4);
      }
    }
#bannerCards {
    position: relative;
    display: flex;
    justify-content: center;
    gap: 56px;
    z-index: 1;
    margin-top: -134px;
  }
#bannerCards .card:nth-child(1) {
        transition: transform .4s cubic-bezier(.22,.61,.36,1) .35s, opacity .4s .35s, top .2s, box-shadow .2s;
      }
#bannerCards .card:nth-child(2) {
        transition: transform .4s cubic-bezier(.22,.61,.36,1) .475s, opacity .4s .475s, top .2s, box-shadow .2s;
      }
#bannerCards .card:nth-child(3) {
        transition: transform .4s cubic-bezier(.22,.61,.36,1) .6s, opacity .4s .6s, top .2s, box-shadow .2s;
      }
#bannerCards .card {
      position: relative;
      top: 0;
      opacity: 0;
      display: block;
      transform: translateY(30px);
      max-width: 360px;
      background-color: #FFFFFF;
      border: 1px solid #E6E6E6;
    }
#bannerCards .card {
  box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.05);
    }
#bannerCards .card {
      border-radius: 24px;
      display: flex;
      flex-flow: column;
      gap: 24px;
      padding: 40px 32px;
      box-sizing: border-box;
    }
#bannerCards .card img {
        width: -moz-fit-content;
        width: fit-content;
      }
#bannerCards .card h4 {
        text-transform: uppercase;
        width: 50%;
      }
#bannerCards .card p {
        min-height: 189px;
      }
#bannerCards .card p {
  font-size: 15px;
  line-height: calc(15px * 1.4);
      }
#bannerCards .card .link {
        font-size: 12px;
        line-height: calc(12px * 1.4);
        font-family: BrandonText-Bold;
        letter-spacing: 1.25px;
        text-transform: uppercase;
        padding: 11px 21px 7px;
        background-color: #FCF9F2;
        border: 3px solid #FDB530;
        border-radius: 50px;
        width: -moz-fit-content;
        width: fit-content;
        transition: all .2s ease-in-out;
        -webkit-user-select: none;
           -moz-user-select: none;
                user-select: none;
      }
#bannerCards .card .link:hover {
       /* transform: translateX(6px); */
       background-color: white;
     }
@media (max-width: 427px) {
#bannerCards .card .link {
        border-width: 2px;
        padding: 10px 18px 6px;
       font-size: calc(12px - 2px);
       line-height: calc(calc(12px - 2px) * 1.4);
      }
     }
#bannerCards .card:hover {
  box-shadow: 0px 40px 80px rgba(0, 0, 0, 0.1);
      }
#bannerCards .card:hover {
        top: -4px !important;
      }
@media (max-width: 1239px) {
#bannerCards {
      gap: calc(48px/2);
      gap: calc(var(--padding)/2);
      padding: 0 calc(48px/3);
      padding: 0 calc(var(--padding)/3);
  }
    }
@media (max-width: 1023px) {
#bannerCards {
      margin-top: 0;
      padding: calc(48px/2) 48px 48px;
      padding: calc(var(--padding)/2) var(--padding) var(--padding);
      flex-flow: column;
      align-items: center;
      z-index: auto;
      z-index: initial;
  }
      #bannerCards .card {
        max-width: none;
        max-width: initial;
      }
        #bannerCards .card p {
          min-height: auto;
        }
    }
@media (max-width: 427px) {
#bannerCards {
      padding-bottom: calc(48px*2);
      padding-bottom: calc(var(--padding)*2);
  }
      #bannerCards .card {
        gap: 16px;
        padding: 36px 28px;
      }
        #bannerCards .card h4 {
          width: auto;
        }
        #bannerCards .card img {
          height: 40px;
        }
        #bannerCards .card p {
  font-size: 14px;
  line-height: calc(14px * 1.4);
        }
        #bannerCards .card p {
          text-align: left;
        }
    }
/* Reveal the entrance animation when the loader finishes */
body.onLoad #homeBanner h1 {
        transform: translateX(0);
        opacity: 1;
      }
body.onLoad #homeBanner > div {
        transform: translateX(0);
        opacity: 1;
      }
body.onLoad #bannerCards .card {
        transform: translateY(0);
        opacity: 1;
      }
/* Users who prefer reduced motion skip the loader and see content instantly */
@media (prefers-reduced-motion: reduce) {
    #pageLoader { display: none; }
    #homeBanner h1,
    #homeBanner > div,
    #bannerCards .card {
      transform: none;
      opacity: 1;
      transition: none;
    }
  }
/* ==========================================================================
    Banner Highlights
   ========================================================================== */
#bannerContainer {
    width: 100%;
    border-top: 1px solid #E6E6E6;
    border-bottom: 1px solid #E6E6E6;
    position: relative;
    background-color: white;
    height: 80px;
    padding: 14px 0;
    margin-top: 96px;
    box-sizing: border-box;
  }
@media (max-width: 1023px) {
#bannerContainer {
      display: none;
  }
    }
#stickyBanner {
    background-color: white;
    width: 100%;
    top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 40px;
    padding: 10px 0;
    backdrop-filter: blur(14px);
    transition: box-shadow 0.3s ease-in-out 0s;
    z-index: 1000;
  }
#stickyBanner div:nth-child(1), #stickyBanner div:nth-child(3) {
      display: flex;
      align-items: center;
      gap: 24px;
    }
#stickyBanner div:nth-child(2) {
      max-height: 30px;
      width: 1px;
      height: 40px;
      background-color: #888888;
    }
#stickyBanner p {
      font-size: 16px;
      line-height: calc(16px * 1.4);
      color: #888888;
      padding: 0 8px;
    }
#stickyBanner a {
      font-size: 12px;
      line-height: calc(12px * 1.4);
      padding: 8px 4px 4px;
      display: inline-block;
      font-family: BrandonText-Bold;
      text-align: center;
      letter-spacing: 1.25px;
      background-color: #107698;
      color: #FFFFFF;
      min-width: 160px;
      border-radius: 20px;
      border-left: 4px solid #FDB530;
      text-transform: uppercase;
      transition: all .2s ease-in-out;
      -webkit-user-select: none;
         -moz-user-select: none;
              user-select: none;
    }
#stickyBanner a:hover {
       background-color: #0A465B;
     }
@media (max-width: 427px) {
#stickyBanner a {
       font-size: calc(12px - 1px);
       line-height: calc(calc(12px - 1px) * 1.4);
    }
     }
#stickyBanner.stickyBanner {
    position: fixed;
    background-color: rgba(255,255,255,.78);
    box-shadow: 0px 12px 24px rgba(0, 0, 0, 0.06);
    border-bottom: 1px solid #FAFAFA;
  }
/* ==========================================================================
   Introduce Ourselves
   ========================================================================== */
#introduceOurselves {
  position: relative;
}
#introduceOurselves .contentContainer {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 55%;
    z-index: 2;
    background: linear-gradient(96.53deg, #FAFAFA 82.27%, rgba(255, 255, 255, 0) 91.72%);
  }
#introduceOurselves .contentContainer .content {
      position: relative;
      top: -44px;
      width: 466px;
    }
#introduceOurselves .contentContainer .content h2 {
        margin-bottom: 16px;
        text-align: left;
        text-align: inherit;
      }
#introduceOurselves .contentContainer .content p {
  font-size: 18px;
  line-height: calc(18px * 1.4);
      }
@media (max-width: 427px) {
  #introduceOurselves .contentContainer .content p {
  font-size: 14px;
  line-height: calc(14px * 1.4);
      }
  }
#introduceOurselves .contentContainer .content p {
        margin-bottom: 20px;
        text-align: inherit;
      }
#introduceOurselves .contentContainer .content a {
        font-size: 13px;
        line-height: calc(13px * 1.4);
        display: inline-block;
        font-family: BrandonText-Bold;
        letter-spacing: 1.25px;
        color: #000000;
        padding: 6px 0 4px;
        text-transform: uppercase;
        /* border-bottom: 2px dotted $orange; */
        transition: all .3s;
        background-image: repeating-linear-gradient(270deg, #fdb530, #fdb530 2px, transparent 2px, transparent 4px, #fdb530 4px);
        background-size: 100% 2px;
        background-position: 0 100%;
        background-repeat: no-repeat;
        cursor: pointer;
        -webkit-user-select: none;
           -moz-user-select: none;
                user-select: none;
      }
#introduceOurselves .contentContainer .content a:hover {
       /* transform: translateX(6px); */
       padding-left: 8px;
       /* background-size: calc(100% + 4px) 2px;
       animation: borderAnimation 0.1s infinite linear; */
       background-image: repeating-linear-gradient(270deg, #fdb530, #fdb530 2px, transparent 2px, transparent 2px, #fdb530 2px);
     }
#introduceOurselves .contentContainer .content a.inActive {
       color: #888888;
       background-image: repeating-linear-gradient(270deg, #888888, #888888 2px, transparent 2px, transparent 4px, #888888 4px);
     }
#introduceOurselves .contentContainer .content a.inActive:hover {
         padding-left: 0px;
       }
@media (max-width: 427px) {
#introduceOurselves .contentContainer .content a {
       font-size: calc(13px - 2px);
       line-height: calc(calc(13px - 2px) * 1.4);
      }
     }
@media (max-width: 1023px) {
#introduceOurselves .contentContainer {
      position: relative;
      width: auto;
      padding: 48px 48px 0;
      padding: var(--padding) var(--padding) 0;
  }
      #introduceOurselves .contentContainer .content {
        top: 0;
        width: auto;
        text-align: center;
      }
    }
#introduceOurselves .cards {
    display: flex;
    gap: 40px;
    overflow-x: scroll;
    padding: 96px 0;
    width: 50%;
    margin-left: auto;
    padding-left: 240px;
  }
#introduceOurselves .cards .card {
      flex: 1 0 280px;
      border: 1px solid #E6E6E6;
      border-radius: 24px;
      width: 280px;
      background-color: #FFFFFF;
      overflow: hidden;
    }
#introduceOurselves .cards .card {
  box-shadow: 0px 12px 24px rgba(0, 0, 0, 0.05);
    }
#introduceOurselves .cards .card {
      text-decoration: none;
      color: inherit;
      transition: transform .2s, box-shadow .2s;
    }
#introduceOurselves .cards .card:hover {
        transform: translateY(-3px);
        box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1);
      }
#introduceOurselves .cards .card:nth-child(1) {
      margin-left: 20px;
    }
#introduceOurselves .cards .card:last-child {
      margin-right: 32px;
    }
#introduceOurselves .cards .content {
      display: flex;
      flex-flow: column;
      width: auto;
      gap: 24px;
      padding: 42px 36px;
    }
#introduceOurselves .cards .content img {
        width: -moz-fit-content;
        width: fit-content;
      }
#introduceOurselves .cards .content p {
  font-size: 14px;
  line-height: calc(14px * 1.4);
      }
#introduceOurselves .cards .content p {
        text-align: left;
      }
#introduceOurselves .cards .footer {
      position: relative;
      text-align: center;
      background-color: #0A465B;
      height: 104px;
      display: flex;
      flex-flow: column;
      justify-content: center;
      align-items: center;
    }
#introduceOurselves .cards .footer img {
        position: absolute;
        top: -36px;
        left: 104px;
        border-radius: 50%;
        width: 72px;
        height: 72px;
        border: 5px solid #FDB530;
        box-sizing: border-box;
      }
#introduceOurselves .cards .footer h5 {
        margin-top: 20px;
        color: #FFFFFF;
      }
#introduceOurselves .cards .footer p {
  font-size: 14px;
  line-height: calc(14px * 1.4);
      }
#introduceOurselves .cards .footer p {
        color: rgba(255, 255, 255, .78);
      }
@media (max-width: 1023px) {
#introduceOurselves .cards {
      width: auto;
      padding-left: 48px;
      padding-left: var(--padding);
      padding-top: 48px;
      padding-top: var(--padding);
  }
      #introduceOurselves .cards .card:nth-child(1) {
        margin-left: 0px;
      }
    }
@media (max-width: 427px) {
#introduceOurselves .cards {
      gap: 48px;
      gap: var(--padding);
      padding-bottom: calc(48px*2);
      padding-bottom: calc(var(--padding)*2);
  }
      #introduceOurselves .cards .content {
        padding: 40px 32px;
      }
    }
/* ==========================================================================
   Work With Us
   ========================================================================== */
#workWithUs {
  background-color: white;
  padding: 96px 0;
  border-top: 1px solid #E6E6E6;
  border-bottom: 1px solid #E6E6E6;
}
@media (max-width: 1023px) {
#workWithUs {
    padding: 96px 48px;
    padding: 96px var(--padding);
}
  }
@media (max-width: 427px) {
#workWithUs {
    padding: calc(48px * 2) 0;
    padding: calc(var(--padding) * 2) 0;
}
  }
#workWithUs #desc {
  display: flex;
  gap: 48px;
  justify-content: center;
  align-items: center;
}
#workWithUs #desc > div {
    height: 50px;
    width: 1px;
    background-color: #888888;
  }
#workWithUs #desc p {
    width: 550px;
  }
#workWithUs #desc p {
  font-size: 18px;
  line-height: calc(18px * 1.4);
  }
@media (max-width: 427px) {
  #workWithUs #desc p {
  font-size: 14px;
  line-height: calc(14px * 1.4);
  }
  }
#workWithUs #desc p {
    text-align: inherit;
  }
@media (max-width: 1023px) {
#workWithUs #desc {
    flex-flow: column;
    gap: 24px;
    text-align: center;
}
    #workWithUs #desc > div {
      display: none;
    }
    #workWithUs #desc p {
      width: auto;
    }
  }
@media (max-width: 427px) {
#workWithUs #desc {
    padding: 0 48px;
    padding: 0 var(--padding);
    gap: 16px;
}
  }
#workWithUs #iconsContainer {
  display: flex;
  gap: 136px;
  justify-content: center;
  margin: 64px 0 16px;
}
@media (max-width: 1023px) {
#workWithUs #iconsContainer {
    gap: 0;
    justify-content: space-evenly;
}
  }
@media (max-width: 427px) {
#workWithUs #iconsContainer {
    margin-top: 32px;
}
  }
#workWithUs #iconsContainer .eachIcon {
  display: flex;
  flex-flow: column;
  align-items: center;
  gap: 14px;
  cursor: pointer;
}
#workWithUs #iconsContainer .eachIcon span {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    width: 76px;
    height: 76px;
    border: 3px solid #E6E6E6;
    background-color: #FCF9F2;
    transition: all .2s;
  }
#workWithUs #iconsContainer .eachIcon span img {
      height: 32px;
    }
#workWithUs #iconsContainer .eachIcon h6 {
    color: #000000;
    text-transform: uppercase;
    text-align: center;
  }
#workWithUs #iconsContainer .eachIcon .activeIndicator {
    position: relative;
    width: 14px;
    height: 14px;
    background-color: #FDB530;
    border-radius: 50%;
    transform: translateY(40px);
    transition: all .2s;
  }
#workWithUs #iconsContainer .eachIcon:hover span {
      background-color: transparent;
      transform: scale(1.08);
    }
#workWithUs #iconsContainer .eachIcon.active .activeIndicator {
      transform: translateY(0px);
    }
#workWithUs #iconsContainer .eachIcon.active span {
      background-color: #FCF9F2;
      border-color: #FDB530;
      transform: scale(1);
    }
@media (max-width: 427px) {
    #workWithUs #iconsContainer .eachIcon span {
      width: 58px;
      height: 58px;
    }
      #workWithUs #iconsContainer .eachIcon span img {
        height: 26px;
      }
    #workWithUs #iconsContainer .eachIcon h6 {
      font-size: 12px;
    }
    #workWithUs #iconsContainer .eachIcon .activeIndicator {
      width: 10px;
      height: 10px;
    }
  }
#workWithUs #contentContainer {
  position: relative;
  background-color: #0A465B;
  width: 800px;
  margin: 0 auto;
  border: 8px solid #E6E6E6;
  border-radius: 48px;
  display: flex;
  flex-flow: column;
  gap: 20px;
  padding: 48px 80px;
  box-sizing: border-box;
}
#workWithUs #contentContainer p {
  font-size: 18px;
  line-height: calc(18px * 1.4);
  }
@media (max-width: 427px) {
  #workWithUs #contentContainer p {
  font-size: 14px;
  line-height: calc(14px * 1.4);
  }
  }
#workWithUs #contentContainer p {
    color: rgba(255, 255, 255, .78);
    text-align: left;
  }
#workWithUs #contentContainer a {
    font-size: 13px;
    line-height: calc(13px * 1.4);
    display: inline-block;
    font-family: BrandonText-Bold;
    letter-spacing: 1.25px;
    color: #FFFFFF;
    padding: 6px 0 4px;
    text-transform: uppercase;
    /* border-bottom: 2px dotted $orange; */
    transition: all .3s;
    background-image: repeating-linear-gradient(270deg, #fdb530, #fdb530 2px, transparent 2px, transparent 4px, #fdb530 4px);
    background-size: 100% 2px;
    background-position: 0 100%;
    background-repeat: no-repeat;
    cursor: pointer;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
  }
#workWithUs #contentContainer a:hover {
       /* transform: translateX(6px); */
       padding-left: 8px;
       /* background-size: calc(100% + 4px) 2px;
       animation: borderAnimation 0.1s infinite linear; */
       background-image: repeating-linear-gradient(270deg, #fdb530, #fdb530 2px, transparent 2px, transparent 2px, #fdb530 2px);
     }
#workWithUs #contentContainer a.inActive {
       color: #888888;
       background-image: repeating-linear-gradient(270deg, #888888, #888888 2px, transparent 2px, transparent 4px, #888888 4px);
     }
#workWithUs #contentContainer a.inActive:hover {
         padding-left: 0px;
       }
@media (max-width: 427px) {
#workWithUs #contentContainer a {
       font-size: calc(13px - 2px);
       line-height: calc(calc(13px - 2px) * 1.4);
  }
     }
#workWithUs #contentContainer a {
    width: -moz-fit-content;
    width: fit-content;
  }
@media (max-width: 1023px) {
#workWithUs #contentContainer {
    width: auto;
    gap: 16px;
    padding: 48px calc(48px*1.4);
    padding: var(--padding) calc(var(--padding)*1.4);
}
  }
/* ==========================================================================
   Testimonials
   ========================================================================== */
#testimonials {
  margin: 96px 0px;
  text-align: center;
}
@media (max-width: 1023px) {
#testimonials {
    margin: 96px 48px;
    margin: 96px var(--padding);
}
  }
@media (max-width: 427px) {
    #testimonials h2 {
      padding: 0 16px;
    }
#testimonials {
    margin: calc(48px*2) calc(48px/3);
    margin: calc(var(--padding)*2) calc(var(--padding)/3);
}
  }
#testimonialContainer {
  position: relative;
  z-index: 1;
  max-width: 786px;
  background-color: white;
  margin: 0 auto;
  border: 1px solid #E6E6E6;
  border-radius: 24px;
  margin-top: 48px;
  overflow: hidden;
}
#testimonialContainer {
  box-shadow: 0px 12px 24px rgba(0, 0, 0, 0.05);
}
#testimonialContainer #testimonialDetails {
    display: flex;
    gap: 36px;
    padding: 36px 48px;
  }
#testimonialContainer #testimonialDetails p {
  font-size: 18px;
  line-height: calc(18px * 1.4);
    }
@media (max-width: 427px) {
  #testimonialContainer #testimonialDetails p {
  font-size: 14px;
  line-height: calc(14px * 1.4);
    }
  }
#testimonialContainer #testimonialDetails p {
      text-align: left;
    }
#testimonialContainer #testimonialDivider {
    background-color: #E6E6E6;
    width: auto;
    height: 8px;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  }
#testimonialContainer #testimonialMeta {
    display: flex;
    gap: 16px;
    justify-content: center;
    align-items: center;
    height: 80px;
    background-color: #0A465B;
  }
#testimonialContainer #testimonialMeta h4 {
      color: #FFFFFF;
    }
#testimonialContainer #testimonialMeta p {
  font-size: 16px;
  line-height: calc(16px * 1.4);
    }
@media (max-width: 427px) {
  #testimonialContainer #testimonialMeta p {
  font-size: 14px;
  line-height: calc(14px * 1.4);
    }
  }
#testimonialContainer #testimonialMeta p {
      color: rgba(255, 255, 255, .78);
    }
@media (max-width: 1023px) {
    #testimonialContainer img {
      display: none;
    }
    #testimonialContainer #testimonialMeta {
      gap: 0px;
      flex-flow: column;
    }
  }
@media (max-width: 427px) {
#testimonialContainer {
      margin-top: 48px;
      margin-top: var(--padding);
}
      #testimonialContainer #testimonialDetails {
        padding: 48px calc(48px*1.4);
        padding: var(--padding) calc(var(--padding)*1.4);
      }
        #testimonialContainer #testimonialMeta h4 {
          font-size: 16px;
          line-height: calc(16px * 1.4);
        }
    }
#clientTestimonialImages {
  display: flex;
  gap: 80px;
  margin-top: 28px;
  transition: all .2s;
  position: relative;
  top: 0px;
  justify-content: center;
}
#clientTestimonialImages img {
    border-radius: 50%;
    border: 6px solid #FFFFFF;
    display: inline-block;
    transition: all .2s;
  }
#clientTestimonialImages img {
  box-shadow: 0px 12px 24px rgba(0, 0, 0, 0.05);
  }
#clientTestimonialImages > div {
    position: relative;
    z-index: 0;
    cursor: pointer;
    transition: all .2s;
  }
#clientTestimonialImages > div:hover {
    transform: scale(1.1);
  }
#clientTestimonialImages > div::before {
    content: '';
    position: relative;
    display: block;
    width: 14px;
    height: 14px;
    margin: 0 auto;
    transform: translateY(-44px);
    border-radius: 100px;
    background-color: #FDB530;
    transition: all .2s;
    z-index: -1;
  }
#clientTestimonialImages .active::before {
    transform: translateY(-14px);
  }
#clientTestimonialImages .active {
    transform: scale(1) !important;
  }
#clientTestimonialImages .active img {
      border-color: #FDB530;
    }
@media (max-width: 1023px) {
#clientTestimonialImages {
    gap: 0;
    justify-content: space-evenly;
}
  }
@media (max-width: 427px) {
    #clientTestimonialImages img {
      height: 40px;
      width: auto;
      border-width: 4px;
    }
    #clientTestimonialImages > div::before {
      width: 10px;
      height: 10px;
    }
  }
/* ==========================================================================
   We Believe
   ========================================================================== */
#weBelieve {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 160px;
  height: 250px;
  margin: 120px 80px;
  border-radius: 24px;
  border-top: 4px solid #FDB530;
  background: url("../site_images/v3/we_believe.png");
  background-size: cover;
  background-position: 0 -1px;
}
#weBelieve h2 {
    color: #FFFFFF;
  }
#weBelieve p {
  font-size: 18px;
  line-height: calc(18px * 1.4);
  }
@media (max-width: 427px) {
  #weBelieve p {
  font-size: 14px;
  line-height: calc(14px * 1.4);
  }
  }
#weBelieve p {
    color: rgba(255, 255, 255, .78);
    max-width: 588px;
  }
@media (max-width: 1239px) {
#weBelieve {
    gap: 0;
    justify-content: space-around;
}
  }
@media (max-width: 1023px) {
#weBelieve {
    height: auto;
    height: initial;
    flex-flow: column;
    justify-content: center;
    gap: 16px;
    margin-left: 48px;
    margin-left: var(--padding);
    margin-right: 48px;
    margin-right: var(--padding);
    padding: 48px;
    padding: var(--padding);
}
    #weBelieve p {
      max-width: none;
      max-width: initial;
    }
  }
@media (max-width: 427px) {
#weBelieve {
    margin-left: calc(48px/3);
    margin-left: calc(var(--padding)/3);
    margin-right: calc(48px/3);
    margin-right: calc(var(--padding)/3);
    margin-top: calc(48px*2.5);
    margin-top: calc(var(--padding)*2.5);
    margin-bottom: calc(48px*2.5);
    margin-bottom: calc(var(--padding)*2.5);
}
  }
/* ==========================================================================
   Trusted By
   ========================================================================== */
#trustedBy {
  text-align: center;
  margin: 72px 0 96px;
}
#trustedBy img {
    margin: 48px auto 0;
  }
@media (max-width: 1023px) {
#trustedBy {
    margin: calc(48px*2) calc(48px/3);
    margin: calc(var(--padding)*2) calc(var(--padding)/3);
}
    #trustedBy img {
      margin-top: 48px;
      margin-top: var(--padding);
      width: 100%;
      box-sizing: border-box;
    }
  }
/* ==========================================================================
   Footer
   ========================================================================== */
footer#pageFooter {
  background-color: #2A2A2A;
  text-align: left;
  padding: 60px 0;
}
footer#pageFooter > section {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #FFFFFF;
  }
footer#pageFooter .descContainer{
    text-transform: uppercase;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
  }
footer#pageFooter .descContainer img {
      height: 52px;
    }
footer#pageFooter .descContainer h5 {
      color: #FFFFFF;
      letter-spacing: 1.25px;
      margin: 8px 0 8px;
    }
footer#pageFooter .descContainer p{
  font-size: 14px;
  line-height: calc(14px * 1.4);
    }
footer#pageFooter .descContainer p{
      color: rgba(255, 255, 255, .78);
    }
footer#pageFooter .links {
    display: flex;
    flex-flow: column;
  }
footer#pageFooter .links a {
      font-family: BrandonText-Bold;
      font-size: 12px;
      color: #FFFFFF;
      line-height: calc(13px * 1.4);
      letter-spacing: 1.25px;
      text-transform: uppercase;
      padding: 3px 0;
      transition: all .2s;
    }
footer#pageFooter .links a:hover {
        color: #FDB530;
      }
footer#pageFooter .socialContainer h6 {
      font-size: 13px;
      line-height: calc(13px * 1.4);
      color: #FFFFFF;
      letter-spacing: 1.25px;
      text-transform: uppercase;
      margin-bottom: 16px;
    }
footer#pageFooter .socialContainer .socialLinks {
      display: flex;
      gap: 16px;
    }
footer#pageFooter .socialContainer .socialLinks a {
        width: 44px;
        height: 44px;
        border-radius: 50%;
        border: 1px solid #FDB530;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: rgba(252, 249, 242,0.1);
        transition: all .2s;
      }
footer#pageFooter .socialContainer .socialLinks a:hover {
          background-color: rgba(252, 249, 242,0);
        }
footer#pageFooter .socialContainer .socialLinks a img {
          width: 16px;
          height: 16px;
        }
@media (max-width: 1023px) {
    footer#pageFooter > section {
      flex-flow: column;
      gap: 24px;
    }
    footer#pageFooter .links {
      display: none;
    }
    footer#pageFooter .socialContainer h6 {
      display: none;
    }
    footer#pageFooter .socialLinks {
      gap: 24px !important;
    }
  }
@media (max-width: 427px) {
footer#pageFooter {
    padding: calc(48px*1.2) calc(48px/2);
    padding: calc(var(--padding)*1.2) calc(var(--padding)/2);
}
      footer#pageFooter .descContainer img {
        height: 36px;
      }
      footer#pageFooter .descContainer p{
        font-size: 12px;
        line-height: calc(12px * 1.4);
      }
    footer#pageFooter .socialLinks a {
      width: 34px !important;
      height: 34px !important;
    }
  }
/* ==========================================================================
   OUR SERVICES
   ========================================================================== */
.pageBanner{
     width: 100%;
     text-align: center;
     padding: 60px 0;
   }
#ourServices .pageBanner {
     background-image: url('../site_images/ourServicesHeader.jpg');
     background-position: center;
   }
#ourServices .pageBanner h1 {
       color: #FFFFFF;
     }
#ourServices #intro {
     padding: 96px 0;
     background-color: #FFFFFF;
     border-bottom: 1px solid #E6E6E6;
   }
#ourServices #intro h2 {
       text-align: center;
       margin-bottom: 24px;
     }
#ourServices #intro p {
       display: block !important;
     }
#ourServices #intro p {
       text-align: center;
       max-width: 900px;
       margin: 0 auto;
     }
@media (max-width: 1023px) {
#ourServices #intro {
        padding: calc(48px*2) 48px;
        padding: calc(var(--padding)*2) var(--padding);
   }
        #ourServices #intro h2 {
          margin-bottom: calc(48px/2);
          margin-bottom: calc(var(--padding)/2);
        }
      }
#ourServices .eachService {
    border-bottom: 1px solid #E6E6E6;
    padding: 96px 0;
 }
#ourServices .eachService .servicesIntro {
      display: flex;
      flex-flow: row wrap;
      gap: 74px;
      justify-content: center;
      margin-bottom: 48px;
    }
#ourServices .eachService .servicesIntro h2 {
        width: 400px;
        font-size: 32px;
        line-height: calc(32px * 1.4);
        text-transform: uppercase;
        text-align: left;
      }
#ourServices .eachService .servicesIntro h2 span {
          font-family: BrandonText-Light;
        }
#ourServices .eachService .servicesIntro p {
        width: 558px;
      }
#ourServices .eachService .servicesIntro p {
  font-size: 16px;
  line-height: calc(16px * 1.4);
      }
@media (max-width: 427px) {
  #ourServices .eachService .servicesIntro p {
  font-size: 14px;
  line-height: calc(14px * 1.4);
      }
  }
#ourServices .eachService .eachServicesContainer {
      max-width: 1032px;
      margin: 0 auto;
      display: flex;
      flex-flow: row wrap;
      justify-content: center;
      gap: 32px;
    }
#ourServices .eachService .eachServicesContainer > div {
        display: flex;
        justify-content: center;
        align-items: center;
        font-family: BrandonText-Bold;
        font-size: 15px;
        line-height: calc(15px * 1.4);
        color: rgba(0, 0, 0, .78);
        letter-spacing: 1.25px;
        text-transform: uppercase;
        text-align: center;
        cursor: pointer;
        border: 2px solid #E09306;
        border-radius: 24px;
        width: 500px;
        height: 112px;
        padding: 0 96px;
        box-sizing: border-box;
        background-color: #FFFFFF;
        transition: all .2s;
      }
#ourServices .eachService .eachServicesContainer > div {
  box-shadow: 0px 12px 24px rgba(0, 0, 0, 0.05);
      }
#ourServices .eachService .eachServicesContainer > div:hover {
          background-color: #FCF9F2;
        }
#ourServices .eachService .eachServicesContainer > div:hover {
  box-shadow: 0px 40px 80px rgba(0, 0, 0, 0.1);
        }
@media (max-width: 1023px) {
#ourServices .eachService {
      padding: calc(48px*2) 48px;
      padding: calc(var(--padding)*2) var(--padding);
 }
      #ourServices .eachService .servicesIntro {
        gap: calc(48px);
        gap: calc(var(--padding));
      }
        #ourServices .eachService .servicesIntro h2 {
         font-size: 28px;
         line-height: calc(28px * 1.4);
         text-align: center;
        }
        #ourServices .eachService .servicesIntro p {
          text-align: center;
        }
        #ourServices .eachService .servicesIntro .order2 {
          order: 2;
        }
        #ourServices .eachService .eachServicesContainer > div {
          width: 100%;
          padding: 0 48px;
          padding: 0 var(--padding);
          font-size: 14px;
          line-height: calc(14px * 1.4);
          height: 96px;
        }
   }
@media (max-width: 427px) {
       #ourServices .eachService .servicesIntro h2 {
        font-size: 22px;
        line-height: calc(22px * 1.4);
       }
     #ourServices .eachService .eachServicesContainer {
       gap: 28px;
     }
       #ourServices .eachService .eachServicesContainer > div {
         font-size: 13px;
         line-height: calc(13px * 1.4);
         height: 80px;
       }
   }
#ourServices #higherEd.eachService {
     border-bottom: 0px;
   }
#ourServices #overlayContainer{
   position: fixed;
   opacity: 0;
   visibility: hidden;
   pointer-events: none;
   top: 0;
   left: 0;
   width: 100vw;
   height: 100vh;
   background: rgba(0,0,0,.60);
   z-index: 10;
   backdrop-filter: blur(16px);
   transition: all .2s;
 }
#ourServices #overlayContainer.active {
     opacity: 1;
     visibility: visible;
     pointer-events: auto;
   }
#overlayContainer #overlayTabs {
     display: flex;
     margin: 80px auto 36px;
     width: -moz-fit-content;
     width: fit-content;
     padding: 7px;
     margin-bottom: 36px;
     background-color: #0A465B;
     border: 2px solid #E09306;
     border-radius: 100px;
   }
#overlayContainer #overlayTabs {
  box-shadow: 0px 12px 24px rgba(0, 0, 0, 0.05);
   }
#overlayContainer #overlayTabs span {
       font-size: 13px;
       line-height: calc(13px * 1.4);
       font-family: BrandonText-Bold;
       text-align: center;
       color: rgba(255, 255, 255, .78);
       padding: 6px 32px 4px;
       border-radius: 100px;
       letter-spacing: 1.25px;
       text-transform: uppercase;
       cursor: pointer;
       transition: all .2s;
     }
#overlayContainer #overlayTabs span:hover {
         color: #FFFFFF;
       }
#overlayContainer #overlayTabs span.active {
         color: #0A465B;
         background-color: #FFFFFF;
         /* box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); */
       }
@media (max-width: 659px) {
#overlayContainer #overlayTabs {
       flex-flow: column;
       border-radius: 20px;
       overflow: hidden;
       padding: 7px 0px;
   }
       #overlayContainer #overlayTabs span {
         border-radius: 0px;
       }
     }
#overlayContainer #overlay {
     position: relative;
     min-height: 400px;
     max-width: 888px;
     margin: 0 auto;
     background-color: #ededed;
     border-radius: 24px;
   }
#overlayContainer #overlay {
  box-shadow: 0px 12px 24px rgba(0, 0, 0, 0.05);
   }
#overlayContainer #overlay header {
       display: flex;
       justify-content: space-between;
       align-items: center;
       padding: 16px 80px;
       background-color: #F5F5F5;
       border-bottom: 1px solid #E6E6E6;
       border-top-left-radius: 24px;
       border-top-right-radius: 24px;
     }
#overlayContainer #overlay header #indicatorContainer {
         display: flex;
         position: relative;
         left: -4px;
       }
#overlayContainer #overlay header #indicatorContainer span {
           width: 16px;
           height: 5px;
           background-color: #888888;
           border-radius: 44px;
           border: 4px solid #F5F5F5;
           transition: all .3s;
           cursor: pointer;
         }
#overlayContainer #overlay header #indicatorContainer span.active {
             width: 36px;
             background-color: #FDB530;
           }
#overlayContainer #overlay header #indicatorContainer span:hover {
             background-color: #E09306;
           }
#overlayContainer #overlay header #prevNext {
         display: flex;
         gap: 24px;
         position: relative;
         left: 24px;
       }
#overlayContainer #overlay header #prevNext > div:nth-of-type(1) {
             text-align: right;
           }
#overlayContainer #overlay header #prevNext > div {
           width: 80px;
         }
#overlayContainer #overlay header #prevNext > div span {
             font-size: 13px;
             line-height: calc(13px * 1.4);
             display: inline-block;
             font-family: BrandonText-Bold;
             letter-spacing: 1.25px;
             color: black;
             padding: 6px 0 4px;
             text-transform: uppercase;
             /* border-bottom: 2px dotted $orange; */
             transition: all .3s;
             background-image: repeating-linear-gradient(270deg, #fdb530, #fdb530 2px, transparent 2px, transparent 4px, #fdb530 4px);
             background-size: 100% 2px;
             background-position: 0 100%;
             background-repeat: no-repeat;
             cursor: pointer;
             -webkit-user-select: none;
                -moz-user-select: none;
                     user-select: none;
           }
#overlayContainer #overlay header #prevNext > div span:hover {
       /* transform: translateX(6px); */
       padding-left: 8px;
       /* background-size: calc(100% + 4px) 2px;
       animation: borderAnimation 0.1s infinite linear; */
       background-image: repeating-linear-gradient(270deg, #fdb530, #fdb530 2px, transparent 2px, transparent 2px, #fdb530 2px);
     }
#overlayContainer #overlay header #prevNext > div span.inActive {
       color: #888888;
       background-image: repeating-linear-gradient(270deg, #888888, #888888 2px, transparent 2px, transparent 4px, #888888 4px);
     }
#overlayContainer #overlay header #prevNext > div span.inActive:hover {
         padding-left: 0px;
       }
@media (max-width: 427px) {
#overlayContainer #overlay header #prevNext > div span {
       font-size: calc(13px - 2px);
       line-height: calc(calc(13px - 2px) * 1.4);
           }
     }
#overlayContainer #overlay header #prevNext > div span {
             transform: translateX(0px) !important;
           }
#overlayContainer #overlay header #prevNext > div span.prev:hover {
               padding-right: 8px;
             }
#overlayContainer #overlay header #prevNext > div span.prev.inActive:hover {
               padding-right: 0px;
             }
#overlayContainer #overlay .content {
       /* transition: all .9s; */
       position: relative;
       left: 0;
       right: 0;
       padding: 44px 80px;
     }
#overlayContainer #overlay .content h3 {
         color: #000000;
         margin-bottom: 16px;
       }
#overlayContainer #overlay .content p {
  font-size: 16px;
  line-height: calc(16px * 1.4);
       }
@media (max-width: 427px) {
  #overlayContainer #overlay .content p {
  font-size: 14px;
  line-height: calc(14px * 1.4);
       }
  }
#overlayContainer #overlay .content p {
         text-align: left;
       }
#overlayContainer #overlay .content.change {
         opacity: 0;
       }
#overlayContainer #overlay #close {
       background-color: #FAFAFA;
       display: flex;
       justify-content: center;
       align-items: center;
       width: 40px;
       height: 40px;
       border-radius: 50px;
       position: absolute;
       top: 10px;
       right: -80px;
       box-shadow: 0px 12px 24px rgba(0, 0, 0, 0.1);
       transition: all .2s;
       cursor: pointer;
     }
#overlayContainer #overlay #close img {
         opacity: .78;
       }
#overlayContainer #overlay #close:hover {
         transform: scale(1.15);
       }
@media (max-width: 1023px) {
#overlayContainer #overlay {
       position: static;
   }
       #overlayContainer #overlay #close {
          top: 0;
          bottom: 0;
          left: 0;
          right: 0;
          margin: auto auto 24px;
       }
     }
@media (max-width: 659px) {
       #overlayContainer #overlay header {
         padding: 16px 48px;
         padding: 16px var(--padding);
       }
       #overlayContainer #overlay .content {
         padding: 48px;
         padding: var(--padding);
       }
     }
/* ==========================================================================
   CONSULTANTS PAGE
   Compact card design matching the provided reference image.
   Tokens come from abstracts/variables.css.
   ========================================================================== */
#consultantsPage {
  background-color: #FAFAFA;
  padding: 64px 0 80px;
  border-bottom: 1px solid #E6E6E6;
}
@media (max-width: 1023px) {
#consultantsPage {
    padding: calc(48px * 1.5) 0;
    padding: calc(var(--padding) * 1.5) 0; /* horizontal padding comes from the grid/search */
}
  }
@media (max-width: 427px) {
#consultantsPage {
    padding: calc(48px * 1.5) 0;
    padding: calc(var(--padding) * 1.5) 0;
}
  }
/* Banner below the header (same pattern as the Our Services page) */
#consultantsBanner {
  background-image: url('../site_images/contactUsHeader.jpg');
  background-position: center;

  h1 {
    color: #FFFFFF;
  }
}
.consultants-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(440px, 1fr));
  grid-gap: 42px;
  gap: 42px;
  max-width: 960px;
  margin: 0 auto;
  padding: 0 48px;
  padding: 0 var(--padding);
}
@media (max-width: 659px) {
.consultants-grid {
    grid-template-columns: 1fr;
    gap: 28px;
}
  }
@media (max-width: 427px) {
.consultants-grid {
    gap: 24px;
    padding: 0 48px;
    padding: 0 var(--padding);
}
  }
/* Shown when a ?consultant=<id> param doesn't match any advisor */
.consultants-empty {
  text-align: center !important;
  display: block !important;
}
.consultants-empty {
  font-family: BrandonText-Regular;
  font-size: 16px;
  color: rgba(0, 0, 0, .78);
  padding: 24px;
}
/* Search no-results state (hidden by default; toggled by the search script).
   ID selector beats the .v3 p rule (inline-block / left) that would otherwise
   force the paragraph visible and left-aligned. */
#consultantsNoResults {
  font-family: BrandonText-Regular;
  font-size: 16px;
  color: rgba(0, 0, 0, .78);
  text-align: center;
  padding: 24px;
  display: none;
}
#consultantsNoResults.search-show {
  display: block;
}
/* Single consultant (?consultant=<id>): keep the card at the normal grid
   width instead of letting auto-fit stretch it across the full container */
.consultants-grid--single {
  grid-template-columns: repeat(auto-fit, minmax(440px, 460px));
  justify-content: center;
}
@media (max-width: 659px) {
.consultants-grid--single {
    grid-template-columns: 1fr;
}
  }
/* Search bar between the banner and the cards */
.consultants-search {
  max-width: 480px;
  margin: 0 auto 40px;
  padding: 0 48px;
  padding: 0 var(--padding);
  position: relative;
}
.consultants-search input {
  width: 100%;
  box-sizing: border-box;
  font-family: BrandonText-Regular;
  font-size: 16px;
  color: rgba(0, 0, 0, .78);
  background: #FFFFFF;
  border: 1px solid #E6E6E6;
  border-radius: 50px;
  padding: 16px 52px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.04);
  transition: border-color .2s, box-shadow .2s;
}
.consultants-search input:focus {
    outline: none;
    border-color: #FDB530;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
  }
.consultants-search input::-moz-placeholder {
    color: #888888;
  }
.consultants-search input::placeholder {
    color: #888888;
  }
.consultants-search .search-icon {
  position: absolute;
  left: calc(48px + 18px);
  left: calc(var(--padding) + 18px);
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  color: #E09306;
  stroke-width: 2;
  pointer-events: none;
}
.consultants-search .search-clear {
  position: absolute;
  right: calc(48px + 14px);
  right: calc(var(--padding) + 14px);
  top: 50%;
  transform: translateY(-50%);
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: none;
  background: #FCF9F2;
  color: #E09306;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  display: none;
  transition: background .2s, color .2s;
}
.consultants-search .search-clear:hover {
    background: #FDB530;
    color: #FFFFFF;
  }
/* Search filter animations */
.consultant-card.search-leave {
  opacity: 0;
  transform: scale(0.96);
  pointer-events: none;
}
.consultant-card.search-enter {
  opacity: 0;
  transform: scale(0.96);
}
.consultant-card.search-hidden {
  display: none;
}
.consultant-card {
  background: #FFFFFF;
  border-radius: 20px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
  border: 1px solid #ececec;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: -moz-fit-content;
  height: fit-content;
  position: relative;
  transition: transform .2s, box-shadow .2s, opacity .2s;
}
.consultant-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1);
  }
/* Featured ribbon badge */
.consultant-badge {
  position: absolute;
  top: 0;
  right: 28px;
  width: 42px;
  height: 56px;
  background: #0A465B;
  border-radius: 0 0 24px 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;

  .icon {
    width: 18px;
    height: 18px;
    color: #FDB530;
  }
}
/* Header: photo + name/title */
.consultant-header {
  display: flex;
  gap: 20px;
  padding: 32px 28px 20px;
  align-items: center;
}
@media (max-width: 427px) {
.consultant-header {
    flex-direction: column;
    text-align: center;
    padding: 28px 24px 20px;
}
  }
.consultant-photo {
  flex: 0 0 84px;
  width: 84px;
  height: 84px;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid #FDB530;
  background: #FCF9F2;

  img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
}
.consultant-info {
  flex: 1;
  display: flex;
  flex-direction: column;

  h2 {
    font-family: BrandonText-Bold;
    font-size: 26px;
    line-height: 1.15;
    color: #0A465B;
    margin-bottom: 6px;
  }
}
@media (max-width: 427px) {
.consultant-info {

  h2 {
      font-size: 24px;
  }
}
    }
.consultant-title {
  font-family: BrandonText-Bold;
  font-size: 11px;
  line-height: 1.3;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #FDB530;
  margin-bottom: 8px;
}
.title-underline {
  display: block;
  width: 38px;
  height: 2px;
  background: #FDB530;
  border-radius: 1px;
}
@media (max-width: 427px) {
.title-underline {
    margin: 0 auto;
}
  }
/* Expertise tags */
.consultant-expertise {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 10px;
  gap: 10px;
  margin: 0;
  padding: 0 28px 28px;
  list-style: none;
}
@media (max-width: 427px) {
.consultant-expertise {
    grid-template-columns: 1fr; /* 2 columns + nowrap overflow on narrow screens */
    padding: 0 24px 24px;
    gap: 8px;
}
  }
.expertise-tag {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: BrandonText-Regular;
  font-size: 13px;
  line-height: 1.3;
  color: rgba(0, 0, 0, .78);
  /*background: $greyBG;*/
  background: #fffdf8;
  border: 1px solid #E6E6E6;
  border-radius: 50px;
  padding: 8px 12px;
  white-space: nowrap;
  transition: border-color .2s;
}
.expertise-tag:hover {
    border-color: #FDB530;
  }
.expertise-tag {

  > span {
      line-height: normal;
  }

  .expertise-icon {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .icon {
    width: 20px;
    height: 20px;
    color: #E09306;
  }
}
/* Credentials section */
.consultant-credentials {
  background: #F4F7F9;
  padding: 28px;
}
@media (max-width: 427px) {
.consultant-credentials {
    padding: 24px;
}
  }
.consultant-credentials {

  h3 {
    font-family: BrandonText-Bold;
    font-size: 11px;
    line-height: 1.3;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #0A465B;
    margin-bottom: 20px;
    position: relative;
    display: inline-block;
  }

    h3::after {
      content: "";
      position: absolute;
      left: calc(100% + 10px);
      top: 50%;
      transform: translateY(-50%);
      width: 18px;
      height: 2px;
      background: #FDB530;
      border-radius: 1px;
    }

  ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  li {
    display: flex;
    align-items: flex-start;
    gap: 14px;
  }
}
.credential-icon {
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #0A465B;
  display: flex;
  align-items: center;
  justify-content: center;

  .icon {
    width: 16px;
    height: 16px;
    color: #FDB530;
  }
}
.credential-text {
  flex: 1;
  font-family: BrandonText-Regular;
  font-size: 14px;
  line-height: 1.45;
  color: rgba(0, 0, 0, .78);
  padding-top: 1px;

  strong {
    font-family: BrandonText-Bold;
    color: #0A465B;
    display: block;
    margin-bottom: 2px;
  }

  span {
    color: rgba(0, 0, 0, .78);
  }
}
/* Overview section */
.consultant-overview {
  padding: 0 28px 20px;
}
@media (max-width: 427px) {
.consultant-overview {
    padding: 0 24px 20px;
}
  }
.consultant-overview {

  h3 {
    font-family: BrandonText-Bold;
    font-size: 11px;
    line-height: 1.3;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #0A465B;
    margin-bottom: 12px;
    position: relative;
    display: inline-block;
  }

    h3::after {
      content: "";
      position: absolute;
      left: calc(100% + 10px);
      top: 50%;
      transform: translateY(-50%);
      width: 18px;
      height: 2px;
      background: #FDB530;
      border-radius: 1px;
    }

  p {
    font-family: BrandonText-Regular;
    font-size: 15px;
    line-height: 1.55;
    color: rgba(0, 0, 0, .78);
    margin: 0;
  }
}
/* Actions footer */
.consultant-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 1px solid #E6E6E6;
}
@media (max-width: 427px) {
.consultant-actions {
    grid-template-columns: 1fr;
}
  }
.consultant-actions .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 12px;
  font-family: BrandonText-Bold;
  font-size: 11px;
  line-height: 1.3;
  letter-spacing: 1.25px;
  text-transform: uppercase;
  text-decoration: none;
  transition: background .2s;
}
.consultant-actions .btn:first-child {
    border-right: 1px solid #E6E6E6;
  }
@media (max-width: 427px) {
.consultant-actions .btn:first-child {
      border-right: none;
      border-bottom: 1px solid #E6E6E6;
  }
    }
.btn-inquire,
.btn-download {
  color: #0A465B;
  background: #FFFFFF;
}
.btn-inquire:hover, .btn-download:hover {
    background: #FCF9F2;
  }
.btn-icon {
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid #E6E6E6;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #FFFFFF;

  .icon {
    width: 18px;
    height: 18px;
    color: #E09306;
  }
}
.btn-arrow {
  color: #E09306;
  font-size: 14px;
  line-height: 1;
  transition: transform .2s;
}
.consultant-actions .btn:hover .btn-arrow {
  transform: translateX(3px);
}
.consultant-card .icon { stroke-width: 1.8; }
/* ===== EXAMPLE STURCTURE=====

sass/
|
|– abstracts/
|   |– _variables.scss    # Sass Variables
|   |– _functions.scss    # Sass Functions
|   |– _mixins.scss       # Sass Mixins
|   |– _placeholders.scss # Sass Placeholders
|
|– base/
|   |– _reset.scss        # Reset/normalize
|   |– _typography.scss   # Typography rules
|   …                     # Etc.
|
|– components/
|   |– _buttons.scss      # Buttons
|   |– _carousel.scss     # Carousel
|   |– _cover.scss        # Cover
|   |– _dropdown.scss     # Dropdown
|   …                     # Etc.
|
|– layout/
|   |– _navigation.scss   # Navigation
|   |– _grid.scss         # Grid system
|   |– _header.scss       # Header
|   |– _footer.scss       # Footer
|   |– _sidebar.scss      # Sidebar
|   |– _forms.scss        # Forms
|   …                     # Etc.
|
|– pages/
|   |– _home.scss         # Home specific styles
|   |– _contact.scss      # Contact specific styles
|   …                     # Etc.
|
|– themes/
|   |– _theme.scss        # Default theme
|   |– _admin.scss        # Admin theme
|   …                     # Etc.
|
|– vendors/
|   |– _bootstrap.scss    # Bootstrap
|   |– _jquery-ui.scss    # jQuery UI
|   …                     # Etc.
|
`– main.scss              # Main Sass file
*/
/* EXAMPLE ORDER */
/*
@import 'abstracts/variables';
@import 'abstracts/functions';
@import 'abstracts/mixins';
@import 'abstracts/placeholders';

@import 'vendors/bootstrap';
@import 'vendors/jquery-ui';

@import 'base/reset';
@import 'base/typography';

@import 'layout/navigation';
@import 'layout/grid';
@import 'layout/header';
@import 'layout/footer';
@import 'layout/sidebar';
@import 'layout/forms';

@import 'components/buttons';
@import 'components/carousel';
@import 'components/cover';
@import 'components/dropdown';

@import 'pages/home';
@import 'pages/contact';

@import 'themes/theme';
@import 'themes/admin';
*/